@import url('tajawal.css'); /* AUD2-071: الخطُّ محلّيّ — كان من Google Fonts في كلّ زيارة */

/* ═══ الدفعة 50 — التصميم 15 «الذهبُ السائل» على الويب كلِّه بوضعين (اختيارُ المالك 2026-10-15: «نفّذه على الويب بالكامل واجعل منه فاتحاً وداكناً»):
   داكنٌ غرافيتيّ، وفاتحٌ خزفيٌّ دافئ، وذهبٌ منصهرٌ لهما. المتغيّراتُ القديمة بأسمائها (271 موضعاً) تُعاد قيمُها لكلّ وضع، والجديدةُ سطوحٌ ونصوصٌ وحالات.
   الوضعُ من js/theme.js (data-theme على html قبل أوّل رسم)، وبلا سكربتٍ يتبع وضعَ الجهاز. والأوراقُ والمطبوعات (doc وv4 والملصقات) بألوانها وخطّها
   القديمَين في الوضعين، والطباعةُ كلُّها بقيم ما قبل الدفعة — انظر «الأوراق والطباعة» آخرَ الملفّ. ═══ */
/* خطُّ «دبي» من ويندوز نفسِه (فيه منذ ويندوز 10 بأوزانه الأربعة)، ولا يُنشر من الويب: نسخةُ ويندوز مرخَّصةٌ للعرض على الجهاز لا لإعادة التوزيع.
   وحيث لا يوجد (الجوّال مثلاً) فـ«تجوّل» المضمَّن (wwwroot/fonts/tajawal، برخصة OFL) كما كان قبل الدفعة. ولا ‎@font-face‎ باسمه: لا يحجب الخطَّ المثبَّت
   عن أوراق كشف الحساب (ks) التي تسمّيه منذ الدفعة 16. */

:root {
  color-scheme: light;
  --font: 'Dubai', 'Tajawal', 'Segoe UI', Tahoma, sans-serif;
  /* النماذجُ المنقولة عن المكتبي بالبكسل (الفواتير، وصالةُ نقطة البيع، والوردية، ولوحةُ الأسعار) تبقى بخطّها: «دبي» أعرضُ بنحو 13٪ عند الحجم نفسِه */
  --font-dense: 'Tajawal', 'Segoe UI', Tahoma, sans-serif;
  /* الذهبُ المنصهر: لمربّع الأسعار وزرّ «فاتورة جديدة» والتبويب النشط */
  --molten: radial-gradient(60% 80% at 22% 28%, #fff3c4 0%, rgba(255,243,196,0) 60%), radial-gradient(70% 90% at 82% 18%, #f8c95a 0%, rgba(248,201,90,0) 62%),
            radial-gradient(80% 80% at 62% 92%, #a8650f 0%, rgba(168,101,15,0) 66%), radial-gradient(60% 60% at 8% 92%, #e49a26 0%, rgba(228,154,38,0) 62%),
            linear-gradient(135deg, #f9d77e, #c68a24);
  --gold-grad: linear-gradient(135deg, #f9d77e 0%, #e8b24a 46%, #c68a24 100%);
  --accent-ink: #2a1700;
  --gold: #c68a24; --gold-dark: #8f5f12; --gold-light: #e8b24a; --gold-soft: #fbf0d6;
  --bg: #f4f2ee; --bg-glow: rgba(248,201,90,.13);
  --panel: #ffffff; --panel-2: #faf8f4; --sunken: #f1eee8; --input-bg: #ffffff;
  --text: #1d1a15; --muted: #7b7468; --faint: #a39b8d;
  --line: #e9e4da; --line-2: #dbd4c6;
  --ok: #1f8a55; --bad: #c0392b; --sea: #1f6f8f; --warn: #9a6512;
  --ok-soft: #e4f4ea; --bad-soft: #fbe6e3; --sea-soft: #e2eff5; --warn-soft: #fbf1db;
  --th-bg: #faf7f1; --th-ink: #76664a; --row-hover: #fbf7ee; --foot-bg: #f8f4ea;
  --shadow: 0 1px 2px rgba(31,26,18,.04), 0 10px 28px rgba(31,26,18,.06);
  --shadow-lg: 0 24px 60px rgba(31,26,18,.18);
  --radius: 18px; --radius-lg: 26px;
  --dock-w: 84px; --dock-bg: #ffffff; --dock-ink: #4e4940; --dock-line: #ebe6dd; --dock-hover: #f6f1e6;
  --fly-bg: #ffffff; --topbar-bg: rgba(244,242,238,.86); --scrim: rgba(29,26,21,.16); --focus: rgba(198,138,36,.30);
  /* درجُ الهاتف (القائمةُ الجانبيّة) */
  --sidebar: #ffffff; --sidebar-2: #ffffff; --sidebar-text: #2f2b24; --sidebar-mut: #8a8274; --sidebar-line: #eee9e0;
  /* شاراتُ البطاقات بألوانها */
  --c-gold: #9a6c12; --c-gold-bg: #fbf0d6; --c-green: #1f7a4b; --c-green-bg: #e3f3e9; --c-sea: #1f5f7a; --c-sea-bg: #e1eef5;
  --c-rose: #b3412f; --c-rose-bg: #fbe7e4; --c-violet: #5b4a9a; --c-violet-bg: #ece8f7; --c-sand: #6f6150; --c-sand-bg: #f1ece2;
  /* تظليلُ الخلايا والصفوف في الصفحات (كانت ألواناً ثابتةً في style=) */
  --hl-warn: #fffbeb; --hl-soft: #fbf8f1; --hl-cash: #fdfaf3; --hl-bad: #fdf2f2; --hl-bad2: #fbd3c4; --hl-gold: #fff7cc; --hl-red: #fdecec; --hl-sea: #e8f1fd;
}
@media screen { :root[data-theme="dark"] {
  color-scheme: dark;
  --gold: #e0a83a; --gold-dark: #f2c35c; --gold-light: #f8d27a; --gold-soft: rgba(248,201,90,.12);
  --bg: #0e0e0f; --bg-glow: rgba(248,201,90,.08);
  --panel: #17171a; --panel-2: #1c1c20; --sunken: #121214; --input-bg: #111113;
  --text: #f1ece2; --muted: #9b9589; --faint: #6f6a62;
  --line: #2a2a2f; --line-2: #3a3a41;
  --ok: #6fd39d; --bad: #ff8f80; --sea: #7cc0e0; --warn: #f2c35c;
  --ok-soft: rgba(111,211,157,.12); --bad-soft: rgba(255,143,128,.12); --sea-soft: rgba(124,192,224,.12); --warn-soft: rgba(242,195,92,.12);
  --th-bg: #1d1d21; --th-ink: #cbb98e; --row-hover: rgba(248,201,90,.05); --foot-bg: #1d1d21;
  --shadow: 0 1px 0 rgba(255,255,255,.035) inset, 0 14px 34px rgba(0,0,0,.34);
  --shadow-lg: 0 28px 70px rgba(0,0,0,.6);
  --dock-bg: #070707; --dock-ink: #a39d92; --dock-line: rgba(255,255,255,.07); --dock-hover: rgba(255,255,255,.06);
  --fly-bg: #121214; --topbar-bg: rgba(14,14,15,.82); --scrim: rgba(0,0,0,.45); --focus: rgba(248,201,90,.30);
  --sidebar: #0b0b0c; --sidebar-2: #121214; --sidebar-text: #e9e3d6; --sidebar-mut: #8f897d; --sidebar-line: rgba(255,255,255,.07);
  --c-gold: #f2c35c; --c-gold-bg: rgba(248,201,90,.13); --c-green: #7fdcab; --c-green-bg: rgba(111,211,157,.13); --c-sea: #8fcbe6; --c-sea-bg: rgba(124,192,224,.13);
  --c-rose: #ff9f92; --c-rose-bg: rgba(255,143,128,.13); --c-violet: #bba9f7; --c-violet-bg: rgba(170,150,245,.15); --c-sand: #cfc6b5; --c-sand-bg: rgba(255,255,255,.06);
  --hl-warn: rgba(242,195,92,.10); --hl-soft: rgba(255,255,255,.03); --hl-cash: rgba(255,255,255,.035); --hl-bad: rgba(255,143,128,.10); --hl-bad2: rgba(255,143,128,.22);
  --hl-gold: rgba(248,201,90,.15); --hl-red: rgba(255,143,128,.12); --hl-sea: rgba(124,192,224,.13);
} }

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font);
  background: radial-gradient(1100px 520px at 88% -8%, var(--bg-glow), transparent 62%) no-repeat, var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--gold-dark); text-decoration: none; }
.num { font-variant-numeric: tabular-nums; direction: ltr; unicode-bidi: embed; }
.ico { flex-shrink: 0; vertical-align: middle; }
::selection { background: rgba(248,201,90,.35); }

/* ---------- الهيكل: لوحةُ الأيقونات (dock) يميناً، ولكلّ مجموعةٍ لوحةٌ منبثقة (fly)، ورأسٌ زجاجيّ؛ والهاتفُ بدرجٍ (sidebar) ---------- */
.shell { display: flex; min-height: 100vh; }
.dock {
  position: sticky; top: 0; height: 100vh; width: var(--dock-w); flex: none; z-index: 22;
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 8px 10px;
  background: var(--dock-bg); border-inline-end: 1px solid var(--dock-line);
}
.dock-logo { flex: none; display: grid; place-items: center; width: 58px; height: 54px; margin-bottom: 4px; }
.dock-logo img { width: 52px; height: 44px; object-fit: contain; filter: drop-shadow(0 3px 8px rgba(198,138,36,.35)); }
.dock-list { flex: 1 1 auto; min-height: 0; width: 100%; display: flex; flex-direction: column; gap: 2px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; }
.dock-list::-webkit-scrollbar { display: none; }
.dk {
  position: relative; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 3px; flex: none;
  padding: 7px 2px 6px; margin: 0; border: 0; border-radius: 14px; background: none; box-shadow: none; color: var(--dock-ink);
  font: inherit; font-size: 10.5px; font-weight: 500; line-height: 1.25; text-align: center; cursor: pointer; transition: background .15s, color .15s;
}
.dk > .ico { width: 22px; height: 22px; }
.dk > span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.55; }
.dk:hover { background: var(--dock-hover); color: var(--text); filter: none; }
.dk:focus-visible { outline: 2px solid var(--gold-light); outline-offset: -2px; }
.dk.open { background: var(--dock-hover); color: var(--text); }
.dk.on, .dk.on:hover { background: var(--gold-grad); color: var(--accent-ink); font-weight: 700; box-shadow: 0 8px 18px rgba(198,138,36,.28); }
.dk-sep { flex: none; width: 36px; height: 1px; margin: 4px auto; background: var(--dock-line); }
.dk-av { flex: none; width: 42px; height: 42px; margin-top: 4px; padding: 0; border: 0; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
  background: var(--gold-grad); color: var(--accent-ink); font: inherit; font-weight: 700; font-size: 16px; box-shadow: 0 0 0 3px var(--dock-bg), 0 0 0 4px rgba(198,138,36,.45); }
.dk-av:hover { filter: brightness(1.05); }
.dk-av:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 3px; }
/* الشاشاتُ القصيرة: بنودٌ أضغط، ثمّ رموزٌ بلا أسماء (والاسمُ في العنوان title) — فلا تُقصّ «الإعدادات» تحت صاحب الجلسة */
@media (max-height: 860px) {
  .dock { gap: 4px; padding: 10px 8px 8px; }
  .dock-logo { height: 46px; margin-bottom: 2px; }
  .dock-logo img { width: 46px; height: 38px; }
  .dk { padding: 5px 2px 4px; gap: 2px; font-size: 10px; }
  .dk > .ico { width: 20px; height: 20px; }
  .dk-sep { margin: 2px auto; }
  .dk-av { width: 38px; height: 38px; font-size: 15px; }
}
@media (max-height: 700px) {
  .dk > span { display: none; }
  .dk { padding: 8px 2px; }
}

/* اللوحةُ المنبثقة: بنودُ المجموعة، أو البحثُ في القائمة كلِّها، أو بطاقةُ المستخدم — تُغلق بالنقر خارجها وبـEsc وبالانتقال */
.fly-scrim { position: fixed; inset: 0; z-index: 23; background: var(--scrim); animation: fly-fade .12s ease-out; }
.fly {
  position: fixed; z-index: 24; top: 10px; bottom: 10px; inset-inline-start: calc(var(--dock-w) + 8px); width: 304px; max-width: calc(100vw - var(--dock-w) - 24px);
  display: flex; flex-direction: column; padding: 12px 10px 10px; border-radius: 22px;
  background: var(--fly-bg); border: 1px solid var(--line); box-shadow: var(--shadow-lg); animation: fly-in .14s ease-out;
}
.fly:focus { outline: none; }
@keyframes fly-in { from { opacity: 0; transform: translateX(12px); } to { opacity: 1; transform: none; } }
@keyframes fly-fade { from { opacity: 0; } }
.fly-h { flex: none; display: flex; align-items: center; gap: 10px; padding: 2px 6px 10px; margin-bottom: 6px; border-bottom: 1px solid var(--line); }
.fly-h > .ico { color: var(--gold); }
.fly-h b { flex: 1; min-width: 0; font-size: 16px; font-weight: 700; }
.fly-x { flex: none; padding: 6px; border: 0; border-radius: 10px; background: transparent; box-shadow: none; color: var(--muted); }
.fly-x:hover { background: var(--gold-soft); color: var(--text); filter: none; }
.fly-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 1px; padding: 2px; }
.fly-list a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; color: var(--text); font-size: 14px; line-height: 1.4; }
.fly-list a > .ico { color: var(--muted); }
.fly-list a:hover { background: var(--gold-soft); }
.fly-list a:hover > .ico { color: var(--gold); }
.fly-list a.active { background: var(--gold-grad); color: var(--accent-ink); font-weight: 700; }
.fly-list a.active > .ico { color: var(--accent-ink); }
.fly-list a:focus-visible { outline: 2px solid var(--gold-light); outline-offset: -2px; }
.fly-list .sn-sub { flex: none; height: 1px; margin: 5px 10px; background: var(--line); }
.fly-g { flex: none; margin: 10px 10px 3px; font-size: 11.5px; font-weight: 700; color: var(--muted); }
.fly-g:first-child { margin-top: 2px; }
.fly-search { position: relative; flex: none; margin: 0 2px 8px; }
.fly-search > .ico { position: absolute; inset-inline-start: 11px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.fly-search input { width: 100%; padding: 10px 12px; padding-inline-start: 36px; border-radius: 12px; font-size: 14px; }
.fly-search input::-webkit-search-cancel-button { display: none; }
.fly-empty { padding: 14px 10px; color: var(--muted); font-size: 13px; }
.fly-hint { flex: none; margin: 6px 6px 0; padding-top: 8px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11.5px; }
.fly-user { flex: none; display: flex; align-items: center; gap: 12px; padding: 4px 6px 12px; margin-bottom: 6px; border-bottom: 1px solid var(--line); }
.fly-user .av { flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: var(--gold-grad); color: var(--accent-ink); font-weight: 700; font-size: 18px; }
.fly-user .who { min-width: 0; display: flex; flex-direction: column; line-height: 1.35; }
.fly-user .who b { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fly-user .who small { color: var(--muted); font-size: 12.5px; }
.fly.fly-sm { top: auto; }
.fly-list.fly-out { flex: none; }
.fly-list form { margin: 0; display: flex; }
.fly-list form button { flex: 1; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 0; border-radius: 12px; background: transparent; box-shadow: none;
  color: var(--bad); font-size: 14px; font-weight: 500; text-align: start; }
.fly-list form button:hover { background: var(--bad-soft); filter: none; }

/* الرأس: العنوانُ وتاريخُ اليوم، ثمّ الإشعاراتُ وأخبارُ الذهب والوضعُ و«فاتورة جديدة» */
.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topbar {
  display: flex; align-items: center; gap: 12px; min-height: 64px;
  padding: 6px 24px; background: var(--topbar-bg); backdrop-filter: blur(10px) saturate(1.1); -webkit-backdrop-filter: blur(10px) saturate(1.1);
  border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 10;
}
.tb-t { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.tb-t small { color: var(--muted); font-size: 12px; line-height: 1.4; }
.topbar h1 { font-size: 20px; line-height: 1.7; margin: 0; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar .date { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; }
.tb-acts { flex: none; display: flex; align-items: center; gap: 8px; }
.tb-btn { position: relative; width: 40px; height: 40px; padding: 0; display: grid; place-items: center; border-radius: 12px; cursor: pointer;
  background: var(--panel); border: 1px solid var(--line); color: var(--text); box-shadow: none; font-weight: 500; }
.tb-btn:hover { background: var(--gold-soft); filter: none; }
.tb-btn.active { color: var(--gold-dark); border-color: var(--gold); }
.tb-btn:focus-visible, .tb-cta:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 2px; }
.tb-cta { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 12px; white-space: nowrap;
  background: var(--molten); color: var(--accent-ink); font-weight: 700; font-size: 13.5px; box-shadow: 0 10px 24px rgba(198,138,36,.26); }
.tb-cta:hover { filter: brightness(1.05); }
/* زرُّ الوضع: الشمسُ في الداكن (يُبدّل إلى الفاتح) والقمرُ في الفاتح */
.th-sun { display: none; }
@media screen { :root[data-theme="dark"] .th-sun { display: block; } }
@media screen { :root[data-theme="dark"] .th-moon { display: none; } }
.menu-btn { display: none; }
.content { padding: 22px 24px; }

/* درجُ الهاتف: القائمةُ الكاملة بمجموعاتها وبحثها (الدفعة 48) بألوان الوضع */
.sidebar {
  width: 280px; flex-shrink: 0;
  background: var(--sidebar);
  color: var(--sidebar-text);
  display: flex; flex-direction: column;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
  border-inline-end: 1px solid var(--sidebar-line);
}
.sidebar::-webkit-scrollbar { width: 6px; }
.sidebar::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 3px; }
.brand { display: flex; align-items: center; gap: 12px; padding: 18px 18px 16px; border-bottom: 1px solid var(--sidebar-line); }
.brand img { width: 52px; height: 44px; object-fit: contain; filter: drop-shadow(0 3px 8px rgba(198,138,36,.35)); }
.brand b { display: block; font-size: 20px; font-weight: 700; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand small { color: var(--sidebar-mut); font-size: 12px; }
.sidebar .nav { padding: 10px 10px; flex: 1; }
.sidebar .nav a {
  display: flex; align-items: center; gap: 11px; padding: 9px 12px; margin: 2px 0;
  color: var(--sidebar-text); border-radius: 12px; font-size: 14.5px;
  transition: background .15s, color .15s;
}
.sidebar .nav a .ico { color: var(--sidebar-mut); transition: color .15s; }
.sidebar .nav a:hover { background: var(--gold-soft); }
.sidebar .nav a:hover .ico { color: var(--gold); }
.sidebar .nav a.active { background: var(--gold-grad); color: var(--accent-ink); font-weight: 700; }
.sidebar .nav a.active .ico { color: var(--accent-ink); }
.sidebar .nav .sep { margin: 16px 12px 6px; font-size: 11.5px; color: var(--sidebar-mut); letter-spacing: .3px; }
.userbox { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-top: 1px solid var(--sidebar-line); font-size: 13px; }
.userbox .avatar { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--gold-grad); color: var(--accent-ink); font-weight: 700; }
.userbox .who { flex: 1; min-width: 0; }
.userbox .who small { display: block; color: var(--sidebar-mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.userbox button { padding: 7px; color: var(--sidebar-text); border-color: transparent; background: transparent; box-shadow: none; }
.userbox button:hover { background: var(--gold-soft); filter: none; }

/* ---------- عناصر ---------- */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; margin-bottom: 20px; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; box-shadow: var(--shadow); position: relative; overflow: hidden; }
.card .label { color: var(--muted); font-size: 13px; }
.card .value { font-size: 22px; font-weight: 700; margin-top: 6px; }
.card .sub { color: var(--muted); font-size: 12px; margin-top: 4px; }
/* بطاقةُ المؤشّر (Stat) كمربّعات 15: التسميةُ ورمزُها في سطر، ثمّ الرقمُ كبيراً، ثمّ سطرُه */
.card.stat { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "l c" "v v" "s s"; align-content: start; gap: 6px 10px; }
.card.stat .chip { grid-area: c; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0; }
.card.stat .body { display: contents; }
.card.stat .label { grid-area: l; align-self: center; font-weight: 500; min-width: 0; }
.card.stat .value { grid-area: v; margin-top: 0; font-size: 24px; font-weight: 500; letter-spacing: -.2px; line-height: 1.25; min-width: 0; overflow-wrap: anywhere; }
.card.stat .sub { grid-area: s; margin-top: 0; }
.chip.gold { background: var(--c-gold-bg); color: var(--c-gold); }
.chip.green { background: var(--c-green-bg); color: var(--c-green); }
.chip.sea { background: var(--c-sea-bg); color: var(--c-sea); }
.chip.rose { background: var(--c-rose-bg); color: var(--c-rose); }
.chip.violet { background: var(--c-violet-bg); color: var(--c-violet); }
.chip.sand { background: var(--c-sand-bg); color: var(--c-sand); }

.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; margin-bottom: 18px; box-shadow: var(--shadow); }
.panel h2 { font-size: 16px; margin: 0 0 12px; display: flex; align-items: center; gap: 8px; }
.panel h2 .ico { color: var(--gold); }

/* لافتةٌ داكنةٌ في الوضعين (فحصُ الجاهزيّة) */
.hero {
  position: relative; overflow: hidden; border-radius: var(--radius-lg); padding: 22px 24px; margin-bottom: 20px; color: #f4e7c8;
  background: radial-gradient(120% 150% at 100% 0%, rgba(248,201,90,.20), transparent 55%), linear-gradient(120deg, #1d1a15, #0b0a09 72%);
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap; box-shadow: var(--shadow);
}
.hero img.logo { width: 80px; height: 67px; object-fit: contain; filter: drop-shadow(0 4px 12px rgba(212,162,60,.45)); }
.hero h2 { margin: 0; font-size: 22px; color: #fff; }
.hero p { margin: 4px 0 0; color: #cdbb94; }
.hero .grow { flex: 1; min-width: 220px; }
.hero .quick { display: flex; gap: 10px; flex-wrap: wrap; }
.hero .quick a {
  display: flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 12px; color: var(--accent-ink); font-weight: 700;
  background: var(--molten); box-shadow: 0 4px 14px rgba(212,162,60,.3);
}
.hero .quick a.alt { background: rgba(255,255,255,.08); color: #f4e7c8; box-shadow: none; border: 1px solid rgba(248,201,90,.3); }
.hero .quick a:hover { filter: brightness(1.07); }

.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-bottom: 14px; }
.field { display: flex; flex-direction: column; gap: 4px; }
.field label { font-size: 12px; color: var(--muted); }
input, select {
  font: inherit; padding: 8px 10px; border: 1px solid var(--line-2); border-radius: 10px;
  background: var(--input-bg); color: var(--text); min-width: 0;
}
input::placeholder { color: var(--faint); }
input:focus, select:focus { outline: 3px solid var(--focus); border-color: var(--gold); }
textarea { font: inherit; color: var(--text); background: var(--input-bg); border: 1px solid var(--line-2); border-radius: 10px; }
textarea:focus { outline: 3px solid var(--focus); border-color: var(--gold); }
button, .btn {
  font: inherit; cursor: pointer; border: 1px solid transparent; background: var(--gold-grad); font-weight: 700;
  color: var(--accent-ink); padding: 8px 16px; border-radius: 12px; display: inline-flex; align-items: center; gap: 7px;
  transition: filter .15s, background .15s, box-shadow .15s; box-shadow: 0 4px 12px rgba(198,138,36,.18);
}
button:hover, .btn:hover { filter: brightness(1.05) saturate(1.04); }
button.ghost, .btn.ghost { background: transparent; color: var(--text); border-color: var(--line-2); box-shadow: none; font-weight: 500; }
button.ghost:hover, .btn.ghost:hover { background: var(--gold-soft); filter: none; }
button:disabled { opacity: .5; cursor: default; filter: none; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; background: var(--panel); }
th, td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; }
th { background: var(--th-bg); font-weight: 700; font-size: 12.5px; color: var(--th-ink); position: sticky; top: 0; }
tr:hover td { background: var(--row-hover); }
tfoot td { font-weight: 700; background: var(--foot-bg); }
.table-wrap.panel { overflow: hidden; }
.muted { color: var(--muted); }
.ok { color: var(--ok); }
.bad { color: var(--bad); }
.badge { display: inline-block; padding: 2px 10px; border-radius: 20px; font-size: 12px; background: var(--gold-soft); color: var(--gold-dark); }
.badge.ok { background: var(--ok-soft); color: var(--ok); }
.badge.bad { background: var(--bad-soft); color: var(--bad); }
.badge.sea { background: var(--sea-soft); color: var(--sea); }
.alert { padding: 11px 14px; border-radius: 12px; background: var(--bad-soft); color: var(--bad); margin-bottom: 14px; white-space: pre-line; }
.alert.info { background: var(--gold-soft); color: var(--gold-dark); }
.pager { display: flex; gap: 8px; align-items: center; margin-top: 12px; }
.empty { text-align: center; padding: 34px 10px; color: var(--muted); }
.empty .ico { color: var(--faint); margin-bottom: 6px; }

/* ---------- الدخول: صورةُ الهويّة (سبائكُ المسرح) يميناً، وبطاقةُ الدخول على سطح الوضع ---------- */
.login-wrap { min-height: 100vh; display: grid; grid-template-columns: 1.1fr 1fr; background: var(--bg); }
.login-art { position: relative; isolation: isolate; background: #0b0b0c url('../img/login-gold.jpg') center / cover no-repeat; color: #f4e7c8; display: flex; align-items: flex-end; padding: 40px; }
.login-art::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8,8,9,0) 45%, rgba(8,8,9,.72)); }
.login-art .tag { background: rgba(14,14,15,.55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid rgba(248,201,90,.28); border-radius: 22px; padding: 18px 20px; max-width: 440px; }
.login-art .tag b { display: block; font-size: 22px; color: #fff; margin-bottom: 4px; }
.login-art .tag span { color: #d9c9a3; font-size: 14px; }
.login-side { position: relative; display: grid; place-items: center; padding: 24px 16px; }
.login-box { width: 100%; max-width: 400px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 28px 26px 20px; }
.login-box .logo { width: 104px; height: 88px; object-fit: contain; display: block; margin-bottom: 12px; filter: drop-shadow(0 6px 14px rgba(198,138,36,.35)); }
.login-box h1 { margin: 0 0 4px; font-size: 30px; font-weight: 700; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.login-box .field { margin-top: 16px; }
.login-box .field input, .login-box .field select { padding: 11px 12px; }
.login-box button { width: 100%; margin-top: 22px; padding: 12px; justify-content: center; font-size: 16px; font-weight: 700; background: var(--molten); border: none; box-shadow: 0 10px 24px rgba(198,138,36,.28); }
.login-box .foot { margin-top: 22px; color: var(--muted); font-size: 12.5px; display: flex; align-items: center; gap: 6px; }
.login-theme { position: absolute; top: 14px; inset-inline-end: 14px; z-index: 2; }
.login-box .login-theme { position: static; }

/* ---------- مستند للطباعة (فاتورة / سند) ---------- */
.doc { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 28px 30px; max-width: 900px; margin: 0 auto 18px; position: relative; overflow: hidden; }
.doc::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 6px; background: var(--gold-grad); }
.doc-head { display: flex; align-items: center; gap: 16px; padding-bottom: 16px; border-bottom: 2px solid var(--gold-soft); }
.doc-head img { width: 64px; height: 64px; object-fit: contain; }
.doc-head .co { flex: 1; }
.doc-head .co b { font-size: 20px; display: block; }
.doc-head .co span { color: var(--muted); font-size: 13px; }
.doc-head .kind { text-align: left; }
.doc-head .kind b { display: block; font-size: 22px; color: var(--gold-dark); }
.doc-head .kind span { font-size: 13px; color: var(--muted); }
.doc-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px 18px; margin: 18px 0; }
.doc-meta div small { display: block; color: var(--muted); font-size: 12px; }
.doc-meta div b { font-weight: 700; }
.amount-box { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; border: 1px dashed var(--gold); background: #fdf9ef; border-radius: 12px; padding: 14px 18px; margin: 14px 0; }
.amount-box .v { font-size: 28px; font-weight: 800; color: var(--gold-dark); }
.amount-box .words { flex: 1; min-width: 200px; color: #5a4a2c; }
.doc table th { position: static; }
.doc-foot { display: flex; gap: 20px; align-items: flex-end; margin-top: 24px; flex-wrap: wrap; }
.doc-foot .qr { width: 120px; height: 120px; border: 1px solid var(--line); border-radius: 8px; padding: 4px; }
.signs { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; min-width: 300px; }
.signs div { border-top: 1px solid #bfb39a; padding-top: 6px; text-align: center; color: var(--muted); font-size: 13px; }
.watermark { position: absolute; left: 50%; top: 55%; transform: translate(-50%,-50%); width: 320px; opacity: .04; pointer-events: none; }
.stamp { display: inline-block; border: 2px solid var(--ok); color: var(--ok); border-radius: 8px; padding: 2px 10px; font-weight: 800; transform: rotate(-6deg); }
.stamp.bad { border-color: var(--bad); color: var(--bad); }

/* ---------- الجوال ---------- */
@media (max-width: 900px) {
  .login-wrap { grid-template-columns: 1fr; }
  .login-art { min-height: 220px; padding: 20px; background-position: center 42%; }
  .login-art .tag { display: none; }
}
@media (min-width: 821px) {
  .sidebar { display: none; }
}
@media (max-width: 820px) {
  .dock, .fly, .fly-scrim { display: none !important; }
  .sidebar { position: fixed; inset: 0 0 0 auto; z-index: 20; transform: translateX(100%); transition: transform .2s; height: 100vh; }
  .shell.open .sidebar { transform: none; box-shadow: -4px 0 20px rgba(0,0,0,.3); }
  .menu-btn { display: inline-flex; padding: 7px; }
  .content { padding: 14px 16px; }
  .topbar { min-height: 56px; padding: 8px 14px; gap: 8px; }
  .tb-t small, .topbar .date { display: none; }
  .topbar h1 { font-size: 17px; }
  .tb-news { display: none; }
  .tb-cta { width: 40px; padding: 0; justify-content: center; }
  .tb-cta span { display: none; }
  .doc { padding: 18px 16px; }
  .signs { grid-template-columns: 1fr 1fr; min-width: 0; }
}

@media print {
  body { background: #fff; }
  .sidebar, .topbar, .toolbar, .pager, .no-print, .hero .quick, .dock, .fly, .fly-scrim, .login-theme { display: none !important; }
  .content { padding: 0; }
  .panel, .card, .doc { border: none; box-shadow: none; }
  .doc { max-width: none; padding: 0 4mm; }
  .doc::before { height: 4px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .amount-box, th, .badge, .stamp { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  @page { size: A4; margin: 12mm; }
}

/* ---------- الرسوم البيانية ---------- */
.chart { width: 100%; height: 220px; display: block; }
.hbars { display: flex; flex-direction: column; gap: 10px; }
.hbar { display: grid; grid-template-columns: minmax(90px, 160px) 1fr auto; gap: 10px; align-items: center; }
.hbar-label { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hbar-track { height: 12px; background: #f3eee3; border-radius: 6px; overflow: hidden; }
.hbar-fill { height: 100%; background: var(--gold-grad); border-radius: 6px; min-width: 2px; }
.hbar-fill.neg { background: #d9776a; }
.hbar-val { font-size: 13px; font-weight: 700; min-width: 90px; text-align: left; }
.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 18px; }
.grid-2 > .panel { margin-bottom: 0; }
.tabs { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; }
.tabs a { display: flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 10px; border: 1px solid var(--line); background: #fff; color: var(--text); }
.tabs a.active { background: var(--gold-grad); color: #1a150d; border-color: transparent; font-weight: 700; }
tr.clickable { cursor: pointer; }
td.pos { color: var(--ok); } td.neg { color: var(--bad); }

/* ---------- ملصقات الباركود ---------- */
.label-sheet { display: flex; flex-wrap: wrap; gap: 8px; }
.label-sheet .label { width: var(--lw); height: var(--lh); background: #fff; color: #000; border: 1px dashed #bbb; border-radius: 3px; padding: 1.2mm 1.6mm;
  display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; font-size: 2.2mm; line-height: 1.15; direction: rtl; }
.label .l-top, .label .l-bot { display: flex; justify-content: space-between; gap: 2mm; white-space: nowrap; }
.label .l-top b { font-size: 2.3mm; overflow: hidden; text-overflow: ellipsis; }
.label .l-name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.label .l-bar { flex: 1; min-height: 0; margin: .6mm 0; direction: ltr; }
.label .l-bar svg { width: 100%; height: 100%; display: block; }
@media print {
  .label-sheet.roll { display: block; gap: 0; }
  .label-sheet.roll .label { border: none; border-radius: 0; page-break-after: always; break-after: page; }
  .label-sheet.a4 { gap: 2mm; }
  .label-sheet.a4 .label { border: .2mm solid #ddd; }
  .label-sheet ~ * { display: none; }
}

/* ================= نموذج المستند بتصميم البرنامج المكتبي =================
   نفس ترتيب frmBillsCash: «بيانات الفاتورة» أعلى، ثم الأصناف يميناً و«الإجماليات» يساراً، ثم طرق الدفع،
   ثم شريط الأزرار (جديد/حفظ/تراجع/طباعة/التنقل)، ثم شريط الأوزان بالعيارات ورمز QR. */
/* الدفعة 50: ألوانُ النموذج متغيّراتٌ لكلّ وضع (الخزفيُّ والغرافيتيّ بذهب 15)، والهندسةُ والخطُّ كما كانا — فالخاناتُ والأعمدةُ بمقاساتها المقيسة */
.df {
  --df-bg: #f7f5f0; --df-title: linear-gradient(180deg, #fffefb, #f1ede4); --df-line: #e0d9cb; --df-line2: #d2c9b8; --df-in: #ffffff; --df-ro: #f3f0e8; --df-hl: #fff3d2;
  --df-group: #fbfaf7; --df-cap: #5e574b; --df-ink: #1d1a15; --df-th: linear-gradient(180deg, #faf8f3, #efeae0); --df-th-ink: #3f3a31; --df-th-line: #e4ddd0;
  --df-cell: #f0ece4; --df-hover: #fff3d2; --df-side: #efeae0; --df-bar: linear-gradient(180deg, #f4f1ea, #eae4d8); --df-bar-line: #d8d0bf;
  --df-btn: linear-gradient(180deg, #ffffff, #f3efe7); --df-btn-line: #d3cab8; --df-btn-hov: linear-gradient(180deg, #fff8e4, #f6d98f); --df-btn-hov-line: #c68a24;
  --df-tafkit: #7a5410; --df-wi: #7b7468; --df-entry: #fff8e1; --df-entry-hov: #fff0c4;
  --df-t-sale: #1d4ed8; --df-t-buy: #0f766e; --df-t-ret: #b45309; --df-t-out: #b91c1c;
  --df-new: #dcfce7; --df-new-ink: #166534; --df-view: #e0e7ff; --df-view-ink: #3730a3;
  background: var(--df-bg); border: 1px solid var(--df-line); border-radius: 14px; overflow: hidden; box-shadow: var(--shadow); font-size: 13.5px;
  font-family: var(--font-dense); line-height: normal; color: var(--text); }
@media screen { :root[data-theme="dark"] .df {
  --df-bg: #141416; --df-title: linear-gradient(180deg, #1e1e22, #18181b); --df-line: #2d2d33; --df-line2: #3c3c44; --df-in: #0f0f11; --df-ro: #1c1c20; --df-hl: #2d2512;
  --df-group: #18181b; --df-cap: #b3ac9e; --df-ink: #efe9dd; --df-th: linear-gradient(180deg, #222226, #1b1b1f); --df-th-ink: #e7dfcf; --df-th-line: #313137;
  --df-cell: #222226; --df-hover: #2d2512; --df-side: #1f1f23; --df-bar: linear-gradient(180deg, #1c1c1f, #141416); --df-bar-line: #2f2f35;
  --df-btn: linear-gradient(180deg, #2a2a2f, #202024); --df-btn-line: #3e3e46; --df-btn-hov: linear-gradient(180deg, #3b3120, #5c4820); --df-btn-hov-line: #c68a24;
  --df-tafkit: #f2c35c; --df-wi: #9b9589; --df-entry: #2a2412; --df-entry-hov: #3a3016;
  --df-t-sale: #93b4ff; --df-t-buy: #5fd4c4; --df-t-ret: #f2b45c; --df-t-out: #ff8f80;
  --df-new: rgba(111,211,157,.14); --df-new-ink: #7fdcab; --df-view: rgba(147,180,255,.14); --df-view-ink: #b3c6ff; } }
.df-title { display: flex; align-items: center; gap: 12px; padding: 6px 14px; background: var(--df-title); border-bottom: 1px solid var(--df-line); }
.df-title b { font-size: 24px; font-weight: 800; letter-spacing: .3px; }
.df-title .t-sale { color: var(--df-t-sale); } .df-title .t-buy { color: var(--df-t-buy); } .df-title .t-ret { color: var(--df-t-ret); } .df-title .t-out { color: var(--df-t-out); } .df-title .t-in { color: var(--df-t-sale); }
.df-title .state { margin-inline-start: auto; display: flex; gap: 8px; align-items: center; }
.df-group { border: 1px solid var(--df-line); border-radius: 8px; background: var(--df-group); margin: 8px; position: relative; padding: 14px 10px 8px; }
.df-group > .cap { position: absolute; top: -9px; inset-inline-start: 12px; background: var(--df-bg); padding: 0 6px; font-weight: 700; font-size: 12.5px; color: var(--df-cap); }
.df-rows { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 14px; }
.df-f { display: grid; grid-template-columns: 96px 1fr; align-items: center; gap: 6px; min-width: 0; }
.df-f > label { color: var(--df-cap); font-size: 12.5px; text-align: start; white-space: nowrap; }
.df-f > .v { display: flex; gap: 4px; min-width: 0; }
.df-f input, .df-f select, .df-f .ro { width: 100%; min-width: 0; padding: 4px 7px; border: 1px solid var(--df-line2); border-radius: 4px; background: var(--df-in); font-size: 13px; height: 28px; }
.df-f .ro { display: flex; align-items: center; background: var(--df-ro); color: var(--df-ink); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.df-f .ro.hl { background: var(--df-hl); font-weight: 700; }
.df-f.wide { grid-column: span 2; }
.df-body { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 0; }
.df-grid { margin: 8px; margin-inline-end: 0; background: var(--df-in); border: 1px solid var(--df-line); border-radius: 6px; overflow: auto; max-height: 360px; }
.df-grid table { font-size: 12.5px; background: var(--df-in); }
.df-grid th { background: var(--df-th); color: var(--df-th-ink); font-weight: 700; border-inline-start: 1px solid var(--df-th-line); padding: 6px 8px; position: sticky; top: 0; z-index: 1; }
.df-grid td { padding: 4px 8px; border-inline-start: 1px solid var(--df-cell); }
.df-grid tbody tr:nth-child(even) td { background: var(--df-group); }
.df-grid tbody tr:hover td { background: var(--df-hover); }
.df-grid td input { width: 100%; min-width: 70px; padding: 3px 5px; height: 26px; border: 1px solid var(--df-line2); border-radius: 3px; }
.df-under { display: flex; gap: 10px; align-items: center; margin: 0 8px 8px; margin-inline-end: 0; padding: 6px 8px; background: var(--df-group); border: 1px solid var(--df-line); border-top: none; border-radius: 0 0 6px 6px; flex-wrap: wrap; }
.df-under .df-f { grid-template-columns: auto 1fr; flex: 1; min-width: 220px; }
.df-totals { margin: 8px; border: 1px solid var(--df-line); border-radius: 8px; background: var(--df-group); padding: 14px 10px 10px; position: relative; align-self: start; }
.df-totals > .cap { position: absolute; top: -9px; inset-inline-start: 12px; background: var(--df-bg); padding: 0 6px; font-weight: 700; font-size: 12.5px; color: var(--df-cap); }
.df-totals .tr { display: grid; grid-template-columns: 1fr 110px; align-items: center; gap: 6px; margin-bottom: 5px; }
.df-totals .tr span { font-size: 12.5px; color: var(--df-cap); }
.df-totals .tr b { background: var(--df-in); border: 1px solid var(--df-line2); border-radius: 4px; padding: 3px 7px; text-align: left; font-weight: 600; font-variant-numeric: tabular-nums; direction: ltr; }
.df-totals .due { margin-top: 8px; background: var(--molten); color: var(--accent-ink); border-radius: 10px; padding: 8px 10px; text-align: center; box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 6px 16px rgba(198,138,36,.22); }
.df-totals .due small { display: block; color: rgba(42,23,0,.72); font-size: 11.5px; }
.df-totals .due b { font-size: 24px; font-variant-numeric: tabular-nums; direction: ltr; display: block; }
.df-pay { display: grid; grid-template-columns: 26px minmax(0, 1fr) 210px; margin: 0 8px 8px; border: 1px solid var(--df-line); border-radius: 6px; background: var(--df-in); }
.df-pay .side-cap { writing-mode: vertical-rl; transform: rotate(180deg); display: flex; align-items: center; justify-content: center; background: var(--df-side); font-weight: 700; font-size: 12px; color: var(--df-cap); }
.df-pay .grid { overflow: auto; max-height: 190px; }
.df-pay .comm { border-inline-start: 1px solid var(--df-line); padding: 8px; background: var(--df-group); }
.df-pay .comm .tr { display: grid; grid-template-columns: 1fr 90px; gap: 6px; margin-bottom: 5px; font-size: 12px; }
.df-pay .comm .tr b { background: var(--df-in); border: 1px solid var(--df-line2); border-radius: 4px; padding: 2px 6px; text-align: left; direction: ltr; }
.df-bar { display: flex; align-items: center; gap: 6px; padding: 7px 10px; background: var(--df-bar); border-top: 1px solid var(--df-bar-line); flex-wrap: wrap; }
.df-bar button, .df-bar .btn { height: 34px; padding: 0 14px; border-radius: 8px; font-size: 13.5px; font-weight: 500; background: var(--df-btn); color: var(--df-ink); border: 1px solid var(--df-btn-line); box-shadow: none; gap: 6px; }
.df-bar button:hover:not(:disabled), .df-bar .btn:hover { background: var(--df-btn-hov); border-color: var(--df-btn-hov-line); filter: none; }
.df-bar button.primary { background: var(--gold-grad); border-color: transparent; color: var(--accent-ink); font-weight: 700; box-shadow: 0 4px 12px rgba(198,138,36,.22); }
.df-bar button.nav { width: 38px; padding: 0; justify-content: center; font-size: 15px; }
.df-bar input.search { width: 110px; height: 34px; text-align: center; border: 1px solid var(--df-btn-line); border-radius: 8px; font-variant-numeric: tabular-nums; }
.df-bar .tafkit { flex: 1; min-width: 180px; color: var(--df-tafkit); font-weight: 700; font-size: 13px; text-align: center; }
.df-bar .jv { min-width: 64px; height: 34px; display: inline-flex; align-items: center; justify-content: center; gap: 4px; border: 1px solid var(--df-btn-line); border-radius: 8px; background: var(--df-in); color: var(--df-ink); font-weight: 700; }
.df-weights { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)) 110px; gap: 6px 10px; padding: 8px 10px; background: var(--df-group); border-top: 1px solid var(--df-line); align-items: end; }
.df-weights .w small { display: block; font-size: 11.5px; color: var(--df-cap); margin-bottom: 3px; white-space: nowrap; }
.df-weights .w div { display: flex; gap: 3px; }
.df-weights .w b, .df-weights .w i { background: var(--df-in); border: 1px solid var(--df-line2); border-radius: 4px; padding: 3px 6px; font-style: normal; font-variant-numeric: tabular-nums; direction: ltr; text-align: center; }
.df-weights .w b { flex: 1; font-weight: 700; } .df-weights .w i { width: 34px; color: var(--df-wi); font-size: 12px; }
.df-weights .qr { grid-row: span 1; width: 96px; height: 96px; border: 1px solid var(--df-line); background: #fff; justify-self: end; margin-top: -60px; }
.df-mode { font-size: 12px; padding: 3px 10px; border-radius: 12px; font-weight: 700; }
.df-mode.new { background: var(--df-new); color: var(--df-new-ink); } .df-mode.view { background: var(--df-view); color: var(--df-view-ink); }
.df-msg { margin: 8px; }
@media (max-width: 1100px) { .df-rows { grid-template-columns: repeat(2, minmax(0, 1fr)); } .df-weights { grid-template-columns: repeat(4, minmax(0, 1fr)); } .df-weights .qr { margin-top: 0; } }
@media (max-width: 820px) {
  .df-body { grid-template-columns: minmax(0, 1fr); } /* لا يمدّ الجدولُ العمودَ خارج الشاشة — يتمرّر داخل إطاره */ .df-grid, .df-under { margin-inline-end: 8px; }
  .df-rows { grid-template-columns: 1fr; } .df-pay { grid-template-columns: 22px 1fr; } .df-pay .comm { display: none; }
  .df-f.wide { grid-column: auto; } /* عمود واحد على الجوال: الحقل العريض لا يولّد عموداً ضمنياً يعصر الحقول */
  .df-bar .tafkit { order: 10; flex-basis: 100%; }
}
@media print { .df { border: none; box-shadow: none; background: #fff; } .df-bar { display: none !important; } }

/* عنوانٌ يظهر في الطباعة وحدها */
.print-only { display: none; }
@media print { .print-only { display: block; } }

/* ===== أسعار الذهب المباشرة — الشاشة الرئيسيّة (GoldTicker) ===== */
/* الدفعة 50: مربّعُ «الذهب السائل» في التصميم 15 — ذهبٌ منصهرٌ بحبرٍ داكن في الوضعين، وصورةُ سبائك يساراً،
   والأونصةُ كبيرةً بتغيّرها ومداها ورسمِ حركتها، والعياراتُ الأربعةُ رقائقُ زجاجيّة؛ والصعودُ أخضرُ داكن والهبوطُ أحمرُ داكن ليُقرآ على الذهب.
   الدفعة 51 (اختيارُ المالك 2026-10-16): صورةُ سبائك من Pexels (gold-hero.jpg) بدل gold-bars.jpg.
   الدفعة 52 (طلبُ المالك 2026-10-16 «غير الصورة الى شعار بحر الذهب»): شعارُ بحر الذهب (bahr-logo.png — شعارُ الشريط والدخول نفسُه) بوهجٍ ذهبيّ
   على لافتةٍ داكنةٍ بنقش الهويّة (pattern.svg بمزج soft-light كترويسة الوردية)؛ وحُذفت gold-hero.jpg. الشعارُ في ‎::after‎ ليأخذ ظلُّ ‎drop-shadow‎ شكلَه. */
.gold-live { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--radius-lg); padding: 18px 20px 14px; margin-bottom: 20px; color: var(--accent-ink);
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "head photo" "ounce photo" "karats karats" "foot foot"; gap: 12px 18px;
  background: var(--molten); box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 22px 46px rgba(198,138,36,.22); }
.gold-live::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(160deg, rgba(255,255,255,.42), rgba(255,255,255,0) 38%), radial-gradient(40% 30% at 85% 15%, rgba(255,255,255,.5), rgba(255,255,255,0) 70%); }
.gold-live .gl-photo { grid-area: photo; position: relative; overflow: hidden; display: block; min-height: 150px; border-radius: 20px;
  background: radial-gradient(60% 70% at 50% 48%, rgba(248,201,90,.22), rgba(248,201,90,0) 72%), url('../img/pattern.svg') 0 0 / 64px 64px repeat,
    linear-gradient(135deg, #2a2113, #0e0b07 72%);
  background-blend-mode: normal, soft-light, normal; box-shadow: inset 0 0 0 1px rgba(255,255,255,.35), 0 12px 26px rgba(110,60,0,.32); }
.gold-live .gl-photo::after { content: ''; position: absolute; inset: 13% 12%; pointer-events: none;
  background: url('../img/bahr-logo.png') 50% 50% / contain no-repeat; filter: drop-shadow(0 6px 16px rgba(212,162,60,.45)); }
.gold-live .gl-body { display: contents; }
.gold-live .gl-head { grid-area: head; display: flex; align-items: center; justify-content: space-between; gap: 6px 10px; flex-wrap: wrap; align-self: start; }
.gold-live .gl-title { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.gold-live .gl-title b { font-size: 16px; font-weight: 700; color: var(--accent-ink); }
.gold-live .gl-src { font-size: 12px; color: rgba(42,23,0,.7); }
.gold-live .gl-time { font-size: 12px; color: rgba(42,23,0,.72); font-variant-numeric: tabular-nums; }
.gold-live .gl-dot { width: 9px; height: 9px; border-radius: 50%; background: rgba(42,23,0,.35); flex-shrink: 0; }
.gold-live .gl-dot.on { background: #1e6b3f; animation: gl-pulse 2s infinite; }
@keyframes gl-pulse { 0% { box-shadow: 0 0 0 0 rgba(30,107,63,.5); } 70% { box-shadow: 0 0 0 9px rgba(30,107,63,0); } 100% { box-shadow: 0 0 0 0 rgba(30,107,63,0); } }
@media (prefers-reduced-motion: reduce) { .gold-live .gl-dot.on { animation: none; } }
.gold-live .gl-ounce { grid-area: ounce; min-width: 0; align-self: end; }
.gold-live .gl-cap { font-size: 13px; color: rgba(42,23,0,.72); }
.gold-live .gl-big { font-size: 46px; font-weight: 700; line-height: 1.12; letter-spacing: -1px; color: #1f1100; margin-top: 2px; transition: color .6s; direction: ltr; text-align: right; }
.gold-live .gl-arrow { font-size: 16px; margin-inline-start: 8px; vertical-align: middle; }
.gold-live.up .gl-big, .gold-live.up .gl-arrow { color: #135c33; }
.gold-live.down .gl-big, .gold-live.down .gl-arrow { color: #8a1f12; }
.gold-live .gl-chg, .gold-live .gl-range { font-size: 12px; color: rgba(42,23,0,.75); margin-top: 3px; }
.gold-live .gl-spark { width: 100%; height: 38px; margin-top: 8px; display: block; }
.gold-live .gl-spark .area { fill: rgba(42,23,0,.11); }
.gold-live .gl-spark .line { fill: none; stroke: #2a1700; stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.gold-live .gl-karats { grid-area: karats; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.gold-live .gl-k { padding: 9px 12px 8px; border-radius: 16px; min-width: 0; background: rgba(255,255,255,.28); border: 1px solid rgba(255,255,255,.48);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); box-shadow: inset 0 1px 0 rgba(255,255,255,.4); }
.gold-live .gl-kname { font-size: 12.5px; color: rgba(42,23,0,.76); font-weight: 700; }
.gold-live .gl-kprice { font-size: 22px; font-weight: 700; color: #1f1100; margin-top: 2px; transition: color .6s; line-height: 1.2; }
.gold-live.up .gl-kprice { color: #135c33; }
.gold-live.down .gl-kprice { color: #8a1f12; }
.gold-live .gl-kunit { font-size: 10.5px; color: rgba(42,23,0,.62); margin-top: 2px; }
.gold-live .gl-foot { grid-area: foot; font-size: 11px; color: rgba(42,23,0,.66); line-height: 1.6; }
.gold-live .gl-empty { grid-area: ounce; color: rgba(42,23,0,.78); padding: 10px 0; }
@media (max-width: 900px) {
  .gold-live { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "ounce" "photo" "karats" "foot"; }
  .gold-live .gl-photo { min-height: 130px; }
  .gold-live .gl-karats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 380px) { .gold-live { padding: 14px 14px 10px; } .gold-live .gl-kprice { font-size: 19px; } .gold-live .gl-big { font-size: 34px; } }

/* ═══ نقطة البيع — «صالة العرض» (frmPOS 2000، التخطيط p22 ومعالجة الشعار q02 باختيار المالك) ═══
   المقاساتُ منقولةٌ من frmPOS.UI.vb حرفاً: المرجع 1180×720 — عمودٌ يمين 262 (علامة 104 · وردية 214 · بائعون)،
   وجسمٌ يسار (ترويسة 60 · ستّ بطاقات 2×3 · ثماني عشرة بلاطة 3×6 والأولى في أقصى اليمين).
   الدفعة 50: الألوانُ ألوانُ التصميم 15 بوضعين — صالةٌ غرافيتيّةٌ دافئة في الداكن، وخزفيّةٌ مضيئة في الفاتح، والذهبُ المنصهرُ لهما —
   والهندسةُ والخطُّ (تجوّل) كما كانا. */
.pos-hall, .pos-modal, .pos-appbar, .login-wrap.pos {
  --ui-deep: #efe9dd; --ui-mid: #f7f3ea; --ui-hall: #fffdf8; --ui-gold: #c68a24; --ui-gold-lt: #9a6512; --ui-gold-pl: #8f5f12;
  --ui-paper: #1d1a15; --ui-ink: #2a251d; --ui-ink2: #3a342a; --ui-mut: #7b7468; --ui-mut2: #8a8274; --ui-mut3: #847c6e;
  --ui-steel: #5e574b; --ui-stat: #4e483e; --ui-date: #5e574b; --ui-date2: #8a8274; --ui-cash: #1f8a55; --ui-net: #2b5ea8; --ui-conv: #b3412f;
  --h-glass: linear-gradient(180deg, rgba(255,255,255,.80), rgba(250,247,241,.92)); --h-glass-line: rgba(120,95,40,.16);
  --h-glass-sh: 0 6px 18px rgba(80,60,20,.08), inset 0 1px 0 rgba(255,255,255,.9);
  --h-vig: linear-gradient(300deg, rgba(160,130,70,.10) 0%, rgba(255,255,255,0) 48%, rgba(160,130,70,.06) 100%),
           radial-gradient(ellipse 115% 125% at 22% 38%, rgba(255,255,255,0) 0%, rgba(160,130,70,.04) 35%, rgba(150,120,60,.10) 62%, rgba(150,120,60,.10) 100%);
  --h-glow: rgba(224,168,58,.16); --h-wm: .08;
  --h-tile: linear-gradient(180deg, #ffffff, #f7f3ea); --h-tile-hov: linear-gradient(180deg, #fffaf0, #f8ecd0); --h-tile-line: rgba(120,95,40,.18);
  --h-tile-sh: 0 4px 12px rgba(80,60,20,.08), inset 0 1px 0 #ffffff; --h-ci-ink: #8f5f12;
  --h-rank: linear-gradient(180deg, #ece6da, #d9d1c1); --h-rank-ink: #3a342a; --h-track: rgba(80,60,20,.10);
  --h-menu: #ffffff; --h-scrim: rgba(29,26,21,.38); --h-btn-bg: rgba(80,60,20,.05); --h-btn-line: rgba(80,60,20,.18); --h-line: rgba(80,60,20,.14); --h-line2: rgba(80,60,20,.08);
  --h-red-ink: #a3362a; --h-red-ink2: #8a1f12; --h-warn-ink: #8a5a0f; --h-bad-ink: #a3362a; --h-err-ink: #8a1f12;
  --h-input: #ffffff; --h-th: #f6f1e6; --h-box: linear-gradient(180deg, rgba(255,255,255,.92), rgba(250,247,241,.96));
  --h-field-bg: #ffffff; --h-field-ink: #1d1a15; --h-bar: rgba(255,255,255,.86); --h-bar-line: rgba(120,95,40,.22);
}
@media screen { :root[data-theme="dark"] :is(.pos-hall, .pos-modal, .pos-appbar, .login-wrap.pos) {
  --ui-deep: #0b0b0c; --ui-mid: #18171a; --ui-hall: #2b2416; --ui-gold: #e0a83a; --ui-gold-lt: #f8d27a; --ui-gold-pl: #fbe3a6;
  --ui-paper: #f6f1e6; --ui-ink: #f1ece2; --ui-ink2: #e7e0d3; --ui-mut: #aaa294; --ui-mut2: #9c9486; --ui-mut3: #aca495;
  --ui-steel: #d6cfc1; --ui-stat: #ddd6c8; --ui-date: #cfc8ba; --ui-date2: #9c9586; --ui-cash: #8ee0b2; --ui-net: #a8ccf8; --ui-conv: #f7c0b6;
  --h-glass: linear-gradient(180deg, rgba(34,32,28,.62), rgba(14,13,12,.76)); --h-glass-line: rgba(255,255,255,.12);
  --h-glass-sh: 0 6px 18px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.12);
  --h-vig: linear-gradient(300deg, rgba(4,4,5,.44) 0%, rgba(8,8,9,.05) 48%, rgba(8,8,9,.30) 100%),
           radial-gradient(ellipse 115% 125% at 22% 38%, rgba(8,8,9,0) 0%, rgba(8,8,9,.14) 35%, rgba(4,4,5,.40) 62%, rgba(4,4,5,.40) 100%);
  --h-glow: rgba(224,168,58,.18); --h-wm: .14;
  --h-tile: linear-gradient(180deg, rgba(38,36,32,.9), rgba(14,13,12,.96)); --h-tile-hov: linear-gradient(180deg, rgba(60,54,42,.92), rgba(20,18,15,.97)); --h-tile-line: rgba(255,255,255,.16);
  --h-tile-sh: 0 4px 12px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.16); --h-ci-ink: #f8e3b0;
  --h-rank: linear-gradient(180deg, #5c574e, #3a3630); --h-rank-ink: #f1ece2; --h-track: rgba(255,255,255,.10);
  --h-menu: #141416; --h-scrim: rgba(4,4,5,.62); --h-btn-bg: rgba(255,255,255,.06); --h-btn-line: rgba(255,255,255,.18); --h-line: rgba(255,255,255,.14); --h-line2: rgba(255,255,255,.07);
  --h-red-ink: #f2bdb5; --h-red-ink2: #ffd6cf; --h-warn-ink: #ffd9a6; --h-bad-ink: #ffb9ae; --h-err-ink: #ffd6cf;
  --h-input: #0f0f11; --h-th: #1d1c1a; --h-box: linear-gradient(180deg, rgba(34,32,28,.78), rgba(14,13,12,.88));
  --h-field-bg: #f6f1e6; --h-field-ink: #141210; --h-bar: rgba(14,14,15,.86); --h-bar-line: rgba(224,168,58,.42);
} }
/* الصالةُ لا تقصّ ما يفيض منها (اللوحات المنسدلة تتجاوز حدودها)؛ القصُّ لطبقة الماسة وحدها (.pos-clip) */
.pos-hall {
  --glass: var(--h-glass);
  position: relative; isolation: isolate; direction: rtl; color: var(--ui-ink); font-family: var(--font-dense); line-height: normal;
  display: grid; grid-template-columns: 262px minmax(0, 1fr); gap: 10px 12px; padding: 14px;
  min-height: calc(100vh - 118px); border-radius: 22px; background: var(--ui-deep); outline: none;
}
.pos-hall:focus-visible { box-shadow: 0 0 0 2px var(--ui-gold); }
.pos-hall::before {
  content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none; border-radius: inherit;
  background:
    radial-gradient(ellipse 80% 106% at 34% 46%, var(--ui-hall) 0%, var(--ui-mid) 52%, var(--ui-deep) 100%);
}
.pos-hall .pos-clip { position: absolute; inset: 0; z-index: -1; overflow: hidden; border-radius: inherit; pointer-events: none; }
.pos-hall::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; border-radius: inherit;
  background: var(--h-vig),
    radial-gradient(ellipse 27% 40% at 80.51% 69.44%, var(--h-glow) 0%, rgba(224,168,58,.055) 67.6%, rgba(224,168,58,0) 100%);
}
/* الماسة: الشعار علامةً مائيّة — مربّعٌ ضلعه 1.676 × القامة ومركزه (0.7636 من العرض ، 0.6619 من القامة)؛ ولوحةُ رسم المكتبي مستقيمةُ الإحداثيات (frmPOS.UI.vb:277) فالعرضُ من اليسار: خلف العمود اليمين */
.pos-hall .pos-diamond {
  position: absolute; pointer-events: none; aspect-ratio: 1; height: 167.6%; left: 76.36%; top: 66.19%;
  transform: translate(-50%, -50%); background: url('../img/bahr-logo.png') center / contain no-repeat; opacity: var(--h-wm);
}
.pos-hall .glass {
  background: var(--glass); border: 1px solid var(--h-glass-line); border-radius: 28px; position: relative;
  box-shadow: var(--h-glass-sh);
}
.pos-hall .pos-rail { display: grid; grid-template-rows: 104px 214px minmax(120px, 1fr); gap: 10px; min-width: 0; }
.pos-hall .pos-body { display: grid; grid-template-rows: 60px minmax(140px, 29%) minmax(150px, 1fr); gap: 10px; min-width: 0; }

/* العلامة: قضيبٌ ذهبيٌّ عند الحافة اليمنى، وشعارٌ بهالة، والعنوان وسطرُ الفرع والاختصارات */
.pos-hall .pos-brand { display: flex; align-items: center; gap: 12px; padding: 0 14px; overflow: hidden; }
.pos-hall .pos-brand::before { content: ""; position: absolute; right: 2px; top: 14px; bottom: 14px; width: 3px; border-radius: 3px;
  background: linear-gradient(180deg, var(--ui-gold), #f8d27a, var(--ui-gold)); }
.pos-hall .pos-logo { width: 52px; height: 52px; flex: none; object-fit: contain;
  background: radial-gradient(circle at 50% 58%, rgba(224,168,58,.40) 0%, rgba(224,168,58,.12) 55%, rgba(224,168,58,0) 100%); border-radius: 50%; }
.pos-hall .pos-ttl { font-size: 24px; font-weight: 800; color: var(--ui-paper); line-height: 1.25; }
.pos-hall .pos-sub { font-size: 11.7px; color: var(--ui-mut3); margin-top: 4px; line-height: 1.5; }
.pos-hall .pos-sub .keys { display: block; color: var(--ui-mut2); }

/* الوردية: لافتة، وزرّان (الفتح ذهبيٌّ منصهرٌ بنقطة حالة، والإغلاق أحمرُ خافت)، وصندوقُ الحالة بإطارٍ أخضرَ أو أحمر */
.pos-hall .pos-shift { display: flex; flex-direction: column; gap: 9px; padding: 11px 12px 12px; }
.pos-hall .pos-lab { font-size: 11.3px; color: var(--ui-mut2); height: 18px; }
.pos-hall .pos-shbtn { height: 40px; border-radius: 20px; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 9px; box-shadow: none; }
.pos-hall .pos-shbtn.open { color: var(--accent-ink); border: 1px solid rgba(255,255,255,.55); background: var(--molten); box-shadow: 0 4px 12px rgba(120,70,0,.25); }
.pos-hall .pos-shbtn.open:hover { filter: brightness(1.06); }
.pos-hall .pos-shbtn.close { color: var(--h-red-ink); border: 1px solid rgba(179,57,46,.65); background: rgba(179,57,46,.14); }
.pos-hall .pos-shbtn.close:hover { background: rgba(179,57,46,.26); border-width: 1.6px; filter: none; }
.pos-hall .pos-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.pos-hall .pos-dot.on { background: #3ed07f; box-shadow: 0 0 0 3px rgba(62,208,127,.38); animation: pos-pulse 4s steps(4) infinite; }
.pos-hall .pos-dot.off { background: #d65c4e; box-shadow: 0 0 0 3px rgba(214,92,78,.38); animation: pos-pulse 4s steps(4) infinite; }
@keyframes pos-pulse { 0% { box-shadow: 0 0 0 3px rgba(255,255,255,.0); } 50% { box-shadow: 0 0 0 5px rgba(255,255,255,.12); } 100% { box-shadow: 0 0 0 3px rgba(255,255,255,0); } }
.pos-hall .pos-state { flex: 1; display: flex; align-items: center; border-radius: 18px; padding: 6px 10px; font-size: 12.7px; color: var(--ui-stat); line-height: 1.55; min-height: 28px; }
.pos-hall .pos-state.on { background: rgba(30,107,71,.16); border: 1px solid rgba(62,208,127,.35); }
.pos-hall .pos-state.off { background: rgba(179,57,46,.14); border: 1px solid rgba(179,57,46,.45); }

/* البائعون: «البائعون» يميناً، والإجماليّ يساراً بلفظه، ثمّ ستّة صفوفٍ مرقّمة بشريط نسبةٍ ذهبيٍّ يمتدّ من اليمين */
.pos-hall .pos-sellers { padding: 10px 12px 12px; overflow: hidden; display: flex; flex-direction: column; }
.pos-hall .pos-sellers header { display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 22px; }
.pos-hall .pos-sellers .t { font-size: 13.3px; font-weight: 800; color: var(--ui-gold-lt); }
.pos-hall .pos-sellers .tot { font-size: 11.3px; color: var(--ui-gold-pl); direction: rtl; white-space: nowrap; }
.pos-hall .pos-sellers .tot small { color: var(--ui-mut2); font-size: 11.3px; margin-inline-start: 6px; }
.pos-hall .pos-sellers hr { border: 0; border-top: 1px solid rgba(224,168,58,.30); margin: 9px 0 12px; }
.pos-hall .pos-seller { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 10px; align-items: start; height: 34px; margin-bottom: 10px; }
.pos-hall .pos-rank { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: var(--h-rank-ink);
  background: var(--h-rank); }
.pos-hall .pos-rank.first { color: var(--accent-ink); background: var(--gold-grad); }
.pos-hall .pos-srow { display: flex; justify-content: space-between; gap: 8px; height: 20px; align-items: center; }
.pos-hall .pos-sname { font-size: 13px; color: var(--ui-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pos-hall .pos-sval { font-size: 14.7px; font-weight: 800; color: var(--ui-gold-lt); direction: ltr; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pos-hall .pos-bar { height: 6px; border-radius: 6px; background: var(--h-track); margin-top: 3px; display: flex; justify-content: flex-start; }
.pos-hall .pos-bar i { display: block; height: 6px; border-radius: 6px; min-width: 10px; background: linear-gradient(270deg, #a8650f, #f8d27a); }
.pos-hall .pos-none { flex: 1; display: grid; place-items: center; color: var(--ui-mut2); font-size: 13px; }

/* الترويسة: «صالة العرض» ذهبياً والوصف يميناً، والساعة والتاريخان يساراً */
.pos-hall .pos-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 16px; overflow: hidden; }
.pos-hall .pos-hallname { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pos-hall .pos-hallname b { color: var(--ui-gold-lt); font-size: 14.7px; }
.pos-hall .pos-hallname span { color: var(--ui-steel); font-size: 14px; }
.pos-hall .pos-time { display: flex; align-items: center; gap: 20px; direction: ltr; }
.pos-hall .pos-clock { font-size: 26px; font-weight: 800; color: var(--ui-gold-pl); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pos-hall .pos-dates { display: flex; flex-direction: column; font-size: 12px; line-height: 1.6; direction: rtl; text-align: left; white-space: nowrap; }   /* السطرُ الميلاديّ والهجريّ لا ينكسران في عرض الهاتف («م» و«هـ» مع تاريخهما) */
.pos-hall .pos-dates .g { color: var(--ui-date); }
.pos-hall .pos-dates .h { color: var(--ui-date2); }

/* البطاقات الستّ: صفّان × ثلاثة من اليمين إلى اليسار، بشريط لونٍ على الحافة اليمنى */
.pos-hall .pos-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 9px; min-height: 0; }
.pos-hall .pos-kpi { border-radius: 26px; padding: 8px 14px 8px 16px; overflow: hidden; display: flex; flex-direction: column; min-width: 0; }
.pos-hall .pos-kpi::before { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 4px; background: linear-gradient(180deg, var(--bar-a), var(--bar-b)); }
.pos-hall .pos-kpi .k { font-size: 12px; color: var(--ui-mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pos-hall .pos-kpi .v { flex: 1; display: flex; align-items: center; justify-content: flex-end; direction: ltr; font-weight: 800; color: var(--val);
  font-size: clamp(16px, 2.2vw, 25px); white-space: nowrap; overflow: hidden; font-variant-numeric: tabular-nums; }
.pos-hall .pos-kpi.cash { --bar-a: #49c48a; --bar-b: #1e6b47; --val: var(--ui-cash); }
.pos-hall .pos-kpi.net { --bar-a: #7fb0f0; --bar-b: #2b4e8f; --val: var(--ui-net); }
.pos-hall .pos-kpi.gold { --bar-a: #f8d27a; --bar-b: #a8650f; --val: var(--ui-gold-pl); }
.pos-hall .pos-kpi.eq { --bar-a: #e58a7e; --bar-b: #b3392e; --val: var(--ui-conv); }

/* البلاطات: ثلاثة صفوف × ستّة أعمدة — رمزٌ في دائرةٍ فوق العنوان، وبلاطتا التقارير ذهبيّتان منصهرتان */
.pos-hall .pos-tiles { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 8px; min-height: 0; }
.pos-hall .pos-tile {
  font: inherit; cursor: pointer; border-radius: 24px; min-width: 0; min-height: 58px; padding: 6px 4px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  color: var(--ui-ink); border: 1px solid var(--h-tile-line);
  background: var(--h-tile); box-shadow: var(--h-tile-sh);
}
.pos-hall .pos-tile:hover, .pos-hall .pos-tile:focus-visible { color: var(--ui-gold-pl); border-color: rgba(224,168,58,.78);
  background: var(--h-tile-hov); outline: none; filter: none; }
.pos-hall .pos-tile .ci { width: clamp(24px, 3vw, 38px); height: clamp(24px, 3vw, 38px); border-radius: 50%; display: grid; place-items: center; flex: none;
  background: rgba(224,168,58,.16); border: 1px solid rgba(224,168,58,.42); color: var(--h-ci-ink); }
.pos-hall .pos-tile .cap { font-size: 12.7px; font-weight: 800; line-height: 1.35; text-align: center; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.pos-hall .pos-tile.rep { color: var(--accent-ink); border: 1.5px solid rgba(255,248,220,.9); background: var(--molten); }
.pos-hall .pos-tile.rep:hover, .pos-hall .pos-tile.rep:focus-visible { color: var(--accent-ink); border: 2.2px solid #fff3c4; background: var(--molten); filter: brightness(1.06); }
.pos-hall .pos-tile.rep .ci { background: rgba(42,23,0,.12); border-color: rgba(42,23,0,.32); color: var(--accent-ink); }
.pos-hall .pos-tile.rep .cap { font-size: 13.3px; }
.pos-hall .pos-tile-wrap { position: relative; min-width: 0; display: grid; }

/* اللوحة المنسدلة (PosMenu): بطاقةٌ مستديرة بترويسةٍ وخطٍّ ذهبيّ ومجموعاتٍ معنونة، لكلّ بندٍ رمزٌ وسطرُ وصف */
.pos-hall .pos-menu { position: absolute; z-index: 20; top: calc(100% + 6px); right: 0; width: min(380px, 86vw); max-height: 70vh; overflow: auto;
  background: var(--h-menu); border: 1px solid rgba(224,168,58,.45); border-radius: 18px; box-shadow: 0 14px 40px rgba(0,0,0,.35); padding: 8px 0; text-align: right; }
.pos-hall .pos-menu.up { top: auto; bottom: calc(100% + 6px); }
.pos-hall .pos-menu.left { right: auto; left: 0; }
.pos-hall .pos-menu .mt { color: var(--ui-gold-lt); font-weight: 800; font-size: 14px; padding: 6px 14px 8px; border-bottom: 2px solid var(--ui-gold); margin-bottom: 4px; }
.pos-hall .pos-menu .mh { color: var(--ui-mut2); font-size: 11.5px; padding: 8px 14px 3px; letter-spacing: .02em; }
.pos-hall .pos-menu button { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 10px; width: 100%; padding: 7px 14px; align-items: center; }
.pos-hall .pos-menu button:hover, .pos-hall .pos-menu button:focus-visible { background: rgba(224,168,58,.12); }
.pos-hall .pos-menu .mi { color: var(--ui-gold-lt); display: grid; place-items: center; }
.pos-hall .pos-menu .mc { color: var(--ui-ink); font-size: 13px; font-weight: 700; }
.pos-hall .pos-menu .md { display: block; color: var(--ui-mut); font-size: 11.5px; margin-top: 2px; font-weight: 400; }

/* رسالةُ الشاشة (MsgBox المكتبي): فوق الصفحة كلّها، يمينيّةٌ، وزرُّ «لا» افتراضيٌّ في سؤال الإغلاق */
.pos-modal { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; background: var(--h-scrim); padding: 16px; direction: rtl; font-family: var(--font-dense); line-height: normal; }
.pos-modal .box { width: min(520px, 100%); background: var(--h-menu); border: 1px solid rgba(224,168,58,.5); border-radius: 20px; box-shadow: 0 18px 50px rgba(0,0,0,.45); padding: 16px 18px; }
.pos-modal .ttl { color: var(--ui-gold-lt); font-weight: 800; font-size: 15px; margin-bottom: 8px; }
.pos-modal .msg { white-space: pre-line; color: var(--ui-ink); font-size: 14px; line-height: 1.7; }
.pos-modal .msg.warn { color: var(--h-warn-ink); }
.pos-modal .msg.bad { color: var(--h-bad-ink); }
.pos-modal .act { display: flex; gap: 8px; justify-content: flex-start; margin-top: 14px; }
.pos-modal .act button { font: inherit; font-weight: 700; border-radius: 12px; padding: 8px 18px; cursor: pointer; border: 1px solid var(--h-btn-line); background: var(--h-btn-bg); color: var(--ui-ink); box-shadow: none; }
.pos-modal .act button:hover { filter: none; background: rgba(224,168,58,.12); }
.pos-modal .act button.prim { background: var(--molten); color: var(--accent-ink); border-color: rgba(255,255,255,.55); }
.pos-modal .act button:focus-visible { outline: 2px solid var(--ui-gold-lt); outline-offset: 2px; }
.pos-hall .pos-err { grid-column: 1 / -1; background: rgba(179,57,46,.14); border: 1px solid rgba(179,57,46,.5); color: var(--h-err-ink); border-radius: 14px; padding: 8px 12px; white-space: pre-line; font-size: 13px; }

@media (max-width: 1100px) { .pos-hall .pos-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  /* اللوحة المنسدلة ورقةٌ سفليّة: ترتيبُ البلاطات يتغيّر بالعرض فلا يصلح ربطُها بطرف البلاطة */
  .pos-hall .pos-menu, .pos-hall .pos-menu.up, .pos-hall .pos-menu.left { position: fixed; top: auto; bottom: 16px; left: 16px; right: 16px; width: auto; max-height: 70vh; }
  .pos-hall { grid-template-columns: 1fr; min-height: 0; }
  .pos-hall .pos-rail { grid-template-rows: auto; grid-template-columns: 1fr 1fr; }
  .pos-hall .pos-rail .pos-brand { min-height: 96px; }
  .pos-hall .pos-rail .pos-sellers { grid-column: 1 / -1; order: 9; }
  .pos-hall .pos-body { grid-template-rows: auto auto auto; }
  .pos-hall .pos-kpis { grid-auto-rows: 86px; }
  .pos-hall .pos-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 86px; }
}
@media (max-width: 560px) {
  .pos-hall { padding: 10px; border-radius: 16px; }
  .pos-hall .pos-rail { grid-template-columns: 1fr; }
  .pos-hall .pos-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pos-hall .pos-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pos-hall .pos-top { flex-direction: column; align-items: flex-start; justify-content: center; padding: 8px 14px; height: auto; }
  .pos-hall .pos-body { grid-template-rows: auto auto auto; }
}
@media (prefers-reduced-motion: reduce) { .pos-hall .pos-dot.on, .pos-hall .pos-dot.off { animation: none; } }

/* ═══ وضعُ نقطة البيع (PosShell): بلا القائمة — شريطٌ واحدٌ فوق الصفحة (زجاجيٌّ بلون الوضع)، فيه العودةُ إلى اللوحة وصاحبُ الجلسة والوضعُ والخروج ═══ */
.pos-shell { min-height: 100vh; display: flex; flex-direction: column; }
.pos-appbar {
  position: sticky; top: 0; z-index: 10; direction: rtl; display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 8px 16px;
  background: var(--h-bar); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--h-bar-line); color: var(--ui-ink);
}
.pos-appbar .pb-brand { display: flex; align-items: center; gap: 8px; flex: none; }
.pos-appbar .pb-brand img { width: 40px; height: 34px; object-fit: contain; filter: drop-shadow(0 2px 6px rgba(212,162,60,.35)); }
.pos-appbar .pb-brand b { font-size: 17px; font-weight: 800; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pos-appbar h1 { flex: 1; min-width: 0; margin: 0; padding-inline-start: 12px; border-inline-start: 1px solid var(--h-line);
  font-size: 17px; font-weight: 700; color: var(--ui-paper); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pos-appbar .pb-btn { display: inline-flex; align-items: center; gap: 6px; flex: none; height: 36px; padding: 0 12px; border-radius: 18px; cursor: pointer; white-space: nowrap;
  font: inherit; font-size: 13.5px; font-weight: 700; color: var(--ui-ink); background: var(--h-btn-bg); border: 1px solid var(--h-btn-line); box-shadow: none; }
.pos-appbar .pb-btn:hover, .pos-appbar .pb-btn:focus-visible { color: var(--ui-gold-pl); background: rgba(224,168,58,.16); border-color: rgba(224,168,58,.7); filter: none; }
.pos-appbar .pb-btn:focus-visible { outline: 2px solid var(--ui-gold-lt); outline-offset: 2px; }
.pos-appbar .pb-btn.active { color: var(--ui-gold-lt); border-color: rgba(224,168,58,.6); }
.pos-appbar .pb-hub { color: var(--accent-ink); background: var(--molten); border-color: rgba(255,255,255,.55); }
.pos-appbar .pb-hub:hover, .pos-appbar .pb-hub:focus-visible { color: var(--accent-ink); background: var(--molten); filter: brightness(1.06); }
.pos-appbar .pb-hub.active { display: none; }   /* على اللوحة نفسِها لا زرَّ للعودة إليها */
.pos-appbar .pb-who { display: flex; flex-direction: column; min-width: 0; max-width: 240px; line-height: 1.35; font-size: 13px; }
.pos-appbar .pb-who b, .pos-appbar .pb-who small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pos-appbar .pb-who b { color: var(--ui-paper); }
.pos-appbar .pb-who small { color: var(--ui-mut); font-size: 12px; }
.pos-appbar form { margin: 0; display: flex; }
.pos-appbar .pb-out { color: var(--h-red-ink); background: rgba(179,57,46,.14); border-color: rgba(179,57,46,.6); }
.pos-appbar .pb-out:hover, .pos-appbar .pb-out:focus-visible { color: var(--h-red-ink2); background: rgba(179,57,46,.26); border-color: rgba(214,92,78,.85); }
.pos-appbar .pb-theme { width: 36px; padding: 0; justify-content: center; }
/* للشاشة وحدها: قاعدةُ الطباعة (‎.content { padding: 0 }‎) أضعفُ من هذا المحدِّد فلا يُترك للطباعة */
@media screen {
  .pos-shell .content { padding: 14px 16px; }
  .pos-shell .pos-hall { min-height: calc(100vh - 84px); }   /* الشريط 56 وحشوةُ المحتوى */
}
@media screen and (max-width: 900px) { .pos-shell .pos-hall { min-height: 0; } }   /* كالصالة في القشرة العامّة: تتراصّ فلا حدَّ أدنى */
@media screen and (max-width: 820px) {
  .pos-appbar { gap: 8px; padding: 8px 10px; }
  .pos-appbar .pb-brand b, .pos-appbar .pb-who, .pos-appbar .pb-out span { display: none; }
  .pos-shell .content { padding: 10px; }
}
@media screen and (max-width: 480px) {
  .pos-appbar .pb-hub span { display: none; }
  .pos-appbar h1 { font-size: 15px; padding-inline-start: 8px; }
}

/* ═══ دخولُ نقطة البيع (/pos/login): صفحةٌ منفصلة بألوان «صالة العرض» — بطاقةٌ زجاجيّة، والشعارُ علامةٌ مائيّة كماسة الصالة ═══ */
.login-wrap.pos {
  grid-template-columns: 1fr; position: relative; isolation: isolate; overflow: hidden; color: var(--ui-ink); font-family: var(--font-dense);
  background: radial-gradient(ellipse 80% 106% at 34% 46%, var(--ui-hall) 0%, var(--ui-mid) 52%, var(--ui-deep) 100%);
}
.login-wrap.pos .login-diamond { position: absolute; z-index: -1; pointer-events: none; aspect-ratio: 1; height: 150%; left: 76%; top: 58%;
  transform: translate(-50%, -50%); background: url('../img/bahr-logo.png') center / contain no-repeat; opacity: calc(var(--h-wm) * .7); }
.login-wrap.pos .login-box { max-width: 400px; padding: 26px 26px 20px; border-radius: 28px; border: 1px solid var(--h-glass-line);
  background: var(--h-box); box-shadow: 0 18px 50px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.14); }
.login-wrap.pos .muted { color: var(--ui-mut); }
.login-wrap.pos .field label { color: var(--ui-steel); font-size: 12.5px; }
.login-wrap.pos .field input, .login-wrap.pos .field select { background: var(--h-field-bg); color: var(--h-field-ink); border-color: rgba(224,168,58,.55); }
.login-wrap.pos .field input:focus, .login-wrap.pos .field select:focus { outline: 3px solid rgba(224,168,58,.35); border-color: var(--ui-gold); }
.login-wrap.pos .login-box button { color: var(--accent-ink); background: var(--molten); border: 1px solid rgba(255,255,255,.55); box-shadow: 0 6px 18px rgba(0,0,0,.25); }
.login-wrap.pos .login-box button:hover { filter: brightness(1.06); }
.login-wrap.pos .login-box button:focus-visible { outline: 2px solid var(--ui-gold-lt); outline-offset: 2px; }
.login-wrap.pos .alert { background: rgba(179,57,46,.14); border: 1px solid rgba(179,57,46,.5); color: var(--h-err-ink); }
.login-wrap.pos .foot { color: var(--ui-mut2); }

/* رابطُ العودة إلى نقطة البيع في عنوان الشاشات المفتوحة منها (PosBackLink) */
.df-title .pos-back { margin-inline-start: auto; }
/* وسمُ الشاشة المربوطة بوردية نقطة البيع (PosBinding) — ذهبيٌّ هادئ فوق النموذج */
.pos-bind { display: flex; align-items: center; gap: 8px 10px; flex-wrap: wrap; margin: 6px 14px 2px; padding: 6px 12px; border-radius: 12px;
  background: var(--warn-soft); border: 1px solid rgba(198,138,36,.45); color: var(--text); font-size: 13px; line-height: 1.5; }
.pos-bind .ico { color: var(--gold); flex: none; }
.pos-bind .btn { margin-inline-start: auto; height: 28px; padding: 0 12px; font-size: 12.5px; }
.pos-modal textarea { width: 100%; box-sizing: border-box; margin-top: 10px; min-height: 72px; resize: vertical; font: inherit; font-size: 14px;
  color: var(--ui-ink); background: var(--h-btn-bg); border: 1px solid rgba(224,168,58,.45); border-radius: 10px; padding: 8px 10px; }
.pos-modal textarea:focus { outline: 2px solid var(--ui-gold-lt); outline-offset: 1px; }

/* ================= أوراقُ الجيل الرابع لتقارير نقطة البيع (Components/Reports/V4) =================
   ورقةٌ بيضاءُ كالورق بألوان SwissTokensV4 (ShiftSwissSheetV4.vb:26-37): حبرٌ ورماديٌّ وأردوازيّ، وأخضرُ السليم وأحمرُ الخلل،
   وذهبُ أرقام الأقسام وألسنة الإفصاح، ونحاسيُّ الصادر. الجداولُ مخطّطةٌ بصفوفٍ متناوبة، والأرقامُ بعرضٍ ثابت. */
.v4 { --v4-ink: #1f262e; --v4-mid: #586066; --v4-slate: #34404c; --v4-green: #1e6b47; --v4-red: #b3392e; --v4-gold: #c9a227; --v4-goldtab: #a9791c;
  --v4-copper: #8a4b25; --v4-amber: #9a6a12; --v4-line: #c9ced4; --v4-head: #eef0f2; --v4-zebra: #f7f8f9; --v4c: var(--v4-slate);
  background: #fff; color: var(--v4-ink); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow);
  padding: 22px 26px 16px; margin: 0 auto 18px; font-size: 12.5px; line-height: 1.55; display: flex; flex-direction: column; gap: 12px; }
.v4-land { max-width: 1180px; }
.v4-port { max-width: 820px; }
.v4 .num { font-variant-numeric: tabular-nums; }
.v4-t-ink { --v4c: var(--v4-ink); } .v4-t-mid { --v4c: var(--v4-mid); } .v4-t-slate { --v4c: var(--v4-slate); } .v4-t-green { --v4c: var(--v4-green); }
.v4-t-red { --v4c: var(--v4-red); } .v4-t-gold { --v4c: var(--v4-gold); } .v4-t-goldtab { --v4c: var(--v4-goldtab); } .v4-t-copper { --v4c: var(--v4-copper); }
.v4-t-amber { --v4c: var(--v4-amber); }
.v4 .v4-neg, .v4 td.v4-neg { color: var(--v4-red); }
.v4 .v4-pos { color: var(--v4-green); }

/* الترويسة: المنشأةُ يميناً، والعنوانُ وسطاً، وخانةُ التاريخ والرقم يساراً */
.v4-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) minmax(0, 1fr); gap: 14px; align-items: center; padding-bottom: 10px; border-bottom: 2px solid var(--v4-gold); }
.v4-co { display: flex; align-items: center; gap: 10px; min-width: 0; }
.v4-co img { width: 54px; height: 54px; object-fit: contain; flex: none; }
.v4-co b { display: block; font-size: 15px; font-weight: 800; }
.v4-mark { display: block; color: var(--v4-goldtab); font-size: 10px; font-weight: 700; letter-spacing: .28em; white-space: nowrap; direction: ltr; text-align: right; }
.v4-title { text-align: center; min-width: 0; }
.v4-title b { display: block; font-size: 19px; font-weight: 800; color: var(--v4-ink); text-wrap: balance; }
.v4-title > span { display: block; color: var(--v4-mid); font-size: 12px; margin-top: 2px; }
.v4-title em { font-style: normal; font-weight: 700; color: var(--v4-slate); }
.v4-title small { display: block; color: var(--v4-mid); font-size: 11.5px; margin-top: 2px; }
.v4-meta { justify-self: end; border: 1px solid var(--v4-line); border-radius: 6px; padding: 5px 10px; display: grid; gap: 1px; font-size: 11.5px; min-width: 170px; }
.v4-meta div { display: flex; justify-content: space-between; gap: 10px; }
.v4-meta em { font-style: normal; color: var(--v4-mid); }
.v4-meta b { font-weight: 700; }

/* الشرائط: لسانٌ ملوّنٌ وخاناتٌ «تسميةٌ · قيمة» */
.v4-strip { border: 1px solid var(--v4-line); border-radius: 6px; padding: 7px 10px; display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.v4-tab { display: inline-block; background: var(--v4c); color: #fff; font-size: 11px; font-weight: 800; border-radius: 4px; padding: 1px 9px; white-space: nowrap; }
.v4-disc .v4-tab { background: var(--v4-goldtab); }
.v4-cells { display: flex; flex-wrap: wrap; gap: 4px 18px; min-width: 0; flex: 1; }
.v4-cell { display: flex; gap: 6px; align-items: baseline; min-width: 0; }
.v4-cell em { font-style: normal; color: var(--v4-mid); font-size: 11.5px; }
.v4-cell b { font-weight: 700; color: var(--v4-ink); font-variant-numeric: tabular-nums; unicode-bidi: plaintext; }
.v4-cell.v4-t-green b, .v4-cell.v4-t-red b, .v4-cell.v4-t-copper b, .v4-cell.v4-t-gold b, .v4-cell.v4-t-goldtab b, .v4-cell.v4-t-amber b { color: var(--v4c); }
.v4-cell b.v4-neg { color: var(--v4-red); }
.v4-note { background: #fbf4df; border: 1px solid #ecd9a2; color: #5a430c; border-radius: 6px; padding: 5px 10px; font-size: 11.5px; font-weight: 700; }
.v4-mutenote { color: var(--v4-mid); font-size: 11.5px; padding: 2px 2px 0; }

/* بطاقاتُ المؤشّرات */
.v4-cards { display: grid; gap: 8px; }
.v4-card { border: 1px solid var(--v4-line); border-top: 3px solid var(--v4c); border-radius: 6px; padding: 6px 9px 7px; min-width: 0; }
.v4-cap { display: flex; justify-content: space-between; align-items: center; gap: 6px; color: var(--v4-mid); font-size: 11px; font-weight: 700; }
.v4-cap i { font-style: normal; color: var(--v4c); font-size: 13px; }
.v4-val { font-size: 16px; font-weight: 800; margin-top: 2px; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v4-sub { color: var(--v4-mid); font-size: 10.5px; margin-top: 1px; }

/* الأقسام المرقّمة */
.v4-sec { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.v4-sec-h { display: flex; align-items: baseline; gap: 8px; border-bottom: 1px solid var(--v4-line); padding-bottom: 3px; break-after: avoid; }
.v4-sec-h b { font-size: 13.5px; font-weight: 800; color: var(--v4-ink); }
.v4-no { color: var(--v4-gold); font-weight: 800; font-size: 14px; }
.v4-chip { margin-inline-start: auto; border: 1px solid var(--v4c); color: var(--v4c); border-radius: 20px; padding: 0 9px; font-size: 11px; font-weight: 700; white-space: nowrap; }

/* الجداول */
.v4-wrap { overflow-x: auto; max-width: 100%; }
.v4-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 11.5px; }
.v4 .v4-table th, .v4 .v4-table td { padding: 4px 7px; border-bottom: 1px solid #e3e6ea; white-space: nowrap; }
.v4 .v4-table th { position: static; background: var(--v4-head); color: var(--v4-slate); font-weight: 800; border-bottom: 1px solid var(--v4-line); font-size: 11px; }
.v4-table tbody tr:nth-child(even) td { background: var(--v4-zebra); }
.v4-table tbody tr.v4-strong td, .v4-table tr.v4-strong td, .v4-table tfoot td { font-weight: 800; background: var(--v4-head); border-top: 1.5px solid var(--v4-ink); }
.v4-table tbody tr.v4-grp td, .v4-table tr.v4-grp td { background: #fbf6e6; color: var(--v4-goldtab); font-weight: 800; }
.v4-table td.v4-label { font-weight: 700; }
.v4 .v4-table td.v4-wrapc { white-space: normal; min-width: 160px; }
.v4 .v4-ok { color: var(--v4-green); font-weight: 800; }
.v4 .v4-bad { color: var(--v4-red); font-weight: 800; }
.v4 .v4-dim { color: var(--v4-mid); }

/* الحكمُ والإفصاحاتُ والتواقيع والتذييل */
.v4-verdict { border-radius: 6px; padding: 7px 12px; font-weight: 800; text-align: center; font-size: 13px; }
.v4-verdict-ok { background: #e7f2eb; border: 1px solid #9cc7ae; color: var(--v4-green); }
.v4-verdict-bad { background: #f8e8e6; border: 1px solid #e0a39b; color: var(--v4-red); }
.v4-disc { border: 1px solid var(--v4-line); border-radius: 6px; padding: 7px 10px; display: flex; flex-direction: column; gap: 2px; }
.v4-disc .v4-tab { align-self: flex-start; margin-bottom: 3px; }
.v4-disc p { margin: 0; font-size: 11.5px; color: var(--v4-ink); }
.v4-signs { display: grid; gap: 18px; margin-top: 8px; }
.v4-signs > div { text-align: center; display: flex; flex-direction: column; gap: 3px; font-size: 12px; }
.v4-signs b { color: var(--v4-slate); font-weight: 800; }
.v4-signs small { color: var(--v4-mid); min-height: 1.4em; }
.v4-signs span { display: flex; gap: 6px; align-items: flex-end; color: var(--v4-mid); }
.v4-signs span i { flex: 1; border-bottom: 1px dotted var(--v4-mid); min-height: 1.2em; }
.v4-signs-blocked { border: 1.5px dashed var(--v4-red); color: var(--v4-red); border-radius: 6px; padding: 10px; text-align: center; font-weight: 800; }
.v4-endmark { text-align: center; color: var(--v4-mid); font-size: 11.5px; letter-spacing: .06em; margin-top: 6px; }
.v4-approval { text-align: center; color: var(--v4-red); background: #fbeceb; border-radius: 6px; padding: 5px 10px; font-weight: 800; font-size: 11.5px; }
.v4-foot { text-align: center; color: var(--v4-slate); border-top: 1px solid var(--v4-line); padding-top: 5px; font-size: 10.5px; }

/* ورقُ الطباعة: A4 عرضيّةٌ أو طوليّة بصفحاتٍ مسمّاة، ورقمُ الصفحة من هامشها، ورأسُ الجدول يتكرّر */
@page v4land { size: A4 landscape; margin: 12mm 16mm 18mm 16mm;
  @bottom-left { content: "\2066" counter(page) " / " counter(pages) "\2069"; font-size: 9pt; color: #586066; } }
@page v4port { size: A4; margin: 9mm 9mm 12mm 9mm;
  @bottom-left { content: "\2066" counter(page) " / " counter(pages) "\2069"; font-size: 9pt; color: #586066; } }
/* «ن / م» معزولاً يساريّاً (LRI…PDI): الصفحةُ العربيّةُ كانت تقلبه «م / ن» (قِيس في Edge، الجولة العاشرة) */
@media print {
  .v4 { border: none; box-shadow: none; border-radius: 0; max-width: none; margin: 0; padding: 0; gap: 9px; }
  .v4-land { page: v4land; }
  .v4-port { page: v4port; }
  .v4, .v4 * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .v4-wrap { overflow: visible; }
  .v4-table thead { display: table-header-group; }
  .v4-table tr, .v4-card, .v4-signs, .v4-signs-blocked, .v4-verdict, .v4-strip, .v4-disc { break-inside: avoid; }
  /* الورقةُ تحمل ترويستَها — فشريطُ عنوان الشاشة لا يُطبع فوقها */
  .df:has(.v4) > .df-title { display: none !important; }
}
@media screen and (max-width: 820px) {
  .v4 { padding: 14px 16px; }
  .v4-head { grid-template-columns: 1fr; text-align: center; }
  .v4-co { justify-content: center; }
  .v4-meta { justify-self: center; }
  .v4-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .v4-signs { grid-template-columns: 1fr 1fr !important; }
}

/* معاييرُ تقارير نقطة البيع (PosCriteria): شريطُ الحوار فوق الورقة */
.pos-crit { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 14px; margin-bottom: 14px; display: grid; gap: 8px; box-shadow: var(--shadow); }
.pos-crit .pc-row { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: flex-end; }
.pos-crit label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: var(--muted); }
.pos-crit label.pc-chk { flex-direction: row; align-items: center; gap: 6px; color: var(--text); font-size: 13px; }
.pos-crit .ro { padding: 8px 10px; border: 1px dashed var(--line); border-radius: 9px; color: var(--text); background: var(--sunken); }
.pos-crit .pc-cap { font-size: 12.5px; color: var(--muted); font-weight: 700; }
.pos-crit .pc-live { font-size: 12.5px; color: var(--gold-dark); background: var(--gold-soft); border-radius: 8px; padding: 6px 10px; overflow-wrap: anywhere; }

/* دفترُ الكسر (ScrapLedgerSheet — ShiftScrapLedgerV4): بلاطاتُ العيارات ولوحتا المبيعات والمشتريات ووسطُ الخلاصة ومنصّةُ البائعين */
/* «مبيعات ومشتريات الكسر تفصيلياً» (ScrapLedgerSheet ⇐ ShiftScrapLedgerV4): بلاطاتُ العيارات، والشطران والعمودُ الأوسط، والميداليات */
.v4x-sl-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px} .v4x-sl-half{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.v4x-sl-medal{--mc:var(--v4-gold);display:inline-grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;border:2px solid var(--mc);color:var(--mc);font-size:11px;font-weight:800;font-style:normal;line-height:1} .v4x-sl-medal.on{background:var(--mc);color:#fff}
.v4x-sl-pct{color:var(--v4-mid);font-size:10.5px;margin-top:3px} .v4x-sl-pct.on{color:var(--v4c)} .v4x-sl-pct b{font-weight:800} .v4x-sl-bar{height:6px;margin-top:3px;background:var(--v4-head);border-radius:3px;overflow:hidden} .v4x-sl-bar i{display:block;height:100%;background:var(--v4-gold)}
.v4x-sl-split{display:grid;grid-template-columns:minmax(0,1120fr) minmax(0,350fr) minmax(0,1120fr);gap:10px;align-items:start} .v4x-sl-panel{border:1px solid var(--v4-line);border-radius:6px;min-width:0}
.v4x-sl-ph{display:flex;justify-content:space-between;gap:10px;background:var(--v4c);color:#fff;padding:5px 10px;font-weight:800;border-radius:5px 5px 0 0} .v4x-sl-panel .v4-mutenote{padding:4px 8px 6px;text-align:center}
.v4 .v4x-sl-panel .v4-table th,.v4 .v4x-sl-panel .v4-table td{text-align:center;padding:3px 4px} .v4 .v4x-sl-panel .v4-table td.v4x-sl-item{white-space:normal;min-width:80px}
.v4x-sl-mid{border:1px solid var(--v4-line);border-radius:6px;padding:8px 6px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;min-width:0;break-inside:avoid} .v4x-sl-glyph{color:var(--v4-gold);font-size:30px;line-height:1.1} .v4x-sl-mt{font-size:13.5px;font-weight:800}
.v4x-sl-mz em{display:block;font-style:normal;color:var(--v4-mid);font-size:11px} .v4x-sl-mz b{font-size:14px;font-weight:800} .v4x-sl-hatch{display:block;width:110px;height:16px;margin:3px auto 0;border:1px solid var(--v4-mid);background:repeating-linear-gradient(135deg,transparent 0 5px,var(--v4-ink) 5px 6px)}
.v4x-sl-sep{align-self:stretch;border-top:1px solid var(--v4-line);margin:6px 12px} .v4x-sl-pod{align-self:stretch;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 0 6px;border-bottom:1px solid var(--v4-head)} .v4x-sl-pod b{color:var(--v4-mid);font-weight:400} .v4x-sl-pod.on b{color:var(--v4-ink);font-weight:800} .v4x-sl-pod small,.v4x-sl-podnote{color:var(--v4-mid);font-size:10.5px}
@media screen and (max-width:820px){.v4x-sl-tiles,.v4x-sl-split{grid-template-columns:1fr}.v4x-sl-half{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* قائمةُ الحسابات (AccountLookup — كـSearchLookUpEdit في frmKashfAcc): حقلُ بحثٍ بجدولٍ منسدلٍ بأعمدة «رقم الحساب · الاسم بالعربي · الاسم بالانجليزي»، وحقلُ الرقم */
.acc-lookup { min-width: 260px; }
.acc-lookup .acc-box { position: relative; display: flex; gap: 4px; align-items: stretch; }
.acc-lookup .acc-box input { flex: 1; min-width: 0; }
.acc-lookup .acc-drop { padding: 4px 10px; }
.acc-lookup .acc-pop { position: absolute; top: calc(100% + 4px); inset-inline-start: 0; z-index: 40; width: min(560px, 92vw); max-height: 340px; overflow: auto;
  background: var(--panel); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-lg); }
.acc-lookup .acc-pop table { width: 100%; border-collapse: collapse; }
.acc-lookup .acc-pop th { position: sticky; top: 0; background: var(--th-bg); font-size: 12.5px; padding: 7px 10px; }
.acc-lookup .acc-pop td { padding: 6px 10px; font-size: 13px; cursor: pointer; }
.acc-lookup .acc-pop tr:hover td, .acc-lookup .acc-pop tr.on td { background: var(--gold-soft); }
.acc-code { min-width: 150px; }
.acc-code input { text-align: center; font-variant-numeric: tabular-nums; }
.acc-kind { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; min-height: 36px; }
.acc-kind label { display: inline-flex; align-items: center; gap: 4px; font-size: 13.5px; color: var(--text); }

/* ================= مطبوعُ كشف الحساب (KashfAccSheet ⇐ KashfAccV4Sheet — التصميم ١٥ بالتذييل ٣) =================
   يُطبع وحده (print-only): A4 عرضيّة بهوامش المكتبي (4 مم أعلى · 5.6 مم جانباً · 5 مم أسفل) وبوحداته (مم ونقطة)، وألوانُه ثوابتُ البانيّ، وخطُّه «دبي».
   رأسُ الجدول (thead) يحمل الترويسةَ والبطاقات فيتكرّر في كلّ صفحة كشريحة PageHeader؛ والتذييلُ ثابتٌ في أسفل كلّ صفحة وله مسافةٌ محجوزة في tfoot. */
@page ks { size: A4 landscape; margin: 4mm 5.6mm 5mm 5.6mm;
  @bottom-left { content: "\2066" counter(page) " / " counter(pages) "\2069"; font-family: Dubai, "Segoe UI", Tahoma, sans-serif; font-size: 8.4pt; color: #586066; } }
/* رقمُ الصفحة «ن / م» يساريُّ الاتجاه كـXRPageInfo (RightToLeft.No) — معزولاً (LRI…PDI) وإلا قلبته الصفحةُ العربيّة «م / ن».
   والعريضُ في الباني «Dubai Medium» بنمطٍ عريض (FamB + Bold، vb:42-43، 461-464) لا «Dubai» العريض. */
.ks { page: ks; font-family: Dubai, "Segoe UI", Tahoma, sans-serif; color: #1f262e; direction: rtl; background: #fff; }
.ks, .ks * { -webkit-print-color-adjust: exact; print-color-adjust: exact; box-sizing: border-box; }
.ks-t { width: 100%; border-collapse: collapse; table-layout: auto; }
.ks-t thead { display: table-header-group; }
.ks-t tfoot { display: table-footer-group; }
.ks-t tr { break-inside: avoid; }
.ks-t th, .ks-t td { border: .1mm solid #c9ced4; padding: 0 .7mm; vertical-align: middle; text-align: center; position: static; }
.ks-t th { color: #1f262e; top: auto; }
.ks-t th.ks-top { border: none; padding: 0 0 3mm; background: none; font-weight: 400; text-align: right; }
.ks-band { position: relative; height: 30mm; background: linear-gradient(to right, #1c283e, #2b3b58); border-bottom: 1.2mm solid #c9a227; }
.ks-logo { position: absolute; right: 2.6mm; object-fit: contain; }
.ks-title { position: absolute; left: 78mm; top: 6.6mm; text-align: right; }
.ks-title b { display: block; font-size: 16pt; font-weight: 700; color: #fff; line-height: 9.2mm; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-title span { display: block; margin-top: .6mm; font-size: 9.6pt; color: #c6d0e0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-acc { position: absolute; left: 4mm; width: 68mm; top: 5.4mm; text-align: right; }
.ks-acc b { display: block; font-size: 11pt; font-weight: 700; color: #fff; line-height: 5.6mm; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-acc i { display: block; font-style: normal; font-size: 13pt; font-weight: 700; color: #c9a227; line-height: 6.4mm; margin-top: .2mm; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-acc > span { display: block; font-size: 9.6pt; color: #c6d0e0; line-height: 5.4mm; margin-top: .4mm; white-space: pre; overflow: hidden; text-overflow: ellipsis; }
.ks-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2mm; margin-top: 1.6mm; }
.ks-card { height: 11.8mm; background: #f3f5f8; border: .1mm solid #c9ced4; border-top: 1.2mm solid #a9791c; padding: .8mm 1.8mm 0; text-align: right; overflow: hidden; }
.ks-card em { display: block; font-style: normal; font-size: 8.8pt; color: #586066; line-height: 3.6mm; }
.ks-card b { display: block; font-size: 13pt; font-weight: 700; line-height: 5.2mm; margin-top: .6mm; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-g { color: #1e6b47; } .ks-r { color: #b3392e; }
.ks-h1 th, .ks-h2 th { background: #eef0f2; font-weight: 700; height: 6.2mm; white-space: nowrap; }
.ks-h1 th { font-size: 10.6pt; } .ks-h2 th { font-size: 10pt; }
.ks-t th.ks-tag, .ks-t td.ks-tag { width: 3.2mm; min-width: 3.2mm; padding: 0; }
.ks-t td.ks-tag { border: none; background: #d6dade; }
.ks-tag1 { background: #1e6b47 !important; } .ks-tag2 { background: #8a5cf6 !important; } .ks-tag3 { background: #a9791c !important; } .ks-tag4 { background: #b3392e !important; }
.ks-t tbody td { height: 8mm; font-size: 9.4pt; }
.ks-t td.ks-doc, .ks-t td.ks-n { white-space: nowrap; }
.ks-t td.ks-byn { font-size: 8.4pt; white-space: normal; min-width: 40mm; }
.ks-t td.ks-v { font-size: 8.8pt; min-width: 17mm; }
.ks-t tr.ks-zebra td:not(.ks-tag) { background: #f7f8f9; }
.ks-t tr.ks-open td:not(.ks-tag) { background: #faf4e0; color: #1c283e; }
.ks-sums { break-inside: avoid; }
.ks-t .ks-sums th, .ks-t .ks-sums td { height: 6.2mm; font-weight: 700; background: #e4e8ec; font-size: 10pt; white-space: nowrap; }
.ks-t .ks-sums tr.ks-fin th, .ks-t .ks-sums tr.ks-fin td { background: #d6dce2; font-size: 10.6pt; }
.ks-end { break-inside: avoid; }
.ks-t .ks-end > tr > td { border: none; padding: 0; height: auto; text-align: right; background: none; }
.ks-key { display: flex; flex-wrap: wrap; gap: 2mm 4mm; margin-top: 2.4mm; font-size: 8.4pt; color: #586066; }
.ks-key span { display: inline-flex; align-items: center; gap: 1.4mm; }
.ks-key i { display: inline-block; width: 2.4mm; height: 2.4mm; }
.ks-sumh { font-size: 10.4pt; font-weight: 700; color: #1c283e; margin: 2.6mm 0 .8mm; text-align: right; }
.ks-box { border-collapse: collapse; }
.ks-t .ks-box th, .ks-t .ks-box td { border: .1mm solid #c9ced4; height: 6mm; text-align: center; font-size: 9.6pt; padding: 0 .9mm; background: #fff; }
.ks-t .ks-box tr.ks-bh th { background: #e4e8ec; font-weight: 700; font-size: 10pt; }
.ks-t .ks-box td.ks-bl { text-align: right; }
.ks-t .ks-box tr.ks-bfin td { background: #d6dce2; font-weight: 700; }
.ks-t td.ks-pfspace { border: none; height: 16.8mm; padding: 0; background: none; }
.ks-pf { position: fixed; left: 0; right: 0; bottom: 0; height: 16.8mm; border-top: .3mm solid #c9ced4; display: grid; grid-template-columns: 1fr 1fr; background: #fff; }
.ks-pf::after { content: ""; position: absolute; left: calc(50% - .3mm); top: 1.8mm; width: .6mm; height: 14.6mm; background: #c9a227; }
.ks-pfr, .ks-pfl { display: flex; flex-direction: column; text-align: right; padding-top: 1.8mm; min-width: 0; }
.ks-pfr { padding-left: 4.4mm; } .ks-pfl { padding-right: 4.4mm; }
.ks-pfr b, .ks-pfl b { font-size: 10pt; font-weight: 700; line-height: 4.2mm; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-pfl b { font-size: 9.6pt; text-align: right; }
.ks-pfr span { font-size: 8.6pt; color: #586066; line-height: 3.4mm; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-pfl span { font-size: 8.4pt; color: #586066; line-height: 3.4mm; white-space: nowrap; text-align: right; }
/* الترقيمُ الصريح عند الطباعة (js/kashf-print.js): النسخةُ المقيسةُ خارج الشاشة بعرض الورقة، والصفحاتُ المبنيّةُ تُطبع وحدَها بدل الأصل */
.ks-probe { position: absolute; left: -40000px; top: 0; width: 285.8mm; visibility: hidden; }
.ks-probe .ks-pf { display: none; }
#ks-paged { display: none; }
@media print {
  html.ks-paging body > *:not(#ks-paged) { display: none !important; }
  html.ks-paging #ks-paged { display: block !important; }
  #ks-paged .ks-page { break-after: page; }
  #ks-paged .ks-page.ks-last { break-after: auto; }
}
.ks-title b, .ks-acc b, .ks-acc i, .ks-card b, .ks-h1 th, .ks-h2 th, .ks-t .ks-sums th, .ks-t .ks-sums td, .ks-t .ks-box tr.ks-bh th, .ks-t .ks-box tr.ks-bfin td, .ks-sumh, .ks-pfr b, .ks-pfl b {
  font-family: "Dubai Medium", Dubai, "Segoe UI", Tahoma, sans-serif; }

/* حوارُ رقم الواتساب (frmWaMobileAsk): ترويسةٌ كحليّةٌ بالشعار يقفلها خطٌّ ذهبيّ، والرقمُ يساريٌّ في وسط حقله، وزرُّ «إرسال» بأخضر الواتساب */
.wa-ask { position: fixed; inset: 0; z-index: 45; display: grid; place-items: center; background: rgba(15, 20, 30, .45); padding: 16px; }
.wa-ask .box { width: min(560px, 100%); background: var(--panel); color: var(--text); border-radius: 18px; overflow: hidden; box-shadow: 0 18px 50px rgba(0, 0, 0, .35); }
.wa-ask .hd { display: flex; align-items: center; gap: 12px; padding: 10px 14px; background: linear-gradient(to right, #26221b, #0e0d0b); border-bottom: 3px solid #e0a83a; color: #fff; }
.wa-ask .hd img { width: 56px; height: 56px; object-fit: contain; flex: none; }
.wa-ask .hd b { display: block; font-size: 19px; font-weight: 800; }
.wa-ask .hd span { display: block; font-size: 12px; color: #d9c9a3; margin-top: 2px; }
.wa-ask .bd { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 10px 12px; align-items: center; padding: 16px; }
.wa-ask .bd > label { font-size: 14px; color: var(--text); }
.wa-ask .bd input[type=text] { direction: ltr; text-align: center; font-size: 16px; padding: 7px 10px; width: 100%; }
.wa-ask .bd .sw { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; }
.wa-ask .bd .err { grid-column: 1 / -1; color: var(--bad); font-weight: 700; font-size: 13.5px; }
.wa-ask .act { display: flex; gap: 10px; padding: 10px 16px; background: var(--panel-2); border-top: 1px solid var(--line); }
.wa-ask .act button { min-width: 130px; }
.wa-ask .act button.send { background: #1e6b47; color: #fff; border-color: #1e6b47; }
/* ملفُّ الكشف PDF بعد واتساب الكشف: اسمُه وحجمُه، و«مشاركة» بأخضر زرّ الإرسال، و«تنزيل» */
.ks-file { display: grid; gap: 8px; margin: 8px 0; padding: 10px 14px; border: 1px solid rgba(31,138,85,.3); border-radius: 14px; background: var(--ok-soft); }
.ks-file .acts { display: flex; flex-wrap: wrap; gap: 8px; }
.ks-file .acts button.share { background: #1e6b47; color: #fff; border-color: #1e6b47; }
.ks-file p { margin: 0; font-size: 12.5px; }
/* معاينةُ الكشف («عرض» في خيارات طباعة المكتبي — frmReportViewer): ترويسةٌ كحليّةٌ بخطّها الذهبيّ وأزرارُ العارض، والصفحاتُ أوراقٌ بمقاس A4 العرضيّة
   وهوامشِ «@page ks» على خلفيّةٍ رماديّة، مصغَّرةً إلى عرض النافذة (js/kashf-print.js)؛ والتذييلُ في أسفل كلّ ورقة، ورقمُها في موضع هامشه */
.ks-preview { position: fixed; inset: 0; z-index: 44; display: flex; flex-direction: column; background: #5f6368; outline: none; }
.ks-preview .bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 14px; background: linear-gradient(to right, #2b3b58, #1c283e); border-bottom: 3px solid #c9a227; color: #fff; }
.ks-preview .bar b { font-size: 16px; font-weight: 800; }
.ks-preview .bar .n { font-size: 12.5px; color: #c6d0e0; }
.ks-preview .bar .sp { flex: 1; }
.ks-preview .bar button { background: #fff; color: #1c283e; border-color: #fff; }
.ks-preview .err, .ks-preview .ok { padding: 6px 14px; font-size: 13.5px; }
.ks-preview .err { background: #fbeaea; color: #b3392e; font-weight: 700; }
.ks-preview .ok { background: #eef6f1; color: #1e6b47; }
.ks-preview .pages { flex: 1; overflow: auto; padding: 16px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.ks-frame { position: relative; flex: none; overflow: hidden; background: #fff; box-shadow: 0 2px 12px rgba(0, 0, 0, .45); }
.ks-paper { position: absolute; top: 0; left: 0; width: 297mm; height: 210mm; padding: 4mm 5.6mm 5mm; box-sizing: border-box; background: #fff; transform-origin: 0 0; }
.ks-paper .ks-pf { position: absolute; left: 5.6mm; right: 5.6mm; bottom: 5mm; }
.ks-pno { position: absolute; left: 5.6mm; bottom: 0; height: 5mm; line-height: 5mm; direction: ltr; font-family: Dubai, "Segoe UI", Tahoma, sans-serif; font-size: 8.4pt; color: #586066; }
@media (max-width: 480px) { .wa-ask .bd { grid-template-columns: 1fr; } }

/* ═══ وردية نقطة البيع (/shift): فتحٌ وإغلاقٌ على هيئة حوارَي frmPOS (frmPOS.vb:1855-2162) — الجولة 15 ═══
   ألوانُ الحوار نفسِه (كحليّ 2B3B58 · ذهبيّ C9A227 · حبر 1F262E · رماديّ 586066 · خطّ C9CED4)، والأقسامُ بألوان صالة العرض: النقدُ أخضر، والكسرُ ذهبيّ، والشبكةُ أزرق.
   ترويسةٌ كحليّةٌ بالنقش والشعار وخطٍّ ذهبيّ، وبطاقاتٌ بشريط لونٍ علويّ، وعنوانُ كلِّ خانةٍ فوقها لا بجانبها — فلا يطفح عليها مهما طال (كان عمودُه 96 بكسل
   لا ينكسر فيه السطر، فيغطّي أوّلَ الخانة). والتخطيطُ يتبع عرضَ الشاشة نفسِها (container queries) لا عرضَ النافذة: بالقائمة اليمنى وبدونها وعلى الهاتف.
   والأساسُ عمودٌ واحد، فالمتصفّحُ الذي لا يعرف container queries يرى تخطيطَ الهاتف سليماً. والأسماءُ كلُّها ببادئة shd- فلا تصادمَ مع غيرها. */
.shd { --shd-navy: #2a2620; --shd-navy-d: #15130f; --shd-gold: #c68a24; --shd-gold-lt: #f8d27a; --shd-ink: #1d1a15; --shd-mut: #6f685c; --shd-line: #e2dccf;
  --shd-strip: #f8f6f1; --shd-foot: #f4f1ea; --shd-green: #1f7a4b; --shd-red: #b3392e;
  --shd-card: #ffffff; --shd-in: #ffffff; --shd-l: #3d372e; --shd-ph: #a39b8d; --shd-head1: #2a2620; --shd-head2: #0f0e0c;
  --shd-t-navy: #efebe3; --shd-t-gold: #fbf2dc; --shd-t-green: #e5f3ea; --shd-t-red: #fbeceb; --shd-t-net: #e8effa;
  --shd-bad-bg: #fdf1ef; --shd-bad-ring: #fbe4e2; --shd-note-i: #eee9df; --shd-confirm: #fffbeb; --shd-confirm-line: #ecd9a2; --shd-confirm-ink: #5a430c;
  --shd-done: #e7f2eb; --shd-done-line: #9cc7ae;
  container: shd / inline-size; background: var(--shd-card); color: var(--shd-ink); border: 1px solid var(--shd-line); border-radius: 20px; box-shadow: var(--shadow); margin-bottom: 18px;
  font-family: var(--font-dense); line-height: normal; }
@media screen { :root[data-theme="dark"] .shd { --shd-navy: #e3d3ad; --shd-gold: #e0a83a; --shd-ink: #f1ece2; --shd-mut: #a39d90; --shd-line: #2e2e34;
  --shd-strip: #141416; --shd-foot: #121214; --shd-green: #7fdcab; --shd-red: #ff8f80;
  --shd-card: #17171a; --shd-in: #0f0f11; --shd-l: #d9d2c4; --shd-ph: #6f6a62; --shd-head1: #26221b; --shd-head2: #0b0a09;
  --shd-t-navy: rgba(227,211,173,.10); --shd-t-gold: rgba(248,201,90,.12); --shd-t-green: rgba(111,211,157,.12); --shd-t-red: rgba(255,143,128,.12); --shd-t-net: rgba(147,180,255,.12);
  --shd-bad-bg: rgba(255,143,128,.08); --shd-bad-ring: rgba(255,143,128,.16); --shd-note-i: rgba(255,255,255,.06); --shd-confirm: rgba(242,195,92,.08);
  --shd-confirm-line: rgba(242,195,92,.32); --shd-confirm-ink: #f2c35c; --shd-done: rgba(111,211,157,.10); --shd-done-line: rgba(111,211,157,.35); } }
@media screen { :root[data-theme="dark"] .shd-s-cash { --a: #49c48a; --a2: #2f8f61; } }
@media screen { :root[data-theme="dark"] .shd-s-gold { --a: #e0a83a; --a2: #a9791c; } }
@media screen { :root[data-theme="dark"] .shd-s-net { --a: #7fb0f0; --a2: #2b4e8f; } }
@media screen { :root[data-theme="dark"] .shd-k-green { --c: #49c48a; } }
@media screen { :root[data-theme="dark"] .shd-k-red { --c: #ff8f80; } }

/* الترويسة: قفلٌ في حلقةٍ ذهبيّة، والعنوانُ ولافتةُ الحال بنقطتها، والشعارُ في الطرف — على كحليٍّ بنقش الهويّة */
.shd-head { position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 12px 14px; padding: 14px 18px; color: #fff;
  border-radius: 19px 19px 0 0; border-bottom: 3px solid var(--shd-gold);
  background: url('../img/pattern.svg') repeat, linear-gradient(120deg, var(--shd-head1), var(--shd-head2) 72%);
  background-size: 64px 64px, auto; background-blend-mode: soft-light, normal; }
.shd-lock { flex: none; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; color: var(--shd-gold-lt);
  background: radial-gradient(circle at 50% 40%, rgba(201,162,39,.38), rgba(201,162,39,.08) 72%); border: 1.5px solid rgba(243,226,155,.65); box-shadow: 0 4px 14px rgba(0,0,0,.25); }
.shd-ttl { flex: 1 1 160px; min-width: 0; }
.shd-ttl h2 { margin: 0; font-size: 22px; font-weight: 800; line-height: 1.35; color: #fff; overflow-wrap: anywhere; }
.shd-ttl h2 span { color: var(--shd-gold-lt); font-weight: 700; }
.shd-ttl p { margin: 5px 0 0; display: inline-flex; align-items: center; gap: 7px; padding: 2px 12px 2px 10px; border-radius: 20px; font-size: 13px; font-weight: 700;
  color: #eef3fa; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.18); }
.shd-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.shd-dot.shd-on { background: #3ed07f; box-shadow: 0 0 0 3px rgba(62,208,127,.30); }
.shd-dot.shd-off { background: #e0705f; box-shadow: 0 0 0 3px rgba(214,92,78,.32); }
.shd-logo { flex: none; width: 58px; height: 50px; object-fit: contain; filter: drop-shadow(0 3px 10px rgba(212,162,60,.45)); }
.shd-head .pos-back { flex: none; color: var(--shd-gold-lt); border-color: rgba(243,226,155,.55); background: rgba(255,255,255,.05); }
.shd-head .pos-back:hover { color: #fff; background: rgba(201,162,39,.22); }

/* الرسائل: الخطأُ والاستعلامُ بألوان الموقع، والنجاحُ أخضرُ بعلامته وبابَي المحضر */
.shd-msg { margin: 12px 18px 0; }
.shd .alert.shd-done { display: flex; align-items: flex-start; gap: 10px; white-space: normal; background: var(--shd-done); color: var(--shd-green); border: 1px solid var(--shd-done-line); }
.shd-done > .ico { margin-top: 1px; }
.shd-pre { white-space: pre-line; font-weight: 700; }
.shd-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.shd .alert.shd-stop { display: flex; align-items: flex-start; gap: 10px; white-space: normal; font-weight: 700; border: 1px solid var(--shd-confirm-line); }
.shd-stop > .ico { flex: none; margin-top: 1px; }

/* البطاقات: شريطُ لونٍ علويّ ورمزٌ في مربّعٍ بلونه — الذهبيُّ للفرع والرقم، والكحليُّ للمسؤول، والأخضرُ للوقت، والأحمرُ للعهدة */
.shd-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 14px 18px; background: var(--shd-strip); border-bottom: 1px solid var(--shd-line); }
.shd-card { --c: var(--shd-navy); --t: var(--shd-t-navy); min-width: 0; display: flex; flex-direction: column; gap: 6px; padding: 10px 12px 12px; background: var(--shd-card);
  border: 1px solid var(--shd-line); border-top: 4px solid var(--c); border-radius: 14px; box-shadow: 0 1px 2px rgba(31,38,46,.05); }
.shd-card .k { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; color: var(--shd-mut); line-height: 1.3; }
.shd-card .k i { flex: none; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: var(--c); background: var(--t); }
.shd-card b { display: block; font-size: 18px; font-weight: 800; line-height: 1.4; color: var(--shd-ink); text-align: right; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.shd-card select { width: 100%; min-width: 0; height: 40px; padding: 4px 10px; font-weight: 700; color: var(--shd-ink); background: var(--shd-in); border: 1px solid var(--shd-line); border-radius: 10px; }
.shd-card select:focus { border-color: var(--shd-gold); outline: 3px solid var(--focus); }
.shd-k-gold { --c: var(--shd-gold); --t: var(--shd-t-gold); }
.shd-k-navy { --c: var(--shd-navy); --t: var(--shd-t-navy); }
.shd-k-green { --c: var(--shd-green); --t: var(--shd-t-green); }
.shd-k-red { --c: var(--shd-red); --t: var(--shd-t-red); }
.shd-open .shd-card.shd-emp { grid-column: 1 / -1; order: 3; }   /* الضيّق: الفرعُ والوقتُ صفّاً، والاختيارُ تحتهما بالعرض كلّه */

/* الأقسام: النقدُ شريطٌ بعرض الشاشة (خانةٌ واحدة كبيرة)، ثمّ الكسرُ والشبكة — كلٌّ بلونه ورمزه وسطرِ وحدته */
.shd-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 16px 18px 4px; }
.shd-sec { --a: var(--shd-navy); --a2: #4d6594; --t: var(--shd-t-navy); container: shdsec / inline-size; min-width: 0; background: var(--shd-card);
  border: 1px solid var(--shd-line); border-top: 3px solid var(--a); border-radius: 16px; padding: 12px 14px 14px; }
.shd-s-cash { --a: #1e6b47; --a2: #49c48a; --t: var(--shd-t-green); }
.shd-s-gold { --a: #a9791c; --a2: #e2be44; --t: var(--shd-t-gold); }
.shd-s-net { --a: #2b4e8f; --a2: #7fb0f0; --t: var(--shd-t-net); }
.shd-sec h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 16px; font-weight: 800; line-height: 1.35; color: var(--shd-navy); }
.shd-sec h3 i { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; color: #fff;
  background: linear-gradient(145deg, var(--a2), var(--a)); box-shadow: 0 3px 10px rgba(31,38,46,.18), inset 0 1px 0 rgba(255,255,255,.25); }
.shd-sec h3 > span { min-width: 0; overflow-wrap: anywhere; }
.shd-sec h3 small { display: block; margin-top: 1px; font-size: 12px; font-weight: 700; color: var(--shd-mut); }
.shd-fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px 14px; }
.shd-s-cash .shd-fields { grid-template-columns: minmax(0, 1fr); }

/* الخانة: العنوانُ برمزه فوقها، ثمّ الرقمُ ووحدتُه في صندوقٍ واحد يُضاء بلون قسمه */
.shd-f { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.shd-l { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 13.5px; font-weight: 700; line-height: 1.4; color: var(--shd-l); overflow-wrap: anywhere; }
.shd-l .ico { flex: none; color: var(--a); }
.shd-in { display: flex; align-items: stretch; height: 50px; min-width: 0; background: var(--shd-in); border: 1.5px solid var(--shd-line); border-radius: 10px; transition: border-color .15s, box-shadow .15s; }
.shd-in:focus-within { border-color: var(--a); box-shadow: 0 0 0 3px var(--t); }
.shd-in input { flex: 1; width: 100%; min-width: 0; height: auto; margin: 0; padding: 0 14px; border: 0; border-radius: 9px; background: transparent;
  font-size: 20px; font-weight: 800; color: var(--shd-ink); text-align: left; }
.shd-in input:focus { outline: none; }
.shd-in input::placeholder { color: var(--shd-ph); font-weight: 700; }
.shd-u { flex: none; display: grid; place-items: center; min-width: 54px; padding: 0 10px; font-size: 13px; font-weight: 800; color: var(--a); background: var(--t);
  border-inline-start: 1.5px solid var(--shd-line); border-start-end-radius: 8.5px; border-end-end-radius: 8.5px; }
.shd-s-cash .shd-in { height: 58px; }
.shd-s-cash .shd-in input { font-size: 24px; }
.shd-f.shd-bad .shd-in { border-color: var(--shd-red); background: var(--shd-bad-bg); box-shadow: 0 0 0 3px var(--shd-bad-ring); }
.shd-f.shd-bad .shd-u { color: var(--shd-red); background: var(--shd-bad-ring); }
.shd-err { font-size: 12.5px; font-weight: 700; color: var(--shd-red); }

/* العدُّ الأعمى: سطرُ شرحٍ برمز العين المشطوبة */
.shd-note { display: flex; align-items: flex-start; gap: 10px; margin: 12px 18px 14px; padding: 10px 14px; border-radius: 10px; background: var(--shd-strip);
  border: 1px dashed var(--shd-line); color: var(--shd-mut); font-size: 12.5px; line-height: 1.8; }
.shd-note i { flex: none; width: 30px; height: 30px; margin-top: 2px; border-radius: 50%; display: grid; place-items: center; color: var(--shd-navy); background: var(--shd-note-i); }
.shd-note b { color: var(--shd-navy); }

/* الأوامر: «فتح/إغلاق الوردية» كحليٌّ ممتلئٌ بقفله الذهبيّ، و«إعادة العدّ» محدَّد؛ والتأكيدُ لوحةٌ ذهبيّةٌ بـ«نعم / لا» */
.shd-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 14px 18px; background: var(--shd-foot); border-top: 1px solid var(--shd-line); border-radius: 0 0 19px 19px; }
.shd-acts { display: flex; flex-direction: column; gap: 10px; width: 100%; }
.shd .shd-go, .shd .shd-alt { justify-content: center; height: 48px; padding: 0 22px; border-radius: 10px; font-size: 16px; }
.shd .shd-go, .shd .shd-go:hover { font-weight: 800; color: var(--accent-ink); border: 1px solid transparent; background: var(--molten);
  box-shadow: 0 6px 16px rgba(198,138,36,.28), inset 0 1px 0 rgba(255,255,255,.45); }
.shd .shd-go:hover:not(:disabled) { filter: brightness(1.06); }
.shd .shd-go .ico { color: var(--accent-ink); }
.shd .shd-alt, .shd .shd-alt:hover { font-weight: 700; color: var(--shd-ink); background: var(--shd-card); border: 1px solid var(--shd-line); box-shadow: none; }
.shd .shd-alt:hover:not(:disabled) { background: var(--shd-strip); border-color: var(--line-2); filter: none; }
.shd .shd-alt .ico { color: var(--shd-mut); }
.shd-hint { font-size: 12.5px; color: var(--shd-mut); }
.shd-hint.bad { color: var(--shd-red); font-weight: 700; }
.shd-confirm { width: 100%; padding: 14px 16px; border-radius: 14px; background: var(--shd-confirm); border: 1px solid var(--shd-confirm-line); border-inline-start: 5px solid var(--shd-gold); }
.shd-confirm > b { display: flex; align-items: center; gap: 8px; font-size: 15.5px; font-weight: 800; color: var(--shd-confirm-ink); }
.shd-confirm > b .ico { flex: none; color: var(--shd-gold); }
.shd-confirm p { margin: 8px 0 14px; white-space: pre-line; line-height: 1.8; color: var(--shd-ink); overflow-wrap: anywhere; }

/* آخرُ الورديات: جدولٌ يتمرّر في إطاره على الشاشة الضيّقة فلا تُقصّ أعمدتُه */
.shd-hist .table-wrap { border: 1px solid var(--line); border-radius: 10px; }

/* العروض: كلُّها بعرض الشاشة نفسِها (shd) أو قسمِها (shdsec) */
@container shd (min-width: 520px) {
  .shd-acts { flex-direction: row; flex-wrap: wrap; width: auto; }
  .shd .shd-go { min-width: 220px; }
  .shd .shd-alt { min-width: 150px; }
}
@container shd (min-width: 640px) {
  .shd-close .shd-body { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shd-s-cash { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 360px); align-items: center; column-gap: 18px; }
  .shd-s-cash h3 { margin: 0; }
}
@container shd (min-width: 700px) {
  .shd-open .shd-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .shd-open .shd-card.shd-emp { grid-column: auto; order: 0; }
  .shd-close .shd-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@container shd (max-width: 520px) {
  .shd-head { padding: 12px 14px; }
  .shd-head .pos-back { order: 9; flex: 1 0 100%; justify-content: center; }   /* رابطُ العودة سطرٌ تحت العنوان فلا يعصره */
  .shd-ttl h2 { font-size: 19px; }
  .shd-lock { width: 42px; height: 42px; }
  .shd-logo { width: 46px; height: 40px; }
  .shd-cards, .shd-body { padding-inline: 12px; }
  .shd-msg, .shd-note { margin-inline: 12px; }
  .shd-foot { padding-inline: 12px; }
  .shd-card b { font-size: 16px; }
}
@container shd (max-width: 330px) { .shd-cards { grid-template-columns: minmax(0, 1fr); } .shd-open .shd-card.shd-emp { order: 0; } }
@container shdsec (min-width: 400px) { .shd-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container shdsec (min-width: 820px) { .shd-fields { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { .shd-in { transition: none; } }

/* ═══ الفروعُ وتبديلُها (طلب المالك 2026-10-03): الفرعُ الحاليّ وأزرارُ الفروع الأخرى في رأس الرئيسية ولوحة نقطة البيع (BranchSwitch) ═══ */
.brsw { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.brsw-lab { font-size: 12.5px; color: var(--muted); margin-inline-end: 2px; }
.brsw-f { margin: 0; display: inline-flex; }
.brsw-cur, .brsw-go, .brsw-all { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 15px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.brsw-cur { background: var(--gold-grad); color: var(--accent-ink); }
.brsw-go { background: var(--panel); color: var(--text); border: 1px solid var(--line-2); cursor: pointer; font-family: inherit; box-shadow: none; }
.brsw-go:hover { filter: none; background: var(--gold-soft); border-color: var(--gold); }
/* طلب المالك 2026-10-03 (الثاني): فرعٌ خارجَ صلاحيات المستخدم — التبديلُ إليه بإعادة الدخول */
.brsw-go.brsw-lock { border-style: dashed; opacity: .82; }
.brsw-go.brsw-lock:hover { opacity: 1; }
.brsw-all { color: var(--muted); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; padding: 0 6px; }
.brsw-note { display: flex; align-items: flex-start; gap: 10px; margin-top: 10px; padding: 8px 12px; border-radius: 12px; font-size: 13px; line-height: 1.6;
  background: var(--ok-soft); border: 1px solid rgba(31,138,85,.35); color: var(--ok); }
.brsw-note.warn { background: var(--bad-soft); border-color: rgba(192,57,43,.4); color: var(--bad); }
.brsw-x { margin-inline-start: auto; background: none; border: none; color: inherit; font-size: 18px; line-height: 1; cursor: pointer; padding: 0 2px; box-shadow: none; filter: none; }
.brsw-link { color: inherit; text-decoration: none; }
.brsw-link:hover small, .brsw-link:focus-visible small { text-decoration: underline; text-underline-offset: 3px; }
/* في لوحة نقطة البيع: سطرٌ مضغوطٌ في الترويسة بألوان «صالة العرض»، والإشعارُ طافٍ أسفلَ الصالة فلا يزيد قامةَ الترويسة ولا يحجب الفرعَ المختار */
.pos-hall .brsw-pos { margin: 0; flex-wrap: nowrap; min-width: 0; overflow: hidden; }
.pos-hall .brsw-pos .brsw-lab { color: var(--ui-steel); }
.pos-hall .brsw-pos .brsw-cur { background: var(--gold-grad); color: var(--accent-ink); }
.pos-hall .brsw-pos .brsw-go { background: var(--h-btn-bg); color: var(--ui-ink); border-color: rgba(224,168,58,.45); }
.pos-hall .brsw-pos .brsw-all { color: var(--ui-mut); }
.brsw-toast { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); z-index: 30; width: max-content; max-width: min(560px, calc(100vw - 32px));
  margin: 0; box-shadow: 0 10px 28px rgba(0,0,0,.28); background: var(--panel); }
.brsw-toast.warn { background: var(--panel); }
@media (max-width: 560px) { .pos-hall .brsw-pos { flex-wrap: wrap; } }
@media print { .brsw, .brsw-note { display: none !important; } }

/* الدفعة 34 — فاتورةُ المبيعات: سطرُ الإدخال في ذيل الشبكة وقائمةُ الأصناف كالمكتبي وبلا باركود (طلب المالك 2026-10-04) */
.df-grid tbody tr.ns-entry td { background: var(--df-entry); }
.df-grid tbody tr.ns-entry:hover td { background: var(--df-entry-hov); }
.ns-entry-in { display: flex; gap: 4px; align-items: center; min-width: 280px; }
.ns-entry-in input { flex: 1; min-width: 120px; }
.ns-entry-in button { white-space: nowrap; padding: 2px 10px; height: 26px; }
.df-grid td.ns-entry-hint { font-size: 12px; white-space: normal; min-width: 220px; }
.pos-modal.ns-items .box { width: min(760px, 100%); display: flex; flex-direction: column; max-height: calc(100vh - 32px); }
.ns-items-q { font: inherit; width: 100%; padding: 8px 10px; margin: 4px 0 10px; border-radius: 10px; border: 1px solid rgba(224,168,58,.55); background: var(--h-input); color: var(--ui-ink); }
.ns-items-list { overflow: auto; min-height: 120px; max-height: 60vh; border: 1px solid var(--h-line); border-radius: 12px; }
.ns-items-list table { width: 100%; font-size: 13px; background: transparent; }
.ns-items-list th { position: sticky; top: 0; background: var(--h-th); color: var(--ui-gold-lt); border-bottom: 1px solid var(--h-line); padding: 7px 10px; }
.ns-items-list td { color: var(--ui-ink); background: transparent; border-bottom: 1px solid var(--h-line2); padding: 6px 10px; }
.ns-items-list td:nth-child(2) { white-space: normal; }
.ns-items-list tbody tr { cursor: pointer; }
.ns-items-list tbody tr:hover td { background: rgba(224,168,58,.16); }
.pos-modal.ns-items .act { align-items: center; justify-content: space-between; }

/* ═══ لوحةُ أسعار الذهب الحيّة (GoldStrip) — أضافتها الدفعة 46 لنقطة البيع والفواتير كلوحة المكتبي، وأعادت الدفعة 49 تصميمَها بطلب المالك 2026-10-15
   («أكثر احترافيّةً وإبداعاً وجاذبيّة، ومتناسقةً مع التصميم العامّ للويب، وعصريّة»): بطاقةٌ داكنةٌ بلغة لوحة الرئيسيّة (.gold-live) — نقطةُ «مباشر»
   نابضة، والأونصةُ كبيرةً بتغيّرها عن إغلاق الأمس ورسمِ حركتها، وكلُّ عيارٍ بشارةٍ كقطعة ذهب، ووهجٌ خفيفٌ على الأرقام عند كلّ تغيّر؛
   وفي قشرة نقطة البيع بألوان صالتها (الكحليّ والذهبيّ). الهندسةُ كما قِيست في 46: عمودٌ لاصقٌ يسارَ المحتوى (.workrow) من 1200 بكسل فأعرض
   بعرض 165، وشريطٌ لاصقٌ أعلى المحتوى دونها (46 بكسل في سطرٍ واحد متى اتّسع الشريط 860 فأكثر، وسطران دونها). لا يُطبع. ═══ */
.workrow { display: flex; align-items: flex-start; min-width: 0; }
.workrow > .content { flex: 1 1 auto; min-width: 0; }
.pos-shell .workrow { flex: 1 1 auto; }
.gpanel {
  --gp-hdr: 64px;
  --gp-bg: radial-gradient(150% 55% at 100% 0%, rgba(248,201,90,.22), transparent 62%), linear-gradient(172deg, #ffffff 0%, #fbf7ee 68%);
  --gp-line: rgba(198,138,36,.26); --gp-ink: #1d1a15; --gp-mut: #7b7468; --gp-gold: #9a6512; --gp-num: #1d1a15; --gp-card: rgba(198,138,36,.06);
  --gp-kbg: linear-gradient(160deg, rgba(248,201,90,.16), rgba(255,255,255,.4)); --gp-sh: 0 10px 28px rgba(31,26,18,.10), inset 0 1px 0 #fff;
  --gp-up: #1a7f4b; --gp-dn: #c0392b; --gp-upv: #1a7f4b; --gp-dnv: #c0392b;
  container-type: inline-size; direction: rtl; flex: none; width: 165px; box-sizing: border-box;
  position: sticky; top: calc(var(--gp-hdr) + 10px); align-self: flex-start; max-height: calc(100vh - var(--gp-hdr) - 20px); overflow-y: auto;
  margin: 10px 0 10px 10px; padding: 11px 11px 9px; border-radius: 18px;
  background: var(--gp-bg); color: var(--gp-ink); border: 1px solid var(--gp-line);
  box-shadow: var(--gp-sh);
  font-family: Tajawal, 'Segoe UI', Tahoma, sans-serif; line-height: normal; scrollbar-width: thin;
}
@media screen { :root[data-theme="dark"] .gpanel {
  --gp-bg: radial-gradient(150% 55% at 100% 0%, rgba(248,201,90,.16), transparent 62%), linear-gradient(172deg, #1e1c18 0%, #0e0e0f 68%);
  --gp-line: rgba(248,201,90,.22); --gp-ink: #f3ecdc; --gp-mut: #a39d90; --gp-gold: #f2c35c; --gp-num: #ffffff; --gp-card: rgba(255,255,255,.045);
  --gp-kbg: linear-gradient(160deg, rgba(248,201,90,.12), rgba(255,255,255,.02)); --gp-sh: 0 10px 28px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,236,180,.08);
  --gp-up: #7fdca4; --gp-dn: #ff9b8f; --gp-upv: #d6f6e2; --gp-dnv: #ffdcd6;
} }
.pos-shell .gpanel {
  --gp-hdr: 56px;
}
/* الرأس: حالُ المصدر ووقتُ آخر جلب */
.gp-head { display: flex; align-items: center; gap: 6px; padding: 0 2px 9px; margin-bottom: 10px; border-bottom: 1px solid var(--gp-line); font-size: 12px; line-height: 1.2; }
.gp-state { font-weight: 700; color: var(--gp-ink); white-space: nowrap; }
.gp-time { margin-inline-start: auto; color: var(--gp-mut); font-size: 11.5px; white-space: nowrap; }
.gp-dot { width: 8px; height: 8px; border-radius: 50%; background: #6d6352; flex: none; }
.gpanel.live .gp-dot { background: #58d68d; animation: gp-pulse 2s infinite; }
.gpanel.lag .gp-dot { background: #e0a43a; }
.gp-dot-in { display: none; }
@keyframes gp-pulse { 0% { box-shadow: 0 0 0 0 rgba(88,214,141,.6); } 70% { box-shadow: 0 0 0 7px rgba(88,214,141,0); } 100% { box-shadow: 0 0 0 0 rgba(88,214,141,0); } }
/* الأونصة */
.gp-ounce { padding: 9px 10px 8px; border-radius: 14px; background: var(--gp-card); border: 1px solid var(--gp-line); min-width: 0; }
.gp-cap { display: flex; align-items: baseline; gap: 5px; font-size: 12px; line-height: 1.2; color: var(--gp-mut); }
.gp-cap-t { color: var(--gp-gold); font-weight: 700; font-size: 13px; }
.gp-cap small { font-size: 10.5px; }
.gp-big { font-size: 24px; font-weight: 800; line-height: 1.2; margin-top: 3px; color: var(--gp-num); white-space: nowrap; text-align: right; transition: color .5s; }
.gpanel.up .gp-big { color: var(--gp-up); }
.gpanel.down .gp-big { color: var(--gp-dn); }
.gp-chg { display: inline-flex; align-items: center; gap: 3px; margin-top: 4px; padding: 1px 7px; border-radius: 999px; font-size: 11.5px; font-weight: 700; line-height: 1.5; }
.gp-chg.pos { color: var(--gp-up); background: rgba(88,214,141,.14); }
.gp-chg.neg { color: var(--gp-dn); background: rgba(255,120,105,.14); }
.gp-arr { font-size: 8.5px; }
.gp-spark { display: block; width: 100%; height: 28px; margin-top: 6px; }
.gp-spark .area { fill: rgba(227,185,90,.15); }
.gp-spark .line { fill: none; stroke: var(--gp-gold); stroke-width: 1.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
/* العيارات: بشارةٍ كقطعة ذهب — الأنقى أسطع */
.gp-karats { display: grid; gap: 7px; margin-top: 9px; }
.gp-k { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 13px; min-width: 0;
  background: var(--gp-kbg); border: 1px solid var(--gp-line); }
.gp-coin { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; direction: ltr;
  font: 800 13px/1 Tajawal, 'Segoe UI', sans-serif; color: #3d2b08; text-shadow: 0 1px 0 rgba(255,238,175,.7);
  background: radial-gradient(circle at 34% 28%, #fff6d2 0%, #f4d47c 30%, #c9962f 66%, #8a6418 100%);
  box-shadow: inset 0 0 0 2px rgba(255,241,196,.55), inset 0 -3px 4px rgba(90,60,10,.40), 0 2px 6px rgba(0,0,0,.35); }
.gp-k[data-k="22"] .gp-coin { filter: saturate(.94) brightness(.97); }
.gp-k[data-k="21"] .gp-coin { filter: saturate(.88) brightness(.93); }
.gp-k[data-k="18"] .gp-coin { filter: saturate(.78) brightness(.88) sepia(.12); }
.gp-kbody { min-width: 0; flex: 1 1 auto; }
.gp-klbl { font-size: 11.5px; font-weight: 700; line-height: 1.2; color: var(--gp-gold); white-space: nowrap; }
.gp-kval { font-size: 20px; font-weight: 800; line-height: 1.25; color: var(--gp-num); white-space: nowrap; text-align: right; transition: color .5s; }
.gpanel.up .gp-kval { color: var(--gp-upv); }
.gpanel.down .gp-kval { color: var(--gp-dnv); }
.gp-foot { margin-top: 9px; font-size: 10.5px; line-height: 1.3; color: var(--gp-mut); text-align: center; }
/* وهجٌ على الأرقام عند كلّ تغيّر: يتناوب اسمُ الحركة (t0/t1) فتُعاد مرّةً واحدة */
@keyframes gp-gu0 { from { text-shadow: 0 0 14px rgba(88,214,141,.95); } to { text-shadow: 0 0 0 rgba(88,214,141,0); } }
@keyframes gp-gu1 { from { text-shadow: 0 0 14px rgba(88,214,141,.95); } to { text-shadow: 0 0 0 rgba(88,214,141,0); } }
@keyframes gp-gd0 { from { text-shadow: 0 0 14px rgba(255,120,105,.95); } to { text-shadow: 0 0 0 rgba(255,120,105,0); } }
@keyframes gp-gd1 { from { text-shadow: 0 0 14px rgba(255,120,105,.95); } to { text-shadow: 0 0 0 rgba(255,120,105,0); } }
.gpanel.up.t0 .gp-fl { animation: gp-gu0 1.2s ease-out; }
.gpanel.up.t1 .gp-fl { animation: gp-gu1 1.2s ease-out; }
.gpanel.down.t0 .gp-fl { animation: gp-gd0 1.2s ease-out; }
.gpanel.down.t1 .gp-fl { animation: gp-gd1 1.2s ease-out; }
/* الشاشاتُ الضيّقة: شريطٌ لاصقٌ أعلى المحتوى بخاناته الخمس — الأونصةُ أعرضُها */
@media (max-width: 1199px) {
  .workrow { flex-wrap: wrap; }
  .gpanel { order: -1; flex: 1 1 100%; width: auto; max-height: none; overflow: visible; z-index: 9; top: var(--gp-hdr);
    margin: 0; padding: 6px 8px; border-radius: 0; border-width: 0 0 1px; min-height: 46px;
    display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(4, minmax(0, 1fr)); align-items: center;
    box-shadow: 0 6px 16px rgba(26,21,13,.12); }
  @media screen { :root[data-theme="dark"] .gpanel { box-shadow: 0 6px 16px rgba(0,0,0,.35); } }
  .gp-head, .gp-foot, .gp-spark, .gp-chg, .gp-cap small { display: none; }
  .gp-karats { display: contents; }
  .gp-dot-in { display: inline-block; align-self: center; }
  .gp-ounce, .gp-k { margin: 0; padding: 1px 8px; border: 0; border-radius: 0; background: none; min-width: 0; }
  /* الخانةُ سطران: «عيار» ثمّ بشارةِ رقمه (تُقرأ «عيار 24») فوق السعر */
  .gp-k { display: grid; grid-template-columns: auto auto minmax(0, 1fr); grid-template-areas: "l c ." "v v v"; align-items: center; column-gap: 4px; row-gap: 1px;
    border-inline-start: 1px solid var(--gp-line); }
  .gp-kn { display: none; }
  .gp-kbody { display: contents; }
  .gp-coin { grid-area: c; width: 16px; height: 16px; font-size: 8.5px; box-shadow: inset 0 0 0 1px rgba(255,241,196,.55), 0 1px 2px rgba(0,0,0,.30); }
  .gp-klbl { grid-area: l; font-size: 11px; overflow: hidden; text-overflow: ellipsis; }
  .gp-kval { grid-area: v; font-size: clamp(13px, 4.2cqw, 22px); overflow: hidden; }
  .gp-cap { align-items: center; }
  .gp-big { font-size: clamp(13px, 4.2cqw, 22px); margin-top: 1px; overflow: hidden; }
}
/* الشريطُ العريض (860 بكسل فأكثر داخل اللوحة): كلُّ خانةٍ في سطرٍ واحد — البشارةُ بجوار رقمها، والأونصةُ بتغيّرها — فلا يزيد الشريطُ عن 46 */
@container (min-width: 860px) {
  .gp-ounce { display: flex; align-items: center; gap: 8px; }
  .gp-big { margin-top: 0; font-size: 21px; }
  .gp-chg { display: inline-flex; margin-top: 0; }
  .gp-k { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "c v"; column-gap: 8px; }
  .gp-kn { display: inline; }
  .gp-klbl { display: none; }
  .gp-coin { width: 26px; height: 26px; font-size: 11px; }
  .gp-kval { font-size: 20px; }
}
/* قشرةُ نقطة البيع بين 901 و1199: الشريطُ (46) فوق الصالة — فلا تزيد الصالةُ (الشريط 56 والحشوة 28) الشاشةَ بارتفاعه */
@media screen and (min-width: 901px) and (max-width: 1199px) { .pos-shell .pos-hall { min-height: calc(100vh - 130px); } }
/* ارتفاعُ الرأس اللاصق فوق اللوحة: العامُّ 64 فوق 820 (الدفعة 50؛ كان 53) و56 دونها، ورأسُ نقطة البيع 56 دائماً */
@media (max-width: 820px) { .gpanel { --gp-hdr: 56px; } }
@media (prefers-reduced-motion: reduce) { .gpanel .gp-fl, .gpanel.live .gp-dot { animation: none; } .gp-big, .gp-kval { transition: none; } }
@media print { .gpanel { display: none !important; } .workrow { display: block; } }

/* ---------- الدفعة 48: القائمة الجانبيّة كقوائم المكتبي — بحثٌ، ومجموعاتٌ تُطوى، وتذييلٌ ثابت، ودرجُ هاتفٍ بخلفيّةٍ حاجبة ---------- */
/* القائمةُ وحدها تُمرَّر: شريطُ المستخدم (والخروجُ وتغييرُ كلمة المرور) ثابتٌ أسفلها لا يظهر بعد التمرير إلى آخرها */
.sidebar { overflow: hidden; }
.sidebar .nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-top: 8px; }
.sidebar .nav::-webkit-scrollbar { width: 6px; }
.sidebar .nav::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 3px; }
.sidebar .userbox { flex: none; }
/* البحث */
.sn-search { position: relative; flex: none; margin: 12px 10px 0; }
.sn-search > .ico { position: absolute; inset-inline-start: 11px; top: 50%; transform: translateY(-50%); color: var(--sidebar-mut); pointer-events: none; }
.sidebar .sn-search input {
  width: 100%; padding: 8px 10px; padding-inline-start: 34px; padding-inline-end: 32px;
  background: var(--input-bg); border: 1px solid var(--line-2); border-radius: 12px;
  color: var(--sidebar-text); font-size: 14px;
}
.sidebar .sn-search input::placeholder { color: var(--faint); }
.sidebar .sn-search input:focus { outline: 3px solid var(--focus); border-color: var(--gold); background: var(--input-bg); }
.sidebar .sn-search input::-webkit-search-cancel-button { display: none; }
.sidebar .sn-clear {
  position: absolute; inset-inline-end: 4px; top: 50%; transform: translateY(-50%);
  padding: 5px; background: transparent; border: 0; color: var(--sidebar-mut); border-radius: 8px; box-shadow: none;
}
.sidebar .sn-clear:hover { background: var(--gold-soft); color: var(--text); filter: none; }
/* المجموعات */
.sidebar .sn-grp-h {
  display: flex; align-items: center; gap: 11px; width: 100%; padding: 9px 12px; margin: 2px 0;
  background: transparent; border: 0; border-radius: 12px; box-shadow: none;
  color: var(--sidebar-text); font-size: 14.5px; font-weight: 700; text-align: start;
}
.sidebar .sn-grp-h > span { flex: 1; min-width: 0; }
.sidebar .sn-grp-h .ico { color: var(--sidebar-mut); transition: color .15s, transform .15s; }
.sidebar .sn-grp-h:hover { background: var(--gold-soft); color: var(--text); filter: none; }
.sidebar .sn-grp-h:hover .ico, .sidebar .sn-grp.has-active > .sn-grp-h .ico { color: var(--gold); }
.sidebar .sn-grp.has-active > .sn-grp-h { color: var(--gold-dark); }
.sidebar .sn-grp-h .sn-chev { color: var(--sidebar-mut); }
.sidebar .sn-grp.open > .sn-grp-h .sn-chev { transform: rotate(180deg); }
.sidebar .sn-grp-h:focus-visible, .sidebar .nav a:focus-visible { outline: 2px solid var(--gold-light); outline-offset: -2px; }
.sidebar .sn-grp > .sn-items { margin: 0 0 6px; margin-inline-start: 21px; padding-inline-start: 6px; border-inline-start: 1px solid var(--sidebar-line); }
.sidebar .sn-grp > .sn-items a { padding: 7px 10px; font-size: 14px; gap: 9px; }
.sidebar .sn-sub { height: 1px; margin: 5px 10px; background: var(--sidebar-line); }
.sidebar .sn-top { margin-bottom: 6px; padding-bottom: 6px; border-bottom: 1px solid var(--sidebar-line); }
.sidebar .sn-empty { padding: 14px 12px; color: var(--sidebar-mut); font-size: 13px; }
/* شريطُ المستخدم: تغييرُ كلمة المرور بجوار الخروج */
.sidebar .sn-ub-btn { display: inline-flex; padding: 7px; border-radius: 10px; color: var(--sidebar-text); }
.sidebar .sn-ub-btn:hover, .sidebar .sn-ub-btn.active { background: var(--gold-soft); color: var(--gold-dark); }
/* درجُ الهاتف: زرُّ إغلاقٍ في رأسه، وخلفيّةٌ حاجبةٌ تغلقه بالنقر */
.sidebar .sn-close { display: none; }
.sn-scrim { display: none; }
@media (max-width: 820px) {
  .sidebar .sn-close { display: inline-flex; margin-inline-start: auto; padding: 6px; color: var(--sidebar-text); background: transparent; border-color: transparent; box-shadow: none; }
  .sidebar .sn-close:hover { background: var(--gold-soft); filter: none; }
  .sn-scrim { display: block; position: fixed; inset: 0; z-index: 19; background: var(--scrim); }
}

/* ═══ الدفعة 50: الرئيسيّة كمربّعات التصميم 15 («بنتو»): الترحيبُ ثمّ مربّعُ الذهب المنصهر يميناً والمؤشّراتُ حوله، ثمّ الأزرارُ الدائريّة
   والحركةُ والعياراتُ وأعلى العملاء — بأرقام لوحة المؤشّرات نفسِها (SummaryAsync وTrendAsync وTopCustomersAsync) بلا استعلامٍ جديد ═══ */
.h15-hi { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; margin-bottom: 18px; }
.h15-hello { min-width: 0; }
.h15-hello small { color: var(--muted); font-size: 12.5px; }
.h15-hello h2 { margin: 2px 0 0; font-size: 30px; font-weight: 700; line-height: 1.3; }
.h15-hello h2 em { font-style: normal; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.h15-hello p { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; }
.h15-hello .brsw { margin-top: 8px; }
.h15-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.h15-tools select { height: 40px; padding: 6px 12px; border-radius: 12px; }
.h15-tools button { height: 40px; }
.h15 { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-areas: "gold gold k1 k2" "gold gold k3 k4" "k5 k6 k7 k8" "acts trend trend trend" "karat karat top top"; }
.h15.nodash { grid-template-areas: "gold gold gold acts" "note note note note"; }
.h15 > .gold-live { grid-area: gold; margin: 0; }
.h15 > .k1 { grid-area: k1; } .h15 > .k2 { grid-area: k2; } .h15 > .k3 { grid-area: k3; } .h15 > .k4 { grid-area: k4; }
.h15 > .k5 { grid-area: k5; } .h15 > .k6 { grid-area: k6; } .h15 > .k7 { grid-area: k7; } .h15 > .k8 { grid-area: k8; }
.h15 > .h15-acts { grid-area: acts; } .h15 > .h15-trend { grid-area: trend; } .h15 > .h15-karat { grid-area: karat; } .h15 > .h15-top { grid-area: top; }
.h15 > .h15-note { grid-area: note; }
.h15 > .card, .h15 > .panel { margin: 0; border-radius: var(--radius-lg); min-width: 0; }
.h15 > .card.stat { padding: 16px 18px 14px; align-content: space-between; min-height: 128px; }
.h15 > .card.stat .value { font-size: 28px; }
.h15 > .card.stat .chip { width: 40px; height: 40px; }
.h15 > .panel { padding: 16px 18px; }
.h15 > .panel h2 { font-size: 15px; }
/* أزرارُ العمل الدائريّة: الأوّلُ ذهبٌ منصهر */
.h15-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 8px; padding: 14px; }
.h15-acts a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 10px 4px; border-radius: 18px;
  color: var(--text); font-size: 13px; font-weight: 500; text-align: center; transition: background .15s; }
.h15-acts a:hover { background: var(--gold-soft); }
.h15-acts a:focus-visible { outline: 2px solid var(--gold-light); outline-offset: -2px; }
.h15-acts a > i { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--gold-soft); color: var(--gold-dark);
  box-shadow: inset 0 0 0 1px rgba(198,138,36,.28); }
.h15-acts a.prim > i { background: var(--molten); color: var(--accent-ink); box-shadow: 0 8px 18px rgba(198,138,36,.32), inset 0 1px 0 rgba(255,255,255,.5); }
.h15-trend .chart { height: 200px; }
.h15-trend details { margin-top: 8px; }
.h15-trend summary { cursor: pointer; color: var(--muted); font-size: 12.5px; }
.h15-trend .table-wrap { max-height: 300px; overflow: auto; margin-top: 8px; border: 1px solid var(--line); border-radius: 14px; }
.h15-legend { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 6px; color: var(--muted); font-size: 12px; }
.h15-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-inline-end: 6px; vertical-align: -1px; }
.h15-bars { display: grid; gap: 3px; }
.h15-bars span { display: block; height: 7px; border-radius: 4px; }
.h15-bars .s { background: var(--gold-grad); }
.h15-bars .p { background: var(--faint); }
@media (max-width: 1280px) {
  .h15 { grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "gold gold" "k1 k2" "k3 k4" "k5 k6" "k7 k8" "acts trend" "karat top"; }
  .h15.nodash { grid-template-areas: "gold gold" "acts acts" "note note"; }
}
@media (max-width: 900px) {
  .h15 { grid-template-areas: "gold gold" "k1 k2" "k3 k4" "k5 k6" "k7 k8" "acts acts" "trend trend" "karat karat" "top top"; }
}
@media (max-width: 600px) {
  .h15 { grid-template-columns: minmax(0, 1fr); grid-template-areas: "gold" "k1" "k2" "k3" "k4" "k5" "k6" "k7" "k8" "acts" "trend" "karat" "top"; gap: 12px; }
  .h15.nodash { grid-template-areas: "gold" "acts" "note"; }
  .h15-hello h2 { font-size: 24px; }
  .h15-acts { grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 10px; }
  .h15-acts a > i { width: 46px; height: 46px; }
  .h15-acts a { font-size: 12px; }
}

/* جدولٌ في لوحة (.table-wrap.panel) كان يُقصّ بلا تمرير متى ضاقت الشاشة (overflow: hidden — قبل الدفعة)؛ على الشاشة يتمرّر أفقيّاً، والطباعةُ كما كانت */
@media screen { .table-wrap.panel { overflow-x: auto; } }
/* رمزُ QR في شريط الأوزان على الهاتف: سطرٌ وحده في الوسط (كان يفيض عن النموذج 9 بكسل) */
@media screen and (max-width: 820px) { .df-weights .qr { grid-column: 1 / -1; justify-self: center; } }

/* المخطّطاتُ والأشرطةُ والتبويبات: ألوانُ الوضع (كانت ثابتةً في SVG وفي القواعد) */
.chart line { stroke: var(--line-2); }
.chart text { fill: var(--muted); }
.chart #cg stop:first-child { stop-color: #f8c95a; }
.chart #cg stop:last-child { stop-color: #c68a24; }
.hbar-track { background: var(--sunken); }
.tabs a { background: var(--panel); border-color: var(--line); color: var(--text); border-radius: 12px; }
.tabs a:hover { background: var(--gold-soft); }
.tabs a.active { background: var(--gold-grad); color: var(--accent-ink); border-color: transparent; }

/* ═══ الأوراقُ والمطبوعات: المستندُ (doc) وأوراقُ التقارير (v4) والملصقات وما عُلِّم paper تبقى بألوان ما قبل الدفعة وخطِّها في الوضعين —
   ورقةٌ بيضاءُ على سطح الوضع الداكن كما تُطبع. ═══ */
.doc, .v4, .label-sheet, .paper {
  color-scheme: light;
  --gold: #b8892d; --gold-dark: #8a6418; --gold-light: #e3b95a; --gold-soft: #f6eedb;
  --gold-grad: linear-gradient(135deg, #f3d27a 0%, #c9962f 50%, #8a6418 100%); --molten: var(--gold-grad); --accent-ink: #fff;
  --bg: #f6f3ec; --panel: #ffffff; --panel-2: #ffffff; --sunken: #f3eee3; --input-bg: #ffffff; --text: #2b2418; --muted: #7a7064; --faint: #cdb98d;
  --line: #e8e1d3; --line-2: #e8e1d3; --ok: #2e7d4f; --bad: #b3261e; --sea: #1f5f7a;
  --ok-soft: #e3f3ea; --bad-soft: #fbe4e2; --sea-soft: #e0eef4; --warn-soft: #f6eedb;
  --th-bg: #faf5e9; --th-ink: #6f5a33; --row-hover: #fcf9f2; --foot-bg: #faf6ec;
  --shadow: 0 1px 2px rgba(43,36,24,.04), 0 4px 16px rgba(43,36,24,.06); --radius: 14px;
  font-family: 'Tajawal', 'Segoe UI', Tahoma, sans-serif;
}
/* وورقةُ v4 لها حبرُها وتباعدُ أسطرها وحجمُها منذ صُمّمت (‎.v4 { color: var(--v4-ink); line-height: 1.55; font-size: 12.5px }‎) فلا تُمسّ */
.doc, .label-sheet, .paper { font-size: 15px; line-height: normal; color: var(--text); }

/* ═══ الطباعة: قيمُ ما قبل الدفعة وخطُّها على الصفحة كلِّها في الوضعين — فالمطبوعُ كما كان ═══ */
@media print {
  /* «!important» يغلب color-scheme الذي يضعه js/theme.js على html نفسِه: بدونه تُطبع حواشي الورقة داكنةً في الوضع الداكن.
     و«normal» كما كان قبل الدفعة لا «light»: بـ«light» اختلف رسمُ النصّ الفاتح على رأس ورقة الكشف الداكن بكسلاتٍ قليلة */
  :root, :root[data-theme="dark"] {
    color-scheme: normal !important;
    --gold: #b8892d; --gold-dark: #8a6418; --gold-light: #e3b95a; --gold-soft: #f6eedb;
    --gold-grad: linear-gradient(135deg, #f3d27a 0%, #c9962f 50%, #8a6418 100%); --molten: var(--gold-grad); --accent-ink: #fff;
    --bg: #f6f3ec; --panel: #ffffff; --panel-2: #ffffff; --sunken: #f3eee3; --input-bg: #ffffff; --text: #2b2418; --muted: #7a7064; --faint: #cdb98d;
    --line: #e8e1d3; --line-2: #e8e1d3; --ok: #2e7d4f; --bad: #b3261e; --sea: #1f5f7a; --warn: #9a6512;
    --ok-soft: #e3f3ea; --bad-soft: #fbe4e2; --sea-soft: #e0eef4; --warn-soft: #f6eedb;
    --th-bg: #faf5e9; --th-ink: #6f5a33; --row-hover: #fcf9f2; --foot-bg: #faf6ec;
    --shadow: 0 1px 2px rgba(43,36,24,.04), 0 4px 16px rgba(43,36,24,.06); --radius: 14px;
    --c-gold: #9a6c12; --c-gold-bg: #f8ecd0; --c-green: #2e7d4f; --c-green-bg: #e2f3e8; --c-sea: #1f5f7a; --c-sea-bg: #e0eef4;
    --c-rose: #b3412f; --c-rose-bg: #fbe7e4; --c-violet: #5b4a9a; --c-violet-bg: #ece8f7; --c-sand: #6f6150; --c-sand-bg: #f1ece2;
    --hl-warn: #fffbeb; --hl-soft: #fbf8f1; --hl-cash: #fdfaf3; --hl-bad: #fdf2f2; --hl-bad2: #fbd3c4; --hl-gold: #fff7cc; --hl-red: #fdecec; --hl-sea: #e8f1fd;
  }
  body { font-family: 'Tajawal', 'Segoe UI', Tahoma, sans-serif; font-size: 15px; line-height: normal; color: var(--text); }
  .doc, .v4, .label-sheet, .paper { color-scheme: normal; }
  /* نماذجُ الفواتير (df) إن طُبعت: ألوانُ ما قبل الدفعة وزواياها */
  .df, :root[data-theme="dark"] .df {
    --df-bg: #eef1f5; --df-title: linear-gradient(180deg, #fbfcfe, #e7ecf2); --df-line: #c9d2dc; --df-line2: #b8c3cf; --df-in: #fff; --df-ro: #f1f5f9; --df-hl: #fffbeb;
    --df-group: #f8fafc; --df-cap: #334155; --df-ink: #0f172a; --df-th: linear-gradient(180deg, #f8fafc, #e2e8f0); --df-th-ink: #1e293b; --df-th-line: #d5dde6;
    --df-cell: #eef1f5; --df-hover: #fef9c3; --df-side: #e2e8f0; --df-tafkit: #1e3a8a; --df-wi: #64748b; --df-entry: #fffbeb; --df-entry-hov: #fef3c7;
    --df-t-sale: #1d4ed8; --df-t-buy: #0f766e; --df-t-ret: #b45309; --df-t-out: #b91c1c;
    --df-new: #dcfce7; --df-new-ink: #166534; --df-view: #e0e7ff; --df-view-ink: #3730a3; border-radius: 10px;
  }
  .df-group, .df-totals { border-radius: 6px; }
  .df-grid, .df-pay, .df-under { border-radius: 4px; }
  .df-under { border-radius: 0 0 4px 4px; }
  .df-f input, .df-f select, .df-f .ro, .df-totals .tr b, .df-pay .comm .tr b, .df-weights .w b, .df-weights .w i { border-radius: 3px; }
  .df-grid td input { border-color: #cbd5e1; border-radius: 2px; }
  .df-weights .w small { color: #475569; }
  .df-totals .due { background: #0f172a; color: #fde68a; border-radius: 6px; box-shadow: none; }
  .df-totals .due small { color: #cbd5e1; }
  .tb-acts, .pb-theme { display: none !important; }
  /* بطاقاتُ الأرقام أعلى التقارير، والحقولُ والتنبيه، بهيئة ما قبل الدفعة في المطبوع (الأيقونةُ بجوار النصّ، والرقمُ 22 بوزن 800، والزوايا) —
     فلا يتغيّر من مطبوع التقارير إلّا إطارٌ متقطّعٌ كان يحيط عناوينَ البطاقات خطأً (قاعدةُ ملصقات الباركود، صارت مقيّدةً بـ‎.label-sheet‎) */
  .card .value { font-weight: 800; }
  .card.stat { display: flex; gap: 14px; align-items: flex-start; }
  .card.stat .chip { width: 44px; height: 44px; }
  .card.stat .body { display: block; min-width: 0; }
  .card.stat .label { align-self: auto; font-weight: inherit; }
  .card.stat .value { margin-top: 6px; font-size: 22px; font-weight: 800; letter-spacing: normal; line-height: inherit; overflow-wrap: normal; }
  .card.stat .sub { margin-top: 4px; }
  .card.stat::after { content: ''; position: absolute; inset: auto -30px -30px auto; width: 90px; height: 90px; border-radius: 50%; background: currentColor; opacity: .04; }
  input, select { border-radius: 9px; }
  input::placeholder { color: revert; }
  .alert { border-radius: 10px; }
  /* والأزرارُ (زرُّ «+ سطر» في القيد يُطبع)، والتبويبات، واللافتةُ الداكنة (فحصُ الجاهزيّة) كذلك */
  button, .btn { background: var(--gold); border: 1px solid var(--gold); color: #fff; border-radius: 9px; box-shadow: none; font-weight: inherit; }
  button.ghost, .btn.ghost { background: transparent; color: var(--gold-dark); border-color: var(--gold); font-weight: inherit; }
  .tabs a { border-radius: 10px; }
  .tabs a.active { color: #1a150d; }
  .hero { border-radius: 18px; box-shadow: none; background: url('../img/pattern.svg') repeat, linear-gradient(120deg, #2a2113, #120e08 70%);
    background-size: 70px 70px, auto; background-blend-mode: soft-light, normal; }
}

/* ═══════════ الدفعة 53 — الهويّةُ الموحّدة للمطبوعات (CLS_InvoiceIdentity في المكتبي، اعتمادُ المالك 2026-07-22) ═══════════
   «السجلُّ المحاسبيُّ الصارم»: ورقةٌ بيضاء وحبرٌ فحميّ 17 وثانويٌّ 68، وتعبئاتٌ رماديّة 236/248، وحدودٌ 190 و92، والذهبُ 164,127,52 في خطّ الترويسة وحده.
   المقاييسُ بالمليمتر من إحداثيّات الباني (عُشرُ المليمتر)، والخطوطُ بالنقطة: Dubai وDubai Medium، وكتلةُ العلامة صورةٌ متّجهةٌ بخطّ GE Hili (img/id-brand.svg). */
.idp { --id-ink: #111111; --id-sec: #444444; --id-line: #5c5c5c; --id-cream: #bebebe; --id-alt: #f8f8f8; --id-deep: #ececec; --id-brand: #a47f34;
  --id-font: Dubai, 'Segoe UI', Tahoma, sans-serif; --id-fontm: 'Dubai Medium', Dubai, 'Segoe UI', Tahoma, sans-serif; }

/* الشاشة: الإطارُ شفّاف — ترويسةُ الهويّة وبطاقاتُها وتذييلُها للمطبوع، والمحتوى كما هو (إلّا الورقةَ المعروضة: .idp-scr) */
@media screen {
  .idp:not(.idp-scr) .idp-head, .idp:not(.idp-scr) .idp-lcards, .idp:not(.idp-scr) .idp-crit, .idp:not(.idp-scr) .idp-foot { display: none; }
  .idp:not(.idp-scr) > .idp-frame, .idp:not(.idp-scr) > .idp-frame > tbody, .idp:not(.idp-scr) > .idp-frame > tbody > tr,
  .idp:not(.idp-scr) > .idp-frame > tbody > tr > td { display: block; width: auto; padding: 0; border: 0; background: none; white-space: normal; }
  .idp:not(.idp-scr) > .idp-frame > thead, .idp:not(.idp-scr) > .idp-frame > tfoot { display: none; }
  .idp:not(.idp-scr) > .idp-frame > tbody > tr:hover > td { background: none; }
  /* الورقةُ المعروضة: بعرض A4 على خلفيّةٍ بيضاء كالورق في الوضعين */
  .idp.idp-scr { background: #fff; color: var(--id-ink); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); margin: 0 auto 18px;
    padding: 6mm 9.9mm; overflow-x: auto; }
  .idp.idp-scr.idp-port { max-width: calc(190.2mm + 19.8mm + 2px); }
  .idp.idp-scr.idp-land { max-width: calc(277.2mm + 19.8mm + 2px); }
  .idp.idp-scr > .idp-frame { min-width: 150mm; }
  .idp.idp-scr > .idp-frame > tfoot { display: none; }
  .idp.idp-scr .idp-foot { margin-top: 4mm; }
}

.idp > .idp-frame { width: 100%; border-collapse: collapse; background: none; table-layout: fixed; }
.idp > .idp-frame > * > tr > td { padding: 0; border: 0; background: none; white-space: normal; text-align: start; font-weight: normal; }
.idp, .idp * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

/* ── الترويسة (Header_، vb:122-161): 30.6 مم ── */
.idp-head { position: relative; height: 30.6mm; font-family: var(--id-font); color: var(--id-ink); direction: rtl; }
.idp-t { position: absolute; left: 0; top: 6mm; width: 62mm; height: 6.2mm; text-align: right; white-space: nowrap; overflow: hidden;
  font: 700 11pt/6.2mm var(--id-fontm); color: var(--id-ink); }
.idp-land .idp-t { width: calc(100% - 90mm); }
.idp-en { position: absolute; left: 0; top: 12.6mm; width: 62mm; height: 3.4mm; text-align: left; white-space: pre; overflow: hidden;
  font: 400 7pt/3.4mm var(--id-font); color: var(--id-sec); direction: ltr; }
.idp-land .idp-en { width: calc(100% - 90mm); }
.idp-badge { position: absolute; left: 0; top: 17mm; width: 42mm; height: 7.1mm; box-sizing: border-box; background: var(--id-deep); border: 1px solid var(--id-line); }
.idp-badge i { position: absolute; left: 34.2mm; top: 1mm; width: 6.4mm; height: 5mm; font: normal 400 6.7pt/5mm var(--id-font); text-align: right; color: var(--id-ink); }
.idp-badge b { position: absolute; left: 1mm; top: 0.6mm; width: 32mm; height: 5.8mm; font: 700 11.2pt/5.8mm var(--id-font); text-align: center; color: var(--id-ink);
  white-space: nowrap; overflow: hidden; }
.idp-brand { position: absolute; right: 19.2mm; top: 4.4mm; width: 66mm; height: 21.8mm; }
.idp-logo { position: absolute; right: 0.4mm; top: 4mm; width: 16.4mm; height: 16.4mm; object-fit: contain; }
.idp-rule { position: absolute; left: 0; right: 0; top: 29.2mm; height: 0; border-top: 0.3mm solid var(--id-brand); }

/* ── بطاقاتُ الكشف (BuildList vb:300-314: 11.8 مم وفاصل 2.4 مم) وبطاقاتُ المستند (IdCards) ── */
.idp-lcards { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 2.4mm; margin: 1.8mm 0 1.4mm; direction: rtl; }
.idp-card { position: relative; height: 11.8mm; box-sizing: border-box; background: #fff; border: 1px solid var(--id-cream); font-family: var(--id-font); color: var(--id-ink); }
/* تسميةُ البطاقة في يسارها: Meta_ ترسمها MiddleRight مع RightToLeft=Yes فيعكسها DevExpress — وهكذا تُطبع في المكتبي واعتمدها المالك */
.idp-card > i { position: absolute; top: 0.6mm; right: 1mm; left: 1mm; height: 3.4mm; font: normal 400 6.7pt/3.4mm var(--id-font); text-align: left; color: var(--id-ink);
  white-space: nowrap; overflow: hidden; }
.idp-card > b { position: absolute; top: 4mm; right: 1mm; left: 1mm; bottom: 0.8mm; display: flex; align-items: center; justify-content: center; text-align: center;
  font: 700 9.2pt/1.25 var(--id-font); color: var(--id-ink); overflow: hidden; white-space: pre-wrap; }
.idp-card > b.num { font-size: 9.5pt; direction: ltr; unicode-bidi: isolate; }
.idp-cards { display: flex; flex-direction: column; gap: 1.2mm; margin: 1mm 0 1.6mm; }
.idp-cards > div { display: grid; grid-template-columns: repeat(var(--n, 2), minmax(0, 1fr)); gap: 2.4mm; direction: rtl; }
.idp-cards .idp-card { height: 12.4mm; }
/* البيانُ الطويل: المكتبيُّ يقصّه سطراً واحداً (Meta_ بارتفاعٍ ثابت 7.6 مم)، والويبُ يُتمّه في سطرين بالبطاقة نفسِها */
.idp-cards .idp-card > b { line-height: 1.15; }
.idp-cards .idp-card.tall { height: 19mm; }
/* بطاقاتُ السند (BuildVoucher vb:98-118): الصفوفُ بفاصل 1.6 مم (CY += RowH + 16) لا 1.2 مم كبطاقات المستند */
.idp-cards.idp-vcards { gap: 1.6mm; }

/* ── «معايير التقرير» (Criteria_ vb:179-190): شريطٌ 6.6 مم ── */
.idp-crit { position: relative; height: 6.6mm; box-sizing: border-box; margin: 0 0 1.2mm; background: var(--id-alt); border: 0.2mm solid var(--id-cream); direction: rtl; }
.idp-head + .idp-crit { margin-top: 0.8mm; }
.idp-dsp { height: 0.8mm; }
.idp-crit > b { position: absolute; right: 2mm; top: 0.2mm; width: 26mm; height: 5.6mm; font: 700 8pt/5.6mm var(--id-fontm); color: var(--id-ink); text-align: left; white-space: nowrap; }
.idp-crit > span { position: absolute; left: 2mm; right: 30mm; top: 0.2mm; height: 5.6mm; font: 400 7.8pt/5.6mm var(--id-font); color: var(--id-sec); text-align: left;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── الكشفُ الجدوليّ (IdList ← BuildList vb:323-457) ── */
/* كلُّ صفٍّ في الباني جدولٌ مستقلٌّ بحدودٍ كاملة، فيتضاعف الخطُّ الأفقيُّ بين الصفوف ويبقى العموديُّ مفرداً — والصفُّ ينمو بسطر خطّ دبي (≈4.95 مم) */
table.idl { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: #fff; direction: rtl; font-family: var(--id-font); color: var(--id-ink); }
.idl > thead > tr > th, .idl > tbody > tr > td { position: static; border: 1px solid var(--id-cream); border-right-width: 0; padding: 0.3mm 0.3mm; text-align: center; vertical-align: middle;
  white-space: normal; overflow-wrap: anywhere; color: var(--id-ink); line-height: 4.65mm; }
.idl > thead > tr > th:first-child, .idl > tbody > tr > td:first-child { border-right-width: 1px; }
.idl > thead > tr > th { background: var(--id-deep); font: 700 8.4pt/4.65mm var(--id-fontm); }
.idl > tbody > tr > td { background: #fff; font: 400 8.2pt/4.65mm var(--id-font); }
.idl > tbody > tr:nth-child(even) > td { background: var(--id-alt); }
.idl > tbody > tr:hover > td { background: inherit; }
.idl > tbody > tr > td.idl-nm { font-size: 8pt; direction: ltr; unicode-bidi: isolate; font-variant-numeric: tabular-nums; }
.idl > tbody > tr > td.idl-n { font-size: 7.8pt; }
.idl-rules { position: relative; height: 1.2mm; border-top: 0.36mm solid var(--id-ink); }
.idl-rules::after { content: ""; position: absolute; left: 0; right: 0; top: 0.32mm; border-top: 0.18mm solid var(--id-ink); }
.idl.idl-tot > tbody > tr > td { background: var(--id-deep); border-color: var(--id-line); font: 700 8.6pt/4.65mm var(--id-fontm); }
.idl.idl-tot > tbody > tr > td.idl-nm { font-family: var(--id-font); }
.idl.idl-tot > tbody > tr > td.idl-cap { font-family: var(--id-fontm); text-align: right; padding-right: 1.2mm; }

/* ── جدولُ الشاشة نفسِه في المطبوع بثياب «طباعة الشبكة» (MGen.dgv_Print2 vb:629-674): رأسٌ 236 بحدود 92 وخطٍّ «Dubai Medium» 10.5،
   وصفوفٌ Dubai 10 موسَّطةٌ متناوبة أبيض/248 بخطوط 190، وشريطُ المجاميع 236 بخطّ «Dubai Medium» 10 ── */
@media print {
  .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) { width: 100%; border-collapse: collapse; background: #fff; direction: rtl; table-layout: auto; font-family: var(--id-font); color: var(--id-ink); }
  .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) > thead > tr > th { position: static; background: var(--id-deep); color: var(--id-ink); border: 1px solid var(--id-line);
    font: 400 10.5pt/1.35 var(--id-fontm); text-align: center; vertical-align: middle; white-space: normal; padding: 0.5mm 0.6mm; }
  .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) > tbody > tr > td, .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) > tbody > tr > th { border: 1px solid var(--id-cream); background: #fff;
    font: 400 10pt/1.35 var(--id-font); color: var(--id-ink); text-align: center; vertical-align: middle; white-space: normal; padding: 0.4mm 0.6mm; }
  .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) > tbody > tr:nth-child(even) > td { background: var(--id-alt); }
  .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) > tfoot > tr > td, .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) > tfoot > tr > th { background: var(--id-deep); color: var(--id-ink);
    border: 1px solid var(--id-line); font: 400 10pt/1.35 var(--id-fontm); text-align: center; vertical-align: middle; white-space: normal; padding: 0.4mm 0.6mm; }
  .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) > thead { display: table-header-group; }
  .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) tr { break-inside: avoid; }
  .idp table:not(.idl):not(.idp-frame):not(.idp-pay):not(.idd):not(.idt) .badge { background: none; padding: 0; color: inherit; font-size: inherit; }
  .idp .table-wrap, .idp .panel { overflow: visible; border: 0; box-shadow: none; padding: 0; background: none; }
  /* مجموعاتُ الشاشة داخل الإطار أقسامٌ كأقسام BuildSections (vb:647-655): شريطُ عنوانٍ 236 بحدٍّ 92 وخطٍّ «Dubai Medium» 9.4 */
  .idp .df-group { background: #fff; border: 0; box-shadow: none; padding: 0; margin: 0 0 2.4mm; border-radius: 0; }
  .idp .df-group > .cap, .idp .panel > h2, .idp .panel > h3 { position: static; display: block; transform: none; background: var(--id-deep); color: var(--id-ink);
    border: 1px solid var(--id-line); border-radius: 0; font: 700 9.4pt/1.4 var(--id-fontm); padding: 0.8mm 2mm; margin: 0 0 0.8mm; text-align: right; }
  .idp .panel > h2 .ico, .idp .panel > h3 .ico { display: none; }
  .idp .stamp { border-color: currentColor; }
}

/* ── بطاقةُ المبلغ (BuildVoucher vb:126-145): إطارٌ 92 سمكُه 1.2 بارتفاع 21.4 مم (30 مم مع التفقيط)، والتسميةُ يميناً والمبلغُ 30 عريضاً وسطاً والعملةُ يساراً ── */
.idp-amt { position: relative; box-sizing: border-box; border: 0.32mm solid var(--id-line); background: #fff; height: 21.4mm; margin: 0.8mm 0 3mm; font-family: var(--id-font); color: var(--id-ink); }
.idp-amt.words { height: 30mm; }
.idp-amt > i { position: absolute; right: 4mm; top: 2.4mm; width: 38mm; text-align: left; white-space: nowrap; font: normal 700 10pt/5.6mm var(--id-fontm); color: var(--id-ink); }
.idp-amt > b { position: absolute; left: 30mm; right: 34mm; top: 6mm; height: 13mm; display: flex; align-items: center; justify-content: center; font: 700 30pt/1 var(--id-font); color: var(--id-ink); }
.idp-amt > .cur { position: absolute; left: 7mm; top: 9.6mm; width: 23mm; height: 7mm; text-align: center; font: 400 11pt/7mm var(--id-font); color: var(--id-sec); white-space: nowrap; overflow: hidden; }
.idp-amt > hr { position: absolute; left: 6mm; right: 6mm; top: 21.2mm; margin: 0; border: 0; border-top: 1px solid var(--id-cream); }
.idp-amt > .words { position: absolute; left: 4mm; right: 4mm; top: 22mm; height: 6.2mm; text-align: left; font: 400 8.8pt/6.2mm var(--id-font); color: var(--id-sec); white-space: nowrap; overflow: hidden; }
/* ── جدولُ تفاصيل المستند (IdDocTable ← BuildDocument vb:131-195): رأسٌ 236 بخطّ «Dubai Medium» 8.6 وصفوفٌ بيضاءُ بخطّ Dubai 8.4، وحدودٌ 190
   والخطُّ الأفقيُّ مضاعفٌ (الرأسُ والصفُّ جدولان في الباني)؛ والرقمُ لا ينكسر فيأخذ عرضَه من النصوص (table-layout: auto) ── */
table.idd { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: auto; background: #fff; direction: rtl; font-family: var(--id-font); color: var(--id-ink); margin: 0; }
.idd > thead > tr > th, .idd > tbody > tr > td { position: static; border: 1px solid var(--id-cream); border-right-width: 0; text-align: center; vertical-align: middle; color: var(--id-ink); }
.idd > thead > tr > th:first-child, .idd > tbody > tr > td:first-child { border-right-width: 1px; }
.idd > thead > tr > th { background: var(--id-deep); font: 700 8.6pt/5mm var(--id-fontm); height: 5.8mm; padding: 0 0.4mm; white-space: normal; }
.idd > tbody > tr > td { background: #fff; font: 400 8.4pt/5mm var(--id-font); height: 6.1mm; padding: 0.5mm 0.4mm; white-space: normal; overflow-wrap: break-word; }
.idd > tbody > tr:hover > td { background: #fff; }
.idd > tbody > tr > td.idd-nm { font-size: 8.2pt; direction: ltr; unicode-bidi: isolate; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* ── إجماليّاتُ المستند (IdTotals ← BuildDocument vb:225-256): نصفُ العرض في جهة البداية، والتسميةُ (1.1) يمينَ القيمة (1.0)، وصفوفٌ 5.6 مم ── */
table.idt { width: 50%; margin: 0.8mm 0 1.6mm; margin-inline-end: auto; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: none; direction: rtl;
  font-family: var(--id-font); color: var(--id-ink); }
.idt > tbody > tr > td { position: static; height: 6.3mm; padding: 0 0.6mm; text-align: center; vertical-align: middle; background: var(--id-deep); color: var(--id-ink); white-space: normal; }
.idt > tbody > tr > td.cap { border: 1px solid var(--id-cream); border-left-width: 0; font: 700 8.8pt/1.2 var(--id-fontm); white-space: pre-wrap; }
.idt > tbody > tr > td.val { border: 1px solid var(--id-line); font: 700 9pt/1.2 var(--id-font); direction: ltr; unicode-bidi: isolate; white-space: nowrap; }
.idt > tbody > tr + tr > td { border-top-width: 0; }
.idt > tbody > tr:hover > td { background: var(--id-deep); }
.idt-words { height: 5.8mm; margin: 0 0 1.2mm; text-align: center; font: 400 8.8pt/5.8mm var(--id-font); color: var(--id-sec); white-space: nowrap; overflow: hidden; }
/* ── التواقيع (Signatures_ vb:193-201) ── */
.idp-signs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6mm; margin: 2mm 0 4mm; direction: rtl; }
.idp-signs > div { text-align: center; font: 700 8.6pt/4.4mm var(--id-fontm); color: var(--id-sec); }
.idp-signs > div::after { content: ""; display: block; margin: 5.2mm 4mm 0; border-top: 1px solid var(--id-cream); }
/* ── سطورُ الدفع في السند (PaymentLines_ vb:166-219): رأسٌ 248 بحدٍّ 190 وصفوفٌ 6.4 مم، وأعرضُ عمودين للطريقة والحساب ── */
table.idp-pay { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: #fff; direction: rtl; font-family: var(--id-font); color: var(--id-ink); margin: 0 0 1.6mm; }
.idp-pay > thead > tr > th { position: static; background: var(--id-alt); border: 1px solid var(--id-cream); border-left-width: 0; border-right-width: 0; height: 6.4mm; padding: 0 0.4mm;
  font: 700 8pt/1.2 var(--id-font); text-align: center; color: var(--id-ink); white-space: normal; }
.idp-pay > tbody > tr > td { background: #fff; border: 0.2mm solid var(--id-cream); border-left-width: 0; border-right-width: 0; height: 6.4mm; padding: 0 0.4mm; font: 400 8pt/1.2 var(--id-font);
  text-align: left; color: var(--id-ink); white-space: normal; }
.idp-pay > thead > tr > th:first-child { border-right-width: 1px; }
.idp-pay > thead > tr > th:last-child { border-left-width: 1px; }
.idp-pay > tbody > tr > td:first-child { border-right-width: 0.2mm; }
.idp-pay > tbody > tr > td:last-child { border-left-width: 0.2mm; }
.idp-pay > tbody > tr > td.n { text-align: center; direction: ltr; }
.idp-pay > tbody > tr:hover > td { background: #fff; }
.idp-paytot { height: 6.4mm; font: 700 8pt/6.4mm var(--id-font); color: var(--id-sec); text-align: left; }

/* ── التذييل (FooterBand_ vb:256-306): صندوقٌ 236 بحدٍّ 190 وأسطرُه موسَّطة، و«صفحة X من Y» تحته في هامش الصفحة ── */
.idp-foot { direction: rtl; font-family: var(--id-font); }
.idp-fbox { box-sizing: border-box; background: var(--id-deep); border: 1px solid var(--id-cream); padding: 0.4mm 0 0.6mm; text-align: center; }
.idp-f1 { height: 4.6mm; font: 400 7.9pt/4.6mm var(--id-font); color: var(--id-ink); white-space: nowrap; overflow: hidden; }
.idp-f2 { height: 4.4mm; font: 400 7.4pt/4.4mm 'Segoe UI Symbol', var(--id-font); color: var(--id-sec); white-space: nowrap; overflow: hidden; direction: ltr; }
.idp-f2 .idp-ic { font-family: 'Segoe UI Symbol', 'Segoe UI Emoji', sans-serif; color: var(--id-sec); }
.idp-f2 .idp-cv { font-family: Georgia, 'Times New Roman', serif; }
.idp-f3 { height: 4.6mm; font: 400 8.4pt/4.6mm var(--id-fontm); color: var(--id-sec); white-space: nowrap; overflow: hidden; }
.idp-f3 b { font-family: Georgia, 'Times New Roman', serif; font-weight: 700; color: var(--id-sec); unicode-bidi: isolate; }
.idp-dot { white-space: pre; }

@page idland { size: A4 landscape; margin: 3mm 9.9mm 8.6mm 9.9mm;
  @bottom-center { content: "\2067صفحة " counter(page) " من " counter(pages) "\2069"; font-family: Dubai, "Segoe UI", Tahoma, sans-serif; font-size: 7.6pt; color: #444444; vertical-align: top; padding-top: 1.2mm; } }
@page idport { size: A4; margin: 3mm 9.9mm 8.6mm 9.9mm;
  @bottom-center { content: "\2067صفحة " counter(page) " من " counter(pages) "\2069"; font-family: Dubai, "Segoe UI", Tahoma, sans-serif; font-size: 7.6pt; color: #444444; vertical-align: top; padding-top: 1.2mm; } }
@media print {
  .idp-land { page: idland; }
  .idp-port { page: idport; }
  .idp { background: #fff; color: var(--id-ink); border: 0; box-shadow: none; padding: 0; margin: 0; max-width: none; }
  /* المسافةُ المحجوزةُ أسفلَ كلّ صفحة للتذييل الثابت (tfoot يتكرّر)، والتذييلُ نفسُه ثابتٌ في أسفل منطقة المحتوى */
  .idp-fsp { height: 16.4mm; }
  .idp-foot { position: fixed; left: 0; right: 0; bottom: 0; }
  .idl > thead { display: table-header-group; }
  .idl > tbody > tr { break-inside: avoid; }
  .idl-rules, .idl.idl-tot { break-inside: avoid; break-before: avoid; }
  .idd > thead { display: table-header-group; }
  .idd > tbody > tr, .idt > tbody > tr { break-inside: avoid; }
  .idt, .idt-words { break-before: avoid; }
  /* الصفحةُ الحاملةُ للإطار لا تطبع إلّا إطارَها: ما سواه من عناصرها (التنبيهاتُ والملاحظاتُ وشرائطُ الأدوات) يُخفى، فلا تُفتح له صفحةٌ بلا اسم قبل الإطار؛
     وبطاقاتُ الشاشة ورسومُها داخلَه لا تُطبع (طباعةُ المكتبي الشبكةُ وحدها، ومؤشّراتُها في بطاقة «النطاق») */
  main.content:has(.idp) > :not(.idp):not(:has(.idp)) { display: none !important; }
  .df:has(.idp) > :not(.idp):not(:has(.idp)) { display: none !important; }
  .idp .cards, .idp .chart, .idp .hbars, .idp .empty { display: none !important; }
  /* الصفحةُ الحاملةُ للإطار لا تطبع شريطَ عنوانها ولا حاويتَها فوقه */
  .df:has(.idp) > .df-title { display: none !important; }
  .df:has(.idp) { border: 0; box-shadow: none; background: #fff; padding: 0; margin: 0; }
}

/* ================= الدفعة 54: أوراقُ V4 الكحليّة (V4MastPainter وأوراقُها التسع) =================
   أصلٌ يُطبع وحده (‎.print-only‎) بمقاسات المكتبي بأعشار المليمتر: الترويسةُ والبطاقاتُ والشريطُ المختصر والجدولُ وذيلُ التقرير والتذييل.
   js/mast-print.js يلائم الخطوطَ ويقسمه صفحاتٍ صريحةً (‎#mst-paged‎) عند الطباعة، و‎@page mstp‎ بهوامش نموذج التخطيط يُكتب هناك.
   الخطّان: «دبي» للورقة نفسِها (Fam/FamB)، وخطّا «هوية التقارير» (‎--mst-hf/--mst-bf‎) للترويسة ولوحتي الملخّص (CLS_ReportTheme.F). */
.mst { position: relative; direction: rtl; color: #1f262e; background: #fff; font-family: Dubai, "Segoe UI", Tahoma, sans-serif; font-weight: 400; line-height: 1.2; }
.mst, .mst * { box-sizing: border-box; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.mst-rh, .mst-ph, .mst-rf, .mst-pf { position: relative; width: 100%; }
.mst-fill { position: absolute; }
.mst-card { background: #f3f5f8; border: 1px solid #c9ced4; }
.mst-x { position: absolute; display: flex; align-items: center; padding: 0 .7mm; overflow: hidden; }
.mst-x > span { display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: pre; }
.mst-x.l > span { text-align: left; } .mst-x.r > span { text-align: right; } .mst-x.c > span { text-align: center; }
.mst-x.mst-wrap > span { white-space: pre-wrap; text-overflow: clip; }
/* خاناتُ رسّام الأوراق التسع تنكمش إلى ارتفاع نصّها (CanShrink) فيلتصق النصُّ بأعلى صندوقه — لا وسطَه */
.mst-x.t { align-items: flex-start; } .mst-x.t > span { line-height: normal; }
.mst-logo { position: absolute; object-fit: contain; }
/* شعارُ بحر الذهب في الترويسة (طلبُ المالك 2026-10-16: «الوضوح والشفافية والموقع… باحترافٍ وبشكلٍ واضحٍ وإبداعيّ»): أصلُه الشفّافُ المعدنيّ
   (‎img/bahr-crest*.png‎ — BrandCrest) بلا المربّع الذهبيّ، ووهجٌ ذهبيٌّ خافتٌ تحته على الكحليّ، وخيطٌ ذهبيٌّ رأسيٌّ يتلاشى طرفاه بينه وبين الاسم،
   وصداهُ كبيراً شفيفاً في الطرف الآخر من الشريط يقصّه الشريط (‎.mst-clip‎). */
.mst-crest, .mst-echo { position: absolute; object-fit: contain; }
.mst-clip { overflow: hidden; }
.mst-echo { opacity: .07; }
.mst-glow { background: radial-gradient(closest-side, rgba(240, 210, 130, .26), rgba(240, 210, 130, .09) 58%, rgba(240, 210, 130, 0)); }
.mst-cdiv { background: linear-gradient(to bottom, rgba(201, 162, 39, 0), #c9a227 24%, #ecd08a 50%, #c9a227 76%, rgba(201, 162, 39, 0)); }
.mst-cdiv.l { background: linear-gradient(to bottom, rgba(169, 121, 28, 0), #a9791c 24%, #c9a227 50%, #a9791c 76%, rgba(169, 121, 28, 0)); }
.mst-db, .mst-t thead th, .mst-t td.lb, .mst-t tr.mst-tt td { font-family: "Dubai Medium", Dubai, "Segoe UI", Tahoma, sans-serif; font-weight: 700; }
.mst-fh { font-family: var(--mst-hf), "Microsoft Sans Serif", Tahoma, sans-serif; font-weight: 400; }
.mst-fb { font-family: var(--mst-bf), "Microsoft Sans Serif", Tahoma, sans-serif; font-weight: 400; }
.mst-fh.mst-w7, .mst-fb.mst-w7 { font-weight: 700; }
/* الجدول: حدودُ كلّ خانةٍ داخلها كخانات المكتبي — فتتجاور الحدّان بين خانتين (‎separate‎ بلا تباعد) */
.mst-t { border-collapse: separate; border-spacing: 0; table-layout: fixed; direction: rtl; background: #fff; }
.mst-t th, .mst-t td { position: static; top: auto; padding: 0 .7mm; overflow: hidden; text-overflow: ellipsis; white-space: pre; vertical-align: middle;
  text-align: center; color: #1f262e; background: none; font-size: 8.8pt; line-height: 1.2; }
.mst-t thead th { background: #eef0f2; border: 1.4px solid var(--mst-edge); font-size: 10pt; }
.mst-t td { border-left: 1px solid var(--mst-rule); border-right: 1px solid var(--mst-rule); border-bottom: 1px solid var(--mst-rule); border-top: 0; }
.mst-t td.ar { text-align: right; } .mst-t td.al { text-align: left; }
.mst-t tr.z td { background: #f7f8f9; }
.mst-t td.g { color: #1e6b47; } .mst-t td.r { color: #b3392e; }
.mst-t tr.mst-gr td { background: #ebeff3; border: 1px solid #c9ced4; }
/* رؤوسُ المجموعات فوق رؤوس الأعمدة (Polish_): كحليٌّ ‎43,59,88‎ بخطٍّ أبيض */
.mst-t thead tr.mst-grp th { background: #2b3b58; color: #fff; font-size: 10.2pt; }
/* لونُ السطر بنوع حركته وشارةُ النوع بلونٍ فاتحٍ منه (ExtraRowRules_ وTint_ ‏×0.14) */
.mst-t tr.ts td { color: #1e6b47; } .mst-t tr.tp td { color: #5c3e9e; } .mst-t tr.tr td { color: #a9791c; } .mst-t tr.tc td { color: #b3392e; }
.mst-t tr.ts td.chip { background: #e0eae5; } .mst-t tr.tp td.chip { background: #e8e4f1; } .mst-t tr.tr td.chip { background: #f3ecdf; } .mst-t tr.tc td.chip { background: #f4e3e2; }
.mst-t tr.mst-tt td { background: #d6dce2; border: 1.2px solid var(--mst-edge); }
/* الخانةُ الملتفّة (MastCol.Wrap): نصٌّ طويلٌ يسع سطرين في ارتفاع السطر نفسِه */
.mst-t td.wr { white-space: pre-wrap; text-overflow: clip; line-height: 1.08; }
/* لوحتا الملخّص (V4Summary.Panel_): حشوةُ الخانة ‎6/100‎ بوصة، والوصفُ يساراً كما يرسمه المحرّكُ المرآويّ، والأرقامُ وسطاً */
.mst-pt { position: absolute; border-collapse: separate; border-spacing: 0; table-layout: fixed; direction: rtl; }
.mst-pt th, .mst-pt td { position: static; padding: 0 1.524mm; border: 1px solid var(--mst-rule); overflow: hidden; text-overflow: ellipsis; white-space: pre;
  vertical-align: middle; text-align: center; color: inherit; line-height: 1.2; }
.mst-pt th { background: var(--mst-hbg, #eef0f2); color: var(--mst-hfg, #1f262e); }
.mst-pt td { color: var(--mst-ink, #1f262e); background: none; }
.mst-pt .d { text-align: left; }
/* لوحةُ النصّ: سطرُ الملاحظة من اليمين بعرض المتن */
.mst-pt .tx { text-align: right; }
/* الترقيمُ الصريح عند الطباعة (js/mast-print.js): النسخةُ المقيسةُ خارج الشاشة، والصفحاتُ المبنيّةُ تُطبع وحدَها بدل الأصل */
.mst-probe { position: absolute; left: -40000px; top: 0; visibility: hidden; }
.mst-page { position: relative; overflow: hidden; page: mstp; break-after: page; }
.mst-page.mst-last { break-after: auto; }
.mst-page > .mst-pf { position: absolute; left: 0; right: 0; bottom: 0; }
#mst-paged { display: none; }
@media print {
  html.mst-paging body > *:not(#mst-paged) { display: none !important; }
  html.mst-paging #mst-paged { display: block !important; }
}

/* ================= الدفعة 54: أوراقُ نقطة البيع (Components/Reports/V4) بترويسة V4 الكحليّة =================
   الترويسةُ (‎.v4-head‎ في V4Header ومحاضر التسليم وسجلّ الورديات، و‎.v4-hband‎ في المختصر) شريطٌ داكنٌ متدرّجٌ بألوان «هوية التقارير» (‎--v4n-*‎ من V4Paper)
   وخيطٌ ذهبيٌّ تحته، والشعارُ في مربّعٍ ذهبيٍّ داكن — كترويسة الأساس (FinStmtV4Base.DashMast_). ورموزُ الورقة (‎--v4-*‎) تُعاد داخلها للخلفيّة الداكنة،
   فيبقى ما كُتب بها (الفترة والتاريخُ ورقمُ الوردية) مقروءاً بلا مساسٍ بنصوصه. والأردوازيُّ (SideBlock) ورقةٌ بيضاءُ وكتلةٌ داكنةٌ يساراً تحت خانة التاريخ. */
.v4 .v4-head, .v4 .v4-hband { --v4-ink: #fff; --v4-mid: #aebcd0; --v4-slate: #c3cede; --v4-goldtab: var(--v4n-acc, #c9a227); --v4-line: rgba(255,255,255,.22);
  background: linear-gradient(to right, var(--v4n-a, #161b24), var(--v4n-b, #202938)); color: #fff; }
.v4 .v4-head { padding: 12px 16px; border-bottom: 4px solid var(--v4n-acc, #c9a227); }
.v4 .v4-hband { padding: 10px 14px 6px !important; }
.v4 .v4-head .v4-mark, .v4 .v4-hband .v4-mark { color: #96a3b8; }
/* الشعار (V4Crest): أصلُ بحر الذهب الشفّافُ المعدنيّ بلا مربّع، أكبرَ، بوهجٍ خافتٍ تحته، وخيطٌ ذهبيٌّ يتلاشى طرفاه بينه وبين الاسم؛
   وفي الأردوازيّ (ورقةٌ بيضاء) الأصلُ الأعمقُ بلا وهج. والشعارُ المرفوعُ غيرُه في الموضع نفسِه (ويُقشر متى كان «الشعار شفّافاً»). */
.v4 .v4-head .v4-co { gap: 8px; }
/* اسمُ المنشأة بسطرين (V4CoName — أمرُ المالك): العلامةُ ثمّ نشاطُها بذهبٍ هادئ ثمّ B A H R G O L D */
.v4-co .v4-trade { display: block; font-size: 11.5px; font-weight: 600; line-height: 1.3; color: #8a6a28; }
.v4 .v4-head .v4-co .v4-trade, .v4 .v4-hband .v4-trade { color: #d9c08a; }
.v4 .v4-head .v4-crest { flex: none; display: grid; place-items: center; width: 78px; height: 70px; margin: -6px -6px -6px 0;
  background: radial-gradient(closest-side, rgba(240, 210, 130, .28), rgba(240, 210, 130, .08) 60%, rgba(240, 210, 130, 0)); }
.v4 .v4-head .v4-crest img { box-sizing: border-box; width: 70px; height: 59px; padding: 0; object-fit: contain; background: none; }
.v4 .v4-head .v4-crest .bcrest-l { display: none; }
.v4 .v4-head .v4-co > div { padding-right: 10px; border-right: 2px solid #c9a227;
  border-image: linear-gradient(to bottom, rgba(201, 162, 39, 0), #c9a227 25%, #ecd08a 50%, #c9a227 75%, rgba(201, 162, 39, 0)) 1; }
.v4 .v4-hband .v4-crest-c { display: inline-grid; place-items: center; padding: 2.5mm 6mm;
  background: radial-gradient(closest-side, rgba(240, 210, 130, .26), rgba(240, 210, 130, .08) 60%, rgba(240, 210, 130, 0)); }
.v4 .v4-head .v4-meta { border-color: rgba(255,255,255,.2); }
.v4 .v4-head .v4-meta em { color: #96a3b8; }
.v4.v4-slate .v4-head { background: linear-gradient(to right, var(--v4n-a, #161b24) 0 31%, #fff 31% 100%); border-bottom: 2px solid var(--v4n-rule, #c9ced4); }
.v4.v4-slate .v4-head .v4-co, .v4.v4-slate .v4-head .v4-title { --v4-ink: #1f262e; --v4-mid: #586066; --v4-slate: #34404c; color: #1f262e; }
.v4.v4-slate .v4-head .v4-crest { background: none; }
.v4.v4-slate .v4-head .v4-crest .bcrest-d { display: none; }
.v4.v4-slate .v4-head .v4-crest .bcrest-l { display: block; }
.v4.v4-slate .v4-head .v4-co > div { border-image: linear-gradient(to bottom, rgba(169, 121, 28, 0), #a9791c 25%, #c9a227 50%, #a9791c 75%, rgba(169, 121, 28, 0)) 1; }
.v4.v4-slate .v4-head .v4-co .v4-trade { color: #8a6a28; }
@media print {
  /* اتّجاهُ ورقة الطباعة المختار (V4Paper) يغلب اتّجاهَ التصميم، والأفقيُّ المطبوعُ عموديّاً يُصغَّر بنسبة المتنين */
  .v4.v4-pg-land { page: v4land; }
  .v4.v4-pg-port { page: v4port; }
  .v4.v4-fit { zoom: .7245; }
}
@media screen and (max-width: 820px) {
  .v4.v4-slate .v4-head { background: linear-gradient(to right, var(--v4n-a, #161b24), var(--v4n-b, #202938)); }
  .v4.v4-slate .v4-head .v4-co, .v4.v4-slate .v4-head .v4-title { --v4-ink: #fff; --v4-mid: #aebcd0; --v4-slate: #c3cede; color: #fff; }
  .v4.v4-slate .v4-head .v4-crest .bcrest-d { display: block; }
  .v4.v4-slate .v4-head .v4-crest .bcrest-l { display: none; }
  .v4.v4-slate .v4-head .v4-co .v4-trade { color: #d9c08a; }
}

/* ================= الدفعة 54: كشفُ الحساب (KashfAccSheet) على A4 عموديّة =================
   الورقةُ بتصميمها الأفقيّ (المتنُ 285.8 مم) مصغَّرةً بنسبة المتن العموديّ (198.8 مم) — والهوامشُ هوامشُ «@page ks» نفسُها. */
@page ksp { size: A4 portrait; margin: 4mm 5.6mm 5mm 5.6mm;
  @bottom-left { content: "\2066" counter(page) " / " counter(pages) "\2069"; font-family: Dubai, "Segoe UI", Tahoma, sans-serif; font-size: 8.4pt; color: #586066; } }
.ks.ks-port { page: ksp; zoom: .6956; }
/* شعارُ بحر الذهب في شريط الكشف: أصلُه الشفّافُ المعدنيّ (‎.bcrest‎ لا يُقشر) بوهجٍ خافتٍ تحته وصدىً شفيفٍ في الطرف الأيسر يقصّهما الشريط،
   وخيطٌ ذهبيٌّ رأسيٌّ يتلاشى طرفاه بينه وبين العنوان */
.ks-clip { position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; }
.ks-glow { position: absolute; top: 0; bottom: 0; background: radial-gradient(closest-side, rgba(240, 210, 130, .26), rgba(240, 210, 130, .09) 58%, rgba(240, 210, 130, 0)); }
.ks-echo { position: absolute; left: -12mm; top: -7mm; height: 43mm; width: 51mm; object-fit: contain; opacity: .07; }
.ks-cdiv { position: absolute; top: 5.8mm; height: 17.2mm; width: .3mm;
  background: linear-gradient(to bottom, rgba(201, 162, 39, 0), #c9a227 24%, #ecd08a 50%, #c9a227 76%, rgba(201, 162, 39, 0)); }
/* اسمُ المنشأة بسطرين تحت العنوان (أمرُ المالك): «بحر الذهب» ثمّ «للذهب و المجوهرات» ثمّ الاسمُ الإنجليزيّ — والكتلةُ أعلى قليلاً لتسعها */
.ks-title.ks-t2 { top: 3.4mm; }
.ks-title.ks-t2 b { line-height: 8.6mm; }
.ks-title.ks-t2 .ks-tb { margin-top: 0; font-size: 11pt; font-weight: 700; color: #fff; line-height: 5.4mm; }
.ks-title.ks-t2 .ks-tt { margin-top: 0; font-size: 9.6pt; color: #d9c08a; line-height: 4.6mm; }
.ks-title.ks-t2 .ks-te { margin-top: 0; font-size: 8pt; color: #aab5c8; line-height: 3.8mm; direction: ltr; text-align: right; }
/* والتذييلُ: الاسمُ بسطرين والأسطرُ بعده أضيقُ قليلاً لتسع الكتلةُ ارتفاعَها (16.8 مم) */
.ks-pfr.ks-pf2 { padding-top: 1mm; }
.ks-pfr.ks-pf2 b { line-height: 3.8mm; }
.ks-pfr.ks-pf2 span { line-height: 3mm; }
.ks-pfr.ks-pf2 .ks-pft { color: #8a6a28; }

/* ================= الدفعة 54: شعارُ المنشأة على سطح الشاشة (BrandLogo) =================
   الأعمقُ للوضع الفاتح وللمطبوع، والمضيءُ للوضع الداكن على الشاشة وحدَها — فلا مربّعَ أبيضَ حوله في الداكن. */
.bcrest-pair { display: inline-flex; align-items: center; }
/* ترويسةُ المستند (DocHeader): نشاطُ المنشأة سطراً تحت اسمها (أمرُ المالك: «بحر الذهب» بسطر و«للذهب و المجوهرات» بسطر) */
.doc-head .co .co-trade { display: block; margin: 1px 0 4px; font-size: 14px; font-weight: 600; color: var(--gold-dark, #8a6a28); }
.bcrest-pair .bcrest-d { display: none; }
@media screen { :root[data-theme="dark"] .bcrest-pair .bcrest-l { display: none; } }
@media screen { :root[data-theme="dark"] .bcrest-pair .bcrest-d { display: inline; } }

/* ================= الدفعة 55: فاتورةُ المبيعات والمشتريات بتصميم مرفق المالك (Components/Reports/InvoiceSheet) =================
   طلبُ المالك 2026-10-16: «اعمل فاتورة المبيعات و المشتريات بنفس التصميم بالمرفق و الخطوط اعملها بالتفصيل نفس المرفق».
   كلُّ مقاسٍ بالمليمتر مستخرجٌ من المرفق (فاتورة المبيعات.pdf): الأشكالُ بحدودها، والنصوصُ بصناديق حبرها مقيسةً بخطّ «دبي» نفسِه (GDI+) —
   فأعلى كلّ سطرٍ = خطُّ قاعدته − 1.129em (السطرُ العاديّ 1.688em)، والأيقوناتُ رموزُ «Segoe UI Symbol» بقاعدةٍ عند 1.079em.
   والمرجعُ صفحةٌ عرضُ متنها 198.29 مم وهوامشُها 6.10/5.87/5.84 — فهي هوامشُ «@page ivc». الورقةُ فاتحةٌ في الوضعين (مستندٌ لا لوحة). */
.ivc-scroll { overflow-x: auto; overflow-y: hidden; }
.ivc-page { width: 210mm; margin: 0 auto 18px; padding: 6.10mm 5.87mm 6.10mm 5.84mm; background: #fff; box-shadow: 0 1px 2px rgba(43,36,24,.06), 0 6px 22px rgba(43,36,24,.10); }
.ivc { position: relative; width: 198.29mm; background: #FAF7EF; color: #3B3229; font-family: Dubai, 'Segoe UI', Tahoma, sans-serif; font-size: 11px; font-weight: 400;
  line-height: 1.688; direction: rtl; text-align: right; color-scheme: light; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.ivc *, .ivc *::before, .ivc *::after { box-sizing: border-box; }
.ivc b { font-weight: 700; }
.ivc p, .ivc ol { margin: 0; padding: 0; }
.ivc .n { direction: ltr; unicode-bidi: isolate; }
.ivc-ic { position: absolute; font-family: 'Segoe UI Symbol'; font-weight: 400; font-style: normal; line-height: normal; white-space: nowrap; font-variant-emoji: text; color: #A47C34; }

/* ═══ الترويسة: الشعارُ وكتلةُ العلامة يميناً (أسطرُها الثلاثة موسَّطةٌ على محور «للذهب والمجوهرات» — طلبُ المالك 2026-10-16)،
   والعنوانُ وشارةُ الرقم يساراً، وخطٌّ تحتها */
.ivc-head { position: relative; height: 25.18mm; }
.ivc-head::after { content: ''; position: absolute; left: 0.26mm; right: 0.13mm; bottom: 0; height: 0.29mm; background: #DDD1BA; }
.ivc-crest { position: absolute; left: 177.04mm; top: 3.90mm; width: 18.96mm; height: 15.95mm; }
.ivc-brand { position: absolute; left: 129.35mm; top: 2.20mm; width: 41.59mm; height: 18.78mm; }
.ivc-ttl { position: absolute; left: 0; width: 53.72mm; top: 0.21mm; text-align: center; font-size: 17px; font-weight: 700; white-space: nowrap; }
.ivc-ttl-en { position: absolute; left: 0; width: 53.72mm; top: 7.01mm; text-align: center; font-size: 11px; letter-spacing: 0.98mm; color: #8A7C66; white-space: nowrap; }
.ivc-badge { position: absolute; left: 13.91mm; top: 13.64mm; width: 25.95mm; height: 7.93mm; border: 0.3mm solid #B08D57; border-radius: 0.38mm;
  display: flex; justify-content: center; align-items: flex-start; gap: 2.65mm; white-space: nowrap; }
.ivc-badge .c { margin-top: 1.02mm; font-size: 11px; color: #8A7C66; }
.ivc-badge b { margin-top: 0.41mm; font-size: 15px; }

/* ═══ البطاقات العشر (عمودان) وبطاقةُ الإجمالي — بإحداثيّات المرفق نسبةً إلى أعلى الكتلة (33.36 مم من الصفحة) */
.ivc-info { position: relative; height: 60.70mm; margin-top: 2.08mm; }
.ivc-card { position: absolute; height: 9.54mm; background: #F8F4EA; border: 0.3mm solid #DDD1BA; border-radius: 0.68mm; }
.ivc-card.k-r1, .ivc-card.k-r2, .ivc-card.k-r3, .ivc-card.k-r4, .ivc-card.k-r5 { left: 33.35mm; width: 32.39mm; }
.ivc-card.k-l1, .ivc-card.k-l2, .ivc-card.k-l3, .ivc-card.k-l4, .ivc-card.k-l5 { left: 0.24mm; width: 32.09mm; }
.ivc-card.k-r1, .ivc-card.k-l1 { top: 0.01mm; }
.ivc-card.k-r2, .ivc-card.k-l2 { top: 10.60mm; }
.ivc-card.k-r3, .ivc-card.k-l3 { top: 21.20mm; }
.ivc-card.k-r4, .ivc-card.k-l4 { top: 31.79mm; }
.ivc-card.k-r5, .ivc-card.k-l5 { top: 42.39mm; height: 18.32mm; }
.ivc-card .cap { position: absolute; top: -0.10mm; right: 7.31mm; font-size: 10px; color: #8A7C66; white-space: nowrap; }
.ivc-card[class*="k-l"] .cap { right: 7.11mm; }
.ivc-card .val { position: absolute; top: 3.96mm; left: 2.6mm; right: 2.6mm; text-align: center; font-size: 13px; line-height: 4.26mm; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ivc-card .val.w { white-space: normal; overflow-wrap: anywhere; max-height: 12.9mm; }
.ivc-card .ivc-ic.i-no { right: 2.32mm; top: 0.32mm; font-size: 8.40pt; }
.ivc-card .ivc-ic.i-user { right: 2.14mm; top: 0.13mm; font-size: 9.91pt; }
.ivc-card .ivc-ic.i-mob { right: 2.29mm; top: -0.39mm; font-size: 9.55pt; }
.ivc-card .ivc-ic.i-cal { right: 2.57mm; top: -0.02mm; font-size: 8.04pt; }
.ivc-card .ivc-ic.i-moon { right: 2.65mm; top: -0.16mm; font-size: 9.15pt; }
.ivc-card .ivc-ic.i-clock { right: 2.59mm; top: 0.09mm; font-size: 7.90pt; }
.ivc-card .ivc-ic.i-id { right: 2.49mm; top: -0.11mm; font-size: 8.33pt; }
.ivc-card .ivc-ic.i-home { right: 2.21mm; top: -0.71mm; font-size: 11.10pt; }

.ivc-tot { position: absolute; left: 69.89mm; top: 0; width: 128.27mm; height: 60.70mm; background: #fff; border: 0.55mm solid #B08D57;
  box-shadow: inset 0 0 0 0.81mm #fff, inset 0 0 0 1.06mm #C9AB7C; }
.ivc-tot > div { position: absolute; white-space: nowrap; }
.ivc-tot .t-ttl { right: 5.35mm; top: 1.53mm; font-size: 13.5px; font-weight: 700; color: #2E7D6E; }
.ivc-tot .t-big { right: 5.40mm; top: 3.82mm; font-size: 43px; font-weight: 700; }
.ivc-tot .t-big.m { top: 5.30mm; font-size: 36px; }
.ivc-tot .t-big.s { top: 6.60mm; font-size: 30px; }
.ivc-tot .t-cur { right: 5.28mm; top: 18.09mm; font-size: 19.2px; font-weight: 700; }
.ivc-tot .t-hex { left: 14.86mm; top: 7.75mm; width: 9.44mm; height: 11.05mm; background: #B08D57; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }
.ivc-tot .t-hex i { position: absolute; inset: 0.26mm; background: #fff; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }
.ivc-tot .t-hex span { position: absolute; left: 0; right: 0; top: 3.02mm; text-align: center; font-size: 10px; direction: ltr; unicode-bidi: isolate; }
.ivc-tot .t-rule { left: 5.34mm; right: 5.25mm; height: 0.30mm; background: #DDD1BA; }
.ivc-tot .t-r1 { top: 27.56mm; }
.ivc-tot .t-r2 { top: 41.82mm; }
.ivc-tot .t-div { left: 65.45mm; top: 27.81mm; width: 0.30mm; height: 14.06mm; background: #DDD1BA; }
.ivc-tot .t-cap { top: 28.68mm; font-size: 11.5px; color: #8A7C66; }
.ivc-tot .t-cb { right: 5.27mm; }
.ivc-tot .t-cv { right: 65.89mm; }
.ivc-tot .t-sub { top: 32.10mm; font-size: 21.1px; font-weight: 700; }
.ivc-tot .t-vb { right: 5.26mm; }
.ivc-tot .t-vv { right: 65.82mm; }
.ivc-tot .t-wcap { right: 5.27mm; top: 42.96mm; font-size: 11px; color: #8A7C66; }
.ivc-tot .t-words { left: 5.34mm; right: 20.61mm; top: 43.32mm; text-align: center; font-size: 12px; font-weight: 700; white-space: normal; }
.ivc-tot .t-note { left: 5.34mm; right: 5.25mm; top: 53.40mm; text-align: center; font-size: 8px; color: #8A7C66; white-space: normal; line-height: 1.4; }

/* ═══ جدولُ الأصناف: رأسٌ ثنائيُّ اللغة بشريطٍ ذهبيّ، وخمسةُ صفوفٍ على الأقلّ، وسطرُ «الوزن كتابةً» يغلقه */
table.ivc-tbl { width: 197.90mm; margin: 2.58mm 0.13mm 0 0.26mm; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: #F8F4EA;
  border: 0.29mm solid #DDD1BA; border-bottom: 0; direction: rtl; }
.ivc-tbl col.c-no { width: 10.07mm; } .ivc-tbl col.c-item { width: 33.22mm; } .ivc-tbl col.c-karat { width: 13.70mm; } .ivc-tbl col.c-stone { width: 13.04mm; }
.ivc-tbl col.c-wt { width: 15.64mm; } .ivc-tbl col.c-qty { width: 12.64mm; } .ivc-tbl col.c-price { width: 18.50mm; } .ivc-tbl col.c-net { width: 20.68mm; }
.ivc-tbl col.c-taxp { width: 14.88mm; } .ivc-tbl col.c-tax { width: 20.94mm; } .ivc-tbl col.c-grand { width: 24.01mm; }
.ivc-tbl th, .ivc-tbl td { position: static; padding: 0; border: 0; background: transparent; color: #3B3229; text-align: center; vertical-align: top; white-space: nowrap;
  font-family: inherit; line-height: 1.688; overflow: hidden; }
.ivc-tbl tr:hover td { background: transparent; }
.ivc-tbl th { position: relative; height: 9.77mm; padding-top: 0.38mm; background: #F0E8D5; border-bottom: 0.30mm solid #C9AB7C; font-size: 11px; font-weight: 700; }
.ivc-tbl th small { position: absolute; left: 0; right: 0; top: 4.64mm; font-size: 9px; font-weight: 400; color: #8A7C66; line-height: 1.688; }
.ivc-tbl tbody td { height: 6.46mm; padding: 0.33mm 0.6mm 0; border-bottom: 0.30mm solid #DDD1BA; font-size: 12px; font-weight: 700; text-overflow: ellipsis; }
.ivc-tbl tbody td.i { white-space: normal; line-height: 1.3; padding-top: 1.1mm; overflow-wrap: anywhere; }
.ivc-tbl tbody td.r2 { font-size: 8.5px; padding-top: 1.25mm; }
.ivc-tbl tr.w td { height: 7.71mm; padding: 0 3.22mm; text-align: right; }
.ivc-tbl .w-in { display: flex; align-items: flex-start; gap: 2.26mm; }
.ivc-tbl .w-cap { margin-top: 1.08mm; font-size: 11px; font-weight: 400; color: #8A7C66; }
.ivc-tbl .w-val { margin-top: 0.85mm; font-size: 12px; }
.ivc-tbl .w-note { margin-right: auto; margin-top: 1.55mm; font-size: 9px; font-weight: 400; color: #8A7C66; }

/* ═══ البيان */
.ivc-stmt { display: flex; align-items: flex-start; gap: 2.08mm; min-height: 8.52mm; margin: 1.90mm 0.12mm 0 0.24mm; padding: 0 3.22mm 0.9mm; background: #fff;
  border: 0.3mm solid #DDD1BA; border-radius: 0.42mm; }
.ivc-stmt .s-cap { flex: none; margin-top: 1.12mm; font-size: 12px; color: #B08D57; white-space: nowrap; }
.ivc-stmt .s-val { flex: 1; min-width: 0; margin-top: 1.46mm; font-size: 11px; font-weight: 700; line-height: 1.5; }

/* ═══ الدفع: ستُّ خاناتٍ (وسابعةٌ «أخرى» متى حملت مبلغاً) */
.ivc-pay { display: grid; grid-template-columns: repeat(6, 1fr); column-gap: 1.82mm; margin: 2.33mm -0.14mm 0 -0.02mm; }
.ivc-pay.p7 { grid-template-columns: repeat(7, 1fr); column-gap: 1.2mm; }
.ivc-pc { position: relative; height: 13.01mm; background: #fff; border: 0.3mm solid #DDD1BA; border-radius: 0.42mm; }
.ivc-pc .cap { position: absolute; right: 2.38mm; top: 0.54mm; font-size: 11.5px; white-space: nowrap; }
.ivc-pc .val { position: absolute; left: 0; right: 0; top: 5.06mm; text-align: center; font-size: 15px; white-space: nowrap; }
.ivc-pc .det { position: absolute; left: 0.8mm; right: 0.8mm; bottom: 0.15mm; text-align: center; font-size: 6.5px; color: #8A7C66; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ivc-pc .ivc-ic { color: #786C50; }
.ivc-pc .ivc-ic.i-pcash { left: 2.41mm; top: 0.50mm; font-size: 9.84pt; }
.ivc-pc .ivc-ic.i-pcard { left: 2.42mm; top: 0.84mm; font-size: 9.60pt; }
.ivc-pc .ivc-ic.i-papprox { left: 1.70mm; top: -2.12mm; font-size: 19.76pt; }
.ivc-pc .ivc-ic.i-pswap { left: 2.29mm; top: -0.02mm; font-size: 11.77pt; color: #A47C34; }

/* ═══ التذييل: لوحةُ الرمز بإطارٍ ذهبيّ (أو التوقيعُ والختمُ للشراء) ولوحةُ التواصل */
.ivc-foot { position: relative; height: 38.95mm; margin-top: 2.12mm; }
.ivc-qrb { position: absolute; left: -0.02mm; top: 0; width: 68.94mm; height: 38.95mm; border: 0.3mm solid #B08D57; border-radius: 0.43mm; }
.ivc-qrb .q-img { position: absolute; left: 21.98mm; top: 3.40mm; width: 24.4mm; height: 24.4mm; }
.ivc-qrb .q-img img { display: block; width: 100%; height: 100%; image-rendering: pixelated; }
.ivc-qrb .q-cap { position: absolute; left: 0; right: 0; top: 29.42mm; text-align: center; font-family: 'GE Hili', Dubai, 'Segoe UI', Tahoma, sans-serif; font-size: 13.38px; white-space: nowrap; }
.ivc-qrb.sg .g-zone { position: absolute; top: 3.40mm; width: 31mm; height: 32mm; }
.ivc-qrb.sg .g-sign { right: 1.8mm; }
.ivc-qrb.sg .g-stamp { left: 1.8mm; }
.ivc-qrb.sg .g-line { position: absolute; left: 3mm; right: 3mm; top: 21.5mm; border-top: 0.3mm dashed #B08D57; }
.ivc-qrb.sg .g-box { position: absolute; left: 3.5mm; right: 3.5mm; top: 0.6mm; height: 21.6mm; border: 0.3mm dashed #C9AB7C; border-radius: 2mm; }
.ivc-qrb.sg .g-cap { position: absolute; left: 0; right: 0; top: 24.2mm; text-align: center; font-size: 12px; font-weight: 700; color: #8A7550; white-space: nowrap; }
.ivc-ctb { position: absolute; left: 71.50mm; top: 0; width: 126.93mm; height: 38.95mm; border: 0.3mm solid #DDD1BA; border-radius: 0.43mm; }
.ivc-ctb .k { position: absolute; font-size: 10.5px; color: #B08D57; white-space: nowrap; }
.ivc-ctb .v { position: absolute; font-size: 11px; white-space: nowrap; }
.ivc-ctb .v-addr, .ivc-ctb .v-br { top: 1.32mm; width: 44mm; white-space: normal; line-height: 4.02mm; max-height: 12.1mm; overflow: hidden; }
.ivc-ctb .v-br span { display: block; }
.ivc-ctb .k-addr { right: 7.99mm; top: 1.02mm; } .ivc-ctb .v-addr { right: 17.81mm; }
.ivc-ctb .k-br { right: 69.60mm; top: 1.08mm; } .ivc-ctb .v-br { right: 78.82mm; width: 44.2mm; }
.ivc-ctb .k-tel { right: 8.00mm; top: 14.00mm; } .ivc-ctb .v-tel { right: 17.83mm; top: 13.86mm; }
.ivc-ctb .k-mob { right: 69.60mm; top: 14.07mm; } .ivc-ctb .v-mob { right: 78.82mm; top: 13.86mm; }
.ivc-ctb .k-web { right: 7.99mm; top: 18.84mm; } .ivc-ctb .v-web { right: 17.73mm; top: 18.61mm; }
.ivc-ctb .k-mail { right: 69.60mm; top: 18.77mm; } .ivc-ctb .v-mail { right: 78.75mm; top: 18.61mm; }
.ivc-ctb .v-s1 { right: 28.77mm; top: 25.31mm; } .ivc-ctb .v-s2 { right: 57.97mm; top: 25.31mm; } .ivc-ctb .v-s3 { right: 87.07mm; top: 25.31mm; }
.ivc-ctb .k-tax { right: 3.20mm; top: 32.05mm; } .ivc-ctb .v-tax { right: 20.51mm; top: 31.86mm; }
.ivc-ctb .k-cr { right: 63.90mm; top: 32.04mm; } .ivc-ctb .v-cr { right: 82.45mm; top: 31.86mm; }
.ivc-ctb .k-stamp { left: 21mm; top: 25.40mm; } .ivc-ctb .v-stamp { left: 3.2mm; top: 25.31mm; }
.ivc-ctb .c-rule { position: absolute; left: 3.17mm; right: 3.14mm; height: 0.30mm; background: #DDD1BA; }
.ivc-ctb .c-r1 { top: 24.62mm; } .ivc-ctb .c-r2 { top: 30.97mm; }
.ivc-ctb .c-warn { position: absolute; left: 3.2mm; right: 3.2mm; top: 25.30mm; text-align: center; font-size: 11px; font-weight: 700; color: #9E2A2B; white-space: nowrap; }
.ivc-ctb .ivc-ic.i-pin { right: 3.13mm; top: 1.01mm; font-size: 9.32pt; }
.ivc-ctb .ivc-ic.i-homeC { right: 64.73mm; top: 0.62mm; font-size: 11.06pt; }
.ivc-ctb .ivc-ic.i-phone { right: 3.02mm; top: 13.82mm; font-size: 9.89pt; }
.ivc-ctb .ivc-ic.i-mobC { right: 64.78mm; top: 13.88mm; font-size: 9.55pt; }
.ivc-ctb .ivc-ic.i-globe { right: 3.04mm; top: 18.99mm; font-size: 9.68pt; }
.ivc-ctb .ivc-ic.i-mail { right: 64.60mm; top: 18.72mm; font-size: 10.54pt; }
.ivc-ctb .ivc-ic.i-cam { right: 23.86mm; top: 25.24mm; font-size: 10.32pt; color: #786C50; }
.ivc-ctb .ivc-ic.i-note { right: 53.51mm; top: 24.81mm; font-size: 12.45pt; color: #786C50; }
.ivc-ctb .ivc-ic.i-ghost { right: 82.46mm; top: 25.90mm; font-size: 8.49pt; color: #786C50; }

/* ═══ الشروطُ والأحكام (للبيع وحده) — نصُّها نصُّ المرفق حرفاً */
.ivc-terms { position: relative; height: 37.38mm; margin: 2.10mm 0.01mm 0 0.13mm; background: #FAF7EF; border: 0.3mm solid #DDD1BA; border-top: 0.55mm solid #B08D57;
  border-radius: 0 0 0.4mm 0.4mm; }
.ivc-terms .m-head { position: absolute; left: 0; right: 0; top: 0; height: 6.35mm; background: #F0E8D5; border-bottom: 0.30mm solid #C9AB7C; }
.ivc-terms .m-head b { position: absolute; left: 0; right: 0; top: 0.30mm; text-align: center; font-size: 12.2px; }
.ivc-terms .m-head .i-heartL { left: 83.40mm; top: -0.65mm; font-size: 13.96pt; }
.ivc-terms .m-head .i-heartR { left: 110.70mm; top: -0.65mm; font-size: 13.96pt; }
.ivc-terms .m-div { position: absolute; left: 120.35mm; top: 6.31mm; width: 0.30mm; height: 24.93mm; background: #DDD1BA; }
.ivc-terms .m-sec { position: absolute; top: 7.40mm; font-size: 10.5px; color: #B08D57; white-space: nowrap; }
.ivc-terms .m-ret { right: 7.57mm; }
.ivc-terms .m-ex { right: 7.56mm; top: 20.98mm; }
.ivc-terms .m-war { right: 84.88mm; }
.ivc-terms .ivc-ic.i-ret { right: 2.84mm; top: 7.50mm; font-size: 10.20pt; }
.ivc-terms .ivc-ic.i-swapT { right: 2.56mm; top: 20.56mm; font-size: 10.68pt; }
.ivc-terms .ivc-ic.i-heartW { right: 80.05mm; top: 6.51mm; font-size: 13.96pt; }
.ivc-terms .m-p { position: absolute; width: 71.08mm; font-size: 9px; color: #8A7C66; line-height: 3.70mm; }
.ivc-terms .m-p b { color: #3B3229; }
.ivc-terms .m-p1 { right: 2.76mm; top: 12.27mm; }
.ivc-terms .m-p2 { right: 2.69mm; top: 25.84mm; white-space: nowrap; }
.ivc-terms .m-list { list-style: none; }
.ivc-terms .m-list li { position: absolute; width: 56mm; display: flex; align-items: flex-start; gap: 1.71mm; font-size: 9px; color: #8A7C66; line-height: 3.46mm; }
.ivc-terms .m-list li:nth-child(1) { right: 80.21mm; top: 12.36mm; }
.ivc-terms .m-list li:nth-child(2) { right: 139.30mm; top: 12.45mm; }
.ivc-terms .m-list li:nth-child(3) { right: 80.21mm; top: 17.22mm; }
.ivc-terms .m-list li:nth-child(4) { right: 139.30mm; top: 17.19mm; }
.ivc-terms .m-list li:nth-child(5) { right: 80.21mm; top: 24.89mm; }
.ivc-terms .m-list li i { flex: none; width: 3.45mm; height: 3.45mm; margin-top: 0.42mm; border: 0.3mm solid #C9AB7C; border-radius: 50%; background: #fff;
  font-style: normal; font-size: 7.5px; line-height: 2.85mm; text-align: center; color: #B08D57; }
.ivc-terms .m-foot { position: absolute; left: 0; right: 0; top: 31.24mm; height: 5.29mm; background: #F8F4EA; border-top: 0.30mm solid #DDD1BA;
  padding-top: 0.60mm; text-align: center; font-size: 9px; font-weight: 700; color: #3B3229; line-height: 1.688; border-radius: 0 0 0.3mm 0.3mm; }

/* معايرةُ المتصفّح: يرسم Chrome سطرَ «دبي» أعلى من نموذج GDI+ (قاعدةٌ عند 1.129em) بنحو 0.25 مم — قِيس بمقارنة المطبوع بالمرفق نصّاً نصّاً
   (cmp55.py) — فتُنزَل النصوصُ وحدها بلا مساسٍ بالصناديق. ونصوصُ الجدول على رأسه وصفوفه كما هي، وذيلُ الشروط صندوقٌ ملوَّن
   فيُنزَل نصُّه بحشوه، واسمُ المنشأة تحت الرمز (GE Hili) موضعُه مقيسٌ وحده. */
.ivc-ttl, .ivc-ttl-en, .ivc-badge > *, .ivc-card .cap, .ivc-card .val, .ivc-tot .t-ttl, .ivc-tot .t-big, .ivc-tot .t-cur, .ivc-tot .t-hex span,
.ivc-tot .t-cap, .ivc-tot .t-sub, .ivc-tot .t-wcap, .ivc-tot .t-words, .ivc-tot .t-note, .ivc-tbl .w-in > *, .ivc-pc .cap, .ivc-pc .val, .ivc-pc .det,
.ivc-stmt > *, .ivc-qrb .g-cap, .ivc-ctb .k, .ivc-ctb .v, .ivc-ctb .c-warn, .ivc-terms .m-head b, .ivc-terms .m-sec, .ivc-terms .m-p { translate: 0 0.25mm; }

@page ivc { size: A4 portrait; margin: 6.10mm 5.87mm 6.10mm 5.84mm; }
@media print {
  .ivc-scroll { overflow: visible; }
  .ivc-page { width: auto; margin: 0; padding: 0; background: none; box-shadow: none; }
  .ivc { page: ivc; }
  main.content:has(.ivc) > :not(.ivc-scroll):not(:has(.ivc)) { display: none !important; }
  .ivc-tbl thead { display: table-header-group; }
  .ivc-tbl tr { break-inside: avoid; }
  .ivc-head, .ivc-info, .ivc-stmt, .ivc-pay, .ivc-foot, .ivc-terms { break-inside: avoid; }
}

/* ═══ الدفعة 55 — كتلةُ اسم المنشأة موسَّطةٌ في كلّ التقارير (طلبُ المالك 2026-10-16: «BAHR GOLD اجعلها بالمنتصف تحت للذهب و المجوهرات
   و بحر الذهب وسطها»، ثمّ «كلّ التقارير»): في ورقة V4 الثابتة (MastSheet) صندوقُ الكتلة كما كان، وفيه عمودٌ بعرض أعرض أسطره ملاصقٌ يمينَه
   (بجوار الشعار) وكلُّ سطرٍ موسَّطٌ فيه؛ وفي ترويسة V4 المرنة (V4CoName) محاذاةٌ وسطى للأسطر الثلاثة. */
.mst-stk { position: absolute; display: flex; direction: ltr; justify-content: flex-end; align-items: flex-start; overflow: hidden; }
.mst-stk > div { display: flex; flex-direction: column; align-items: center; max-width: 100%; }
.mst-sl { display: flex; align-items: center; max-width: 100%; padding: 0 .7mm; overflow: hidden; direction: rtl; }
.mst-sl > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: pre; text-align: center; }
.mst-sl.t { align-items: flex-start; } .mst-sl.t > span { line-height: normal; }
.v4-co .v4-nm, .v4-co .v4-nm .v4-mark { text-align: center; }
/* وكشفُ الحساب (KashfAccSheet): العلامةُ ونشاطُها والاسمُ الإنجليزيّ تحت العنوان عمودٌ بقدر أعرضها ملاصقٌ يمينَ الصندوق، وكلُّ سطرٍ موسَّطٌ فيه */
.ks-title.ks-t2 .ks-nm { display: flex; flex-direction: column; align-items: center; width: max-content; max-width: 100%; margin-left: auto; }
.ks-title.ks-t2 .ks-nm > span { max-width: 100%; text-align: center; }
.ks-title.ks-t2 .ks-nm > .ks-te { text-align: center; }

/* ═══ الدفعة 56 — حقلُ التاريخ بأرقامٍ إنجليزيّة وتقويمٍ ميلاديّ (DateBox) — طلبُ المالك 2026-10-17: «التواريخ انجليزي والبحث بالتاريخ انجليزي».
   الحقلُ الأصليّ type=date يُعرض بلغة المتصفّح (عربيّاً بأرقامٍ هنديّة)؛ فهذا نصٌّ من اليسار yyyy-MM-dd وزرُّ تقويمٍ داخله، وتقويمٌ منبثقٌ بأسماء الشهور الإنجليزيّة.
   الألوانُ من متغيّرات الوضعين، والأزرارُ داخله تنقض نمطَ الزرّ العامّ (التدرّجَ الذهبيّ والظلّ). *** */
.dbx { position: relative; display: inline-flex; align-items: center; min-width: 0; vertical-align: middle; }
.dbx > input { width: 10.6em; padding-left: 34px; text-align: left; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.dbx > input::placeholder { letter-spacing: 0; }
.dbx button { background: none; box-shadow: none; border: 0; padding: 0; color: inherit; font-weight: 500; filter: none; border-radius: 8px; gap: 0; }
.dbx button:hover { filter: none; }
.dbx .dbx-btn { position: absolute; left: 5px; top: 50%; translate: 0 -50%; width: 26px; height: 26px; justify-content: center; color: var(--muted); }
.dbx .dbx-btn:hover { background: var(--gold-soft); color: var(--gold-dark); }
.dbx-off .dbx-btn { visibility: hidden; }
.dbx-cover { position: fixed; inset: 0; z-index: 1100; background: transparent; }
.dbx-pop {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 1200; width: 260px; max-width: calc(100vw - 24px); padding: 10px;
  background: var(--panel); color: var(--text); border: 1px solid var(--line-2); border-radius: 14px; box-shadow: var(--shadow-lg);
  font-family: 'Segoe UI', Tahoma, sans-serif; font-size: 13px; text-align: left;
}
.dbx-head { display: flex; align-items: center; gap: 2px; margin-bottom: 8px; }
.dbx-head b { flex: 1; text-align: center; font-size: 14px; font-weight: 700; }
.dbx .dbx-nav { width: 28px; height: 28px; justify-content: center; font-size: 17px; line-height: 1; color: var(--muted); }
.dbx .dbx-nav:hover { background: var(--gold-soft); color: var(--gold-dark); }
.dbx-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.dbx-wd { text-align: center; font-size: 11px; color: var(--muted); padding: 2px 0 4px; }
.dbx .dbx-day { height: 30px; justify-content: center; font-variant-numeric: tabular-nums; }
.dbx .dbx-day:hover { background: var(--gold-soft); }
.dbx .dbx-day.today { box-shadow: inset 0 0 0 1px var(--gold); }
.dbx .dbx-day.on { background: var(--gold-grad); color: var(--accent-ink); font-weight: 700; }
.dbx .dbx-day:disabled { opacity: .28; cursor: default; background: none; }
.dbx-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; padding-top: 6px; border-top: 1px solid var(--line); direction: rtl; }
.dbx .dbx-link { padding: 4px 8px; color: var(--gold-dark); font-size: 12.5px; gap: 6px; }
.dbx .dbx-link:hover { background: var(--gold-soft); }
.dbx .dbx-link:disabled { opacity: .4; }
.dbx-dt > input { width: 13.8em; }
.dbx-grid.dbx-months { grid-template-columns: repeat(4, 1fr); gap: 4px; }
.dbx .dbx-months .dbx-day { height: 34px; }
@media print { .dbx > input { padding-left: 10px; border: 0; } }

/* ═══ الدفعة 56 — ورقةُ التسكير (TskirSheet) — طلبُ المالك 2026-10-17: «اعمل التسكير … في الويب». نظيرُ RepInvoice3 في المكتبي تحت ترويسة الهويّة:
   جداولُ الجسم بخطّ Times New Roman كالقالب (9.75–11 نقطة)، وخاناتُ التسمية WhiteSmoke ورأسُ جدول البند Gainsboro، والرمزُ ≈33×32 مم.
   الورقةُ بيضاءُ في الوضعين (‎.idp‎) فالألوانُ ثوابت. والتصريحاتُ «!important» لأنّ مطبوعَ إطار الهويّة يكسو كلَّ جدولٍ فيه بثياب «طباعة الشبكة»
   (عرضٌ كامل وخطُّ «دبي» وحدودٌ وتظليلٌ متناوب — ‎.idp table:not(…)‎ في @media print) فكان يمدّ جدولَ الإجماليّات فيُسقط الرمزَ ويبدّل الخطّ. *** */
.tsk { font-family: 'Times New Roman', Times, serif; color: #111; font-size: 10pt; line-height: 1.3; }
.tsk table { width: 100% !important; border-collapse: collapse !important; table-layout: auto !important; background: transparent !important; direction: rtl !important;
  font-family: 'Times New Roman', Times, serif !important; color: #111 !important; margin: 0 0 3mm; }
.tsk th, .tsk td { border: .3mm solid #a0a4a8 !important; padding: 1.1mm 2mm !important; white-space: normal !important; position: static !important; color: #111 !important;
  vertical-align: middle !important; background: transparent !important; text-align: center !important;
  font-family: 'Times New Roman', Times, serif !important; font-size: 10pt !important; font-weight: 400 !important; line-height: 1.3 !important; }
.tsk tr:hover td { background: transparent !important; }
.tsk th small { display: block; font-size: 7.6pt; font-weight: 400; color: #444; letter-spacing: .01em; }
.tsk-ttl td { font-weight: 700 !important; font-size: 11pt !important; padding: 1.4mm 2mm !important; }
.tsk-ttl tr:first-child td { background: #f5f5f5 !important; }
.tsk-info th { background: #f5f5f5 !important; width: 19%; text-align: right !important; }
.tsk-info td { width: 31%; font-weight: 700 !important; }
.tsk-time { margin-inline-start: 5mm; font-weight: 400; color: #444; }
.tsk-items th { background: #dcdcdc !important; font-weight: 700 !important; }
.tsk-items td { font-size: 9.75pt !important; }
.tsk-items .c-item { text-align: right !important; width: 34%; }
.tsk-items .c-no { width: 4.5%; }
.tsk-foot { display: flex; align-items: flex-start; gap: 6mm; margin: 0 0 3mm; }
.tsk .tsk-foot .tsk-tot { width: 62% !important; flex: none; margin: 0; }
.tsk-tot th { background: #f5f5f5 !important; text-align: right !important; width: 62%; }
.tsk-tot td { text-align: left !important; font-weight: 700 !important; }
.tsk-tot tr.net th, .tsk-tot tr.net td { font-size: 11pt !important; font-weight: 700 !important; }
.tsk-qr { margin-inline-start: auto; flex: none; }
.tsk-qr img { width: 33mm; height: 32mm; image-rendering: pixelated; display: block; }
.tsk-sum th { background: #dcdcdc !important; font-weight: 700 !important; }
.tsk-words, .tsk-desc, .tsk-cond { border: .3mm solid #a0a4a8; padding: 1.6mm 2.2mm; margin: 0 0 3mm; }
.tsk-cond span { white-space: pre-line; }
@media print { .tsk table, .tsk-foot, .tsk-words, .tsk-desc, .tsk-cond { break-inside: avoid; } }

/* ═══ الدفعة 56 — إيصالُ نقطة البيع الحراريّ 80 مم (ThermalReceipt) — طلبُ المالك 2026-10-17: «اعمل … إيصال 80 مم … في الويب». نظيرُ PosThermalReceiptV4:
   لفّةٌ عرضُها 80 مم، وهوامشُها 8/8/6/10 من مئة البوصة (2.03/2.03/1.52/2.54 مم)، والسطرُ 14 (3.56 مم) والصغيرُ 12 (3.05 مم)، وخطُّ «دبي»،
   والحبرُ 25,29,34 والفواصلُ 210,215,221 ورأسُ الأعمدة 242,244,246. الإيصالُ أبيضُ في الوضعين فالألوانُ ثوابت، وينقض أنماطَ الجداول العامّة.
   وطولُ الصفحة يكتبه js/receipt-print.js قبل الطباعة بطول الإيصال (RollPaper) — والثابتُ أدناه احتياطٌ إن لم يُكتب. *** */
.rcp { width: 80mm; box-sizing: border-box; padding: 1.52mm 2.03mm 2.54mm 2.03mm; background: #fff; color: #191d22; text-align: right;
  font-family: Dubai, "Segoe UI", Tahoma, sans-serif; font-size: 7.5pt; line-height: 3.56mm; font-variant-numeric: tabular-nums; }
.rcp-c { text-align: center; white-space: nowrap; overflow: hidden; }
.rcp-brand { font-size: 10pt; font-weight: 700; line-height: 4.57mm; }
.rcp-trade { font-size: 8pt; line-height: 3.05mm; }
.rcp-s { font-size: 7.5pt; line-height: 3.05mm; }
.rcp-title { font-size: 9pt; font-weight: 700; line-height: 4.06mm; }
.rcp-no { font-size: 8pt; line-height: 3.05mm; }
.rcp-pair { display: flex; font-size: 7.5pt; line-height: 3.56mm; white-space: nowrap; }
.rcp-pair > span:first-child { width: 56%; flex: none; text-align: right; overflow: hidden; }
.rcp-pair > span:last-child { width: 44%; flex: none; text-align: left; overflow: hidden; }
.rcp-rule { height: 0; border-top: .26mm solid #d2d7dd; margin: .76mm 0; }
.rcp-t { width: 100%; table-layout: fixed; border-collapse: collapse; background: transparent; margin: 0; }
.rcp-t th, .rcp-t td { border: 0; padding: 0 .25mm; position: static; color: #191d22; text-align: center; white-space: nowrap; overflow: hidden; vertical-align: middle; }
.rcp-t th { background: #f2f4f6; font-size: 7pt; font-weight: 700; line-height: 3.05mm; }
.rcp-t td { font-size: 7pt; line-height: 3.05mm; }
.rcp-t tr:hover td { background: transparent; }
.rcp-t .rcp-item td { font-size: 7.8pt; font-weight: 700; line-height: 3.56mm; text-align: right; }
.rcp-tot { font-size: 8pt; }
.rcp-net { font-size: 9pt; font-weight: 700; }
.rcp-qr { text-align: center; padding: 1.52mm 0 1.02mm; }
.rcp-qr img { width: 30mm; height: 30mm; image-rendering: pixelated; display: inline-block; }
.rcp-stage { display: flex; justify-content: center; padding: 16px 0; }
.rcp-stage .rcp { box-shadow: 0 2px 14px rgba(0, 0, 0, .18); border-radius: 2px; }
@page rcp { size: 80mm 297mm; margin: 0; }
@media print {
  .rcp { page: rcp; box-shadow: none !important; border-radius: 0 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .rcp-stage { display: block; padding: 0; margin: 0; }
  /* الصفحةُ الحاملةُ للإيصال لا تطبع غيرَه — فلا تُفتح لما سواه ورقةٌ بلا اسم */
  main.content:has(.rcp) > :not(.rcp):not(:has(.rcp)) { display: none !important; }
}

/* ═══ الدفعة 56 — ملصقاتُ QR (طلبُ المالك 2026-10-17: «ملصقات QR في الويب»): قالبُ المكتبي 75 × 15 مم (RepLblBarCode1 بـQR وRepLblBarCode2 بـCode128)
   بمواضعه من اليسار بأعشار المليمتر بعد هامش 0.5 مم: العيارُ (30.77، 1.12) والوزنُ (4.01) والأجرةُ (6.90) بـArial 7 في عمودٍ عرضُه 11.97 يلتفّ فيه
   الوزنُ بحجره فتنزل الأجرةُ تحته، والشعارُ (42.74، 1.12) 7.39 × 8.67، والـQR (55.44، 0) 18.56 × 13.46 موسَّطاً، والـCode128 (51.19، 2.5) 22.21 × 10
   بحشوة 2.6 مم ونصِّه تحته. وما بين 0 و30.7 مم ذيلٌ فارغٌ يلتفّ على القطعة. والـQR في المقاسات الأخرى مربّعٌ في مكان الباركود.
   وآخرُ ملصقٍ في اللفّة بلا فاصل صفحةٍ بعده — فلا تخرج بعده ورقةٌ فارغة. *** */
.label-sheet .label.lbq { position: relative; display: block; padding: 0; direction: ltr; text-align: left; font: 7pt/2.89mm Arial, Helvetica, sans-serif; }
.lbq-txt { position: absolute; left: 31.27mm; top: 1.12mm; width: 11.97mm; white-space: normal; overflow-wrap: anywhere; }
.lbq-logo { position: absolute; left: 43.24mm; top: 1.12mm; width: 7.39mm; height: 8.67mm; object-fit: contain; }
.lbq-qr { position: absolute; left: 55.94mm; top: 0; width: 18.56mm; height: 13.46mm; display: flex; align-items: center; justify-content: center; }
.lbq-qr svg { height: 100%; width: auto; max-width: 100%; display: block; }
.lbq-bar { position: absolute; left: 51.69mm; top: 2.5mm; width: 22.21mm; height: 10mm; padding: 0 2.6mm; box-sizing: border-box; display: flex; flex-direction: column; }
.lbq-bars { flex: 1; min-height: 0; }
.lbq-bars svg { width: 100%; height: 100%; display: block; }
.lbq-code { font: 7pt/1 Arial, Helvetica, sans-serif; text-align: center; padding-top: .3mm; }
.label .l-bar.lbq-sq svg { width: auto; max-width: 100%; margin: 0 auto; }
@media print {
  .label-sheet.roll .label:last-child { page-break-after: auto; break-after: auto; }
}

/* ═══ الدفعة 56 — «مبيعات موظف» (طلبُ المالك 2026-10-17): صفُّ مجموع كلّ موظفٍ في جدول الأسطر على الشاشة بلون الذهب الخفيف. *** */
.emps-sub td { background: var(--gold-soft); }

/* ═══ الدفعة 56 — لا ورقةَ بلا بيانات (طلبُ المالك 2026-10-17: «تاكد من التقارير و المطبوعات عدم طباعة اوراق فارغة ولا يوجد بها اي بيانات»):
   خاناتُ الاعتماد والتوقيع وذيولُ المستندات لا تنتقل وحدها إلى صفحةٍ جديدة — «break-before: avoid» يصحبها بما قبلها (آخرِ أسطر الجدول
   أو بطاقةِ المبلغ) متى وسعتها الصفحةُ التالية؛ كما يفعل إطارُ الهويّة أصلاً بجدول الإجماليّات (‎.idt‎) وقاعدةِ القائمة (‎.idl-rules‎).
   وأوراقُ V4 الكحليّة وكشفُ الحساب يقسمهما سكربتاهما (mast-print.js وkashf-print.js) بالقاعدة نفسِها. *** */
@media print {
  .idp-signs { break-inside: avoid; break-before: avoid; }
  .v4-signs, .v4-signs-blocked { break-before: avoid; }
  /* الفاتورةُ A4: البيانُ والدفعُ والتذييلُ والشروطُ سلسلةٌ لا تنفصل عن آخر أسطر الجدول — فالفاتورةُ الطويلة تنكسر بين أسطرها، ولا تخرج
     صفحةُ «الشروط والأحكام» وحدها (فاتورةٌ بأحد عشر صنفاً كانت تُخرجها) */
  .ivc-stmt, .ivc-pay, .ivc-foot, .ivc-terms { break-before: avoid; }
  /* وسطرُ «الوزن كتابةً» آخرَ الجدول لا ينفصل عن آخر صنف — وإلّا انكسر قبله وحده فخرجت الصفحةُ الثانية بلا صنف */
  .ivc-tbl tr.w { break-before: avoid; }
}

/* ═══ الدفعة 57 — «دليل الحسابات» بالتصميم 9 «الدائرة الشمسيّة» (اختيارُ المالك 2026-10-17 «طبق رقم 9»): الشجرةُ بخطوط وصلها في عمود،
   والخريطةُ الدائريّة ودليلُ الأبواب بجانبها، والبطاقةُ تحتهما. ألوانُ الأبواب ثمانيةٌ متغيّراتٌ للوضعين (والداكنُ للشاشة وحدها)،
   والبادئةُ coa- وحدها فلا يصادم صنفٌ صنفاً قائماً؛ وقواعدُ الهاتف للشاشة وحدها فلا تمسّ الطباعةَ الطوليّة. ═══ */
.coa {
  --k1: #1f6f8f; --k1-bg: #e2eff5; --k2: #b3412f; --k2-bg: #fbe7e4; --k3: #5b4a9a; --k3-bg: #ece8f7; --k4: #1f7a4b; --k4-bg: #e3f3e9;
  --k5: #9a5b12; --k5-bg: #f9ecd9; --k6: #0f6e6a; --k6-bg: #dcf1ef; --k7: #8a3f6e; --k7-bg: #f6e6f0; --k8: #6f6150; --k8-bg: #f1ece2;
  --coa-guide: #cbbc9f; --coa-sel: #fbf0d6; --coa-mark: rgba(248,201,90,.55);
  display: grid; grid-template-columns: clamp(380px, 30vw, 470px) minmax(0, 1fr); gap: 18px; height: calc(100vh - 108px); min-height: 640px; font-size: 14px; }
@media screen { :root[data-theme="dark"] .coa {
  --k1: #7cc0e0; --k1-bg: rgba(124,192,224,.13); --k2: #ff9f92; --k2-bg: rgba(255,143,128,.13); --k3: #bba9f7; --k3-bg: rgba(170,150,245,.15); --k4: #7fdcab; --k4-bg: rgba(111,211,157,.13);
  --k5: #f2b45c; --k5-bg: rgba(242,180,92,.13); --k6: #6fd6cf; --k6-bg: rgba(111,214,207,.13); --k7: #f0a3d2; --k7-bg: rgba(240,163,210,.13); --k8: #cfc6b5; --k8-bg: rgba(255,255,255,.07);
  --coa-guide: #5e574b; --coa-sel: rgba(248,201,90,.14); --coa-mark: rgba(248,201,90,.35); } }
.coa .k1 { --kc: var(--k1); --kb: var(--k1-bg); } .coa .k2 { --kc: var(--k2); --kb: var(--k2-bg); } .coa .k3 { --kc: var(--k3); --kb: var(--k3-bg); } .coa .k4 { --kc: var(--k4); --kb: var(--k4-bg); }
.coa .k5 { --kc: var(--k5); --kb: var(--k5-bg); } .coa .k6 { --kc: var(--k6); --kb: var(--k6-bg); } .coa .k7 { --kc: var(--k7); --kb: var(--k7-bg); } .coa .k8 { --kc: var(--k8); --kb: var(--k8-bg); }
.coa mark { background: var(--coa-mark); color: inherit; border-radius: 3px; padding: 0; }

/* الشجرة: خطوطُ وصلٍ حقيقيّة (عموديّةٌ لكلّ جدٍّ له إخوةٌ بعده، وزاويةٌ للحساب)، وسهمُ طيٍّ للرئيسيّ، والرقمُ في عمودٍ على الطرف */
.coa-tree { display: flex; flex-direction: column; gap: 10px; min-height: 0; min-width: 0; padding: 14px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.coa-th { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.coa-th b { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 800; }
.coa-th b .ico { color: var(--gold); }
.coa-th small { color: var(--muted); font-size: 12px; }
.coa-search { flex: none; display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--line-2); background: var(--input-bg); color: var(--muted); cursor: text; }
.coa-search:focus-within { outline: 3px solid var(--focus); border-color: var(--gold); }
.coa-search input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--text); }
.coa-search input:focus { outline: 0; }
.coa-tools { flex: none; display: flex; gap: 6px; }
.coa .coa-chip { height: 30px; padding: 0 11px; border-radius: 10px; border: 1px solid var(--line); background: var(--panel); color: var(--text); font-size: 12.5px; font-weight: 600; box-shadow: none; gap: 5px; }
.coa .coa-chip:hover { border-color: var(--gold); background: var(--gold-soft); filter: none; }
.coa-list { flex: 1; min-height: 0; overflow: auto; margin: 0 -6px; padding: 0 2px 8px; }
.coa-tr { display: flex; align-items: center; min-height: 33px; padding-inline: 6px 8px; border-radius: 10px; cursor: pointer; font-size: 13px; }
.coa-tr:hover { background: var(--row-hover); }
.coa-tr.top { min-height: 38px; font-size: 14px; font-weight: 800; }
.coa-tr.sel { background: var(--coa-sel); box-shadow: inset -3px 0 0 var(--gold); }
.coa-tr.sel .coa-tn { font-weight: 800; }
.coa-tr.anc .coa-tn { color: var(--gold-dark); font-weight: 700; }
.coa-tr.off .coa-tn { color: var(--faint); text-decoration: line-through; text-decoration-color: rgba(192,57,43,.45); }
.coa-g { flex: none; width: 19px; align-self: stretch; position: relative; font-style: normal; }
.coa-g.v::before, .coa-g.el::before { content: ''; position: absolute; top: 0; height: 100%; inset-inline-start: 10px; border-inline-start: 1.5px solid var(--coa-guide); }
.coa-g.el:not(.mid)::before { height: 50%; }
.coa-g.el::after { content: ''; position: absolute; top: 50%; inset-inline-start: 10px; width: 9px; border-top: 1.5px solid var(--coa-guide); }
.coa .coa-tw { flex: none; width: 22px; height: 22px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 6px; background: none; box-shadow: none; color: var(--muted); }
.coa button.coa-tw:hover { background: var(--gold-soft); color: var(--gold-dark); filter: none; }
.coa .coa-tw .ico { transition: transform .15s; }
.coa .coa-tw.closed .ico { transform: rotate(90deg); }
.coa .coa-tw.leaf::after { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--coa-guide); }
.coa-dot { flex: none; width: 10px; height: 10px; border-radius: 50%; margin-inline: 4px 6px; background: var(--kc, var(--gold)); box-shadow: 0 0 0 3px var(--kb, var(--gold-soft)); }
.coa-ti { flex: none; width: 24px; display: grid; place-items: center; }
.coa-ti.main { color: var(--gold); }
.coa-ti.sub { color: var(--faint); }
.coa-tn { flex: 0 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-inline: 4px 6px; }
.coa-stop { flex: none; font-size: 11px; font-weight: 700; color: var(--bad); background: var(--bad-soft); border-radius: 10px; padding: 0 8px; line-height: 20px; }
.coa-tc { flex: none; margin-inline-start: auto; font-size: 12px; color: var(--muted); padding: 1px 8px; border-radius: 7px; background: var(--sunken); letter-spacing: .3px; }
.coa-tr.sel .coa-tc { background: var(--panel); color: var(--gold-dark); font-weight: 700; }
.coa-empty { padding: 30px 10px; text-align: center; color: var(--muted); }

/* الخريطةُ الدائريّة ودليلُ الأبواب */
.coa-mid { display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 16px; min-height: 0; min-width: 0; }
.coa-map { display: flex; align-items: center; gap: 26px; min-width: 0; padding: 12px 20px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.coa-chart { flex: none; position: relative; width: 300px; height: 300px; }
.coa-svg { display: block; width: 100%; height: 100%; }
.coa-seg { fill: var(--kc); stroke: var(--panel); stroke-width: 1; cursor: pointer; transition: fill-opacity .15s; }
.coa-seg.d1 { fill-opacity: .95; } .coa-seg.d2 { fill-opacity: .66; } .coa-seg.d3 { fill-opacity: .46; } .coa-seg.d4 { fill-opacity: .3; } .coa-seg.d5 { fill-opacity: .22; } .coa-seg.d6 { fill-opacity: .16; }
.coa-seg:hover { fill-opacity: 1; }
.coa-seg.on { stroke: var(--gold); stroke-width: 2.4; fill-opacity: .9; }
.coa-seg.sel { fill: var(--gold); fill-opacity: 1; stroke: var(--gold-dark); stroke-width: 1.6; }
.coa-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; pointer-events: none; }
.coa-center small { font-size: 10px; color: var(--muted); }
.coa-center b { max-width: 96px; font-size: 12.5px; line-height: 1.35; font-weight: 800; }
.coa-center .num { font-size: 11px; color: var(--gold-dark); font-weight: 800; }
.coa-legend { flex: 1; min-width: 0; }
.coa-legend h3 { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 800; }
.coa-legend h3 .ico { color: var(--gold); }
.coa-legend p { margin: 2px 0 10px; color: var(--muted); font-size: 12.5px; }
.coa .coa-lg { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) 34px minmax(60px, 120px) 42px; align-items: center; gap: 10px; padding: 6px 10px;
  border: 0; border-radius: 12px; background: none; box-shadow: none; color: var(--text); font-weight: 500; text-align: start; }
.coa .coa-lg:hover { background: var(--row-hover); filter: none; }
.coa .coa-lg.on { background: var(--kb); }
.coa-lg .coa-dot { margin: 0 2px; }
.coa-lg b { font-size: 14px; font-weight: 700; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.coa-lg .num { font-size: 12.5px; color: var(--muted); font-weight: 700; }
.coa-bar { height: 6px; border-radius: 4px; background: var(--sunken); overflow: hidden; }
.coa-bar i { display: block; height: 100%; border-radius: 4px; background: var(--kc); }
.coa-lgfoot { display: flex; gap: 16px; margin-top: 8px; padding-inline-start: 10px; font-size: 12px; color: var(--muted); }
.coa-lgfoot span { display: inline-flex; align-items: center; gap: 6px; }
.coa-lgfoot i { width: 14px; height: 10px; border-radius: 3px; display: inline-block; background: var(--gold); }
.coa-lgfoot i.on { background: transparent; box-shadow: 0 0 0 2px var(--gold) inset; }

/* البطاقة */
.coa-card { display: flex; flex-direction: column; min-height: 0; min-width: 0; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.coa .coa-back { display: none; }
.coa-ch { flex: none; padding: 14px 20px 12px; border-bottom: 1px solid var(--line); background: linear-gradient(180deg, var(--panel-2), var(--panel)); border-radius: var(--radius) var(--radius) 0 0; }
.coa-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 4px; font-size: 12px; color: var(--muted); }
.coa-crumbs a { color: var(--muted); cursor: pointer; padding: 1px 4px; border-radius: 6px; }
.coa-crumbs a:hover { background: var(--gold-soft); color: var(--gold-dark); }
.coa-crumbs .ico { opacity: .55; transform: rotate(90deg); }
.coa-title { display: flex; align-items: center; gap: 12px; margin-top: 6px; }
.coa-ico { flex: none; width: 46px; height: 46px; border-radius: 15px; display: grid; place-items: center; background: var(--kb, var(--gold-soft)); color: var(--kc, var(--gold-dark)); }
.coa-tt { min-width: 0; }
.coa-title h2 { margin: 0; font-size: 21px; line-height: 1.45; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.coa-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--muted); font-size: 12.5px; }
.coa-sub .num { color: var(--gold-dark); font-weight: 800; letter-spacing: .4px; }
.coa-state { margin-inline-start: auto; flex: none; font-size: 12px; font-weight: 800; padding: 4px 12px; border-radius: 20px; background: var(--ok-soft); color: var(--ok); }
.coa-state.bad { background: var(--bad-soft); color: var(--bad); }
.coa-state.new { background: var(--gold-soft); color: var(--gold-dark); }
.coa-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.coa-tag { font-size: 12px; font-weight: 600; padding: 2px 10px; border-radius: 20px; background: var(--sunken); color: var(--text); border: 1px solid var(--line); white-space: nowrap; }
.coa-tag.gold { background: var(--gold-soft); color: var(--gold-dark); border-color: transparent; }
.coa-tag.dr { background: var(--sea-soft); color: var(--sea); border-color: transparent; }
.coa-tag.cr { background: var(--c-rose-bg); color: var(--c-rose); border-color: transparent; }
.coa-cb { flex: 1; min-height: 0; overflow: auto; padding: 14px 20px 6px; }
.coa-sec { margin-bottom: 14px; }
.coa-sec > h4 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 13px; color: var(--th-ink); font-weight: 800; }
.coa-sec > h4::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.coa-sec > h4 small { font-weight: 600; color: var(--muted); font-size: 12px; }
.coa-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px 16px; }
.coa-f { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.coa-f.w2 { grid-column: span 2; }
.coa-f > label { font-size: 12px; color: var(--muted); font-weight: 600; }
.coa-f input, .coa-f select { width: 100%; height: 38px; padding: 0 12px; font-size: 13.5px; }
.coa-f select:disabled, .coa-f input:disabled { opacity: .55; }
.coa-ro { height: 38px; display: flex; align-items: center; gap: 6px; padding: 0 12px; border-radius: 10px; background: var(--sunken); border: 1px dashed var(--line-2); font-size: 13.5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.coa-ro.code { font-weight: 800; letter-spacing: .6px; color: var(--gold-dark); background: var(--gold-soft); border: 1px solid transparent; justify-content: flex-end; }
.coa-nat { display: flex; height: 38px; padding: 3px; gap: 3px; border-radius: 10px; background: var(--sunken); border: 1px solid var(--line); }
.coa .coa-nat button { flex: 1; padding: 0; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font-weight: 600; box-shadow: none; }
.coa .coa-nat button:hover { filter: none; color: var(--text); }
.coa .coa-nat button.on { background: var(--panel); color: var(--text); font-weight: 800; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.coa-sw { position: relative; display: inline-flex; align-items: center; gap: 10px; height: 38px; cursor: pointer; font-size: 13px; color: var(--muted); }
.coa-sw input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; padding: 0; pointer-events: none; }
.coa-sw i { position: relative; flex: none; width: 40px; height: 22px; border-radius: 12px; background: var(--line-2); transition: .15s; }
.coa-sw i::after { content: ''; position: absolute; top: 3px; inset-inline-start: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: .15s; }
.coa-sw.on i { background: var(--bad); }
.coa-sw.on i::after { inset-inline-start: 21px; }
.coa-sw.dis { opacity: .5; cursor: default; }
.coa-sw:focus-within i { outline: 3px solid var(--focus); }
.coa-note { margin: 10px 0 0; }
.coa-acc { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.coa-accb { border: 1px solid var(--line); border-radius: 12px; padding: 8px 12px; background: var(--panel-2); }
.coa-accb h5 { margin: 0 0 4px; font-size: 12.5px; font-weight: 800; display: flex; justify-content: space-between; }
.coa-accb h5 span { color: var(--gold-dark); }
.coa-chk { display: flex; align-items: center; gap: 8px; padding: 3px 0; font-size: 13px; cursor: pointer; }
.coa-chk input { width: 16px; height: 16px; margin: 0; padding: 0; accent-color: var(--gold); }
.coa-kids { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.coa .coa-kid { padding: 4px 10px; gap: 6px; border-radius: 10px; border: 1px solid var(--line); background: var(--panel-2); color: var(--text); font-size: 12.5px; font-weight: 500; box-shadow: none; }
.coa .coa-kid:hover { border-color: var(--gold); background: var(--gold-soft); filter: none; }
.coa-kid .num { color: var(--muted); font-size: 11.5px; }
.coa-rules { margin: 0; padding: 8px 12px; border-radius: 10px; background: var(--sunken); color: var(--muted); font-size: 12px; line-height: 1.75; }
.coa-msgs { flex: none; display: flex; flex-direction: column; gap: 6px; max-height: 170px; overflow: auto; padding: 8px 20px 0; }
.coa-msgs .alert { margin: 0; }
.coa-acts { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--line); background: var(--panel-2); border-radius: 0 0 var(--radius) var(--radius); }
.coa-acts .coa-sp { flex: 1; }
.coa-acts button, .coa-acts .btn { height: 38px; padding: 0 14px; font-size: 13.5px; }
.coa-acts .coa-del { color: var(--bad); }
.coa-acts .coa-del:hover { background: var(--bad-soft); }

/* الشاشاتُ الأضيق: عمودُ الشجرة أنحف وحقولُ البطاقة عمودان، ثمّ يتراصّ الكلّ على اللوح */
@media screen and (max-width: 1280px) {
  .coa { grid-template-columns: 340px minmax(0, 1fr); }
  .coa-chart { width: 260px; height: 260px; }
  .coa-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .coa .coa-lg { grid-template-columns: auto minmax(0, 1fr) 34px 42px; }
  .coa-lg .coa-bar { display: none; }
}
/* الشاشاتُ القصيرة (حتى 960): خريطةٌ أصغر وبلا سطر الشرح، فيتّسع للبطاقة */
@media screen and (min-width: 1061px) and (max-height: 960px) {
  .coa-map { padding: 8px 18px; gap: 20px; }
  .coa-chart { width: 236px; height: 236px; }
  .coa-center b { max-width: 78px; font-size: 11.5px; }
  .coa-legend p { display: none; }
  .coa-legend h3 { margin-bottom: 6px; }
  .coa .coa-lg { padding: 4px 10px; }
  .coa-lgfoot { margin-top: 4px; }
}
@media screen and (min-width: 821px) and (max-width: 1060px) {
  .coa { grid-template-columns: minmax(0, 1fr); height: auto; min-height: 0; }
  .coa-tree { max-height: 56vh; }
  .coa-card { min-height: 560px; }
}
/* الهاتف: الخريطةُ مصغّرةً، ثمّ الشجرة؛ واختيارُ حسابٍ يفتح بطاقتَه مكانهما بزرّ رجوع، والحفظُ زرٌّ عريض أعلى الأوامر */
@media screen and (max-width: 820px) {
  .coa { display: flex; flex-direction: column; gap: 10px; height: auto; min-height: 0; }
  .coa-mid { display: contents; }
  .coa-map { order: -1; justify-content: center; padding: 10px; }
  .coa-legend { display: none; }
  .coa-chart { width: 230px; height: 230px; }
  .coa-center b { max-width: 76px; font-size: 11px; }
  .coa-center small { display: none; }
  .coa-tree { padding: 10px; }
  .coa-list { max-height: 62vh; }
  .coa-tr .coa-stop { width: 8px; height: 8px; padding: 0; border-radius: 50%; background: var(--bad); font-size: 0; line-height: 0; }
  .coa-card { display: none; }
  .coa.show-card .coa-card { display: flex; }
  .coa.show-card .coa-tree, .coa.show-card .coa-map { display: none; }
  .coa .coa-back { display: flex; align-items: center; gap: 8px; width: 100%; padding: 10px 14px; border: 0; border-bottom: 1px solid var(--line); border-radius: var(--radius) var(--radius) 0 0;
    background: none; box-shadow: none; color: var(--gold-dark); font-weight: 700; justify-content: flex-start; }
  .coa-ch { border-radius: 0; padding: 12px 14px; }
  .coa-title h2 { font-size: 18px; }
  .coa-ico { width: 40px; height: 40px; border-radius: 13px; }
  .coa-cb { overflow: visible; padding: 12px 14px 4px; }
  .coa-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .coa-f.most { grid-column: 1 / -1; }
  .coa-acc { grid-template-columns: 1fr; }
  .coa-msgs { padding: 8px 12px 0; }
  .coa-acts { padding: 10px 12px; gap: 6px; }
  .coa-acts button, .coa-acts .btn { flex: 1 1 0; padding: 0 8px; font-size: 12.5px; justify-content: center; }
  .coa-acts .coa-save { order: -1; flex: 1 1 100%; height: 42px; font-size: 14px; }
  .coa-acts .coa-sp { display: none; }
}
@media print {
  .coa { display: block; height: auto; min-height: 0; }
  .coa-tree, .coa-map, .coa-acts, .coa-msgs, .coa .coa-back { display: none !important; }
  .coa-card { border: 0; box-shadow: none; }
  .coa-cb { overflow: visible; }
}

/* ═══ الدفعة 57 — دليلُ الفروع: «قائمة الفروع» جدولاً بألوان النموذج (متغيّرات ‎.df‎ للوضعين) مكانَ صفّ الأزرار، و«فرع جديد» بجوار الشركة،
   و«إيقاف الفرع» بلون التحذير و«تفعيل الفرع» بلون النجاح. البادئة brm- وحدها. ═══ */
.df .brm-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 8px; }
.df .brm-head .df-f { flex: 0 1 440px; min-width: 300px; }
.df .brm-new { border-style: dashed; }
.df .brm-new.primary { border-style: solid; }
.df .brm-list { max-height: 264px; overflow: auto; border: 1px solid var(--df-line); border-radius: 6px; background: var(--df-in); }
.df .brm-tbl { font-size: 12.5px; background: var(--df-in); }
.df .brm-tbl th { position: sticky; top: 0; z-index: 1; padding: 6px 10px; background: var(--df-th); color: var(--df-th-ink); font-weight: 700; border-inline-start: 1px solid var(--df-th-line); white-space: nowrap; }
.df .brm-tbl td { padding: 5px 10px; border-inline-start: 1px solid var(--df-cell); white-space: nowrap; }
.df .brm-tbl td.num { text-align: right; }
.df .brm-tbl td.brm-e { text-align: left; }
.df .brm-tbl tbody tr { cursor: pointer; }
.df .brm-tbl tbody tr:hover td { background: var(--df-hover); }
.df .brm-tbl tbody tr.sel td { background: var(--df-hl); }
.df .brm-tbl tbody tr.sel td:first-child { box-shadow: inset -3px 0 0 var(--gold); }
.df .brm-tbl tbody tr.off td { color: var(--muted); }
.df .brm-tbl tbody tr.off td b { text-decoration: line-through; text-decoration-color: rgba(192,57,43,.5); }
.df .brm-tbl tbody tr.brm-newrow { cursor: default; }
.df .brm-tag { display: inline-block; margin-inline-start: 6px; padding: 0 8px; border-radius: 10px; font-size: 11px; font-weight: 700; line-height: 18px; }
.df .brm-tag.ok { background: var(--ok-soft); color: var(--ok); }
.df .brm-tag.bad { background: var(--bad-soft); color: var(--bad); }
.df .brm-tag.ses { background: var(--gold-soft); color: var(--gold-dark); }
.df button.brm-stop { color: var(--bad); border-color: var(--bad); }
.df button.brm-stop:hover { background: var(--bad-soft); }
.df button.brm-act { color: var(--ok); border-color: var(--ok); }
.df button.brm-act:hover { background: var(--ok-soft); }
@media screen and (max-width: 820px) {
  .df .brm-head .df-f { flex: 1 1 100%; min-width: 0; }
  .df .brm-list { max-height: 50vh; }
}
.a11y-table-caption,
.a11y-live-region {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}


/* حد أخطاء المكونات: رسالة آمنة قابلة للاستخدام بدلاً من انهيار واجهة Blazor. */
.component-error{min-height:60vh;display:grid;place-items:center;padding:2rem;text-align:center}
.component-error-card{width:min(34rem,100%);padding:2rem;border:1px solid var(--line,#d8d3c8);border-radius:1rem;background:var(--surface,#fff);box-shadow:0 1rem 3rem #0001}
.component-error-card h1{margin:.8rem 0;font-size:1.5rem}
.component-error-card p{margin:.5rem 0;color:var(--muted,#645f55)}
.component-error-ref{font-family:ui-monospace,Consolas,monospace;direction:ltr}
.component-error-actions{display:flex;gap:.75rem;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:1.25rem}
.blazor-error-hidden{display:none}