@import "tailwindcss";

/* ── Light theme (default) ─────────────────────────────────────── */
:root {
  --bg-page:       #f9fafb;
  --bg-surface:    #ffffff;
  --bg-surface-alt:#f3f4f6;
  --bg-header:     #f9fafb;
  --bg-hover:      #eff6ff;
  --bg-input:      #ffffff;
  --bg-error:      #fef2f2;

  --text-primary:  #111827;
  --text-secondary:#6b7280;
  --text-muted:    #9ca3af;

  --border:        #e5e7eb;
  --border-subtle: #f3f4f6;
  --border-input:  #d1d5db;
  --border-error:  #fca5a5;

  --text-error:    #b91c1c;

  --outcome-win-bg:      #dcfce7;
  --outcome-win-text:    #15803d;
  --outcome-lose-bg:     #fee2e2;
  --outcome-lose-text:   #b91c1c;
  --outcome-void-bg:     #fef9c3;
  --outcome-void-text:   #a16207;
  --outcome-unknown-bg:  #f3f4f6;
  --outcome-unknown-text:#6b7280;

  --conf-track:    #e5e7eb;
}

/* ── Dark theme ─────────────────────────────────────────────────── */
.dark {
  --bg-page:       #030712;
  --bg-surface:    #111827;
  --bg-surface-alt:#030712;
  --bg-header:     #111827;
  --bg-hover:      #1f2937;
  --bg-input:      #1f2937;
  --bg-error:      #450a0a;

  --text-primary:  #f9fafb;
  --text-secondary:#9ca3af;
  --text-muted:    #6b7280;

  --border:        #1f2937;
  --border-subtle: #1f2937;
  --border-input:  #374151;
  --border-error:  #991b1b;

  --text-error:    #fca5a5;

  --outcome-win-bg:      #14532d;
  --outcome-win-text:    #86efac;
  --outcome-lose-bg:     #7f1d1d;
  --outcome-lose-text:   #fca5a5;
  --outcome-void-bg:     #422006;
  --outcome-void-text:   #fde68a;
  --outcome-unknown-bg:  #1f2937;
  --outcome-unknown-text:#9ca3af;

  --conf-track:    #374151;
}