/* ════════════════════════════════════════════════════════════════════
   THEME: Parchment — default theme (modern-clean revision)
   ────────────────────────────────────────────────────────────────────
   Color tokens ONLY. Non-color scales live in tokens.css; component
   styles live theme-neutral in app.css. A new theme = a copy of this
   file with different values. All text/background pairs are WCAG-AA
   verified (see DESIGN.md §4.1). A new theme must define the SAME token
   set, including the .dark block.
   ════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Surface ramp (elevation) ── */
  --background: #f4ece0;
  --surface-1: #fbf6ec;
  --surface-2: #f3e9da;
  --surface-3: #ece0cd;

  /* ── Shadcn-compatible aliases (mapped onto the ramp) ── */
  --card: var(--surface-1);
  --card-foreground: #211a14;
  --muted: var(--surface-2);
  --input: var(--surface-2);
  --popover: var(--surface-1);
  --popover-foreground: #211a14;

  /* ── Text ── */
  --foreground: #211a14;
  --muted-foreground: #5c5043;

  /* ── Lines ── */
  --border: #d8c3a4;
  --border-strong: #b9966b;

  /* ── Brand: primary (action) · accent (emphasis) · destructive (danger) ── */
  --primary: #8a2526;
  --primary-foreground: #fdf7ee;
  --primary-hover: #731d1e;
  --accent: #1f6f6b; /* teal — quiet emphasis, distinct from danger */
  --accent-foreground: #f3fbfa;
  --destructive: #b23a2e;
  --destructive-foreground: #fdf7ee;
  --secondary: #d4b896;
  --secondary-foreground: #211a14;

  --ring: #8a2526;

  /* ── Focus ring (used by .input/.select; global ring lives in tokens.css) ── */
  --focus-ring: rgba(138, 37, 38, 0.18);
  --focus-ring-strong: rgba(138, 37, 38, 0.25);

  /* ── Strong buttons / selects ── */
  --btn-strong-bg: #6f1d1e;
  --btn-strong-bg-hover: #5a1718;
  --btn-strong-border: #5a1718;
  --btn-strong-fg: #ffffff;
  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23ffffff' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --select-arrow-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%238a2526' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  /* ── Gameplay status (indicators, not white-text backgrounds) ── */
  --friend: #2f8f4e;
  --foe: #c43d2f;
  --ok: #2f8f4e;
  --ok-bg: rgba(47, 143, 78, 0.15);
  --warn: #b5790f;
  --warn-bg: rgba(181, 121, 15, 0.12);
  --warn-bg-hover: rgba(181, 121, 15, 0.25);
  --warn-border: #b5790f;

  /* ── Dice-log extremes ── */
  --die-max-bg: #14532d;
  --die-max-border: #166534;
  --die-max-fg: #bbf7d0;
  --die-min-bg: #7f1d1d;
  --die-min-border: #991b1b;
  --die-min-fg: #fecaca;

  /* ── Active-combat banner ── */
  --combat-banner-bg: rgba(196, 61, 47, 0.1);
  --combat-banner-border: rgba(196, 61, 47, 0.35);
  --combat-banner-accent: #c43d2f;

  /* ── Active initiative row tint ── */
  --init-active-tint: rgba(138, 37, 38, 0.07);

  /* ── Mobile layout (bumped for 44px-friendly controls) ── */
  --topbar-h: 52px;
  --bottombar-h: 60px;
  --comp-panel-w: 400px;
}

/* ════════════════════════════════════════════════════════════════════
   Dark (table mode)
   ════════════════════════════════════════════════════════════════════ */
.dark {
  --background: #171210;
  --surface-1: #221b17;
  --surface-2: #2b221c;
  --surface-3: #372b22;

  --card: var(--surface-1);
  --card-foreground: #f0e6d6;
  --muted: var(--surface-2);
  --input: var(--surface-2);
  --popover: var(--surface-1);
  --popover-foreground: #f0e6d6;

  --foreground: #f0e6d6;
  --muted-foreground: #b3a290;

  --border: #3d3026;
  --border-strong: #5a4636;

  --primary: #d4525a;
  --primary-foreground: #1a1210;
  --primary-hover: #e0666d;
  --accent: #4cc6bd;
  --accent-foreground: #0d1a19;
  --destructive: #e06a5d;
  --destructive-foreground: #1a1210;
  --secondary: #3d3026;
  --secondary-foreground: #f0e6d6;

  --ring: #d4525a;
  --focus-ring: rgba(212, 82, 90, 0.24);
  --focus-ring-strong: rgba(212, 82, 90, 0.3);

  --btn-strong-bg: #8a2f33;
  --btn-strong-bg-hover: #731d1e;
  --btn-strong-border: #731d1e;
  --btn-strong-fg: #ffffff;

  --friend: #5cc079;
  --foe: #e0685a;
  --ok: #5cc079;
  --ok-bg: rgba(92, 192, 121, 0.16);
  --warn: #e0a93f;
  --warn-bg: rgba(224, 169, 63, 0.14);
  --warn-bg-hover: rgba(224, 169, 63, 0.26);
  --warn-border: #e0a93f;

  --die-max-bg: #166534;
  --die-max-fg: #dcfce7;
  --die-min-bg: #991b1b;
  --die-min-fg: #fee2e2;

  --combat-banner-bg: rgba(224, 104, 90, 0.12);
  --combat-banner-border: rgba(224, 104, 90, 0.4);
  --combat-banner-accent: #e0685a;

  --init-active-tint: rgba(212, 82, 90, 0.1);
}