/* ═══════════ الوثائق (المرحلة 4.5): نمط موحّد للشاشة والطباعة A4 ═══════════
   على غرار أمثلة المالك: «المدد الزمنية للخدمات» (رأس كحلي بشريط ثلاثي، مفتاح، أقسام مرقّمة، صف لكل خدمة بمدتها وشريطها،
   ملاحظات، جدول ملخص، تذييل) و«تقرير الأعمال المنجزة» (رأس خفيف، رقم كبير، شارات حالة، جدول برأس كحلي مقسّم بالفئات).
   المكوّنات في public/js/doc.js، والألوان --doc-* في :root (app.css) وحدها. */

/* ─────────── شريط الأدوات فوق الوثيقة (لا يُطبع) ─────────── */
.doc-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; max-width: 1000px; margin: 0 auto 14px; }
.doc-tools .grow { flex: 1 1 0; }
.doc-hint { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-basis: 100%; font-size: var(--fs-xs); color: var(--ink-3); line-height: 1.5; }
.doc-hint .i { color: var(--ink-4); }
.doc-pick { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; max-width: 1000px; margin: 0 auto 12px; font-size: var(--fs-sm); color: var(--ink-3); }
.doc-pick-l { font-weight: 600; color: var(--ink-2); }
.doc-pick .chip[aria-pressed="true"] { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent-ink); }
.doc-sel { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-sm); color: var(--ink-2); }
.doc-sel .select { min-width: 0; max-width: 100%; }

/* ─────────── الورقة ─────────── */
.doc { max-width: 1000px; margin: 0 auto 28px; background: var(--doc-paper); color: var(--doc-ink); line-height: 1.7; box-shadow: var(--doc-shadow); overflow: hidden; }
.doc h1, .doc h2, .doc h3 { margin: 0; letter-spacing: 0; }
.doc bdi { unicode-bidi: isolate; }
.doc a { color: inherit; }

/* الشريط الثلاثي الرفيع: علامة الهوية من مثال المالك، لا لون حالة */
.doc-flag { display: block; height: 4px; background: linear-gradient(to left, var(--doc-flag-1) 0 33.34%, var(--doc-flag-2) 33.34% 66.67%, var(--doc-flag-3) 66.67% 100%); }
.doc-flag-sm { width: 120px; height: 3px; border-radius: 2px; }

/* ─────────── الرأس الكحلي ─────────── */
.doc-head { background: var(--doc-navy); color: var(--doc-on-navy); padding-bottom: 34px; }
.doc-head-in { padding: 38px 56px 0; }
.doc-top { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; letter-spacing: .02em; color: var(--doc-navy-sub); }
.doc-head h1 { margin-top: 22px; font-size: 38px; font-weight: 700; line-height: 1.3; color: var(--doc-on-navy); }
.doc-desc { margin: 12px 0 0; max-width: 70ch; font-size: 16px; color: var(--doc-navy-desc); }
.doc-desc b { font-weight: 700; color: var(--doc-on-navy); }
.doc-to { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 26px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .16); }
.doc-to-l { font-size: 12px; color: var(--doc-on-navy); margin-inline-end: 4px; }
.doc-chip { padding: 4px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--doc-navy-chip); background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .2); }

/* ─────────── المفتاح ─────────── */
.doc-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 30px; padding: 16px 56px; background: var(--doc-band); border-bottom: 1px solid var(--doc-line); font-size: 12.5px; color: var(--doc-ink-3); }
.doc-key { display: inline-flex; align-items: center; gap: 8px; }
.doc-sw { width: 26px; height: 8px; border-radius: 4px; background: var(--doc-navy); flex: none; }
.doc-sw.max { background: var(--doc-bar-max); }
.doc-sw.open { background: repeating-linear-gradient(-45deg, var(--doc-open-1) 0 4px, var(--doc-open-2) 4px 8px); }
.doc-scale { margin-inline-start: auto; color: var(--doc-ink-4); }
.doc-scale bdi { font-weight: 600; color: var(--doc-ink-3); }

/* ─────────── المتن والأقسام المرقّمة ─────────── */
.doc-main { padding: 40px 56px 8px; }
.doc-sec { margin-bottom: 36px; }
.doc-sec-h { display: flex; align-items: center; gap: 14px; padding-bottom: 10px; border-bottom: 2px solid var(--doc-navy); break-after: avoid; }
.doc-sec-n { font-size: 12px; font-weight: 700; color: var(--doc-num); font-variant-numeric: tabular-nums; }
.doc-sec-h h2 { font-size: 21px; font-weight: 700; line-height: 1.4; color: var(--doc-navy); }
.doc-sec-c { margin-inline-start: auto; font-size: 12px; color: var(--doc-ink-4); white-space: nowrap; }

/* صف الخدمة: الاسم والوصف والمخرجات | المدة | الشريط على المقياس */
.doc-row { display: grid; grid-template-columns: minmax(0, 1fr) 124px 280px; gap: 24px; align-items: center; padding: 16px 4px; border-top: 1px solid var(--doc-row-line); break-inside: avoid; }
.doc-sec-h + .doc-row { border-top: 0; }
.doc-axis { break-after: avoid; padding: 8px 4px 6px; border-top: 0; background: var(--doc-band); font-size: 11.5px; color: var(--doc-ink-4); align-items: end; }
.doc-axis > span:nth-child(2) { text-align: center; }
.doc-ticks { position: relative; height: 16px; line-height: 16px; font-variant-numeric: tabular-nums; }
.doc-ticks span { position: absolute; top: 0; }
.doc-svc { min-width: 0; }
.doc-svc > b { display: block; font-size: 16px; font-weight: 600; line-height: 1.5; color: var(--doc-ink); }
.doc-svc-d { margin-top: 2px; font-size: 13.5px; line-height: 1.6; color: var(--doc-ink-3); }
.doc-out { margin-top: 6px; font-size: 12px; line-height: 1.6; color: var(--doc-ink-4); }
.doc-out .src { color: var(--doc-source); font-weight: 600; }
.doc-out .sep { margin-inline: 6px; }
.doc-dur { text-align: center; line-height: 1.2; font-variant-numeric: tabular-nums; }
.doc-dur b { display: block; font-size: 22px; font-weight: 700; color: var(--doc-navy); }
.doc-dur small { display: block; margin-top: 3px; font-size: 12px; color: var(--doc-ink-3); }
.doc-dur.open b { color: var(--doc-open-1); }
.doc-row.is-open { background: var(--doc-zebra); }
.doc-bar { position: relative; height: 10px; border-radius: 5px; background: var(--doc-track); overflow: hidden; }
.doc-bar::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(to left, var(--doc-grid) 0 1px, transparent 1px 22.222%); }
.doc-bar i { position: absolute; top: 0; height: 100%; border-radius: 5px; }
.doc-bar .b-max { background: var(--doc-bar-max); }
.doc-bar .b-min { background: var(--doc-navy); }
.doc-bar .b-open { background: repeating-linear-gradient(-45deg, var(--doc-open-1) 0 5px, var(--doc-open-2) 5px 10px); }

/* ─────────── الملاحظات ─────────── */
.doc-notes { padding: 34px 56px 40px; background: var(--doc-band); border-top: 1px solid var(--doc-line); break-inside: avoid; }
.doc-notes h3, .doc-summary h3 { font-size: 17px; font-weight: 700; color: var(--doc-navy); }
.doc-notes ul { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 12px; max-width: 88ch; }
.doc-notes li { position: relative; padding-inline-start: 22px; font-size: 14.5px; line-height: 1.8; color: var(--doc-ink-2); }
.doc-notes li::before { content: ''; position: absolute; inset-inline-start: 0; top: 11px; width: 7px; height: 7px; border-radius: 50%; background: var(--doc-dot); }
.doc-notes b { font-weight: 700; color: var(--doc-ink); }
.doc-notes .g { font-weight: 700; color: var(--doc-source); }

/* ─────────── جدول الملخص والجداول برأس كحلي ─────────── */
.doc-summary { padding: 38px 56px 44px; border-top: 1px solid var(--doc-line); }
.doc-summary > p { margin: 4px 0 18px; font-size: 13px; color: var(--doc-ink-3); }
.doc-tbl { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.doc-tbl th { padding: 10px 14px; background: var(--doc-navy); color: var(--doc-on-navy); font-size: 12.5px; font-weight: 600; text-align: start; vertical-align: bottom; line-height: 1.4; }
.doc-tbl td { padding: 10px 14px; border-bottom: 1px solid var(--doc-row-line); color: var(--doc-strong); vertical-align: top; line-height: 1.6; }
.doc-tbl tr.z td { background: var(--doc-zebra); }
.doc-tbl tr.grp td { padding: 8px 14px; background: var(--doc-group); color: var(--doc-navy); font-size: 12.5px; font-weight: 700; }
.doc-tbl tr { break-inside: avoid; }
.doc-tbl thead { display: table-header-group; }
.doc-tbl .c { text-align: center; white-space: nowrap; }
.doc-summary .doc-tbl .c { width: 200px; }
.doc-tbl .e { text-align: end; white-space: nowrap; }
.doc-tbl .n { width: 34px; color: var(--doc-ink-4); font-variant-numeric: tabular-nums; }
.doc-tbl .num { font-weight: 700; color: var(--doc-navy); font-variant-numeric: tabular-nums; }
.doc-tbl .num.open { color: var(--doc-open-1); }
.doc-tbl .num small { font-weight: 400; font-size: 12px; color: var(--doc-ink-3); margin-inline-start: 4px; }
.doc-tbl .w b { display: block; font-weight: 700; color: var(--doc-ink); }
.doc-tbl .w span { display: block; font-size: 12.5px; color: var(--doc-ink-3); }

/* ─────────── التذييل الكحلي ─────────── */
.doc-foot { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px 16px; padding: 18px 56px; background: var(--doc-navy-deep); color: var(--doc-foot-ink); font-size: 12px; }
.doc-foot b { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--doc-on-navy); }
.doc-foot-logo { width: 26px; height: 26px; border-radius: 6px; display: grid; place-items: center; background: var(--doc-paper); flex: none; }

/* ─────────── الوثيقة الخفيفة: تقرير الجهة وقائمة الأعمال ─────────── */
.doc.plain { padding: 36px 48px 28px; }
.doc-mast { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px 16px; padding-bottom: 14px; border-bottom: 1px solid var(--doc-line); }
.doc-mast-who { display: inline-flex; align-items: center; gap: 12px; min-width: 0; }
.doc-mast-who b { font-size: 15px; font-weight: 700; color: var(--doc-ink); }
.doc-mast-who .org-badge { border-radius: 8px; }
.doc-mast-t { font-size: 13px; color: var(--doc-ink-4); }
.doc-kicker { margin: 26px 0 0; font-size: 14px; font-weight: 700; color: var(--doc-kicker); }
.doc.plain h1 { margin-top: 2px; font-size: 30px; font-weight: 700; line-height: 1.35; color: var(--doc-navy); }
.doc-stat { display: flex; align-items: center; gap: 18px; margin-top: 18px; padding: 16px 22px; border-radius: 12px; background: var(--doc-band); border: 1px solid var(--doc-line); break-inside: avoid; }
.doc-stat > b { font-size: 40px; font-weight: 700; line-height: 1; color: var(--doc-navy); font-variant-numeric: tabular-nums; }
.doc-stat > span { font-size: 15px; line-height: 1.7; color: var(--doc-ink-2); }
.doc-pills { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 16px 0 18px; font-size: 13px; color: var(--doc-ink-3); }
.doc-pills > span { display: inline-flex; align-items: center; gap: 8px; }
.doc-pill { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1; white-space: nowrap; }
.doc-pill.done { background: var(--doc-done-bg); color: var(--doc-done-ink); }
.doc-pill.wip { background: var(--doc-wip-bg); color: var(--doc-wip-ink); }
.doc-pill.approval { background: var(--doc-appr-bg); color: var(--doc-appr-ink); }
.doc-pill.reply { background: var(--doc-wait-bg); color: var(--doc-wait-ink); }
.doc-work th:first-child { border-start-start-radius: 10px; }
.doc-work th:last-child { border-start-end-radius: 10px; }
.doc-work tr.grp td { padding: 18px 12px 8px; background: none; border-bottom: 2px solid var(--doc-navy); font-size: 15px; }
.doc-work td { padding: 10px 12px; }
.doc-list .doc-tbl th:nth-child(2) { width: 30%; }
.doc-empty { margin: 18px 0 6px; padding: 22px; border-radius: 12px; background: var(--doc-band); color: var(--doc-ink-3); text-align: center; font-size: 14px; }
.doc-pfoot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 26px; padding-top: 12px; border-top: 1px solid var(--doc-line); font-size: 12px; color: var(--doc-ink-4); }

/* ─────────── الهاتف: الصفوف عمود واحد (كما في مثال المالك) ─────────── */
@media screen and (max-width: 820px) {
  .doc-row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .doc-axis { display: none; }
  .doc-dur { display: flex; align-items: baseline; gap: 8px; text-align: start; }
  .doc-dur b, .doc-dur small { display: inline; margin: 0; }
  .doc-head-in { padding: 26px 18px 0; }
  .doc-head { padding-bottom: 24px; }
  .doc-head h1 { font-size: 28px; margin-top: 16px; }
  .doc-legend, .doc-main, .doc-notes, .doc-summary, .doc-foot { padding-inline: 18px; }
  .doc-legend { gap: 8px 18px; }
  .doc-scale { margin-inline-start: 0; flex-basis: 100%; }
  .doc-main { padding-top: 28px; }
  .doc-tbl { font-size: 12.5px; }
  .doc-tbl th, .doc-tbl td { padding-inline: 10px; }
  .doc.plain { padding: 22px 16px 20px; }
  .doc.plain h1 { font-size: 24px; }
  .doc-stat { gap: 14px; padding: 14px 16px; }
  .doc-stat > b { font-size: 32px; }
  .doc-hint { justify-content: flex-start; }
  .doc-tools .grow { flex-basis: 100%; height: 0; }
}

/* ─────────── الطباعة A4: مصدر واحد للوثائق الأربع (المدد، تقرير الجهة، التقرير الشهري، قائمة الأعمال) ───────────
   - القصير في صفحة واحدة: تخطيط مضغوط للطباعة وحدها (الشاشة كما هي).
   - الطويل متوازن: break-inside: avoid على الصفوف والبطاقات الصغيرة وحدها، لا على الأقسام ولا الجداول ولا البطاقات الطويلة؛
     العنوان يبقى مع أول صفوفه، والصف الأول لا يبقى وحده ولا الأخير، ورأس الجدول يتكرر في كل صفحة.
   - رأس المتصفح وتذييله (الرابط والتاريخ والعنوان): صناديق هامش الصفحة تحلّ محلهما. الصندوق العلوي الفارغ يمنع رأس المتصفح،
     وتذييلنا «صفحة 1 من 2 · عنوان الوثيقة» يمنع تذييله — مجرَّب في Edge 154 وخيار «الرؤوس والتذييلات» مفعّل
     (content: none لا يكفي، والسلسلة الفارغة تكفي). عنوان الوثيقة في --doc-title يضعه printDoc وprintHTML (doc.js) لحظة الطباعة. */
#docPrint { display: none; }
@media print {
  :root { --doc-title: "الفريق الإعلامي للمنتدى"; }
  @page {
    size: A4;
    margin: 12mm 12mm 15mm;
    @top-center { content: ""; }
    @bottom-center { content: "صفحة " counter(page) " من " counter(pages) "   ·   " var(--doc-title); font-family: var(--font); font-size: 8.5pt; color: var(--doc-ink-4); }
  }

  /* ما ليس من الوثيقة لا يُطبع: الهيكل، الأدوات، التلميحات، الرسائل، النوافذ، الدرج */
  .sidebar, .topbar, .tabbar, .nav-scrim, .welcome-slot, .page-head, .toolbar, .doc-tools, .doc-pick, .doc-hint,
  .tip, .toasts, .modal-wrap, .scrim, .drawer, [data-print], [data-doc-pdf] { display: none !important; }
  /* وثيقة غير ظاهرة على الشاشة (قائمة الأعمال): لا يُطبع غيرها */
  body.doc-printing > :not(#docPrint) { display: none !important; }
  body.doc-printing #docPrint { display: block; }

  /* التقسيم بين الصفحات */
  .tbl thead, .doc-tbl thead { display: table-header-group; }
  .tbl th { position: static; }
  .tbl tr, .doc-tbl tr, .doc-row, .doc-notes li, .mr-weeks li, .mr-sub, .note-line { break-inside: avoid; }
  .doc-sec-h, .doc-axis, .doc-kicker, .doc.plain h1, .doc-notes h3, .doc-summary h3, .doc-summary > p, .mr-h, .mr-mh, .mr-h + .note-line,
  .doc-tbl tr.grp { break-after: avoid; }
  /* الصف الأول مع الثاني والأخير مع ما قبله: لا صف يتيم في أول صفحة ولا في آخرها */
  .doc-axis + .doc-row, .tbl tbody tr:first-child, .doc-tbl tbody tr:first-child, .doc-tbl tr.grp + tr { break-after: avoid; }
  .doc-sec > .doc-row:last-child, .tbl tbody tr:last-child, .doc-tbl tbody tr:last-child { break-before: avoid; }
  .doc-foot, .doc-pfoot { break-before: avoid; }
  p, li { orphans: 2; widows: 2; }

  /* ─── الوثيقة بنمطها الكحلي («المدد الزمنية للخدمات») ─── */
  .doc { max-width: none; margin: 0; box-shadow: none; overflow: visible; }
  .doc-head { padding-bottom: 18px; }
  .doc-head-in { padding: 18px 22px 0; }
  .doc-top { font-size: 10.5px; }
  .doc-head h1 { font-size: 26px; margin-top: 10px; }
  .doc-desc { margin-top: 6px; font-size: 13px; line-height: 1.6; }
  .doc-to { margin-top: 12px; padding-top: 10px; }
  .doc-legend { padding: 8px 22px; font-size: 11px; }
  .doc-main { padding: 16px 22px 0; }
  .doc-sec { margin-bottom: 16px; }
  .doc-sec.keep { break-inside: avoid; }
  .doc-sec-h { padding-bottom: 6px; }
  .doc-sec-h h2 { font-size: 16px; }
  .doc-axis { padding-block: 4px 3px; font-size: 10.5px; }
  .doc-row { grid-template-columns: minmax(0, 1fr) 96px 170px; gap: 14px; padding: 7px 2px; }
  .doc-svc > b { font-size: 13.5px; line-height: 1.45; }
  .doc-svc-d { margin-top: 1px; font-size: 11.5px; line-height: 1.5; }
  .doc-out { font-size: 10.5px; margin-top: 2px; line-height: 1.5; }
  .doc-dur b { font-size: 16px; }
  .doc-dur small { font-size: 10.5px; margin-top: 1px; }
  .doc-notes { padding: 14px 22px 16px; break-inside: avoid; }
  .doc-notes h3, .doc-summary h3 { font-size: 15px; }
  .doc-notes ul { margin-top: 8px; gap: 5px; }
  .doc-notes li { font-size: 12px; line-height: 1.65; }
  .doc-notes li::before { top: 8px; }
  .doc-summary { padding: 16px 22px 18px; break-before: page; }
  .doc-summary > p { margin: 2px 0 10px; font-size: 11.5px; }
  .doc-tbl { font-size: 12px; }
  .doc-tbl th, .doc-tbl td { padding: 5px 10px; }
  .doc-tbl th { font-size: 11.5px; }
  .doc-summary .doc-tbl td { padding-block: 3px; line-height: 1.45; }
  .doc-summary .doc-tbl tr.grp td { padding-block: 4px; }
  .doc-foot { padding: 10px 22px; }

  /* ─── الوثيقة الخفيفة: تقرير الجهة وقائمة الأعمال ─── */
  .doc.plain { padding: 0; }
  .doc-mast { padding-bottom: 10px; }
  .doc-kicker { margin-top: 14px; font-size: 12.5px; }
  .doc.plain h1 { font-size: 24px; }
  .doc-stat { margin-top: 10px; padding: 10px 16px; gap: 14px; break-inside: avoid; }
  .doc-stat > b { font-size: 30px; }
  .doc-stat > span { font-size: 13.5px; line-height: 1.6; }
  .doc-pills { margin: 10px 0 12px; gap: 6px 18px; font-size: 12px; }
  .doc-work tr.grp td { padding: 12px 10px 5px; font-size: 13.5px; }
  .doc-work td { padding: 6px 10px; }
  .doc-list .doc-tbl td { padding: 5px 8px; line-height: 1.45; }
  .doc-list .doc-tbl th { padding-inline: 8px; }
  .doc-list .doc-tbl th:nth-child(2) { width: 30%; }
  .doc-list .doc-tbl th:nth-child(3) { width: 17%; }
  .doc-list .doc-tbl th:nth-child(5) { width: 22%; }
  .doc-list .doc-tbl td:nth-child(4) { white-space: nowrap; }
  .doc-list .due { font-size: 12px; white-space: normal; }
  .doc-pfoot { margin-top: 16px; padding-top: 8px; }

  /* ─── التقرير الشهري بنمط الوثائق: رأس بالشريط الثلاثي، أقسام مرقّمة بخط كحلي، جداول برأس كحلي، وكله مضغوط ─── */
  .month-report { counter-reset: mr-sec; color: var(--doc-ink); background: var(--doc-paper); }
  .month-report .mr-head { position: relative; gap: 12px; padding: 12px 0 8px; border-bottom: 2px solid var(--doc-navy); }
  .month-report .mr-head::before { content: ''; position: absolute; top: 0; inset-inline: 0; height: 4px; background: linear-gradient(to left, var(--doc-flag-1) 0 33.34%, var(--doc-flag-2) 33.34% 66.67%, var(--doc-flag-3) 66.67% 100%); }
  .month-report .mr-head img { width: 32px; height: 32px; }
  .month-report .mr-head h2 { font-size: 20px; font-weight: 700; color: var(--doc-navy); }
  .month-report .mr-head .muted { font-size: 11px; }
  /* الخلاصة: البطاقات الأربع في سطر واحد (استعلام 900 بكسل يطابق عرض الورقة فيجعلها اثنتين) */
  .month-report .exec { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 10px 0 6px; break-inside: avoid; }
  .month-report .exec .ex { padding: 6px 12px 5px; background: var(--doc-band); border: 1px solid var(--doc-line); box-shadow: none; }
  .month-report .ex-l { font-size: 11px; }
  .month-report .ex-v { font-size: 20px; line-height: 1.3; color: var(--doc-navy); }
  .month-report .ex-v small { font-size: 12px; }
  .month-report .ex-d { font-size: 10px; }
  .month-report .note-line { font-size: 11px; line-height: 1.6; }
  .month-report .note-line .i { margin-top: 3px; }
  .month-report .exec-note { margin: 0; }
  /* «كيف جرى العمل»: الأرقام الأربعة في سطر واحد */
  .month-report .mr-flow { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 8px 0 0; break-inside: avoid; }
  .month-report .mr-flow .fl { padding: 4px 10px; background: none; }
  .month-report .mr-flow .fl-v { font-size: 16px; }
  .month-report .mr-flow .fl-l, .month-report .mr-flow .fl-n { font-size: 10.5px; }
  .month-report .mr-h { counter-increment: mr-sec; display: flex; align-items: baseline; gap: 10px; margin: 14px 0 6px; padding-bottom: 4px; border-bottom: 2px solid var(--doc-navy); font-size: 15px; font-weight: 700; color: var(--doc-navy); }
  .month-report .mr-h::before { content: counter(mr-sec, decimal-leading-zero); font-size: 11px; font-weight: 700; color: var(--doc-num); }
  .month-report .tbl { font-size: 11.5px; line-height: 1.45; }
  .month-report .tbl thead th { padding: 5px 8px; font-size: 11px; background: var(--doc-navy); color: var(--doc-on-navy); border-color: var(--doc-navy); }
  .month-report .tbl td { padding: 4px 8px; border-color: var(--doc-row-line); }
  .month-report .tbl th:first-child, .month-report .tbl td:first-child { padding-inline-start: 10px; }
  .month-report .tbl th:last-child, .month-report .tbl td:last-child { padding-inline-end: 10px; }
  /* بطاقة العضو تنقسم إن طالت (رأسها مع أول سطر)، وكل جزء بإطاره */
  .month-report .mr-member { padding: 6px 12px; margin-bottom: 6px; border-color: var(--doc-line); border-radius: 8px; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
  .month-report .mr-mh { gap: 6px; }
  .month-report .mr-chips { gap: 4px; font-size: 10.5px; }
  .month-report .mr-chips span { padding: 0 8px; }
  .month-report .mr-sub { margin-top: 3px; font-size: 11.5px; line-height: 1.6; }
  .month-report .mr-weeks { margin-top: 3px; font-size: 11.5px; line-height: 1.6; }
  .month-report .mr-quiet { padding: 5px 12px; font-size: 11.5px; break-inside: avoid; }
}

/* التقارير على الهاتف: التبويبات الثلاثة (الأسبوعية، الشهري، تقرير الجهة) في عرض الشاشة بلا أيقوناتها */
@media (max-width: 480px) {
  [data-route="reports"] .page-head .seg .i { display: none; }
  [data-route="reports"] .page-head .seg button { padding: 0 9px; }
}

/* ─────────── الميزانية الشهرية للأدوات (الاشتراكات الشهرية، المرحلة 5) ───────────
   على غرار وثيقة ميزانية المنتدى: رأس كحلي، رقمان كبيران «الآن» و«عند الإطلاق» مع السقف والتجاوز، جداول الفئات بمجاميعها،
   وتكاليف مرة واحدة، والملاحظات. التجاوز بلون الطين (--doc-wip-ink) لا بالأحمر. تُطبع من #docPrint (printHTML). */
.doc .brand { unicode-bidi: isolate; }
.sbd-figs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 26px 56px 0; }
.sbd-fig { display: flex; flex-direction: column; gap: 2px; padding: 16px 20px; border-radius: 10px; background: var(--doc-band); border: 1px solid var(--doc-line); break-inside: avoid; }
.sbd-l { font-size: 12.5px; font-weight: 700; color: var(--doc-ink-3); }
.sbd-fig > b { font-size: 34px; font-weight: 700; line-height: 1.25; color: var(--doc-navy); font-variant-numeric: tabular-nums; }
.sbd-fig > b small { font-size: 13px; font-weight: 500; color: var(--doc-ink-3); }
.sbd-n { font-size: 12.5px; color: var(--doc-ink-4); }
.sbd-gap { margin-top: 4px; font-size: 13px; font-weight: 600; color: var(--doc-ink-2); }
.sbd-gap.over { color: var(--doc-wip-ink); }
.sbd-cap { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 14px 56px 0; padding: 4px 0; font-size: 12.5px; color: var(--doc-ink-3); }
.sbd-cap b { font-weight: 700; color: var(--doc-navy); }
.sbd-cap.breach { padding-inline-start: 12px; border-inline-start: 3px solid var(--doc-wip-ink); color: var(--doc-wip-ink); }
.sbd-main { padding-top: 26px; }
.sbd-tbl .w b { font-weight: 600; }
.sbd-tbl .sbd-amt { width: 130px; text-align: end; white-space: nowrap; font-weight: 700; color: var(--doc-navy); font-variant-numeric: tabular-nums; }
.sbd-tbl th.sbd-amt { color: var(--doc-on-navy); }
.sbd-y { display: block; font-size: 11.5px; font-weight: 400; color: var(--doc-ink-4); }
.sbd-tbl .w .sbd-flag, .sbd-flag { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; margin-inline-end: 8px; border-radius: 999px; font-size: 11px; font-weight: 700; vertical-align: 1px; background: var(--doc-appr-bg); color: var(--doc-appr-ink); }
.sbd-tbl tr.sbd-sum td { border-top: 2px solid var(--doc-navy); border-bottom: 0; background: none; font-weight: 700; color: var(--doc-navy); }
@media screen and (max-width: 820px) {
  .sbd-figs { grid-template-columns: minmax(0, 1fr); padding-inline: 18px; }
  .sbd-cap { margin-inline: 18px; }
  .sbd-fig > b { font-size: 28px; }
  .sbd-tbl .sbd-amt { width: 96px; }
}
@media print {
  .sbd-figs { gap: 10px; padding: 12px 22px 0; }
  .sbd-fig { padding: 8px 14px; }
  .sbd-l, .sbd-n { font-size: 10.5px; }
  .sbd-fig > b { font-size: 22px; }
  .sbd-fig > b small { font-size: 10.5px; }
  .sbd-gap { font-size: 11px; margin-top: 1px; }
  .sbd-cap { margin: 8px 22px 0; font-size: 11px; }
  .sbd-main { padding-top: 12px; }
  .sbd .doc-sec { margin-bottom: 10px; }
  .sbd-tbl td { padding-block: 3px; line-height: 1.4; }
  .sbd-tbl .w span { font-size: 10.5px; }
  .sbd-tbl .sbd-amt { width: 100px; }
  .sbd-flag { height: 16px; font-size: 9.5px; padding: 0 6px; }
  .sbd-notes { padding-block: 10px 12px; }
}