/* =========================================================
   IIM SAMBALPUR - ACCESSIBILITY TEXT / PAGE SCALE CONTROLS
   A+ / A / A-
   ========================================================= */

:root{
    --iimsbp-access-scale:1;
}


/*
 * The project uses many legacy pixel-based font sizes.
 * CSS zoom is therefore used as the accessibility scale so those
 * fixed-size labels also become larger/smaller consistently.
 */
body.iimsbp-accessibility-scaled{
    zoom:var(--iimsbp-access-scale);
}


/*
 * Keep the accessibility control itself clean and easy to operate.
 */
#iimsbp-h11-header .iimsbp-access-font-controls{
    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:6px;
}

#iimsbp-h11-header .iimsbp-access-font-controls button{
    min-width:0;
    height:33px;

    padding:0 7px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid #d8e0e5;
    border-radius:4px;

    background:#f5f7f8;
    color:#173149;

    cursor:pointer;

    font-family:Arial,Helvetica,sans-serif;

    font-size:12px;
    line-height:1;

    font-weight:800;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease,
        transform .18s ease;
}

#iimsbp-h11-header .iimsbp-access-font-controls button:hover{
    border-color:#008491;

    background:#e9f5f5;
    color:#006b75;

    transform:translateY(-1px);
}

#iimsbp-h11-header .iimsbp-access-font-controls button:focus-visible{
    outline:3px solid rgba(0,132,145,.25);
    outline-offset:2px;
}


/* Current scale indicator */
#iimsbp-h11-header .iimsbp-access-font-status{
    margin-top:7px;
    padding:6px 8px;

    border:1px solid #e1e7ea;
    border-radius:4px;

    background:#fafcfc;
    color:#687983;

    font-family:Arial,Helvetica,sans-serif;

    font-size:9px;
    line-height:1.2;

    font-weight:700;

    text-align:center;
}


/*
 * Visual active state for the reset button when size is 100%.
 * JS toggles data-current-scale on the accessibility box.
 */
#iimsbp-h11-header
.iimsbp-h11-access-box[data-current-scale="100"]
#iimsbpFontReset{
    border-color:#008491;

    background:#008491;
    color:#fff;
}


/*
 * Do not animate layout while accessibility scaling is being changed.
 * This avoids a distracting double movement on large pages.
 */
html.iimsbp-accessibility-changing *,
html.iimsbp-accessibility-changing *:before,
html.iimsbp-accessibility-changing *:after{
    transition-duration:0s!important;
}


/*
 * If a browser does not support CSS zoom, accessibility.js applies
 * a transform fallback and this class maintains the correct page width.
 */
body.iimsbp-accessibility-transform-fallback{
    transform-origin:top left;
}


/* Mobile control spacing */
@media(max-width:700px){

    #iimsbp-h11-header .iimsbp-h11-access-box{
        width:178px;
    }

    #iimsbp-h11-header .iimsbp-access-font-controls button{
        height:35px;
    }
}


/* User requested reduced motion */
@media(prefers-reduced-motion:reduce){

    #iimsbp-h11-header .iimsbp-access-font-controls button{
        transition:none!important;
    }
}
