/* Mudar AI — نظام التصميم: رموز الألوان والمقاسات. الوضع الفاتح على :root، والداكن بإعادة تعريف الرموز فقط. */
:root {
  --font: 'Cairo', system-ui, -apple-system, 'Segoe UI', Tahoma, sans-serif;
  --mono: 'JetBrains Mono', 'Fira Code', Consolas, 'Courier New', monospace;

  --bg: #f6f7fb;
  --bg-elev: #ffffff;
  --bg-sunken: #eef0f6;
  --bg-hover: rgba(15, 23, 42, .05);
  --bg-active: rgba(15, 23, 42, .08);
  --sidebar-bg: #0f1424;
  --sidebar-fg: #c8cde0;
  --sidebar-fg-strong: #ffffff;
  --sidebar-hover: rgba(255,255,255,.06);
  --sidebar-active: rgba(99,102,241,.22);

  --fg: #0f172a;
  --fg-muted: #5b6478;
  --fg-faint: #6b7280;   /* 4.83:1 على البطاقة و4.52:1 على الخلفية — AA لنص 13px */
  --border: #e3e6ef;
  --border-strong: #cfd4e2;

  --brand: #4f46e5;
  --brand-strong: #4338ca;
  --brand-soft: rgba(79,70,229,.10);
  --brand-fg: #ffffff;
  --accent: #0ea5e9;

  --ok: #16a34a;  --ok-soft: rgba(22,163,74,.12);
  --warn: #d97706; --warn-soft: rgba(217,119,6,.12);
  --danger: #dc2626; --danger-soft: rgba(220,38,38,.12);
  --info: #2563eb; --info-soft: rgba(37,99,235,.12);
  /* لون النص فوق الخلفيات ‎*-soft‎: اللون الأساسي نفسه يرسب AA فوقها في الفاتح (2.80:1 للتحذير) */
  --ok-fg: #166534; --warn-fg: #92400e; --danger-fg: #b91c1c; --info-fg: #1d4ed8;

  --code-bg: #0b1020;
  --code-fg: #e5e7eb;
  --user-bubble: #eef0ff;
  --ai-bubble: transparent;

  --radius-xs: 6px; --radius-sm: 10px; --radius: 14px; --radius-lg: 20px; --radius-full: 999px;
  --shadow-sm: 0 1px 2px rgba(15,23,42,.06);
  --shadow: 0 4px 16px rgba(15,23,42,.08);
  --shadow-lg: 0 16px 48px rgba(15,23,42,.16);

  --sidebar-w: 272px;
  --header-h: 56px;
  --content-max: 880px;
  --ease: cubic-bezier(.2,.8,.2,1);
  --dur: 180ms;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --bg: #0b0f1a;
  --bg-elev: #111827;
  --bg-sunken: #0d1220;
  --bg-hover: rgba(255,255,255,.05);
  --bg-active: rgba(255,255,255,.09);
  --sidebar-bg: #070a12;
  --sidebar-fg: #aab1c7;
  --sidebar-fg-strong: #ffffff;
  --sidebar-hover: rgba(255,255,255,.05);
  --sidebar-active: rgba(129,140,248,.20);

  --fg: #e6e9f2;
  --fg-muted: #9aa3ba;
  --fg-faint: #7d87a2;   /* 4.95:1 على البطاقة الداكنة — AA لنص 13px */
  --border: #1f2637;
  --border-strong: #2c3550;

  --brand: #818cf8;
  --brand-strong: #6366f1;
  --brand-soft: rgba(129,140,248,.14);
  --brand-fg: #0b0f1a;
  --accent: #38bdf8;

  --ok: #22c55e;  --ok-soft: rgba(34,197,94,.14);
  --warn: #f59e0b; --warn-soft: rgba(245,158,11,.14);
  --danger: #f87171; --danger-soft: rgba(248,113,113,.14);
  --info: #60a5fa; --info-soft: rgba(96,165,250,.14);
  --ok-fg: var(--ok); --warn-fg: var(--warn); --danger-fg: var(--danger); --info-fg: var(--info);

  --code-bg: #060913;
  --code-fg: #e5e7eb;
  --user-bubble: #1a2140;

  --shadow-sm: 0 1px 2px rgba(0,0,0,.4);
  --shadow: 0 4px 16px rgba(0,0,0,.45);
  --shadow-lg: 0 16px 48px rgba(0,0,0,.6);
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0b0f1a; --bg-elev: #111827; --bg-sunken: #0d1220;
    --bg-hover: rgba(255,255,255,.05); --bg-active: rgba(255,255,255,.09);
    --sidebar-bg: #070a12; --sidebar-fg: #aab1c7; --sidebar-fg-strong: #fff;
    --sidebar-hover: rgba(255,255,255,.05); --sidebar-active: rgba(129,140,248,.20);
    --fg: #e6e9f2; --fg-muted: #9aa3ba; --fg-faint: #7d87a2;
    --border: #1f2637; --border-strong: #2c3550;
    --brand: #818cf8; --brand-strong: #6366f1; --brand-soft: rgba(129,140,248,.14); --brand-fg: #0b0f1a; --accent: #38bdf8;
    --ok: #22c55e; --ok-soft: rgba(34,197,94,.14); --warn: #f59e0b; --warn-soft: rgba(245,158,11,.14);
    --danger: #f87171; --danger-soft: rgba(248,113,113,.14); --info: #60a5fa; --info-soft: rgba(96,165,250,.14);
    --ok-fg: var(--ok); --warn-fg: var(--warn); --danger-fg: var(--danger); --info-fg: var(--info);
    --code-bg: #060913; --code-fg: #e5e7eb; --user-bubble: #1a2140;
    --shadow-sm: 0 1px 2px rgba(0,0,0,.4); --shadow: 0 4px 16px rgba(0,0,0,.45); --shadow-lg: 0 16px 48px rgba(0,0,0,.6);
    color-scheme: dark;
  }
}

@media (prefers-reduced-motion: reduce) { :root { --dur: 0ms; } }