/* =====================================================================
   نظام تصميم المنصّة التعليمية — طبقة موحّدة تُحمَّل بعد الأنماط القديمة.
   لا تغيّر بنية الصفحات ولا مُعرِّفاتها؛ تعيد تنسيقها فقط.
   الأقسام: 1 الرموز · 2 الخط · 3 الأساس · 4 الشريط العلوي · 5 البطاقات
            6 الأزرار · 7 الحقول · 8 الجداول · 9 الحالات · 10 الحركات
            11 الاستجابة · 12 إتاحة
   ===================================================================== */

/* ---------- 1) رموز التصميم ---------- */
:root {
  /* اللون الرئيسي: أزرق تعليمي هادئ */
  --u-primary-50:#eef4fb;  --u-primary-100:#d9e7f6; --u-primary-200:#b6cfec;
  --u-primary-400:#3f78b5; --u-primary-600:#1f4e79; --u-primary-700:#173d60;
  --u-primary-900:#0f2b45;
  /* اللون المساعد: أخضر تربوي */
  --u-accent-50:#eef7f4;   --u-accent-100:#d6ece4;  --u-accent-600:#1e6f5c;
  --u-accent-700:#165646;

  /* حالات */
  --u-ok-bg:#e9f7ef;   --u-ok-fg:#12693f;   --u-ok-line:#b9e3cc;
  --u-warn-bg:#fff6e6; --u-warn-fg:#8a5a06; --u-warn-line:#f2ddb0;
  --u-err-bg:#fdecec;  --u-err-fg:#a12a22;  --u-err-line:#f3c9c5;
  --u-info-bg:#eef4fb; --u-info-fg:#1f4e79; --u-info-line:#c9dcf0;

  /* محايدة */
  --u-bg:#f5f7fa;      --u-surface:#ffffff;  --u-surface-2:#fafbfd;
  --u-ink:#16202b;     --u-ink-2:#41525f;    --u-ink-3:#6b7a88;
  --u-line:#e2e8f0;    --u-line-2:#cfd8e3;

  /* تباعد بسلّم ثابت */
  --u-1:4px; --u-2:8px; --u-3:12px; --u-4:16px; --u-5:20px;
  --u-6:24px; --u-8:32px; --u-10:40px; --u-12:48px;

  /* حواف وظلال */
  --u-r-sm:10px; --u-r:14px; --u-r-lg:18px; --u-r-xl:22px; --u-r-pill:999px;
  --u-sh-1:0 1px 2px rgba(16,32,48,.06), 0 1px 3px rgba(16,32,48,.05);
  --u-sh-2:0 4px 10px rgba(16,32,48,.06), 0 2px 4px rgba(16,32,48,.04);
  --u-sh-3:0 12px 28px rgba(16,32,48,.10), 0 4px 8px rgba(16,32,48,.05);
  --u-ring:0 0 0 3px rgba(31,78,121,.18);

  /* حركة */
  --u-fast:.14s cubic-bezier(.4,0,.2,1);
  --u-med:.22s cubic-bezier(.4,0,.2,1);

  /* توافق مع المتغيّرات القديمة حتى لا ينكسر ما يعتمد عليها */
  --bg:var(--u-bg); --card:var(--u-surface); --ink:var(--u-ink);
  --muted:var(--u-ink-3); --line:var(--u-line); --primary:var(--u-primary-600);
  --soft:var(--u-primary-50); --shadow:var(--u-sh-2);
}

/* ---------- 2) الخط العربي ---------- */
/* الخط الحديث أولًا، ثم خطوط عربية مثبّتة محليًّا — فلا يتشوّه النص بلا إنترنت. */
:root { --u-font:"Tajawal","IBM Plex Sans Arabic","Cairo","Dubai","Segoe UI",Tahoma,Arial,sans-serif; }

body, button, input, select, textarea, .topbar, .card { font-family:var(--u-font); }
body { font-size:15.5px; line-height:1.75; color:var(--u-ink); background:var(--u-bg);
       -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

h1,h2,h3,h4 { font-weight:700; line-height:1.35; color:var(--u-ink); letter-spacing:0; }
h1 { font-size:1.5rem } h2 { font-size:1.2rem } h3 { font-size:1.05rem } h4 { font-size:.98rem }
.muted, small { color:var(--u-ink-3) }

/* الأرقام اللاتينية داخل نصّ عربي تبقى على اتجاهها الصحيح */
.u-num, .fa-badge, .ah-stat b, .ts-quota b, td:has(> .u-num) { unicode-bidi:plaintext }

/* ---------- 3) الأساس ---------- */
*{ box-sizing:border-box }
::selection { background:var(--u-primary-100) }
a { color:var(--u-primary-600) }
img,svg { max-width:100% }
hr,.panel-divider { border:0; border-top:1px solid var(--u-line); margin:var(--u-5) 0 }

/* شريط تمرير أنعم */
*::-webkit-scrollbar { width:10px; height:10px }
*::-webkit-scrollbar-thumb { background:#c9d3de; border-radius:var(--u-r-pill); border:2px solid transparent; background-clip:content-box }
*::-webkit-scrollbar-thumb:hover { background:#adbbc9; background-clip:content-box }
*::-webkit-scrollbar-track { background:transparent }

/* ---------- 4) الشريط العلوي ---------- */
.topbar {
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.86); backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--u-line);
  padding:var(--u-3) clamp(var(--u-4),4vw,var(--u-10));
  display:flex; align-items:center; justify-content:space-between; gap:var(--u-4);
  box-shadow:0 1px 0 rgba(16,32,48,.02);
}
.topbar > div:first-child { display:flex; align-items:center; gap:var(--u-3); min-width:0 }
.topbar h1 { margin:0; font-size:1.06rem; font-weight:800; white-space:nowrap;
              overflow:hidden; text-overflow:ellipsis }
.topbar p { margin:1px 0 0; font-size:.78rem; color:var(--u-ink-3); line-height:1.5;
            display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden }

/* الشعار */
.u-logo { flex:0 0 auto; width:38px; height:38px; border-radius:11px; display:grid; place-items:center;
          background:linear-gradient(140deg,var(--u-primary-600),var(--u-primary-400)); color:#fff;
          box-shadow:var(--u-sh-2) }
.u-logo svg { width:21px; height:21px }

.topbar nav { display:flex; align-items:center; gap:var(--u-1); flex-wrap:nowrap }
.topbar nav a {
  display:inline-flex; align-items:center; gap:var(--u-2);
  padding:9px 13px; border-radius:var(--u-r-sm); border:1px solid transparent;
  text-decoration:none; color:var(--u-ink-2); font-weight:600; font-size:.88rem;
  white-space:nowrap; transition:background var(--u-fast), color var(--u-fast);
}
.topbar nav a:hover { background:var(--u-primary-50); color:var(--u-primary-700) }
.topbar nav a.active { background:var(--u-primary-600); color:#fff; box-shadow:var(--u-sh-2) }
.topbar nav a.active:hover { background:var(--u-primary-700); color:#fff }
.topbar nav a svg { width:17px; height:17px; flex:0 0 auto }

/* شريحة الحساب وزرّ الخروج */
.auth-chip { display:inline-flex; align-items:center; gap:var(--u-2);
  padding:7px 12px; border-radius:var(--u-r-pill); border:1px solid var(--u-line);
  background:var(--u-surface-2); color:var(--u-primary-700); font-weight:700; font-size:.83rem;
  max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.auth-chip svg { width:16px; height:16px; flex:0 0 auto; opacity:.75 }
.auth-logout { display:inline-flex; align-items:center; gap:6px;
  padding:8px 12px; border-radius:var(--u-r-sm); border:1px solid var(--u-line);
  background:var(--u-surface); color:var(--u-err-fg); font-family:inherit; font-weight:700;
  font-size:.83rem; cursor:pointer; transition:background var(--u-fast),border-color var(--u-fast) }
.auth-logout:hover { background:var(--u-err-bg); border-color:var(--u-err-line) }

/* زرّ قائمة الهاتف — يظهر عند الشاشات الصغيرة فقط */
.u-navtoggle { display:none; align-items:center; justify-content:center; width:42px; height:42px;
  border-radius:var(--u-r-sm); border:1px solid var(--u-line); background:var(--u-surface);
  color:var(--u-ink-2); cursor:pointer; flex:0 0 auto }
.u-navtoggle svg { width:20px; height:20px }

/* ---------- 5) البطاقات والأسطح ---------- */
.card, .fa-panel, .ah-panel, .ts-card, .lg-card {
  background:var(--u-surface); border:1px solid var(--u-line);
  border-radius:var(--u-r-lg); box-shadow:var(--u-sh-1);
  padding:var(--u-5); transition:box-shadow var(--u-med), transform var(--u-med), border-color var(--u-med);
}
.card h2, .fa-panel h3 { margin:0 0 var(--u-2); font-size:1.08rem }
.card > .muted:first-of-type { margin-top:0 }

/* بطاقات المحتوى التعليمي القابلة للنقر */
.cards-grid { display:grid; gap:var(--u-4);
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr)) }
.cards-grid > * {
  background:var(--u-surface); border:1px solid var(--u-line); border-radius:var(--u-r);
  padding:var(--u-4); box-shadow:var(--u-sh-1); cursor:pointer; position:relative;
  transition:transform var(--u-med), box-shadow var(--u-med), border-color var(--u-med);
  display:flex; flex-direction:column; gap:6px; text-align:start;
}
.cards-grid > *::before {
  content:""; position:absolute; inset-inline-start:0; inset-block:0; width:3px;
  border-radius:var(--u-r) 0 0 var(--u-r); background:var(--u-primary-600);
  opacity:0; transition:opacity var(--u-med);
}
.cards-grid > *:hover { transform:translateY(-2px); box-shadow:var(--u-sh-3); border-color:var(--u-primary-200) }
.cards-grid > *:hover::before { opacity:1 }
.cards-grid > *:active { transform:translateY(0) }

.badge { display:inline-flex; align-items:center; gap:5px; padding:3px 10px;
  border-radius:var(--u-r-pill); font-size:.74rem; font-weight:700;
  background:var(--u-primary-50); color:var(--u-primary-700); border:1px solid var(--u-primary-100) }
.badge.ok { background:var(--u-ok-bg); color:var(--u-ok-fg); border-color:var(--u-ok-line) }
.badge.warn { background:var(--u-warn-bg); color:var(--u-warn-fg); border-color:var(--u-warn-line) }
.badge.info { background:var(--u-info-bg); color:var(--u-info-fg); border-color:var(--u-info-line) }

/* بطاقات الإحصاء */
.ah-stat, .fa-stat {
  background:var(--u-surface); border:1px solid var(--u-line); border-radius:var(--u-r);
  padding:var(--u-4); box-shadow:var(--u-sh-1); text-align:center;
  transition:box-shadow var(--u-med), transform var(--u-med);
}
.ah-stat:hover, .fa-stat:hover { box-shadow:var(--u-sh-2); transform:translateY(-1px) }
.ah-stat b, .fa-stat b { display:block; font-size:1.6rem; font-weight:800; color:var(--u-primary-600); line-height:1.25 }
.ah-stat span, .fa-stat span { font-size:.8rem; color:var(--u-ink-3) }

.empty-box { border:1px dashed var(--u-line-2); border-radius:var(--u-r);
  padding:var(--u-6) var(--u-4); text-align:center; color:var(--u-ink-3); font-size:.9rem;
  background:var(--u-surface-2) }

/* ---------- 6) الأزرار ---------- */
.action-btn, .ghost-btn, .back-btn, .lg-submit, .ts-save, .ts-ghost, button.u-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--u-2);
  min-height:42px; padding:10px 18px; border-radius:var(--u-r-sm);
  font-family:inherit; font-size:.92rem; font-weight:700; cursor:pointer;
  border:1px solid transparent; transition:background var(--u-fast), border-color var(--u-fast),
    box-shadow var(--u-fast), transform var(--u-fast); text-decoration:none;
}
.action-btn, .lg-submit, .ts-save { background:var(--u-primary-600); color:#fff; box-shadow:var(--u-sh-1) }
.action-btn:hover, .lg-submit:hover, .ts-save:hover { background:var(--u-primary-700); box-shadow:var(--u-sh-2) }
.action-btn:active, .lg-submit:active, .ts-save:active { transform:translateY(1px); box-shadow:none }

.ghost-btn, .back-btn { background:var(--u-surface); color:var(--u-primary-700); border-color:var(--u-line-2) }
.ghost-btn:hover, .back-btn:hover { background:var(--u-primary-50); border-color:var(--u-primary-200) }
.ghost-btn:active, .back-btn:active { transform:translateY(1px) }

.small-btn { min-height:34px; padding:6px 12px; font-size:.82rem }
.full-btn { width:100% }

.action-btn:disabled, .ghost-btn:disabled, .lg-submit:disabled, .ts-save:disabled,
.action-btn[disabled], .ghost-btn[disabled] {
  opacity:.5; cursor:not-allowed; transform:none; box-shadow:none;
}
.action-btn svg, .ghost-btn svg { width:17px; height:17px }

:where(button,a,input,select,textarea):focus-visible {
  outline:none; box-shadow:var(--u-ring); border-radius:var(--u-r-sm);
}

/* ---------- 7) الحقول والفلاتر ---------- */
.field label, .fa-field span, .ts-field > span {
  display:block; font-weight:700; font-size:.84rem; color:var(--u-ink-2); margin-bottom:6px;
}
.field input, .field select, .field textarea,
.fa-field input, .fa-field select, .ts-field input,
.search input, .fa-toolbar input[type=search], .fa-toolbar select {
  width:100%; border:1px solid var(--u-line-2); border-radius:var(--u-r-sm);
  padding:10px 13px; font-size:.94rem; font-family:inherit; background:var(--u-surface);
  color:var(--u-ink); transition:border-color var(--u-fast), box-shadow var(--u-fast);
}
.field input, .field select { height:44px }
.field input:focus, .field select:focus, .field textarea:focus,
.fa-field input:focus, .ts-field input:focus, .search input:focus {
  outline:none; border-color:var(--u-primary-400); box-shadow:var(--u-ring);
}
.field input[readonly], .ts-field input[readonly] { background:var(--u-surface-2); color:var(--u-ink-3) }
.fields-grid { display:grid; gap:var(--u-3) }

/* شريط البحث بأيقونة */
.search { position:relative; min-width:220px; flex:1; max-width:460px }
.search input { height:44px; padding-inline-start:40px }
.search::before {
  content:""; position:absolute; inset-inline-start:13px; top:50%; width:17px; height:17px;
  transform:translateY(-50%); pointer-events:none; opacity:.5;
  background:currentColor; color:var(--u-ink-3);
  -webkit-mask:var(--u-icon-search) center/contain no-repeat; mask:var(--u-icon-search) center/contain no-repeat;
}
:root { --u-icon-search:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='m20 20-3.5-3.5'/></svg>") }

.toolbar { display:flex; justify-content:space-between; gap:var(--u-3);
  align-items:center; flex-wrap:wrap; margin-bottom:var(--u-4) }
.fa-toolbar { display:flex; flex-wrap:wrap; gap:var(--u-2); align-items:center; margin-bottom:var(--u-4) }

/* رقائق الفلاتر */
.u-chips { display:flex; gap:var(--u-2); flex-wrap:wrap }
.u-chip { padding:6px 13px; border-radius:var(--u-r-pill); border:1px solid var(--u-line-2);
  background:var(--u-surface); color:var(--u-ink-2); font-size:.83rem; font-weight:600; cursor:pointer;
  transition:all var(--u-fast) }
.u-chip:hover { border-color:var(--u-primary-200); background:var(--u-primary-50) }
.u-chip.on { background:var(--u-primary-600); color:#fff; border-color:var(--u-primary-600) }

/* ---------- 8) الجداول ---------- */
.fa-table, .ah-table, table.u-table {
  width:100%; border-collapse:separate; border-spacing:0;
  background:var(--u-surface); border-radius:var(--u-r); overflow:hidden; font-size:.9rem;
}
.fa-table th, .ah-table th, table.u-table th {
  background:var(--u-primary-600); color:#fff; padding:11px 12px; text-align:start;
  font-weight:700; font-size:.85rem; position:sticky; top:0; z-index:1;
}
.fa-table td, .ah-table td, table.u-table td {
  padding:10px 12px; border-bottom:1px solid var(--u-line); vertical-align:middle;
}
.fa-table tbody tr:last-child td, .ah-table tbody tr:last-child td { border-bottom:0 }
.fa-table tbody tr, .ah-table tbody tr { transition:background var(--u-fast) }
.fa-table tbody tr:hover td, .ah-table tbody tr:hover td { background:var(--u-primary-50) }
.fa-scroll, .ah-scroll { border:1px solid var(--u-line); border-radius:var(--u-r); overflow:auto }

/* ---------- 9) الحالات والتنبيهات ---------- */
.status-card, .fa-status, .ah-status, .lg-msg, .ts-msg {
  border-radius:var(--u-r-sm); padding:12px 15px; font-size:.9rem; font-weight:600;
  border:1px solid var(--u-info-line); background:var(--u-info-bg); color:var(--u-info-fg);
  line-height:1.7;
}
.status-card.ok, .fa-status.ok, .ah-status.ok, .lg-msg.ok, .ts-msg.ok {
  background:var(--u-ok-bg); color:var(--u-ok-fg); border-color:var(--u-ok-line) }
.status-card.error, .fa-status.error, .ah-status.error, .lg-msg.error, .ts-msg.error {
  background:var(--u-err-bg); color:var(--u-err-fg); border-color:var(--u-err-line) }
.lg-msg.info, .ts-msg.info { background:var(--u-info-bg); color:var(--u-info-fg); font-weight:500 }

/* ---------- 10) الحركات ---------- */
@keyframes u-fade-up { from { opacity:0; transform:translateY(8px) } to { opacity:1; transform:none } }
@keyframes u-fade { from { opacity:0 } to { opacity:1 } }
.card, .cards-grid > *, .ah-stat, .fa-stat, .fa-panel, .ah-panel {
  animation:u-fade-up var(--u-med) both;
}
.cards-grid > *:nth-child(1){animation-delay:.02s} .cards-grid > *:nth-child(2){animation-delay:.04s}
.cards-grid > *:nth-child(3){animation-delay:.06s} .cards-grid > *:nth-child(4){animation-delay:.08s}
.cards-grid > *:nth-child(5){animation-delay:.10s} .cards-grid > *:nth-child(6){animation-delay:.12s}
.status-card, .fa-status.ok, .fa-status.error { animation:u-fade var(--u-fast) both }

@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important }
}

/* ---------- 11) الاستجابة ---------- */
.layout { display:grid; grid-template-columns:minmax(270px,340px) 1fr;
  gap:var(--u-5); padding:var(--u-5) clamp(var(--u-4),4vw,var(--u-10)); align-items:start }
.admin-wrap, .school-files-layout { padding:var(--u-5) clamp(var(--u-4),4vw,var(--u-10)) }
.settings-panel { position:sticky; top:76px }

@media (max-width:1024px) {
  .layout { grid-template-columns:1fr }
  .settings-panel { position:static }
}

@media (max-width:820px) {
  /* ★ إعادة ترتيب حقيقية: المحتوى أولًا واللوحة الجانبية بعده، لا تصغير فحسب. */
  .layout, .school-files-layout { display:flex; flex-direction:column; gap:var(--u-4) }
  .layout > .settings-panel, .school-files-layout > .school-fields-panel { order:2 }
  .layout > .main-panel, .layout > section:not(.settings-panel),
  .school-files-layout > .main-panel { order:1 }

  .topbar { padding:10px var(--u-4); gap:var(--u-2) }
  .topbar h1 { font-size:.98rem }
  .topbar p { display:none }
  .u-navtoggle { display:inline-flex }
  /* القائمة تنسدل بدل أن تلتفّ على ثلاثة أسطر */
  /* تُخفى بالعرض لا بالشفافية، فلا تعلق القائمة في حالة وسط. */
  .topbar nav { display:none }
  .topbar nav.u-open {
    display:flex; position:absolute; inset-inline:var(--u-3); top:calc(100% + 8px);
    flex-direction:column; align-items:stretch; gap:var(--u-1);
    background:var(--u-surface); border:1px solid var(--u-line); border-radius:var(--u-r);
    box-shadow:var(--u-sh-3); padding:var(--u-2); z-index:50;
    animation:u-fade-up var(--u-fast) both;
  }
  .topbar nav a, .topbar nav .auth-chip, .topbar nav .auth-logout {
    width:100%; justify-content:flex-start; max-width:none; border-radius:var(--u-r-sm);
    min-height:44px;
  }
  .cards-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:var(--u-3) }
  .card { padding:var(--u-4); border-radius:var(--u-r) }
  .toolbar { flex-direction:column; align-items:stretch }
  .search { max-width:none }
  .action-btn, .ghost-btn { min-height:44px }
}

@media (max-width:420px) {
  .cards-grid { grid-template-columns:1fr 1fr }
  body { font-size:15px }
}

/* الجداول على الهاتف: تمرير أفقي داخل إطارها لا في الصفحة كلّها */
@media (max-width:820px) {
  .fa-scroll, .ah-scroll { -webkit-overflow-scrolling:touch }
  .fa-table, .ah-table { min-width:640px }
}

/* ---------- 12) إتاحة ---------- */
.u-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0 }
@media (prefers-contrast:more) {
  :root { --u-line:#b6c2cf; --u-ink-3:#4d5c6a }
}


/* =====================================================================
   أنماط خاصّة بصفحات بعينها — نُقلت من كتل <style> الداخلية إلى هنا
   ليكون التنسيق كلّه في ملف واحد قابل للصيانة.
   ===================================================================== */

/* ---------- صفحة بيانات المعلم (ts-) ---------- */
/* زرّ ثانويّ بدلالة الخطر — يستعيد إطاره بعد توحيد الأزرار. */
.ts-ghost { border:1px solid var(--u-err-line); color:var(--u-err-fg); background:var(--u-surface) }
.ts-ghost:hover { background:var(--u-err-bg); border-color:var(--u-err-fg) }
body.page-teacher-setup { min-height:100vh; margin:0; padding:24px 16px;
  background:linear-gradient(160deg,var(--u-primary-50) 0%,#f8fbfd 55%,var(--u-primary-50) 100%) }
.ts-card { width:100%; max-width:820px; margin:0 auto }
.ts-head { border-bottom:1px solid #eef2f6; padding-bottom:14px; margin-bottom:16px }
.ts-head h1 { margin:0 0 6px; font-size:1.3rem; color:#1F4E79 }
.ts-head p { margin:0; color:#5b6b7a; font-size:.88rem; line-height:1.8 }
.ts-steps { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px }
.ts-step { flex:1; min-width:150px; padding:9px 12px; border-radius:11px; background:#eef3f8; color:#5b6b7a; font-size:.82rem; font-weight:700; text-align:center }
.ts-step.done { background:#e8f6ee; color:#1e7a48 }
.ts-step.now { background:#1F4E79; color:#fff }
.ts-section { margin-bottom:18px }
.ts-section h2 { font-size:1rem; color:#1F4E79; margin:0 0 4px }
.ts-section>p { margin:0 0 10px; color:#7c8b98; font-size:.8rem; line-height:1.8 }
.ts-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:11px }
.ts-field span { display:block; font-size:.82rem; color:#41525f; margin-bottom:5px; font-weight:700 }
.ts-field span b { color:#a5271b; font-weight:700 }
.ts-field input { box-sizing:border-box }
.ts-field input[readonly] { cursor:default }
.ts-field small { display:block; color:#7c8b98; font-size:.73rem; margin-top:4px }
.ts-scope { border:1px solid #e3eaf1; border-radius:13px; padding:12px; max-height:330px; overflow:auto; background:#fbfdfe }
.ts-grade { border-bottom:1px solid #eef2f6; padding:8px 2px }
.ts-grade:last-child { border-bottom:0 }
.ts-grade>label { display:flex; align-items:center; gap:8px; font-weight:700; color:#1F4E79; font-size:.9rem; cursor:pointer }
.ts-subjects { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 2px; padding-inline-start:24px }
.ts-subjects label { display:flex; align-items:center; gap:5px; font-size:.8rem; color:#41525f; background:#fff; border:1px solid #dde5ee; border-radius:8px; padding:4px 8px; cursor:pointer }
.ts-subjects label.on { background:#eaf2f8; border-color:#1F4E79; color:#1F4E79; font-weight:700 }
.ts-subjects label.over { opacity:.45 }
.ts-subjects label.over input { cursor:not-allowed }
.ts-per { font-style:normal; font-size:.7rem; background:#eef3f8; color:#5b6b7a; border-radius:6px; padding:1px 5px; margin-inline-start:2px }
.ts-subjects label.free .ts-per { background:#eef7f1; color:#1e7a48 }
.ts-subjects label.free.on .ts-per { background:#1e7a48; color:#fff }
.ts-subjects label.on .ts-per { background:#1F4E79; color:#fff }
.ts-quota { position:relative; overflow:hidden; background:#eef3f8; border:1px solid #dde5ee; border-radius:11px; padding:10px 13px; margin-bottom:6px; font-size:.9rem; color:#1F4E79; display:flex; align-items:center; gap:10px; flex-wrap:wrap }
.ts-quota b { font-size:1.1rem }
.ts-quota span { margin-inline-start:auto; font-size:.8rem; color:#5b6b7a; font-weight:700 }
.ts-quota i { position:absolute; inset-inline-start:0; bottom:0; height:3px; background:#1F4E79; transition:width .2s }
.ts-quota.near { background:#fff7e8; border-color:#f0d9ae }
.ts-quota.near i { background:#b3801d }
.ts-quota.full { background:#fdecea; border-color:#f0c4be; color:#a5271b }
.ts-quota.full i { background:#a5271b }
.ts-quota.full span { color:#a5271b }
.ts-quota-note { display:block; color:#9aa8b4; font-size:.72rem; margin-bottom:9px }
.ts-msg { margin-bottom:14px; display:none }
.ts-msg.error { display:block }
.ts-msg.ok { display:block }
.ts-msg.info { display:block }
.ts-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; border-top:1px solid #eef2f6; padding-top:15px; margin-top:4px }
.ts-ghost { background:#fff; color:#a5271b }
.ts-hint { color:#7c8b98; font-size:.78rem; margin-inline-start:auto }

/* ---------- لوحة مالك الموقع (ah-) ---------- */
.ah-wrap { max-width:1180px; margin:0 auto; padding:18px 6vw 40px }
.ah-hero { background:linear-gradient(135deg,#2b2f3a,#3b4152); color:#fff; border-radius:16px; padding:20px 22px; margin-bottom:18px }
.ah-hero h2 { margin:0 0 6px; font-size:1.2rem }
.ah-hero p { margin:0; opacity:.82; font-size:.86rem; line-height:1.8 }
.ah-sec { margin-bottom:22px }
.ah-sec>h3 { font-size:1rem; color:#1F4E79; margin:0 0 4px }
.ah-sec>p.muted { margin:0 0 11px; font-size:.8rem }
.ah-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px }
.ah-stat { background:#fff; border:1px solid #dbe3ea; border-radius:12px; padding:13px 14px; text-align:center }
.ah-panels { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:12px }
.ah-panel { display:block; text-decoration:none; color:inherit; border-top:4px solid var(--c,#1F4E79) }
.ah-panel:hover { box-shadow:0 12px 30px rgba(20,45,70,.13); transform:translateY(-2px) }
.ah-panel h4 { margin:0 0 5px; font-size:.98rem; color:var(--c,#1F4E79) }
.ah-panel p { margin:0; font-size:.79rem; color:#6a7885; line-height:1.8 }
.ah-panel .ah-tag { display:inline-block; margin-top:9px; font-size:.72rem; background:#eef3f8; color:#5b6b7a; border-radius:20px; padding:2px 9px }
.ah-table tr:hover td { background:#f7fafd }
.ah-role { display:inline-block; font-size:.72rem; border-radius:20px; padding:2px 9px; white-space:nowrap }
.ah-role.teacher { background:#eef7f4; color:#1e6f5c }
.ah-role.school { background:#eef4fa; color:#1F4E79 }
.ah-role.admin { background:#f2eefb; color:#7a5cc4 }
.ah-off { opacity:.5 }
.ah-acts { display:flex; gap:5px; flex-wrap:wrap }
.ah-acts button { padding:4px 9px; font-size:.76rem; border-radius:7px; border:1px solid #cfd8e3; background:#fff; cursor:pointer; font-family:inherit }
.ah-acts button:hover { background:#eef5fb }
.ah-acts .danger { color:#a5271b; border-color:#f0c4be }
.ah-status { margin:10px 0; display:none }
.ah-status.ok { display:block }
.ah-status.error { display:block }
.ah-scroll { max-height:52vh }

/* ---------- لوحة النماذج الإدارية (fa-) ---------- */
.fa-wrap { max-width:1400px; margin:0 auto; padding:16px }
.fa-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin:14px 0 }
.fa-toolbar input[type=search],.fa-toolbar select { min-width:180px }
.fa-table { width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; font-size:.92rem }
.fa-table tr:hover td { background:#f6fafd }
.fa-badge { display:inline-block; padding:2px 8px; border-radius:20px; font-size:.75rem; background:#eaf2f8; color:#1F4E79; white-space:nowrap }
.fa-badge.gen { background:#e8f6ee; color:#1e7a48 }
.fa-badge.missing { background:#fdecea; color:#a5271b }
.fa-actions { display:flex; gap:5px; flex-wrap:wrap }
.fa-actions button { padding:4px 9px; font-size:.78rem; border-radius:7px; border:1px solid #cfd8e3; background:#fff; cursor:pointer; font-family:inherit }
.fa-actions button:hover { background:#eef5fb }
.fa-actions .danger { color:#a5271b; border-color:#f0c4be }
.fa-panel { margin-bottom:14px }
.fa-panel h3 { color:#1F4E79 }
.fa-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; align-items:end }
.fa-hidden { display:none }
.fa-status { margin:10px 0; display:none }
.fa-status.ok { display:block }
.fa-status.error { display:block }
.fa-scroll { max-height:60vh }
.fa-sel { width:18px; height:18px }

/* ---------- دخول الأدمن (ad-) ---------- */
body.page-admin-login { display:flex; align-items:center; justify-content:center;
  min-height:100vh; padding:24px 16px }
body.page-admin-login .lg-head { display:none }
.ad-wrap { width:100%; max-width:420px }
.ad-wrap .lg-card { --lg-accent:#7a5cc4; --lg-accent-dark:#62489f; --lg-tint:#f2eefb }

/* ---------- قاعدة أسماء الطلبة في لوحة المعلم ---------- */
.file-picker.wide-picker { display:block; border:1px dashed var(--u-line-2); border-radius:var(--u-r-sm);
  padding:var(--u-3); text-align:center; cursor:pointer; background:var(--u-surface-2);
  transition:border-color var(--u-fast), background var(--u-fast) }
.file-picker.wide-picker:hover { border-color:var(--u-primary-400); background:var(--u-primary-50) }
.file-picker.wide-picker input { display:block; width:100%; font-size:.82rem; margin-bottom:6px }
.file-picker.wide-picker span { display:block; font-size:.82rem; color:var(--u-ink-3); font-weight:600 }
.student-db-actions { display:flex; gap:var(--u-2); margin:var(--u-3) 0 }
.student-db-actions .action-btn { flex:1 }
.student-db-summary { border:1px solid var(--u-line); border-radius:var(--u-r-sm);
  background:var(--u-surface-2); padding:var(--u-3) }
.student-db-total { font-size:.9rem; color:var(--u-ink-2); margin-bottom:var(--u-2) }
.student-db-total b { color:var(--u-primary-600); font-size:1.05rem }
.student-db-list { list-style:none; margin:0; padding:0; display:grid; gap:5px; max-height:210px; overflow:auto }
.student-db-list li { display:flex; align-items:center; justify-content:space-between; gap:var(--u-2);
  background:var(--u-surface); border:1px solid var(--u-line); border-radius:var(--u-r-sm);
  padding:6px 10px; font-size:.84rem }
.student-db-list em { font-style:normal; font-weight:700; color:var(--u-primary-700);
  background:var(--u-primary-50); border-radius:var(--u-r-pill); padding:1px 9px; font-size:.78rem }
.status-card.warn { background:var(--u-warn-bg); color:var(--u-warn-fg); border-color:var(--u-warn-line) }

/* ---------- شريط اختيار الشعبة أعلى صفحة النماذج ---------- */
.roster-pick { display:flex; align-items:center; gap:var(--u-3); flex-wrap:wrap;
  background:var(--u-primary-50); border:1px solid var(--u-primary-100);
  border-radius:var(--u-r); padding:var(--u-3) var(--u-4); margin-bottom:var(--u-4) }
.roster-pick label { font-weight:700; font-size:.88rem; color:var(--u-primary-700); margin:0 }
.roster-pick select { flex:0 1 260px; min-width:190px; height:40px;
  border:1px solid var(--u-line-2); border-radius:var(--u-r-sm); background:var(--u-surface);
  padding:0 11px; font-family:inherit; font-size:.9rem }
.roster-pick select:focus { outline:none; border-color:var(--u-primary-400); box-shadow:var(--u-ring) }
.roster-pick small { flex:1 1 100%; margin:0; font-size:.76rem; color:var(--u-ink-3) }
@media (max-width:820px){ .roster-pick select { flex:1 1 100% } }

/* حوار نقل النموذج إلى فئة: بطاقة ضيّقة، فالحقلان لا يحتاجان عرض بطاقة النماذج */
.fa-move-card { width: min(460px, 94vw); }
.fa-move-card .fa-field { display: block; margin-bottom: 12px; }
.fa-move-card .fa-field span { display: block; margin-bottom: 6px; }
.fa-move-card .fa-field select, .fa-move-card .fa-field input { width: 100%; }

/* حالة إذن رفع قواعد البيانات في جدول حسابات الأدمن */
.ah-ok { color:#166534; font-weight:700 }
.ah-deny { color:#b91c1c; font-weight:700 }
/* لوحة قواعد البيانات حين يُمنع الرفع: ظاهرة للقراءة، معطّلة للرفع */
.db-locked { opacity:.55; pointer-events:none }
.db-lock-note { border:1px solid #fecaca; background:#fef2f2; color:#991b1b;
  border-radius:14px; padding:12px 14px; margin-bottom:12px; font-weight:700 }


/* ---------- لوحة «قواعد بياناتي على جهازي» ---------- */
.localdb-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.localdb-toggle{display:flex;align-items:center;gap:9px;cursor:pointer;font-weight:700}
.localdb-toggle input{width:17px;height:17px;cursor:pointer}
.localdb-state{padding:4px 11px;border-radius:999px;font-size:.78rem;font-weight:700;
  background:#f1f4f7;color:#5b6b7a;border:1px solid var(--line,#dbe3ea)}
.localdb-state.on{background:#e7f6ec;color:#1c7a3e;border-color:#bfe3cb}
.localdb-note{margin:8px 0 0}
.localdb-grid{margin-top:10px}
.localdb-warn{margin:9px 0 0;color:#8a5a12;background:#fdf6e6;border:1px solid #f0dfb8;
  border-radius:10px;padding:8px 11px;font-size:.83rem;line-height:1.7}
.localdb-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px}
.localdb-actions .ghost-btn.danger{border-color:#f0c4be;color:#a5271b}
.localdb-actions .ghost-btn.danger:hover:not(:disabled){background:#fdecea}
.localdb-actions .ghost-btn:disabled{opacity:.5;cursor:not-allowed}
@media (max-width:600px){.localdb-actions .ghost-btn{flex:1 1 100%}}

.localdb-purge{margin-top:12px;padding-top:11px;border-top:1px dashed var(--line,#dbe3ea);
  display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.localdb-purge small{line-height:1.7}

/* ---------- نسخة احتياطية لكشوف المعلم ---------- */
.roster-backup{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line,#dbe3ea)}
.roster-backup-note{margin:0 0 8px;color:#8a5a12;background:#fdf6e6;border:1px solid #f0dfb8;
  border-radius:10px;padding:8px 11px;font-size:.8rem;line-height:1.7}
.roster-backup-actions{display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:600px){.roster-backup-actions .ghost-btn{flex:1 1 100%}}