/*
 * Student portal sign-in
 * A single responsive cascade. This file is loaded last on index.php so the
 * historical student-module login rules cannot change the composition.
 */

html:has(body.student-login-page),
body.student-login-page{
    min-height:100%;
}

body.student-login-page{
    min-height:100svh!important;
    margin:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    color:#102a43!important;
    background:
        linear-gradient(112deg,rgba(1,37,27,.94),rgba(2,91,59,.74) 46%,rgba(5,57,51,.38)),
        var(--student-login-bg-image) center/cover fixed no-repeat!important;
}

body.student-login-page::before,
body.student-login-page::after{display:none!important}

body.student-login-page .portal-breadcrumbs,
body.student-login-page .portal-skip-link,
body.student-login-page .student-nav{display:none!important}

body.student-login-page .login-command-shell{
    position:relative;
    isolation:isolate;
    width:100%!important;
    max-width:1480px;
    height:auto!important;
    min-height:100svh!important;
    margin:0 auto!important;
    padding:clamp(1rem,3vw,2.5rem) clamp(1rem,3vw,2.5rem) 6.25rem!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    gap:clamp(1rem,2.6vw,2.25rem)!important;
    box-sizing:border-box;
}

body.student-login-page .login-command-brandbar{
    display:flex!important;
    align-items:center;
    grid-row:auto!important;
    min-height:3.75rem!important;
    margin:0!important;
    padding:0!important;
}

body.student-login-page .login-command-brand{
    display:inline-flex;
    align-items:center;
    min-width:0;
    gap:.8rem;
    color:#fff!important;
    text-decoration:none;
    text-shadow:0 2px 14px rgba(0,0,0,.24);
}

body.student-login-page .login-command-brand img{
    width:3.6rem!important;
    height:3.6rem!important;
    flex:0 0 3.6rem;
    padding:.35rem;
    border:2px solid rgba(255,255,255,.9);
    border-radius:1rem;
    background:#fff;
    object-fit:contain;
    box-shadow:0 12px 28px rgba(0,0,0,.2);
}

body.student-login-page .login-command-brand span{
    display:grid;
    flex:1 1 auto;
    min-width:0;
    gap:.18rem;
}

body.student-login-page .login-command-brand strong{
    max-width:none!important;
    overflow:visible!important;
    color:#fff!important;
    font-size:clamp(.9rem,1.7vw,1.35rem)!important;
    font-weight:900;
    letter-spacing:.02em;
    line-height:1.2;
    text-overflow:clip!important;
    white-space:normal;
}

body.student-login-page .login-command-brand small{
    display:block!important;
    overflow:visible!important;
    color:#d5f7e2!important;
    font-size:.72rem;
    font-weight:700;
}

body.student-login-page .login-command-grid{
    grid-row:auto!important;
    width:100%;
    max-width:1340px;
    min-width:0;
    margin:0 auto;
    display:grid!important;
    grid-template-columns:minmax(0,1.15fr) minmax(20rem,.85fr)!important;
    align-items:stretch;
    gap:clamp(1rem,3vw,3rem);
}

body.student-login-page .login-command-story,
body.student-login-page .login-command-panel{
    min-width:0;
    box-sizing:border-box;
    border-radius:1.5rem!important;
}

body.student-login-page .login-command-story{
    position:relative;
    isolation:isolate;
    min-height:clamp(34rem,68vh,48rem)!important;
    overflow:hidden;
    padding:clamp(1.5rem,4vw,4rem)!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(10rem,36%)!important;
    grid-template-rows:auto minmax(0,1fr) auto;
    align-content:space-between;
    gap:1rem;
    color:#fff!important;
    background:
        linear-gradient(135deg,rgba(1,43,29,.95),rgba(0,100,63,.66)),
        var(--student-login-bg-image) center/cover no-repeat;
    box-shadow:0 2rem 4rem rgba(1,32,22,.28);
}

body.student-login-page .login-command-story::before{
    content:"";
    position:absolute;
    z-index:-1;
    width:24rem;
    height:24rem;
    top:-14rem;
    right:-7rem;
    border:1px solid rgba(190,255,216,.22);
    border-radius:50%;
    box-shadow:0 0 0 2rem rgba(161,255,205,.06),0 0 0 4rem rgba(161,255,205,.035);
}

body.student-login-page .login-command-story-copy{
    position:relative;
    z-index:3;
    grid-column:1;
    max-width:38rem;
}

body.student-login-page .login-command-story-copy h1{
    max-width:13ch;
    margin:.4rem 0 0;
    color:#fff!important;
    font-size:clamp(2.35rem,5vw,5rem)!important;
    font-weight:850;
    letter-spacing:-.065em;
    line-height:.99;
    text-shadow:0 3px 22px rgba(0,24,16,.35);
}

body.student-login-page .login-command-story-copy>p:not(.login-command-eyebrow){
    max-width:31rem;
    margin:.95rem 0 0;
    color:#eafff1!important;
    font-size:clamp(.9rem,1.2vw,1.08rem);
    line-height:1.6;
}

body.student-login-page .login-command-students{
    position:absolute!important;
    z-index:1;
    right:-1rem;
    bottom:0;
    display:block!important;
    width:min(45%,36rem)!important;
    max-width:none!important;
    max-height:78%!important;
    margin:0!important;
    object-fit:contain;
    object-position:bottom right;
    opacity:.98;
    filter:drop-shadow(0 1.4rem 1.8rem rgba(0,0,0,.23));
    pointer-events:none;
}

body.student-login-page .login-command-benefits{
    grid-column:1;
    align-self:end;
    width:100%;
    max-width:31rem;
    margin:0!important;
    padding:0;
    display:grid!important;
    gap:.55rem;
    list-style:none;
}

body.student-login-page .login-command-benefits li{
    display:grid;
    grid-template-columns:2.2rem minmax(0,1fr);
    align-items:center;
    gap:.6rem;
    min-width:0;
    padding:.6rem;
    border:1px solid rgba(220,255,232,.28);
    border-radius:.75rem;
    background:rgba(0,39,26,.42);
    backdrop-filter:blur(8px);
}

body.student-login-page .login-command-benefits strong,
body.student-login-page .login-command-story-note strong{color:#fff!important;font-size:.72rem;font-weight:850}
body.student-login-page .login-command-benefits small,
body.student-login-page .login-command-story-note small{color:#d8f9e4!important;font-size:.63rem;line-height:1.35}

body.student-login-page .login-command-benefit-icon,
body.student-login-page .login-command-note-icon{
    display:grid;
    place-items:center;
    width:2.2rem;
    height:2.2rem;
    border:1px solid rgba(227,255,236,.24);
    border-radius:.65rem;
    background:rgba(231,255,239,.14);
    color:#d7ffe2;
}

body.student-login-page .login-command-story-note{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:1.9rem minmax(0,1fr);
    align-items:center;
    gap:.5rem;
    max-width:29rem;
    padding-top:.8rem;
    border-top:1px solid rgba(228,255,236,.2);
}

body.student-login-page .login-command-note-icon{width:1.9rem;height:1.9rem}

body.student-login-page .login-command-panel{
    align-self:center;
    width:100%;
    max-width:35rem;
    margin-left:auto;
    padding:clamp(1.5rem,4vw,3.2rem)!important;
    background:rgba(255,255,255,.98)!important;
    border:1px solid rgba(255,255,255,.86);
    box-shadow:0 2rem 4rem rgba(3,40,28,.22);
}

body.student-login-page .login-command-panel-mark{
    display:grid;
    place-items:center;
    width:3.2rem!important;
    height:3.2rem!important;
    margin-bottom:.85rem;
    border-radius:1rem;
    background:linear-gradient(145deg,#e6faed,#c9f1d7);
    color:#087f50;
}

body.student-login-page .login-command-panel-head{margin-bottom:1.2rem}

body.student-login-page .login-command-panel h2{
    margin:.35rem 0 0;
    color:#102a43!important;
    font-size:clamp(1.8rem,3.4vw,2.8rem)!important;
    letter-spacing:-.05em;
    line-height:1.08;
}

body.student-login-page .login-command-panel-head>p:last-child{
    max-width:28rem;
    margin:.6rem 0 0;
    color:#637789!important;
    font-size:.86rem;
    line-height:1.55;
}

body.student-login-page .login-command-form{
    display:grid!important;
    gap:1rem;
}

body.student-login-page .login-command-field{display:grid;gap:.4rem}
body.student-login-page .login-command-field label{color:#29465a!important;font-size:.74rem;font-weight:850}
body.student-login-page .login-command-label-row,
body.student-login-page .login-command-form-meta{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
body.student-login-page .login-command-label-row a,
body.student-login-page .login-command-form-meta a,
body.student-login-page .login-command-support a{color:#087f50!important;font-weight:850}

body.student-login-page .login-command-input{position:relative;display:flex;align-items:center}
body.student-login-page .login-command-input>i{position:absolute;left:.85rem;z-index:1;color:#087f50;pointer-events:none}
body.student-login-page .login-command-input input{
    width:100%;
    min-height:3.25rem!important;
    padding:.78rem 2.8rem .78rem 2.65rem!important;
    border:1px solid #c7d7e2!important;
    border-radius:.85rem!important;
    background:#fbfdff!important;
    color:#102a43!important;
    font-size:.9rem;
    outline:0;
}
body.student-login-page .login-command-input input:focus{border-color:#0f8a5c!important;box-shadow:0 0 0 .25rem rgba(15,138,92,.14)!important}
body.student-login-page .login-command-password-toggle{position:absolute;right:.4rem;display:grid;place-items:center;width:2.25rem;height:2.25rem;border:1px solid #c9e1d2;border-radius:.6rem;background:#effaf1;color:#08743f}
body.student-login-page .login-command-submit{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:3.25rem;border:0;border-radius:.85rem;background:linear-gradient(135deg,#087f50,#21b44e);color:#fff;font-size:.9rem;font-weight:900;box-shadow:0 12px 24px rgba(8,127,80,.22)}
body.student-login-page .login-command-form-meta span{color:#657b89;font-size:.7rem}
body.student-login-page .login-command-support{margin:1rem 0 0;padding-top:.9rem;border-top:1px solid #e1eaf0;color:#6a7d8c;font-size:.7rem;line-height:1.5}

body.student-login-page .login-command-footer{
    position:fixed!important;
    z-index:1100!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:100%!important;
    min-height:3.75rem!important;
    margin:0!important;
    padding:.7rem max(1rem,calc((100vw - 1340px)/2))!important;
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    box-sizing:border-box;
    grid-row:auto!important;
    border-top:1px solid rgba(187,247,208,.3);
    background:rgba(2,44,34,.95);
    box-shadow:0 -1rem 2.5rem rgba(1,32,22,.24);
    backdrop-filter:blur(16px);
    color:#e5ffed;
    font-size:.7rem;
}
body.student-login-page .login-command-footer i{color:#a7f3c5}
body.student-login-page .login-command-shell a:focus-visible,
body.student-login-page .login-command-shell button:focus-visible,
body.student-login-page .login-command-shell input:focus-visible{outline:3px solid #9df5bd;outline-offset:3px}

@media(max-width:980px){
    body.student-login-page{background-attachment:scroll!important}
    body.student-login-page .login-command-shell{padding:1rem 1rem 6rem!important;gap:1rem!important}
    body.student-login-page .login-command-grid{grid-template-columns:1fr!important;max-width:54rem}
    body.student-login-page .login-command-story{min-height:34rem!important}
    body.student-login-page .login-command-panel{max-width:none;margin:0}
}

@media(max-width:640px){
    body.student-login-page .login-command-shell{padding:.75rem .75rem 5.6rem!important}
    body.student-login-page .login-command-brand img{width:2.8rem!important;height:2.8rem!important;flex-basis:2.8rem}
    body.student-login-page .login-command-brand strong{font-size:.8rem!important}
    body.student-login-page .login-command-brand strong{max-width:calc(100vw - 4.8rem)!important}
    body.student-login-page .login-command-brand small{font-size:.62rem}
    body.student-login-page .login-command-story{min-height:0!important;padding:1.25rem!important;border-radius:1rem!important;display:flex!important;flex-direction:column;gap:1rem}
    body.student-login-page .login-command-story-copy{max-width:100%}
    body.student-login-page .login-command-story-copy h1{font-size:clamp(2rem,11vw,3rem)!important}
    body.student-login-page .login-command-story-copy>p:not(.login-command-eyebrow){font-size:.82rem}
    body.student-login-page .login-command-students{position:relative!important;right:auto;bottom:auto;width:min(100%,23rem)!important;max-height:none!important;margin:-.25rem auto 0!important;order:2}
    body.student-login-page .login-command-benefits{order:3;grid-template-columns:1fr 1fr;gap:.45rem}
    body.student-login-page .login-command-benefits li{grid-template-columns:1.9rem minmax(0,1fr);padding:.5rem}
    body.student-login-page .login-command-benefit-icon{width:1.9rem;height:1.9rem}
    body.student-login-page .login-command-story-note{order:4}
    body.student-login-page .login-command-panel{padding:1.25rem!important;border-radius:1rem!important}
    body.student-login-page .login-command-panel-mark{width:2.6rem!important;height:2.6rem!important}
    body.student-login-page .login-command-panel h2{font-size:clamp(1.7rem,8vw,2.3rem)!important}
    body.student-login-page .login-command-label-row{align-items:flex-start;flex-direction:column;gap:.3rem}
    body.student-login-page .login-command-footer{min-height:3.25rem!important;padding:.55rem .75rem!important;font-size:.61rem}
}

@media(max-width:390px){
    body.student-login-page .login-command-benefits{grid-template-columns:1fr}
    body.student-login-page .login-command-footer{align-items:flex-start;flex-direction:column;gap:.2rem}
}

@media(prefers-reduced-motion:reduce){
    body.student-login-page *,
    body.student-login-page *::before,
    body.student-login-page *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

@media print{
    body.student-login-page .login-command-footer{display:none!important}
}

/* Compact viewport-fit composition, matching the administrative sign-in scale. */
@media (min-width:992px){
    body.student-login-page{
        height:100svh!important;
        min-height:100svh!important;
        overflow:hidden!important;
    }

    body.student-login-page .login-command-shell{
        width:min(1160px,100%)!important;
        height:100svh!important;
        min-height:0!important;
        padding:10px 16px 62px!important;
        gap:10px!important;
    }

    body.student-login-page .login-command-brandbar{
        min-height:2.8rem!important;
    }

    body.student-login-page .login-command-brand img{
        width:2.65rem!important;
        height:2.65rem!important;
        flex-basis:2.65rem;
        border-radius:.78rem;
    }

    body.student-login-page .login-command-brand strong{font-size:.78rem!important}
    body.student-login-page .login-command-brand small{font-size:.62rem}

    body.student-login-page .login-command-brand strong{
        max-width:none!important;
        overflow:visible!important;
        white-space:normal!important;
        text-overflow:clip!important;
    }

    body.student-login-page .login-command-grid{
        min-height:0!important;
        grid-template-columns:minmax(0,1.12fr) minmax(21rem,.88fr)!important;
        gap:14px!important;
    }

    body.student-login-page .login-command-story,
    body.student-login-page .login-command-panel{
        height:100%!important;
        min-height:0!important;
        border-radius:1rem!important;
    }

    body.student-login-page .login-command-story{
        padding:20px!important;
        display:flex!important;
        flex-direction:column!important;
        justify-content:space-between!important;
    }

    body.student-login-page .login-command-story-copy{
        width:min(100%,34rem);
        margin-top:auto;
        margin-bottom:auto;
    }

    body.student-login-page .login-command-story-copy h1{
        max-width:18ch;
        font-size:clamp(1.7rem,2.8vw,2.65rem)!important;
        text-shadow:0 3px 22px rgba(0,24,16,.35);
    }

    body.student-login-page .login-command-story-copy>p:not(.login-command-eyebrow){
        max-width:27rem;
        margin-top:.65rem;
        font-size:.8rem;
        line-height:1.45;
    }

    body.student-login-page .login-command-students{
        width:min(42%,24rem)!important;
        max-height:68%!important;
    }

    body.student-login-page .login-command-benefits{
        max-width:29rem;
        gap:.42rem;
        flex:0 0 auto;
    }

    body.student-login-page .login-command-benefits li{padding:.48rem}
    body.student-login-page .login-command-benefits strong{font-size:.66rem}
    body.student-login-page .login-command-benefits small{font-size:.59rem}
    body.student-login-page .login-command-story-note{padding-top:.55rem;margin-top:.35rem}
    body.student-login-page .login-command-story-note strong{font-size:.66rem}
    body.student-login-page .login-command-story-note small{font-size:.59rem}

    body.student-login-page .login-command-panel{
        align-self:stretch!important;
        padding:22px!important;
        display:flex!important;
        flex-direction:column!important;
        justify-content:center!important;
    }

    body.student-login-page .login-command-panel-mark{
        width:2.65rem!important;
        height:2.65rem!important;
        margin-bottom:.55rem;
        border-radius:.78rem;
    }

    body.student-login-page .login-command-panel-head{margin-bottom:1rem}
    body.student-login-page .login-command-eyebrow{font-size:.66rem!important}
    body.student-login-page .login-command-panel h2{font-size:clamp(1.45rem,2.4vw,1.9rem)!important}
    body.student-login-page .login-command-panel-head>p:last-child{margin-top:.4rem;font-size:.72rem}
    body.student-login-page .login-command-form{gap:.7rem!important}
    body.student-login-page .login-command-field label{font-size:.66rem}
    body.student-login-page .login-command-input input{min-height:2.75rem!important;font-size:.8rem}
    body.student-login-page .login-command-password-toggle{width:2rem;height:2rem}
    body.student-login-page .login-command-form-meta span,
    body.student-login-page .login-command-form-meta a,
    body.student-login-page .login-command-support{font-size:.62rem}
    body.student-login-page .login-command-submit{min-height:2.85rem;font-size:.78rem}
    body.student-login-page .login-command-support{margin-top:.7rem;padding-top:.65rem}

    body.student-login-page .login-command-footer{
        height:52px!important;
        min-height:52px!important;
        padding:.55rem 1rem!important;
        justify-content:center;
        font-size:.62rem;
    }
}

@media (max-width:991px){
    body.student-login-page{
        height:auto!important;
        min-height:100svh!important;
        overflow:auto!important;
    }

    body.student-login-page .login-command-shell{
        height:auto!important;
        min-height:0!important;
        padding:10px 12px 14px!important;
    }

    body.student-login-page .login-command-story,
    body.student-login-page .login-command-panel{
        height:auto!important;
    }
}

/* The security footer belongs to the login card, never the viewport. */
body.student-login-page .login-command-panel>.login-command-footer{
    position:static!important;
    inset:auto!important;
    z-index:auto!important;
    width:calc(100% + 2 * clamp(1.5rem,4vw,3.2rem))!important;
    height:auto!important;
    min-height:52px!important;
    margin:1rem calc(-1 * clamp(1.5rem,4vw,3.2rem)) calc(-1 * clamp(1.5rem,4vw,3.2rem))!important;
    padding:.55rem 1rem!important;
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    box-sizing:border-box;
    border-top:1px solid #d5eadb;
    border-radius:0 0 1rem 1rem;
    background:#f1faf4;
    box-shadow:none;
    backdrop-filter:none;
    color:#527568;
    font-size:.62rem;
}

body.student-login-page .login-command-panel>.login-command-footer i{color:#0f8a5c!important}

@media (min-width:992px){
    body.student-login-page .login-command-shell{padding-bottom:10px!important}
    body.student-login-page .login-command-panel>.login-command-footer{margin-top:auto!important;margin-left:-22px!important;margin-right:-22px!important;margin-bottom:-22px!important;width:calc(100% + 44px)!important}
}

@media (max-width:640px){
    body.student-login-page .login-command-panel>.login-command-footer{
        min-height:48px!important;
        margin:1rem -1.25rem -1.25rem!important;
        width:calc(100% + 2.5rem)!important;
        align-items:flex-start;
        flex-direction:column;
        gap:.2rem;
        padding:.6rem .75rem!important;
    }
}

/* Keep institutional identity readable and visually separate from the campus image. */
body.student-login-page .login-command-brandbar{
    width:100%;
    min-height:0!important;
    padding:.45rem .7rem!important;
    border:1px solid rgba(255,255,255,.82);
    border-radius:1rem;
    background:rgba(255,255,255,.96)!important;
    box-shadow:0 10px 26px rgba(1,35,24,.16);
    backdrop-filter:blur(12px);
}

body.student-login-page .login-command-brand,
body.student-login-page .login-command-brand strong{
    color:#0a5037!important;
    text-shadow:none!important;
}

body.student-login-page .login-command-brand small{
    color:#527568!important;
}

body.student-login-page .login-command-brand img{
    border-color:#d4eadb!important;
    box-shadow:0 7px 16px rgba(7,83,51,.14);
}