/* ============================================================================
 * THEME 01 — الزمرد الزجاجي | Emerald Glass
 * Da(glass) + light variant. Layout: static sidebar.
 * ============================================================================ */

html[data-theme="emerald_glass"],[data-preview-theme="emerald_glass"] {
  --ui-font: 'Cairo', 'Tajawal', system-ui, sans-serif;
  --ui-heading-weight: 800;
  --ui-control-h: 46px;
  --ui-radius: 16px;
  --ui-radius-sm: 12px;
  --ui-avatar-radius: 12px;
  --ui-radius-pill: 999px;
  --ui-gap: 16px;
  --ui-card-pad: 20px;
  --ui-row-pad: 12px;
  --ui-motion: 160ms;

  --ui-canvas: #070d19;
  --ui-canvas-2: #0b1325;
  --ui-pattern:
    radial-gradient(circle at 12% 15%, rgba(16, 185, 129, .16), transparent 36%),
    radial-gradient(circle at 86% 18%, rgba(245, 158, 11, .10), transparent 32%),
    radial-gradient(circle at 50% 88%, rgba(6, 182, 212, .10), transparent 40%),
    linear-gradient(180deg, #070d19 0%, #0b1325 100%);
  --ui-card-bg: rgba(15, 23, 42, .72);
  --ui-card-bg-hover: rgba(23, 33, 54, .88);
  --ui-subtle: rgba(148, 163, 184, .07);
  --ui-border: rgba(148, 163, 184, .17);
  --ui-border-w: 1px;
  --ui-blur: blur(16px);
  --ui-shadow: 0 12px 32px -12px rgba(0, 0, 0, .55);
  --ui-shadow-hover: 0 18px 40px -16px rgba(16, 185, 129, .28);
  --ui-inset: inset 0 1px 0 rgba(255, 255, 255, .05);

  --ui-text: #e8edf6;
  --ui-heading: #ffffff;
  --ui-muted: #93a1b8;
  --ui-faint: #64748b;

  --ui-primary: #10b981;
  --ui-primary-soft: rgba(16, 185, 129, .15);
  --ui-primary-contrast: #04120c;
  --ui-primary-glow: 0 0 0 1px rgba(16, 185, 129, .4), 0 12px 28px -12px rgba(16, 185, 129, .6);
  --ui-accent: #f59e0b;
  --ui-accent-soft: rgba(245, 158, 11, .15);
  --ui-chart-1: #10b981;
  --ui-chart-2: #f59e0b;
  --ui-chart-3: #38bdf8;
  --ui-chart-4: #8b5cf6;
  --ui-chart-5: #f43f5e;
  --ui-grid: rgba(148, 163, 184, .14);
}

html[data-theme="emerald_glass"][data-mode="light"],[data-preview-theme="emerald_glass"][data-preview-mode="light"] {
  --ui-canvas: #eef2f9;
  --ui-canvas-2: #ffffff;
  --ui-pattern:
    radial-gradient(circle at 10% 10%, rgba(16, 185, 129, .14), transparent 34%),
    radial-gradient(circle at 90% 20%, rgba(56, 189, 248, .12), transparent 32%),
    linear-gradient(180deg, #eef2f9 0%, #f7fafd 100%);
  --ui-card-bg: rgba(255, 255, 255, .82);
  --ui-card-bg-hover: #ffffff;
  --ui-subtle: rgba(15, 23, 42, .04);
  --ui-border: rgba(15, 23, 42, .10);
  --ui-shadow: 0 10px 28px -14px rgba(15, 23, 42, .28);
  --ui-shadow-hover: 0 18px 36px -18px rgba(5, 150, 105, .35);
  --ui-inset: inset 0 1px 0 rgba(255, 255, 255, .8);

  --ui-text: #21324b;
  --ui-heading: #0f172a;
  --ui-muted: #55647d;
  --ui-faint: #8494ac;

  --ui-primary: #059669;
  --ui-primary-soft: rgba(5, 150, 105, .12);
  --ui-primary-contrast: #ffffff;
  --ui-primary-glow: 0 0 0 1px rgba(5, 150, 105, .35), 0 12px 26px -14px rgba(5, 150, 105, .5);
  --ui-accent: #d97706;
  --ui-accent-soft: rgba(217, 119, 6, .13);
  --ui-chart-1: #059669;
  --ui-chart-2: #d97706;
  --ui-chart-3: #0284c7;
  --ui-chart-4: #7c3aed;
  --ui-chart-5: #e11d48;
  --ui-grid: rgba(15, 23, 42, .10);
}