/**
 * Styles for the QC plugin
 */

/* + + + + +  slideout output  + + + + + */
.qc-output {
    position: relative;
    min-width: 100%;
    width: auto;
    background-color: @ini_background !important;
    font-size: 90%;
    box-shadow: @box-shadow-bottom;
    border-bottom: solid 1px @ini_border_light;
    margin-bottom: 0;
    padding-top: 0 !important; // for JS overwrite

    @media @screen_min-xxs {
        margin-right: -(@margin-default);
        margin-left: -(@margin-default);
        padding-left: @margin-default;
        padding-right: @margin-default;
    }

    @media @screen_min-md {
        top: -(@margin-small);
    }

    @media @screen_max-md {
        top: 0;
        margin-top: -(@page_padding-top + 2);
        margin-right: -(@margin-default * 1.6);
        margin-left: -(@margin-default);
        padding-top: @margin-default;
    }

    @media @screen_max-xxs {
        margin-left: -(@margin-small);
        padding-left: @margin-small;
        padding-right: @margin-default;
    }

    h1 {
        @media @screen_min-md {
            padding-top: 0;
        }
    }

    h2 {
        font-size: 1.3rem;
    }

    h3 {
         font-size: 1.1rem;
    }

    h4,
    h5,
    h6 {
        font-size: 1rem;
    }

    div,
    p {
        margin-left: 0;
    }

    dl {
        dt,
        dd {
            padding-bottom: @small-spacing;

            @media @screen_max-xxs {
                float: none;
                display: inline-block;
                width: 49%;
                max-width: 10em;
                vertical-align: top;
                margin-left: 0;
            }
        }
    }

    .qc_icon {
        background-color: #fff;
        border-radius: @fix_border-radius;
        vertical-align: top;
        padding: .1rem;
    }
}

/* + + + + +  admin settings  + + + + + */
.do-admin #dokuwiki__content {
    #plugin__qc_admin {
        table .centeralign {
            .qc_icon svg + span {
                min-width: 2em;
                padding-left: .2em;
                text-align: left;
                display: inline-block;
            }
        }
    }
}
