/* Login page: calm, modern staff sign-in without changing authentication behaviour. */
.auth-page{min-height:100vh;background:#F7F4EE}
.auth-layout.auth-layout-modern{
    min-height:100vh;
    display:grid;
    grid-template-columns:minmax(470px,1.04fr) minmax(440px,.96fr);
}
.auth-layout-modern .auth-identity{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    min-height:100vh;
    padding:clamp(36px,5.5vw,72px);
    overflow:hidden;
    background:
        radial-gradient(circle at 78% 82%,rgba(255,255,255,.055),transparent 0 29%),
        linear-gradient(145deg,#356C57 0%,#2F624F 55%,#2A5948 100%);
    color:#fff;
}
.auth-layout-modern .auth-identity::after{
    content:"";
    position:absolute;
    right:-9%;
    bottom:-18%;
    width:54%;
    aspect-ratio:1;
    border:1px solid rgba(255,255,255,.055);
    border-radius:50%;
    box-shadow:
        -75px -18px 0 -1px rgba(255,255,255,.018),
        -150px -36px 0 -1px rgba(255,255,255,.014);
    pointer-events:none;
}
.auth-layout-modern .auth-school-brand{position:relative;z-index:1}
.auth-layout-modern .school-logo{
    display:block;
    width:min(560px,86%);
    max-height:138px;
    object-fit:contain;
    object-position:left center;
    padding:0;
    border-radius:0;
    background:transparent;
}
.auth-layout-modern .auth-identity-copy{
    position:relative;
    z-index:1;
    max-width:690px;
    margin-block:54px;
}
.auth-layout-modern .auth-identity .eyebrow{
    margin:0 0 14px;
    color:#E8C892;
    font-size:.75rem;
    font-weight:850;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.auth-layout-modern .auth-identity h1{
    max-width:640px;
    margin:0;
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(3rem,5vw,5.25rem);
    font-weight:650;
    line-height:.98;
    letter-spacing:-.035em;
}
.auth-layout-modern .auth-identity-copy>p:not(.eyebrow):not(.auth-values){
    max-width:570px;
    margin:18px 0 0;
    color:#E1ECE6;
    font-size:clamp(.95rem,1.3vw,1.08rem);
    line-height:1.55;
}
.auth-identity-rule{
    display:block;
    width:54px;
    height:2px;
    margin:30px 0 14px;
    border-radius:999px;
    background:#D8AE6E;
}
.auth-layout-modern .auth-values{
    margin:0!important;
    color:#D9E6DF!important;
    font-size:.72rem!important;
    font-weight:700;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.auth-layout-modern .auth-values span{
    margin-inline:7px;
    color:#E8C892;
}
.auth-layout-modern .auth-identity footer{
    position:relative;
    z-index:1;
    color:#C4D8CE;
    font-size:.78rem;
}

.auth-layout-modern .auth-panel{
    display:grid;
    place-items:center;
    min-height:100vh;
    padding:clamp(28px,5vw,72px);
    background:#F7F4EE;
}
.auth-layout-modern .auth-card{
    width:min(480px,100%);
    margin:0;
}
.auth-layout-modern .auth-brand-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-bottom:58px;
    padding-bottom:18px;
    border-bottom:1px solid #E4DED3;
}
.auth-layout-modern .auth-brand{
    display:flex;
    align-items:center;
    gap:11px;
    margin:0;
    color:#22362D;
    text-decoration:none;
}
.auth-layout-modern .auth-brand img{
    width:45px;
    height:45px;
    object-fit:contain;
}
.auth-layout-modern .auth-brand span{display:grid;gap:1px}
.auth-layout-modern .auth-brand strong{
    color:#17392B;
    font-size:.97rem;
    line-height:1.15;
}
.auth-layout-modern .auth-brand small{
    color:#7B827D;
    font-size:.68rem;
}
.auth-layout-modern .theme-toggle{
    width:auto;
    min-width:122px;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
}
.auth-layout-modern .theme-toggle:hover{background:transparent}
.auth-layout-modern .theme-toggle-copy{gap:8px}
.auth-layout-modern .theme-toggle-copy>span{display:grid;gap:1px;text-align:left}
.auth-layout-modern .theme-toggle-copy strong{font-size:.69rem}
.auth-layout-modern .theme-toggle-copy small{font-size:.59rem}
.auth-layout-modern .theme-toggle-icon{width:18px;height:18px}
.auth-layout-modern .theme-switch{flex:0 0 auto}

.auth-layout-modern .auth-copy{margin-bottom:28px}
.auth-layout-modern .auth-copy .eyebrow{
    margin:0 0 11px;
    color:#3B6E57;
    font-size:.7rem;
    font-weight:850;
    letter-spacing:.15em;
    text-transform:uppercase;
}
.auth-layout-modern .auth-copy h2{
    margin:0 0 8px;
    color:#16251F;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(2rem,3.2vw,2.65rem);
    font-weight:650;
    line-height:1.08;
    letter-spacing:-.025em;
}
.auth-layout-modern .auth-copy .muted{
    margin:0;
    color:#737B76;
    font-size:.9rem;
}
.auth-layout-modern .auth-form{gap:18px}
.auth-layout-modern .auth-form>label{
    display:grid;
    gap:7px;
    margin:0;
    color:#28342E;
    font-size:.76rem;
    font-weight:800;
}
.auth-layout-modern .auth-form input{
    width:100%;
    min-height:52px;
    margin:0;
    padding:0 14px;
    border:1px solid #D5D0C6;
    border-radius:10px;
    background:#fff;
    color:#202A25;
    font-size:.88rem;
    box-shadow:none;
}
.auth-layout-modern .auth-form input::placeholder{color:#9A9F9B}
.auth-layout-modern .auth-form input:focus{
    border-color:#77A18D;
    outline:3px solid rgba(101,151,127,.16);
}
.auth-layout-modern .password-field{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:stretch;
    overflow:hidden;
    border:1px solid #D5D0C6;
    border-radius:10px;
    background:#fff;
}
.auth-layout-modern .password-field:focus-within{
    border-color:#77A18D;
    outline:3px solid rgba(101,151,127,.16);
}
.auth-layout-modern .password-field input{
    border:0!important;
    border-radius:0;
    outline:0!important;
    background:transparent;
}
.auth-layout-modern .password-field .button{
    min-width:74px;
    margin:8px;
    padding:0 12px;
    border:0;
    border-left:1px solid #E0DBD2;
    border-radius:0;
    background:transparent;
    color:#356B55;
    font-size:.74rem;
    font-weight:800;
    box-shadow:none;
}
.auth-layout-modern .password-field .button:hover{
    background:#F2F6F3;
    color:#285541;
}
.auth-layout-modern .auth-submit{
    min-height:52px;
    margin-top:2px;
    border-radius:10px;
    background:#3B6E57;
    font-size:.86rem;
    font-weight:820;
}
.auth-layout-modern .auth-submit:hover{background:#315F4D}
.auth-layout-modern .auth-help{
    max-width:430px;
    margin:0 auto;
    color:#777F7A;
    font-size:.69rem;
    line-height:1.5;
    text-align:center;
}
.auth-layout-modern .alert{
    margin:0 0 20px;
    border-radius:10px;
}
.auth-layout-modern .field-error{margin-top:1px;font-size:.67rem}

/* Login-specific dark theme. */
html[data-theme="dark"] .auth-page{background:#262925}
html[data-theme="dark"] .auth-layout-modern .auth-panel{background:#262925}
html[data-theme="dark"] .auth-layout-modern .auth-identity{
    background:
        radial-gradient(circle at 78% 82%,rgba(255,255,255,.04),transparent 0 29%),
        linear-gradient(145deg,#294E40 0%,#244538 58%,#203E33 100%);
}
html[data-theme="dark"] .auth-layout-modern .school-logo{background:transparent}
html[data-theme="dark"] .auth-layout-modern .auth-brand-row{border-bottom-color:#414743}
html[data-theme="dark"] .auth-layout-modern .auth-brand{color:#EEF0EC}
html[data-theme="dark"] .auth-layout-modern .auth-brand strong,
html[data-theme="dark"] .auth-layout-modern .auth-copy h2{color:#F1F3F0}
html[data-theme="dark"] .auth-layout-modern .auth-brand small,
html[data-theme="dark"] .auth-layout-modern .auth-copy .muted,
html[data-theme="dark"] .auth-layout-modern .auth-help{color:#ADB6B0}
html[data-theme="dark"] .auth-layout-modern .auth-copy .eyebrow{color:#A7D2B9}
html[data-theme="dark"] .auth-layout-modern .auth-form>label{color:#DCE1DD}
html[data-theme="dark"] .auth-layout-modern .auth-form input{
    border-color:#555D57;
    background:#343935;
    color:#F0F2EF;
}
html[data-theme="dark"] .auth-layout-modern .auth-form input::placeholder{color:#929B95}
html[data-theme="dark"] .auth-layout-modern .password-field{
    border-color:#555D57;
    background:#343935;
}
html[data-theme="dark"] .auth-layout-modern .password-field .button{
    border-left-color:#4D544F;
    color:#B7D9C5;
}
html[data-theme="dark"] .auth-layout-modern .password-field .button:hover{background:#3C433E}
html[data-theme="dark"] .auth-layout-modern .auth-submit{background:#4E856B;color:#fff}
html[data-theme="dark"] .auth-layout-modern .auth-submit:hover{background:#5A9278}

@media(max-width:980px){
    .auth-layout.auth-layout-modern{grid-template-columns:minmax(390px,.9fr) minmax(400px,1.1fr)}
    .auth-layout-modern .auth-identity{padding:44px}
    .auth-layout-modern .school-logo{width:min(460px,92%)}
    .auth-layout-modern .auth-identity h1{font-size:clamp(2.6rem,5vw,4rem)}
}
@media(max-width:780px){
    .auth-layout.auth-layout-modern{grid-template-columns:1fr}
    .auth-layout-modern .auth-identity{display:none}
    .auth-layout-modern .auth-panel{min-height:100vh;padding:28px 22px}
    .auth-layout-modern .auth-card{width:min(470px,100%)}
    .auth-layout-modern .auth-brand-row{margin-bottom:42px}
}
@media(max-width:480px){
    .auth-layout-modern .auth-panel{padding:22px 16px}
    .auth-layout-modern .auth-brand-row{align-items:flex-start;gap:14px}
    .auth-layout-modern .theme-toggle{min-width:108px}
    .auth-layout-modern .auth-copy h2{font-size:2rem}
}