/*
 * مولّد الجدول المدرسي — نظام التصميم الموحّد
 * الطراز: "Majestic Institutional" (مستوحى من Stitch/DESIGN.md) — هوية مؤسسية رسمية،
 * أسطح مسطّحة بحدود رفيعة بدل الزجاجية، أخضر داكن + ذهبي، خط Almarai المحلي بالكامل.
 * كل صفحات الموقع تحمّل هذا الملف فقط — لا أنماط داخل الصفحات (لا <style>، لا style="").
 */

/* ---------------------------------------------------------------------- */
/* 0) خط Almarai محلي بالكامل (بلا أي اعتماد على الإنترنت)                  */
/* ---------------------------------------------------------------------- */
@font-face {
  font-family: 'Almarai';
  src: url('fonts/Almarai-Light.ttf') format('truetype');
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: 'Almarai';
  src: url('fonts/Almarai-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Almarai';
  src: url('fonts/Almarai-Bold.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'Almarai';
  src: url('fonts/Almarai-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-display: swap;
}

/* ---------------------------------------------------------------------- */
/* 1) المتغيّرات: الألوان والخطوط والقياسات                                 */
/* ---------------------------------------------------------------------- */
:root {
  --primary: #0B3D3A;
  --primary-dark: #062B29;
  --primary-light: #E8F3F1;
  --gold: #B99645;
  --gold-light: #F4E8C8;
  --primary-rgb: 11, 61, 58; /* نفس --primary كقيم RGB — للظلال والتظليل الشفاف */

  --text-primary: #1F2933;
  --text-muted: #667085;
  --surface: #FFFFFF;
  --background: #F7F9FB;
  --border: #E4E7EC;

  --success: #157347;
  --warning: #B7791F;
  --danger: #B42318;

  --font: 'Almarai', 'Segoe UI', Tahoma, Arial, sans-serif;

  --radius-sm: 0.5rem;
  --radius-md: 0.625rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-full: 9999px;

  --shadow-ambient: 0 8px 24px rgba(var(--primary-rgb), 0.08);
  --header-height: 80px;
  --container-padding: 24px;
}

/* ---------------------------------------------------------------------- */
/* 2) الأساسيات                                                            */
/* ---------------------------------------------------------------------- */
* { box-sizing: border-box; }
html, body { height: 100%; }

body {
  margin: 0;
  font-family: var(--font);
  background-color: var(--background);
  color: var(--text-primary);
  line-height: 1.6;
}

h1, h2, h3 { font-family: var(--font); color: var(--primary); font-weight: 800; margin: 0 0 .5rem; }
h1 { font-size: 1.85rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.1rem; font-weight: 700; }
p { margin: 0 0 .75rem; }
a { color: var(--primary); }

.muted { color: var(--text-muted); font-size: .85rem; }
.text-sm { font-size: .85rem; }

/* ---------------------------------------------------------------------- */
/* 3) الرأس والتنقّل                                                       */
/* ---------------------------------------------------------------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.site-nav {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1.5rem;
  height: var(--header-height);
  max-width: 95vw;
  margin: 0 auto;
}
.brand { justify-self: start; }
.brand img {
  height: 52px;
  width: auto;
  display: block;
}
.site-nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.75rem;
  flex-wrap: wrap;
  height: 100%;
}
.site-nav-links a {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
  color: var(--text-muted);
  text-decoration: none;
  font-size: .95rem;
  font-weight: 700;
  transition: color .2s ease;
  white-space: nowrap;
}
.site-nav-links a:hover { color: var(--primary); }
.site-nav-links a.active { color: var(--primary); }
.site-nav-links a.active::after {
  content: "";
  position: absolute;
  bottom: -1px;
  right: 0;
  left: 0;
  height: 3px;
  background: var(--gold);
  border-radius: var(--radius-full);
}
.site-nav-user {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.site-nav-user .nav-user { font-size: .82rem; }
.nav-badge {
  background: var(--gold-light);
  color: var(--primary-dark);
  border: 1px solid var(--gold);
  border-radius: var(--radius-full);
  padding: .2rem .7rem;
  font-size: .78rem;
  font-weight: 800;
  white-space: nowrap;
}
.btn.btn-sm { padding: .35rem .7rem; font-size: .82rem; }

.justify-center { justify-content: center; }

/* رسوم شريطية مصغّرة داخل بطاقات الإحصاء (لوحة التحكم) — سلسلة بنين بالأخضر
   الأساسي وسلسلة بنات بذهبي أغمق قليلاً من --gold ليجتاز تباين 3:1 على الأبيض */
:root { --chart-gold: #AD8B3D; }

/* ---------------------------------------------------------------------- */
/* الثيمات اللونية — باقات جاهزة تختارها المدرسة من إعدادات الرئيسية.        */
/* ⚠️ مرآة includes/themes.php (قيم التصدير والمعاينة) — عدّل الاثنين معاً.  */
/* ---------------------------------------------------------------------- */
[data-theme="majestic"] { /* أخضر (الافتراضية) — كتلة صريحة كي لا ترث رقاقة
  المنتقي ألوان ثيمة الصفحة الحالية فتبدو وكأن الترتيب تغيّر */
  --primary: #0B3D3A; --primary-dark: #062B29; --primary-light: #E8F3F1;
  --gold: #B99645; --gold-light: #F4E8C8; --chart-gold: #AD8B3D;
  --primary-rgb: 11, 61, 58;
}
[data-theme="navy"] { /* الكحلي الملكي */
  --primary: #1B355E; --primary-dark: #10233F; --primary-light: #E9EFF8;
  --gold: #B08A3E; --gold-light: #F2E7CE; --chart-gold: #A5813A;
  --primary-rgb: 27, 53, 94;
}
[data-theme="burgundy"] { /* النبيذي الفاخر */
  --primary: #6E1E2B; --primary-dark: #4C1119; --primary-light: #FAECEE;
  --gold: #C4A265; --gold-light: #F3EADA; --chart-gold: #9E8049;
  --primary-rgb: 110, 30, 43;
}
[data-theme="plum"] { /* البنفسجي الليلي */
  --primary: #46295A; --primary-dark: #2F1A3E; --primary-light: #F2ECF7;
  --gold: #BE9550; --gold-light: #F2E8D5; --chart-gold: #A5823F;
  --primary-rgb: 70, 41, 90;
}
[data-theme="petrol"] { /* الأزرق البترولي */
  --primary: #0E4C5C; --primary-dark: #08343F; --primary-light: #E7F2F5;
  --gold: #C87941; --gold-light: #F6E7DB; --chart-gold: #B26A35;
  --primary-rgb: 14, 76, 92;
}
[data-theme="charcoal"] { /* الفحمي الأنيق */
  --primary: #2B3440; --primary-dark: #1B222B; --primary-light: #EDF0F4;
  --gold: #B99645; --gold-light: #F4E8C8; --chart-gold: #AD8B3D;
  --primary-rgb: 43, 52, 64;
}
[data-theme="desert"] { /* الرملي الصحراوي */
  --primary: #715427; --primary-dark: #4F3A18; --primary-light: #F7F1E4;
  --gold: #2F7A5B; --gold-light: #DEF0E7; --chart-gold: #27684D;
  --primary-rgb: 113, 84, 39;
}
[data-theme="rose"] { /* الوردي الملكي */
  --primary: #8A2D52; --primary-dark: #611E39; --primary-light: #FAEDF3;
  --gold: #C08552; --gold-light: #F5E7DC; --chart-gold: #A9713F;
  --primary-rgb: 138, 45, 82;
}
[data-theme="orchid"] { /* الأوركيد */
  --primary: #7A3B6E; --primary-dark: #582849; --primary-light: #F7EDF5;
  --gold: #C4A265; --gold-light: #F3EADA; --chart-gold: #9E8049;
  --primary-rgb: 122, 59, 110;
}
[data-theme="berry"] { /* التوتي الفاخر */
  --primary: #7D2150; --primary-dark: #591738; --primary-light: #FAECF2;
  --gold: #3E8E7E; --gold-light: #E2F1EE; --chart-gold: #2F7568;
  --primary-rgb: 125, 33, 80;
}
[data-theme="mauve"] { /* الموف الناعم */
  --primary: #75566B; --primary-dark: #543C4D; --primary-light: #F6EFF4;
  --gold: #C08552; --gold-light: #F5E7DC; --chart-gold: #A9713F;
  --primary-rgb: 117, 86, 107;
}
[data-theme="pink"] { /* وردي */
  --primary: #A61E5C; --primary-dark: #781542; --primary-light: #FBEBF2;
  --gold: #C08552; --gold-light: #F5E7DC; --chart-gold: #A9713F;
  --primary-rgb: 166, 30, 92;
}
[data-theme="orange"] { /* برتقالي غامق + تركوازي مكمّل */
  --primary: #B04F00; --primary-dark: #7E3900; --primary-light: #FDF1E6;
  --gold: #2E7D74; --gold-light: #DFF0ED; --chart-gold: #28685F;
  --primary-rgb: 176, 79, 0;
}
.mini-chart { margin-top: .8rem; }
.mini-row { display: flex; }
.mini-row > * { flex: 1; display: flex; justify-content: center; }
.mini-row.plots { border-bottom: 1px solid var(--border); height: 64px; }
.mini-plot { display: flex; gap: 2px; align-items: flex-end; }
.mini-col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 3px; }
.mini-val { font-size: .7rem; font-weight: 800; color: var(--text-primary); line-height: 1; }
.mini-bar { width: 16px; border-radius: 4px 4px 0 0; background: var(--primary); min-height: 2px; }
.mini-bar.alt { background: var(--chart-gold); }
.mini-label { font-size: .72rem; color: var(--text-muted); white-space: nowrap; padding-top: .3rem; }
.mini-legend { display: flex; gap: 1rem; justify-content: center; margin-top: .45rem; font-size: .72rem; color: var(--text-muted); }
.mini-legend .swatch { width: 10px; height: 10px; border-radius: 3px; background: var(--primary); display: inline-block; margin-inline-end: .3rem; vertical-align: -1px; }
.mini-legend .swatch.alt { background: var(--chart-gold); }

/* ============================= المحرر اليدوي ============================= */
/* لوحة ألوان الأقسام: 12 صبغة متباعدة على عجلة الألوان — تمييز فوري بين
   الأقسام المتجاورة، والنص داكن دائماً */
.dept-c0  { background: #F6C6CB; } /* أحمر وردي */
.dept-c1  { background: #FFD9A8; } /* برتقالي */
.dept-c2  { background: #FFF1A6; } /* أصفر */
.dept-c3  { background: #D9EDA4; } /* ليموني */
.dept-c4  { background: #B7E4C0; } /* أخضر */
.dept-c5  { background: #A8DFD8; } /* تركوازي */
.dept-c6  { background: #ADE0F7; } /* سماوي */
.dept-c7  { background: #BFCBF2; } /* أزرق بنفسجي */
.dept-c8  { background: #DCC2EC; } /* بنفسجي */
.dept-c9  { background: #F7C2DE; } /* وردي */
.dept-c10 { background: #DFC9B8; } /* بني فاتح */
.dept-c11 { background: #D9DEE3; } /* رمادي مزرق */

/* مساحة كافية أسفل الجدول كي لا تغطي محطة الانتظار الصفوف الأخيرة
   (card.editor-board لكسب الأولوية على هامش .card العام) */
.card.editor-board { padding-bottom: .5rem; margin-bottom: calc(19vh + 160px); }
table.editor-grid td.ecell {
  min-width: 42px; height: 34px; padding: 2px;
  vertical-align: middle; position: relative;
}
table.editor-grid td.ecell.blk { background: var(--border); opacity: .85; }
.ecard {
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 6px;
  padding: .15rem .3rem;
  font-size: .78rem;
  font-weight: 800;
  color: var(--text-primary);
  text-align: center;
  cursor: grab;
  touch-action: none;
  user-select: none; -webkit-user-select: none;
  direction: ltr;
}
.ecard.pair { border-style: double; border-width: 3px; }
.ecard.esource { opacity: .35; }
.eghost {
  position: fixed; z-index: 300; pointer-events: none;
  box-shadow: 0 6px 18px rgba(0,0,0,.25); transform: rotate(-2deg);
}
/* ثلاث درجات للأهداف أثناء السحب:
   أخضر = خانة فارغة بلا أي تعارض (المكان الصحيح مباشرة)
   ذهبي متقطع = فارغة لكن فيها تحذير (تعارض فصل/حظر/قاعدة)
   ذهبي متصل = مشغولة (الإفلات يُزيح البطاقة الحالية) */
td.ecell.drop-free { box-shadow: inset 0 0 0 2px #1F9D55; background: rgba(31,157,85,.08); }
td.ecell.drop-warn { box-shadow: inset 0 0 0 2px var(--gold); border-style: dashed; }
td.ecell.drop-swap { box-shadow: inset 0 0 0 2px var(--gold); }
#bench.droppable   { background: var(--primary-light); }
.drop-legend.free {
  color: #1F9D55; font-weight: 800;
  border-bottom: 2px solid #1F9D55;
}
td.ecell.drop-hover, #bench.drop-hover { outline: 3px solid var(--primary); outline-offset: -3px; }

.bench {
  position: fixed; bottom: 0; right: 0; left: 0; z-index: 90;
  height: 19vh; min-height: 120px;
  background: var(--surface);
  border-top: 2px solid var(--primary);
  box-shadow: 0 -6px 18px rgba(0,0,0,.08);
  padding: .5rem 1rem;
  display: flex; flex-direction: column; gap: .4rem;
}
.bench-head { display: flex; align-items: center; gap: .75rem; }
.bench-cards {
  display: flex; gap: .5rem; align-items: flex-start;
  overflow-x: auto; flex: 1; padding-bottom: .25rem;
}
.ecard.bench-card {
  display: flex; flex-direction: column; gap: 1px;
  min-width: 110px; padding: .3rem .5rem; direction: rtl;
}
.ecard.bench-card strong { font-size: .95rem; direction: ltr; }
.ecard.bench-card span { font-size: .72rem; font-weight: 700; }
.ecard.bench-card em { font-size: .68rem; font-style: normal; color: var(--text-muted); }

/* إعادة الترتيب بالسحب والإفلات */
.is-hidden { display: none !important; }
.reorder-form { display: none; align-items: center; gap: .6rem; }
.reorder-form.open { display: flex; }
table.grid.reordering tr[data-rid] { cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
table.grid.reordering tr[data-rid] td { border-style: dashed; }
table.grid.reordering .actions { pointer-events: none; opacity: .3; }
tr.dragging { cursor: grabbing; }
tr.dragging td { background: var(--gold-light) !important; }

/* شريط تصفية بقوائم منسدلة (صفحات الإدارة) */
.filter-row {
  background: var(--surface-container-high, #F4F6F5);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: .6rem .9rem;
}
.filter-row label { font-size: .82rem; color: var(--text-muted); }

/* تصفية حيّة (جلب خلفي): تعتيم خفيف على النتائج أثناء التحديث */
.ajax-loading { opacity: .55; transition: opacity .15s ease; }

/* صفحة حسابي (مدير النظام) */
.account-card { max-width: 32rem; }
.account-form { gap: 1rem; }
/* حساب المدرسة: بطاقتان متجاورتان بنفس الارتفاع، بعرض محدود وموسَّطتين (لا
   تمتدّان كامل الشاشة). تنهاران لعمود واحد على الجوال. المحدِّد المركّب يتجاوز
   align-items:start في .cols-2 المعرّفة لاحقاً */
.cols-2.account-cols { align-items: stretch; max-width: 56rem; margin-inline: auto; }
.account-cols > .account-card { max-width: none; margin-bottom: 0; }
.soft-divider { border: 0; border-top: 1px solid var(--border); margin: .25rem 0; width: 100%; }

/* صفحة تسجيل الدخول */
.auth-body { min-height: 100vh; display: flex; }
.auth-main { margin: auto; width: 100%; max-width: 420px; padding: 1.5rem; }
.auth-card { padding: 2.25rem; }
.auth-brand { text-align: center; margin-bottom: 1rem; }
.auth-brand img { height: 52px; width: auto; display: block; margin-inline: auto; }
.auth-title { text-align: center; margin: 0 0 1.5rem; font-size: 1.4rem; }
.auth-form { display: flex; flex-direction: column; gap: .35rem; }
.auth-label { font-weight: 700; margin-top: .6rem; }
.auth-form input { width: 100%; max-width: 100%; }
.auth-submit { width: 100%; justify-content: center; margin-top: 1.25rem; }

.site-footer {
  max-width: 95vw;
  margin: 3rem auto 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--border);
  color: var(--text-muted);
  font-size: .85rem;
  text-align: center;
}

/* ---------------------------------------------------------------------- */
/* 4) التخطيط العام                                                        */
/* ---------------------------------------------------------------------- */
main {
  max-width: 95vw;
  margin: 2rem auto;
  padding: 0 var(--container-padding);
}

.page-hero {
  margin-bottom: 1.75rem;
  border-inline-start: 4px solid var(--gold);
  padding-inline-start: 1.25rem;
}
.page-hero h1 { color: var(--primary); font-weight: 800; }
.page-hero p { color: var(--text-muted); max-width: 65ch; }

.flex-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: space-between;
}

.stagger-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
  align-items: start;
}

.flex-row { display: flex; gap: 1rem; flex-wrap: wrap; }
.flex-row.items-center { align-items: center; }

.mt-1 { margin-top: 1rem; }
.mt-2 { margin-top: 2rem; }
.mb-1 { margin-bottom: 1rem; }
.text-base { font-size: 1rem; }
.text-center { text-align: center; }

/* الرئيسية: بطاقة الإحصائيات (الثانية) أعرض من بطاقة إعدادات المدرسة */
.two-col-wide { grid-template-columns: 1fr 1.3fr; align-items: stretch; }
.cols-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: start; }
@media (max-width: 900px) { .cols-2 { grid-template-columns: 1fr; } }
.ring-card { display: flex; flex-direction: column; justify-content: flex-start; margin-bottom: 0; }
.two-col-wide > .card { margin-bottom: 1.5rem; }
.ring-split {
  display: flex;
  align-items: flex-start; /* كل الأعمدة تبدأ من أعلى البطاقة على نفس الارتفاع */
  justify-content: center;
  gap: 2rem;
  flex-wrap: wrap;
}
.ring-info { display: flex; flex-direction: column; align-items: center; text-align: center; }
.ring-load-table { max-width: 340px; font-size: .78rem; }
.ring-load-table th, .ring-load-table td { padding: .3rem .5rem; white-space: nowrap; }
.ring-load-table td.tname, .ring-load-table th.tname { width: 100%; }
.period-stats { display: flex; flex-direction: column; align-items: center; }
.period-stats-table { max-width: none; }
.period-stats-table td:last-child { text-align: center; }
/* فاصل مرئي واضح بين أقسام جدول الإحصائيات — شريط سميك بلون الإطار (يبقى ثابتاً مع hover) */
.period-stats-table tr.sep td,
table.grid.period-stats-table tr.sep:hover td { padding: 0; height: 14px; background: var(--border); border-bottom: 0; }
.period-stats-note { font-size: .72rem; margin: .35rem 0 0; }
/* شعار المدرسة: قبل الاسم في hero الرئيسية + معاينة في حسابي/تعديل المدرسة */
.school-logo-hero { height: 3.2rem; width: auto; vertical-align: middle; margin-inline-start: .2rem; margin-inline-end: .8rem; }
.school-logo-preview { height: 84px; width: auto; border: 1px solid var(--border); border-radius: 8px; padding: 6px; background: #fff; }
.school-logo-preview.sm { height: 46px; }
.logo-upload-row { align-items: center; gap: 1.25rem; }
/* منتقي الثيمة اللونية: رقاقات بعينتي لون (كل رقاقة تحمل data-theme فترث
   متغيرات ثيمتها نفسها — مصدر ألوان واحد بلا تكرار) */
.theme-row label { display: block; }
.theme-pick { display: flex; flex-wrap: wrap; gap: .5rem; }
.theme-opt input { position: absolute; opacity: 0; pointer-events: none; }
.theme-opt { cursor: pointer; }
.theme-chip {
  display: inline-flex; align-items: center;
  border: 2px solid var(--border); border-radius: var(--radius-full);
  padding: .35rem .55rem; background: var(--surface);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.theme-opt:hover .theme-chip { border-color: var(--gold); transform: scale(1.08); }
.theme-opt input:checked + .theme-chip {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .18);
}
.theme-dot { width: 30px; height: 30px; border-radius: 50%; display: inline-block; }
.theme-dot.p { background: var(--primary); }
.theme-dot.g { background: var(--gold); margin-inline-start: -14px; border: 3px solid var(--surface); }

/* مواد الأقسام (ثانوي): جدول المواد + شارة تفعيل/تعطيل + إخفاء صفوف النموذج حسب النوع */
.ds-table td, .ds-table th { padding: .35rem .5rem; }
tr.ds-off td { opacity: .5; }
.badge-btn {
  border: 1px solid var(--border); border-radius: var(--radius-full);
  padding: .15rem .7rem; font-size: .75rem; font-weight: 800; cursor: pointer;
  background: var(--surface); font-family: var(--font);
}
.badge-btn.on { background: rgba(21, 115, 71, 0.1); color: var(--success); border-color: var(--success); }
.badge-btn.off { background: var(--background); color: var(--text-muted); }
.hidden-row { display: none !important; }

/* توزيع الثانوية: خلايا الاختيار الحر (قوائم متراصة) وخلايا «لا ينطبق» */
.free-cell select { display: block; width: 100%; min-width: 9.5rem; margin-top: 4px; }
.free-cell select:first-child { margin-top: 0; }
.cell-center { text-align: center; }
/* خانة توزيع ناقصة — تمييز أحمر يسهل رصده */
td.cell-missing { background: rgba(180, 35, 24, 0.08); box-shadow: inset 0 0 0 2px rgba(180, 35, 24, 0.35); }
/* سجل النشاط: صفّا الحدثين المتسببين في تنبيه النشاط المشبوه */
tr.row-flagged td { background: rgba(180, 35, 24, 0.07); }
/* سجل الإنشاءات: صفّ جدول محذوف مؤقّتاً (يظهر لمدير النظام فقط) */
tr.row-deleted td { background: rgba(120, 120, 120, 0.10); color: var(--muted); }
/* إعادة تسمية الجدول: زر الاسم + حقل التحرير في الخلية */
.name-cell .name-view { display: inline-flex; align-items: center; gap: .35rem; background: none;
  border: none; padding: 0; font: inherit; color: inherit; cursor: pointer; }
.name-cell .name-view svg { width: .85em; height: .85em; opacity: .45; }
.name-cell .name-view:hover svg { opacity: .9; }
.name-cell .name-edit { display: flex; align-items: center; gap: .25rem; }
.name-cell .rename-input { width: 11rem; max-width: 40vw; }
/* حقل رقمي قصير داخل جدول (إعدادات المواد الجديدة في معاينة الاستيراد) */
.w-4rem { width: 5.5rem; }
/* جدول الاحتياط: خانات مرشّحي كل حصة */
.sub-table td { vertical-align: top; min-width: 8rem; }
.sub-table th { white-space: nowrap; }

/* صفحة التصدير */
.export-pick select { min-width: 24rem; max-width: 100%; }
.export-table { max-width: 40rem; }
.export-table td, .export-table th { text-align: center; }
.export-table td.tname, .export-table th.tname { text-align: right; }
/* خلية التنزيل: القائمة يميناً والزر يساراً بمحاذاة ثابتة عبر كل الصفوف
   (زر Excel وحده يبقى بنفس حافة أزرار PDF) */
.export-dl { display: flex; gap: .5rem; align-items: center; justify-content: flex-end; }
.export-dl select { min-width: 11rem; }
.export-dl .btn { white-space: nowrap; }
.export-cols { align-items: stretch; }
.export-cols > .card { margin-bottom: 0; }
.ring-wrap { position: relative; display: inline-flex; margin-bottom: 1rem; }
.ring-wrap .ring-center {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ring-pct { font-family: var(--font); font-size: 1.6rem; font-weight: 800; color: var(--primary); }
.cols-2-1 { grid-template-columns: 2fr 1fr; }
@media (max-width: 820px) { .two-col-wide, .cols-2-1 { grid-template-columns: 1fr; } }

.ring-stat { font-family: var(--font); font-size: 1.8rem; font-weight: 800; margin: 0; color: var(--primary); }

/* ---------------------------------------------------------------------- */
/* 5) الإحصاءات المدمجة (بلا بطاقات — أعمدة مقسومة بخطوط رفيعة)             */
/* ---------------------------------------------------------------------- */
.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 1.75rem 0;
}
.stat-grid > .stat-tile {
  padding: 0 1.75rem;
  border-inline-start: 1px solid var(--border);
}
.stat-grid > .stat-tile:first-child { border-inline-start: 0; }

.stat-tile-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.stat-tile-head .icon-badge {
  background: var(--primary-dark);
  color: #fff;
  border-radius: var(--radius-md);
  padding: .6rem;
  display: inline-flex;
  transition: background-color .2s ease, color .2s ease;
}
.stat-tile-label {
  color: var(--primary-dark);
  font-size: .85rem;
  margin-bottom: .3rem;
}
.stat-tile-value {
  font-family: var(--font);
  font-size: 2.2rem;
  font-weight: 800;
  color: var(--primary);
  line-height: 1;
  display: flex;
  align-items: baseline;
  gap: .4rem;
}
.stat-tile-value .unit { font-size: 1rem; font-weight: 700; color: var(--text-muted); }
.stat-tile-bar { margin-top: 1.25rem; height: 6px; background: var(--border); border-radius: var(--radius-full); overflow: hidden; }
.stat-tile-bar > span { display: block; height: 100%; background: var(--primary); border-radius: var(--radius-full); }

/* ---------------------------------------------------------------------- */
/* 6) البطاقات — أسطح مسطّحة بحدود رفيعة (لا زجاجية، لا ظلال ثقيلة)         */
/* ---------------------------------------------------------------------- */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.75rem;
  margin-bottom: 1.5rem;
}
.card > h3:first-child, .card > h2:first-child { margin-top: 0; }

.card-danger { border-color: rgba(180, 35, 24, 0.35); }
.card-danger h3 { color: var(--danger); }
.card-warn { border-color: rgba(183, 121, 31, 0.35); }
.card-warn h3 { color: var(--warning); }

/* ملاحظات استشارية (details قابل للطي فوق شبكة الجدول) */
.notes-card > summary { cursor: pointer; display: flex; align-items: center; gap: .5rem;
  font-size: 1.15rem; list-style: none; }
.notes-card > summary::-webkit-details-marker { display: none; }
.notes-card > summary::after { content: '▾'; margin-inline-start: auto; color: var(--muted);
  transition: transform .15s; }
.notes-card[open] > summary::after { transform: rotate(180deg); }
.notes-card .notes-group { margin-top: 1rem; }
.notes-card .notes-group h4 { margin: 0 0 .35rem; color: var(--primary); }
.notes-card .notes-group ul { margin: 0; padding-inline-start: 1.25rem; }
.notes-card .notes-group li { margin-bottom: .2rem; }

/* ---------------------------------------------------------------------- */
/* 7) الأزرار                                                              */
/* ---------------------------------------------------------------------- */
button, .btn {
  font-family: var(--font);
  font-weight: 700;
  font-size: .92rem;
  line-height: 1.4;   /* توحيد ارتفاع <button> و <a class="btn"> */
  border: 1px solid transparent;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .6rem 1.35rem;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: background-color .15s ease, color .15s ease, opacity .15s ease;
  background: var(--primary);
  color: #fff;
}
button:hover, .btn:hover { background: var(--primary-dark); }
button:active, .btn:active { opacity: .85; }
button:disabled { opacity: .6; cursor: not-allowed; }

button.ghost, .btn.ghost {
  background: var(--surface);
  color: var(--primary);
  border-color: var(--primary);
}
button.ghost:hover, .btn.ghost:hover { background: var(--primary-light); }

button.danger, .btn.danger {
  background: rgba(180, 35, 24, 0.08);
  color: var(--danger);
  border-color: transparent;
}
button.danger:hover, .btn.danger:hover { background: var(--danger); color: #fff; }

.btn-lg { font-size: 1.05rem; padding: .9rem 2rem; border-radius: var(--radius-md); }
.btn-eq { min-width: 9rem; justify-content: center; }

/* أزرار الإجراءات المتكررة (تعديل/حذف/تفعيل...) داخل الجداول:
   صف أفقي واحد، أيقونة فقط بلا نص، بحجم موحّد، ولون موحّد عدا الحذف الأحمر.
   النص يظهر كتلميح عند التحويم (title/aria-label). */
.actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: .4rem;
}
.btn-icon {
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
}
.btn-icon .icon { width: 1.1rem; height: 1.1rem; }

/* ---------------------------------------------------------------------- */
/* 8) عناصر النماذج                                                        */
/* ---------------------------------------------------------------------- */
label { font-weight: 700; color: var(--text-primary); font-size: .9rem; }

/* تنسيق موحّد لكل حقول الإدخال النصية أياً كان type (نص/بريد/كلمة مرور/رقم/
   هاتف/تاريخ…) — نستثني فقط الأنواع غير النصية (checkbox/radio/زر/…) كي لا
   يُنسى نوع جديد بلا تنسيق مستقبلاً. */
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=submit]):not([type=button]):not([type=reset]),
select, textarea {
  font-family: var(--font);
  font-size: .95rem;
  color: var(--text-primary);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: .55rem .7rem;
  transition: border-color .2s ease, box-shadow .2s ease;
  box-sizing: border-box;
}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=submit]):not([type=button]):not([type=reset]):focus,
select:focus, textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.12);
}
/* ارتفاع موحّد لكل الحقول أحادية السطر (نص/بريد/كلمة مرور/رقم/قوائم منسدلة) —
   بلا الملفات ولا القوائم متعددة الاختيار ولا القوائم داخل خلايا الجدول. */
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=submit]):not([type=button]):not([type=reset]):not([type=file]),
select:not([multiple]) {
  height: 2.6rem;
  padding: 0 .75rem;
}
input[type=number] { width: 6rem; text-align: center; font-weight: 700; color: var(--primary); }
select[multiple] { background: var(--surface); height: auto; padding: .55rem .7rem; }
table.grid select:not([multiple]) { height: auto; padding: 0; }

.field-wide { min-width: 18rem; width: 100%; max-width: 26rem; }
.select-multi { min-width: 15rem; }
.select-narrow { width: 6rem; text-align: center; text-align-last: center; }
.select-fixed { width: 14rem; }

label.chk {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin-inline-end: 1rem;
  font-weight: 400;
  color: var(--text-primary);
}
/* مجموعة خانات اختيار متعددة تحت نفس التسمية — كل واحدة في سطرها، تحت بعضها بمحاذاة واحدة */
.chk-stack { display: flex; flex-direction: column; gap: .5rem; }
.chk-stack label.chk { margin-inline-end: 0; }

.formrow {
  margin-bottom: .9rem;
  display: flex;
  gap: .75rem;
  align-items: center;
  flex-wrap: wrap;
}
.formrow.align-start { align-items: flex-start; }
.formrow > label:first-child { min-width: 11rem; font-weight: 700; color: var(--text-primary); }

/* زوج تسمية+حقل متكرر داخل formrow (مثال: عدة "الصف N" متتالية) —
   يمنع قاعدة label:first-child أعلاه من تكبير أول تسمية فقط بالخطأ */
.field-pair { display: inline-flex; align-items: center; gap: .5rem; }

/* نمط "التسمية فوق الحقل" (بديل formrow حين يحتاج النموذج ترتيباً أوضح) */
.field-stack { display: flex; flex-direction: column; gap: .4rem; }
.field-stack label { margin: 0; }
.form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
.scope-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.25rem;
  margin-bottom: 1rem;
}

/* ---------------------------------------------------------------------- */
/* 9) الجداول                                                              */
/* ---------------------------------------------------------------------- */
table.grid {
  border-collapse: collapse;
  width: 100%;
  background: var(--surface);
  border-radius: var(--radius-md);
  overflow: hidden;
}
table.grid th, table.grid td {
  padding: .65rem .8rem;
  text-align: center;
  border-bottom: 1px solid var(--border);
}
table.grid th {
  background: var(--primary);
  color: #fff;
  font-size: .8rem;
  font-weight: 700;
}
table.grid tr:last-child td { border-bottom: 0; }
table.grid tr:hover td { background: var(--background); }
/* display:block: القائمتان في خلية المادة ذات المعلمَين تُقاسان فوق بعضهما عند
   حساب عرض الأعمدة — بدونها يُحسب العمود بعرضهما جنباً إلى جنب (ضعف العرض) */
table.grid select { display: block; width: 100%; background: transparent; border: 0; }
table.grid td.tname, table.grid th.tname { text-align: right; }
/* خلايا عرض الفصول في timetable.php: ارتفاع موحّد حتى مع مدرسَين (اسمان في سطرين) */
table.grid td.class-cell { height: 5.4rem; vertical-align: middle; }
table.grid th.clickable-header { cursor: pointer; user-select: none; }
table.grid th.clickable-header:hover { background: var(--primary-dark); }

.th-actions { width: 12rem; }

form.inline { display: inline; }
.scroll-x { overflow-x: auto; }

.max-w-sm  { max-width: 500px; }
.max-w-md  { max-width: 600px; }
.max-w-lg  { max-width: 700px; }
.max-w-xl  { max-width: 800px; }
.max-w-xxl { max-width: 1000px; }

td.unavail { background: rgba(180, 35, 24, 0.12) !important; }

/* ---------------------------------------------------------------------- */
/* 10) الشارات والتنبيهات                                                  */
/* ---------------------------------------------------------------------- */
.badge {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .2rem .7rem;
  border-radius: var(--radius-full);
  font-size: .78rem;
  font-weight: 700;
}
.badge.hard { background: rgba(180, 35, 24, 0.1); color: var(--danger); }
.badge.soft { background: rgba(183, 121, 31, 0.1); color: var(--warning); }
.badge.on   { background: rgba(21, 115, 71, 0.1); color: var(--success); }
.badge.off  { background: var(--border); color: var(--text-muted); }

/* إشعارات منبثقة (Toast): تنزل من الأعلى، تبقى في الأعلى، ثم تختفي بعد ٣ ثوانٍ */
.toast-stack {
  position: fixed;
  top: 1rem;
  left: 0;
  right: 0;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .6rem;
  pointer-events: none;
}
.toast {
  pointer-events: auto;
  cursor: pointer;
  min-width: 260px;
  max-width: 90vw;
  padding: .9rem 1.4rem;
  border-radius: var(--radius-md);
  font-weight: 700;
  color: #fff;
  text-align: center;
  box-shadow: 0 12px 32px rgba(var(--primary-rgb), 0.28);
  opacity: 0;
  transform: translateY(-140%);
  transition: opacity .35s ease, transform .35s cubic-bezier(0.22, 1, 0.36, 1);
}
.toast.show { opacity: 1; transform: translateY(0); }
.toast.hide { opacity: 0; transform: translateY(-140%); }
.toast.ok  { background: var(--success); }
.toast.err { background: var(--danger); }

/* تنبيه ثابت داخل الصفحة (لا يختفي) — يُستخدم لرسائل تقرير الإنشاء */
.inline-alert {
  padding: .8rem 1.2rem;
  border-radius: var(--radius-sm);
  margin-bottom: 1rem;
  font-weight: 700;
  border-inline-start: 4px solid transparent;
}
.inline-alert.ok  { background: rgba(21, 115, 71, 0.08); color: var(--success); border-inline-start-color: var(--success); }
.inline-alert.err { background: rgba(180, 35, 24, 0.08); color: var(--danger); border-inline-start-color: var(--danger); }

/* نافذة تأكيد موحّدة (بديل confirm) */
.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(var(--primary-rgb), 0.45);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.modal-overlay.open { display: flex; animation: modal-fade .2s ease; }
@keyframes modal-fade { from { opacity: 0; } to { opacity: 1; } }
.modal-box {
  background: var(--surface);
  border-radius: var(--radius-lg);
  border-top: 4px solid var(--gold);
  box-shadow: 0 24px 60px rgba(var(--primary-rgb), 0.35);
  width: 100%;
  max-width: 420px;
  padding: 1.75rem;
  text-align: center;
  animation: modal-pop .25s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes modal-pop { from { transform: translateY(-12px) scale(.96); opacity: 0; } to { transform: none; opacity: 1; } }
.modal-icon {
  width: 3.25rem;
  height: 3.25rem;
  margin: 0 auto 1rem;
  border-radius: var(--radius-full);
  background: rgba(180, 35, 24, 0.1);
  color: var(--danger);
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal-icon .icon { width: 1.6rem; height: 1.6rem; }
.modal-msg {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text-primary);
  white-space: pre-line;
  line-height: 1.7;
  margin: 0 0 1.5rem;
}
.modal-actions { display: flex; gap: .75rem; justify-content: center; }
.modal-actions .btn { min-width: 7rem; justify-content: center; }
.modal-actions .btn.primary-ok { background: var(--primary); color: #fff; border-color: transparent; }
.modal-actions .btn.primary-ok:hover { background: var(--primary-dark); }

/* ---------------------------------------------------------------------- */
/* 11) أيقونات SVG مضمّنة بأسلوب Lucide (بلا اعتماد على خط أو شبكة خارجية) */
/* ---------------------------------------------------------------------- */
.icon {
  width: 1.15em;
  height: 1.15em;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: -0.2em;
  flex-shrink: 0;
}

/* ---------------------------------------------------------------------- */
/* 12) جدول عرض الجدول المدرسي بتنسيق الوزارة (كثيف الأعمدة)               */
/* ---------------------------------------------------------------------- */
table.ministry {
  border-collapse: collapse;
  background: var(--surface);
  white-space: nowrap;
  width: 100%;
  font-family: var(--font);
}
table.ministry th, table.ministry td {
  border: 1px solid var(--border);
  padding: .2rem .15rem;
  text-align: center;
  font-size: .78rem;
}
table.ministry thead th { background: var(--primary); color: #fff; }
table.ministry th.day { background: var(--primary); color: #fff; font-size: .85rem; }
table.ministry td.tname { text-align: right; font-weight: 700; padding-inline: .5rem; }
table.ministry td.dept { background: var(--primary); color: #fff; font-weight: 700; }
table.ministry td.sum { background: var(--gold-light); font-weight: 700; }
table.ministry td.note { font-size: .72rem; color: var(--text-muted); }
table.ministry tr.deptfirst td { border-top: 2px solid var(--primary); }
table.ministry td.blocked { background: #E4E7EC; }  /* خانة اجتماع القسم — تعبئة فقط */
table.ministry td.p1, table.ministry th.p1 { border-inline-start: 2px solid var(--primary); }

/* ---------------------------------------------------------------------- */
/* 13) الاستجابة (الجوال)                                                  */
/* ---------------------------------------------------------------------- */
@media (max-width: 720px) {
  :root { --container-padding: 16px; }
  .site-nav { display: flex; flex-direction: column; height: auto; padding: 1rem 0; gap: .75rem; }
  .site-nav-links { justify-content: center; height: auto; }
  main { margin: 1.25rem auto; }
  .formrow > label:first-child { min-width: 100%; }
  .stat-grid > .stat-tile { border-inline-start: 0; border-top: 1px solid var(--border); padding-top: 1rem; }
  .stat-grid > .stat-tile:first-child { border-top: 0; }
}