/* ARNDALE teacher portal — responsive design system */
:root {
    --t-brand: #059669;
    --t-brand-dark: #047857;
    --t-brand-soft: #ecfdf5;
    --t-accent: #0ea5e9;
    --t-ink: #0f172a;
    --t-muted: #64748b;
    --t-line: #e2e8f0;
    --t-canvas: #f6f8fb;
    --t-surface: #fff;
    --t-radius-sm: 12px;
    --t-radius: 18px;
    --t-radius-lg: 24px;
    --t-shadow: 0 10px 30px rgba(15,23,42,.07);
    --t-shadow-hover: 0 20px 44px rgba(15,23,42,.12);
    --t-sidebar: 272px;
}
html { scroll-behavior: smooth; }
body { color: var(--t-ink) !important; background: var(--t-canvas) !important; font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif !important; }
body::before { content: ""; position: fixed; inset: 0 0 auto var(--t-sidebar); height: 310px; z-index: -1; pointer-events: none; background: radial-gradient(circle at 85% 5%, rgba(14,165,233,.12), transparent 28%), linear-gradient(180deg,#ebfdf5 0%,rgba(246,248,251,0) 100%); }
*, *::before, *::after { box-sizing: border-box; }
a, button, input, select, textarea { transition: color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
:is(a,button,input,select,textarea):focus-visible { outline: 3px solid rgba(5,150,105,.23) !important; outline-offset: 2px; }

/* App shell */
.sidebar { width: var(--t-sidebar) !important; padding: 14px 12px; background: linear-gradient(165deg,#071f1a 0%,#064e3b 55%,#065f46 100%) !important; border-right: 1px solid rgba(255,255,255,.08); box-shadow: 12px 0 34px rgba(15,23,42,.13) !important; }
.sidebar-header { padding: 10px 8px 16px !important; border: 0 !important; text-align: left !important; }
.sidebar-logo { margin: 0 !important; padding: 8px; }
.logo-icon { width: 44px !important; height: 44px !important; border-radius: 14px !important; background: linear-gradient(135deg,var(--t-brand),var(--t-accent)) !important; box-shadow: 0 9px 20px rgba(14,165,233,.2); }
.logo-text h4 { font-size: .98rem !important; letter-spacing: -.02em; }.logo-text small { color: #a7f3d0 !important; }
.teacher-info { margin: 4px 4px 12px !important; padding: 11px !important; border: 1px solid rgba(255,255,255,.08); border-radius: 15px !important; background: rgba(255,255,255,.065) !important; }
.teacher-avatar { width: 44px !important; height: 44px !important; border-radius: 13px !important; background: linear-gradient(135deg,var(--t-brand),var(--t-accent)) !important; }
.sidebar-nav { padding: 4px 0 18px !important; }.nav-section { margin-bottom: 14px !important; }.nav-title { padding: 7px 12px !important; color: #6ee7b7 !important; font-size: .65rem !important; letter-spacing: .12em !important; }
.sidebar .nav-item { margin: 3px 0 !important; }.sidebar .nav-link { min-height: 45px; padding: 10px 12px !important; border: 0 !important; border-radius: 12px !important; gap: 12px !important; color: #cbd5e1 !important; }
.sidebar .nav-link i { width: 22px !important; font-size: .96rem !important; }.sidebar .nav-link:hover { color: #fff !important; background: rgba(255,255,255,.075) !important; transform: translateX(2px); }.sidebar .nav-link.active { color: #fff !important; background: linear-gradient(135deg,rgba(5,150,105,.98),rgba(14,165,233,.76)) !important; box-shadow: 0 9px 22px rgba(5,150,105,.2); }
.sidebar .nav-link.text-danger { color: #fecaca !important; }.sidebar .nav-link.text-danger:hover { background: rgba(239,68,68,.17) !important; }

.main-content { min-width: 0; background: transparent !important; }
@media (min-width: 769px) { .sidebar { transform: translateX(0) !important; }.main-content { margin-left: var(--t-sidebar) !important; width: calc(100% - var(--t-sidebar)) !important; } }
.top-navbar { margin: 15px 22px 0 !important; min-height: 72px !important; border: 1px solid rgba(226,232,240,.9) !important; border-radius: 18px; background: rgba(255,255,255,.9) !important; box-shadow: 0 8px 25px rgba(15,23,42,.05) !important; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.navbar-content { min-height: 70px; padding: 9px 12px !important; }.sidebar-toggle,.notification-btn { display: grid !important; place-items: center; width: 43px !important; height: 43px !important; padding: 0 !important; border: 1px solid var(--t-line) !important; border-radius: 13px !important; color: var(--t-ink) !important; background: #fff !important; box-shadow: 0 4px 12px rgba(15,23,42,.05); }
.page-title h4 { margin: 0 !important; color: var(--t-ink) !important; font-size: 1.05rem !important; font-weight: 750 !important; letter-spacing: -.02em; }.page-title h4 i { color: var(--t-brand); }
.user-menu { padding: 6px 9px !important; border-radius: 14px !important; text-decoration: none !important; }.user-menu:hover { background: #f8fafc !important; }.user-avatar-small { width: 39px !important; height: 39px !important; border-radius: 12px !important; background: linear-gradient(135deg,var(--t-brand),var(--t-accent)) !important; }.user-info span { color: var(--t-ink) !important; }.user-info small { color: var(--t-muted) !important; }
.content-area { width: 100%; max-width: 1600px; margin: 0 auto; padding: 24px 22px 42px !important; }.breadcrumb { margin-bottom: 20px !important; padding: 0 !important; background: transparent !important; font-size: .82rem; }.breadcrumb a { color: var(--t-brand); text-decoration: none; }

/* Reconcile legacy page-level component styles */
:is(.card,.stat-card,.stats-card,.dashboard-card,.summary-card,.exam-card,.subject-card,.student-card,.report-card,.filter-card,.form-card,.content-card,.question-card,.upload-card,.attendance-card,.action-card,.info-card,.table-card) { border: 1px solid var(--t-line) !important; border-radius: var(--t-radius) !important; background: var(--t-surface) !important; box-shadow: var(--t-shadow) !important; overflow: hidden; }
:is(.card,.exam-card,.subject-card,.student-card,.report-card,.action-card):hover { border-color: #cbd5e1 !important; box-shadow: var(--t-shadow-hover) !important; }
.card-header { padding: 17px 19px !important; border-bottom: 1px solid var(--t-line) !important; background: #fff !important; color: var(--t-ink) !important; }.card-body { padding: 19px !important; }
h1,h2,h3,h4,h5,h6 { color: var(--t-ink); letter-spacing: -.025em; }.text-muted { color: var(--t-muted) !important; }
.page-header { margin-bottom: 24px !important; padding: clamp(19px,3vw,28px) !important; border: 1px solid var(--t-line) !important; border-radius: var(--t-radius-lg) !important; background: linear-gradient(135deg,#fff 0%,#f0fdf4 100%) !important; box-shadow: var(--t-shadow) !important; }.page-header h1,.page-header h2 { font-weight: 780 !important; }

.btn { min-height: 42px; padding: .6rem .95rem !important; border-radius: 11px !important; font-weight: 650 !important; }.btn:hover { transform: translateY(-1px); }.btn-primary,.btn-success { border-color: var(--t-brand) !important; background: linear-gradient(135deg,var(--t-brand),var(--t-brand-dark)) !important; box-shadow: 0 7px 16px rgba(5,150,105,.17); }.btn-outline-primary,.btn-outline-success { color: var(--t-brand) !important; border-color: #a7f3d0 !important; background: #fff !important; }.btn-outline-primary:hover,.btn-outline-success:hover { color: #fff !important; background: var(--t-brand) !important; }.badge { padding: .46em .7em !important; border-radius: 999px !important; font-weight: 650 !important; }
.form-control,.form-select,.form-input { min-height: 45px; border: 1px solid #cbd5e1 !important; border-radius: 11px !important; color: var(--t-ink) !important; background-color: #fff !important; }.form-control:focus,.form-select:focus,.form-input:focus { border-color: var(--t-brand) !important; box-shadow: 0 0 0 4px rgba(5,150,105,.1) !important; }.form-label { color: #334155 !important; font-weight: 650 !important; } textarea.form-control { min-height: 110px; }
.input-group > :first-child { border-radius: 11px 0 0 11px !important; }.input-group > :last-child { border-radius: 0 11px 11px 0 !important; }
.table-responsive { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--t-line); border-radius: 15px; background: #fff; }.table { width: 100%; margin-bottom: 0 !important; color: #334155 !important; }.table > :not(caption) > * > * { padding: .85rem .9rem !important; border-bottom-color: var(--t-line) !important; vertical-align: middle; }.table thead th { white-space: nowrap; color: #475569 !important; background: #f8fafc !important; font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; }
.alert { border: 0 !important; border-radius: 13px !important; box-shadow: 0 6px 18px rgba(15,23,42,.06); }.modal-content { border: 0 !important; border-radius: 21px !important; box-shadow: 0 26px 70px rgba(15,23,42,.22) !important; }.modal-header,.modal-footer { border-color: var(--t-line) !important; }.dropdown-menu { padding: 8px !important; border: 1px solid var(--t-line) !important; border-radius: 14px !important; box-shadow: var(--t-shadow-hover) !important; }.dropdown-item { padding: 9px 11px; border-radius: 9px; }
.pagination { gap: 5px; }.page-link { border: 1px solid var(--t-line) !important; border-radius: 10px !important; color: var(--t-brand) !important; }.active > .page-link { color: #fff !important; background: var(--t-brand) !important; }

/* Login */
body.teacher-login-page { position: relative; padding: 24px !important; background: radial-gradient(circle at 12% 12%,rgba(14,165,233,.16),transparent 30%),radial-gradient(circle at 88% 88%,rgba(5,150,105,.18),transparent 34%),#f8fafc !important; }
.teacher-login-page .login-container { max-width: 470px !important; }.teacher-login-page .login-card { padding: clamp(24px,5vw,40px) !important; border: 1px solid rgba(226,232,240,.95) !important; border-radius: 26px !important; box-shadow: 0 28px 75px rgba(15,23,42,.14) !important; }.teacher-login-page .teacher-icon { width: 72px !important; height: 72px !important; border-radius: 21px !important; background: linear-gradient(135deg,var(--t-brand),var(--t-accent)) !important; box-shadow: 0 10px 24px rgba(5,150,105,.2) !important; }.teacher-login-page .teacher-title { color: var(--t-ink) !important; font-size: clamp(1.55rem,5vw,2rem) !important; }.teacher-login-page .teacher-subtitle { color: var(--t-muted) !important; }

/* Standalone printable report */
body.teacher-report-page { padding: 20px; background: #eef2f7 !important; }.teacher-report-page .report-container,.teacher-report-page .container { max-width: 1100px; margin-inline: auto; border-radius: 18px; background: #fff; box-shadow: var(--t-shadow); }.teacher-report-page img { max-width: 100%; height: auto; }

@media (max-width: 768px) {
    body::before { left: 0; }.sidebar { width: min(88vw,320px) !important; border-radius: 0 22px 22px 0; }.main-content { width: 100% !important; margin-left: 0 !important; }.top-navbar { margin: 10px 12px 0 !important; min-height: 64px !important; border-radius: 15px; }.navbar-content { min-height: 62px; }.content-area { padding: 20px 12px 88px !important; }.user-info { display: none !important; }.notification-btn { display: none !important; }.page-title h4 { max-width: 54vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.sidebar-overlay.show { background: rgba(2,6,23,.52) !important; backdrop-filter: blur(3px); }.card-body,.card-header { padding: 15px !important; }.page-header { border-radius: 18px !important; }.table > :not(caption) > * > * { padding: .72rem !important; }.btn { min-height: 44px; }
}
@media (max-width: 575.98px) {
    h1 { font-size: 1.65rem !important; } h2 { font-size: 1.4rem !important; }.row { --bs-gutter-x: .8rem; }.btn { width: 100%; }.btn-group .btn,.input-group .btn,td .btn,.d-flex .btn { width: auto; }.teacher-login-page { align-items: flex-start !important; padding: 14px !important; overflow-y: auto; }.teacher-login-page .login-container { margin: auto 0; }.teacher-login-page .login-card { padding: 25px 20px !important; border-radius: 22px !important; } body.teacher-report-page { padding: 0; }.teacher-report-page .report-container,.teacher-report-page .container { border-radius: 0; box-shadow: none; }
}
@media print { body.teacher-report-page { padding: 0; background: #fff !important; }.teacher-report-page .report-container,.teacher-report-page .container { max-width: none; box-shadow: none; border-radius: 0; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }