/*
 * Primea Theme — Franken UI (shadcn) variable overrides
 *
 * --primea-black:   #131313
 * --primea-white:   #f0ede8
 * --primea-orange:  #ec602b
 * --primea-blue:    #1d4bd5
 * --primea-grey:    #5c5c5c
 */

/* ── Brand tokens ─────────────────────────────────────────── */
:root {
  --primea-black: #131313;
  --primea-white: #f0ede8;
  --primea-orange: #ec602b;
  --primea-orange-hover: #d4521f;
  --primea-orange-focus: rgba(236, 96, 43, 0.25);
  --primea-blue: #1d4bd5;
  --primea-blue-hover: #1740b8;
  --primea-grey: #5c5c5c;
  --primea-grey-light: #979797;
  --primea-grey-border: #e4e2de;
}

/* ── Light mode (Franken UI / shadcn variables) ───────────── */
:root {
  --background: 30 16% 93%;       /* #f0ede8 */
  --foreground: 0 0% 7%;          /* #131313 */
  --card: 0 0% 100%;              /* #fff */
  --card-foreground: 0 0% 7%;
  --popover: 0 0% 100%;
  --popover-foreground: 0 0% 7%;
  --primary: 14 84% 55%;          /* #ec602b */
  --primary-foreground: 0 0% 100%;
  --secondary: 227 74% 47%;       /* #1d4bd5 */
  --secondary-foreground: 0 0% 100%;
  --muted: 30 12% 92%;
  --muted-foreground: 0 0% 36%;   /* #5c5c5c */
  --accent: 30 12% 92%;
  --accent-foreground: 0 0% 7%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;
  --border: 30 10% 89%;           /* #e4e2de */
  --input: 30 10% 89%;
  --ring: 14 84% 55%;             /* orange ring */
  --radius: 0.5rem;
}

/* ── Explicit body/form overrides (ensure Primea colors win) ─ */
body {
  background-color: var(--primea-white);
  color: var(--primea-black);
}

input, textarea, select {
  background-color: #fff;
  border-color: var(--primea-grey-border);
}

input:focus, textarea:focus, select:focus {
  border-color: var(--primea-orange);
  outline-color: var(--primea-orange);
}

/* ── Dark mode ────────────────────────────────────────────── */
.dark,
[data-theme="dark"] {
  --background: 0 0% 7%;          /* #131313 */
  --foreground: 30 16% 93%;       /* #f0ede8 */
  --card: 0 0% 12%;               /* #1e1e1e */
  --card-foreground: 30 16% 93%;
  --popover: 0 0% 12%;
  --popover-foreground: 30 16% 93%;
  --primary: 14 84% 55%;
  --primary-foreground: 0 0% 100%;
  --secondary: 227 70% 63%;       /* lighter blue for dark bg */
  --secondary-foreground: 0 0% 100%;
  --muted: 0 0% 15%;
  --muted-foreground: 0 0% 59%;   /* #979797 */
  --accent: 0 0% 15%;
  --accent-foreground: 30 16% 93%;
  --destructive: 0 63% 31%;
  --destructive-foreground: 0 0% 100%;
  --border: 0 0% 26%;             /* #434343 */
  --input: 0 0% 26%;
  --ring: 14 84% 55%;
}

.dark body,
[data-theme="dark"] body,
.dark,
[data-theme="dark"] {
  background-color: var(--primea-black);
  color: var(--primea-white);
}

.dark input, .dark textarea, .dark select,
[data-theme="dark"] input, [data-theme="dark"] textarea, [data-theme="dark"] select {
  background-color: #1e1e1e;
  border-color: #434343;
}