/* Sprengningsplanlegger — design tokens. Light is the default. */

:root,
:root[data-theme="light"],
html[data-theme="light"] {
  color-scheme: light;

  --bg: #f7f4ef;
  --bg-primary: #f7f4ef;
  --surface-1: #ffffff;
  --surface-2: #f3efe8;
  --surface-3: #ebe5db;
  --surface-raised: #fffaf5;

  --border: rgba(28, 25, 23, 0.09);
  --border-bright: rgba(28, 25, 23, 0.16);
  --border-color: rgba(28, 25, 23, 0.09);

  --text: #1c1917;
  --text-primary: #1c1917;
  --text-secondary: #57534e;
  --text-muted: #78716c;
  --text-dim: #a8a29e;
  --text-on-accent: #ffffff;

  --accent: #ea580c;
  --accent-dk: #c2410c;
  --accent-soft: rgba(234, 88, 12, 0.12);
  --accent-glow: rgba(234, 88, 12, 0.1);
  --accent-primary: #ea580c;
  --accent-secondary: #c2410c;

  --danger: #dc2626;
  --danger-soft: rgba(220, 38, 38, 0.12);
  --success: #15803d;
  --success-soft: rgba(21, 128, 61, 0.12);
  --warning: #d97706;
  --warning-soft: rgba(217, 119, 6, 0.12);
  --info-soft: rgba(234, 88, 12, 0.1);

  --indigo: #4f46e5;
  --indigo-soft: rgba(79, 70, 229, 0.12);
  --purple: #7c3aed;
  --purple-soft: rgba(124, 58, 237, 0.12);

  --card-surface: #ffffff;
  --card-surface-soft: rgba(28, 25, 23, 0.04);
  --card-surface-raised: #fff7ed;
  --card-group-surface: rgba(234, 88, 12, 0.07);
  --card-muted: #78716c;
  --card-divider: rgba(28, 25, 23, 0.1);
  --card-radius: 20px;
  --card-radius-sm: 14px;
  --card-radius-lg: 28px;
  --card-gap: 1.15rem;

  --sidebar-width: 260px;
  --header-height: 56px;
  --bottom-nav-height: 64px;
  --areas-panel-width: 340px;
  --radius: 14px;
  --radius-sm: 10px;
  --radius-lg: 20px;
  --gap: 1.25rem;

  --font: 'Source Sans 3', system-ui, -apple-system, sans-serif;
  --font-body: 'Source Sans 3', system-ui, -apple-system, sans-serif;

  --header-bg: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  --nav-bg: rgba(255, 255, 255, 0.72);
  --grid-color: rgba(28, 25, 23, 0.05);
  --grid-opacity: 0.65;
  --modal-backdrop: rgba(28, 25, 23, 0.45);
  --shadow-soft: 0 10px 28px rgba(28, 25, 23, 0.08);

  --button-primary-bg: #ea580c;
  --button-primary-hover: #c2410c;
  --button-surface: #ebe5db;
  --button-surface-hover: #e0d8cc;
  --button-text: #1c1917;
  --button-focus: rgba(234, 88, 12, 0.35);

  --theme-color-meta: #fff7ed;
}

html[data-theme="dark"] {
  color-scheme: dark;

  --bg: #05070b;
  --bg-primary: #05070b;
  --surface-1: #0c111a;
  --surface-2: #121826;
  --surface-3: #1a2235;
  --surface-raised: #1e293b;

  --border: rgba(148, 163, 184, 0.1);
  --border-bright: rgba(148, 163, 184, 0.18);
  --border-color: rgba(148, 163, 184, 0.1);

  --text: #f1f5f9;
  --text-primary: #f1f5f9;
  --text-secondary: #cbd5e1;
  --text-muted: #94a3b8;
  --text-dim: #64748b;
  --text-on-accent: #ffffff;

  --accent: #f97316;
  --accent-dk: #ea580c;
  --accent-soft: rgba(249, 115, 22, 0.16);
  --accent-glow: rgba(249, 115, 22, 0.14);
  --accent-primary: #f97316;
  --accent-secondary: #ea580c;

  --danger: #f87171;
  --danger-soft: rgba(248, 113, 113, 0.14);
  --success: #34d399;
  --success-soft: rgba(52, 211, 153, 0.14);
  --warning: #fbbf24;
  --warning-soft: rgba(251, 191, 36, 0.14);
  --info-soft: rgba(249, 115, 22, 0.12);

  --indigo: #818cf8;
  --indigo-soft: rgba(129, 140, 248, 0.16);
  --purple: #c084fc;
  --purple-soft: rgba(192, 132, 252, 0.16);

  --card-surface: #0f1623;
  --card-surface-soft: rgba(255, 255, 255, 0.04);
  --card-surface-raised: #172033;
  --card-group-surface: rgba(249, 115, 22, 0.08);
  --card-muted: #94a3b8;
  --card-divider: rgba(148, 163, 184, 0.14);

  --header-bg: linear-gradient(135deg, #0a0e16 0%, #121a28 100%);
  --nav-bg: rgba(0, 0, 0, 0.35);
  --grid-color: rgba(148, 163, 184, 0.08);
  --grid-opacity: 0.45;
  --modal-backdrop: rgba(2, 6, 12, 0.72);
  --shadow-soft: 0 12px 32px rgba(0, 0, 0, 0.35);

  --button-primary-bg: #f97316;
  --button-primary-hover: #fb923c;
  --button-surface: #1a2235;
  --button-surface-hover: #243044;
  --button-text: #f1f5f9;
  --button-focus: rgba(249, 115, 22, 0.4);

  --theme-color-meta: #05070b;
}