/* ══════════════════════════════════════════════════════════════════════
   mizan-dark.css — نظام الوضع الداكن الموحّد لميزان
   ──────────────────────────────────────────────────────────────────────
   فلسفة التصميم: «محكمة ليلية» — أعماق زمرّدية داكنة بلمسات ذهبية دافئة.
   • خلفيات بطبقات واضحة (خلفية → سطح → عنصر مرتفع) لإحساس العمق.
   • الزمرّدي في الوضع الداكن يصير نعناعياً فاتحاً للنصوص/الأيقونات (تباين عالٍ)،
     ويبقى عميقاً غنيّاً في خلفيات الأزرار مع نص أبيض.
   • الذهبي أوضح وأدفأ، ويتكرّر عبر الواجهة (خطوط، نقاط، تركيز) ليحسّ نظاماً.
   يُحمَّل بعد الأنماط الداخلية وبعد mizan-polish.css، وكله بنطاق [data-theme="dark"].
   لا يمسّ الوضع الفاتح إطلاقاً.
   ══════════════════════════════════════════════════════════════════════ */

/* ═══ ١) اللوحة اللونية الموحّدة (تُعيد تعريف متغيّرات الهوية للوضع الداكن) ═══ */
[data-theme="dark"]{
  /* الخلفيات — فحمي مائل للزمرّدي، أبرد وأنقى من البنّي القديم */
  --paper:#0B1110;            /* خلفية التطبيق (الأعمق) */
  --white:#131D1B;            /* سطح البطاقات/الفقاعات (أفتح بوضوح من الخلفية) */
  --surface-2:#1A2523;        /* عنصر مرتفع (شرائح، مدخلات، بطاقات داخلية) */
  --sand:#22302B;             /* خلفيات ثانوية / شرائح مطفأة */
  --line:#26332E;             /* حدود شعرية */
  --line-2:#31423C;           /* حدود أوضح عند التمرير/التركيز */

  /* النصوص — أبيض دافئ بلمسة خضراء خفيفة */
  --charcoal:#EAF2EF;         /* النص الأساسي */
  --ink-soft:#C0CFC9;         /* نص ثانوي */
  --muted:#8A9A93;            /* نص مطفأ / تسميات */

  /* اللكنات — النعناعي يقود كل النصوص والأيقونات، الذهبي يقود التفاصيل */
  --emerald:#33B79C;          /* لكنة رئيسية: عناوين، أيقونات، روابط، أرقام */
  --emerald-l:#5AD6BC;        /* توهّج/تدرّجات */
  --emerald-d:#1E8271;        /* تمرير الأزرار */
  --gold:#E6C35A;             /* ذهبي أوضح للوضع الداكن */
  --gold-soft:rgba(230,195,90,.12);

  /* توهّجات جاهزة */
  --glow-em:0 0 0 1px rgba(51,183,156,.20), 0 14px 40px rgba(0,0,0,.45);
  --glow-gold:0 0 0 1px rgba(230,195,90,.22);
}

/* ═══ ٢) الخلفية العامة — تدرّج خفيف يعطي عمقاً بدل السطح المسطّح ═══ */
[data-theme="dark"] body,
[data-theme="dark"] html{
  background:
    radial-gradient(1200px 680px at 82% -8%, rgba(51,183,156,.06), transparent 60%),
    radial-gradient(900px 600px at 8% 108%, rgba(230,195,90,.045), transparent 55%),
    var(--paper);
  color:var(--charcoal);
}
[data-theme="dark"] .wrap,
[data-theme="dark"] .chat-area,
[data-theme="dark"] .inputbar,
[data-theme="dark"] .stage,
[data-theme="dark"] .thread{ background:transparent; }

/* ═══ ٣) الأسطح والبطاقات — طبقة واضحة + ظل ناعم + حدّ شعري ═══ */
[data-theme="dark"] .card,
[data-theme="dark"] .scard,
[data-theme="dark"] .found,
[data-theme="dark"] .art,
[data-theme="dark"] .overlay-box,
[data-theme="dark"] .side,
[data-theme="dark"] .sidebar,
[data-theme="dark"] .stats,
[data-theme="dark"] .plan{
  background:var(--white);
  border-color:var(--line);
  box-shadow:0 1px 0 rgba(255,255,255,.02) inset, 0 10px 30px rgba(0,0,0,.30);
}
/* عناصر داخلية أعمق قليلاً لتمييز الطبقات */
[data-theme="dark"] .scard,
[data-theme="dark"] .art,
[data-theme="dark"] .found{ background:var(--surface-2); }

/* شريط علوي زجاجي متناسق */
[data-theme="dark"] .bar,
[data-theme="dark"] #nav,
[data-theme="dark"] .topbar{
  background:rgba(11,17,16,.82);
  backdrop-filter:blur(18px);
  border-color:var(--line);
}

/* ═══ ٤) اللكنة الذهبية كنظام — خطوط، نقاط، شارات ═══ */
/* شريط علوي ذهبي رفيع فوق البطاقة عند التمرير */
[data-theme="dark"] .card::before{ background:linear-gradient(90deg,var(--gold),var(--emerald)); }
/* النقاط والمؤشرات موحّدة على الذهبي */
[data-theme="dark"] .casedot,
[data-theme="dark"] .eyebrow i,
[data-theme="dark"] .ans h4 i,
[data-theme="dark"] .tp::before{ background:var(--gold); }
/* خط سفلي ذهبي للرابط النشط في التنقّل */
[data-theme="dark"] .links a.active::after{
  width:100%; background:var(--gold);
}

/* ═══ ٥) فقاعات المحادثة — تباين ولون يميّز الطرفين ═══ */
[data-theme="dark"] .bubble-ai,
[data-theme="dark"] .msg.ai .bubble,
[data-theme="dark"] .typing{
  background:var(--white);
  border-color:var(--line);
  color:var(--charcoal);
  box-shadow:0 8px 26px rgba(0,0,0,.32);
}
[data-theme="dark"] .bubble-ai::before{
  background:linear-gradient(180deg,var(--emerald-l),var(--emerald));
}
/* فقاعة المستخدم: زمرّدي عميق ونص أبيض — لمسة لون حيّة */
[data-theme="dark"] .bubble-user,
[data-theme="dark"] .msg .bubble{
  background:linear-gradient(135deg,#158B76,#0F6E5E);
  border-color:transparent;
  color:#F3FBF8;
  box-shadow:0 8px 24px rgba(15,110,94,.35);
}
[data-theme="dark"] .bubble-user *{ color:#F3FBF8; }

/* ═══ ٦) الأزرار — خلفية زمرّدية عميقة ونص أبيض (قابلة للقراءة) ═══ */
[data-theme="dark"] .btn-primary,
[data-theme="dark"] .sendbtn,
[data-theme="dark"] .backbtn,
[data-theme="dark"] .lockbar,
[data-theme="dark"] .lockbar button{ color:#fff; }
[data-theme="dark"] .btn-primary,
[data-theme="dark"] .sendbtn,
[data-theme="dark"] .backbtn{
  background:linear-gradient(135deg,#178B77,#0F6E5E);
  box-shadow:0 8px 24px rgba(15,110,94,.40);
}
[data-theme="dark"] .btn-primary:hover,
[data-theme="dark"] .sendbtn:hover,
[data-theme="dark"] .backbtn:hover{
  background:linear-gradient(135deg,#1DA089,#158B76);
  box-shadow:0 12px 30px rgba(20,160,137,.45);
}
/* زر شبحي: حد نعناعي رفيع */
[data-theme="dark"] .btn-ghost{
  color:var(--emerald); border-color:var(--line-2); background:transparent;
}
[data-theme="dark"] .btn-ghost:hover{
  border-color:var(--emerald); background:rgba(51,183,156,.08);
}

/* ═══ ٧) الشرائح (chips) والوسوم ═══ */
[data-theme="dark"] .chip{
  background:var(--surface-2); color:var(--ink-soft); border-color:var(--line);
}
[data-theme="dark"] .chip:hover{
  background:linear-gradient(135deg,#178B77,#0F6E5E);
  color:#fff; border-color:transparent; transform:translateY(-2px);
}
[data-theme="dark"] .chip,
[data-theme="dark"] .sec-tag,
[data-theme="dark"] .badge{ border-color:var(--line); }
/* شارة الحالة الذهبية + حالة «مكتمل» النعناعية */
[data-theme="dark"] .statepill{ color:var(--gold); background:var(--gold-soft); }
[data-theme="dark"] .statepill.done{ color:var(--emerald); background:rgba(51,183,156,.12); }

/* ═══ ٨) المدخلات ومنطقة الكتابة ═══ */
[data-theme="dark"] .inwrap,
[data-theme="dark"] .compose,
[data-theme="dark"] #input,
[data-theme="dark"] .search-wrap input{
  background:var(--surface-2);
  border-color:var(--line);
  color:var(--charcoal);
}
[data-theme="dark"] .inwrap:focus-within,
[data-theme="dark"] .search-wrap input:focus,
[data-theme="dark"] #input:focus{
  border-color:var(--emerald);
  box-shadow:0 0 0 4px rgba(51,183,156,.14);
}
[data-theme="dark"] textarea,
[data-theme="dark"] .inwrap textarea{ background:transparent; color:var(--charcoal); }
[data-theme="dark"] ::placeholder{ color:var(--muted); }

/* ═══ ٩) الأيقونات في البطاقات — نعناعية، تتحوّل ذهبية عند التمرير ═══ */
[data-theme="dark"] .ic{
  background:rgba(51,183,156,.10);
  border:1px solid rgba(51,183,156,.18);
}
[data-theme="dark"] .ic svg{ stroke:var(--emerald); }
[data-theme="dark"] .card:hover .ic{
  background:linear-gradient(135deg,var(--gold),#DDBE55);
  border-color:transparent;
}
[data-theme="dark"] .card:hover .ic svg{ stroke:#0B1110; }

/* ═══ ١٠) الأرقام الإحصائية — تدرّج نعناعي→ذهبي راقٍ ═══ */
[data-theme="dark"] .stat .n{
  background:linear-gradient(120deg,var(--emerald-l),var(--gold));
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:var(--emerald);
}

/* ═══ ١١) لمسات تفاعلية (polish-hover) بتوهّج زمرّدي ═══ */
[data-theme="dark"] .polish-hover:hover{
  box-shadow:0 22px 52px rgba(0,0,0,.5), 0 0 0 1px rgba(51,183,156,.22);
  border-color:var(--line-2);
}

/* ═══ ١٢) شريط التمرير + التحديد + حلقة التركيز ═══ */
[data-theme="dark"] *::-webkit-scrollbar-thumb{ background:rgba(51,183,156,.28); background-clip:content-box; }
[data-theme="dark"] *::-webkit-scrollbar-thumb:hover{ background:rgba(51,183,156,.45); background-clip:content-box; }
[data-theme="dark"] ::selection{ background:rgba(51,183,156,.26); color:#EAF2EF; }
[data-theme="dark"] :focus-visible{ outline-color:var(--gold); }

/* ═══ ١٣) خطوط فاصلة، حدود، تذييل ═══ */
[data-theme="dark"] .divider,
[data-theme="dark"] footer,
[data-theme="dark"] .sb-row{ border-color:var(--line); }
[data-theme="dark"] footer{ color:var(--muted); }

/* ═══ ١٤) طبقات التعتيم (overlays) أنعم ═══ */
[data-theme="dark"] .gate-overlay,
[data-theme="dark"] .modal-overlay{ background:rgba(5,9,8,.72); backdrop-filter:blur(4px); }

/* احترام تقليل الحركة */
@media (prefers-reduced-motion: reduce){
  [data-theme="dark"] .polish-hover{ transition:none; }
}

/* العلامة المائية (شعار ميزان) في خلفية الهيرو — تبييض للوضع الداكن */
[data-theme="dark"] img.hero-motif{ filter:brightness(0) invert(1); }