/* فونت وزیرمتن با ارقام فارسی (Farsi Digits): ارقام انگلیسی ذخیره و کپی می‌شوند ولی فارسی نمایش داده می‌شوند */
@font-face { font-family: 'VazirmatnFD'; src: url('../fonts/Vazirmatn-FD-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'VazirmatnFD'; src: url('../fonts/Vazirmatn-FD-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'VazirmatnFD'; src: url('../fonts/Vazirmatn-FD-SemiBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'VazirmatnFD'; src: url('../fonts/Vazirmatn-FD-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }

/* =====================================================================
   Design System - سامانه مدیریت مجتمع آموزشی
   استخراج شده از تصاویر مرجع (داشبورد Super Admin و School Admin)
   ===================================================================== */

:root {
    /* پالت رنگی اصلی */
    --color-primary: #0f6b5c;
    --color-primary-dark: #0b3f37;
    --color-primary-light: #e4f3f0;
    --color-sidebar-bg: #123832;
    --color-sidebar-bg-hover: #1c4a42;
    --color-sidebar-active: #17564b;
    --color-sidebar-text: #cfe4df;
    --color-sidebar-text-muted: #8fb3ab;

    --color-accent-orange: #e79a3b;
    --color-accent-blue: #3b6fe7;
    --color-danger: #d94f4f;
    --color-danger-bg: #fbe7e7;
    --color-success: #1e9e6b;
    --color-success-bg: #e4f6ee;
    --color-warning: #e79a3b;
    --color-warning-bg: #fdf1e2;
    /* رنگ متن وضعیت‌ها روی پس‌زمینه کم‌رنگ (کنتراست خوانا؛ همان طیف رنگی) */
    --color-success-text: #13724c;
    --color-danger-text: #b33a3a;
    --color-warning-text: #9a5a0c;

    --color-bg: #f4f6f7;
    --color-surface: #ffffff;
    --color-border: #e6eaea;
    --color-text: #202b29;
    --color-text-muted: #6b7a77;

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;

    --shadow-card: 0 1px 3px rgba(16, 40, 34, .06), 0 1px 2px rgba(16, 40, 34, .04);
    --shadow-hover: 0 6px 16px rgba(16, 40, 34, .10);

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;

    --font-family: 'VazirmatnFD', Tahoma, Arial, sans-serif;

    --sidebar-width: 260px;
    --header-height: 64px;
}

* { box-sizing: border-box; }
button, input, select, textarea, optgroup { font-family: inherit; }
code, kbd, samp, .mono { font-family: Consolas, 'Courier New', monospace; direction: ltr; unicode-bidi: embed; }
/* آدرس‌ها و کدهای ترکیبی حرف و عدد (مثل D2DCH) با ارقام لاتین */
.latin, input[type=url] { font-family: 'Segoe UI', Tahoma, Arial, sans-serif; }

html, body {
    margin: 0;
    padding: 0;
    background: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-family);
    font-size: 14px;
    line-height: 1.7;
}

body { direction: rtl; }

a { color: inherit; text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }

h1, h2, h3, h4 { margin: 0 0 var(--space-2); font-weight: 700; }

/* --------------------------------------------------------------- */
/* Layout                                                            */
/* --------------------------------------------------------------- */
.app-layout {
    display: flex;
    min-height: 100vh;
    min-height: 100dvh;
}

.sidebar {
    width: var(--sidebar-width);
    flex-shrink: 0;
    background: var(--color-sidebar-bg);
    color: var(--color-sidebar-text);
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-5) var(--space-4);
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.sidebar-brand .logo {
    width: 40px; height: 40px;
    border-radius: var(--radius-sm);
    background: var(--color-primary);
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; color: #fff;
}

.sidebar-brand .title { font-size: 14px; font-weight: 700; color: #fff; }
.sidebar-brand .subtitle { font-size: 11px; color: var(--color-sidebar-text-muted); }

.sidebar-section-label {
    padding: var(--space-4) var(--space-4) var(--space-1);
    font-size: 11px;
    color: var(--color-sidebar-text-muted);
}

.sidebar-nav { padding: var(--space-2) var(--space-3); flex: 1; }

.sidebar-nav a, .sidebar-nav .nav-disabled {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: 10px var(--space-3);
    border-radius: var(--radius-sm);
    margin-bottom: 2px;
    color: var(--color-sidebar-text);
    font-size: 13.5px;
    transition: background .15s ease;
}

.sidebar-nav a:hover { background: var(--color-sidebar-bg-hover); }
.sidebar-nav a.active { background: var(--color-sidebar-active); color: #fff; font-weight: 600; }
.sidebar-nav .nav-disabled { color: var(--color-sidebar-text-muted); cursor: not-allowed; }
.sidebar-nav .nav-disabled .soon {
    margin-right: auto; font-size: 10px; background: rgba(255,255,255,.08);
    padding: 2px 6px; border-radius: 20px;
}

.sidebar-footer {
    padding: var(--space-4);
    font-size: 11px;
    color: var(--color-sidebar-text-muted);
    border-top: 1px solid rgba(255,255,255,.08);
}

.main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.topbar {
    height: var(--header-height);
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--space-5);
    position: sticky;
    top: 0;
    z-index: 10;
}

.topbar .user-box { display: flex; align-items: center; gap: var(--space-3); }
.topbar .avatar {
    width: 36px; height: 36px; border-radius: 50%;
    background: var(--color-primary-light); color: var(--color-primary-dark);
    display: flex; align-items: center; justify-content: center; font-weight: 700;
}
.topbar .user-name { font-size: 13px; font-weight: 600; }
.topbar .user-role { font-size: 11px; color: var(--color-text-muted); }
.topbar .logout-link { font-size: 12px; color: var(--color-danger); margin-right: var(--space-4); }

.content { padding: var(--space-5); }

.page-header { margin-bottom: var(--space-5); display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: var(--space-3); }
.page-header h1 { font-size: 20px; }
.page-header .subtitle { color: var(--color-text-muted); font-size: 12.5px; }

/* --------------------------------------------------------------- */
/* Cards & Stat cards                                                */
/* --------------------------------------------------------------- */
.card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    padding: var(--space-5);
}

.card-title { font-size: 14px; font-weight: 700; margin-bottom: var(--space-4); }

.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

.stat-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    box-shadow: var(--shadow-card);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.stat-card .stat-icon {
    width: 34px; height: 34px; border-radius: var(--radius-sm);
    background: var(--color-primary-light); color: var(--color-primary-dark);
    display: flex; align-items: center; justify-content: center; font-size: 16px;
}
.stat-card .stat-icon .ico { width: 18px; height: 18px; }

/* آیکون‌های SVG (core/Icons.php) */
.ico { width: 1.15em; height: 1.15em; flex-shrink: 0; vertical-align: -0.2em; display: inline-block; }
.ico-xl { width: 40px; height: 40px; }
.empty-ico { color: var(--color-text-muted); margin-bottom: var(--space-2); }
.nav-ico .ico { width: 18px; height: 18px; }
.menu-toggle .ico { width: 20px; height: 20px; }
.auth-card .logo .ico { width: 26px; height: 26px; }
.card-title .ico, h1 .ico { color: var(--color-primary); }

.stat-card .stat-label { font-size: 12px; color: var(--color-text-muted); }
.stat-card .stat-value { font-size: 24px; font-weight: 700; }
.stat-card .stat-sub { font-size: 11px; color: var(--color-text-muted); }

.grid-2 { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--space-4); margin-bottom: var(--space-4); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); margin-bottom: var(--space-4); }

/* --------------------------------------------------------------- */
/* Buttons                                                           */
/* --------------------------------------------------------------- */
.btn {
    display: inline-flex; align-items: center; gap: var(--space-2);
    padding: 9px 16px;
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: filter .15s ease, background .15s ease;
}
.btn-primary { background: var(--color-primary); color: #fff; }
.btn-primary:hover { filter: brightness(0.94); }
.btn-outline { background: #fff; border-color: var(--color-border); color: var(--color-text); }
.btn-outline:hover { background: var(--color-bg); }
.btn-danger { background: var(--color-danger-bg); color: var(--color-danger-text); }
.btn-success { background: var(--color-success-bg); color: var(--color-success-text); }
.btn-sm { padding: 6px 10px; font-size: 12px; }

/* --------------------------------------------------------------- */
/* Forms                                                             */
/* --------------------------------------------------------------- */
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-4); }
.form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--space-4); }
.form-group.full { grid-column: 1 / -1; }
.form-group label { font-size: 12.5px; font-weight: 600; color: var(--color-text); }
.form-group .hint { font-size: 11px; color: var(--color-text-muted); }

input[type=text], input[type=email], input[type=password], input[type=tel],
input[type=date], input[type=number], input[type=search], select, textarea {
    font-family: inherit;
    font-size: 13.5px;
    padding: 10px 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: #fff;
    color: var(--color-text);
    width: 100%;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-light);
}
textarea { resize: vertical; min-height: 80px; }

.form-actions { display: flex; gap: var(--space-3); margin-top: var(--space-4); }

/* --------------------------------------------------------------- */
/* Tables                                                            */
/* --------------------------------------------------------------- */
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
thead th {
    text-align: right;
    color: var(--color-text-muted);
    font-weight: 600;
    font-size: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}
tbody td { padding: 12px; border-bottom: 1px solid var(--color-border); vertical-align: middle; }
tbody tr:hover { background: var(--color-bg); }
tbody tr:last-child td { border-bottom: none; }

/* --------------------------------------------------------------- */
/* Badges & Alerts                                                   */
/* --------------------------------------------------------------- */
.badge {
    display: inline-flex; align-items: center;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
}
.badge-success { background: var(--color-success-bg); color: var(--color-success-text); }
.badge-danger { background: var(--color-danger-bg); color: var(--color-danger-text); }
.badge-warning { background: var(--color-warning-bg); color: var(--color-warning-text); }
.badge-muted { background: var(--color-bg); color: var(--color-text-muted); }

.alert { padding: var(--space-3) var(--space-4); border-radius: var(--radius-sm); margin-bottom: var(--space-4); font-size: 13px; }
.alert-success { background: var(--color-success-bg); color: var(--color-success-text); }
.alert-danger { background: var(--color-danger-bg); color: var(--color-danger-text); }
.alert-warning { background: var(--color-warning-bg); color: var(--color-warning-text); }

/* --------------------------------------------------------------- */
/* Auth pages                                                        */
/* --------------------------------------------------------------- */
.auth-screen {
    min-height: 100vh;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(160deg, var(--color-sidebar-bg), var(--color-primary-dark));
    padding: var(--space-4);
}
.auth-card {
    width: 100%; max-width: 380px;
    background: #fff;
    border-radius: var(--radius-lg);
    padding: var(--space-6) var(--space-5);
    box-shadow: var(--shadow-hover);
}
.auth-card .logo { width: 52px; height: 52px; border-radius: var(--radius-md); background: var(--color-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 20px; margin: 0 auto var(--space-4); }
.auth-card h1 { text-align: center; font-size: 17px; }
.auth-card .subtitle { text-align: center; color: var(--color-text-muted); font-size: 12.5px; margin-bottom: var(--space-5); }
.auth-card .btn { width: 100%; justify-content: center; margin-top: var(--space-2); }

/* --------------------------------------------------------------- */
/* Toolbar / filters                                                 */
/* --------------------------------------------------------------- */
.toolbar { display: flex; gap: var(--space-3); align-items: center; margin-bottom: var(--space-4); flex-wrap: wrap; }
.toolbar .search-box { flex: 1; min-width: 200px; }
.toolbar select { width: auto; min-width: 140px; }

.empty-state { text-align: center; padding: var(--space-6); color: var(--color-text-muted); }

.pill { display: inline-flex; padding: 2px 8px; border-radius: 20px; background: var(--color-bg); font-size: 11px; }

/* --------------------------------------------------------------- */
/* Responsive                                                        */
/* --------------------------------------------------------------- */
@media (max-width: 1024px) {
    .grid-2, .grid-3 { grid-template-columns: 1fr; }
    .form-grid { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
    .sidebar { position: fixed; right: 0; top: 0; transform: translateX(100%); z-index: 100; transition: transform .2s ease; box-shadow: var(--shadow-hover); }
    .sidebar.open { transform: translateX(0); }
    .main { width: 100%; }
    .menu-toggle { display: inline-flex !important; }
    .content { padding: var(--space-4); }
}

.menu-toggle {
    display: none;
    width: 38px; height: 38px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: #fff;
    align-items: center; justify-content: center;
    cursor: pointer;
}

@media (max-width: 560px) {
    .stat-grid { grid-template-columns: repeat(2, 1fr); }
    .card { padding: var(--space-4); }
    .auth-card { padding: var(--space-5) var(--space-4); }
}

/* --------------------------------------------------------------- */
/* Topbar (نام کاربر و خروج در سمت چپ)                              */
/* --------------------------------------------------------------- */
.topbar .topbar-title { font-size: 13px; font-weight: 600; color: var(--color-text-muted); }
.topbar .user-box { margin-inline-start: auto; }
.topbar .logout-link {
    margin: 0 var(--space-2) 0 0;
    padding: 6px 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    color: var(--color-danger);
    font-size: 12px;
    transition: background .15s ease;
}
.topbar .logout-link:hover { background: var(--color-danger-bg); }

/* --------------------------------------------------------------- */
/* Modal                                                             */
/* --------------------------------------------------------------- */
.modal {
    position: fixed; top: 0; right: 0; bottom: 0; left: 0;
    z-index: 200;
    display: none;
    align-items: flex-start;
    justify-content: center;
    padding: 40px 16px;
    overflow-y: auto;
    background: rgba(16, 40, 34, .5);
}
.modal.open { display: flex; }
.modal-dialog {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    width: 100%;
    max-width: 760px;
    box-shadow: var(--shadow-hover);
    animation: modalIn .18s ease;
}
.modal-dialog.sm { max-width: 520px; }
.modal-dialog.lg { max-width: 900px; }
.modal-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 16px 24px;
    border-bottom: 1px solid var(--color-border);
}
.modal-title { margin: 0; font-size: 15px; font-weight: 700; }
.modal-close {
    width: 32px; height: 32px; border: none; border-radius: var(--radius-sm);
    background: var(--color-bg); color: var(--color-text-muted);
    font-size: 20px; line-height: 1; cursor: pointer;
}
.modal-close:hover { background: var(--color-border); }
.modal-body { padding: 24px 24px 8px; }
.modal-footer {
    display: flex; gap: var(--space-3);
    padding: 16px 24px;
    border-top: 1px solid var(--color-border);
}
body.modal-open { overflow: hidden; }
@keyframes modalIn { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: none; } }

@media (max-width: 560px) {
    .modal { padding: 12px 8px; }
    .modal-body { padding: 16px 16px 4px; }
    .modal-header, .modal-footer { padding: 12px 16px; }
}

/* ابزارهای کمکی */
.progress { height: 6px; background: var(--color-bg); border-radius: 20px; overflow: hidden; min-width: 70px; }
.progress > span { display: block; height: 100%; background: var(--color-primary); }
.progress.full > span { background: var(--color-danger); }
.inline-form { display: inline; }
.actions { white-space: nowrap; }
.section-title { font-size: 14px; font-weight: 700; margin: var(--space-5) 0 var(--space-3); }
.grade-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: var(--space-3); margin-bottom: var(--space-4); }
.grade-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-4); }
.grade-card .g-name { font-weight: 700; margin-bottom: var(--space-2); }
.grade-card .g-meta { font-size: 12px; color: var(--color-text-muted); }
.check-col { width: 36px; }

/* --------------------------------------------------------------- */
/* برنامه هفتگی (Timetable Grid)                                     */
/* --------------------------------------------------------------- */
.timetable-grid { border-collapse: separate; border-spacing: 0; min-width: 720px; }
.timetable-grid thead th {
    position: sticky; top: 0; background: var(--color-surface); z-index: 2;
    text-align: center; padding: 10px 8px;
}
.timetable-grid .period-cell {
    background: var(--color-bg);
    font-weight: 700; font-size: 12.5px;
    white-space: nowrap;
    position: sticky; right: 0; z-index: 1;
    text-align: center;
}
.timetable-grid .period-time { font-weight: 400; font-size: 10.5px; color: var(--color-text-muted); margin-top: 2px; }
.timetable-grid td { padding: 6px; vertical-align: middle; }
.timetable-grid select.tt-select {
    width: 100%; min-width: 150px;
    padding: 8px 8px; font-size: 12px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: #fff;
}
.timetable-grid select.tt-select:not([value=""]):not(:invalid) { }
.timetable-grid select.tt-select option:not(:first-child) { color: var(--color-primary-dark); }
.timetable-grid tr:hover td { background: var(--color-primary-light); }
.timetable-grid tr:hover .period-cell { background: var(--color-primary-light); }

/* =====================================================================
   نسخه ۷ — اجزای جدید رابط کاربری
   ===================================================================== */
:root {
    --color-info: #2f6fb3;
    --color-info-bg: #e7f0fa;
}
.alert-info { background: var(--color-info-bg); color: var(--color-info); }
.alert-muted { background: var(--color-bg); color: var(--color-text-muted); }
.alert a { text-decoration: underline; }
.badge-info { background: var(--color-info-bg); color: var(--color-info); }
.text-muted { color: var(--color-text-muted); }
.small { font-size: 11.5px; }
.nowrap { white-space: nowrap; }
.mt-0 { margin-top: 0 !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-4 { margin-bottom: var(--space-4); }
.flex { display: flex; gap: var(--space-2); align-items: center; flex-wrap: wrap; }
.flex-between { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.btn[disabled] { opacity: .55; cursor: not-allowed; }
.btn-warning { background: var(--color-warning-bg); color: var(--color-warning-text); }
.btn-info { background: var(--color-info-bg); color: var(--color-info); }
.btn-lg { padding: 12px 22px; font-size: 14px; }
.form-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 var(--space-4); }
.form-grid { gap: 0 var(--space-4); }
.form-section-title {
    grid-column: 1 / -1; font-size: 13px; font-weight: 700; color: var(--color-primary-dark);
    border-bottom: 1px dashed var(--color-border); padding-bottom: 6px; margin: 4px 0 12px;
}
.form-group .hint.important { color: var(--color-primary); font-weight: 600; }
.card + .card { margin-top: var(--space-4); }
.inline-radios { display: flex; gap: var(--space-4); flex-wrap: wrap; padding: 8px 0; }
.inline-radios label { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; cursor: pointer; }

/* سوییچ سال تحصیلی در نوار بالا */
.year-switch { display: flex; align-items: center; gap: 6px; margin-inline-start: var(--space-4); }
.year-switch label { font-size: 12px; color: var(--color-text-muted); white-space: nowrap; }
.year-switch select { width: auto; padding: 6px 10px; font-size: 12.5px; }
.sidebar-brand .logo-img { object-fit: cover; background: #fff; padding: 2px; }

/* تصویر دانش‌آموز */
.avatar-img, .avatar-ph { border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; object-fit: cover; }
.avatar-ph { background: var(--color-primary-light); color: var(--color-primary-dark); font-weight: 700; }
.avatar-sm { width: 36px; height: 36px; font-size: 14px; }
.avatar-md { width: 64px; height: 64px; font-size: 22px; }
.avatar-lg { width: 110px; height: 110px; font-size: 36px; border-radius: 14px; }

/* مرتب‌سازی و صفحه‌بندی */
.sort-link { color: inherit; white-space: nowrap; }
.sort-link.active { color: var(--color-primary); }
.sort-idle { opacity: .35; font-size: 10px; }
.pagination { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); font-size: 12.5px; }
.pagination-info { color: var(--color-text-muted); }
.pagination-links { display: flex; gap: 4px; flex-wrap: wrap; }
.page-link { padding: 5px 11px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: #fff; }
.page-link:hover { background: var(--color-bg); }
.page-link.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.page-gap { padding: 5px 4px; color: var(--color-text-muted); }

/* فیلترها */
.filter-bar { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--space-3); align-items: end; margin-bottom: var(--space-4); }
.filter-bar .form-group { margin: 0; }
.filter-bar label { font-size: 11.5px; color: var(--color-text-muted); }
.filter-bar .filter-actions { display: flex; gap: var(--space-2); }

/* تقویم شمسی */
.jdp-wrap { position: relative; display: block; }
.jdp-wrap .jdp-input { padding-left: 38px; }
.jdp-btn { position: absolute; left: 6px; top: 50%; transform: translateY(-50%); border: none; background: transparent; cursor: pointer; font-size: 15px; padding: 4px; }
.jdp-pop {
    position: absolute; z-index: 400; top: calc(100% + 4px); right: 0; width: 280px;
    background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-md);
    box-shadow: var(--shadow-hover); padding: 10px;
}
.jdp-head { display: flex; gap: 6px; align-items: center; margin-bottom: 8px; }
.jdp-head select { padding: 6px; font-size: 12.5px; }
.jdp-nav { border: 1px solid var(--color-border); background: #fff; border-radius: 6px; width: 30px; height: 32px; cursor: pointer; font-size: 16px; flex-shrink: 0; }
.jdp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; text-align: center; }
.jdp-wd { font-size: 11px; color: var(--color-text-muted); padding: 4px 0; }
.jdp-day { border: none; background: var(--color-bg); border-radius: 6px; padding: 6px 0; cursor: pointer; font-family: inherit; font-size: 12.5px; }
.jdp-day:hover { background: var(--color-primary-light); }
.jdp-day.today { outline: 1px solid var(--color-primary); }
.jdp-day.sel { background: var(--color-primary); color: #fff; }
.jdp-foot { display: flex; justify-content: space-between; margin-top: 8px; }
.jdp-link { border: none; background: none; color: var(--color-primary); cursor: pointer; font-family: inherit; font-size: 12px; }

/* Select جست‌وجوپذیر */
.ss { position: relative; width: 100%; }
.ss-native { position: absolute !important; opacity: 0 !important; pointer-events: none !important; height: 1px !important; width: 1px !important; bottom: 0; right: 50%; padding: 0 !important; border: 0 !important; }
.ss-control {
    min-height: 42px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: #fff;
    padding: 6px 10px 6px 28px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; cursor: pointer; font-size: 13.5px;
    position: relative;
}
.ss-control::after { content: "\25BE"; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--color-text-muted); font-size: 12px; }
.ss.open .ss-control, .ss-control:focus { border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-light); outline: none; }
.ss.disabled .ss-control { background: var(--color-bg); cursor: not-allowed; opacity: .7; }
.ss-ph { color: var(--color-text-muted); }
.ss-value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ss-chip { background: var(--color-primary-light); color: var(--color-primary-dark); border-radius: 20px; padding: 2px 4px 2px 10px; font-size: 12px; display: inline-flex; align-items: center; gap: 4px; }
.ss-chip-x { border: none; background: rgba(0,0,0,.08); border-radius: 50%; width: 18px; height: 18px; line-height: 1; cursor: pointer; font-size: 13px; padding: 0; }
.ss-drop { display: none; position: absolute; z-index: 300; top: calc(100% + 4px); right: 0; left: 0; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-sm); box-shadow: var(--shadow-hover); padding: 6px; min-width: 220px; }
.ss.open .ss-drop { display: block; }
.ss-search { width: 100%; padding: 8px 10px !important; font-size: 13px !important; margin-bottom: 6px; }
.ss-list { max-height: 240px; overflow-y: auto; }
.ss-item { padding: 7px 10px; border-radius: 6px; cursor: pointer; font-size: 13px; }
.ss-item:hover, .ss-item.active { background: var(--color-primary-light); }
.ss-item.selected { color: var(--color-primary); font-weight: 600; }
.ss-item.disabled { color: var(--color-text-muted); cursor: not-allowed; }
.ss-group { font-size: 11px; color: var(--color-text-muted); padding: 6px 10px 2px; font-weight: 700; }
.ss-empty { padding: 10px; color: var(--color-text-muted); text-align: center; font-size: 12.5px; }
.toolbar .ss, .filter-bar .ss { min-width: 160px; }

/* Toast */
.toast { position: fixed; bottom: 20px; left: 20px; z-index: 999; padding: 12px 18px; border-radius: var(--radius-sm); box-shadow: var(--shadow-hover); font-size: 13px; opacity: 0; transform: translateY(10px); transition: all .25s ease; max-width: 360px; }
.toast.show { opacity: 1; transform: none; }
.toast-success { background: var(--color-success); color: #fff; }
.toast-danger { background: var(--color-danger); color: #fff; }
.toast-warning { background: var(--color-warning); color: #fff; }

/* هشدارها */
.alert-list { display: flex; flex-direction: column; gap: 8px; }
.alert-item { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); padding: 10px 14px; border-radius: var(--radius-sm); font-size: 13px; border-right: 4px solid; }
.alert-item-danger { background: var(--color-danger-bg); border-color: var(--color-danger); }
.alert-item-warning { background: var(--color-warning-bg); border-color: var(--color-warning); }
.alert-item-muted { background: var(--color-bg); border-color: var(--color-text-muted); }
.stat-card.warn .stat-value { color: var(--color-warning-text); }
.stat-card.bad .stat-value { color: var(--color-danger); }
.stat-card.good .stat-value { color: var(--color-success); }

/* Wizard */
.wizard-steps { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 6px; margin-bottom: var(--space-4); }
.wizard-step {
    flex: 1; min-width: 104px; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center;
    padding: 10px 6px; border-radius: var(--radius-md); background: var(--color-surface); border: 1px solid var(--color-border);
    font-size: 12px; color: var(--color-text-muted);
}
.wizard-step:hover { border-color: var(--color-primary); }
.wizard-step .num { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; background: var(--color-bg); color: var(--color-text-muted); }
.wizard-step.done .num { background: var(--color-success); color: #fff; }
.wizard-step.partial .num { background: var(--color-warning); color: #fff; }
.wizard-step.current { border-color: var(--color-primary); color: var(--color-text); box-shadow: 0 0 0 3px var(--color-primary-light); font-weight: 600; }
.wizard-step .state { font-size: 10.5px; }
.wizard-progress { height: 8px; border-radius: 20px; background: var(--color-border); overflow: hidden; margin-bottom: var(--space-4); }
.wizard-progress > span { display: block; height: 100%; background: linear-gradient(90deg, var(--color-primary), var(--color-success)); }
.wizard-nav { display: flex; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-5); flex-wrap: wrap; }
.offer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--space-3); }
.offer-card { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); }
.offer-card .g-name { font-weight: 700; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.offer-card .fields { display: flex; flex-wrap: wrap; gap: 6px 14px; padding-right: 26px; }
.check-label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: 13px; }
.check-label input { width: 16px; height: 16px; }

/* نوار عملیات گروهی */
.bulk-bar {
    position: sticky; bottom: 8px; z-index: 5; background: var(--color-sidebar-bg); color: #fff; border-radius: var(--radius-md);
    padding: 10px 14px; display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; margin-top: var(--space-4);
    box-shadow: var(--shadow-hover);
}
.bulk-bar select { width: auto; min-width: 130px; padding: 7px 10px; }
.bulk-bar .count { font-weight: 700; }

/* تب‌ها */
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--color-border); margin-bottom: var(--space-4); overflow-x: auto; }
.tab { padding: 10px 16px; border-bottom: 2px solid transparent; color: var(--color-text-muted); font-weight: 600; font-size: 13px; white-space: nowrap; cursor: pointer; background: none; border-top: 0; border-left: 0; border-right: 0; font-family: inherit; }
.tab.active { color: var(--color-primary); border-bottom-color: var(--color-primary); }

.school-tag { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 20px; background: var(--color-bg); font-size: 11px; margin: 2px; }
.school-tag.current { background: var(--color-primary-light); color: var(--color-primary-dark); }
.multi-badge { background: var(--color-warning-bg); color: var(--color-warning-text); border-radius: 20px; padding: 2px 8px; font-size: 11px; font-weight: 700; white-space: nowrap; }

.upload-drop {
    border: 2px dashed var(--color-border); border-radius: var(--radius-md); padding: 30px; text-align: center; cursor: pointer;
    color: var(--color-text-muted); transition: background .15s ease, border-color .15s ease; display: block;
}
.upload-drop.drag { background: var(--color-primary-light); border-color: var(--color-primary); }
.upload-drop input[type=file] { display: none; }
.progress-lg { height: 12px; background: var(--color-bg); border-radius: 20px; overflow: hidden; }
.progress-lg > span { display: block; height: 100%; width: 0; background: var(--color-primary); transition: width .2s ease; }
.photo-preview { display: flex; align-items: center; gap: var(--space-3); }
.table-wrap.scroll-y { max-height: 460px; overflow-y: auto; }
.table-wrap.scroll-y thead th { position: sticky; top: 0; background: var(--color-surface); z-index: 1; }
tr.row-muted td { color: var(--color-text-muted); }
tr.row-selected td { background: var(--color-primary-light); }

@media (max-width: 860px) {
    .year-switch label { display: none; }
    .year-switch { margin-inline-start: 6px; }
    .topbar { padding: 0 var(--space-3); gap: 6px; }
    .topbar .user-box > div:nth-child(2) { display: none; }
    .topbar-title { display: none; }
    .form-grid-3 { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .alert-item { flex-direction: column; align-items: flex-start; }
    .table-wrap table { font-size: 12px; }
}

@media print {
    .sidebar, .topbar, .no-print, .alert, .page-header .btn, .wizard-nav, .bulk-bar { display: none !important; }
    .content { padding: 0; }
    .card { box-shadow: none; border: none; padding: 0; }
    body, html { background: #fff; }
}

/* =====================================================================
   برنامه هفتگی — چیدمان Drag & Drop
   ===================================================================== */
.tt-layout { display: grid; grid-template-columns: 250px 1fr; gap: var(--space-4); align-items: start; }
.tt-pool { position: sticky; top: calc(var(--header-height) + 12px); max-height: calc(100vh - var(--header-height) - 24px); overflow-y: auto; }
.tt-pool.drop-target { outline: 3px dashed var(--color-danger); }
#ttPoolList { display: flex; flex-direction: column; gap: 6px; margin: 12px 0; }
.tt-legend { border-top: 1px solid var(--color-border); padding-top: 10px; line-height: 2; }
.tt-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; vertical-align: middle; }
.tt-dot.conflict { background: var(--color-danger); }
.tt-toolbar { display: flex; gap: var(--space-3); align-items: center; margin-bottom: var(--space-3); flex-wrap: wrap; }
.tt-status.dirty { color: var(--color-warning); font-weight: 700; }
.tt-status.saved { color: var(--color-success); }

.tt-grid { border-collapse: separate; border-spacing: 4px; min-width: 680px; width: 100%; table-layout: fixed; }
.tt-grid thead th { text-align: center; background: var(--color-bg); border-radius: 8px; color: var(--color-text); font-size: 12.5px; padding: 8px 4px; border: 0; }
.tt-grid th.tt-corner { width: 92px; }
.tt-grid .tt-period { background: var(--color-bg); border-radius: 8px; text-align: center; font-size: 12px; font-weight: 700; padding: 6px 4px; vertical-align: middle; }
.tt-grid .tt-time { font-weight: 400; font-size: 10.5px; color: var(--color-text-muted); }
.tt-grid td.tt-td { padding: 0; border: 0; vertical-align: top; }
.tt-grid tbody tr:hover td { background: transparent; }
.tt-cell { position: relative; border: 1px dashed var(--color-border); border-radius: 10px; min-height: 70px; padding: 3px; background: #fff; height: 100%; }
.tt-tools { position: absolute; top: 2px; left: 2px; display: flex; gap: 2px; opacity: 0; transition: opacity .15s; z-index: 2; }
.tt-cell:hover .tt-tools, .tt-tools .tt-tool.on { opacity: 1; }
.tt-cell:hover .tt-tools .tt-tool { opacity: 1; }
.tt-tool { width: 22px; height: 22px; border-radius: 6px; border: 1px solid var(--color-border); background: #fff; cursor: pointer; font-size: 11px; line-height: 1; padding: 0; color: var(--color-text-muted); }
.tt-tool.on { background: var(--color-info-bg); color: var(--color-info); border-color: var(--color-info); }
.tt-slots { display: grid; gap: 3px; height: 100%; min-height: 62px; }
.mode-parts .tt-slots, .mode-weeks .tt-slots { grid-template-rows: 1fr 1fr; }
.mode-quad .tt-slots { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; }
.tt-slot { border-radius: 8px; min-height: 30px; position: relative; display: flex; align-items: stretch; transition: background .1s; }
.mode-whole .tt-slot { min-height: 62px; }
.tt-slot:not(.filled) { background: repeating-linear-gradient(45deg, transparent, transparent 6px, #f6f8f8 6px, #f6f8f8 12px); }
.tt-slot-label { position: absolute; bottom: 1px; left: 4px; font-size: 9.5px; color: var(--color-text-muted); pointer-events: none; z-index: 1; }
.tt-slot.drop-target { background: var(--color-primary-light) !important; outline: 2px solid var(--color-primary); }
.tt-slot.busy-hint:not(.filled) { background: repeating-linear-gradient(45deg, #fdeaea, #fdeaea 6px, #fff 6px, #fff 12px); }
.tt-slot.busy-hint.drop-target { outline-color: var(--color-danger); }

.tt-chip {
    position: relative; flex: 1; border-radius: 8px; padding: 6px 8px; cursor: grab; user-select: none; touch-action: none;
    border-right: 4px solid rgba(0,0,0,.18); font-size: 12px; line-height: 1.5; min-width: 0;
}
.tt-slot .tt-chip { padding: 4px 6px 4px 18px; font-size: 11.5px; }
.mode-quad .tt-chip, .mode-parts .tt-chip, .mode-weeks .tt-chip { font-size: 10.5px; padding: 2px 4px 2px 16px; }
.tt-chip-sub { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tt-chip-teacher { font-size: 10.5px; opacity: .8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mode-quad .tt-chip-teacher { display: none; }
.tt-chip.selected { outline: 3px solid var(--color-primary); }
.tt-chip.dragging { opacity: .35; }
.tt-chip.conflict { box-shadow: inset 0 0 0 2px var(--color-danger); }
.tt-chip.conflict::before { content: "!"; position: absolute; top: 2px; right: 6px; width: 14px; height: 14px; border-radius: 50%; background: var(--color-danger); color: #fff; font-size: 10px; line-height: 14px; text-align: center; font-weight: 700; }
.tt-chip.error { box-shadow: inset 0 0 0 3px var(--color-danger); animation: ttShake .3s 2; }
@keyframes ttShake { 0%, 100% { transform: none; } 25% { transform: translateX(-2px); } 75% { transform: translateX(2px); } }
.tt-ghost { position: fixed; z-index: 1000; pointer-events: none; box-shadow: var(--shadow-hover); transform: rotate(-2deg); opacity: .95; }
body.tt-dragging, body.tt-dragging * { cursor: grabbing !important; }
.tt-x { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; border: 0; background: rgba(0,0,0,.12); cursor: pointer; font-size: 12px; line-height: 16px; padding: 0; opacity: 0; }
.tt-chip:hover .tt-x { opacity: 1; }
.tt-count { position: absolute; left: 8px; top: 50%; transform: translateY(-50%); font-size: 11px; font-weight: 700; background: rgba(255,255,255,.75); border-radius: 20px; padding: 1px 7px; }
.tt-count.done { background: var(--color-success); color: #fff; }
.tt-count.part { background: var(--color-warning-bg); color: var(--color-warning-text); }
#ttPoolList .tt-chip { padding-left: 64px; }

/* پالت رنگ دروس */
.tt-chip.c0 { background: #e3f2ec; } .tt-chip.c1 { background: #e6eefb; } .tt-chip.c2 { background: #fdf0e1; }
.tt-chip.c3 { background: #f3e8fb; } .tt-chip.c4 { background: #fde7ec; } .tt-chip.c5 { background: #e2f5f7; }
.tt-chip.c6 { background: #f1f4dd; } .tt-chip.c7 { background: #ece9f9; } .tt-chip.c8 { background: #fbeee3; }
.tt-chip.c9 { background: #e5f3e1; } .tt-chip.c10 { background: #f8e8f1; } .tt-chip.c11 { background: #e9eef1; }

/* برنامه هفتگی دبیر */
.teacher-week { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--space-3); }
.tw-day { background: var(--color-bg); border-radius: var(--radius-md); padding: 8px; }
.tw-head { font-weight: 700; text-align: center; margin-bottom: 8px; }
.tw-item { background: #fff; border-radius: 8px; padding: 6px 8px; margin-bottom: 6px; border-right: 3px solid var(--color-primary); font-size: 12px; }
.tw-time { font-size: 11px; color: var(--color-primary); font-weight: 700; }
.tw-empty { text-align: center; color: var(--color-text-muted); }

/* روزهای فعالیت */
.day-toggles { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.day-toggle { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 10px 6px; text-align: center; cursor: pointer; display: flex; flex-direction: column; gap: 2px; background: var(--color-bg); }
.day-toggle input { display: none; }
.day-toggle span { font-weight: 700; }
.day-toggle small { color: var(--color-text-muted); font-size: 11px; }
.day-toggle.on { background: var(--color-primary-light); border-color: var(--color-primary); }
.day-toggle.on small { color: var(--color-primary); }

@media (max-width: 1024px) {
    .tt-layout { grid-template-columns: 1fr; }
    .tt-pool { position: static; max-height: none; }
    #ttPoolList { flex-direction: row; flex-wrap: wrap; }
    #ttPoolList .tt-chip { flex: 0 1 200px; }
    .tt-tools { opacity: 1; }
}
@media print {
    .tt-layout { display: block; }
    .tt-grid { min-width: 0; }
    .tt-cell { border-style: solid; }
    .tt-slot:not(.filled) { background: none; }
}

/* ماتریس مجوزها */
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: var(--space-3); }
.perm-group { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.perm-group-title { font-weight: 700; font-size: 12.5px; color: var(--color-primary-dark); border-bottom: 1px dashed var(--color-border); padding-bottom: 4px; margin-bottom: 2px; }

/* منوی دسته‌بندی‌شده و جمع‌شونده */
.sidebar-nav .nav-home { font-weight: 600; margin-bottom: 6px; }
.nav-ico { width: 22px; display: inline-flex; justify-content: center; flex-shrink: 0; font-size: 14px; }
.nav-group { margin-bottom: 2px; border-radius: var(--radius-sm); }
.nav-group-head { width: 100%; display: flex; align-items: center; gap: var(--space-3); padding: 10px var(--space-3); border: 0; background: transparent; color: var(--color-sidebar-text); font-family: inherit; font-size: 13.5px; cursor: pointer; border-radius: var(--radius-sm); text-align: right; }
.nav-group-head:hover { background: var(--color-sidebar-bg-hover); }
.nav-group.has-active > .nav-group-head { color: #fff; font-weight: 600; }
.nav-group-title { flex: 1; }
/* فلش منو: بسته = رو به بیرون منو (چپ)، باز = رو به پایین */
.nav-caret { display: inline-flex; transition: transform .2s ease; opacity: .7; }
.nav-caret .ico { width: 15px; height: 15px; }
.nav-group.open .nav-caret { transform: rotate(-90deg); }
.nav-group-body { display: none; padding: 2px 0 6px; margin-right: 18px; border-right: 1px solid rgba(255,255,255,.1); }
.nav-group.open .nav-group-body { display: block; }
.sidebar-nav .nav-group-body a { padding: 7px 14px; font-size: 12.8px; margin-bottom: 1px; }
/* حضور و غیاب */
.att-seg { display: inline-flex; border: 1px solid var(--color-border); border-radius: 8px; overflow: hidden; }
.att-opt input { display: none; }
.att-opt span { display: inline-block; padding: 5px 10px; font-size: 12px; cursor: pointer; border-left: 1px solid var(--color-border); background: #fff; }
.att-opt:last-child span { border-left: 0; }
.att-present input:checked + span { background: var(--color-success-bg); color: var(--color-success); font-weight: 700; }
.att-absent input:checked + span { background: var(--color-danger); color: #fff; font-weight: 700; }
.att-late input:checked + span { background: var(--color-warning); color: #fff; font-weight: 700; }
.att-early_leave input:checked + span { background: var(--color-info); color: #fff; font-weight: 700; }
tr.att-row-absent td { background: #fff5f5; } tr.att-row-late td, tr.att-row-early_leave td { background: #fffaf2; }
.att-table input[type=text] { padding: 6px 8px; }
.att-counter { font-size: 12.5px; color: var(--color-text-muted); }

/* ---------------------------------------------------------------------
   امور مالی و پرداخت (صفحات عمومی والدین و چاپ کارت QR)
   --------------------------------------------------------------------- */
.toolbar input[readonly] { flex: 1; min-width: 220px; }
.pay-banner { width: 100%; max-height: 260px; object-fit: cover; border-radius: var(--radius-md); margin-bottom: var(--space-4); }
body.pay-public { background: var(--color-bg); min-height: 100vh; }
.pay-shell { max-width: 560px; margin: 0 auto; padding: var(--space-5) 16px; }
.pay-brand { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-4); color: var(--color-text); text-decoration: none; }
.pay-brand .logo { width: 44px; height: 44px; border-radius: var(--radius-md); background: var(--color-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; flex: none; }
.pay-brand small { display: block; color: var(--color-text-muted); font-size: 12px; }
.pay-card-main h1 { font-size: 19px; margin: var(--space-2) 0; }
.pay-card-main h2 { font-size: 15px; margin-top: var(--space-5); }
.pay-dl { width: 100%; margin: var(--space-3) 0; table-layout: fixed; display: table; }
.pay-dl th { text-align: right; color: var(--color-text-muted); font-weight: 500; width: 38%; }
.pay-total { font-size: 18px; font-weight: 700; color: var(--color-primary); }
.pay-wide { width: 100%; justify-content: center; }
.pay-foot { text-align: center; color: var(--color-text-muted); font-size: 11.5px; margin-top: var(--space-5); }
.pay-print-body { background: #fff; }
.pay-print-toolbar { display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; padding: var(--space-4); border-bottom: 1px solid var(--color-border); }
.pay-print-sheet { width: 210mm; min-height: 297mm; margin: 0 auto; padding: 8mm; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 68mm; gap: 4mm; box-sizing: border-box; }
.pay-print-card { border: 1px dashed #9aa; border-radius: 4mm; padding: 4mm; display: flex; justify-content: space-between; gap: 3mm; font-size: 10.5pt; overflow: hidden; }
.pay-print-card h2 { font-size: 12pt; margin: 1mm 0; }
.pay-print-school { font-size: 9pt; color: #555; }
.pay-print-card [dir=ltr] { word-break: break-all; }
.pay-print-amount { font-size: 12pt; font-weight: 700; margin: 1.5mm 0; }
.pay-qr { width: 30mm; flex: none; align-self: center; }
.pay-qr svg { width: 100%; height: auto; }
@media print {
    .pay-print-toolbar, .pay-noprint, .pay-foot { display: none !important; }
    .pay-print-sheet { page-break-after: always; padding: 6mm; }
    body.pay-public .pay-shell { max-width: none; }
    body.pay-public .alert.pay-keep { display: block !important; }
}
@media (max-width: 600px) {
    .pay-print-sheet { width: auto; min-height: 0; grid-template-columns: 1fr; }
}

/* مودل */
.sync-log { background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: var(--space-3); font-family: inherit; font-size: 12.5px; white-space: pre-wrap; max-height: 320px; overflow: auto; margin: 0 0 var(--space-3); }
tr.row-active > td { background: var(--color-primary-light); }
.text-danger { color: var(--color-danger); }
.card hr { border: 0; border-top: 1px solid var(--color-border); margin: var(--space-4) 0; }

/* =====================================================================
   بهبود ظاهر (نسخه ۸) — همان پالت رنگی؛ فقط تایپوگرافی، حالت‌ها و دسترس‌پذیری
   ===================================================================== */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

/* تایپوگرافی: عنوان‌های پررنگ‌تر و شکست خط متعادل */
h1, h2, h3, .card-title, .modal-title, .page-header h1 { text-wrap: balance; }
p, .subtitle, .hint, .alert, .empty-state { text-wrap: pretty; }
.page-header h1 { font-size: 21px; line-height: 1.4; letter-spacing: -0.2px; display: flex; align-items: center; gap: 8px; }
.page-header .subtitle { max-width: 72ch; }
.card-title { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14.5px; color: var(--color-primary-dark); }

/* ارقام هم‌عرض در جدول‌ها و آمار، تا ستون مبالغ و تعداد زیر هم بنشیند */
table, .stat-value, .pay-dl, .pay-total, .pagination, .badge, .progress, .tt-count { font-variant-numeric: tabular-nums; }
.stat-card .stat-value { font-size: 26px; line-height: 1.25; letter-spacing: -0.3px; }
.stat-card .stat-label { font-weight: 500; }

/* محتوا: عرض حداکثر روی صفحه‌های خیلی پهن */
.content { width: 100%; max-width: 1480px; margin-inline: auto; padding-bottom: calc(var(--space-6) + 8px); }
.content:focus { outline: none; }

/* کارت‌ها: گوشه داخلی تنگ‌تر از ظرف، سایه هم‌رنگ پس‌زمینه */
.card { border-radius: var(--radius-lg); }
.stat-card { border-radius: var(--radius-md); transition: box-shadow .2s ease, transform .2s ease; }
a > .stat-card:hover, a.stat-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-1px); }
.stat-card .stat-icon { border-radius: 10px; }

/* دکمه‌ها: بازخورد hover و فشردن */
.btn { transition: background-color .2s ease, border-color .2s ease, color .2s ease, filter .2s ease, transform .12s ease, box-shadow .2s ease; line-height: 1.5; }
.btn:active:not([disabled]) { transform: translateY(1px) scale(.985); }
.btn-primary:hover { filter: none; background: #0c5a4d; }
.btn-primary { box-shadow: 0 1px 2px rgba(11, 63, 55, .18); }
.btn-outline:hover { border-color: #cfd8d6; }
.btn-danger:hover { background: #f7d9d9; }
.btn-success:hover { background: #d3efe2; }
.btn-warning:hover { background: #fbe5c9; }
.btn-info:hover { background: #d8e6f6; }
.btn .ico { width: 16px; height: 16px; }

/* حلقه تمرکز برای کار با صفحه‌کلید (فقط هنگام پیمایش با Tab) */
:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.btn:focus-visible, .page-link:focus-visible, .tab:focus-visible { outline-offset: 2px; }
.sidebar :focus-visible { outline-color: #9fd8cb; outline-offset: -2px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: none; }
.skip-link {
    position: absolute; top: 8px; right: 8px; z-index: 1000; transform: translateY(-160%);
    background: var(--color-primary-dark); color: #fff; padding: 8px 14px; border-radius: var(--radius-sm); font-size: 13px;
    transition: transform .2s ease;
}
.skip-link:focus { transform: none; }

/* فرم‌ها: انتقال نرم حاشیه و حالت خطای مرورگر */
input[type=text], input[type=email], input[type=password], input[type=tel], input[type=date], input[type=number], input[type=search], select, textarea {
    transition: border-color .2s ease, box-shadow .2s ease;
}
input:hover:not(:focus):not([disabled]), select:hover:not(:focus):not([disabled]), textarea:hover:not(:focus):not([disabled]) { border-color: #cfd8d6; }
input:user-invalid, select:user-invalid, textarea:user-invalid { border-color: var(--color-danger); box-shadow: 0 0 0 3px var(--color-danger-bg); }
input[disabled], select[disabled], textarea[disabled], input[readonly] { background: var(--color-bg); }

/* جدول‌ها: سرستون آرام‌تر و ردیف hover نرم */
thead th { font-weight: 500; letter-spacing: .1px; }
tbody tr { transition: background-color .15s ease; }

/* نشان‌ها: گوشه کمتر گرد، کمتر شبیه قرص */
.badge, .school-tag, .multi-badge, .pill { border-radius: 6px; }
.badge { padding: 2px 8px; line-height: 1.7; }

/* هشدارها: لبه رنگی برای اسکن سریع */
.alert { border-inline-start: 3px solid currentColor; line-height: 1.8; }
.alert-muted { border-inline-start-color: var(--color-border); }

/* حالت خالی: ظرف خط‌چین به جای متن تنها */
.empty-state { border: 1px dashed var(--color-border); border-radius: var(--radius-md); background: linear-gradient(180deg, #fafbfb, transparent); padding: var(--space-6) var(--space-5); }
td > .empty-state, .table-wrap .empty-state { border: 0; background: none; }

/* منوی کناری: نشانگر صفحه جاری و انتقال نرم */
.sidebar { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.15) transparent; }
.sidebar-nav a, .nav-group-head { transition: background-color .2s ease, color .2s ease; }
.sidebar-nav .nav-group-body a.active { position: relative; }
.sidebar-nav .nav-group-body a.active::before {
    content: ""; position: absolute; right: -2px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: #6fc7b3;
}
.sidebar-brand .title { line-height: 1.5; }

/* نوار بالا: کمی شفاف هنگام اسکرول */
.topbar { background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: saturate(1.4) blur(8px); backdrop-filter: saturate(1.4) blur(8px); }

/* تب‌ها و صفحه‌بندی */
.tab { transition: color .2s ease, border-color .2s ease; border-radius: 6px 6px 0 0; }
.tab:hover:not(.active) { color: var(--color-text); background: var(--color-bg); }
.page-link { transition: background-color .2s ease, border-color .2s ease; }

/* صفحه ورود: عمق با گرادیان شعاعی روی همان رنگ‌ها */
.auth-screen {
    min-height: 100dvh;
    background:
        radial-gradient(1200px 600px at 85% -10%, rgba(111, 199, 179, .22), transparent 60%),
        radial-gradient(900px 500px at -10% 110%, rgba(15, 107, 92, .45), transparent 60%),
        linear-gradient(160deg, var(--color-sidebar-bg), var(--color-primary-dark));
}
.auth-card { box-shadow: 0 24px 48px -12px rgba(8, 36, 31, .45), 0 2px 6px rgba(8, 36, 31, .12); }

/* مودال: پس‌زمینه محو */
.modal { -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.modal-close { transition: background-color .2s ease; }

/* منوی موبایل: سایه کنار منوی باز */
@media (max-width: 860px) {
    .sidebar.open { box-shadow: -24px 0 48px rgba(8, 36, 31, .35); }
}
@media print {
    .skip-link { display: none !important; }
    .topbar { backdrop-filter: none; }
}

/* لوگوی مجتمع و نام سامانه «سیما» */
.sidebar-brand .logo-img { object-fit: contain; background: #fff; padding: 3px; border-radius: 10px; width: 44px; height: 44px; flex: none; }
.sidebar-brand .brand-system { font-size: 14px; font-weight: 700; line-height: 1.6; }
.sidebar-brand .subtitle { font-size: 11px; line-height: 1.6; }
.auth-logo { display: block; width: 88px; height: auto; margin: 0 auto var(--space-3); }
.auth-card h1.auth-system { font-size: 19px; line-height: 1.6; margin-bottom: 2px; color: var(--color-primary-dark); }
.auth-card .subtitle { line-height: 1.9; }
.pay-brand .logo-img { background: #fff; object-fit: contain; padding: 4px; border: 1px solid var(--color-border); }