:root {
    --brand-teal: #0F6E56;
    --brand-teal-light: #E1F5EE;
    --brand-amber: #BA7517;
    --brand-amber-light: #FAEEDA;
    --brand-red: #A32D2D;
    --brand-red-light: #FCEBEB;
}

body {
    font-family: 'Cairo', sans-serif;
    background: #F7F7F5;
}

.sidebar {
    width: 230px;
    min-height: 100vh;
    background: #fff;
    border-left: 1px solid #e5e5e0;
    padding: 1.5rem 1rem;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
}

.sidebar-brand {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--brand-teal);
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.organization-logo { width: 46px; height: 46px; object-fit: contain; border: 1px solid #eceae3; border-radius: 10px; background: #fff; }
.organization-logo-preview { width: 110px; height: 110px; object-fit: contain; border: 1px solid #eceae3; border-radius: 12px; background: #fff; }
.organization-profile-form { max-width: 820px; }
.working-days-grid { display: grid; grid-template-columns: repeat(7, minmax(75px, 1fr)); gap: 8px; }
.working-day-option { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 6px; border: 1px solid #deded8; border-radius: 8px; background: #fff; cursor: pointer; }
.working-day-option:has(input:checked) { border-color: var(--brand-teal); background: var(--brand-teal-light); color: var(--brand-teal); font-weight: 600; }
@media (max-width: 768px) { .working-days-grid { grid-template-columns: repeat(2, 1fr); } }

.student-identity { display: inline-flex; align-items: center; gap: 0.55rem; }
.student-avatar { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; border: 1px solid #e3e3dd; flex: 0 0 38px; }
.student-avatar-placeholder { display: inline-flex; align-items: center; justify-content: center; background: var(--brand-teal-light); color: var(--brand-teal); font-weight: 700; }
.camera-panel { max-width: 520px; padding: 12px; border: 1px solid #deded8; border-radius: 12px; background: #f7f7f5; }
.camera-panel video, .camera-panel img { display: block; width: 100%; max-height: 390px; object-fit: cover; border-radius: 10px; background: #222; }
.event-image { width: 100%; height: 230px; object-fit: cover; border-radius: 10px; }
.event-description { white-space: pre-line; line-height: 1.8; }

.schedule-today > h2 { color: var(--brand-teal); }
@media print {
    .sidebar, .schedule-actions, .schedule-filters { display: none !important; }
    .content { padding: 0; }
    .schedule-day { break-inside: avoid; }
    body { background: #fff; }
}

.sidebar .nav-link {
    color: #444;
    padding: 0.6rem 0.75rem;
    border-radius: 8px;
    margin-bottom: 4px;
}

.sidebar .nav-link.active {
    background: var(--brand-teal-light);
    color: var(--brand-teal);
    font-weight: 500;
}

.sidebar .nav-link:hover {
    background: #f2f2ef;
}

.trial-badge {
    background: var(--brand-amber-light);
    color: var(--brand-amber);
    font-size: 12px;
    padding: 6px 10px;
    border-radius: 8px;
    text-align: center;
}

.content {
    flex: 1;
    min-width: 0;
    padding: 2rem;
}

.kpi-card {
    background: #fff;
    border-radius: 12px;
    padding: 1.25rem;
    border: 1px solid #eceae3;
}

.kpi-value {
    font-size: 1.6rem;
    font-weight: 700;
}

.badge-pending { background: var(--brand-amber-light); color: var(--brand-amber); }
.badge-overdue { background: var(--brand-red-light); color: var(--brand-red); }
.badge-paid { background: var(--brand-teal-light); color: var(--brand-teal); }

.auth-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F7F7F5;
}

.auth-card {
    background: #fff;
    border-radius: 12px;
    padding: 2.5rem;
    width: 100%;
    max-width: 380px;
    border: 1px solid #eceae3;
}

.auth-brand {
    display: block;
    width: fit-content;
    margin: 0 auto 1.25rem;
    color: var(--brand-teal);
    font-size: 1.6rem;
    font-weight: 700;
    text-decoration: none;
}

.auth-brand:hover { color: #0a5543; }

.mobile-menu-toggle,
.mobile-menu-overlay {
    display: none;
}

/* الهاتف: يبقى اتجاه العربية واضحًا دون أن يحجب الشريط مساحة نموذج العمل. */
@media (max-width: 991.98px) {
    .app-shell {
        flex-direction: column !important;
    }

    .sidebar {
        width: min(82vw, 310px);
        /* A fixed drawer needs an explicit viewport height; min-height lets
           it grow below the screen and makes its final links unreachable. */
        height: 100vh;
        height: 100dvh;
        min-height: 0;
        max-height: 100dvh;
        position: fixed;
        z-index: 1045;
        top: 0;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        border-left: 1px solid #e5e5e0;
        border-bottom: 0;
        padding: 1rem;
        padding-bottom: calc(1rem + env(safe-area-inset-bottom));
        transform: translateX(105%);
        transition: transform .22s ease;
        box-shadow: -12px 0 30px rgba(0,0,0,.12);
    }

    .sidebar.mobile-open { transform: translateX(0); }

    .mobile-menu-toggle {
        display: inline-flex;
        align-items: center;
        gap: .45rem;
        position: fixed;
        z-index: 1040;
        top: .8rem;
        right: .8rem;
        border: 1px solid #d9ddd9;
        border-radius: 9px;
        padding: .48rem .72rem;
        color: var(--brand-teal);
        background: #fff;
        box-shadow: 0 4px 14px rgba(0,0,0,.08);
        font: inherit;
        font-size: .86rem;
        font-weight: 700;
    }

    .mobile-menu-overlay.mobile-open {
        display: block;
        position: fixed;
        z-index: 1040;
        inset: 0;
        width: 100%;
        border: 0;
        background: rgba(15, 24, 20, .35);
    }

    .sidebar-brand {
        flex: 0 0 auto;
        margin: 0 0 1rem;
        font-size: 0.95rem;
        white-space: nowrap;
    }

    .organization-logo {
        width: 34px;
        height: 34px;
    }

    .sidebar .trial-badge,
    .sidebar .nav-link {
        flex: 0 0 auto;
        margin-bottom: 4px;
        white-space: nowrap;
    }

    .sidebar .nav-link.mt-auto {
        margin-inline-start: 0 !important;
    }

    .content {
        width: 100%;
        padding: 4.5rem 1rem 1rem;
    }

    .kpi-card {
        padding: 1rem;
    }

    .table-responsive {
        border-radius: 10px;
    }
}

@media (max-width: 575.98px) {
    .content {
        padding: 0.75rem;
    }

    .auth-card {
        margin: 1rem;
        padding: 1.5rem;
    }

    .btn {
        min-height: 38px;
    }
}

/* =========================================================
   SANAD UI REFRESH — 2026-08-27
   Shared shell, navigation, dashboard, and reusable surfaces.
   ========================================================= */
:root {
    --ui-bg: #f5f7f6;
    --ui-surface: #ffffff;
    --ui-surface-soft: #f9fbfa;
    --ui-text: #17231f;
    --ui-muted: #6f7d77;
    --ui-border: #e4eae7;
    --ui-primary: #0f6e56;
    --ui-primary-dark: #0a5845;
    --ui-primary-soft: #e8f6f0;
    --ui-blue: #3267c8;
    --ui-blue-soft: #eaf1ff;
    --ui-amber: #b86c12;
    --ui-amber-soft: #fff3dd;
    --ui-red: #b63b3b;
    --ui-red-soft: #fdeeee;
    --ui-shadow: 0 10px 32px rgba(25, 53, 43, .06);
    --ui-shadow-hover: 0 16px 40px rgba(25, 53, 43, .10);
    --sidebar-width: 286px;
    --topbar-height: 78px;
}

html, body { min-height: 100%; }
body { background: var(--ui-bg); color: var(--ui-text); font-weight: 500; }
a { color: var(--ui-primary); }

.app-shell { min-height: 100vh; display: flex; align-items: stretch; }
.sidebar {
    width: var(--sidebar-width);
    min-width: var(--sidebar-width);
    height: 100vh;
    min-height: 100vh;
    position: sticky;
    top: 0;
    padding: 0;
    background: #fff;
    border-left: 1px solid var(--ui-border);
    display: flex;
    flex-direction: column;
    z-index: 1025;
    overflow: hidden;
}
.sidebar-brand-wrap { padding: 20px 18px 14px; }
.sidebar-brand { margin: 0; display: flex; align-items: center; gap: 11px; color: var(--ui-text); text-decoration: none; }
.sidebar-brand:hover { color: var(--ui-text); }
.organization-logo { width: 46px; height: 46px; border-radius: 14px; border: 1px solid var(--ui-border); box-shadow: 0 5px 16px rgba(15, 110, 86, .08); }
.organization-logo-placeholder { display: inline-flex; align-items: center; justify-content: center; background: var(--ui-primary-soft); color: var(--ui-primary); font-size: 1.3rem; }
.sidebar-brand-text { min-width: 0; display: flex; flex-direction: column; line-height: 1.35; }
.sidebar-brand-text strong { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: .98rem; font-weight: 800; }
.sidebar-brand-text small { margin-top: 2px; color: var(--ui-muted); font-size: .68rem; letter-spacing: .02em; }
.trial-badge { margin: 0 18px 12px; border-radius: 10px; font-weight: 700; }
.sidebar-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0 12px 20px; scrollbar-width: thin; scrollbar-color: #d8e2de transparent; }
.nav-section { margin-top: 11px; }
.nav-section-label { padding: 9px 10px 5px; color: #98a49f; font-size: .68rem; font-weight: 800; letter-spacing: .04em; }
.sidebar .nav-link { min-height: 42px; display: flex; align-items: center; gap: 11px; margin: 2px 0; padding: 9px 11px; border-radius: 11px; color: #50605a; font-size: .84rem; font-weight: 600; transition: .18s ease; }
.sidebar .nav-link i { width: 20px; color: #80908a; font-size: 1rem; text-align: center; transition: .18s ease; }
.sidebar .nav-link span:not(.nav-count) { flex: 1; }
.sidebar .nav-link:hover { background: #f5f8f6; color: var(--ui-text); transform: translateX(-2px); }
.sidebar .nav-link.active { background: var(--ui-primary-soft); color: var(--ui-primary); font-weight: 800; box-shadow: inset -3px 0 0 var(--ui-primary); }
.sidebar .nav-link.active i { color: var(--ui-primary); }
.nav-count { min-width: 23px; height: 23px; padding: 0 6px; border-radius: 99px; display: inline-flex; align-items: center; justify-content: center; background: var(--ui-red); color: white; font-size: .68rem; font-weight: 800; }
.sidebar-footer { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-top: 1px solid var(--ui-border); background: #fff; }
.sidebar-user { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; }
.user-avatar { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: var(--ui-primary); color: #fff; font-size: .92rem; font-weight: 800; }
.sidebar-user-meta { min-width: 0; display: flex; flex-direction: column; }
.sidebar-user-meta strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .78rem; font-weight: 800; }
.sidebar-user-meta small { color: var(--ui-muted); font-size: .68rem; }
.logout-link { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; color: var(--ui-red); background: var(--ui-red-soft); text-decoration: none; }
.logout-link:hover { color: #8c2929; background: #f9dddd; }

.app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topbar { height: var(--topbar-height); min-height: var(--topbar-height); position: sticky; top: 0; z-index: 1015; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 30px; background: rgba(255,255,255,.94); backdrop-filter: blur(12px); border-bottom: 1px solid var(--ui-border); }
.topbar-eyebrow { color: var(--ui-muted); font-size: .68rem; margin-bottom: 2px; }
.topbar-title { color: var(--ui-text); font-size: 1.02rem; font-weight: 800; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.academic-year-pill { min-height: 36px; display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; border-radius: 10px; background: var(--ui-surface-soft); border: 1px solid var(--ui-border); color: #53625c; font-size: .75rem; font-weight: 700; }
.academic-year-pill i { color: var(--ui-primary); }
.topbar-icon-btn { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; border: 1px solid var(--ui-border); background: #fff; color: #57655f; text-decoration: none; }
.topbar-icon-btn:hover { color: var(--ui-primary); background: var(--ui-primary-soft); }
.content { width: 100%; max-width: 1600px; margin: 0 auto; padding: 28px 30px 48px; }

/* Reusable buttons and surfaces */
.btn { border-radius: 10px; font-weight: 700; }
.btn-brand { background: var(--ui-primary); border-color: var(--ui-primary); color: #fff; box-shadow: 0 5px 14px rgba(15, 110, 86, .18); }
.btn-brand:hover, .btn-brand:focus { background: var(--ui-primary-dark); border-color: var(--ui-primary-dark); color: #fff; }
.btn-primary-soft { background: var(--ui-primary-soft); border: 1px solid #cfeadd; color: var(--ui-primary); }
.btn-primary-soft:hover { background: #d9f0e6; color: var(--ui-primary-dark); }
.card, .kpi-card, .panel-card { border-color: var(--ui-border); }
.table { --bs-table-bg: transparent; }
.table > :not(caption) > * > * { padding-top: .82rem; padding-bottom: .82rem; border-bottom-color: #edf1ef; }
.table thead th { color: var(--ui-muted); font-size: .76rem; font-weight: 800; background: #fafcfb; }
.form-control, .form-select { min-height: 42px; border-radius: 10px; border-color: #dfe6e2; }
.form-control:focus, .form-select:focus { border-color: #8bc7b5; box-shadow: 0 0 0 .2rem rgba(15,110,86,.10); }

/* Dashboard */
.dashboard-hero { min-height: 118px; margin-bottom: 23px; padding: 24px 26px; display: flex; align-items: center; justify-content: space-between; gap: 24px; background: linear-gradient(135deg, #ffffff 0%, #f2fbf7 100%); border: 1px solid #dcebe5; border-radius: 20px; box-shadow: var(--ui-shadow); overflow: hidden; position: relative; }
.dashboard-hero::after { content: ''; position: absolute; width: 180px; height: 180px; border-radius: 50%; left: -60px; top: -75px; background: rgba(15,110,86,.055); }
.dashboard-kicker { display: inline-flex; align-items: center; gap: 6px; color: var(--ui-primary); font-size: .72rem; font-weight: 800; }
.dashboard-kicker i { color: #d99a21; }
.dashboard-hero h1 { margin: 6px 0 5px; font-size: clamp(1.35rem, 2vw, 1.85rem); font-weight: 800; }
.dashboard-hero p { margin: 0; color: var(--ui-muted); font-size: .86rem; }
.quick-actions { display: flex; flex-wrap: wrap; gap: 9px; position: relative; z-index: 1; }
.quick-actions .btn { min-height: 42px; display: inline-flex; align-items: center; gap: 7px; padding-inline: 14px; font-size: .78rem; }
.metric-card { height: 100%; min-height: 144px; padding: 18px; display: flex; align-items: flex-start; gap: 13px; position: relative; overflow: hidden; background: var(--ui-surface); border: 1px solid var(--ui-border); border-radius: 16px; color: var(--ui-text); text-decoration: none; box-shadow: 0 7px 23px rgba(20,48,38,.035); transition: .18s ease; }
.metric-card:hover { color: var(--ui-text); transform: translateY(-3px); border-color: #d4e2dc; box-shadow: var(--ui-shadow-hover); }
.metric-icon { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.05rem; }
.metric-icon-teal { background: var(--ui-primary-soft); color: var(--ui-primary); }
.metric-icon-amber { background: var(--ui-amber-soft); color: var(--ui-amber); }
.metric-icon-red { background: var(--ui-red-soft); color: var(--ui-red); }
.metric-icon-blue { background: var(--ui-blue-soft); color: var(--ui-blue); }
.metric-body { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.metric-label { color: var(--ui-muted); font-size: .73rem; font-weight: 700; }
.metric-value { margin-top: 3px; font-size: 1.65rem; line-height: 1.2; font-weight: 800; }
.metric-note { margin-top: 7px; color: #89958f; font-size: .68rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.metric-note-danger { color: var(--ui-red); }
.metric-arrow { position: absolute; left: 14px; top: 14px; color: #b6c0bc; font-size: .78rem; }
.section-heading { margin: 30px 0 13px; display: flex; justify-content: space-between; align-items: end; gap: 16px; }
.section-eyebrow { color: var(--ui-primary); font-size: .67rem; font-weight: 800; }
.section-heading h2, .panel-header h2 { margin: 2px 0 0; font-size: 1rem; font-weight: 800; }
.section-period { display: inline-flex; align-items: center; gap: 6px; color: var(--ui-muted); font-size: .72rem; }
.finance-card { height: 132px; padding: 18px 19px 14px; position: relative; overflow: hidden; background: #fff; border: 1px solid var(--ui-border); border-radius: 16px; box-shadow: 0 7px 23px rgba(20,48,38,.035); }
.finance-card-head { display: flex; align-items: center; gap: 9px; color: var(--ui-muted); font-size: .73rem; font-weight: 700; }
.finance-icon { width: 31px; height: 31px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; }
.finance-icon.success { color: var(--ui-primary); background: var(--ui-primary-soft); }
.finance-icon.danger { color: var(--ui-red); background: var(--ui-red-soft); }
.finance-card strong { display: block; margin-top: 15px; font-size: 1.28rem; font-weight: 800; }
.finance-accent { position: absolute; bottom: 0; right: 0; left: 0; height: 3px; }
.finance-accent.success { background: #4fac89; }
.finance-accent.danger { background: #d46b6b; }
.panel-card { padding: 20px; background: #fff; border: 1px solid var(--ui-border); border-radius: 18px; box-shadow: var(--ui-shadow); }
.panel-header { margin-bottom: 17px; display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.panel-link { display: inline-flex; align-items: center; gap: 5px; color: var(--ui-muted); font-size: .7rem; font-weight: 700; text-decoration: none; }
.panel-link:hover { color: var(--ui-primary); }
.occupancy-list, .stock-alert-list { display: flex; flex-direction: column; gap: 8px; }
.occupancy-item { padding: 11px 0; border-bottom: 1px solid #edf1ef; }
.occupancy-item:last-child { border-bottom: 0; }
.occupancy-meta { display: flex; align-items: center; gap: 11px; }
.class-icon { width: 38px; height: 38px; flex: 0 0 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 11px; background: #f1f7f4; color: var(--ui-primary); }
.occupancy-meta strong { font-size: .77rem; font-weight: 800; }
.occupancy-meta .d-flex span { color: var(--ui-muted); font-size: .68rem; }
.occupancy-list .progress { margin-top: 8px; height: 6px; background: #edf2f0; border-radius: 999px; }
.occupancy-list .progress-bar { border-radius: 999px; background: linear-gradient(90deg, #178666, #4eb18e); }
.occupancy-percent { min-width: 42px; padding: 5px 6px; border-radius: 9px; background: var(--ui-primary-soft); color: var(--ui-primary); text-align: center; font-size: .67rem; font-weight: 800; }
.stock-alert-item { min-height: 63px; padding: 10px 0; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid #edf1ef; }
.stock-alert-item:last-child { border-bottom: 0; }
.stock-alert-icon { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: var(--ui-red-soft); color: var(--ui-red); }
.stock-alert-item strong, .stock-alert-item small { display: block; }
.stock-alert-item strong { font-size: .76rem; font-weight: 800; }
.stock-alert-item small { margin-top: 2px; color: var(--ui-muted); font-size: .65rem; }
.status-badge { display: inline-flex; align-items: center; justify-content: center; padding: 5px 8px; border-radius: 999px; font-size: .63rem; font-weight: 800; }
.status-badge.danger { background: var(--ui-red-soft); color: var(--ui-red); }
.status-badge.neutral { background: #f1f4f2; color: #617069; }
.empty-state { min-height: 120px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #96a19d; text-align: center; }
.empty-state > i { font-size: 1.6rem; margin-bottom: 7px; color: #aeb9b5; }
.empty-state.success > i { color: var(--ui-primary); }
.empty-state p { margin: 0; font-size: .74rem; }
.empty-state.large { min-height: 230px; padding: 28px; background: #fff; border: 1px dashed #d6e0dc; border-radius: 18px; }
.empty-state.large h3 { margin: 2px 0 4px; color: var(--ui-text); font-size: .93rem; font-weight: 800; }
.empty-state.large p { margin-bottom: 14px; }
.event-card { overflow: hidden; background: #fff; border: 1px solid var(--ui-border); border-radius: 17px; box-shadow: 0 7px 23px rgba(20,48,38,.035); transition: .18s ease; }
.event-card:hover { transform: translateY(-3px); box-shadow: var(--ui-shadow-hover); }
.event-cover { height: 170px; position: relative; overflow: hidden; background: #edf4f1; }
.event-cover img { width: 100%; height: 100%; object-fit: cover; }
.event-cover-placeholder { display: flex; align-items: center; justify-content: center; color: var(--ui-primary); font-size: 2rem; background: linear-gradient(135deg, #e9f7f1, #f6fbf9); }
.event-image-count { position: absolute; top: 10px; left: 10px; padding: 5px 8px; border-radius: 9px; background: rgba(24,33,29,.76); color: #fff; font-size: .62rem; }
.event-card-body { padding: 15px 16px 17px; }
.event-card-body h3 { margin: 9px 0 5px; font-size: .9rem; font-weight: 800; }
.event-card-body p { min-height: 36px; margin: 0 0 10px; color: var(--ui-muted); font-size: .69rem; line-height: 1.75; }
.event-card-body a { display: inline-flex; align-items: center; gap: 5px; color: var(--ui-primary); font-size: .68rem; font-weight: 800; text-decoration: none; }

@media print {
    .topbar, .mobile-menu-toggle { display: none !important; }
    .app-main { display: block; }
}

@media (max-width: 1199.98px) {
    :root { --sidebar-width: 260px; }
    .content { padding-inline: 22px; }
    .topbar { padding-inline: 22px; }
}

@media (max-width: 991.98px) {
    .app-shell { display: block; }
    .sidebar { width: min(84vw, 310px); min-width: 0; height: 100dvh; min-height: 0; position: fixed; right: 0; top: 0; z-index: 1045; padding: 0; transform: translateX(105%); box-shadow: -16px 0 34px rgba(13,32,25,.16); }
    .sidebar.mobile-open { transform: translateX(0); }
    .sidebar-brand-wrap { padding-top: 17px; }
    .sidebar-scroll { padding-bottom: 14px; }
    .sidebar .nav-link { white-space: normal; }
    .sidebar .nav-link.mt-auto { margin: 2px 0 !important; }
    .mobile-menu-toggle { top: 16px; right: 16px; z-index: 1030; min-height: 40px; border-radius: 11px; }
    .mobile-menu-overlay.mobile-open { z-index: 1040; }
    .topbar { height: 72px; min-height: 72px; padding-right: 120px; padding-left: 16px; }
    .topbar-eyebrow { display: none; }
    .academic-year-pill span { display: none; }
    .content { padding: 20px 16px 38px; }
    .dashboard-hero { align-items: flex-start; flex-direction: column; padding: 20px; }
    .quick-actions { width: 100%; }
}

@media (max-width: 575.98px) {
    .topbar { padding-right: 112px; }
    .topbar-title { font-size: .9rem; }
    .topbar-icon-btn { display: none; }
    .content { padding: 14px 12px 30px; }
    .dashboard-hero { min-height: 0; margin-bottom: 14px; border-radius: 15px; }
    .dashboard-hero h1 { font-size: 1.2rem; }
    .quick-actions .btn { flex: 1; justify-content: center; }
    .metric-card { min-height: 122px; border-radius: 14px; }
    .metric-value { font-size: 1.4rem; }
    .section-heading { align-items: flex-start; }
    .section-period { display: none; }
    .panel-card { padding: 16px; border-radius: 15px; }
    .finance-card { height: 120px; }
}

/* ===== Students UI refresh / Phase 2 ===== */
.page-hero { min-height: 138px; margin-bottom: 20px; padding: 24px 26px; display: flex; align-items: center; justify-content: space-between; gap: 20px; position: relative; overflow: hidden; background: linear-gradient(135deg,#fff 0%,#f2faf7 100%); border: 1px solid var(--ui-border); border-radius: 20px; box-shadow: var(--ui-shadow); }
.page-hero::after { content:""; width: 170px; height: 170px; position:absolute; left:-65px; top:-75px; border-radius:50%; background:rgba(15,110,86,.045); }
.page-hero > * { position:relative; z-index:1; }
.page-eyebrow { display:inline-flex; align-items:center; gap:6px; color:var(--ui-primary); font-size:.69rem; font-weight:800; }
.page-hero h1 { margin:5px 0 4px; font-size:1.45rem; font-weight:800; }
.page-hero p { margin:0; color:var(--ui-muted); font-size:.77rem; }
.page-primary-action { min-height:44px; padding-inline:16px; display:inline-flex; align-items:center; gap:7px; }
.compact-page-hero { min-height:118px; }
.back-link { display:inline-flex; align-items:center; gap:5px; color:var(--ui-primary); text-decoration:none; font-size:.68rem; font-weight:800; }
.hero-student-identity { display:flex; align-items:center; gap:12px; padding:10px 12px; background:rgba(255,255,255,.8); border:1px solid #dce8e3; border-radius:14px; }
.hero-student-identity .student-avatar { width:44px; height:44px; flex-basis:44px; }
.summary-tile { min-height:91px; padding:15px 16px; display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--ui-border); border-radius:15px; box-shadow:0 6px 20px rgba(20,48,38,.03); }
.summary-tile-icon { width:42px; height:42px; flex:0 0 42px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; background:var(--ui-primary-soft); color:var(--ui-primary); }
.summary-tile-icon.success { background:var(--ui-primary-soft); color:var(--ui-primary); }.summary-tile-icon.blue { background:var(--ui-blue-soft); color:var(--ui-blue); }.summary-tile-icon.amber { background:var(--ui-amber-soft); color:var(--ui-amber); }
.summary-tile small,.summary-tile strong { display:block; }.summary-tile small { color:var(--ui-muted); font-size:.65rem; font-weight:700; }.summary-tile strong { margin-top:2px; font-size:1.23rem; font-weight:800; }
.filter-card { padding:14px; background:#fff; border:1px solid var(--ui-border); border-radius:15px; box-shadow:0 5px 18px rgba(20,48,38,.025); }
.student-filters { display:grid; grid-template-columns:minmax(240px,1fr) 190px 170px auto auto; gap:10px; align-items:center; }
.filter-search { position:relative; }.filter-search > i { position:absolute; right:13px; top:50%; transform:translateY(-50%); color:#93a09a; z-index:2; }.filter-search .form-control { padding-right:37px; }
.btn-dark-soft { background:#293832; color:#fff; border-color:#293832; }.btn-dark-soft:hover { background:#1f2b26; color:#fff; border-color:#1f2b26; }.filter-reset { color:var(--ui-muted); font-size:.7rem; text-decoration:none; white-space:nowrap; }
.data-card { background:#fff; border:1px solid var(--ui-border); border-radius:18px; box-shadow:var(--ui-shadow); overflow:hidden; }.data-card-header { min-height:72px; padding:16px 19px; display:flex; justify-content:space-between; align-items:center; gap:15px; border-bottom:1px solid #edf1ef; }.data-card-header h2 { margin:0; font-size:.88rem; font-weight:800; }.data-card-header p { margin:3px 0 0; color:var(--ui-muted); font-size:.65rem; }.results-chip { padding:5px 9px; border-radius:999px; background:#f1f5f3; color:#5d6a65; font-size:.63rem; font-weight:800; }
.modern-table thead th { padding:11px 16px; background:#f8faf9; color:#71807a; border-bottom:1px solid #e8eeeb; font-size:.63rem; font-weight:800; white-space:nowrap; }.modern-table tbody td { padding:13px 16px; border-color:#edf1ef; font-size:.72rem; vertical-align:middle; }.modern-table tbody tr:hover { background:#fbfcfc; }
.student-cell { display:flex; flex-direction:column; align-items:flex-start; gap:3px; min-width:160px; }.student-cell .student-identity > span:last-child { color:var(--ui-text); font-weight:800; }.student-cell > small { margin-right:47px; color:#9aa4a0; font-size:.58rem; }
.class-chip { display:inline-flex; align-items:center; gap:5px; padding:6px 8px; border-radius:9px; background:#f3f6f5; color:#53625c; font-size:.64rem; font-weight:700; white-space:nowrap; }.table-primary-text { font-weight:700; color:#46534e; }.guardian-cell strong,.guardian-cell small { display:block; }.guardian-cell strong { font-size:.7rem; }.guardian-cell small { margin-top:2px; color:var(--ui-muted); font-size:.59rem; text-align:right; }
.status-pill { display:inline-flex; align-items:center; gap:5px; padding:5px 8px; border-radius:999px; font-size:.61rem; font-weight:800; white-space:nowrap; }.status-pill i { width:6px; height:6px; border-radius:50%; }.status-pill.active { background:var(--ui-primary-soft); color:var(--ui-primary); }.status-pill.active i { background:var(--ui-primary); }.status-pill.inactive { background:#f1f3f2; color:#75817c; }.status-pill.inactive i { background:#9da7a3; }
.icon-action-btn { width:34px; height:34px; padding:0; display:inline-flex; align-items:center; justify-content:center; border:1px solid #e1e7e4; border-radius:9px; color:#65716c; background:#fff; }.icon-action-btn:hover,.icon-action-btn:focus { background:#f3f7f5; color:var(--ui-primary); border-color:#d5e2dd; }.student-actions .dropdown-menu { min-width:185px; padding:6px; border-color:#e2e9e6; border-radius:11px; box-shadow:0 13px 30px rgba(22,45,36,.12); }.student-actions .dropdown-item { padding:8px 9px; display:flex; align-items:center; gap:8px; border-radius:7px; font-size:.67rem; }.student-actions form { margin:0; }.readonly-label { color:#95a09c; font-size:.62rem; }
.student-empty-state { min-height:260px; padding:30px; }.student-empty-state h3 { margin:3px 0 5px; color:var(--ui-text); font-size:.9rem; font-weight:800; }.student-empty-state p { margin-bottom:14px; }
.student-profile-form { padding-bottom:86px; }.student-form-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:18px; align-items:start; }.student-form-main { min-width:0; display:flex; flex-direction:column; gap:16px; }.student-form-aside { position:sticky; top:90px; display:flex; flex-direction:column; gap:14px; }
.form-section-card { scroll-margin-top:92px; overflow:hidden; background:#fff; border:1px solid var(--ui-border); border-radius:17px; box-shadow:0 6px 22px rgba(20,48,38,.03); }.form-section-header { min-height:74px; padding:15px 18px; display:flex; align-items:center; gap:12px; border-bottom:1px solid #edf1ef; }.form-section-header-actions { justify-content:space-between; }.form-section-icon { width:39px; height:39px; flex:0 0 39px; display:inline-flex; align-items:center; justify-content:center; border-radius:11px; background:var(--ui-primary-soft); color:var(--ui-primary); }.form-section-icon.amber { background:var(--ui-amber-soft); color:var(--ui-amber); }.form-section-icon.blue { background:var(--ui-blue-soft); color:var(--ui-blue); }.form-section-icon.red { background:var(--ui-red-soft); color:var(--ui-red); }.form-section-header h2 { margin:0; font-size:.82rem; font-weight:800; }.form-section-header p { margin:3px 0 0; color:var(--ui-muted); font-size:.62rem; }.form-section-body { padding:19px; }.student-profile-form .form-label { margin-bottom:6px; color:#44524c; font-size:.67rem; font-weight:800; }.student-profile-form .form-control,.student-profile-form .form-select { min-height:42px; border-color:#dfe6e3; border-radius:10px; font-size:.72rem; }.student-profile-form .form-control:focus,.student-profile-form .form-select:focus { border-color:#80b7a7; box-shadow:0 0 0 .2rem rgba(15,110,86,.08); }.required-mark { color:var(--ui-red); }.optional-label { color:#a0aaa6; font-size:.57rem; font-weight:600; }.tuition-inline-preview { min-height:42px; padding:10px 12px; display:flex; align-items:center; gap:7px; background:#f6f9f8; border-radius:10px; }.tuition-inline-preview .form-text { margin:0; }.current-file-link { margin-bottom:7px; display:flex; align-items:center; gap:5px; color:var(--ui-primary); font-size:.61rem; text-decoration:none; }.attachment-item { min-height:46px; padding:7px 9px; display:flex; justify-content:space-between; align-items:center; gap:10px; border:1px solid #e8edeb; border-radius:10px; }.attachment-item + .attachment-item { margin-top:7px; }.attachment-item span { display:flex; align-items:center; gap:7px; font-size:.66rem; }.attachment-item a { color:#34443e; text-decoration:none; }
.profile-photo-card,.form-jump-card { padding:17px; background:#fff; border:1px solid var(--ui-border); border-radius:16px; box-shadow:0 6px 22px rgba(20,48,38,.03); }.photo-preview-shell { width:92px; height:92px; margin:0 auto 11px; overflow:hidden; display:flex; align-items:center; justify-content:center; border-radius:22px; background:#eef7f3; color:var(--ui-primary); font-size:2rem; }.photo-preview-shell img { width:100%; height:100%; object-fit:cover; }.profile-photo-card h3 { margin:0; text-align:center; font-size:.79rem; font-weight:800; }.profile-photo-card p { margin:5px 0 13px; color:var(--ui-muted); text-align:center; font-size:.6rem; line-height:1.7; }.sticky-camera-panel { max-width:none; background:#fff; }.form-jump-card > span { display:block; margin-bottom:8px; color:#9aa5a0; font-size:.57rem; font-weight:800; }.form-jump-card a { padding:8px 7px; display:flex; align-items:center; gap:8px; border-radius:8px; color:#53615b; font-size:.64rem; font-weight:700; text-decoration:none; }.form-jump-card a:hover { color:var(--ui-primary); background:#f3f8f6; }
.sticky-form-actions { min-height:70px; padding:11px 22px; position:fixed; right:var(--sidebar-width); left:0; bottom:0; z-index:1010; display:flex; align-items:center; justify-content:space-between; gap:15px; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); border-top:1px solid #dfe7e3; box-shadow:0 -10px 30px rgba(28,48,40,.06); }.sticky-form-actions strong,.sticky-form-actions small { display:block; }.sticky-form-actions strong { font-size:.72rem; }.sticky-form-actions small { margin-top:2px; color:var(--ui-muted); font-size:.58rem; }
.compact-table thead th,.compact-table tbody td { padding-top:10px; padding-bottom:10px; }
@media (max-width: 1199.98px) { .student-form-layout { grid-template-columns:minmax(0,1fr) 245px; }.student-filters { grid-template-columns:minmax(220px,1fr) 160px 150px auto auto; } }
@media (max-width: 991.98px) { .student-filters { grid-template-columns:1fr 1fr; }.filter-search { grid-column:1 / -1; }.student-form-layout { grid-template-columns:1fr; }.student-form-aside { position:static; grid-row:1; }.profile-photo-card { max-width:none; }.photo-preview-shell { width:78px; height:78px; }.sticky-form-actions { right:0; }.student-profile-form { padding-bottom:96px; } }
@media (max-width: 575.98px) { .page-hero { min-height:0; padding:18px; align-items:flex-start; flex-direction:column; border-radius:15px; }.page-hero h1 { font-size:1.2rem; }.page-primary-action { width:100%; justify-content:center; }.hero-student-identity { width:100%; }.student-summary-grid .summary-tile { min-height:82px; padding:12px; }.summary-tile-icon { width:36px; height:36px; flex-basis:36px; }.summary-tile strong { font-size:1.05rem; }.student-filters { grid-template-columns:1fr; }.filter-search { grid-column:auto; }.student-filters .btn { width:100%; }.filter-reset { text-align:center; }.data-card-header { padding:14px; }.modern-table thead th,.modern-table tbody td { padding-inline:12px; }.form-section-header { padding:13px; }.form-section-header-actions { align-items:flex-start; flex-direction:column; }.form-section-body { padding:14px; }.sticky-form-actions { padding:9px 12px; }.sticky-form-actions > div:first-child { display:none; }.sticky-form-actions > div:last-child { width:100%; }.sticky-form-actions .btn { flex:1; }.student-profile-form { padding-bottom:82px; } }

/* SANAD UI REFRESH — PHASE 3: Classes & Attendance */
.class-summary-grid,.attendance-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.attendance-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.summary-tile-icon.red{background:var(--ui-red-soft);color:var(--ui-red)}.class-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.class-card{padding:20px;background:#fff;border:1px solid var(--ui-border);border-radius:18px;box-shadow:var(--ui-shadow);transition:.18s ease}.class-card:hover{transform:translateY(-2px);box-shadow:var(--ui-shadow-hover)}.class-card-top{display:flex;align-items:center;justify-content:space-between}.class-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:13px;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:1.15rem}.class-card h2{margin:15px 0 14px;font-size:1rem;font-weight:800}.class-meta-row{padding:8px 0;display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #f0f3f2;font-size:.67rem}.class-meta-row span{color:var(--ui-muted)}.class-meta-row span i{margin-left:5px}.class-meta-row strong{font-weight:800}.occupancy-block{margin-top:15px;padding:13px;border-radius:12px;background:#f8faf9;font-size:.65rem}.occupancy-block .progress{height:7px;margin:9px 0 6px;background:#e7eeeb;border-radius:99px}.occupancy-block .progress-bar{background:var(--ui-primary);border-radius:99px}.occupancy-block small{color:var(--ui-muted)}.compact-page-hero{min-height:130px}.class-form-modern{max-width:900px;margin:auto}.class-form-modern .form-label{font-size:.68rem;font-weight:800}.class-form-modern .form-control,.class-form-modern .form-select,.class-form-modern .input-group-text{min-height:43px;border-color:#dfe6e3;border-radius:10px;font-size:.72rem}.class-form-modern .input-group>.form-control{border-radius:0 10px 10px 0}.class-form-modern .input-group>.input-group-text{border-radius:10px 0 0 10px;background:#f7f9f8;color:var(--ui-muted)}.form-actions-inline{margin-top:16px;display:flex;justify-content:flex-end;gap:9px}.attendance-date-picker{min-width:220px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.7)}.attendance-date-picker label{display:block;margin-bottom:4px;color:var(--ui-muted);font-size:.6rem;font-weight:800}.attendance-date-picker .form-control{min-height:38px;border-radius:9px;font-size:.7rem}.attendance-filters{display:flex;align-items:center;gap:10px}.attendance-filters .form-select{max-width:220px;min-height:41px;border-radius:10px;font-size:.7rem}.attendance-time-form{display:flex;align-items:center;gap:5px;min-width:145px}.attendance-time-form .form-control{width:105px;min-height:34px;border-radius:9px;font-size:.67rem}.attendance-time-form .icon-action-btn{width:32px;height:32px}.status-pill.danger{background:var(--ui-red-soft);color:var(--ui-red)}.status-pill.danger i{background:var(--ui-red)}.status-pill.pending{background:var(--ui-amber-soft);color:var(--ui-amber)}.status-pill.pending i{background:var(--ui-amber)}.attendance-status-actions{display:flex;gap:6px}.attendance-status-actions form{margin:0}.attendance-state-btn{min-height:32px;padding:5px 9px;border:1px solid #e0e7e4;border-radius:9px;background:#fff;color:#66736d;font-family:inherit;font-size:.62rem;font-weight:800}.attendance-state-btn.present:hover,.attendance-state-btn.present.selected{background:var(--ui-primary-soft);border-color:#c8e5d9;color:var(--ui-primary)}.attendance-state-btn.absent:hover,.attendance-state-btn.absent.selected{background:var(--ui-red-soft);border-color:#f1cece;color:var(--ui-red)}.attendance-state-btn:disabled{opacity:1}.attendance-table td{white-space:nowrap}
@media(max-width:1199.98px){.class-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.attendance-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767.98px){.class-summary-grid,.attendance-summary-grid{grid-template-columns:1fr 1fr}.class-card-grid{grid-template-columns:1fr}.attendance-hero{align-items:flex-start;flex-direction:column}.attendance-date-picker{width:100%}.attendance-filters{align-items:stretch;flex-direction:column}.attendance-filters .form-select{max-width:none}.attendance-filters .btn{width:100%}.form-actions-inline .btn{flex:1}}
@media(max-width:575.98px){.class-summary-grid,.attendance-summary-grid{grid-template-columns:1fr}.class-card{padding:16px}}

/* SANAD UI REFRESH — PHASE 4: Finance & Collections */
.finance-page-hero,.statement-hero{margin-bottom:20px}.page-hero-actions{display:flex;flex-wrap:wrap;gap:8px;position:relative;z-index:2}.page-hero-actions .btn{display:inline-flex;align-items:center;gap:7px}.danger-hero{background:linear-gradient(135deg,#fff 0%,#fff5f4 100%);border-color:#f0d9d6}.danger-hero .page-eyebrow{color:var(--ui-red)}
.finance-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.finance-summary-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.summary-tile-link{position:relative;color:inherit;text-decoration:none;transition:.18s ease}.summary-tile-link:hover{color:inherit;transform:translateY(-2px);box-shadow:var(--ui-shadow-hover)}.summary-tile-arrow{position:absolute;left:14px;top:14px;color:#aab5b0;font-size:.75rem}.summary-tile-icon.amber{background:var(--ui-amber-soft);color:var(--ui-amber)}.summary-tile-icon.blue{background:var(--ui-blue-soft);color:var(--ui-blue)}
.finance-workspace{padding:0;overflow:hidden}.finance-toolbar-wrap{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:18px}.finance-toolbar-wrap h2,.collection-card-head h2{margin:0;font-size:.86rem;font-weight:800}.finance-toolbar-wrap p,.collection-card-head p{margin:3px 0 0;color:var(--ui-muted);font-size:.62rem}.finance-search-form{display:flex;align-items:center;gap:7px}.search-input-wrap{position:relative;min-width:330px}.search-input-wrap i{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#94a19b;font-size:.78rem}.search-input-wrap .form-control{padding-right:36px;font-size:.7rem}.finance-status-tabs{padding:0 18px;display:flex;gap:4px;overflow-x:auto;border-top:1px solid #eff3f1;border-bottom:1px solid #e8eeeb;background:#fcfdfc}.finance-status-tab{padding:11px 12px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border-bottom:2px solid transparent;color:#78857f;font-size:.64rem;font-weight:800;text-decoration:none}.finance-status-tab:hover{color:var(--ui-primary)}.finance-status-tab.active{color:var(--ui-primary);border-color:var(--ui-primary);background:#f5faf8}.finance-table .student-cell-link{color:inherit;text-decoration:none}.invoice-description{min-width:170px;display:flex;flex-direction:column}.invoice-description strong{font-size:.69rem;font-weight:800}.invoice-description small{margin-top:3px;color:var(--ui-muted);font-size:.57rem}.date-cell{display:flex;align-items:center;gap:6px;color:#52615b;font-size:.64rem}.date-cell i{color:#9ca7a2}.date-cell small{margin-right:3px}.status-pill.neutral{background:#f0f2f1;color:#6f7a75}.status-pill.neutral i{background:#9aa39f}.status-pill.blue{background:var(--ui-blue-soft);color:var(--ui-blue)}.status-pill.blue i{background:var(--ui-blue)}.finance-actions-menu{min-width:190px;padding:7px;border-radius:12px;border-color:#e1e8e4;box-shadow:0 12px 30px rgba(20,48,38,.12)}.finance-actions-menu .dropdown-item{padding:8px 10px;display:flex;align-items:center;gap:8px;border-radius:8px;font-size:.65rem;font-weight:700}.finance-actions-menu form{margin:0}.finance-actions-menu button.dropdown-item{width:100%;border:0;background:transparent;text-align:right}.finance-modal .modal-content,.finance-modal{border-radius:16px;border:0}.finance-modal .modal-header,.finance-modal .modal-footer{border-color:#edf1ef}.payment-balance-box{margin-bottom:18px;padding:14px;border:1px solid #dbeae4;border-radius:12px;background:#f5faf8}.payment-balance-box span,.payment-balance-box small{display:block;color:var(--ui-muted);font-size:.61rem}.payment-balance-box strong{display:block;margin:3px 0;font-size:1.25rem;color:var(--ui-primary)}
.finance-filter-card,.statement-period-card,.collection-card,.fee-generation-card{padding:18px}.collection-card{background:linear-gradient(135deg,#fff,#f8fcfa)}.collection-card-head{margin-bottom:15px;display:flex;align-items:center;gap:10px}.count-chip{min-width:28px;height:28px;padding:0 8px;display:inline-flex;align-items:center;justify-content:center;border-radius:99px;background:#f0f5f3;color:#52615b;font-size:.64rem;font-weight:800}.overdue-date{color:var(--ui-red)}.receipt-link{display:block;color:var(--ui-primary);font-size:.61rem;text-decoration:none}.receipt-link+.receipt-link{margin-top:3px}.receipt-link i{margin-left:4px}.empty-state{min-height:180px;padding:30px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--ui-muted)}.empty-state>i{margin-bottom:9px;color:#aeb9b4;font-size:1.55rem}.empty-state strong{color:#52615b;font-size:.76rem}.empty-state span{margin-top:4px;font-size:.61rem}
.fee-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.fee-plan-card{padding:18px;background:#fff;border:1px solid var(--ui-border);border-radius:17px;box-shadow:var(--ui-shadow)}.fee-plan-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}.fee-category-badge{padding:5px 8px;border-radius:8px;background:#f3f6f5;color:#65726d;font-size:.57rem;font-weight:800}.fee-plan-card h2{margin:14px 0 5px;font-size:.88rem;font-weight:800}.fee-plan-amount{margin-bottom:14px;color:var(--ui-primary);font-size:1.25rem;font-weight:800}.fee-plan-meta{margin-bottom:14px;display:grid;gap:7px}.fee-plan-meta span{display:flex;align-items:center;gap:7px;color:#66736d;font-size:.62rem}.fee-plan-meta i{width:17px;color:#9ca8a2}.fee-installments{margin-bottom:14px;padding:10px;border-radius:10px;background:#f8faf9;font-size:.6rem}.fee-installments summary{cursor:pointer;font-weight:800}.fee-installments div{margin-top:7px;display:flex;justify-content:space-between;gap:8px}.fee-plan-empty{grid-column:1/-1}.finance-invoice-form{max-width:820px;margin:auto}.invoice-form-preview{padding:14px;border-radius:12px;background:#f7faf8;border:1px solid #e5ece8}
@media(max-width:1199.98px){.finance-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.fee-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-toolbar-wrap{align-items:stretch;flex-direction:column}.finance-search-form{width:100%}.search-input-wrap{min-width:0;flex:1}}
@media(max-width:767.98px){.page-hero-actions{width:100%}.page-hero-actions .btn{flex:1;justify-content:center}.finance-summary-grid,.finance-summary-grid-3,.fee-plan-grid{grid-template-columns:1fr}.finance-search-form{align-items:stretch;flex-direction:column}.finance-search-form .btn{width:100%}.finance-status-tabs{padding-inline:8px}.statement-hero{align-items:flex-start;flex-direction:column}.finance-filter-card .btn,.statement-period-card .btn,.collection-card .btn{width:100%}.finance-table{min-width:980px}}

/* SANAD UI REFRESH — PHASE 5: Inventory, Purchasing, Suppliers & Meals */
.inventory-hero,.meals-hero{margin-bottom:20px}.inventory-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.inventory-workspace{padding:0;overflow:hidden}.inventory-status-select{min-width:155px;max-width:180px;font-size:.7rem}.inventory-item-cell,.supplier-cell{display:flex;align-items:center;gap:10px}.inventory-item-cell strong,.supplier-cell strong{display:block;font-size:.69rem;font-weight:800}.inventory-item-cell small,.supplier-cell small{display:block;margin-top:2px;color:var(--ui-muted);font-size:.56rem}.inventory-item-icon,.supplier-avatar,.meal-icon{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:11px;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:.82rem;font-weight:800}.stock-level{min-width:150px}.stock-level .progress{height:6px;margin-bottom:5px;background:#edf1ef;border-radius:99px}.stock-level .progress-bar{background:var(--ui-primary);border-radius:99px}.stock-level .progress-bar.low{background:var(--ui-red)}.stock-level small{color:var(--ui-muted);font-size:.55rem}.purchase-items{min-width:190px;display:flex;flex-direction:column;gap:4px}.purchase-items span{color:#5f6e67;font-size:.59rem}.purchase-items b{margin-right:4px;color:#263a31;font-weight:800}.supplier-layout{display:grid;grid-template-columns:minmax(270px,340px) minmax(0,1fr);gap:18px;align-items:start}.supplier-form-card{position:sticky;top:82px}.section-card-header{margin-bottom:18px;display:flex;align-items:center;gap:11px}.section-card-header h2{margin:0;font-size:.83rem;font-weight:800}.section-card-header p{margin:3px 0 0;color:var(--ui-muted);font-size:.6rem}.section-icon{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:11px;background:var(--ui-primary-soft);color:var(--ui-primary)}.inventory-form-shell{max-width:760px;margin:auto}.modern-operation-form,.operation-section{padding:20px}.modern-operation-form .form-label,.purchase-modern-form .form-label,.meal-modern-form .form-label{font-size:.67rem;font-weight:800}.modern-operation-form .form-control,.modern-operation-form .form-select,.purchase-modern-form .form-control,.purchase-modern-form .form-select,.meal-modern-form .form-control,.meal-modern-form .form-select{min-height:43px;border-radius:10px;border-color:#dfe6e3;font-size:.7rem}.operation-form-footer{margin-top:24px;padding-top:16px;display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #edf1ef}.operation-list-header small{font-size:.58rem}.purchase-line{padding:10px 0;border-bottom:1px solid #f0f3f2}.purchase-line:last-child{border-bottom:0}.meal-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.meal-card{padding:18px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--ui-border);border-radius:17px;box-shadow:var(--ui-shadow)}.meal-card-head{display:flex;align-items:flex-start;gap:10px}.meal-card-title{min-width:0;flex:1}.meal-card-title h2{margin:1px 0 4px;font-size:.85rem;font-weight:800}.meal-card-title p{margin:0;color:var(--ui-muted);font-size:.59rem}.meal-dishes{margin:16px 0;display:grid;gap:9px;flex:1}.meal-dish{padding:11px;border:1px solid #e9efec;border-radius:11px;background:#fafcfb}.meal-dish>div:first-child{display:flex;justify-content:space-between;gap:8px}.meal-dish strong{font-size:.67rem}.meal-dish>div:first-child span{color:var(--ui-muted);font-size:.57rem}.meal-ingredients{margin-top:7px;display:flex;flex-wrap:wrap;gap:5px}.meal-ingredients span{padding:4px 7px;border-radius:7px;background:#f1f5f3;color:#5c6b64;font-size:.54rem;font-weight:700}.meal-empty{grid-column:1/-1}.meal-modern-form{max-width:980px;margin:auto}.dish-card{position:relative}.dish-card .ingredient-row{padding:7px;border-radius:10px;background:#f8faf9}.finance-modal .form-label{font-size:.66rem;font-weight:800}
@media(max-width:1199.98px){.inventory-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.supplier-layout{grid-template-columns:1fr}.supplier-form-card{position:static}.meal-card-grid{grid-template-columns:1fr}}
@media(max-width:767.98px){.inventory-summary-grid{grid-template-columns:1fr}.inventory-status-select{max-width:none;width:100%}.inventory-table{min-width:850px}.supplier-layout{display:block}.supplier-form-card{margin-bottom:16px}.operation-form-footer{flex-direction:column-reverse}.operation-form-footer .btn{width:100%}.meal-card{padding:15px}.purchase-modern-form .operation-list-header{align-items:flex-start!important;gap:10px}.purchase-modern-form .operation-list-header .btn{white-space:nowrap}}


/* Phase 6 — Daily operations, care, health and events */
.page-hero{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.55rem 1.7rem;border:1px solid var(--bs-border-color);border-radius:18px;background:linear-gradient(135deg,#fff 0%,#f6fbf8 100%)}
.page-title{font-size:1.65rem;font-weight:800;margin:.15rem 0 .35rem}.page-subtitle{color:#6b7280}.eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.02em;color:#198754;display:flex;align-items:center;gap:.4rem;text-transform:none}
.health-hero{background:linear-gradient(135deg,#fff 0%,#fff6f6 100%)}.event-hero{background:linear-gradient(135deg,#fff 0%,#f5f8ff 100%)}.needs-hero{background:linear-gradient(135deg,#fff 0%,#f5fff8 100%)}.daily-hero{background:linear-gradient(135deg,#fff 0%,#f4fbf7 100%)}
.workspace-card{background:#fff;border:1px solid #e8ecea;border-radius:16px;padding:1.15rem;box-shadow:0 4px 18px rgba(17,24,39,.035)}.workspace-head{padding:1rem 1.15rem;border-bottom:1px solid #edf0ef;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.metric-card{height:100%;display:flex;align-items:center;gap:.85rem;padding:1rem;background:#fff;border:1px solid #e9edeb;border-radius:15px;box-shadow:0 3px 14px rgba(17,24,39,.025)}.metric-icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;font-size:1.15rem;flex:0 0 auto}.metric-label{display:block;color:#6b7280;font-size:.78rem}.metric-value{display:block;font-size:1.45rem;line-height:1.2;margin-top:.15rem}
.modern-table thead th{background:#f8faf9;color:#667085;font-size:.78rem;font-weight:700;border-bottom:1px solid #e9edeb;padding:.85rem 1rem;white-space:nowrap}.modern-table tbody td{padding:.9rem 1rem;border-color:#eef1ef}.modern-table tbody tr:hover{background:#fbfdfc}
.status-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.34rem .62rem;border-radius:999px;font-size:.76rem;font-weight:700;white-space:nowrap}.status-success{background:#eaf8ef;color:#137a3d}.status-danger{background:#fff0f0;color:#ba2424}.status-critical{background:#2f3338;color:#fff}.status-warning{background:#fff7df;color:#8f6400}.status-info{background:#e9f6fb;color:#16677f}.status-neutral{background:#f1f3f4;color:#667085}
.empty-state{text-align:center;padding:3rem 1rem;color:#697386}.empty-state>i{font-size:2.25rem;color:#a0aaa5}.empty-state h3{font-size:1rem;color:#374151;margin:.8rem 0 .3rem}.empty-state p{font-size:.86rem;margin-bottom:1rem}
.form-section{background:#fff;border:1px solid #e8ecea;border-radius:16px;padding:1.25rem;margin-bottom:1rem}.form-section-head{display:flex;gap:.8rem;align-items:center;padding-bottom:1rem;margin-bottom:1rem;border-bottom:1px solid #eef1ef}.form-section-head h2{font-size:1rem;margin:0 0 .2rem;font-weight:800}.form-section-head p{font-size:.79rem;color:#7a828d;margin:0}.form-section-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:1.05rem}.sticky-form-actions{position:sticky;bottom:12px;z-index:20;margin-top:1rem;padding:.75rem 1rem;background:rgba(255,255,255,.94);backdrop-filter:blur(9px);border:1px solid #e5e9e7;border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.08);display:flex;justify-content:flex-end;gap:.6rem}
.choice-grid{display:flex;flex-wrap:wrap;gap:.5rem}.choice-chip{display:flex;align-items:center;gap:.45rem;padding:.55rem .7rem;border:1px solid #e3e8e5;border-radius:12px;background:#fafcfb;cursor:pointer}.choice-chip:has(input:checked){border-color:#f0a6a6;background:#fff5f5}
.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.detail-grid>div{padding:.9rem;border-radius:12px;background:#f8faf9}.detail-grid span{display:block;font-size:.76rem;color:#7b8490;margin-bottom:.3rem}.detail-grid strong{display:block;font-size:.9rem}.detail-wide{grid-column:1/-1}
.event-modern-card{background:#fff;border:1px solid #e8ecea;border-radius:18px;overflow:hidden;box-shadow:0 4px 18px rgba(17,24,39,.035);transition:.2s}.event-modern-card:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(17,24,39,.08)}.event-media{height:230px;position:relative;background:#eef3f0}.event-media img{width:100%;height:100%;object-fit:cover}.event-placeholder{width:100%;height:100%;display:grid;place-items:center;font-size:3rem;color:#a6b0ab}.event-visibility,.event-photo-count{position:absolute;top:.8rem;padding:.36rem .62rem;border-radius:999px;font-size:.73rem;font-weight:700;backdrop-filter:blur(6px)}.event-visibility{right:.8rem}.event-visibility.is-public{background:rgba(231,249,237,.92);color:#137a3d}.event-visibility.is-private{background:rgba(244,245,246,.92);color:#545d68}.event-photo-count{left:.8rem;background:rgba(17,24,39,.72);color:#fff}.event-body{padding:1.15rem}.event-description{color:#667085;line-height:1.75;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.upload-dropzone{position:relative;display:flex;min-height:150px;border:2px dashed #cfd8d3;border-radius:15px;align-items:center;justify-content:center;flex-direction:column;gap:.35rem;background:#fafcfb;color:#6b7280;cursor:pointer}.upload-dropzone i{font-size:1.8rem;color:#198754}.upload-dropzone input{position:absolute;inset:0;opacity:0;cursor:pointer}.upload-dropzone span{font-size:.75rem}.existing-image{position:relative}.existing-image img{width:100%;height:120px;object-fit:cover;border-radius:12px}.existing-image .btn{position:absolute;top:.4rem;left:.4rem;border-radius:10px}.publish-toggle{display:flex;gap:.75rem;align-items:flex-start;border:1px solid #e5e9e7;border-radius:14px;padding:1rem;cursor:pointer}.publish-toggle input{margin-top:.35rem}.publish-toggle-icon{width:38px;height:38px;border-radius:10px;background:#e9f6ee;color:#198754;display:grid;place-items:center}.publish-toggle strong,.publish-toggle small{display:block}.publish-toggle small{color:#7a828d;margin-top:.2rem}
.workflow-metric{display:block;text-decoration:none;background:#fff;border:1px solid #e8ecea;border-radius:14px;padding:.9rem;color:inherit;transition:.15s;height:100%}.workflow-metric:hover,.workflow-metric.active{border-color:#8ac5a5;box-shadow:0 4px 18px rgba(25,135,84,.08)}.workflow-metric small{display:block;color:#7a828d;margin:.35rem 0}.workflow-metric strong{font-size:1.45rem}.workflow-dot{display:block;width:9px;height:9px;border-radius:50%}.progress-modern{height:8px;background:#edf2ef}.progress-number{font-size:1.15rem;font-weight:800;color:#198754}.need-note{display:flex;gap:.55rem;align-items:flex-start;line-height:1.7}.need-note i{color:#198754;margin-top:.2rem}
@media(max-width:767.98px){.page-hero{align-items:flex-start;flex-direction:column;padding:1.15rem}.page-title{font-size:1.35rem}.detail-grid{grid-template-columns:1fr}.detail-wide{grid-column:auto}.event-media{height:190px}.sticky-form-actions{bottom:6px}.modern-table thead th,.modern-table tbody td{padding:.75rem}.metric-card{padding:.8rem}}
@media print{.page-hero{border:0;padding:0;background:#fff}.workspace-card{box-shadow:none}.needs-hero .no-print{display:none!important}}

.section-title-icon{display:flex;align-items:center;gap:.5rem;font-weight:800}.section-title-icon i{font-size:1.05rem}

/* Phase 7 — Administration and settings */
.admin-hero{background:linear-gradient(135deg,#fff 0%,#f6f8ff 100%)}.academic-hero{background:linear-gradient(135deg,#fff 0%,#f7fbff 100%)}.settings-hero{background:linear-gradient(135deg,#fff 0%,#f8fbf8 100%)}.subscription-hero{background:linear-gradient(135deg,#fff 0%,#fffaf3 100%)}
.entity-cell{display:flex;align-items:center;gap:.7rem}.entity-cell small{display:block;color:#7b8490;margin-top:.15rem}.avatar-circle{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#eaf6ef;color:#177545;font-weight:800;flex:0 0 auto}.avatar-lg{width:52px;height:52px;border-radius:15px;font-size:1.1rem}.request-tabs{display:flex;gap:.45rem;flex-wrap:wrap}.request-type{display:inline-flex;gap:.4rem;align-items:center;font-size:.78rem;font-weight:700;color:#4f5d57}.request-message{line-height:1.65}.response-note{display:flex;gap:.55rem;padding:.65rem .75rem;background:#f8faf9;border:1px solid #e9edeb;border-radius:10px;margin-top:.65rem}.response-note>i{color:#198754}.response-note strong,.response-note span{display:block}.response-note strong{font-size:.72rem}.response-note span{font-size:.74rem;color:#667085;margin-top:.15rem}.request-preview{padding:.85rem;border-radius:12px;background:#f8faf9;border:1px solid #e8ecea;line-height:1.75}.modern-modal .modal-content,.modern-modal{border-radius:18px;border:0}.modern-modal .modal-header{padding:1.1rem 1.2rem}.modern-modal .modal-body{padding:1.2rem}.modern-modal .modal-footer{padding:1rem 1.2rem}
.chip-wrap{display:flex;flex-wrap:wrap;gap:.35rem}.class-chip{display:inline-flex;gap:.3rem;align-items:center;padding:.33rem .55rem;border-radius:9px;background:#f2f6f4;border:1px solid #e4ebe7;font-size:.72rem;font-weight:700;color:#4a5a52}.class-selection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.class-select-card{display:flex;align-items:flex-start;gap:.6rem;padding:.75rem;border:1px solid #e4e9e6;border-radius:12px;background:#fafcfb;cursor:pointer}.class-select-card:has(input:checked){border-color:#8ac5a5;background:#f2fbf6}.class-select-card strong,.class-select-card small{display:block}.class-select-card strong{font-size:.8rem}.class-select-card small{font-size:.68rem;color:#7b8490;margin-top:.15rem}.admin-form-shell{max-width:900px;margin:auto}.account-card{height:100%}.account-profile{display:flex;align-items:center;gap:.8rem;padding-bottom:1rem;border-bottom:1px solid #edf0ef}.security-note{display:flex;gap:.7rem;align-items:flex-start;margin-top:1rem;padding:.8rem;border-radius:12px;background:#f6faf8}.security-note i{color:#198754;font-size:1.15rem}.security-note strong,.security-note span{display:block}.security-note span{color:#6b7280;font-size:.74rem;margin-top:.2rem}
.active-year-banner{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.2rem;border-radius:16px;background:linear-gradient(135deg,#177545,#198754);color:#fff;box-shadow:0 10px 26px rgba(25,135,84,.16)}.active-year-icon{width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.14);display:grid;place-items:center;font-size:1.25rem}.active-year-banner span,.active-year-banner small,.active-year-banner strong{display:block}.active-year-banner>div:nth-child(2){flex:1}.active-year-banner>div:nth-child(2)>span{font-size:.73rem;opacity:.8}.active-year-banner>div:nth-child(2)>strong{font-size:1.1rem;margin:.12rem 0}.active-year-banner>div:nth-child(2)>small{opacity:.8}.active-year-stat{text-align:center;padding-right:1rem;border-right:1px solid rgba(255,255,255,.22)}.active-year-stat strong{font-size:1.45rem}.active-year-stat span{font-size:.7rem;opacity:.8}.year-timeline{padding:1rem 1.15rem}.year-timeline-item{display:flex;gap:1rem;position:relative;padding-bottom:1.25rem}.year-timeline-item:not(:last-child):before{content:"";position:absolute;right:19px;top:40px;bottom:0;width:1px;background:#dfe7e3}.year-marker{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#f1f4f2;color:#6f7a74;z-index:1;flex:0 0 auto}.year-marker.is-active{background:#e8f7ee;color:#198754}.year-marker.is-setup{background:#fff5da;color:#946d00}.year-content{flex:1;padding:.2rem 0 .9rem}.year-content h3{font-size:.92rem;font-weight:800;margin:0 0 .2rem}.year-meta{display:flex;gap:1rem;flex-wrap:wrap;margin:.7rem 0;color:#667085;font-size:.73rem}.year-meta span{display:flex;gap:.3rem;align-items:center}.year-actions{display:flex;gap:.4rem;flex-wrap:wrap}.sticky-admin-card{position:sticky;top:88px}
.settings-logo-preview{width:66px;height:66px;border-radius:18px;background:#fff;border:1px solid #e7ece9;display:grid;place-items:center;overflow:hidden;box-shadow:0 6px 20px rgba(17,24,39,.05)}.settings-logo-preview img{width:100%;height:100%;object-fit:contain}.settings-logo-preview span{font-size:1.45rem;font-weight:800;color:#198754}.settings-workspace{max-width:980px;margin:auto}.modern-working-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.55rem}.modern-working-days .working-day-option{margin:0;justify-content:center;padding:.75rem .4rem;border-radius:12px}.modern-working-days .working-day-option:has(input:checked){background:#edf9f1;border-color:#91caaa}
.plan-card{display:flex;align-items:center;gap:1rem;padding:1.2rem;border-radius:18px;background:linear-gradient(135deg,#233329,#364d3f);color:#fff;box-shadow:0 10px 28px rgba(35,51,41,.16)}.plan-icon{width:54px;height:54px;border-radius:15px;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:1.35rem}.plan-copy{flex:1}.plan-copy span,.plan-copy small{opacity:.72}.plan-copy h2{font-size:1rem;margin:.1rem 0 .35rem}.plan-copy>strong{font-size:1.35rem}.transfer-box{display:flex;align-items:center;gap:.8rem;padding:.9rem;border:1px dashed #cad7d0;background:#f8fbf9;border-radius:14px}.transfer-icon{width:42px;height:42px;border-radius:12px;background:#eaf6ef;color:#198754;display:grid;place-items:center}.transfer-box div{display:flex;flex-direction:column}.transfer-box small{color:#7b8490}.transfer-box strong{font-size:1.2rem}.transfer-box span{font-size:.7rem;color:#7b8490}.pending-review-card{display:flex;gap:.8rem;padding:1rem;border-radius:14px;background:#fff8e6;border:1px solid #f4df9d}.pending-review-card>i{font-size:1.35rem;color:#9c7400}.pending-review-card h3{font-size:.9rem;font-weight:800;margin:0 0 .25rem}.pending-review-card p{font-size:.76rem;color:#6b7280}.subscription-history-item{display:flex;gap:.75rem;position:relative;padding:0 0 1rem}.subscription-history-item:not(:last-child){border-bottom:1px solid #edf0ef;margin-bottom:1rem}.history-dot{width:10px;height:10px;border-radius:50%;background:#e4b84c;margin-top:.45rem;flex:0 0 auto}.history-dot.is-approved{background:#198754}.history-dot.is-rejected{background:#d94a4a}.subscription-history-item>div{flex:1}.subscription-history-item small{display:block;color:#7b8490;margin-top:.25rem}.subscription-history-item p{font-size:.75rem;margin:.45rem 0 0;color:#626b66}
@media(max-width:991.98px){.sticky-admin-card{position:static}.modern-working-days{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:767.98px){.class-selection-grid{grid-template-columns:1fr}.active-year-banner{align-items:flex-start;flex-wrap:wrap}.active-year-stat{width:100%;border-right:0;border-top:1px solid rgba(255,255,255,.2);padding: .7rem 0 0;text-align:right}.modern-working-days{grid-template-columns:repeat(2,minmax(0,1fr))}.plan-card{align-items:flex-start;flex-wrap:wrap}.plan-status{width:100%}.request-tabs{width:100%;overflow:auto;flex-wrap:nowrap;padding-bottom:.2rem}.request-tabs .btn{white-space:nowrap}}
.safety-banner{display:flex;align-items:center;gap:.8rem;padding:1rem 1.1rem;border-radius:14px;background:#ebf8f0;border:1px solid #ccebd8;color:#176c40}.safety-banner>i{font-size:1.3rem}.safety-banner strong,.safety-banner span{display:block}.safety-banner span{font-size:.75rem;color:#50705f;margin-top:.15rem}.copy-options-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.copy-option{position:relative;display:flex;gap:.7rem;align-items:flex-start;padding:1rem;border:1px solid #e2e8e5;border-radius:14px;background:#fafcfb;cursor:pointer}.copy-option:has(input:checked){border-color:#8bc7a6;background:#f1fbf5}.copy-option>input{position:absolute;top:.75rem;left:.75rem}.copy-icon{width:38px;height:38px;border-radius:11px;background:#eaf6ef;color:#198754;display:grid;place-items:center;flex:0 0 auto}.copy-option strong,.copy-option small{display:block}.copy-option strong{font-size:.82rem}.copy-option small{font-size:.7rem;color:#718078;margin-top:.2rem;line-height:1.5}.metric-money{display:block;font-size:.92rem;font-weight:800;margin-top:.25rem;white-space:nowrap}.closure-card{border-color:#f0d2d2}.readiness-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-bottom:1rem}.readiness-item{display:flex;gap:.65rem;align-items:center;padding:.8rem;border-radius:12px;background:#f7faf8;border:1px solid #e6ece8}.readiness-item>i{font-size:1.2rem}.readiness-item strong,.readiness-item span{display:block}.readiness-item strong{font-size:.78rem}.readiness-item span{font-size:.7rem;color:#718078}.readiness-item.is-ready>i{color:#198754}.readiness-item.is-blocked{background:#fff5f5;border-color:#f2d0d0}.readiness-item.is-blocked>i{color:#c83f3f}.readiness-item.is-warning{background:#fff9e9;border-color:#f1dfaa}.readiness-item.is-warning>i{color:#a47b00}.audit-entry{position:relative;display:flex;gap:.7rem;padding-bottom:1rem}.audit-entry:not(:last-child):before{content:"";position:absolute;right:4px;top:12px;bottom:0;width:1px;background:#e2e8e5}.audit-dot{width:9px;height:9px;border-radius:50%;background:#198754;margin-top:.35rem;z-index:1;flex:0 0 auto}.audit-entry>div{flex:1}.audit-entry strong,.audit-entry small{display:block}.audit-entry strong{font-size:.78rem}.audit-entry small{font-size:.67rem;color:#7b8490;margin-top:.18rem}.audit-entry p{font-size:.72rem;margin:.35rem 0 0;color:#59645f}@media(max-width:767.98px){.copy-options-grid,.readiness-grid{grid-template-columns:1fr}}

/* =========================================================
   SANAD UI REFRESH — PHASE 8 FINAL POLISH
   Responsive, accessibility, print, empty states, legacy screens.
   ========================================================= */
:root {
    --ui-radius-sm: 10px;
    --ui-radius-md: 14px;
    --ui-radius-lg: 20px;
    --ui-focus: 0 0 0 .2rem rgba(15,110,86,.18);
}
.skip-link { position: fixed; top: 8px; right: 12px; z-index: 3000; transform: translateY(-140%); padding: .65rem .9rem; border-radius: 10px; background: #fff; color: var(--ui-primary); border: 2px solid var(--ui-primary); font-weight: 800; text-decoration: none; transition: transform .15s ease; }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 2px solid var(--ui-primary) !important; outline-offset: 2px; }
.btn:focus-visible, .form-control:focus-visible, .form-select:focus-visible, .dropdown-toggle:focus-visible { box-shadow: var(--ui-focus) !important; }
[role="button"], button, a, input, select, textarea { scroll-margin-top: calc(var(--topbar-height) + 18px); }
.modal-content { border: 1px solid var(--ui-border); border-radius: 18px; box-shadow: 0 22px 70px rgba(25,53,43,.18); }
.modal-header, .modal-footer { border-color: var(--ui-border); }
.dropdown-menu { border: 1px solid var(--ui-border); border-radius: 12px; box-shadow: var(--ui-shadow-hover); padding: .45rem; }
.dropdown-item { border-radius: 8px; font-size: .84rem; font-weight: 600; padding: .58rem .72rem; }
.alert { border-radius: 13px; }
.badge { border-radius: 999px; padding: .45em .7em; font-weight: 800; }
.table-responsive { border: 1px solid var(--ui-border); border-radius: 14px; background: var(--ui-surface); }
.table-responsive > .table { margin-bottom: 0; }
.table tbody tr { transition: background-color .14s ease; }
.table tbody tr:hover { background: #fbfdfc; }
.empty-state { min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .55rem; padding: 2.4rem 1.25rem; text-align: center; color: var(--ui-muted); }
.empty-state-icon { width: 54px; height: 54px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; background: var(--ui-primary-soft); color: var(--ui-primary); font-size: 1.35rem; }
.page-hero { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin-bottom: 22px; }
.page-hero-copy h1 { margin: 0 0 5px; font-size: 1.18rem; font-weight: 800; color: var(--ui-text); }
.page-hero-copy p { margin: 0; color: var(--ui-muted); font-size: .83rem; }
.page-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.workspace-card { background: var(--ui-surface); border: 1px solid var(--ui-border); border-radius: 18px; box-shadow: var(--ui-shadow); }
.workspace-card-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px; border-bottom: 1px solid var(--ui-border); }
.workspace-card-body { padding: 20px; }
.metric-strip { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin-bottom: 20px; }
.metric-tile { min-height: 92px; padding: 16px; border-radius: 15px; background: var(--ui-surface); border: 1px solid var(--ui-border); box-shadow: 0 5px 20px rgba(25,53,43,.035); }
.metric-tile-label { display: flex; align-items: center; gap: 7px; color: var(--ui-muted); font-size: .74rem; font-weight: 700; }
.metric-tile-value { margin-top: 8px; font-size: 1.2rem; font-weight: 800; color: var(--ui-text); }
.metric-tile-icon { color: var(--ui-primary); }
.form-section { padding: 20px; border: 1px solid var(--ui-border); border-radius: 16px; background: var(--ui-surface); box-shadow: var(--ui-shadow); }
.form-section + .form-section { margin-top: 16px; }
.form-section-title { display: flex; align-items: center; gap: 9px; margin-bottom: 16px; font-size: .92rem; font-weight: 800; }
.form-section-title i { color: var(--ui-primary); }
.form-actions-sticky { position: sticky; bottom: 14px; z-index: 20; display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; padding: 12px; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); border: 1px solid var(--ui-border); border-radius: 14px; box-shadow: var(--ui-shadow-hover); }
.status-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; background: currentColor; }
.legacy-center-card { max-width: 760px; margin: 24px auto; }
.org-switch-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px; border: 1px solid var(--ui-border); border-radius: 14px; background: #fff; transition: .16s ease; }
.org-switch-card:hover { transform: translateY(-1px); box-shadow: var(--ui-shadow); border-color: #d3e2dc; }
.org-avatar { width: 42px; height: 42px; flex: 0 0 42px; display: inline-flex; align-items: center; justify-content: center; border-radius: 13px; background: var(--ui-primary-soft); color: var(--ui-primary); font-weight: 800; }
.schedule-day { break-inside: avoid; }
.schedule-day-title { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; font-weight: 800; }
.schedule-day.schedule-today .schedule-day-title { color: var(--ui-primary); }
@media (max-width: 991.98px) {
    .topbar { height: 66px; min-height: 66px; padding: 0 16px 0 76px; }
    .topbar-eyebrow { display: none; }
    .content { padding: 20px 16px 40px; }
    .metric-strip { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .page-hero { align-items: stretch; flex-direction: column; }
    .page-actions .btn { flex: 1 1 auto; }
    body.nav-drawer-open { overflow: hidden; }
}
@media (max-width: 575.98px) {
    .content { padding: 14px 10px 30px; }
    .topbar { padding-inline-start: 10px; padding-inline-end: 72px; }
    .academic-year-pill span { display: none; }
    .metric-strip { grid-template-columns: 1fr; }
    .metric-tile { min-height: 78px; }
    .workspace-card-header, .workspace-card-body, .form-section { padding: 15px; }
    .form-actions-sticky { bottom: 8px; flex-direction: column; }
    .form-actions-sticky .btn { width: 100%; }
    .btn-sm { min-height: 36px; }
    .modal-dialog { margin: .65rem; }
    .modal-content { border-radius: 15px; }
    .table-responsive .table { min-width: 690px; }
    .page-hero-copy h1 { font-size: 1.08rem; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
@media print {
    @page { margin: 12mm; }
    body { background: #fff !important; color: #000 !important; }
    .sidebar, .topbar, .mobile-menu-toggle, .mobile-menu-overlay, .page-actions, .form-actions-sticky, .btn, .dropdown, .no-print { display: none !important; }
    .app-shell, .app-main { display: block !important; min-height: auto !important; }
    .content { max-width: none !important; margin: 0 !important; padding: 0 !important; }
    .workspace-card, .kpi-card, .panel-card, .form-section, .metric-tile { box-shadow: none !important; border-color: #bbb !important; break-inside: avoid; }
    .table-responsive { overflow: visible !important; border-color: #bbb !important; }
    .table { min-width: 0 !important; font-size: 9pt; }
    a { color: #000 !important; text-decoration: none !important; }
}
/* Compatibility layer: legacy Bootstrap success actions now follow the Sanad brand. */
.btn-success { --bs-btn-bg: var(--ui-primary); --bs-btn-border-color: var(--ui-primary); --bs-btn-hover-bg: var(--ui-primary-dark); --bs-btn-hover-border-color: var(--ui-primary-dark); --bs-btn-active-bg: var(--ui-primary-dark); --bs-btn-active-border-color: var(--ui-primary-dark); }
.btn-outline-success { --bs-btn-color: var(--ui-primary); --bs-btn-border-color: #9bcfbe; --bs-btn-hover-bg: var(--ui-primary); --bs-btn-hover-border-color: var(--ui-primary); --bs-btn-active-bg: var(--ui-primary-dark); --bs-btn-active-border-color: var(--ui-primary-dark); }
.text-success { color: var(--ui-primary) !important; }
.bg-success { background-color: var(--ui-primary) !important; }
.min-w-0 { min-width: 0; }
@media (max-width: 767.98px) {
    .input-group { flex-wrap: nowrap; }
    .page-actions { width: 100%; }
    .page-actions > * { min-width: 0; }
}

/* Central Notification Center */
.notification-bell-count{position:absolute;top:-5px;inset-inline-end:-7px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:#dc3545;color:#fff;font-size:10px;font-weight:800;display:grid;place-items:center;border:2px solid #fff}
.notification-dropdown{width:min(390px,calc(100vw - 24px));max-height:470px;overflow:auto;border:0;border-radius:18px;box-shadow:0 18px 50px rgba(15,23,42,.16)}
.notification-dropdown-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--bs-border-color)}
.notification-preview{display:flex;gap:10px;padding:13px 16px;text-decoration:none;color:inherit;border-bottom:1px solid rgba(0,0,0,.06)}
.notification-preview:hover{background:rgba(13,110,253,.05)}
.notification-preview.is-unread{background:rgba(13,110,253,.035)}
.notification-preview strong,.notification-preview small{display:block}.notification-preview small{color:#6c757d;margin-top:3px;line-height:1.45}
.notification-dot{width:9px;height:9px;border-radius:50%;margin-top:6px;flex:0 0 auto}.notification-dot.priority-info{background:#0d6efd}.notification-dot.priority-warning{background:#f59f00}.notification-dot.priority-critical{background:#dc3545}
.notification-list{display:grid;gap:12px}.notification-row{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:16px;border-inline-start:4px solid transparent}
.notification-row.priority-warning{border-inline-start-color:#f59f00}.notification-row.priority-critical{border-inline-start-color:#dc3545}.notification-row.priority-info{border-inline-start-color:#0d6efd}
.notification-row.notification-unread{box-shadow:0 8px 24px rgba(15,23,42,.07)}.notification-priority{font-size:1.2rem}.priority-warning .notification-priority{color:#f59f00}.priority-critical .notification-priority{color:#dc3545}.priority-info .notification-priority{color:#0d6efd}
.notification-actions{display:flex;gap:8px;align-items:center}.notification-actions form{margin:0}
@media(max-width:700px){.notification-row{grid-template-columns:auto 1fr}.notification-actions{grid-column:2;flex-wrap:wrap}}