/* Theme variants — dark, ocean, sage, sand */

/* ── Dark ─────────────────────────────────────────────────────────── */
html[data-admin-theme="dark"] {
  color-scheme: dark;

  --color-phosphor-green: #3ecf8e;
  --color-mint-pulse: #00c573;
  --color-forest-depth: #1f4b37;
  --color-snow: #fafafa;
  --color-silver-mist: #b4b4b4;
  --color-smoke: #898989;
  --color-graphite: #4d4d4d;
  --color-slate: #393939;
  --color-charcoal: #2e2e2e;
  --color-ash: #242424;
  --color-obsidian: #121212;

  --text-primary: #fafafa;
  --text-secondary: #d4d4d4;
  --text-muted: #8a8a8a;
  --text-subtle: #737373;
  --text-faint: #666;
  --text-disabled: #9a9a9a;
  --text-link: #ccc;
  --text-link-hover: #fafafa;
  --text-inverse: #0b0b0b;
  --text-error: #f87171;

  --surface-base: #121212;
  --surface-raised: #121212;
  --surface-hover: #242424;
  --surface-selected: #242424;
  --surface-border: #2e2e2e;
  --surface-border-strong: #393939;
  --surface-topbar: #0f0f0f;
  --surface-dropdown: #171717;
  --surface-drawer: #141414;
  --surface-card: #121212;
  --surface-card-hover: #151515;
  --surface-elevated: #1a1a1a;
  --surface-interactive-hover: #1e1e1e;
  --surface-control-hover: #1f1f1f;
  --surface-badge: #1d1d1d;
  --surface-tooltip: #1a1a1a;

  --border-default: #2a2a2a;
  --border-subtle: #242424;
  --border-faint: #232323;
  --border-separator: #222;
  --border-strong: #3a3a3a;
  --border-tooltip: #333;
  --border-breadcrumb-sep: #4a4a4a;

  --field-bg: #121212;
  --field-border: #393939;
  --field-border-hover: #4d4d4d;
  --field-divider: #2e2e2e;

  --shadow-dropdown: 0 18px 48px rgba(0, 0, 0, 0.55);
  --shadow-drawer: -16px 0 48px rgba(0, 0, 0, 0.4);
  --shadow-tooltip: 0 8px 24px rgba(0, 0, 0, 0.35);

  --overlay-backdrop: rgba(0, 0, 0, 0.45);
  --overlay-modal: rgba(0, 0, 0, 0.72);
  --overlay-confirm: rgba(0, 0, 0, 0.6);
  --overlay-loading: #0b0b0b;

  --range-active-bg: #fafafa;
  --range-active-fg: #0b0b0b;
  --row-hover-bg: rgba(255, 255, 255, 0.02);
  --control-ghost-hover-bg: rgba(255, 255, 255, 0.04);
  --option-dot-border: #555;
  --option-dot-active-ring: #171717;

  --message-success-bg: rgba(62, 207, 142, 0.06);
  --message-warning-bg: rgba(255, 255, 255, 0.02);
  --message-error-bg: rgba(239, 68, 68, 0.06);
}

/* ── Ocean (soft blue) ────────────────────────────────────────────── */
html[data-admin-theme="ocean"] {
  color-scheme: light;

  --color-phosphor-green: #3b82f6;
  --color-mint-pulse: #2563eb;
  --color-forest-depth: #1e40af;
  --color-snow: #0f2440;
  --color-silver-mist: #4b6280;
  --color-smoke: #6b8299;
  --color-graphite: #b8cce0;
  --color-slate: #d0e0ef;
  --color-charcoal: #e0ecf6;
  --color-ash: #edf4fb;
  --color-obsidian: #ffffff;

  --text-primary: #0f2440;
  --text-secondary: #2c4a6e;
  --text-muted: #6b8299;
  --text-subtle: #6b8299;
  --text-faint: #8fa3b8;
  --text-disabled: #8fa3b8;
  --text-link: #3b6a9e;
  --text-link-hover: #0f2440;
  --text-error: #dc2626;

  --surface-base: #eef4fa;
  --surface-raised: #ffffff;
  --surface-hover: #e4eef8;
  --surface-selected: #d8e8f6;
  --surface-border: #d0e0ef;
  --surface-border-strong: #b8cce0;
  --surface-topbar: #ffffff;
  --surface-dropdown: #ffffff;
  --surface-drawer: #f8fbfe;
  --surface-card: #ffffff;
  --surface-card-hover: #f4f9fd;
  --surface-elevated: #ffffff;
  --surface-interactive-hover: #e8f2fa;
  --surface-control-hover: #e4eef8;
  --surface-badge: #e4eef8;
  --surface-tooltip: #ffffff;

  --border-default: #d0e0ef;
  --border-subtle: #dce8f4;
  --border-faint: #d0e0ef;
  --border-separator: #d0e0ef;
  --border-strong: #b8cce0;
  --border-tooltip: #d0e0ef;
  --border-breadcrumb-sep: #b8cce0;

  --field-bg: #ffffff;
  --field-border: #d0e0ef;
  --field-border-hover: #b8cce0;
  --field-divider: #e4eef8;

  --shadow-dropdown: 0 18px 48px rgba(15, 36, 64, 0.1);
  --shadow-drawer: -16px 0 48px rgba(15, 36, 64, 0.08);
  --shadow-tooltip: 0 8px 24px rgba(15, 36, 64, 0.1);

  --overlay-backdrop: rgba(15, 36, 64, 0.2);
  --overlay-modal: rgba(15, 36, 64, 0.35);
  --overlay-confirm: rgba(15, 36, 64, 0.3);
  --overlay-loading: rgba(238, 244, 250, 0.94);

  --range-active-bg: #0f2440;
  --range-active-fg: #ffffff;
  --row-hover-bg: rgba(59, 130, 246, 0.06);
  --control-ghost-hover-bg: rgba(59, 130, 246, 0.06);
  --option-dot-active-ring: #ffffff;

  --message-success-bg: rgba(59, 130, 246, 0.08);
  --message-error-bg: rgba(239, 68, 68, 0.08);
}

/* ── Sage (soft green) ────────────────────────────────────────────── */
html[data-admin-theme="sage"] {
  color-scheme: light;

  --color-phosphor-green: #5b9a6f;
  --color-mint-pulse: #4a8560;
  --color-forest-depth: #2d5c3f;
  --color-snow: #1e2e22;
  --color-silver-mist: #5a6e5e;
  --color-smoke: #7a8f7e;
  --color-graphite: #c5d4c8;
  --color-slate: #d8e6dc;
  --color-charcoal: #e6f0e8;
  --color-ash: #f0f6f2;
  --color-obsidian: #fafcfa;

  --text-primary: #1e2e22;
  --text-secondary: #3a4f3e;
  --text-muted: #7a8f7e;
  --text-subtle: #7a8f7e;
  --text-faint: #9aada0;
  --text-disabled: #9aada0;
  --text-link: #4a6e52;
  --text-link-hover: #1e2e22;
  --text-error: #dc2626;

  --surface-base: #f2f6f2;
  --surface-raised: #fafcfa;
  --surface-hover: #eaf0ea;
  --surface-selected: #dde8de;
  --surface-border: #d8e6dc;
  --surface-border-strong: #c5d4c8;
  --surface-topbar: #fafcfa;
  --surface-dropdown: #fafcfa;
  --surface-drawer: #f6faf6;
  --surface-card: #fafcfa;
  --surface-card-hover: #f4f8f4;
  --surface-elevated: #fafcfa;
  --surface-interactive-hover: #eaf0ea;
  --surface-control-hover: #eaf0ea;
  --surface-badge: #eaf0ea;
  --surface-tooltip: #fafcfa;

  --border-default: #d8e6dc;
  --border-subtle: #e6f0e8;
  --border-faint: #d8e6dc;
  --border-separator: #d8e6dc;
  --border-strong: #c5d4c8;
  --border-tooltip: #d8e6dc;
  --border-breadcrumb-sep: #c5d4c8;

  --field-bg: #fafcfa;
  --field-border: #d8e6dc;
  --field-border-hover: #c5d4c8;
  --field-divider: #eaf0ea;

  --shadow-dropdown: 0 18px 48px rgba(30, 46, 34, 0.1);
  --shadow-drawer: -16px 0 48px rgba(30, 46, 34, 0.08);
  --shadow-tooltip: 0 8px 24px rgba(30, 46, 34, 0.1);

  --overlay-backdrop: rgba(30, 46, 34, 0.2);
  --overlay-modal: rgba(30, 46, 34, 0.35);
  --overlay-confirm: rgba(30, 46, 34, 0.3);
  --overlay-loading: rgba(242, 246, 242, 0.94);

  --range-active-bg: #1e2e22;
  --range-active-fg: #ffffff;
  --row-hover-bg: rgba(91, 154, 111, 0.06);
  --control-ghost-hover-bg: rgba(91, 154, 111, 0.06);
  --option-dot-active-ring: #fafcfa;

  --message-success-bg: rgba(91, 154, 111, 0.1);
  --message-error-bg: rgba(239, 68, 68, 0.08);
}

/* ── Sand (warm cream) ────────────────────────────────────────────── */
html[data-admin-theme="sand"] {
  color-scheme: light;

  --color-phosphor-green: #c4895a;
  --color-mint-pulse: #b07848;
  --color-forest-depth: #8a5c32;
  --color-snow: #3d3429;
  --color-silver-mist: #7a6e60;
  --color-smoke: #9a8e80;
  --color-graphite: #ddd0c0;
  --color-slate: #e8ddd0;
  --color-charcoal: #f0e8de;
  --color-ash: #f7f2eb;
  --color-obsidian: #fffdf9;

  --text-primary: #3d3429;
  --text-secondary: #5c4f42;
  --text-muted: #9a8e80;
  --text-subtle: #9a8e80;
  --text-faint: #b0a494;
  --text-disabled: #b0a494;
  --text-link: #8a6a48;
  --text-link-hover: #3d3429;
  --text-error: #dc2626;

  --surface-base: #f7f2eb;
  --surface-raised: #fffdf9;
  --surface-hover: #f0e8de;
  --surface-selected: #e8ddd0;
  --surface-border: #e8ddd0;
  --surface-border-strong: #ddd0c0;
  --surface-topbar: #fffdf9;
  --surface-dropdown: #fffdf9;
  --surface-drawer: #fdf9f4;
  --surface-card: #fffdf9;
  --surface-card-hover: #faf6f0;
  --surface-elevated: #fffdf9;
  --surface-interactive-hover: #f0e8de;
  --surface-control-hover: #f0e8de;
  --surface-badge: #f0e8de;
  --surface-tooltip: #fffdf9;

  --border-default: #e8ddd0;
  --border-subtle: #f0e8de;
  --border-faint: #e8ddd0;
  --border-separator: #e8ddd0;
  --border-strong: #ddd0c0;
  --border-tooltip: #e8ddd0;
  --border-breadcrumb-sep: #ddd0c0;

  --field-bg: #fffdf9;
  --field-border: #e8ddd0;
  --field-border-hover: #ddd0c0;
  --field-divider: #f0e8de;

  --shadow-dropdown: 0 18px 48px rgba(61, 52, 41, 0.1);
  --shadow-drawer: -16px 0 48px rgba(61, 52, 41, 0.08);
  --shadow-tooltip: 0 8px 24px rgba(61, 52, 41, 0.1);

  --overlay-backdrop: rgba(61, 52, 41, 0.2);
  --overlay-modal: rgba(61, 52, 41, 0.35);
  --overlay-confirm: rgba(61, 52, 41, 0.3);
  --overlay-loading: rgba(247, 242, 235, 0.94);

  --range-active-bg: #3d3429;
  --range-active-fg: #ffffff;
  --row-hover-bg: rgba(196, 137, 90, 0.06);
  --control-ghost-hover-bg: rgba(196, 137, 90, 0.06);
  --option-dot-active-ring: #fffdf9;

  --message-success-bg: rgba(196, 137, 90, 0.1);
  --message-error-bg: rgba(239, 68, 68, 0.08);
}
