/* ثيم فاليتا الموحد: رمادي فاتح + أسود + وردي هادي (2026-11-09) */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap");
html:root,html:root[data-theme],html:root:not([data-theme]){
  color-scheme:light;
  --bg:#E6E6E8; --surface:#F3F3F4; --surface-2:#FFFFFF; --surface-3:#ECECEE;
  --ink:#141414; --ink-2:#2E2E33; --muted:#77777E; --line:#E0E0E3; --line-2:#D6D6DA;
  --brand:#141414; --brand-2:#000000; --brand-ink:#141414; --brand-soft:#E2E2E5;
  --brand-grad:linear-gradient(135deg,#1C1C1F 0%,#3A3A40 100%); --on-brand:#FFFFFF;
  --accent:#E8A9C3; --accent-ink:#9B2E66;
  --good:#2E8B4A; --good-soft:#D7F0DD; --warn:#A86414; --warn-soft:#F7E2CB; --bad:#C9416F; --bad-soft:#F8DCE6; --info:#5B4BB5; --info-soft:#E4E0F6;
  --bubble-in:#FFFFFF; --bubble-out:#E9E3EC; --chat-bg:#ECECEE;
  --shadow-sm:none; --shadow:inset 0 1px 0 rgba(255,255,255,.9); --shadow-lg:0 30px 60px -28px rgba(0,0,0,.35);
  --r-xl:26px; --r-lg:22px; --r-md:16px; --r-sm:12px;
  --font:"IBM Plex Sans Arabic","Readex Pro",Tahoma,sans-serif;
}
@media (prefers-color-scheme:dark){html:root,html:root:not([data-theme="light"]),html:root[data-theme="dark"]{
  color-scheme:light;
  --bg:#E6E6E8; --surface:#F3F3F4; --surface-2:#FFFFFF; --surface-3:#ECECEE;
  --ink:#141414; --ink-2:#2E2E33; --muted:#77777E; --line:#E0E0E3; --line-2:#D6D6DA;
  --brand:#141414; --brand-2:#000000; --brand-ink:#141414; --brand-soft:#E2E2E5;
  --brand-grad:linear-gradient(135deg,#1C1C1F 0%,#3A3A40 100%); --on-brand:#FFFFFF;
  --good:#2E8B4A; --good-soft:#D7F0DD; --warn:#A86414; --warn-soft:#F7E2CB; --bad:#C9416F; --bad-soft:#F8DCE6; --info:#5B4BB5; --info-soft:#E4E0F6;
  --bubble-in:#FFFFFF; --bubble-out:#E9E3EC; --chat-bg:#ECECEE;
}}
body{font-family:var(--font)!important;background:var(--bg)!important;color:var(--ink)}

/* البطاقات */
.card,.panel{background:var(--surface)!important;border:0!important;border-radius:var(--r-xl)!important;box-shadow:var(--shadow)!important}
.card.today,.card[class*="today"]{background:var(--brand-grad)!important;color:#fff!important}
.card-h h2,.card-h h3{font-weight:500}
.icon-box{background:#fff!important;color:var(--ink)!important;border-radius:50%!important}
.icon-box.brand{background:#F8DCE6!important;color:#C9578E!important}
.icon-box.good{background:#D7F0DD!important;color:#25A35A!important}
.icon-box.warn{background:#F7E2CB!important;color:#C27417!important}
.icon-box.bad{background:#F8DCE6!important;color:#C9416F!important}
.icon-box.info{background:#E4E0F6!important;color:#5B4BB5!important}
.card.today .icon-box{background:rgba(255,255,255,.14)!important;color:#fff!important}

/* الإحصائيات بالوردي */
svg.chart .bar{fill:#C9578E!important}
svg.chart .bar.dim{fill:#E8A9C3!important}
svg.spark path:not(:first-child){stroke:#C9578E!important}
svg.spark circle{fill:#C9578E!important}
svg.spark path:first-child:not(:last-child){fill:#F8DCE6!important}
.tag.brand{background:#F8DCE6!important;color:#9B2E66!important}
.tag.good{background:#D7F0DD!important;color:#2E8B4A!important}
.tag.warn{background:#F7E2CB!important;color:#A86414!important}
.tag.bad{background:#F8DCE6!important;color:#C9416F!important}
.tag.info{background:#E4E0F6!important;color:#5B4BB5!important}

/* الأزرار والحقول */
.btn{border-radius:999px!important;border-color:transparent!important;background:#fff;color:var(--ink)}
.btn.ghost{background:transparent}
.btn.primary,.btn-primary,button.primary{background:#141414!important;background-image:none!important;border-color:#141414!important;color:#fff!important;box-shadow:0 8px 18px -10px rgba(0,0,0,.6)!important}
.btn.primary:hover{background:#000!important}
.btn.danger{background:var(--bad-soft)!important;color:var(--bad)!important}
.input,select.input,textarea.input{background:#fff!important;border:1px solid transparent!important;border-radius:var(--r-md)!important}
.input:focus{border-color:#141414!important;box-shadow:0 0 0 3px rgba(20,20,20,.08)!important}
.tag,.chip,.pill{border-radius:999px!important}
.switch input:checked+.track{background:#141414!important}
.cmp-opt[aria-pressed="true"]{border-color:#141414!important;box-shadow:inset 0 0 0 1px #141414!important;background:#fff!important}
a{color:inherit}
.linkbtn{color:var(--accent-ink)!important}

/* القائمة الجانبية: كبسولات، والمختارة سوداء */
.side{background:transparent!important;border:0!important}
.nav a{border-radius:999px!important;color:var(--ink-2)!important;transition:background .15s}
.nav a:hover{background:var(--surface)!important}
.nav a[aria-current="page"],.nav a.active{background:#141414!important;color:#fff!important}
.nav a[aria-current="page"] svg{color:#fff!important;stroke:#fff}
.nav a:not([aria-current="page"]) svg{color:#C9578E}
.nav .badge,.nav .num.badge{background:var(--accent)!important;color:#4A1530!important}
.side-foot .me{background:var(--surface)!important;border-radius:var(--r-lg)!important}
.topbar{background:transparent!important;border:0!important}
.pill{background:var(--surface)!important}

/* شريط الجوال السفلي: كبسولة سوداء */
.tabbar{background:#141414!important;border:0!important;border-radius:999px!important;left:12px!important;right:12px!important;bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;width:auto!important;box-shadow:0 18px 40px -16px rgba(0,0,0,.55)!important;padding:6px!important}
.tabbar a{color:#B9B9BF!important;border-radius:999px!important}
.tabbar a[aria-current="page"]{background:#fff!important;color:#141414!important}
.tabbar a svg{stroke:currentColor}

/* المحادثات */
.msgs{background:var(--chat-bg)!important}
.conv[aria-current="true"],.conv.on,.conv.active{background:#fff!important}

/* الجداول والنوافذ */
table th{color:var(--muted);font-weight:500}
dialog{border-radius:var(--r-xl)!important;background:var(--surface)!important}
.toast{border-radius:999px!important;background:#141414!important;color:#fff!important}

/* ===== توافق الجوال: الحملات والتسويق (2026-11-09) ===== */
.list>*,.grid>*,.bento>*{min-width:0}
.li .body{min-width:0}
@media (max-width:900px){.bento>*:not(.half){grid-column:1/-1}}
@media (max-width:640px){
  .li:has(>.btn){flex-wrap:wrap;row-gap:10px}
  .li:has(>.btn)>.body{flex:1 1 100%;min-width:0}
  .li:has(>.btn)>.btn{flex:1 1 0;justify-content:center}
}