/* ============================================================
   حصن — App chrome & components
   ============================================================ */

/* ---- App shell layout ---- */
#app{ min-height:100dvh; }
.app-shell{ display:flex; min-height:100dvh; }

/* side rail (desktop) */
.rail{ position:sticky; top:0; align-self:flex-start; height:100dvh;
  width:84px; flex:none; padding:18px 12px; z-index:40;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  background:rgba(8,42,56,0.55); border-inline-start:1px solid var(--glass-border);
  backdrop-filter:blur(var(--glass-blur)); -webkit-backdrop-filter:blur(var(--glass-blur)); }
.rail-logo{ margin-bottom:10px; }
.rail-item{ width:56px; height:50px; border-radius:14px; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:3px; cursor:pointer; color:var(--ink-3);
  border:1px solid transparent; transition:.2s var(--ease); position:relative; }
/* ── محاذاة نصوص الشريط الجانبي ──
   .rail عرضه 84px بحشوة 12px جانبين ⇒ 60px داخلي · .rail-item 56px.
   كان span بلا عرض ولا محاذاة ولا معالجة فيض، فالعناوين الطويلة
   («الإقرارات الضريبية» · «العمليات والمقاولات») تفيض حدود العنصر وتلتفّ
   بلا انضباط فتختلّ محاذاة العناصر رأسياً. */
/* سطران دائماً لكل عنصر — لا سطر واحد ولا ثلاثة — فيتساوى ارتفاع كل العناصر
   مهما طال العنوان وتبقى المحاذاة الرأسية منضبطة، ولا يُقصّ نصّ إلى كلمة واحدة
   مبهمة («دراسة» بدل «دراسة الجدوى»). */
.rail .rail-item{ width:56px; height:60px; min-height:60px; padding:5px 2px;
  justify-content:center; gap:2px; }
.rail .rail-item span{ font-size:9.5px; font-weight:600; width:100%; max-width:52px;
  text-align:center; line-height:1.2; height:2.4em;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2;
  overflow:hidden; white-space:normal; overflow-wrap:anywhere; word-break:break-word; }
.rail .rail-item svg{ flex:none; }
.rail-item:hover{ color:#fff; background:rgba(255,255,255,.06); }
.rail-item.active{ color:#fff; background:linear-gradient(160deg, rgba(124,240,200,.18), rgba(21,184,194,.10));
  border-color:rgba(124,240,200,.30); box-shadow:0 6px 18px rgba(0,0,0,.25); }
.rail-item.active::before{ content:""; position:absolute; inset-inline-end:-12px; top:50%; transform:translateY(-50%);
  width:3px; height:24px; border-radius:4px; background:linear-gradient(var(--mint),var(--primary-bright));
  box-shadow:0 0 10px var(--mint); }
.rail-spacer{ flex:1; }

/* main column */
.main-col{ flex:1; min-width:0; display:flex; flex-direction:column;
  padding-bottom:40px; max-height:100dvh; overflow-y:auto; scroll-behavior:smooth; }
.screen{ padding:0 0 60px; }

/* bottom dock (mobile) */
.dock{ position:fixed; left:50%; transform:translateX(-50%); bottom:14px; z-index:50;
  display:flex; gap:2px; padding:7px; border-radius:var(--r-pill);
  background:rgba(8,42,56,0.6); border:1px solid var(--glass-border-bright);
  backdrop-filter:blur(20px) saturate(150%); -webkit-backdrop-filter:blur(20px) saturate(150%);
  box-shadow:0 14px 40px rgba(0,0,0,.45); max-width:calc(100vw - 24px); }
.dock-item{ width:54px; height:50px; border-radius:16px; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:2px; cursor:pointer; color:var(--ink-3);
  transition:.2s var(--ease); }
.dock-item span{ font-size:9px; font-weight:600; }
.dock-item.active{ color:#04221c; background:linear-gradient(160deg,var(--mint),var(--primary-bright));
  box-shadow:0 6px 16px rgba(25,198,160,.5); }
.dock-more{ position:relative; }

/* ---- Screen header ---- */
.screen-hdr{ position:sticky; top:0; z-index:30; border-radius:0;
  margin:0; padding:14px clamp(16px,4vw,28px); border-inline:0; border-top:0;
  background:rgba(10,61,69,0.55); }
.screen-hdr::before{ display:none; }
.hdr-act{ width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--ink-2); background:var(--glass-fill); border:1px solid var(--glass-border);
  transition:.2s var(--ease); }
.hdr-act:hover{ color:#fff; background:rgba(255,255,255,.12); transform:translateY(-1px); }

/* ---- Top user bar (home) ---- */
.topbar{ display:flex; align-items:center; justify-content:space-between;
  padding:16px clamp(16px,4vw,28px); }
.userchip{ display:flex; align-items:center; gap:9px; padding:7px 8px 7px 14px; border-radius:var(--r-pill);
  background:var(--glass-fill); border:1px solid var(--glass-border); cursor:pointer; transition:.2s var(--ease); }
.userchip:hover{ border-color:var(--glass-border-bright); }
.avatar{ width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:13px; color:#04221c;
  background:linear-gradient(135deg,var(--mint),var(--teal)); flex:none; }

/* ---- KPI card ---- */
.kpi{ padding:18px; overflow:hidden; }
.kpi-top{ position:absolute; top:0; inset-inline:0; height:3px; opacity:.9; }
.kpi .between{ gap:10px; }
.kpi .col{ min-width:0; }
.kpi-val{ font-size:clamp(20px,2.4vw,26px); font-weight:800; line-height:1.05; display:flex; align-items:baseline; gap:5px; flex-wrap:nowrap; white-space:nowrap; }
.kpi-unit{ font-size:13px; font-weight:700; color:var(--ink-2); }
.kpi-ic{ width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.06); border:1px solid var(--glass-border); flex:none; }
.label{ font-size:12.5px; }
.sar{ font-size:.62em; font-weight:700; color:var(--ink-2); margin-inline-start:3px; }

/* ---- Module cards (home) ---- */
.mod-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.mod-card{ padding:20px; cursor:pointer; display:flex; flex-direction:column; gap:14px; min-height:140px;
  position:relative; overflow:hidden; }
.mod-card.wide{ grid-column:1 / -1; flex-direction:row; align-items:center; min-height:auto; }
.mod-ic{ width:50px; height:50px; border-radius:15px; display:flex; align-items:center; justify-content:center;
  flex:none; color:#fff; position:relative; }
.mod-ic svg{ width:24px; height:24px; }
.mod-accent{ position:absolute; inset-inline-start:0; top:14px; bottom:14px; width:4px; border-radius:0 4px 4px 0; }
.mod-card .mod-title{ font-weight:700; font-size:16.5px; }
.mod-card .mod-sub{ font-size:12px; color:var(--ink-3); line-height:1.7; }
.mod-arrow{ margin-inline-start:auto; margin-block-start:auto; color:var(--ink-3); transition:.2s var(--ease); }
.mod-card.wide .mod-arrow{ margin-block-start:0; }
.mod-card:hover .mod-arrow{ color:var(--mint); transform:translateX(-4px); }

/* quick actions row */
.qa-row{ display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; scrollbar-width:none; }
.qa-row::-webkit-scrollbar{ display:none; }
.qa{ flex:none; display:flex; align-items:center; gap:8px; padding:11px 16px; border-radius:var(--r-pill);
  background:var(--glass-fill); border:1px solid var(--glass-border); cursor:pointer; color:var(--ink-2);
  font-size:13.5px; font-weight:600; white-space:nowrap; transition:.2s var(--ease); }
.qa:hover{ color:#fff; border-color:var(--glass-border-bright); transform:translateY(-2px); }
.qa svg{ width:17px; height:17px; color:var(--mint); }

/* ---- Empty state ---- */
.empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  padding:60px 20px; }
.empty-ic{ width:74px; height:74px; border-radius:22px; display:flex; align-items:center; justify-content:center;
  color:var(--mint); }

/* ---- FAB ---- */
.fab{ position:fixed; inset-inline-end:22px; bottom:90px; z-index:45; height:56px; min-width:56px;
  border:none; border-radius:var(--r-pill); cursor:pointer; color:#04221c; display:flex; align-items:center;
  gap:8px; padding:0 18px; font-family:var(--font); font-weight:800; font-size:15px;
  background:linear-gradient(135deg,var(--mint),var(--primary-bright));
  box-shadow:0 12px 30px rgba(25,198,160,.55), inset 0 1px 0 rgba(255,255,255,.4);
  transition:.25s var(--ease); }
.fab svg{ width:24px; height:24px; }
.fab .fab-label{ font-size:14px; }
.fab:hover{ transform:translateY(-3px) scale(1.02); box-shadow:0 18px 40px rgba(25,198,160,.7); }
@media (max-width:560px){ .fab .fab-label{ display:none; } .fab{ padding:0; width:56px; } }

/* ---- Big highlighted summary banner (portfolio / VAT) ---- */
.banner{ padding:20px 22px; border-radius:var(--r-card); overflow:hidden; position:relative;
  background:linear-gradient(135deg, rgba(14,138,110,.5), rgba(14,92,83,.42));
  border:1px solid rgba(124,240,200,.22); }
.banner.neg-banner{ background:linear-gradient(135deg, rgba(240,107,107,.32), rgba(120,40,40,.30)); border-color:rgba(240,107,107,.3); }
.banner-row{ display:flex; align-items:center; justify-content:space-between; padding:9px 0; font-size:14.5px; color:var(--ink-2); }
.banner-row.total{ border-top:1px solid rgba(255,255,255,.18); margin-top:6px; padding-top:14px; }
.banner-row.total .v, .banner-row.total .k{ color:var(--mint); font-weight:800; font-size:18px; }
.banner-row .v{ font-weight:700; color:#fff; }

/* ---- Tables ---- */
/* radius is concentric with the glass card (20px) minus its 6px padding = 14px;
   overflow-x:auto makes overflow-y compute to auto, so the wrapper clips all four
   corners to one consistent radius — no per-cell radii needed */
.tbl-wrap{ overflow-x:auto; border-radius:14px; border:1px solid rgba(255,255,255,.06); }
table.tbl{ width:100%; border-collapse:collapse; font-size:13.5px; min-width:520px; }
table.tbl thead th{ text-align:right; font-weight:700; font-size:12.5px; color:#eafff8; padding:12px 14px;
  background:linear-gradient(180deg, rgba(14,138,110,.5), rgba(14,138,110,.28)); position:sticky; top:0; }
table.tbl tbody td{ padding:12px 14px; color:var(--ink-2); border-bottom:1px solid rgba(255,255,255,.06); }
table.tbl tbody tr:last-child td{ border-bottom:none; }
table.tbl tbody tr:nth-child(even){ background:rgba(255,255,255,.025); }
table.tbl tbody tr:hover{ background:rgba(124,240,200,.05); }
.tbl-empty{ text-align:center; color:var(--ink-3); padding:30px; font-size:13.5px; }

/* إصلاح محاذاة الجداول: الرمز .num يُطبَّق على الخلية نفسها فيكسر تخطيط الجدول — نعيدها خلية */
td.num, th.num{ display:table-cell; }
/* نفس العلّة مع الصنف المساعد .flex المستخدَم على خلية الإجراءات في 9 شاشات:
   display:flex يُخرج الخلية من تخطيط الجدول فلا تمتد لارتفاع صفّها (قياس: خلية 59px
   داخل صف 67.7px، وصفّان متطابقا المحتوى يختلفان 24.3px). نعيدها خلية ونرتّب
   محتواها بـflex داخلياً: الأزرار تبقى في سطر واحد بفضل white-space.
   لا يُضاف تباعد هنا: الصنف .gap1 غير معرَّف في هذه الورقة أصلاً فالتباعد اليوم صفر،
   وإضافته تغيير بصري لا إصلاح. أبناء الخلية تُجعَل inline-flex لأن .li-del معرَّف
   display:flex (كتلي) فيتكدّس رأسياً داخل خلية جدول لو تُرك على حاله. */
td.flex, th.flex{ display:table-cell; white-space:nowrap; }
td.flex > *, th.flex > *{ display:inline-flex; vertical-align:middle; }
/* التباعد بالهامش لا بـgap: الخلية table-cell والـgap لا يعمل خارج flex/grid.
   القيمة --s2 (8px) لا --s1: أزرار 34×34 متلاصقة تُنتج نقرات خاطئة على الجوال،
   وفصل ≥8px يبقي هدف اللمس الفعلي ضمن المعيار. */
td.flex > * + *, th.flex > * + *{ margin-inline-start:var(--s2, 8px); }
/* الأرقام ورؤوسها بمحاذاة واحدة (يمين) في RTL لتصطفّ بصرياً */
table.tbl td.num{ white-space:nowrap; text-align:right; }
/* عمود اسم البند: سطر واحد مع تلميح كامل في title */
table.tbl td.cell-name{ max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
table.tbl thead th{ text-align:right; }
/* جدول مستند الفاتورة: تخطيط ثابت لمحاذاة دقيقة */
.invd-table{ table-layout:fixed; }
.invd-table th, .invd-table td{ text-align:center; }
.invd-table th:first-child, .invd-table td:first-child{ text-align:right; width:44%; }
.invd-table th:nth-child(2), .invd-table td:nth-child(2){ width:14%; }
.invd-table th:nth-child(3), .invd-table td:nth-child(3){ width:21%; }
.invd-table th:nth-child(4), .invd-table td:nth-child(4){ width:21%; }
.invd-table td.num{ direction:ltr; }

/* ============================================================
   جداول كثيفة الأعمدة — عرض فقط، لا يمسّ أي منطق حسابي
   ------------------------------------------------------------
   المشكلة المقاسة (سجل تكاليف CBS): 11 عموداً بعرض طبيعي 1086px
   داخل حاوية 944px ← عمود الإجراءات يختفي كلياً و«فواتير» يُقصّ 45px،
   والتمرير صامت لأن أشرطة macOS العائمة غير مرئية في السكون.
   ------------------------------------------------------------
   العلاج بأربع طبقات:
   (1) كثافة compact/dense  → العرض الطبيعي 1066px بدل 1086px
   (2) طيّ الأعمدة الثانوية → 786px عند الشاشات المتوسطة
   (3) بطاقات على الضيّقة   → كل الحقول ظاهرة رأسياً
   (4) تثبيت الإجراءات + شريط تمرير مرئي = شبكة أمان لأي جدول يفيض
   ============================================================ */

/* (1) درجتا كثافة لجداول الزجاج — مكافئ .ht-table compact/dense الكلاسيكية */
table.tbl.compact{ font-size:12.8px; }
table.tbl.compact thead th,
table.tbl.compact tbody td,
table.tbl.compact tfoot td{ padding:9px 9px; }
table.tbl.compact thead th{ font-size:12px; }
table.tbl.dense{ font-size:12px; }
table.tbl.dense thead th,
table.tbl.dense tbody td,
table.tbl.dense tfoot td{ padding:6px 6px; }
table.tbl.dense thead th{ font-size:11.4px; white-space:nowrap; }

/* (2) إشارة تمرير صريحة — شريط مرئي دائماً بدل شريط macOS العائم غير المرئي */
.tbl-wrap{ scrollbar-width:thin; scrollbar-color:rgba(124,240,200,.45) rgba(255,255,255,.06); }
.tbl-wrap::-webkit-scrollbar{ height:9px; }
.tbl-wrap::-webkit-scrollbar-track{ background:rgba(255,255,255,.05); border-radius:0 0 14px 14px; }
.tbl-wrap::-webkit-scrollbar-thumb{ background:rgba(124,240,200,.42); border-radius:99px;
  border:2px solid transparent; background-clip:padding-box; }
.tbl-wrap::-webkit-scrollbar-thumb:hover{ background:rgba(124,240,200,.68); background-clip:padding-box; }

/* (3) تثبيت عمود الإجراءات على حافة النهاية (اليسار في RTL) */
table.tbl.sticky-end thead th:last-child,
table.tbl.sticky-end tbody td:last-child{ position:sticky; inset-inline-end:0; }
/* الخلفية المعتمة والظِلّ لا يُطبَّقان إلا حين يوجد فائض أفقي فعلي
   (الصنف is-scrollable يضعه HISN.syncTableScroll) — فلا فاصل بصري حين يتّسع الجدول */
.tbl-wrap.is-scrollable table.tbl.sticky-end tbody td:last-child{ z-index:2; background:var(--sticky-col);
  box-shadow:9px 0 12px -8px rgba(0,0,0,.6); }
.tbl-wrap.is-scrollable table.tbl.sticky-end tbody tr:nth-child(even) td:last-child{ background:var(--sticky-col-alt); }
.tbl-wrap.is-scrollable table.tbl.sticky-end tbody tr:hover td:last-child{ background:var(--sticky-col-hover); }
.tbl-wrap.is-scrollable table.tbl.sticky-end thead th:last-child{ z-index:3; background:var(--sticky-col-head);
  box-shadow:9px 0 12px -8px rgba(0,0,0,.6); }

/* (4) طيّ الأعمدة الثانوية — عتبتان حسب كثافة الجدول.
   fold-lg: جداول 10 أعمدة فأكثر (تُطوى مبكراً) · fold-sm: جداول 7–9 أعمدة */
@media (max-width:1280px){ table.tbl .fold-lg{ display:none; } }
@media (max-width:900px){  table.tbl .fold-sm{ display:none; } }

/* (5) بطاقات على الشاشات الضيّقة — كل صف بطاقة مكدّسة رأسياً بعناوين من data-label.
   يُفعَّل بالصنف cards-on الذي يضعه HISN.syncTableScroll حسب data-cards-bp لكل جدول،
   فتختار كل شاشة عتبتها دون تكرار الكتلة في أكثر من media query. */
.tbl-wrap.cards-on{ overflow-x:visible; border:none; border-radius:0; }
table.tbl.cards-on{ display:block; min-width:0; font-size:13px; }
.tbl.cards-on thead{ display:none; }
.tbl.cards-on tbody{ display:block; }
.tbl.cards-on tbody tr,
.tbl.cards-on tbody tr:nth-child(even){ display:block; margin-bottom:10px; padding:2px 13px 4px;
  border:1px solid rgba(255,255,255,.10); border-radius:14px; background:rgba(255,255,255,.04); }
.tbl.cards-on tbody tr:hover{ background:rgba(124,240,200,.07); }
.tbl.cards-on tbody td{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:9px 0; border-bottom:1px dashed rgba(255,255,255,.09); text-align:start; white-space:normal; }
.tbl.cards-on tbody tr td:last-child{ border-bottom:none; }
.tbl.cards-on tbody td::before{ content:attr(data-label); flex:none; color:var(--ink-3);
  font-size:11.5px; font-weight:700; }
.tbl.cards-on tbody td:not([data-label])::before,
.tbl.cards-on tbody td[data-label=""]::before{ display:none; }
/* أول خلية = صدر البطاقة (الكود/المعرّف) */
.tbl.cards-on tbody td:first-child{ border-bottom:1px solid rgba(124,240,200,.20); padding-top:11px; }
.tbl.cards-on td.num{ white-space:nowrap; }
.tbl.cards-on td.cell-name{ max-width:none; overflow:visible; text-overflow:clip; white-space:normal; }
/* الأعمدة المطويّة تعود للظهور داخل البطاقة — لا يضيع أي حقل */
.tbl.cards-on .fold-lg,
.tbl.cards-on .fold-sm{ display:flex; }
/* صف الأزرار في ذيل البطاقة */
.tbl.cards-on tbody td.acts{ justify-content:flex-end; gap:8px; padding-top:11px; }
/* التثبيت بلا معنى في وضع البطاقات */
.tbl.cards-on.sticky-end thead th:last-child,
.tbl.cards-on.sticky-end tbody td:last-child{ position:static; box-shadow:none; background:transparent; }
/* ذيل الإجماليات كبطاقة ملخّص */
.tbl.cards-on tfoot{ display:block; }
.tbl.cards-on tfoot tr{ display:flex; flex-wrap:wrap; gap:8px 18px; padding:13px;
  border:1px solid rgba(124,240,200,.28); border-radius:14px; background:rgba(14,138,110,.20); }
.tbl.cards-on tfoot td{ display:flex; gap:7px; border:none; padding:0; }
.tbl.cards-on tfoot td::before{ content:attr(data-label); color:var(--ink-3); font-weight:700; font-size:11.5px; }
.tbl.cards-on tfoot td:not([data-label])::before,
.tbl.cards-on tfoot td[data-label=""]::before{ display:none; }

/* الطباعة: عرض ورقة A4 يطابق عتبتَي الطيّ (1280/900)، فتختفي الأعمدة الثانوية
   من المطبوعات صامتةً. تُعاد كاملةً هنا، ويُبطَل وضع البطاقات والتثبيت على الورق. */
@media print{
  table.tbl .fold-lg, table.tbl .fold-sm{ display:table-cell !important; }
  .tbl-wrap{ overflow:visible !important; border:none !important; }
  table.tbl.cards-on{ display:table !important; }
  .tbl.cards-on thead{ display:table-header-group !important; }
  .tbl.cards-on tbody{ display:table-row-group !important; }
  .tbl.cards-on tbody tr{ display:table-row !important; border:0 !important; padding:0 !important; background:none !important; }
  .tbl.cards-on tbody td{ display:table-cell !important; border-bottom:1px solid #ddd !important; }
  .tbl.cards-on tbody td::before{ content:none !important; }
  table.tbl.sticky-end thead th:last-child,
  table.tbl.sticky-end tbody td:last-child{ position:static !important; box-shadow:none !important; background:none !important; }
}

/* ============================================================
   طباعة مستند الفاتورة
   المسار الرسمي للفاتورة الورقية: window.print يستخدم محرّك المتصفح
   نفسه، فيعرض العربية بتشكيل ومسافات سليمة — بخلاف html2canvas
   الذي يُسقط آخر مسافة. يبقى html2pdf للإرفاق السريع.
   يُفعَّل بالصنف body.print-invoice الذي يضعه HISN.invPrint().
   ============================================================ */
@media print{
  @page{ size:A4; margin:12mm; }

  /* إخفاء واجهة التطبيق بـdisplay لا visibility: الأخيرة تحجز مساحة التخطيط
     فتُنتج صفحة ثانية فارغة (بلاغ مثبت على ملف مطبوع فعلياً). */
  body.print-invoice .rail,
  body.print-invoice .dock,
  body.print-invoice .screen-hdr,
  body.print-invoice .fab,
  body.print-invoice .cards-2,
  body.print-invoice .tweaks-panel,
  body.print-invoice #hisn-toast,
  body.print-invoice #hisn-busy,
  body.print-invoice .modal-overlay{ display:none !important; }

  /* تحييد الارتفاع القسري: #app و.app-shell عليهما min-height:100dvh
     فيفرضان صفحة كاملة على الأقل ثم تفيض البقية لصفحة ثانية. */
  body.print-invoice, body.print-invoice #app, body.print-invoice .app-shell,
  body.print-invoice .main-col, body.print-invoice .screen{
    min-height:0 !important; height:auto !important; max-height:none !important;
    overflow:visible !important; display:block !important;
    background:#fff !important; padding:0 !important; margin:0 !important;
  }
  body.print-invoice .wrap{ max-width:none !important; width:auto !important;
    padding:0 !important; margin:0 !important; }

  /* المستند يبقى في التدفق الطبيعي — لا position:absolute:
     الإزاحة تُخرجه من التدفق فيصير ارتفاع الصفحة مستقلاً عن ارتفاعه. */
  body.print-invoice #inv-doc{
    border-radius:0 !important; box-shadow:none !important; border:none !important;
    background:#fff !important; padding:18px !important; margin:0 !important;
    max-width:none !important; width:auto !important;
  }
  /* لوحة QR: الإطار 96px بينما اللوحة 140px — يُترك الإطار يتمدّد للحجم الفعلي */
  body.print-invoice #inv-doc .invd-qr{ width:auto !important; height:auto !important; }
  body.print-invoice #inv-doc .invd-qr canvas{ width:120px !important; height:120px !important; }

  /* الخلفيات والألوان تُطبع كما هي (رأس الجدول الأخضر وQR والشرائط) */
  body.print-invoice #inv-doc, body.print-invoice #inv-doc *{
    -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important;
  }
  /* لا تُقطع الصفوف والكتل بين الصفحات */
  body.print-invoice #inv-doc .invd-table tr,
  body.print-invoice #inv-doc .invd-meta,
  body.print-invoice #inv-doc .invd-party,
  body.print-invoice #inv-doc .invd-tot{ page-break-inside:avoid; break-inside:avoid; }
  body.print-invoice #inv-doc .invd-table thead{ display:table-header-group; }
  /* آخر عنصر لا يدفع صفحة زائدة */
  body.print-invoice #inv-doc .invd-foot{ page-break-after:avoid; break-after:avoid; }
}

/* ---- Segmented toggle (sales/purchase, etc.) ---- */
.seg{ display:flex; gap:6px; padding:6px; border-radius:var(--r-btn); background:rgba(4,22,28,.4);
  border:1px solid var(--glass-border); }
.seg button{ flex:1; padding:11px 14px; border:none; border-radius:9px; cursor:pointer; font-family:var(--font);
  font-weight:700; font-size:14px; color:var(--ink-2); background:transparent; transition:.2s var(--ease); }
.seg button.on{ color:#fff; background:linear-gradient(135deg,var(--primary-bright),var(--primary));
  box-shadow:0 6px 16px rgba(14,138,110,.45); }
.seg button.on.danger{ background:linear-gradient(135deg,#F58A8A,var(--neg)); box-shadow:0 6px 16px rgba(240,107,107,.4); }

/* ---- Tabs ---- */
.tabs{ display:flex; gap:8px; flex-wrap:wrap; }
@media (max-width:420px){
  .tabs{ gap:6px; }
  .tabs .tab{ padding:8px 12px; font-size:12.5px; }
}
.tab{ padding:10px 16px; border-radius:var(--r-pill); cursor:pointer; font-weight:600; font-size:13.5px;
  color:var(--ink-2); background:var(--glass-fill); border:1px solid var(--glass-border); transition:.2s var(--ease); }
.tab:hover{ color:#fff; } .tab.on{ color:#04221c; background:linear-gradient(135deg,var(--mint),var(--primary-bright)); border-color:transparent; }

/* ---- Modal ---- */
.modal-overlay{ position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center;
  padding:20px; background:rgba(4,18,24,.6); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease); }
.modal-overlay.open{ opacity:1; pointer-events:auto; }
.modal{ width:min(440px,100%); padding:26px; transform:translateY(16px) scale(.98); transition:transform .3s var(--ease); }
.modal-overlay.open .modal{ transform:none; }

/* ---- Upload dropzone ---- */
.dropzone{ border:1.5px dashed rgba(124,240,200,.35); border-radius:var(--r-card-sm); padding:34px 20px;
  text-align:center; cursor:pointer; transition:.2s var(--ease); background:rgba(124,240,200,.04); }
.dropzone:hover{ background:rgba(124,240,200,.08); border-color:rgba(124,240,200,.6); }
.dropzone .dz-ic{ width:56px; height:56px; border-radius:16px; margin:0 auto 12px; display:flex; align-items:center; justify-content:center;
  color:var(--mint); background:rgba(124,240,200,.10); }

/* ---- Notice / hint ---- */
.notice{ display:flex; gap:11px; align-items:flex-start; padding:14px 16px; border-radius:var(--r-card-sm);
  font-size:13px; line-height:1.7; }
.notice svg{ flex:none; margin-top:2px; }
.notice.hint{ background:rgba(21,184,194,.10); border:1px solid rgba(21,184,194,.25); color:#bdeef2; }
.notice.warn{ background:rgba(245,177,76,.10); border:1px solid rgba(245,177,76,.28); color:#f6d49a; }
.notice.hint svg{ color:var(--teal); } .notice.warn svg{ color:var(--warn); }

/* line items */
.li-row{ display:grid; grid-template-columns:1fr 80px 100px 110px 38px; gap:8px; align-items:center; }
.li-head{ font-size:11.5px; font-weight:700; color:var(--ink-3); padding-inline:4px; }
.li-del{ width:34px; height:34px; border-radius:10px; border:1px solid rgba(240,107,107,.3); background:rgba(240,107,107,.12);
  color:#ff9b9b; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.li-del:hover{ background:rgba(240,107,107,.22); }
@media (max-width:560px){ .li-row{ grid-template-columns:1fr 56px 72px 80px 32px; gap:5px; } }
/* صفّ بند بعمودَي ضريبة: النوع ومبلغها.
   عمودان إضافيان يدفعان الصف فوق عرض الحاوية — لذلك يُطويان
   بعتبتين: مبلغ الضريبة أولاً (fold-lg) ثم النوع (fold-sm)، والنوع يبقى
   متاحاً في النافذة عبر القائمة نفسها بعد الطيّ لأنه يُحفظ مع البند. */
.li-row-tax{ grid-template-columns:1fr 70px 90px 150px 90px 100px 38px; }
@media (max-width:1180px){ .li-row-tax{ grid-template-columns:1fr 70px 90px 150px 100px 38px; }
  .li-row-tax > .fold-lg{ display:none; } }
@media (max-width:820px){ .li-row-tax{ grid-template-columns:1fr 60px 80px 90px 32px; }
  .li-row-tax > .fold-sm{ display:none; } }
@media (max-width:560px){ .li-row-tax{ grid-template-columns:1fr 52px 68px 76px 30px; gap:5px; } }
/* الأبناء لا يتجاوزون أعمدتهم: .li-del عرضه الثابت 34px كان يفيض عمود 30px */
.li-row-tax > *{ min-width:0; }
.li-row-tax > .li-del{ width:100%; min-width:0; }
/* المطبوعة: لا طيّ — كل الأعمدة تعود، **ومعها قالب الشبكة السباعي**.
   إعادة إظهار العنصرين بلا إعادة القالب تُنسِل سبعة أبناء في ستة أعمدة
   فيلتفّ الصف سطرين (قِيس: 43px → 85px على عرض A4 الفعلي 703px). */
@media print{
  /* أعمدة كسرية لا ثابتة: الورق قد يكون A4 أو أضيق، والقيم الثابتة تفيض.
     الكسور تتكيّف مع أي عرض فيبقى الفيض صفراً في كل المقاسات. */
  .li-row-tax{ grid-template-columns:2.2fr .7fr 1fr 1.6fr 1fr 1.1fr 26px !important; gap:4px !important; }
  .li-row-tax > *{ min-width:0 !important; }
  .li-row-tax > .fold-lg, .li-row-tax > .fold-sm{ display:block !important; }
  .li-row-tax .input{ font-size:11px; padding:4px 6px; }
}

/* small card metric (3-up totals) */
.mini-metric{ padding:16px; text-align:center; border-top:3px solid var(--ka,var(--mint)); }
.mini-metric .mm-label{ font-size:12.5px; color:var(--ink-2); }
.mini-metric .mm-val{ font-size:22px; font-weight:800; margin-top:6px; }

/* responsive grids */
.cards-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.cards-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.cards-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media (max-width:880px){ .cards-4{ grid-template-columns:repeat(2,1fr); } .cards-3{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .mod-grid{ grid-template-columns:1fr; } .cards-2{ grid-template-columns:1fr; } .cards-3,.cards-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:420px){ .cards-3,.cards-4{ grid-template-columns:1fr; } }

/* responsive nav visibility */
.dock{ display:none; }
@media (max-width:880px){
  .rail{ display:none; }
  .dock{ display:flex; }
  .main-col{ max-height:none; overflow:visible; }
  .app-shell{ display:block; }
  .main-col{ padding-bottom:96px; }
}

/* ---- Home hero ---- */
@media (max-width:560px){
  .between{ flex-wrap:wrap; }
  .between > .flex{ flex-wrap:wrap; min-width:0; }
}

.home-hero{ padding:26px clamp(20px,4vw,30px); margin-top:8px; overflow:hidden; position:relative; }
.home-hero-glow{ position:absolute; width:340px; height:340px; border-radius:50%; filter:blur(60px);
  top:-160px; inset-inline-start:-60px; opacity:.55;
  background:radial-gradient(circle, rgba(25,198,160,.6), transparent 70%); }

/* ---- Form grid (2-up, collapses) ---- */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px 16px; }
@media (max-width:560px){ .form-grid{ grid-template-columns:1fr; } }

/* ---- Printable invoice document ---- */
.invoice-doc{ background:#fbfdfc; color:#0b2a30; border-radius:var(--r-card); padding:clamp(20px,4vw,34px);
  box-shadow:0 24px 60px rgba(0,0,0,.4); border:1px solid rgba(0,0,0,.06); }
.invoice-doc .num{ color:#0b2a30; }
.invd-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px;
  padding-bottom:18px; border-bottom:2px solid #0E8A6E; }
.invoice-doc .logo-lockup span{ color:#0b3a33 !important; }
.invd-qr{ width:96px; height:96px; border-radius:14px; border:1.5px solid #cfe6df; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:5px; color:#0E8A6E; background:#f0f8f5; }
.invd-qr svg{ width:48px; height:48px; }
.invd-qr span{ font-size:8.5px; font-weight:700; color:#5a857c; }
.invd-meta{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:20px 0; }
.invd-meta > div{ display:flex; flex-direction:column; gap:3px; }
.invd-meta span{ font-size:11px; color:#6f9089; font-weight:600; }
.invd-meta b{ font-size:13.5px; color:#0b2a30; }
.invd-party{ background:#eef7f4; border-radius:12px; padding:12px 16px; display:flex; flex-direction:column; gap:3px; }
.invd-party span{ font-size:11px; color:#6f9089; font-weight:700; }
.invd-party b{ font-size:14px; }
.invd-table{ width:100%; border-collapse:collapse; margin:18px 0; font-size:13px; }
.invd-table th{ background:#0E8A6E; color:#fff; padding:11px 12px; text-align:center; font-weight:700; }
.invd-table th:first-child{ text-align:right; border-start-start-radius:10px; } .invd-table th:last-child{ border-start-end-radius:10px; }
.invd-table td{ padding:11px 12px; border-bottom:1px solid #e4efeb; }
.invd-tot{ margin-inline-start:auto; max-width:320px; display:flex; flex-direction:column; gap:9px; padding-top:4px; }
.invd-tot > div{ display:flex; justify-content:space-between; font-size:13.5px; color:#33564f; }
.invd-tot .grand{ border-top:2px solid #0E8A6E; padding-top:11px; margin-top:4px; font-size:16px; font-weight:800; color:#0b2a30; }
.invd-foot{ margin-top:22px; padding-top:16px; border-top:1px dashed #cfe6df; font-size:11.5px; color:#6f9089; text-align:center; line-height:1.7; }
@media (max-width:560px){ .invd-meta{ grid-template-columns:repeat(2,1fr); } }

/* chart placeholder */
.chart-empty{ height:160px; display:flex; align-items:center; justify-content:center; color:var(--ink-3); font-size:13.5px;
  border:1px dashed rgba(255,255,255,.10); border-radius:var(--r-card-sm); background:rgba(255,255,255,.02); }

/* ---- Tweaks panel ---- */
.tweaks-panel{ position:fixed; left:18px; bottom:18px; z-index:300; width:260px; border-radius:18px;
  overflow:hidden; transform:translateY(12px) scale(.98); opacity:0; transition:.25s var(--ease); }
.tweaks-panel.open{ transform:none; opacity:1; }
.tw-head{ display:flex; align-items:center; justify-content:space-between; padding:13px 15px;
  border-bottom:1px solid var(--glass-border); font-size:14px; }
.tw-x{ width:30px; height:30px; border-radius:9px; border:1px solid var(--glass-border); background:transparent;
  color:var(--ink-2); cursor:pointer; display:flex; align-items:center; justify-content:center; }
.tw-x:hover{ color:#fff; background:rgba(255,255,255,.08); }
.tw-body{ padding:15px; }
.tw-sec{ font-size:12px; font-weight:700; color:var(--ink-2); margin:14px 0 8px; display:flex; justify-content:space-between; }
.tw-sec:first-child{ margin-top:0; }
.tw-val{ color:var(--mint); }
.tw-seg{ display:flex; gap:5px; padding:5px; border-radius:11px; background:rgba(4,22,28,.45); border:1px solid var(--glass-border); }
.tw-seg button{ flex:1; padding:8px 4px; border:none; border-radius:8px; cursor:pointer; font-family:var(--font);
  font-weight:600; font-size:12.5px; color:var(--ink-2); background:transparent; transition:.2s var(--ease); }
.tw-seg button.on{ color:#04221c; background:linear-gradient(135deg,var(--mint),var(--primary-bright)); }
.tw-range{ width:100%; -webkit-appearance:none; height:6px; border-radius:99px; outline:none;
  background:linear-gradient(90deg,var(--mint),var(--primary-bright)); }
.tw-range::-webkit-slider-thumb{ -webkit-appearance:none; width:18px; height:18px; border-radius:50%; cursor:pointer;
  background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.4); border:3px solid var(--primary-bright); }
.tw-swatches{ display:flex; gap:9px; }
.tw-sw{ width:34px; height:34px; border-radius:10px; cursor:pointer; border:2px solid transparent; transition:.2s var(--ease); }
.tw-sw.on{ border-color:#fff; box-shadow:0 0 0 2px rgba(255,255,255,.2); transform:scale(1.05); }
@media (max-width:880px){ .tweaks-panel{ bottom:90px; } }

/* ===== الوصولية (WCAG AA) ===== */
:focus-visible{ outline:2px solid var(--mint,#7CF0C8); outline-offset:2px; }
.btn:focus-visible,.tab:focus-visible,.hdr-act:focus-visible,.li-del:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
/* أحجام لمس مريحة للأزرار الصغيرة */
.btn-sm{ min-height:34px; } .li-del{ min-width:34px; min-height:34px; }
/* احترام تقليل الحركة */
@media (prefers-reduced-motion: reduce){ *{ animation-duration:.01ms !important; transition-duration:.01ms !important; } }

/* ===== غطاء التحميل (Day-4 UX) ===== */
.hisn-busy{ position:fixed; inset:0; z-index:600; display:none; flex-direction:column; align-items:center; justify-content:center; gap:14px;
  background:rgba(6,20,28,.55); backdrop-filter:blur(4px); color:#fff; font-weight:600; font-size:14px; }
.hisn-spin{ width:44px; height:44px; border-radius:50%; border:3px solid rgba(124,240,200,.25); border-top-color:var(--mint,#7CF0C8); animation:hisn-rot .8s linear infinite; }
@keyframes hisn-rot{ to{ transform:rotate(360deg); } }

/* ===== وضع كثافة الجداول (مضغوط) ===== */
body.dense table.tbl td, body.dense table.tbl th{ padding:5px 8px !important; font-size:12px; }
body.dense .kpi-val{ font-size:17px !important; }
body.dense .glass{ padding-top:14px; padding-bottom:14px; }

/* ── شريط الوضع التجريبي — دائم وغير قابل للإخفاء ─────────────────────── */
.demo-bar{ position:sticky; top:0; z-index:900; display:flex; align-items:center; gap:10px;
  padding:9px clamp(14px,3vw,26px); font-size:13px; font-weight:600; line-height:1.6;
  color:#1b1200; background:linear-gradient(90deg,#F5B14C,#F2C572);
  border-bottom:2px solid rgba(0,0,0,.22); box-shadow:0 2px 12px rgba(0,0,0,.28); }
.demo-bar svg{ flex:none; }
.demo-bar b{ font-weight:800; }
/* شارة السجل التجريبي في القوائم */
.badge.demo{ background:rgba(245,177,76,.18); color:#F5B14C; border:1px solid rgba(245,177,76,.42); }
@media print{ .demo-bar{ position:static; } }

/* ---- شريط سلامة البيانات (التكامل المرجعي) ----
   لونه أحمر تحذيري لا كهرماني: الوضع التجريبي حالة اختيارية،
   أما الرابط المفقود فخلل يستوجب فعلاً. */
.integrity-bar{ position:sticky; top:0; z-index:901; display:flex; align-items:center; gap:10px;
  flex-wrap:wrap; padding:9px clamp(14px,3vw,26px); font-size:13px; font-weight:600; line-height:1.6;
  color:#2a0d0d; background:linear-gradient(90deg,#F08D8D,#F3AFAF);
  border-bottom:2px solid rgba(0,0,0,.22); box-shadow:0 2px 12px rgba(0,0,0,.28); }
.integrity-bar svg{ flex:none; }
.integrity-bar b{ font-weight:800; }
.integrity-bar .btn{ margin-inline-start:auto; background:rgba(0,0,0,.72); color:#fff;
  border:1px solid rgba(0,0,0,.5); font-weight:700; }
.integrity-bar .btn:hover{ background:#000; }
@media print{ .integrity-bar{ display:none; } }

/* ---- شريط النسخة الاحتياطية الخارجية (أحمر · غير قابل للإخفاء) ---- */
.backup-bar{ position:sticky; top:0; z-index:902; display:flex; align-items:center; gap:10px;
  flex-wrap:wrap; padding:9px clamp(14px,3vw,26px); font-size:13px; font-weight:600; line-height:1.6;
  color:#2a0d0d; background:linear-gradient(90deg,#E86A6A,#F09B9B);
  border-bottom:2px solid rgba(0,0,0,.24); box-shadow:0 2px 12px rgba(0,0,0,.28); }
.backup-bar svg{ flex:none; }
.backup-bar .btn{ margin-inline-start:auto; background:rgba(0,0,0,.75); color:#fff;
  border:1px solid rgba(0,0,0,.5); font-weight:700; }
.backup-bar .btn:hover{ background:#000; }
@media print{ .backup-bar{ display:none; } }

/* ---- مؤشر حالة المزامنة — دائم في كل شاشة ----
   ثابت أسفل يسار، فوق الدوك على الجوال. قابل للنقر ويقود لشاشة السحابة.
   يُبنى مرة واحدة في <body> فلا يُفقد مع إعادة رسم الشاشة. */
.sync-pill{ position:fixed; inset-inline-start:14px; bottom:14px; z-index:480;
  display:inline-flex; align-items:center; gap:7px; max-width:min(70vw,320px);
  padding:7px 14px; border-radius:999px; cursor:pointer;
  font:600 12.5px/1.4 inherit; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  color:#eafff7; background:rgba(8,42,56,.82); border:1px solid rgba(124,240,200,.28);
  backdrop-filter:blur(14px); box-shadow:0 8px 22px rgba(0,0,0,.34);
  transition:.25s var(--ease); }
.sync-pill:hover{ transform:translateY(-2px); border-color:rgba(124,240,200,.55); }
.sync-pill:focus-visible{ outline:2px solid var(--mint,#7CF0C8); outline-offset:2px; }
.sync-pill.s-online{ border-color:rgba(25,198,160,.45); color:#bdf6e4; }
.sync-pill.s-syncing,.sync-pill.s-connecting{ border-color:rgba(21,184,194,.5); color:#c4f0f4; }
.sync-pill.s-offline{ border-color:rgba(245,177,76,.55); color:#ffe2b4; }
.sync-pill.s-error{ border-color:rgba(240,141,141,.6); color:#ffd2d2; }
.sync-pill.s-off,.sync-pill.s-signedout{ opacity:.72; }
@media (max-width:900px){ .sync-pill{ bottom:88px; font-size:12px; padding:6px 12px; } }
@media print{ .sync-pill{ display:none; } }

/* ---- تلميح الأزرار الأيقونية ----
   يعمل بالمرور وبالتركيز وبالضغطة المطوّلة على اللمس (الجوال لا hover فيه). */
#hisn-tip{ position:fixed; z-index:1200; pointer-events:none;
  padding:6px 11px; border-radius:8px; font:600 12px/1.5 inherit; white-space:nowrap;
  color:#eafff7; background:rgba(6,32,42,.96); border:1px solid rgba(124,240,200,.28);
  box-shadow:0 8px 22px rgba(0,0,0,.42); max-width:min(70vw,260px);
  overflow:hidden; text-overflow:ellipsis; }
#hisn-tip[hidden]{ display:none; }
@media print{ #hisn-tip{ display:none !important; } }

/* ============ دليل الاستخدام (3.32) ============ */
.help-me{background:var(--glass-fill,rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.1);
  border-radius:10px;padding:9px 13px;font-size:12.5px;margin-bottom:12px;color:var(--ink-2)}
.help-mod{padding:16px;margin-bottom:12px;border-radius:14px}
.help-mod.dim{opacity:.62}
.help-mod-h{cursor:pointer;align-items:flex-start;gap:10px}
.help-mod-h:focus-visible{outline:3px solid var(--ht-accent,#15B8C2);outline-offset:3px;border-radius:8px}
.help-mod-b{margin-top:12px;border-top:1px solid rgba(255,255,255,.09);padding-top:12px}
.help-when{font-size:12.5px;line-height:1.9;color:var(--ink-2);margin-bottom:8px}
.help-h4{font-size:14px;font-weight:700;margin:20px 0 10px;color:var(--ink)}
.help-line{font-size:12px;line-height:1.9;color:var(--ink-2);margin-top:6px;
  display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.help-line.approval{color:#7CF0C8}
.help-line.warnline{color:#F5B14C}
.help-line.limit{display:block;padding:7px 0;border-bottom:1px dashed rgba(255,255,255,.08)}
.help-line.limit:last-child{border-bottom:0}
.help-acts{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px;margin-top:10px}
.help-act{border:1px solid rgba(255,255,255,.1);border-radius:11px;padding:11px 13px;
  background:rgba(255,255,255,.03)}
.help-act.mine{border-color:rgba(124,240,200,.34);background:rgba(124,240,200,.06)}
.help-act.notmine{opacity:.72}
.help-perm{font-size:10.5px;color:var(--ink-3,#8896A0);margin-top:3px;direction:ltr}
.help-chip{display:inline-flex;align-items:center;gap:3px;font-size:11px;padding:2px 8px;
  border-radius:999px;background:color-mix(in srgb,var(--rc) 20%,transparent);
  border:1px solid color-mix(in srgb,var(--rc) 45%,transparent);white-space:nowrap}
.help-chip.me{outline:2px solid var(--rc);outline-offset:1px;font-weight:700}
.help-badge{font-size:10.5px;padding:2px 8px;border-radius:6px;white-space:nowrap}
.help-badge.ok{background:rgba(124,240,200,.16);color:#7CF0C8}
.help-badge.no{background:rgba(255,255,255,.07);color:var(--ink-3,#8896A0)}
.help-tag{font-size:10px;padding:1px 7px;border-radius:5px;margin-inline-start:6px;white-space:nowrap}
.help-tag.ok{background:rgba(124,240,200,.14);color:#7CF0C8}
.help-tag.danger{background:rgba(240,141,141,.16);color:#F08D8D}
.help-tag.info{background:rgba(91,200,232,.14);color:#5BC8E8}
.help-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.help-res{padding:9px 0;border-bottom:1px dashed rgba(255,255,255,.08)}
.help-res:last-child{border-bottom:0}
.help-rolebar{display:flex;flex-wrap:wrap;gap:7px}
.help-flow{display:flex;flex-wrap:wrap;align-items:stretch;gap:8px;margin-top:8px}
.help-step{flex:1 1 150px;min-width:0;border:1px solid rgba(255,255,255,.1);border-radius:10px;
  padding:9px 11px;font-size:11.5px;line-height:1.8;background:rgba(255,255,255,.03)}
.help-step-t{display:block;font-weight:700;font-size:10.5px;color:var(--ht-accent,#15B8C2);margin-bottom:2px}
.help-arrow{align-self:center;color:var(--ink-3,#8896A0);font-size:15px}
.hdr-help{margin-inline-end:6px}
@media (max-width:560px){
  .help-acts{grid-template-columns:1fr}
  .help-flow{flex-direction:column}
  .help-arrow{transform:rotate(-90deg)}
}
@media print{
  .help-mod-b{display:block !important}
  .help-acts{grid-template-columns:1fr 1fr}
  .help-mod{break-inside:avoid}
}

/* ── الشريط التوضيحي للأهلية الضريبية (3.33) ── */
.tax-banner{display:flex;gap:10px;align-items:flex-start;padding:11px 16px;
  background:rgba(245,177,76,.13);border-bottom:1px solid rgba(245,177,76,.3);
  color:var(--ink);font-size:12.5px;line-height:1.9}
.tax-banner svg{flex:none;color:#F5B14C;margin-top:2px}
.tax-banner b{color:#F5B14C}
@media (max-width:560px){.tax-banner{font-size:12px;padding:10px 12px}}

/* ── سجل الإقرارات (3.35) ── */
.cns-row{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);
  border-radius:12px;padding:13px 15px;margin-bottom:10px}
.cns-text{margin-top:8px}
.cns-text summary{cursor:pointer;font-size:12px;color:var(--ink-2)}
.cns-text pre{white-space:pre-wrap;font-size:12px;line-height:1.9;background:rgba(0,0,0,.22);
  padding:10px 12px;border-radius:8px;margin:8px 0 4px;direction:rtl;text-align:start}
.cns-verdict{margin-top:6px;min-height:16px}

/* ── إقرار الشكل النظامي (قرار ٢-أ-٢) ─────────────────────────────── */
.lf-list{display:flex;flex-direction:column;gap:8px;margin:12px 0}
.lf-opt{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;
  border:1px solid var(--glass-brd);border-radius:12px;cursor:pointer;
  background:var(--glass-fill);transition:border-color .15s,background .15s}
.lf-opt:hover{border-color:var(--mint)}
.lf-opt input{margin-top:3px;flex:0 0 auto}
.lf-opt > span{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.lf-opt b{font-size:14px;line-height:1.6}
.lf-note{font-size:12px;opacity:.72;font-style:normal}
.lf-tag{font-size:11px;font-style:normal;align-self:flex-start;
  padding:2px 8px;border-radius:999px;white-space:nowrap}
.lf-tag.ok{background:#0E8A6E22;color:var(--ht-success-text,#0E8A6E);border:1px solid #0E8A6E44}
.lf-tag.no{background:#B4530922;color:var(--ht-warning-text,#B45309);border:1px solid #B4530944}
@media (max-width:420px){.lf-opt{padding:10px 11px}.lf-opt b{font-size:13px}}