.qinp:focus{outline:none;border-color:var(--gold);}
.inv-line-price{margin-right:auto;font-size:12.5px;color:var(--gold2);font-weight:700;white-space:nowrap;}
/* currency bar */
.cur-bar{display:flex;gap:5px;margin-bottom:9px;}
.cbtn{flex:1;padding:6px;border-radius:7px;border:1px solid var(--border);background:transparent;color:var(--cream2);cursor:pointer;font-family:'Tajawal',sans-serif;font-weight:700;font-size:12.5px;transition:all .15s;}
.cbtn.on{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#080f0d;border-color:var(--gold2);}
/* ── شبكة أزرار المقاسات (36–60) — منتجات الأزياء بمحرر الموقع ──
   مفعّل (.on) = متوفر (تلوين ذهبي زي باقي أزرار التبديل بالتطبيق).
   غير مفعّل = غير متوفر، ومعلّم بعلامة X مرسومة فوق الرقم (خطّين
   متقاطعين بـpseudo-elements، بدل الاعتماد على أي حرف/رمز نصي). */
.size-grid{display:flex;flex-wrap:wrap;gap:6px;}
.size-btn{position:relative;width:38px;height:36px;border-radius:8px;border:1px solid var(--border);background:var(--bg2);color:var(--cream2);cursor:pointer;font-family:'Tajawal',sans-serif;font-weight:700;font-size:12.5px;transition:all .15s;display:flex;align-items:center;justify-content:center;}
.size-btn:hover{border-color:var(--gold);}
.size-btn.on{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#080f0d;border-color:var(--gold2);}
.size-btn:not(.on){color:var(--muted);}
.size-btn:not(.on)::before,
.size-btn:not(.on)::after{content:'';position:absolute;left:9px;right:9px;top:50%;height:1.5px;background:var(--red);opacity:.85;pointer-events:none;}
.size-btn:not(.on)::before{transform:translateY(-50%) rotate(45deg);}
.size-btn:not(.on)::after{transform:translateY(-50%) rotate(-45deg);}
.size-grid-hint{font-size:11px;color:var(--muted);margin-top:6px;line-height:1.6;}
/* ── علامة اختصار الكيبورد الصغيرة جنب أي زر إله اختصار (11-shortcuts.js) ──
   خط رفيع صغير دايمًا ظاهر جنب الزر (مو بس عند اللمس/الهوفر)، بالإضافة
   لـtitle على نفس الزر يظهر كـtooltip بالهوفر على الكمبيوتر وباللمس
   الطويل على الموبايل — الاثنين سوا زي ما طُلب. */
.sh-badge{
  display:inline-block;margin-inline-start:6px;direction:ltr;unicode-bidi:plaintext;
  font-family:monospace;font-size:10px;font-weight:800;letter-spacing:.3px;
  color:#eafff5;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.25);
  border-radius:5px;padding:1px 5px;vertical-align:middle;line-height:1.6;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
}
/* شارة دايمًا رقعة غامقة + نص أبيض بغض النظر عن لون الزر تحتها (حتى
   فوق الأزرار المتدرّجة الذهبية/الخضراء متل .btn-gold وcbtn.on، اللي
   كان النص الذهبي القديم بيختفي فيها لتطابق الألوان) — هيك التباين
   مضمون دايمًا سواء بالثيم الداكن أو الفاتح، فوق أي خلفية زر. */
/* لما تكون الشارات مخفية من الإعدادات — العلامة فقط تختفي، الاختصار
   وtitle (تلميح الهوفر/اللمس الطويل) يضلوا شغالين تمامًا. */
html.sh-badges-hidden .sh-badge{display:none;}
/* ── القائمة الجانبية: شارة الاختصار لأقصى اليسار (أقصى نهاية السطر) ──
   قبل: الشارة كانت تلزق بنهاية نص الصفحة فتطلع بمواضع مختلفة حسب طول النص.
   هلأ: margin-inline-start:auto بتدفعها لنهاية السطر (يسار بالعربي، يمين باللغات LTR)
   فكلها بعمود واحد منظم، والنص الطويل بيلتف بدل ما يزاحم الشارة. */
/* الشارة نفسها direction:ltr فالهوامش المنطقية (inline-start) بتنعكس عليها — لهيك هوامش فيزيائية حسب اتجاه الصفحة */
.ni .sh-badge{flex-shrink:0;white-space:nowrap;}
html[dir="rtl"] .ni .sh-badge{margin-right:auto;margin-left:0;}
html[dir="ltr"] .ni .sh-badge{margin-left:auto;margin-right:0;}
/* الروسي: نصوصه أطول، فالشريط أعرض شوي على الكمبيوتر حتى تضل معظم الصفحات بسطر واحد */
@media (min-width:769px){ html[lang="ru"] .sidebar{width:236px;} }
.ni > span:not(.ni-icon):not(.sh-badge){min-width:0;line-height:1.35;overflow-wrap:anywhere;}
/* ── أزرار الصفحات (.has-sh): نفس منطق القائمة الجانبية — الشارة لأقصى اليسار بالعربي (نهاية السطر باللغات LTR)، والنص من جهة البداية ── */
.has-sh{display:inline-flex;align-items:center;gap:6px;}
.cbtn.has-sh{display:flex;justify-content:flex-start;}
.btn.has-sh,.cbtn.has-sh{justify-content:flex-start;}
.has-sh .sh-badge{flex-shrink:0;white-space:nowrap;}
html[dir="rtl"] .has-sh .sh-badge{margin-right:auto;margin-left:0;}
html[dir="ltr"] .has-sh .sh-badge{margin-left:auto;margin-right:0;}
/* ── عميل ومورّد بنفس الوقت (29-linked-parties.js) ── */
.sn-badge{display:inline-block;font-size:11px;font-weight:800;color:var(--gold2);background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:1px 7px;cursor:pointer;line-height:1.5;direction:ltr;}
.sn-badge:hover{border-color:var(--gold2);}
.lk-box{border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:var(--bg3);display:flex;flex-direction:column;gap:6px;}
.lk-net{font-size:15px;line-height:1.4;}
.lk-sub{line-height:1.6;}
.lk-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px;}
/* ── الرسم البياني بالتقارير (12-reports-chart.js) ── */
.chart-metric-toggle{display:flex;align-items:center;gap:6px;font-size:12px;cursor:pointer;user-select:none;color:var(--cream2);}
.chart-metric-toggle input[type="checkbox"]{accent-color:var(--gold);}
.chart-color-pick{width:16px;height:16px;padding:0;border:1.5px solid var(--border);border-radius:50%;cursor:pointer;background-color:var(--gold);}
.ccp-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:14px 4px 4px;}
.ccp-swatch{width:34px;height:34px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform .1s,border-color .13s;}
.ccp-swatch:hover{transform:scale(1.08);}
.ccp-swatch.ccp-sel{border-color:var(--cream);}
.chart-dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex-shrink:0;}
.chart-legend-item{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--cream2);padding:4px 10px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);}
.chart-legend-item b{color:var(--cream);font-weight:800;direction:ltr;unicode-bidi:plaintext;}
/* لوحة الرسم — خلفية متدرّجة من ثيم التطبيق نفسه + توهّج خفيف متحرّك */
.chart-canvas-wrap{
  position:relative;width:100%;overflow-x:auto;overflow-y:hidden;border-radius:16px;
  background:
    radial-gradient(circle at 15% 20%, rgba(184,146,63,.16), transparent 45%),
    radial-gradient(circle at 85% 80%, rgba(95,209,138,.10), transparent 50%),
    linear-gradient(160deg, rgba(255,255,255,.035), rgba(255,255,255,0) 40%),
    var(--bg2);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), inset 0 0 40px rgba(0,0,0,.25);
}
.chart-tooltip{
  position:absolute;pointer-events:none;z-index:5;min-width:120px;
  background:rgba(15,22,18,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:8px 10px;
  font-size:11px;color:var(--cream);box-shadow:0 6px 20px rgba(0,0,0,.45);
  opacity:0;transition:opacity .1s ease;transform:translate(-50%,-100%);
}
.chart-tooltip.show{opacity:1;}
.chart-tooltip-date{direction:ltr;unicode-bidi:plaintext;color:var(--muted);font-size:10px;margin-bottom:4px;font-weight:700;}
.chart-tooltip-row{display:flex;align-items:center;gap:6px;white-space:nowrap;}
.chart-tooltip-row b{direction:ltr;unicode-bidi:plaintext;color:var(--cream);}
.inv-sum{display:flex;justify-content:space-between;margin-bottom:5px;font-size:13px;color:var(--cream2);}
.inv-grand{font-size:18px;font-weight:800;color:var(--gold2);border-top:1px solid var(--border);padding-top:7px;margin-top:7px;display:flex;justify-content:space-between;}

/* ── LED Toggle (دائرة مضيئة = مفعّل / بدون ضو = معطّل) ── */
.led-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 2px;cursor:pointer;border-bottom:1px solid var(--border);}
.led-row:last-child{border-bottom:none;}
.led-row-text{flex:1;min-width:0;}
.led-row-title{font-size:13px;font-weight:700;color:var(--cream);}
.led-row-desc{font-size:11px;color:var(--muted);margin-top:2px;line-height:1.5;}
.led-dot{width:13px;height:13px;border-radius:50%;background:var(--bg2);border:1px solid var(--border);flex-shrink:0;transition:all .2s;}
.led-dot.on{background:var(--gold2);border-color:var(--gold2);box-shadow:0 0 9px 2px rgba(18,200,135,.65);}
.led-inline-fields{display:flex;gap:10px;padding:2px 2px 11px;margin-top:-4px;border-bottom:1px solid var(--border);}
.led-inline-fields:last-child{border-bottom:none;}

/* ── نافذة إعدادات التقرير اليومي: تخطيط عمودين (إعدادات + معاينة حيّة ثابتة) ── */
.dr-modal{max-width:940px;}
.dr-layout{display:flex;gap:22px;align-items:flex-start;}
.dr-settings-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:14px;}
.dr-preview-col{width:300px;flex-shrink:0;position:sticky;top:0;align-self:flex-start;}
.dr-preview-label{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:800;color:var(--gold2);margin-bottom:9px;}
.dr-preview-label svg{width:15px;height:15px;stroke:currentColor;flex-shrink:0;}
@media (max-width:860px){
  .dr-layout{flex-direction:column;}
  .dr-preview-col{width:100%;position:static;order:-1;}
}

/* ── معاينة التقرير الحية (تحاكي إيصال الطابعة الحرارية: ورق أبيض دايمًا بكل الأوضاع) ── */
.dr-preview{background:#fff;color:#111;border-radius:10px;padding:14px 16px;font-size:12px;max-height:60vh;overflow-y:auto;box-shadow:0 6px 18px rgba(0,0,0,.35);}
.dr-preview .dpv-store{font-size:14px;font-weight:900;text-align:center;margin-bottom:2px;}
.dr-preview .dpv-title{font-size:12px;font-weight:800;text-align:center;color:#333;margin-bottom:8px;}
.dr-preview .dpv-div{border-top:1px dashed #999;margin:7px 0;}
.dr-preview .dpv-line{display:flex;justify-content:space-between;padding:2.5px 0;font-size:11.5px;}
.dr-preview .dpv-line.fw{font-weight:800;}
.dr-preview .dpv-line.grand{font-weight:900;font-size:12.5px;}
.dr-preview .dpv-sec{font-weight:800;font-size:11px;margin:9px 0 4px;border-bottom:1px solid #333;padding-bottom:2px;color:#222;}
.dr-preview .dpv-tbl-row{display:flex;justify-content:space-between;font-size:10.5px;color:#444;padding:2px 0;border-bottom:1px dotted #ddd;}
.dr-preview .dpv-fade{opacity:.28;}

/* ── مجموعات الإعدادات: كل مجموعة كرت مستقل بعنوان + أيقونة واضحين ── */
.dr-settings-group{background:var(--bg2);border:1px solid var(--border);border-radius:13px;padding:6px 16px 8px;}
.dr-settings-group .sec-title{display:flex;align-items:center;gap:9px;margin:0 !important;padding:12px 0;font-size:13.5px;border-bottom:1px solid var(--border);}
.dr-settings-group .sec-title svg{width:16px;height:16px;stroke:var(--gold2);flex-shrink:0;}
.dr-settings-group .led-row{padding:13px 4px;margin:0 -4px;border-radius:9px;transition:background .15s;}
.dr-settings-group .led-row:hover{background:var(--bg4);}
.dr-settings-group .led-row-title{font-size:13.5px;}
.dr-settings-group .led-row-desc{font-size:11.5px;line-height:1.55;}
.dr-settings-group .led-inline-fields{margin:0 -4px 4px;padding-left:4px;padding-right:4px;}
.dr-settings-group .t-muted.fs11{padding:0 4px 10px;margin-top:-2px;}

/* ── Alerts / Toast ── */
.alert{padding:10px 13px;border-radius:8px;margin-bottom:12px;font-size:13px;font-weight:500;}
.al-warn{background:rgba(230,150,20,.14);border:1px solid rgba(230,150,20,.35);color:#f0a830;}
.al-danger{background:rgba(150,48,48,.13);border:1px solid rgba(150,48,48,.3);color:#e08080;}
.al-ok{background:rgba(13,158,110,.13);border:1px solid rgba(13,158,110,.35);color:#7dca7d;}
.toast-container{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:100000;display:flex;flex-direction:column-reverse;gap:8px;align-items:center;max-width:92vw;pointer-events:none;}
.toast-item{pointer-events:auto;position:relative;background:var(--bg3);border:1px solid var(--border);border-radius:9px;padding:11px 20px;font-size:13px;font-weight:700;box-shadow:0 6px 24px rgba(0,0,0,.5);display:flex;align-items:center;gap:8px;opacity:0;transform:translateY(50px) scale(.92);transition:transform .26s ease,opacity .26s ease;touch-action:pan-y;max-width:92vw;}
.toast-item.show{opacity:1;transform:translateY(0) scale(1);}
.toast-item.ok{border-color:var(--green);color:#7dca7d;}
.toast-item.err{border-color:var(--red);color:#e08080;}
.toast-item.warn{border-color:#c98a2e;color:#eab35e;}
.toast-item.inf{border-color:var(--blue);color:#80aaee;}
.toast-item.cash{border-color:var(--gold);color:var(--gold2);}
.toast-item.pinned{padding-left:32px;}
.toast-close-btn{position:absolute;top:2px;left:4px;background:none;border:none;color:inherit;opacity:.7;font-size:16px;line-height:1;cursor:pointer;padding:4px;}
.toast-pin-dot{position:absolute;top:6px;left:6px;width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8;}

/* ── منتقي التاريخ المخصّص (بثيم التطبيق حصرًا، بلا اعتماد على نظام الجهاز) ── */
.dp-field{width:100%;cursor:pointer;}
.dp-popup{width:300px;max-width:92vw;padding:18px;}
.dp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.dp-nav-btn{background:none;border:none;color:var(--cream2);cursor:pointer;padding:6px;display:flex;align-items:center;border-radius:7px;}
.dp-nav-btn:hover{color:var(--gold);background:var(--bg4);}
.dp-month-lbl{font-weight:800;color:var(--gold2);font-size:14px;}
.dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.dp-dow{text-align:center;font-size:11px;color:var(--muted);font-weight:700;padding:6px 0;}
.dp-day{text-align:center;font-size:13px;padding:9px 0;border-radius:8px;cursor:pointer;color:var(--cream);}
.dp-day:hover{background:var(--bg4);}
.dp-day.dp-sel{background:var(--gold);color:#fff;font-weight:800;}
.dp-day.dp-today:not(.dp-sel){border:1px solid var(--gold);}
.dp-foot{display:flex;gap:8px;margin-top:16px;}

/* ── نظام الاشتراكات ── */
.sub-banner{display:none;position:fixed;top:0;left:0;right:0;z-index:90;padding:10px 16px;align-items:center;justify-content:center;gap:12px;font-size:13px;font-weight:700;text-align:center;flex-wrap:wrap;}
@media (max-width:768px){ .sub-banner{ top:54px; } }
.sub-banner-locked{background:var(--red);color:#fff;}
.sub-banner-trial{background:var(--gold);color:#fff;}
#sandbox-banner{background:#2a5a9a;color:#fff;}
html[dir="ltr"] .sub-banner{direction:ltr;}
.sub-plan-card{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--bg2);border:1px solid var(--border);border-radius:11px;padding:14px 16px;}
.sub-plan-card .sub-plan-name{font-weight:800;color:var(--gold2);font-size:14px;}
.sub-plan-card .sub-plan-price{color:var(--cream2);font-size:12px;margin-top:2px;}
.sub-plan-card.sub-plan-loading{opacity:.6;pointer-events:none;}
/* صفحة اشتراكي — بطاقات أفقية قابلة للسحب */
.sub-cards-scroll{display:grid;grid-auto-flow:column;grid-auto-columns:250px;align-items:stretch;gap:14px;overflow-x:auto;padding:4px 4px 18px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
.sub-cards-scroll::-webkit-scrollbar{height:6px;}
.sub-cards-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:10px;}
/* ── صفحة الاشتراك — عرض موحّد ومتمركز بالتابلت واللابتوب ─────
   بالموبايل (أقل من 700px) بضل سكرول أفقي (كاروسيل باللمس، طبيعي
   بهالحجم). من 700px فما فوق منتحوّل لشبكة 3 أعمدة متساوية بدل
   السكرول الثابت العرض، لأنه بالشاشات الكبيرة كان سايب فراغ كبير
   وغير متناسق. عرّفنا حد أقصى وتمركز لكل عناصر الصفحة (البانر،
   صندوق الكود، البطاقات) بنفس العرض عشان كلهم يتراصفوا بخط واحد. */
#pg-subscription{--sub-page-maxw:100%;}
#pg-subscription > #sub-status-info,
#pg-subscription > #sub-start-trial-section,
#pg-subscription > .card,
#pg-subscription > #sub-gift-codes-section,
#pg-subscription > .sub-cards-scroll{
  max-width:var(--sub-page-maxw); margin-left:auto; margin-right:auto;
}
@media (min-width:700px){
  #pg-subscription{--sub-page-maxw:900px;}
  .sub-cards-scroll{
    display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
    overflow-x:visible; scroll-snap-type:none; padding:4px 0 18px;
  }
  .sub-plan-card-v2{flex:none; width:auto;}
}
@media (min-width:1180px){
  #pg-subscription{--sub-page-maxw:1040px;}
  .sub-cards-scroll{gap:20px;}
  .sub-plan-card-v2{padding:26px 22px;}
}
.sub-plan-card-v2{scroll-snap-align:start;flex:0 0 250px;background:var(--bg2);border:1.5px solid var(--border);border-radius:18px;padding:22px 19px;display:flex;flex-direction:column;gap:16px;height:100%;}
.sub-plan-card-v2.sub-plan-featured{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 8px 24px rgba(0,0,0,.25);}
.sub-plan-card-v2.sub-plan-target{border-color:#12c887;box-shadow:0 0 0 2px #12c887,0 8px 24px rgba(18,200,135,.35);animation:subTargetPulse 1.6s ease-in-out 2;}
@keyframes subTargetPulse{0%,100%{box-shadow:0 0 0 2px #12c887,0 8px 24px rgba(18,200,135,.35);}50%{box-shadow:0 0 0 4px #12c887,0 8px 30px rgba(18,200,135,.5);}}
@keyframes authShakeX{0%,100%{transform:translateX(0);}20%{transform:translateX(-6px);}40%{transform:translateX(6px);}60%{transform:translateX(-4px);}80%{transform:translateX(4px);}}
.auth-lang-btn{position:fixed;top:16px;width:38px;height:38px;border-radius:50%;background:#0d1a15;border:1px solid #1a3d2e;color:#8ab8a8;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10000;}
html[dir="rtl"] .auth-lang-btn{right:16px;}
html[dir="ltr"] .auth-lang-btn{left:16px;}

/* ── مؤشر الاتصال بالإنترنت: أيقونة واي فاي (بصفحة «حول») ── */
.conn-wifi{display:inline-flex;align-items:center;justify-content:center;line-height:0;color:#12c887;transition:color .25s;cursor:default;}
.conn-wifi svg{display:block;}
.conn-wifi .wifi-bar{transition:opacity .2s;}
.conn-wifi .wifi-slash{display:none;}
.conn-wifi.is-offline .wifi-slash{display:block;}

.sub-plan-card-v2 .sub-plan-name-v2{font-size:18px;font-weight:800;color:var(--gold2);display:flex;align-items:center;gap:8px;justify-content:space-between;}
.sub-plan-card-v2 .sub-plan-price-v2{display:flex;flex-direction:column;gap:2px;}
.sub-plan-price-main-row{font-size:28px;font-weight:800;color:var(--cream);display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.sub-plan-price-main-row span{font-size:12px;font-weight:400;color:var(--muted);}
/* سعر مخصوم: السطر الأصلي فوق صغير ومشطوب، السطر الجديد تحته بنفس حجم
   وثقل باقي الخطط بالضبط (28px/800 عبر sub-plan-price-main-row) — بدون
   أي نص "قبل/بعد"، الفرق واضح بصريًا فقط */
.sub-plan-price-old-row{line-height:1.1;}
.sub-plan-price-old{font-size:14px;font-weight:600;color:var(--muted);text-decoration:line-through;text-decoration-color:var(--red);text-decoration-thickness:1.5px;opacity:.75;}
/* لازم نص أعلى من ".sub-plan-price-main-row span" (0,1,1) حتى ما ياكل الحجم/اللون الأصغر
   الفاتح المخصص لباقي الـ span العامة (زي "/شهريًا") ويصير السعر المخصوم صغير وباهت */
.sub-plan-price-main-row .sub-plan-price-new{font-size:28px;font-weight:800;color:var(--gold2);text-shadow:0 0 14px rgba(18,200,135,.45);}
.sub-plan-features{display:flex;flex-direction:column;gap:9px;flex:1;}
.sub-plan-promo-v2{display:flex;flex-direction:column;gap:6px;margin-top:-6px;}
.sub-plan-promo-v2 .badge{white-space:normal;text-align:center;line-height:1.4;padding:6px 10px;}
.sub-plan-feature{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--cream2);line-height:1.5;}
.sub-plan-feature svg{flex-shrink:0;color:var(--gold);margin-top:1px;}
