.login-page { min-height:100vh; min-height:100dvh; background:#f4f2eb; background-image:radial-gradient(ellipse at 0 0,#dfe8df80,transparent 55%); font-size:15px; }
.login-shell { max-width:1140px; margin:0 auto; padding:32px 32px 22px; }
.login-header { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:30px; }
.login-brand { display:flex; gap:14px; align-items:center; max-width:72%; }
.login-brand>span:last-child { color:var(--green); font:600 23px/1.4 Georgia,serif; }
.login-emblem { display:block; flex-shrink:0; width:46px; color:#a58a50; }
.login-emblem svg { display:block; width:100%; }
.login-return { display:flex; gap:11px; align-items:center; font-size:13px; font-weight:600; white-space:nowrap; color:var(--green); }
.login-return svg,.login-submit svg { width:20px; height:20px; flex-shrink:0; }
.login-card { display:grid; grid-template-columns:.93fr 1.07fr; border:1px solid #dfe4db; border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 24px 64px #123f3510; min-height:600px; }
.login-visual { position:relative; overflow:hidden; background:var(--deep); color:#fff; }
.login-campus { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:45% center; }
.login-visual-shade { position:absolute; inset:0; background:linear-gradient(180deg,#07362cdc 0%,#092e2470 32%,#062d25e8 78%,#062d25 100%); }
.login-visual-content { position:relative; z-index:1; display:flex; flex-direction:column; justify-content:space-between; padding:42px; height:100%; min-height:inherit; }
.login-kicker { display:flex; align-items:center; gap:11px; color:#f0dbad; font-size:10px; letter-spacing:.14em; font-weight:600; }
.login-kicker>span { font-size:22px; line-height:1; }
.login-visual-intro { padding-top:170px; }
.login-rule { display:block; width:40px; height:2px; background:var(--gold); margin-bottom:24px; }
.login-visual-intro h2 { font:500 35px/1.35 Georgia,serif; margin:0 0 18px; max-width:340px; }
.login-visual-intro p { color:#d5e2d8; font-size:15px; line-height:1.9; margin:0 0 28px; max-width:340px; }
.login-heritage { display:flex; align-items:center; flex-wrap:wrap; gap:9px; font-size:10px; color:#bbcec1; border-top:1px solid #ffffff24; padding-top:18px; }
.login-form-panel { padding:42px 54px; align-self:center; }
.login-lock { width:46px; height:46px; display:grid; place-items:center; background:#edf2eb; border:1px solid #e0e8dd; border-radius:12px; color:var(--green); margin-bottom:21px; }
.login-lock svg { width:23px; height:23px; }
.login-form-kicker { margin:0 0 10px; font-size:10px; color:#81704b; font-weight:600; letter-spacing:.12em; }
.login-form-heading h1 { font:500 33px/1.3 Georgia,serif; color:var(--green); margin:0 0 12px; }
.login-intro { font-size:14px; line-height:1.8; margin:0 0 28px; }
.login-field { margin-bottom:20px; }
.login-page .form-label { display:block; font-size:13px; margin-bottom:9px; color:#345045; font-weight:600; }
.login-page .form-control { min-height:54px; padding:14px 16px; background:#fcfcfa; border-color:#dce3d9; border-radius:6px; font:16px/1.5 Arial,sans-serif; }
.login-page .form-control::placeholder { color:#969d96; font-size:14px; }
.login-page .form-control:focus { background:#fff; border-color:#3c7963; box-shadow:0 0 0 3px #164e4014; }
.login-page .form-control.is-invalid { border-color:#b94b4b; }
.login-password { position:relative; }
.login-password .form-control { padding-right:55px; }
.login-password .is-invalid { background-image:none; }
.login-password-toggle { position:absolute; top:7px; right:7px; width:40px; height:40px; display:grid; place-items:center; padding:0; border:0; background:transparent; border-radius:4px; color:#6c7b70; }
.login-password-toggle[hidden] { display:none; }
.login-password-toggle:hover { background:#eef2eb; color:var(--green); }
.login-password-toggle svg { width:21px; height:21px; }
.password-eye-slash { display:none; }
.login-password-toggle[aria-pressed="true"] .password-eye-slash { display:block; }
.login-page .login-submit { width:100%; display:flex; align-items:center; justify-content:center; gap:16px; min-height:54px; font-size:14px; padding:14px 22px; border-radius:6px; margin-top:7px; }
.login-access-note { display:flex; align-items:start; gap:10px; padding-top:23px; margin:25px 0 0; border-top:1px solid #e5e8e0; font-size:11px; line-height:1.8; color:#7b867b; }
.login-access-note svg { width:17px; height:19px; flex-shrink:0; margin-top:1px; }
.login-errors { font-size:13px; padding:12px 16px; border-radius:6px; }
.login-errors ul { padding-inline-start:18px; }
.login-footer { font:12px/1.8 Arial,sans-serif; text-align:center; color:#7a8175; padding-top:24px; }
.login-footer a { color:var(--green); font-weight:600; text-decoration:underline; text-underline-offset:3px; }
html[dir="rtl"] .login-return svg,html[dir="rtl"] .login-submit svg { transform:rotate(180deg); }
html[lang="ur"] .login-page { font-size:21px; line-height:2.2; }
html[lang="ur"] .login-brand>span:last-child { font-family:var(--urdu); font-size:25px; line-height:2.1; }
html[lang="ur"] .login-return { font-size:19px; }
html[lang="ur"] .login-kicker { font-size:20px; letter-spacing:0; line-height:2; }
html[lang="ur"] .login-visual-intro { padding-top:140px; }
html[lang="ur"] .login-visual-intro h2 { font-family:var(--urdu); font-size:32px; line-height:2.05; margin-bottom:12px; }
html[lang="ur"] .login-visual-intro p { font-size:21px; line-height:2.3; }
html[lang="ur"] .login-heritage { font-size:16px; line-height:2; }
html[lang="ur"] .login-form-kicker { font-size:19px; line-height:2; letter-spacing:0; margin-bottom:3px; }
html[lang="ur"] .login-form-heading h1 { font-family:var(--urdu); font-size:32px; line-height:2; margin-bottom:3px; }
html[lang="ur"] .login-intro { font-size:21px; line-height:2.3; margin-bottom:20px; }
html[lang="ur"] .login-page .form-label { font-size:21px; line-height:2; margin-bottom:8px; font-weight:400; }
html[lang="ur"] .login-page .form-control { font:18px/1.5 Arial,sans-serif; }
html[lang="ur"] .login-page .login-submit { font-size:21px; line-height:2; padding-block:6px 13px; }
html[lang="ur"] .login-access-note { font-size:17px; line-height:2.3; padding-top:17px; margin-top:20px; }
html[lang="ur"] .login-access-note svg { margin-top:8px; }
html[lang="ur"] .login-errors { font-size:18px; line-height:2.2; }
@media(max-width:991px) {
.login-shell { padding:24px; }.login-card { grid-template-columns:.85fr 1.15fr; }.login-visual-content { padding:32px; }.login-form-panel { padding:36px; }.login-visual-intro h2 { font-size:30px; }html[lang="ur"] .login-visual-intro h2 { font-size:29px; }
}
@media(max-width:767px) {
.login-shell { max-width:600px; padding:20px 18px; }.login-header { margin-bottom:20px; gap:12px; }.login-brand { gap:9px; max-width:71%; }.login-brand>span:last-child { font-size:17px; }.login-emblem { width:35px; }.login-return { font-size:11px; gap:6px; }.login-return svg { width:15px; }.login-card { grid-template-columns:1fr; min-height:0; border-radius:10px; }.login-visual-content { padding:26px; min-height:225px; }.login-visual-shade { background:linear-gradient(90deg,#052d25e8,#052d2590); }.login-kicker { font-size:9px; }.login-visual-intro { padding-top:22px; }.login-rule { width:28px; margin-bottom:10px; }.login-visual-intro h2 { font-size:26px; margin-bottom:10px; }.login-visual-intro p { display:none; }.login-heritage { font-size:9px; margin-top:15px; padding-top:12px; }.login-form-panel { padding:30px 26px; }.login-lock { width:40px; height:40px; margin-bottom:16px; }.login-form-heading h1 { font-size:29px; }.login-intro { margin-bottom:24px; }.login-footer { padding-top:20px; }
html[lang="ur"] .login-brand>span:last-child { font-size:20px; }html[lang="ur"] .login-return { font-size:16px; }html[lang="ur"] .login-kicker { font-size:17px; }html[lang="ur"] .login-visual-intro { padding-top:13px; }html[lang="ur"] .login-visual-intro h2 { font-size:26px; margin-bottom:0; }html[lang="ur"] .login-heritage { font-size:14px; margin-top:10px; }html[lang="ur"] .login-form-heading h1 { font-size:30px; }html[lang="ur"] .login-intro { font-size:20px; }
}
@media(max-width:374px) {
.login-brand>span:last-child { font-size:15px; }.login-brand { max-width:68%; }html[lang="ur"] .login-brand>span:last-child { font-size:18px; }.login-emblem { width:29px; }.login-form-panel,.login-visual-content { padding-inline:22px; }
}