/* ═══════════════ ألوان المعنى + إصلاحات لقطات المضيف (18 سبتمبر 2026) ═══════════════
   طلبه: «أبي الربح أخضر والتكاليف أو المبالغ السلبية أحمر». القاعدة بكل الموقع:
     أخضر  = ربح/صافي/دخل موجب      (.pos)      أحمر = مبلغ سالب أو تكلفة/مصروف (.neg / .cost)
     تركوازي = فعل وحالة (أزرار، محجوز، نشط) — ما يُستخدم للمبالغ بعد الآن.
   fx.js يضيف الأصناف تلقائياً من نص العنوان وإشارة الرقم، فتنطبق على أي قسم بلا تعديل ملفه.
   ومعها: بقايا الكحلي من المظهر القديم، فيضان أرقام بطاقة البنك، رأس الجدول، وألوان التقويم. */
html[data-skin="calm"] { --pos: #3fd39a; --neg: #ff6b72; --pos-soft: rgba(63,211,154,.12); --neg-soft: rgba(255,107,114,.12); }

/* ─── ألوان المعنى ─── */
html[data-skin="calm"] :is(.pos, .kpi.pos .value, .tile.pos .tile-value, td.pos, .kv .pos, .kv .net, td.net, .money.net, .net) { color: var(--pos) !important; }
html[data-skin="calm"] :is(.neg, .cost, .kpi.neg .value, .kpi.cost .value, .tile.neg .tile-value, td.neg, .kv .neg) { color: var(--neg) !important; }
html[data-skin="calm"] :is(.kpi.pos, .kpi.neg, .kpi.cost) .value small, html[data-skin="calm"] :is(.tile.pos, .tile.neg) .tile-value small { color: inherit; opacity: .7; }
html[data-skin="calm"][data-theme="dark"] .kpi.pos .kpi-ico, html[data-skin="calm"][data-theme="dark"] .tile.pos .tile-ico { color: var(--pos); }
html[data-skin="calm"][data-theme="dark"] :is(.kpi.neg, .kpi.cost) .kpi-ico, html[data-skin="calm"][data-theme="dark"] .tile.neg .tile-ico { color: var(--neg); }
/* خط سفلي رفيع بلون المعنى يوضّح البطاقة من بعيد */
html[data-skin="calm"][data-theme="dark"] :is(.kpi.pos, .kpi.neg, .kpi.cost, .tile.pos, .tile.neg)::before {
  content: ""; position: absolute; inset-inline: 18px; bottom: 0; height: 2px; border-radius: 2px 2px 0 0; background: var(--pos); opacity: .7; box-shadow: 0 0 14px var(--pos);
}
html[data-skin="calm"][data-theme="dark"] :is(.kpi.neg, .kpi.cost, .tile.neg)::before { background: var(--neg); box-shadow: 0 0 14px var(--neg); }
html[data-skin="calm"] .kpi .delta.up, html[data-skin="calm"] .trend.up { color: var(--pos); }
html[data-skin="calm"] .kpi .delta.down, html[data-skin="calm"] .trend.down { color: var(--neg); }
html[data-skin="calm"][data-theme="dark"] .kpi.primary .delta.up { color: #a8ffe0; } html[data-skin="calm"][data-theme="dark"] .kpi.primary .delta.down { color: #ffc2c5; }
/* شارات الاقتراح بالسوق: ارفع أخضر، نزّل أحمر (كانت موجودة — نوحّد الدرجة) */
html[data-skin="calm"][data-theme="dark"] .badge.success { color: var(--pos); background: var(--pos-soft); border-color: rgba(63,211,154,.25); }
html[data-skin="calm"][data-theme="dark"] .badge.danger { color: var(--neg); background: var(--neg-soft); border-color: rgba(255,107,114,.25); }

/* ─── بقايا الكحلي من المظهر الداكن القديم (#1e2436 / #171c2c) ─── */
html[data-skin="calm"][data-theme="dark"] :is(.kv, .msg-box) { background: linear-gradient(180deg, #15161a, #0f1012); border: 1px solid #26272e; box-shadow: 0 1px 0 rgba(255,255,255,.04) inset; }
html[data-skin="calm"][data-theme="dark"] .kv .sep { background: #26272e; }
html[data-skin="calm"][data-theme="dark"] .kv > :nth-child(odd):not(.sep) { color: var(--text-2); }
html[data-skin="calm"][data-theme="dark"] .kv > :nth-child(even) { font-family: var(--num-font); font-weight: 600; }
html[data-skin="calm"][data-theme="dark"] .login-body { background: #000; }
html[data-skin="calm"][data-theme="dark"] .login-card { background: linear-gradient(180deg, #131418, #0a0a0b) padding-box, linear-gradient(180deg, rgba(90,216,201,.4), rgba(255,255,255,.04) 45%) border-box; border: 1px solid transparent; }
html[data-skin="calm"][data-theme="dark"] .nav-dot { box-shadow: 0 0 0 3px #000; }
html[data-skin="calm"][data-theme="dark"] .nav-sub::before { background: #26272e; }
html[data-skin="calm"][data-theme="dark"] .nav-sub-item.active::before { box-shadow: 0 0 0 3px #000; }
html[data-skin="calm"][data-theme="dark"] .nav-item.active::after { display: none; }
html[data-skin="calm"][data-theme="dark"] .nav-item:hover .nav-ico { background: transparent; color: var(--text); }
html[data-skin="calm"][data-theme="dark"] .nav-item.active .nav-ico { background: var(--primary-soft); color: var(--primary); box-shadow: none; }
html[data-skin="calm"][data-theme="dark"] .row-icon.neutral { background: #1a1b20; color: var(--text-2); }
html[data-skin="calm"][data-theme="dark"] .btn-ghost[aria-pressed="true"] { background: var(--primary-soft); border-color: rgba(44,196,179,.35); color: var(--primary-strong); }
html[data-skin="calm"][data-theme="dark"] .health-item .status.ok { box-shadow: 0 0 0 4px var(--pos-soft); background: var(--pos); }
html[data-skin="calm"][data-theme="dark"] .health-item .status.bad { box-shadow: 0 0 0 4px var(--neg-soft); background: var(--neg); }
html[data-skin="calm"][data-theme="dark"] :is(.chip, .day-chip, .stat, .month-stats > *) { background: #141518; border-color: #26272e; color: var(--text-2); }

/* ─── فيضان الأرقام: مؤشرات داخل بطاقة ضيقة (بطاقة البنك) ─── */
html[data-skin="calm"] .kpi { min-width: 0; overflow: hidden; }
html[data-skin="calm"] .kpi .value { min-width: 0; max-width: 100%; }
html[data-skin="calm"] .card .kpis { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
html[data-skin="calm"] .card .kpis .kpi { min-height: 92px; padding: 14px 16px; }
html[data-skin="calm"] .card .kpis .kpi .value, html[data-skin="calm"] .card .kpis .kpi.primary .value { font-size: 22px; }
html[data-skin="calm"] .card .kpis .kpi .value small { font-size: 12px; }
html[data-skin="calm"] .card .kpis .kpi.primary { grid-column: auto; }
/* pro.css يفرض 4 أعمدة والرئيسي بعرضين على مؤشرات قسم الأرباح — كان يتسرب للمؤشرات داخل بطاقة البنك فتنضغط */
html[data-skin="calm"] body[data-view] .card .kpis { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
html[data-skin="calm"] body[data-view] .card .kpis .kpi.primary { grid-column: auto; }
html[data-skin="calm"] .card .kpis .kpi .label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ─── الجداول: بلا تمرير داخلي (كان الصف ينقص تحت الرأس الثابت ويبان كخلل) ─── */
html[data-skin="calm"] .table-wrap { max-height: none; overflow-y: visible; overflow-x: auto; }
html[data-skin="calm"] th { position: static; }
html[data-skin="calm"][data-theme="dark"] thead th { border-bottom: 1px solid #2a2c33; }
html[data-skin="calm"][data-theme="dark"] tbody tr:hover td { background: #121316; }
html[data-skin="calm"][data-theme="dark"] tbody tr:hover td:first-child { box-shadow: inset -2px 0 0 var(--primary); }

/* جدول «تكاليفي»: وصف البند الطويل (nowrap) كان يدفع عمود المبلغ خارج البطاقة فيختفي — الوصف يلتف والمبلغ يبقى سطراً واحداً */
html[data-skin="calm"] .grid-2 .card td:first-child, html[data-skin="calm"] .panel td:first-child { white-space: normal; min-width: 150px; line-height: 1.55; }
html[data-skin="calm"] .grid-2 .card td:not(:first-child) { white-space: nowrap; }

/* ─── التقويم: ألوان نظيفة بدل الشفافية الموحلة ─── */
html[data-skin="calm"][data-theme="dark"] .cell.empty { background: transparent !important; border-color: transparent !important; box-shadow: none !important; }
html[data-skin="calm"][data-theme="dark"] .cell.empty::after { display: none; }
html[data-skin="calm"][data-theme="dark"] .cell.weekend:not(.booked) { background: linear-gradient(180deg, rgba(242,198,109,.10), rgba(242,198,109,.04)); border-color: rgba(242,198,109,.24); color: var(--warn); }
html[data-skin="calm"][data-theme="dark"] .cell.booked { background: linear-gradient(165deg, #35d0be, #17a394); border-color: transparent; color: #03120f; box-shadow: 0 1px 0 rgba(255,255,255,.35) inset, 0 10px 22px -14px rgba(44,196,179,.9); }
html[data-skin="calm"][data-theme="dark"] .cell.booked :is(.d, .p, .g) { color: #03120f; }
/* الأيام الماضية: واضحة لكن هادئة — بلا opacity على الخلية كلها */
html[data-skin="calm"][data-theme="dark"] .cell.past { opacity: 1; }
html[data-skin="calm"][data-theme="dark"] .cell.past:not(.booked) { background: #08080a; border-color: #15161a; color: #5d626e; }
html[data-skin="calm"][data-theme="dark"] .cell.past:not(.booked) :is(.d, .p) { color: #5d626e; }
html[data-skin="calm"][data-theme="dark"] .cell.past.weekend:not(.booked) { background: #0a0908; border-color: #1d1a12; } html[data-skin="calm"][data-theme="dark"] .cell.past.weekend:not(.booked) :is(.d, .p) { color: #7a6a44; }
html[data-skin="calm"][data-theme="dark"] .cell.past.booked { background: rgba(44,196,179,.10); border-color: rgba(44,196,179,.20); box-shadow: none; }
html[data-skin="calm"][data-theme="dark"] .cell.past.booked :is(.d, .p, .g) { color: #6fbdb3; }
html[data-skin="calm"][data-theme="dark"] .cell.today { box-shadow: 0 0 0 2px #000, 0 0 0 4px var(--primary), 0 0 26px -4px rgba(44,196,179,.8); }