/* =========================================================
   الهويات البصرية للوحة — كل هوية = ألوان (فاتح + داكن) + خطوط
   الهوية الافتراضية «صنوبر» متعرّفة في styles.css
   لتغيير الهوية: زرار لوحة الألوان في الشريط العلوي
   ========================================================= */

:root { --display: var(--sans); }

/* العناوين بتاخد خط العرض الخاص بالهوية */
.head h1, .card-h h2, .brand b, .dlg-h h3, .script h3, .theme-pop h4 { font-family: var(--display); }

/* ---------- ياقوت: عنابي دافئ + ذهبي — طابع المناسبات والثقة ---------- */
:root[data-brand="yaqout"] {
  --ground:#F7F3F4; --surface:#FFFFFF; --sunken:#F0E8EA; --line:#E6DADD;
  --ink:#2A1A1F; --ink-2:#5E4A50; --ink-3:#8C787E;
  --accent:#7A2E45; --accent-soft:#F3E3E8; --accent-ink:#FFFFFF;
  --side:#3A1824; --side-ink:#E8D5DB; --side-mute:#B08F99; --side-hover:#4A2230; --side-active:#5C2B3D;
  --ok:#3F7A5B; --ok-soft:#E4F0E9; --warn:#9A6A1E; --warn-soft:#F7EDDB; --crit:#A33B3B; --crit-soft:#F7E1E1;
  --l1:#7D6870; --l2:#A07A3C; --l3:#7A2E45;
  --shadow:0 1px 2px rgba(58,24,36,.06),0 6px 18px rgba(58,24,36,.06);
  --sans:"IBM Plex Sans Arabic",Tahoma,"Segoe UI",sans-serif;
  --display:"Amiri","Traditional Arabic",serif;
}
@media (prefers-color-scheme: dark) {
  :root[data-brand="yaqout"]:not([data-theme="light"]) {
    --ground:#171013; --surface:#21171B; --sunken:#2A1E23; --line:#3A2A30;
    --ink:#F0E6E9; --ink-2:#C4AEB5; --ink-3:#927C83;
    --accent:#D98AA2; --accent-soft:#3A2129; --accent-ink:#1A0F13;
    --side:#110B0E; --side-ink:#DCC8CE; --side-mute:#8F7880; --side-hover:#1F1519; --side-active:#2E1E24;
    --ok:#7CC09A; --ok-soft:#1D2F26; --warn:#D9AE63; --warn-soft:#30291B; --crit:#E08A80; --crit-soft:#352220;
    --l1:#A8949A; --l2:#D6B071; --l3:#D98AA2;
    --shadow:0 1px 2px rgba(0,0,0,.35);
  }
}
:root[data-brand="yaqout"] .head h1 { font-size:27px; }
:root[data-brand="yaqout"] .card-h h2 { font-size:18px; }
:root[data-brand="yaqout"] .brand b { font-size:18px; }
:root[data-brand="yaqout"] .brand-mark { background:linear-gradient(135deg,#A07A3C,#5C2B3D); color:#fff; }

/* ---------- لؤلؤ: كحلي هادئ + رمادي لؤلؤي — طابع مؤسسي رسمي ---------- */
:root[data-brand="lulu"] {
  --ground:#F4F6F9; --surface:#FFFFFF; --sunken:#EBEFF4; --line:#DDE3EB;
  --ink:#16213A; --ink-2:#4A5670; --ink-3:#7A859A;
  --accent:#2B4C8C; --accent-soft:#E3EAF6; --accent-ink:#FFFFFF;
  --side:#14203A; --side-ink:#CBD5E8; --side-mute:#8190AE; --side-hover:#1D2B4A; --side-active:#28395E;
  --ok:#2F7A5E; --ok-soft:#E1F0EA; --warn:#946A1C; --warn-soft:#F5EDDC; --crit:#A53E4A; --crit-soft:#F6E2E5;
  --l1:#66758F; --l2:#8C6B2E; --l3:#2B4C8C;
  --shadow:0 1px 2px rgba(20,32,58,.06),0 4px 14px rgba(20,32,58,.06);
  --sans:"Readex Pro",Tahoma,"Segoe UI",sans-serif;
  --display:"Readex Pro",Tahoma,sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root[data-brand="lulu"]:not([data-theme="light"]) {
    --ground:#0E131D; --surface:#151C29; --sunken:#1C2433; --line:#2A3446;
    --ink:#E6ECF5; --ink-2:#A9B5C9; --ink-3:#7886A0;
    --accent:#8FB0EA; --accent-soft:#1E2B44; --accent-ink:#0C1220;
    --side:#0A0F18; --side-ink:#C5D0E4; --side-mute:#6F7F9C; --side-hover:#141C2A; --side-active:#1F2B40;
    --ok:#78C2A3; --ok-soft:#17302A; --warn:#D9AE63; --warn-soft:#30291B; --crit:#E58A95; --crit-soft:#37202A;
    --l1:#93A1B8; --l2:#D2AE6A; --l3:#8FB0EA;
    --shadow:0 1px 2px rgba(0,0,0,.35);
  }
}
:root[data-brand="lulu"] .card, :root[data-brand="lulu"] .kpi { border-radius:8px; }
:root[data-brand="lulu"] .head h1 { font-weight:600; letter-spacing:-.01em; }

/* ---------- زيتون: أخضر زيتوني + رملي — طابع دافئ وقريب ---------- */
:root[data-brand="zaytoun"] {
  --ground:#F5F4EF; --surface:#FFFFFF; --sunken:#ECEAE2; --line:#DFDCD1;
  --ink:#23261C; --ink-2:#55594A; --ink-3:#858A78;
  --accent:#556B2F; --accent-soft:#E8EDDC; --accent-ink:#FFFFFF;
  --side:#2B321F; --side-ink:#D6DCC8; --side-mute:#99A386; --side-hover:#363F27; --side-active:#445031;
  --ok:#3D7A4A; --ok-soft:#E2EFE4; --warn:#986A1D; --warn-soft:#F5ECDA; --crit:#A5443A; --crit-soft:#F6E2DF;
  --l1:#6F7660; --l2:#8F6B2C; --l3:#556B2F;
  --shadow:0 1px 2px rgba(43,50,31,.06),0 4px 14px rgba(43,50,31,.05);
  --sans:"Tajawal",Tahoma,"Segoe UI",sans-serif;
  --display:"Tajawal",Tahoma,sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root[data-brand="zaytoun"]:not([data-theme="light"]) {
    --ground:#13150F; --surface:#1B1E16; --sunken:#23271D; --line:#333829;
    --ink:#EAEDE2; --ink-2:#B3B9A4; --ink-3:#858C76;
    --accent:#A9C27A; --accent-soft:#2A3320; --accent-ink:#12150D;
    --side:#0E100B; --side-ink:#D0D6C2; --side-mute:#7F8970; --side-hover:#181B13; --side-active:#262C1D;
    --ok:#7CC08A; --ok-soft:#1C2E20; --warn:#D9AE63; --warn-soft:#30291B; --crit:#E08A80; --crit-soft:#352220;
    --l1:#9AA18A; --l2:#D2AE6A; --l3:#A9C27A;
    --shadow:0 1px 2px rgba(0,0,0,.35);
  }
}
:root[data-brand="zaytoun"] body { font-size:15px; }
:root[data-brand="zaytoun"] .card, :root[data-brand="zaytoun"] .kpi, :root[data-brand="zaytoun"] dialog { border-radius:16px; }
:root[data-brand="zaytoun"] .head h1 { font-weight:800; }

/* ---------- قائمة اختيار الهوية ---------- */
.theme-wrap { position:relative; }
.theme-pop {
  position:absolute; top:calc(100% + 8px); inset-inline-end:0; z-index:40;
  width:min(300px, calc(100vw - 32px));
  background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:12px;
  box-shadow:0 12px 36px rgba(0,0,0,.18); padding:12px; display:flex; flex-direction:column; gap:6px;
}
.theme-pop h4 { margin:0 0 4px; font-size:14px; }
.theme-opt {
  display:flex; align-items:center; gap:10px; width:100%; text-align:start;
  border:1px solid var(--line); background:var(--surface); border-radius:10px; padding:8px 10px;
}
.theme-opt:hover { background:var(--sunken); }
.theme-opt[aria-checked="true"] { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset; }
.theme-opt .sw { display:flex; flex-shrink:0; border-radius:6px; overflow:hidden; }
.theme-opt .sw i { width:14px; height:28px; display:block; }
.theme-opt b { display:block; font-size:13.5px; }
.theme-opt small { color:var(--ink-3); font-size:11.5px; }