/* Sign-in page for the admin, center and student portals. Uses the top bar and colours from shell.css. */
.sh-login { min-height: 100vh; }
.sh-login-main { display: flex; justify-content: center; padding: calc(var(--sh-bar) + 56px) 16px 56px; }
.sh-login-card { width: 100%; max-width: 440px; padding: 32px; background: #fff; border: 1px solid var(--sh-line); border-radius: 16px; box-shadow: 0 14px 34px rgba(15, 118, 110, .1); }
.sh-login-card .sh-tabs { display: flex; margin: 0 0 24px; }
.sh-login-card .sh-tabs a { flex: 1 1 0; text-align: center; text-decoration: none; }
.sh-login-card h1 { margin: 0 0 6px; font: 700 28px/1.2 var(--sh-display); }
.sh-login-hint { margin: 0 0 20px; color: var(--sh-muted); }
.sh-login-error { margin: 0 0 16px; padding: 10px 14px; border-radius: 10px; background: #fee2e2; color: #991b1b; font: 600 14px var(--sh-body); }
.sh-login-card label { display: block; margin: 0 0 7px; color: #334155; font: 600 13.5px/1.4 var(--sh-body); }
.sh-login-card input[type=text], .sh-login-card input[type=password] {
    display: block; box-sizing: border-box; width: 100%; height: 48px; margin: 0 0 18px; padding: 0 14px;
    border: 1px solid #cbd9d4; border-radius: 10px; background: #fff; color: var(--sh-ink);
    font: 500 15px var(--sh-body); transition: border-color .15s ease, box-shadow .15s ease;
}
.sh-login-card input:hover { border-color: #99cfc4; }
.sh-login-card input:focus { border-color: var(--sh-primary); box-shadow: 0 0 0 4px rgba(13, 148, 136, .14); outline: 0; }
.sh-login-card .btn {
    display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 48px; padding: 0;
    border: 0; border-radius: 10px; background: var(--sh-primary); color: #fff;
    font: 700 15px var(--sh-body); cursor: pointer; transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.sh-login-card .btn:hover { background: var(--sh-primary-dark); transform: translateY(-2px); box-shadow: 0 8px 18px rgba(13, 148, 136, .22); }
@media (max-width: 480px) { .sh-login-card { padding: 24px 20px; } }