/* ==========================================================================
   دبیرستان و هنرستان امام حسن (ع) — سیستم طراحی
   پالت: «فیروزه‌ای تبریز» (کاشی‌های مسجد کبود) + «طلایی» (رنگ لوگو) + جوهری عمیق
   ========================================================================== */

/* فونت متغیر آراد (محلی) */
@font-face {
    font-family: 'Arad';
    src: url('../fonts/AradVF.woff2') format('woff2-variations'), url('../fonts/AradVF.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    --ink-900: #071a26;
    --ink-800: #0b2433;
    --ink-700: #123447;
    --ink-600: #1d4a5f;

    --firouzeh-700: #0b5f63;
    --firouzeh-600: #0f7c80;
    --firouzeh-500: #14a3a3;
    --firouzeh-100: #dff2f0;
    --firouzeh-50:  #eff8f7;

    --gold-600: #c99207;
    --gold-500: #f5b90f;
    --gold-400: #f8c93d;
    --gold-100: #fdf1cc;
    --gold-ink: #2b1d00;

    --paper:    #f6f4ee;
    --surface:  #ffffff;
    --text:     #142430;
    --muted:    #56666f;
    --border:   #e4e0d5;

    --success:  #2f855a;
    --success-bg: #e3f4ea;
    --danger:   #b8392a;
    --danger-bg: #fbe7e3;
    --warning:  #9a6700;
    --warning-bg: #fff4d6;

    --radius-sm: 10px;
    --radius:    16px;
    --radius-lg: 24px;
    --shadow-sm: 0 1px 2px rgba(11, 36, 51, .06), 0 1px 3px rgba(11, 36, 51, .05);
    --shadow:    0 6px 18px -6px rgba(11, 36, 51, .14), 0 2px 6px rgba(11, 36, 51, .05);
    --shadow-lg: 0 24px 48px -16px rgba(11, 36, 51, .28);
    --ease: cubic-bezier(.2, .7, .2, 1);

    /* Bootstrap overrides */
    --bs-body-font-family: 'Arad', Tahoma, sans-serif;
    --bs-body-bg: var(--paper);
    --bs-body-color: var(--text);
    --bs-primary: var(--firouzeh-600);
    --bs-primary-rgb: 15, 124, 128;
    --bs-link-color: var(--firouzeh-600);
    --bs-link-color-rgb: 15, 124, 128;
    --bs-link-hover-color: var(--firouzeh-700);
    --bs-border-color: var(--border);
    --bs-border-radius: var(--radius-sm);
    --bs-border-radius-lg: var(--radius);
    --bs-secondary-color: var(--muted);
    --bs-focus-ring-color: rgba(15, 124, 128, .3);

    --girih: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1'%3E%3Cpath d='M40 8l8 18 18-4-4 18 18 0-18 8 4 18-18-4-8 18-8-18-18 4 4-18-18-8 18 0-4-18 18 4z'/%3E%3Ccircle cx='40' cy='40' r='9'/%3E%3Cpath d='M0 0l12 12M80 0L68 12M0 80l12-12M80 80L68 68'/%3E%3C/g%3E%3C/svg%3E");
}

html { scroll-behavior: smooth; }
body {
    font-family: var(--bs-body-font-family);
    background: var(--paper);
    color: var(--text);
    line-height: 1.8;
    -webkit-font-smoothing: antialiased;
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation: none !important; transition: none !important; }
}

h1, h2, h3, h4, h5, h6 { font-weight: 800; line-height: 1.5; color: var(--ink-800); }
a { text-decoration: none; }
::selection { background: var(--gold-400); color: var(--gold-ink); }

:focus-visible { outline: 3px solid var(--gold-500); outline-offset: 2px; border-radius: 6px; }

.skip-link {
    position: absolute; inset-inline-start: 1rem; top: -100px; z-index: 2000;
    background: var(--gold-500); color: var(--gold-ink); padding: .5rem 1rem; border-radius: var(--radius-sm); font-weight: 700;
}
.skip-link:focus { top: 1rem; }

.text-muted { color: var(--muted) !important; }
.fw-black { font-weight: 900; }
.text-gold { color: var(--gold-500) !important; }
.text-firouzeh { color: var(--firouzeh-600) !important; }

/* ---------- Buttons ---------- */
.btn { font-weight: 700; border-radius: 12px; padding: .6rem 1.25rem; transition: transform .15s var(--ease), box-shadow .2s var(--ease), background-color .2s; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; }
.btn:active { transform: translateY(1px); }
.btn-sm { min-height: 36px; padding: .35rem .85rem; font-size: .85rem; border-radius: 10px; }
.btn-lg { padding: .85rem 1.75rem; font-size: 1.05rem; border-radius: 14px; }
.btn-primary { --bs-btn-bg: var(--firouzeh-600); --bs-btn-border-color: var(--firouzeh-600); --bs-btn-hover-bg: var(--firouzeh-700); --bs-btn-hover-border-color: var(--firouzeh-700); --bs-btn-active-bg: var(--firouzeh-700); --bs-btn-active-border-color: var(--firouzeh-700); --bs-btn-disabled-bg: var(--firouzeh-600); --bs-btn-disabled-border-color: var(--firouzeh-600); }
.btn-primary:hover { box-shadow: 0 8px 20px -8px rgba(15, 124, 128, .7); }
.btn-gold { background: var(--gold-500); color: var(--gold-ink); border: 1px solid var(--gold-500); }
.btn-gold:hover, .btn-gold:focus { background: var(--gold-400); color: var(--gold-ink); box-shadow: 0 8px 22px -8px rgba(245, 185, 15, .8); }
.btn-ghost-light { color: #fff; border: 1px solid rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .06); }
.btn-ghost-light:hover { color: #fff; background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .6); }
.btn-soft { background: var(--firouzeh-50); color: var(--firouzeh-700); border: 1px solid var(--firouzeh-100); }
.btn-soft:hover { background: var(--firouzeh-100); color: var(--firouzeh-700); }
.btn-soft-danger { background: var(--danger-bg); color: var(--danger); border: 1px solid transparent; }
.btn-soft-danger:hover { background: var(--danger); color: #fff; }
.btn-icon { width: 38px; height: 38px; min-height: 38px; padding: 0; border-radius: 10px; }

/* ---------- Forms ---------- */
.form-label { font-weight: 700; font-size: .875rem; color: var(--ink-700); margin-bottom: .35rem; }
.form-control, .form-select { border-radius: 12px; border-color: var(--border); padding: .6rem .9rem; min-height: 44px; background-color: #fff; }
.form-control:focus, .form-select:focus { border-color: var(--firouzeh-500); box-shadow: 0 0 0 .25rem rgba(15, 124, 128, .15); }
.form-text { color: var(--muted); font-size: .8rem; }
.input-group-text { border-radius: 12px; background: var(--firouzeh-50); border-color: var(--border); color: var(--firouzeh-700); }
.ltr { direction: ltr; text-align: right; }
.ltr::placeholder { text-align: right; }

/* ---------- Cards ---------- */
.card-x { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.card-x-header { padding: 1.1rem 1.35rem; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.card-x-header h2, .card-x-header h3 { font-size: 1.05rem; margin: 0; display: flex; align-items: center; gap: .6rem; }
.card-x-body { padding: 1.35rem; }
.icon-chip { width: 40px; height: 40px; border-radius: 12px; display: inline-grid; place-items: center; font-size: 1.15rem; flex-shrink: 0; background: var(--firouzeh-50); color: var(--firouzeh-600); }
.icon-chip.gold { background: var(--gold-100); color: var(--gold-600); }
.icon-chip.ink { background: var(--ink-800); color: var(--gold-500); }
.icon-chip.danger { background: var(--danger-bg); color: var(--danger); }
.icon-chip.success { background: var(--success-bg); color: var(--success); }

/* ---------- Avatars & badges ---------- */
.avatar { border-radius: 50%; object-fit: cover; flex-shrink: 0; display: inline-grid; place-items: center; }
.avatar-sm { width: 36px; height: 36px; font-size: .8rem; }
.avatar-md { width: 48px; height: 48px; font-size: 1rem; }
.avatar-lg { width: 88px; height: 88px; font-size: 1.6rem; }
.avatar-initials { background: linear-gradient(135deg, var(--firouzeh-600), var(--ink-700)); color: #fff; font-weight: 800; }
.badge-x { display: inline-flex; align-items: center; gap: .3rem; font-size: .75rem; font-weight: 700; padding: .3rem .7rem; border-radius: 999px; white-space: nowrap; }
.badge-x.success { background: var(--success-bg); color: var(--success); }
.badge-x.danger { background: var(--danger-bg); color: var(--danger); }
.badge-x.warning { background: var(--warning-bg); color: var(--warning); }
.badge-x.info { background: var(--firouzeh-50); color: var(--firouzeh-700); }
.badge-x.gold { background: var(--gold-100); color: #7a5600; }
.score-high { color: var(--success); }
.score-mid { color: var(--warning); }
.score-low { color: var(--danger); }

/* ---------- Tables ---------- */
.table-x { --bs-table-bg: transparent; margin: 0; font-size: .9rem; }
.table-x thead th { font-size: .78rem; font-weight: 700; color: var(--muted); background: #faf9f5; border-bottom: 1px solid var(--border); padding: .8rem 1rem; white-space: nowrap; }
.table-x tbody td { padding: .8rem 1rem; vertical-align: middle; border-color: #f0ede5; }
.table-x tbody tr { transition: background-color .15s; }
.table-x tbody tr:hover { background: var(--firouzeh-50); }
.empty-state { text-align: center; padding: 3rem 1rem; color: var(--muted); }
.empty-state i { font-size: 2.5rem; color: var(--firouzeh-500); opacity: .5; display: block; margin-bottom: .75rem; }

/* ==========================================================================
   PUBLIC SITE
   ========================================================================== */
.topbar { background: var(--ink-900); color: rgba(255, 255, 255, .75); font-size: .8rem; }
.topbar a { color: rgba(255, 255, 255, .85); }
.topbar a:hover { color: var(--gold-400); }

.site-nav { background: rgba(255, 255, 255, .92); backdrop-filter: saturate(160%) blur(12px); border-bottom: 1px solid var(--border); transition: box-shadow .25s; }
.site-nav.scrolled { box-shadow: var(--shadow); }
.site-nav .navbar-brand { display: flex; align-items: center; gap: .75rem; }
.brand-mark { width: 52px; height: 52px; border-radius: 14px; background: var(--ink-800); display: grid; place-items: center; padding: 6px; box-shadow: inset 0 0 0 1px rgba(245, 185, 15, .35); }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.brand-text strong { display: block; font-size: 1.02rem; font-weight: 900; color: var(--ink-800); line-height: 1.4; }
.brand-text small { display: block; font-size: .72rem; color: var(--muted); }
.site-nav .nav-link { font-weight: 600; color: var(--ink-700); padding: .5rem .9rem !important; border-radius: 10px; }
.site-nav .nav-link:hover, .site-nav .nav-link.active { color: var(--firouzeh-600); background: var(--firouzeh-50); }

/* Hero */
.hero-eyebrow { display: inline-flex; align-items: center; gap: .5rem; padding: .35rem .9rem; border-radius: 999px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14); font-size: .8rem; color: var(--gold-400); font-weight: 600; }
.hero-typo { max-width: min(520px, 100%); height: auto; filter: drop-shadow(0 6px 20px rgba(0, 0, 0, .35)); }
.hero-lead { color: rgba(255, 255, 255, .78); font-size: 1.08rem; max-width: 34rem; }
.hero-frame { position: relative; border-radius: var(--radius-lg); padding: 10px; background: linear-gradient(145deg, rgba(245, 185, 15, .55), rgba(20, 163, 163, .35)); box-shadow: var(--shadow-lg); }
.hero-frame img { display: block; width: 100%; height: auto; border-radius: 18px; background: var(--ink-700); }

/* Stats band */

/* Sections */
.section { padding: 5rem 0; }
.section-sm { padding: 3.5rem 0; }
.section-head { max-width: 640px; margin-bottom: 2.5rem; }
.section-head.center { margin-inline: auto; text-align: center; }
.kicker { display: inline-flex; align-items: center; gap: .5rem; color: var(--firouzeh-600); font-weight: 800; font-size: .85rem; margin-bottom: .5rem; }
.kicker::before { content: ""; width: 22px; height: 3px; border-radius: 3px; background: var(--gold-500); }
.section-title { font-size: clamp(1.5rem, 2.6vw, 2.1rem); font-weight: 900; margin-bottom: .75rem; }

/* Tracks (دبیرستان / هنرستان) */

/* Features */

/* News */
.news-card { display: flex; flex-direction: column; height: 100%; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; transition: box-shadow .25s var(--ease), transform .25s var(--ease); color: inherit; }
.news-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); color: inherit; }
.news-thumb { aspect-ratio: 16 / 9; background: radial-gradient(120% 90% at 100% 0%, var(--firouzeh-500), var(--firouzeh-700) 45%, var(--ink-800)); position: relative; overflow: hidden; }
.news-thumb.tone-gold { background: radial-gradient(120% 90% at 100% 0%, var(--gold-400), #b27c00 45%, #4a3300); }
.news-thumb.tone-ink { background: radial-gradient(120% 90% at 100% 0%, var(--ink-600), var(--ink-800) 50%, var(--ink-900)); }
.news-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.news-card:hover .news-thumb img { transform: scale(1.04); }
.news-thumb .placeholder-mark { position: absolute; inset: 0; display: grid; place-items: center; }
.news-thumb .placeholder-mark::before { content: ""; position: absolute; inset: 0; background-image: var(--girih); background-size: 90px; opacity: .12; }
.news-thumb .placeholder-mark i { position: relative; font-size: 3rem; color: rgba(255, 255, 255, .9); }
.news-thumb .badge-x { position: absolute; top: .85rem; inset-inline-start: .85rem; background: rgba(255, 255, 255, .92); color: var(--ink-800); box-shadow: var(--shadow-sm); }
.news-body { padding: 1.25rem; display: flex; flex-direction: column; flex: 1; }
.news-body h3 { font-size: 1.05rem; margin-bottom: .5rem; }
.news-body p { color: var(--muted); font-size: .9rem; flex: 1; }
.news-meta { display: flex; align-items: center; gap: 1rem; font-size: .78rem; color: var(--muted); }
.article-cover { border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 16 / 8; background: var(--ink-800); }
.article-cover img { width: 100%; height: 100%; object-fit: cover; }
.article-body { font-size: 1.05rem; line-height: 2.2; white-space: pre-line; }

/* Portal CTA */
.portal-cta { position: relative; border-radius: var(--radius-lg); overflow: hidden; background: linear-gradient(135deg, var(--firouzeh-700), var(--ink-800)); color: #fff; padding: clamp(2rem, 5vw, 3.5rem); }
.portal-cta::before { content: ""; position: absolute; inset: 0; background-image: var(--girih); background-size: 80px; opacity: .07; }
.portal-cta > * { position: relative; }
.portal-cta h2 { color: #fff; }

/* Page hero (inner pages) */
.page-hero { position: relative; overflow: hidden; background: linear-gradient(160deg, var(--ink-800), var(--ink-900)); color: #fff; padding: 3.5rem 0 3rem; }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: var(--girih); background-size: 80px; opacity: .06; }
.page-hero .container { position: relative; }
.page-hero h1 { color: #fff; font-size: clamp(1.6rem, 3vw, 2.3rem); font-weight: 900; }
.page-hero .breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.4); --bs-breadcrumb-item-active-color: var(--gold-400); margin: 0; font-size: .85rem; }
.page-hero .breadcrumb a { color: rgba(255, 255, 255, .75); }

/* Footer */
.site-footer { background: var(--ink-900); color: rgba(255, 255, 255, .7); padding-top: 4rem; position: relative; }
.site-footer::before { content: ""; position: absolute; inset-inline: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--gold-500), var(--firouzeh-500)); }
.site-footer h3 { color: #fff; font-size: 1rem; margin-bottom: 1rem; }
.site-footer a { color: rgba(255, 255, 255, .75); }
.site-footer a:hover { color: var(--gold-400); }
.footer-links { list-style: none; padding: 0; display: grid; gap: .5rem; }
.footer-bottom { border-top: 1px solid rgba(255, 255, 255, .08); margin-top: 3rem; padding: 1.25rem 0; font-size: .8rem; }

/* Reveal on scroll */
.js .reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.js .reveal.in { opacity: 1; transform: none; }

/* ==========================================================================
   AUTH
   ========================================================================== */
.auth-wrap { min-height: 100vh; display: grid; grid-template-columns: 1fr; }
@media (min-width: 992px) { .auth-wrap { grid-template-columns: 1.05fr 1fr; } }
.auth-aside { position: relative; overflow: hidden; background: radial-gradient(800px 400px at 100% 0%, rgba(20, 163, 163, .35), transparent 60%), linear-gradient(160deg, var(--ink-800), var(--ink-900)); color: #fff; padding: 3rem; display: none; flex-direction: column; justify-content: space-between; }
@media (min-width: 992px) { .auth-aside { display: flex; } }
.auth-aside::before { content: ""; position: absolute; inset: 0; background-image: var(--girih); background-size: 80px; opacity: .06; }
.auth-aside > * { position: relative; }
.auth-main { display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; }
.auth-card { width: 100%; max-width: 440px; }
.role-switch { display: grid; grid-template-columns: repeat(3, 1fr); gap: .35rem; padding: .35rem; background: #ece9df; border-radius: 14px; }
.role-switch input { position: absolute; opacity: 0; pointer-events: none; }
.role-switch label { text-align: center; padding: .6rem .25rem; border-radius: 11px; font-weight: 700; font-size: .88rem; color: var(--muted); cursor: pointer; transition: all .2s var(--ease); display: flex; flex-direction: column; align-items: center; gap: .15rem; min-height: 44px; justify-content: center; }
.role-switch label i { font-size: 1.15rem; }
.role-switch input:checked + label { background: #fff; color: var(--firouzeh-700); box-shadow: var(--shadow-sm); }
.role-switch input:focus-visible + label { outline: 3px solid var(--gold-500); }

/* ==========================================================================
   PANEL (admin / teacher / student)
   ========================================================================== */
.panel-body { background: #f3f1ea; }
.panel-shell { display: flex; min-height: 100vh; }
.sidebar { width: 272px; flex-shrink: 0; background: var(--ink-800) !important; color: rgba(255, 255, 255, .78); position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; overflow-y: auto; }
.sidebar::before { content: ""; position: absolute; inset: 0; background-image: var(--girih); background-size: 70px; opacity: .035; pointer-events: none; }
.sidebar-brand { display: flex; align-items: center; gap: .75rem; padding: 1.35rem 1.25rem; border-bottom: 1px solid rgba(255, 255, 255, .07); position: relative; }
.sidebar-brand img { width: 44px; height: 44px; object-fit: contain; }
.sidebar-brand strong { color: #fff; font-size: .95rem; display: block; line-height: 1.4; }
.sidebar-brand small { color: var(--gold-400); font-size: .72rem; }
.side-nav { list-style: none; margin: 0; padding: 1rem .75rem; display: grid; gap: .2rem; position: relative; }
.side-nav .label { font-size: .7rem; font-weight: 700; color: rgba(255, 255, 255, .4); padding: .9rem .8rem .35rem; }
.side-nav a { display: flex; align-items: center; gap: .75rem; padding: .7rem .85rem; border-radius: 12px; color: rgba(255, 255, 255, .78); font-weight: 600; font-size: .92rem; transition: background-color .15s, color .15s; min-height: 44px; }
.side-nav a i { font-size: 1.1rem; width: 22px; text-align: center; }
.side-nav a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.side-nav a { position: relative; }
.side-nav a.active { background: linear-gradient(270deg, rgba(20, 163, 163, .28), rgba(20, 163, 163, .08)); color: #fff; }
.side-nav a.active::before { content: ""; position: absolute; inset-inline-start: -.75rem; top: 20%; bottom: 20%; width: 4px; border-radius: 4px 0 0 4px; background: var(--gold-500); }
.side-nav a.active i { color: var(--gold-400); }
.side-nav a .count { margin-inline-start: auto; background: var(--gold-500); color: var(--gold-ink); font-size: .7rem; font-weight: 800; padding: .05rem .5rem; border-radius: 999px; }
.sidebar-foot { margin-top: auto; padding: 1rem; border-top: 1px solid rgba(255, 255, 255, .07); position: relative; }
.sidebar-user { display: flex; align-items: center; gap: .7rem; }
.sidebar-user strong { color: #fff; font-size: .88rem; display: block; }
.sidebar-user small { font-size: .72rem; color: rgba(255, 255, 255, .55); }
@media (max-width: 991.98px) { .sidebar.offcanvas-lg { width: 280px; height: 100%; position: fixed; } }

.panel-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.panel-topbar { position: sticky; top: 0; z-index: 1020; background: rgba(243, 241, 234, .9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border); padding: .85rem 1.5rem; display: flex; align-items: center; gap: 1rem; }
.panel-topbar h1 { font-size: 1.15rem; margin: 0; font-weight: 800; }
.panel-topbar .date { font-size: .8rem; color: var(--muted); }
.panel-content { padding: 1.5rem; flex: 1; }
@media (max-width: 575.98px) { .panel-content { padding: 1rem; } .panel-topbar { padding: .75rem 1rem; } }

.welcome { position: relative; overflow: hidden; border-radius: var(--radius-lg); background: linear-gradient(135deg, var(--firouzeh-700), var(--ink-800)); color: #fff; padding: 1.75rem; }
.welcome::before { content: ""; position: absolute; inset: 0; background-image: var(--girih); background-size: 70px; opacity: .07; }
.welcome > * { position: relative; }
.welcome h2 { color: #fff; font-size: 1.35rem; margin-bottom: .25rem; }
.welcome p { color: rgba(255, 255, 255, .75); margin: 0; }

.kpi { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; display: flex; align-items: center; gap: 1rem; height: 100%; box-shadow: var(--shadow-sm); }
.kpi-value { font-size: 1.6rem; font-weight: 900; color: var(--ink-800); line-height: 1.2; }
.kpi-label { font-size: .82rem; color: var(--muted); font-weight: 600; }

.quick-link { display: flex; flex-direction: column; gap: .75rem; padding: 1.25rem; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--border); color: var(--text); height: 100%; transition: border-color .2s, box-shadow .2s, transform .2s var(--ease); }
.quick-link:hover { color: var(--text); border-color: var(--firouzeh-500); box-shadow: var(--shadow); transform: translateY(-2px); }
.quick-link strong { font-size: .98rem; }
.quick-link small { color: var(--muted); }

/* Attendance chooser */
.att-row { display: flex; align-items: center; gap: .75rem; padding: .7rem .9rem; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.att-row + .att-row { margin-top: .5rem; }
.att-options { margin-inline-start: auto; display: inline-flex; gap: .25rem; background: #f3f1ea; padding: .25rem; border-radius: 10px; }
.att-options input { position: absolute; opacity: 0; }
.att-options label { padding: .35rem .75rem; border-radius: 8px; font-size: .8rem; font-weight: 700; color: var(--muted); cursor: pointer; min-height: 34px; display: inline-flex; align-items: center; }
.att-options input:checked + label.p { background: var(--success); color: #fff; }
.att-options input:checked + label.l { background: var(--warning); color: #fff; }
.att-options input:checked + label.a { background: var(--danger); color: #fff; }
.att-options input:focus-visible + label { outline: 2px solid var(--gold-500); }

/* Gate scanner */
.scanner { border-radius: var(--radius-lg); background: linear-gradient(160deg, var(--ink-700), var(--ink-900)); color: #fff; padding: 1.75rem; position: relative; overflow: hidden; }
.scanner::before { content: ""; position: absolute; inset: 0; background-image: var(--girih); background-size: 70px; opacity: .05; }
.scanner > * { position: relative; }
.scanner .form-control { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .2); color: #fff; font-size: 1.15rem; min-height: 56px; letter-spacing: 2px; }
.scanner .form-control::placeholder { color: rgba(255, 255, 255, .45); letter-spacing: 0; }
.scanner .form-control:focus { border-color: var(--gold-500); box-shadow: 0 0 0 .25rem rgba(245, 185, 15, .2); }
.scan-line { height: 3px; border-radius: 3px; background: linear-gradient(90deg, transparent, var(--gold-500), transparent); animation: scan 2.2s ease-in-out infinite; }
@keyframes scan { 0%, 100% { transform: translateX(-30%); opacity: .4 } 50% { transform: translateX(30%); opacity: 1 } }

/* Report card */
.report-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.report-head { background: var(--ink-800); color: #fff; padding: 1.25rem 1.5rem; display: flex; align-items: center; gap: 1rem; }
.report-head img { width: 56px; height: 56px; object-fit: contain; }
.report-head h2 { color: #fff; font-size: 1.1rem; margin: 0; }
.report-head p { color: var(--gold-400); margin: 0; font-size: .8rem; }
.report-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .75rem 1.5rem; padding: 1.25rem 1.5rem; border-bottom: 1px dashed var(--border); font-size: .9rem; }
.report-meta span { color: var(--muted); font-size: .78rem; display: block; }
.report-table th, .report-table td { text-align: center; }
.report-table td:first-child, .report-table th:first-child { text-align: start; }

/* Toast */
.toast-stack { position: fixed; top: 1rem; inset-inline-start: 1rem; z-index: 1090; display: grid; gap: .5rem; max-width: min(380px, calc(100vw - 2rem)); }
.toast-x { display: flex; align-items: flex-start; gap: .65rem; background: #fff; border-radius: 14px; padding: .85rem 1rem; box-shadow: var(--shadow-lg); border-inline-start: 4px solid var(--success); font-size: .9rem; animation: toastIn .35s var(--ease); }
.toast-x.danger { border-color: var(--danger); }
.toast-x.warning { border-color: var(--gold-500); }
.toast-x i { font-size: 1.2rem; color: var(--success); }
.toast-x.danger i { color: var(--danger); }
.toast-x.warning i { color: var(--gold-600); }
.toast-x .btn-close { margin-inline-start: auto; font-size: .7rem; }
@keyframes toastIn { from { opacity: 0; transform: translateY(-8px) } to { opacity: 1; transform: none } }

/* Print */
@media print {
    .no-print, .sidebar, .panel-topbar, .site-nav, .topbar, .site-footer, .toast-stack { display: none !important; }
    body, .panel-body { background: #fff !important; }
    .panel-content { padding: 0 !important; }
    .report-card { border: 1px solid #999; }
    .report-head { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Mobile refinements */
@media (max-width: 575.98px) {
    .brand-mark { width: 44px; height: 44px; }
    .brand-text strong { font-size: .88rem; }
    .brand-text small { display: none; }
    .site-nav .navbar-brand { max-width: calc(100% - 56px); margin-inline-end: 0; }
    .section { padding: 3.5rem 0; }
}

/* ==========================================================================
   RESPONSIVE LAYER
   ========================================================================== */

/* Sidebar column keeps its colour for the full page height */
@media (min-width: 992px) {
    .panel-shell { background: linear-gradient(to left, var(--ink-800) 272px, transparent 272px); }
}

/* Stacked tables: rows become cards on small screens */
@media (max-width: 767.98px) {
    .table-stack thead { display: none; }
    .table-stack, .table-stack tbody, .table-stack tr, .table-stack td { display: block; width: 100%; }
    .table-stack tbody tr { padding: .9rem 1rem; border-bottom: 1px solid var(--border); }
    .table-stack tbody tr:hover { background: transparent; }
    .table-stack tbody td { border: 0; padding: .3rem 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; text-align: end; }
    .table-stack tbody td::before { content: attr(data-label); color: var(--muted); font-size: .78rem; font-weight: 600; text-align: start; flex-shrink: 0; }
    .table-stack tbody td[data-label=""]::before, .table-stack tbody td:not([data-label])::before { display: none; }
    .table-stack tbody td.cell-main { padding-bottom: .6rem; justify-content: flex-start; text-align: start; }
    .table-stack tbody td.cell-actions { justify-content: flex-end; padding-top: .6rem; gap: .4rem; }
    .table-stack tbody td.cell-actions::before { display: none; }
    .table-responsive:has(.table-stack) { overflow: visible; }
}

/* KPI tiles stack their icon on narrow screens */
@media (max-width: 575.98px) {
    .kpi { flex-direction: column; align-items: flex-start; gap: .65rem; padding: 1rem; }
    .kpi-value { font-size: 1.35rem; }
    .kpi-label { font-size: .78rem; line-height: 1.6; }
    .quick-link { padding: 1rem; gap: .6rem; }
    .quick-link small { display: none; }
    .welcome { padding: 1.25rem; }
    .welcome h2 { font-size: 1.15rem; }
    .welcome .btn { flex: 1 1 auto; }
    .card-x-header { padding: .9rem 1rem; }
    .card-x-body { padding: 1rem; }
    .report-head { flex-wrap: wrap; padding: 1rem; }
    .report-head h2 { font-size: 1rem; }
    .report-meta { grid-template-columns: 1fr 1fr; padding: 1rem; }
}

/* Attendance rows: controls drop below the name on phones */
@media (max-width: 575.98px) {
    .att-row { flex-wrap: wrap; }
    .att-options { width: 100%; margin-inline-start: 0; }
    .att-options label { flex: 1; justify-content: center; }
}

/* Names never break mid-word inside table cells */
.cell-main strong { white-space: nowrap; }
@media (max-width: 767.98px) { .cell-main strong { white-space: normal; } }
.score-input { max-width: 140px; }

/* Jalali date picker */
.jdp { position: relative; }
.jdp-trigger { background-image: none; min-height: 44px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-x-header .jdp-trigger { min-height: 36px; padding: .35rem .85rem; font-size: .85rem; }
.jdp-panel { position: absolute; z-index: 1050; top: calc(100% + 6px); inset-inline-start: 0; width: 296px; max-width: calc(100vw - 2rem); background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: .75rem; }
.card-x-header .jdp-panel { inset-inline-start: auto; inset-inline-end: 0; }
.jdp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.jdp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.jdp-dow { font-size: .72rem; color: var(--muted); font-weight: 700; padding: .25rem 0; }
.jdp-day { border: 0; background: transparent; border-radius: 10px; height: 36px; font-size: .88rem; font-weight: 600; color: var(--text); }
.jdp-day:hover:not([disabled]) { background: var(--firouzeh-50); color: var(--firouzeh-700); }
.jdp-day.is-today { box-shadow: inset 0 0 0 1.5px var(--gold-500); }
.jdp-day.is-selected { background: var(--firouzeh-600); color: #fff; }
.jdp-day[disabled] { color: #c8c4b8; cursor: not-allowed; }
.jdp-foot { border-top: 1px solid var(--border); margin-top: .5rem; padding-top: .5rem; text-align: center; }

/* Photo upload slot */
.photo-slot { position: relative; width: 88px; height: 88px; border-radius: 50%; border: 2px dashed var(--border); display: grid; place-items: center; background: #faf9f5; color: #b9b4a6; font-size: 2rem; }
.photo-slot img { position: absolute; inset: -2px; width: 88px; height: 88px; }

/* Grade entry: name and score on one line on phones */
@media (max-width: 767.98px) {
    .grades-table tbody tr { display: flex; align-items: center; gap: .75rem; }
    .grades-table tbody td.cell-main { flex: 1; min-width: 0; padding: 0; }
    .grades-table tbody td[data-label="نمره"] { width: auto; padding: 0; }
    .grades-table tbody td[data-label="نمره"]::before { display: none; }
    .grades-table .score-input { width: 96px; }
}
.scanner .role-switch label { color: rgba(255, 255, 255, .75); }
.scanner .role-switch input:checked + label { color: var(--firouzeh-700); }

/* ==========================================================================
   V2 — PUBLIC SITE REDESIGN
   ========================================================================== */
html, .site-body { overflow-x: clip; }
.scroll-progress { position: fixed; top: 0; inset-inline-start: 0; height: 3px; width: 100%; transform-origin: right; transform: scaleX(var(--p, 0)); background: linear-gradient(270deg, var(--gold-500), var(--firouzeh-500)); z-index: 1100; pointer-events: none; }

/* Navbar */
.site-nav { padding: .65rem 0; }
.site-nav .navbar-toggler { border: 0; padding: .5rem; width: 46px; height: 46px; border-radius: 12px; background: var(--firouzeh-50); }
.site-nav .navbar-toggler:focus { box-shadow: none; }
.burger { display: grid; gap: 5px; width: 22px; margin: auto; }
.burger span { height: 2px; border-radius: 2px; background: var(--ink-800); }
.burger span:nth-child(2) { width: 70%; margin-inline-start: auto; }
.nav-cta { margin-inline-start: 1rem; }
@media (min-width: 1200px) {
    .site-nav .nav-link { position: relative; white-space: nowrap; }
    .site-nav .nav-link.active { background: transparent; }
    .site-nav .nav-link.active::after { content: ""; position: absolute; inset-inline: .9rem; bottom: .15rem; height: 3px; border-radius: 3px; background: var(--gold-500); }
}
@media (max-width: 1199.98px) {
    /* backdrop-filter would trap the fixed offcanvas inside the navbar */
    .site-nav { backdrop-filter: none; background: #fff; }
    .site-offcanvas { --bs-offcanvas-width: min(320px, 86vw); background: var(--paper); }
    .site-offcanvas .offcanvas-body { display: flex; flex-direction: column; }
    .site-offcanvas .nav-link { font-size: 1.05rem; padding: .85rem 1rem !important; }
    .nav-cta { margin: 1.25rem 0 0; }
}

/* Aurora background (hero & page heroes) */
.aurora { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.aurora span { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .55; animation: drift 18s ease-in-out infinite alternate; }
.aurora span:nth-child(1) { width: 520px; height: 520px; background: #12a5a5; top: -180px; inset-inline-end: -120px; }
.aurora span:nth-child(2) { width: 420px; height: 420px; background: #f5b90f; bottom: -220px; inset-inline-start: -120px; opacity: .25; animation-duration: 22s; }
.aurora span:nth-child(3) { width: 300px; height: 300px; background: #1d6f9f; top: 30%; inset-inline-start: 35%; opacity: .35; animation-duration: 26s; }
@keyframes drift { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(-60px, 40px, 0) scale(1.15); } }

/* Hero v2 */
.hero-x { position: relative; overflow: hidden; color: #fff; background: linear-gradient(160deg, #0b2433, #061722 70%); padding: clamp(3rem, 7vw, 6rem) 0 clamp(4rem, 8vw, 7rem); isolation: isolate; }
.hero-x::before { content: ""; position: absolute; inset: 0; background-image: var(--girih); background-size: 84px; opacity: .06; z-index: 0; }
.hero-x::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 120px; background: linear-gradient(to bottom, transparent, rgba(6, 23, 34, .6)); pointer-events: none; }
.hero-title { margin: 0 0 .75rem; line-height: 1; }
.hero-typo { width: min(560px, 100%); height: auto; filter: drop-shadow(0 10px 30px rgba(0, 0, 0, .4)); }
.hero-sub { color: var(--gold-400); font-weight: 700; letter-spacing: .2px; margin-bottom: 1rem; }
.hero-lead { color: rgba(255, 255, 255, .78); font-size: 1.08rem; max-width: 34rem; line-height: 2; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; justify-content: center; }
@media (min-width: 992px) { .hero-actions { justify-content: flex-start; } }
.pulse-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gold-400); box-shadow: 0 0 0 0 rgba(248, 201, 61, .7); animation: pulse 2s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 10px rgba(248, 201, 61, 0); } 100% { box-shadow: 0 0 0 0 rgba(248, 201, 61, 0); } }
.hero-stage { position: relative; }
.hero-stage .hero-frame { transform: rotate(-1.5deg); transition: transform .6s var(--ease); }
.hero-stage:hover .hero-frame { transform: rotate(0); }
@keyframes float { 50% { transform: translateY(-10px); } }

/* Ticker */
.ticker { background: var(--gold-500); color: var(--gold-ink); padding: .65rem 0; position: relative; z-index: 2; }
.ticker-label { flex-shrink: 0; display: inline-flex; align-items: center; gap: .4rem; background: var(--ink-800); color: var(--gold-400); font-weight: 800; font-size: .82rem; padding: .3rem .8rem; border-radius: 999px; }
.ticker-track { overflow: hidden; flex: 1; mask-image: linear-gradient(to left, transparent, #000 5%, #000 95%, transparent); }
.ticker-move { display: inline-flex; gap: 3rem; white-space: nowrap; animation: marquee 40s linear infinite; }
.ticker-move:hover { animation-play-state: paused; }
.ticker-move a { color: var(--gold-ink); font-weight: 700; font-size: .92rem; position: relative; }
.ticker-move a::before { content: "◆"; font-size: .55rem; margin-inline-end: .75rem; opacity: .5; vertical-align: middle; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(50%); } }

/* Principal */
.principal { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 2.5rem; align-items: center; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: clamp(1.5rem, 4vw, 3rem); box-shadow: var(--shadow); overflow: hidden; }
.principal::after { content: "”"; position: absolute; inset-inline-end: 2rem; top: -1.5rem; font-size: 12rem; line-height: 1; font-family: Georgia, serif; color: var(--firouzeh-50); pointer-events: none; }
.principal > * { position: relative; z-index: 1; }
.principal-mark { width: 150px; height: 170px; border-radius: 24px; background: var(--ink-800); display: grid; place-items: center; padding: 18px; box-shadow: 0 0 0 6px var(--firouzeh-50), var(--shadow); }
.principal-mark img { width: 100%; height: 100%; object-fit: contain; }
.principal-quote { font-size: clamp(1rem, 1.6vw, 1.15rem); line-height: 2.2; color: var(--ink-700); margin: .25rem 0 1.25rem; }
.principal-sign { display: flex; align-items: center; gap: .75rem; }
.principal-sign strong { font-weight: 900; color: var(--ink-800); }
.principal-sign span { color: var(--muted); font-size: .85rem; padding-inline-start: .75rem; border-inline-start: 2px solid var(--gold-500); }
@media (max-width: 767.98px) { .principal { grid-template-columns: 1fr; text-align: center; gap: 1.25rem; } .principal-mark { margin: 0 auto; width: 110px; height: 125px; } .principal-sign { justify-content: center; } }

/* Majors */
.majors-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 1.25rem; }
.major-card { position: relative; display: flex; flex-direction: column; gap: .5rem; padding: 1.6rem; border-radius: var(--radius-lg); background: var(--surface); border: 1px solid var(--border); color: var(--text); overflow: hidden; transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s; }
.major-card::before { content: ""; position: absolute; top: -60px; left: -60px; width: 150px; height: 150px; border-radius: 50%; background: var(--firouzeh-50); transition: transform .5s var(--ease); z-index: 0; }
.major-card.is-tech::before { background: var(--gold-100); }
.major-card > * { position: relative; z-index: 1; }
a.major-card:hover { color: var(--text); transform: translateY(-5px); box-shadow: var(--shadow-lg); border-color: transparent; }
a.major-card:hover::before { transform: scale(2.6); }
.major-icon { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; font-size: 1.6rem; background: linear-gradient(135deg, var(--firouzeh-600), var(--ink-700)); color: #fff; margin-bottom: .5rem; box-shadow: 0 10px 20px -10px rgba(15, 124, 128, .8); }
.major-card.is-tech .major-icon { background: linear-gradient(135deg, var(--gold-400), var(--gold-600)); color: var(--gold-ink); box-shadow: 0 10px 20px -10px rgba(201, 146, 7, .8); }
.major-card .badge-x { align-self: flex-start; }
.major-card h3 { font-size: 1.15rem; margin: .25rem 0 0; }
.major-card p { color: var(--muted); font-size: .92rem; margin: 0; flex: 1; }
.major-more { font-weight: 800; font-size: .85rem; color: var(--firouzeh-600); margin-top: .5rem; }
.branch-head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }

/* Bento */

/* News v2 */
.news-card.is-featured .news-thumb { aspect-ratio: 16 / 8.2; }
.news-card.is-featured .news-title { font-size: 1.35rem; }
.news-card.is-featured .news-thumb .placeholder-mark i { font-size: 4.5rem; }
.news-list { display: grid; gap: .75rem; }
.news-row { display: flex; align-items: center; gap: 1rem; padding: 1rem; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--border); color: var(--text); transition: border-color .2s, box-shadow .2s, transform .2s var(--ease); }
.news-row:hover { color: var(--text); border-color: var(--firouzeh-100); box-shadow: var(--shadow); transform: translateX(-3px); }
.news-row strong { font-size: .95rem; line-height: 1.7; }
.news-row-date { flex-shrink: 0; width: 62px; height: 62px; border-radius: 14px; background: var(--firouzeh-50); color: var(--firouzeh-700); display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: .72rem; font-weight: 700; line-height: 1.3; }
.news-row-date b { font-size: 1.35rem; font-weight: 900; }
.news-toolbar { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; margin-bottom: 1.75rem; }
.chip-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.chip { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem 1rem; border-radius: 999px; background: var(--surface); border: 1px solid var(--border); color: var(--ink-700); font-weight: 700; font-size: .88rem; min-height: 40px; transition: all .2s; }
.chip span { font-size: .72rem; background: var(--firouzeh-50); color: var(--firouzeh-700); border-radius: 999px; padding: 0 .45rem; }
.chip:hover { border-color: var(--firouzeh-500); color: var(--firouzeh-700); }
.chip.active { background: var(--ink-800); border-color: var(--ink-800); color: #fff; }
.chip.active span { background: var(--gold-500); color: var(--gold-ink); }
.search-box { position: relative; min-width: min(100%, 280px); }
.search-box i { position: absolute; inset-inline-start: .9rem; top: 50%; transform: translateY(-50%); color: var(--muted); }
.search-box .form-control { padding-inline-start: 2.5rem; border-radius: 999px; }

/* Article */
.article-hero { padding: 3.5rem 0 3rem; }
.article-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; color: rgba(255, 255, 255, .7); font-size: .88rem; }
.article-cover { margin: -5rem 0 0; position: relative; z-index: 2; border: 6px solid #fff; box-shadow: var(--shadow-lg); }
.article-lead { font-size: 1.15rem; font-weight: 700; color: var(--firouzeh-700); line-height: 2; padding-inline-start: 1rem; border-inline-start: 4px solid var(--gold-500); }
.article-share { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--border); }
.article-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1.5rem; }
.article-nav-link { display: block; padding: 1rem 1.25rem; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface); color: var(--text); }
.article-nav-link:hover { border-color: var(--firouzeh-500); color: var(--text); }
.article-nav-link small { display: block; color: var(--muted); margin-bottom: .25rem; }
.article-nav-link strong { font-size: .92rem; }
@media (max-width: 575.98px) { .article-nav { grid-template-columns: 1fr; } .article-cover { margin-top: -3rem; border-width: 4px; } }

/* Social buttons */
.social-btn { width: 42px; height: 42px; display: inline-grid; place-items: center; border-radius: 12px; background: rgba(255, 255, 255, .08); color: #fff; font-size: 1.1rem; border: 1px solid rgba(255, 255, 255, .12); transition: background-color .2s, transform .2s; }
.social-btn:hover { background: var(--gold-500); color: var(--gold-ink); transform: translateY(-2px); }
.social-btn.light { background: var(--firouzeh-50); color: var(--firouzeh-700); border-color: var(--firouzeh-100); }
.social-btn.light:hover { background: var(--firouzeh-600); color: #fff; }

/* Page hero v2 */
.page-hero { padding: 3.5rem 0 3.25rem; background: linear-gradient(160deg, var(--ink-800), #061722); }
.page-hero .aurora span { opacity: .35; }
.page-hero .aurora span:nth-child(2) { opacity: .1; }
.page-hero-lead { color: rgba(255, 255, 255, .72); max-width: 40rem; }

/* Gallery */
.gallery-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; }
.gallery-strip a { border-radius: var(--radius); overflow: hidden; aspect-ratio: 1; display: block; }
.gallery-strip a:first-child { grid-column: span 2; grid-row: span 2; }
.gallery-strip img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.gallery-strip a:hover img { transform: scale(1.06); }
@media (max-width: 575.98px) { .gallery-strip { grid-template-columns: repeat(2, 1fr); } }
.masonry { columns: 3 260px; column-gap: 1rem; }
.masonry-item { break-inside: avoid; margin: 0 0 1rem; border-radius: var(--radius); overflow: hidden; background: var(--surface); border: 1px solid var(--border); }
.masonry-item a { display: block; overflow: hidden; }
.masonry-item img { width: 100%; height: auto; display: block; transition: transform .5s var(--ease); }
.masonry-item a:hover img { transform: scale(1.04); }
.masonry-item figcaption { padding: .75rem 1rem; }
.masonry-item figcaption strong { display: block; font-size: .92rem; }
.masonry-item figcaption span { font-size: .78rem; color: var(--muted); }
.lightbox { position: fixed; inset: 0; z-index: 2000; background: rgba(4, 14, 21, .92); backdrop-filter: blur(6px); display: grid; place-items: center; padding: 1rem; }
.lightbox[hidden] { display: none; }
.lightbox figure { margin: 0; max-width: min(1100px, 100%); text-align: center; }
.lightbox img { max-width: 100%; max-height: 80vh; border-radius: 12px; }
.lightbox figcaption { color: #fff; margin-top: .75rem; font-weight: 600; }
.lb-close, .lb-nav { position: absolute; width: 48px; height: 48px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .12); color: #fff; font-size: 1.25rem; display: grid; place-items: center; }
.lb-close:hover, .lb-nav:hover { background: var(--gold-500); color: var(--gold-ink); }
.lb-close { top: 1rem; inset-inline-end: 1rem; }
.lb-prev { inset-inline-start: 1rem; top: 50%; transform: translateY(-50%); }
.lb-next { inset-inline-end: 1rem; top: 50%; transform: translateY(-50%); }

/* FAQ */
.faq .accordion-item { border: 1px solid var(--border); border-radius: var(--radius) !important; overflow: hidden; margin-bottom: .75rem; background: var(--surface); }
.faq .accordion-button { font-weight: 800; font-size: 1rem; color: var(--ink-800); padding: 1.1rem 1.25rem; gap: 1rem; }
.faq .accordion-button:not(.collapsed) { background: var(--firouzeh-50); color: var(--firouzeh-700); box-shadow: none; }
.faq .accordion-button:focus { box-shadow: 0 0 0 .2rem rgba(15, 124, 128, .2); }
.faq .accordion-button::after { margin-inline-start: auto; margin-inline-end: 0; }
.faq .accordion-body { color: var(--muted); line-height: 2; }

/* Map */
.map-card { position: relative; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--border); box-shadow: var(--shadow); height: 360px; }
.map-card iframe { width: 100%; height: 100%; border: 0; filter: saturate(.8); }
.map-btn { position: absolute; bottom: 1rem; inset-inline-start: 1rem; }

/* Footer v2 */
.footer-title { color: #fff; font-size: 1rem; font-weight: 800; margin-bottom: 1rem; }
.footer-contact li { display: flex; gap: .65rem; align-items: flex-start; }
.footer-contact i { color: var(--gold-500); margin-top: .2rem; }
.to-top { position: fixed; bottom: 1.25rem; inset-inline-end: 1.25rem; width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: var(--firouzeh-600); color: #fff !important; box-shadow: var(--shadow-lg); opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .3s, transform .3s; z-index: 1000; }
.to-top.show { opacity: 1; transform: none; pointer-events: auto; }
.to-top:hover { background: var(--gold-500); color: var(--gold-ink) !important; }

/* 404 */
.error-code { font-size: clamp(6rem, 18vw, 10rem); font-weight: 900; line-height: 1; background: linear-gradient(135deg, var(--firouzeh-600), var(--gold-500)); -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: 1rem; }

@media (prefers-reduced-motion: reduce) { .ticker-move { animation: none; } .aurora span { animation: none; } }

/* Admin: gallery & settings */
.dropzone { display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: 2rem 1rem; border: 2px dashed var(--border); border-radius: var(--radius); background: #faf9f5; text-align: center; cursor: pointer; transition: border-color .2s, background-color .2s; }
.dropzone i { font-size: 2.2rem; color: var(--firouzeh-500); }
.dropzone small { color: var(--muted); }
.dropzone:hover, .dropzone.is-over { border-color: var(--firouzeh-500); background: var(--firouzeh-50); }
.dropzone-count { font-weight: 800; color: var(--firouzeh-700); }
.admin-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1rem; }
.admin-gallery figure { margin: 0; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; background: #fff; }
.admin-gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.admin-gallery figcaption { display: flex; align-items: center; gap: .5rem; padding: .6rem .75rem; font-size: .85rem; }
.admin-gallery figcaption form { margin-inline-start: auto; }
.settings-save { position: sticky; bottom: 0; z-index: 5; display: flex; gap: .75rem; padding: 1rem; margin: 0 -1rem; background: rgba(243, 241, 234, .92); backdrop-filter: blur(8px); border-top: 1px solid var(--border); }
.min-w-0 { min-width: 0; }

/* Homepage majors: compact two-column tiles on phones */
@media (max-width: 575.98px) {
    .majors-compact { grid-template-columns: 1fr 1fr; gap: .75rem; }
    .majors-compact .major-card { padding: 1rem; align-items: center; text-align: center; }
    .majors-compact .major-card p, .majors-compact .major-more, .majors-compact .badge-x { display: none; }
    .majors-compact .major-icon { width: 48px; height: 48px; font-size: 1.35rem; margin: 0; }
    .majors-compact .major-card h3 { font-size: .95rem; }
}

/* Admin: setup checklist */
.setup-item { display: flex; align-items: flex-start; gap: .75rem; padding: .85rem 1.35rem; border-bottom: 1px solid #f0ede5; font-size: .9rem; }
.setup-item:last-child { border-bottom: 0; }
.setup-item i { margin-top: .2rem; }
