/* Design tokens for the visual direction (T018, attempt 2), taken from the
   portal prototype D (docs/design/prototipo-d.html): a warm dark theme — the
   dark shell of DavideChess with the roundness and warmth of style C. This is
   the ONE file where colour values live; every other stylesheet uses these
   variables.

   The action green keeps large white button text above 3:1, and text stays
   above 4.5:1 on the background and on cards — a test checks both. */

:root {
  /* Surfaces */
  --color-bg: #1f2328;            /* the page */
  --color-bg-raised: #2a2f36;     /* header bar, input fields */
  --color-card: #30363e;          /* cards */
  --color-line: #414953;          /* borders */
  --color-line-soft: #3a4049;     /* hover fills, dividers */

  /* Text */
  --color-text: #eceff3;          /* primary text */
  --color-muted: #9aa4b0;         /* secondary text */
  --color-cream: #fbf3e6;         /* the logo's warm cream (the brand wordmark) */

  /* The one strong colour: the main action. Moved to the logo's forest-green
     family (T044). #1f5a3a itself is too dark to read as a button on the dark
     page, so the fill is a lighter forest that keeps white text at 4.86:1 and
     still stands off the background at ~3.1:1; the solid shadow is the deep
     forest #1f5a3a. */
  --color-primary: #2e7d4f;
  --color-primary-dark: #1f5a3a;  /* solid shadow under a primary button */
  --color-primary-light: #5fae7d; /* accents on dark */
  --color-on-primary: #ffffff;

  /* Warm accents — the logo's rust / warm orange and gold (T044) */
  --color-orange: #e0703e;        /* the brand mark / companion (warm orange) */
  --color-orange-soft: #4a3322;   /* warm dark fill */
  --color-gold: #c9a24b;

  /* The three trophy metals: bronze medal, silver shield, gold cup. Each has a
     lighter highlight for the disc's shine, and gold a darker edge for the coin. */
  --color-bronze: #d08a52;
  --color-bronze-light: #f4c79c;
  --color-silver: #b9c3cf;
  --color-silver-light: #eef2f6;
  --color-gold-light: #ffe39a;
  --color-gold-dark: #b3862a;

  /* Feedback */
  --color-danger: #d94c4c;
  --color-danger-dark: #a83232;
  --color-on-danger: #ffffff;

  /* Promise pills (dark) */
  --color-pill-green-bg: #2f4323;
  --color-pill-green-ink: #b9e08f;
  --color-pill-orange-ink: #ffc59a;

  /* A selected choice card (dark forest-green fill) */
  --color-choice-selected: #234a34;

  /* The solid, un-blurred shadow under cards and buttons */
  --color-drop: #15181c;

  /* Corner radii — round */
  --radius-card: 22px;
  --radius-btn: 16px;
  --radius-btn-lg: 22px;
  --radius-input: 14px;
  --radius-choice: 18px;
  --radius-pill: 999px;
  --radius-nav: 12px;

  /* Spacing scale */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-8: 3rem;

  /* The chunky button: a solid shadow the press squashes */
  --btn-lift: 5px;
  --shadow-card: 0 5px 0 var(--color-drop);

  /* Typography */
  --font-body: "Baloo 2", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Comfortable finger target */
  --tap: 52px;

  /* The brand lock-up, per theme (T059). On the dark shell it stays exactly as
     it was: "Minds" in cream, "& Moves" in warm orange, the motto in gold, the
     emblem at 2.4rem. The light theme (below) redefines these; nothing else. */
  --brand-word-1: var(--color-cream);   /* "Minds" */
  --brand-word-2: var(--color-orange);  /* "& Moves" */
  --brand-tagline: var(--color-gold);   /* the motto under the wordmark */
  --brand-emblem-size: 2.4rem;

  /* The board — "Caramella" (variant D of docs/design/scacchiera.html). The one
     place the board's colours live; board.css only reaches for these. */
  --board-light: #fff4e6;              /* light squares (cream) */
  --board-dark: #f6b98a;               /* dark squares (peach) */
  --board-frame-top: #ff8a3d;          /* the warm frame, top of the gradient */
  --board-frame-bottom: #e8742a;       /* frame, bottom of the gradient */
  --board-frame-shadow: #b3561a;       /* the solid drop under the frame */
  --board-last: rgba(255, 205, 74, 0.55);   /* last move, a warm yellow wash */
  --board-move: #5f9a2e;               /* move dots, capture rings, selection */
  --board-check: rgba(217, 76, 76, 0.85);    /* the soft red glow on a king in check */
  --board-check-soft: rgba(217, 76, 76, 0.35);
  --board-coord-on-light: #d9772f;     /* coordinates over a light square */
  --board-coord-on-dark: #ffffff;      /* coordinates over a dark square */
  --board-piece-shadow: rgba(0, 0, 0, 0.22); /* the soft drop under each piece */
}

/* The light ("panna") theme for the adult pages (T059 — the approved "Strada 2"
   of docs/design/intestazione.html). The layout puts data-theme="light" on
   <html> for the page kinds that go cream — and never while a child is active —
   so :root above stays the child's dark shell, untouched, and the board is not
   reached at all. This block only REDEFINES the same variables in warm light
   values; the whole adult side flips because every stylesheet reads the tokens.

   The three tested pairs (contrast.test.js, now run on both themes) clear AA on
   cream: text #20262b on the page #fbf3e6 (~13:1) and on a card #fffdf8 (~14:1),
   and white on the deep-forest action #1f5a3a (~8:1). Where the dark palette's
   own accent would fail on cream (gold, the light-green link) the value is
   changed here, not the threshold. */
:root[data-theme="light"] {
  /* Surfaces — page cream, cards and the top bar warm ivory. */
  --color-bg: #fbf3e6;
  --color-bg-raised: #fffdf8;
  --color-card: #fffdf8;
  --color-line: #e7ded0;
  --color-line-soft: #efe6d6;

  /* Text — near-black ink, a warm brown for the secondary. */
  --color-text: #20262b;
  --color-muted: #6d6152;

  /* The action: the deep forest green of the logo, white text. On cream the
     deep forest reads as the button (unlike on dark, where it was the shadow);
     the shadow becomes a darker forest. The "light" green — used for links and
     the focus ring — is darkened to the deep forest so body links clear 4.5:1. */
  --color-primary: #1f5a3a;
  --color-primary-dark: #16402a;
  --color-primary-light: #1f5a3a;
  --color-on-primary: #ffffff;

  /* Warm accents — the rust of the mark, a warm tint fill, a deep antique gold
     (the bright gold would wash out on cream, so it is darkened to clear AA). */
  --color-orange: #c75a2c;
  --color-orange-soft: #f6e2d3;
  --color-gold: #7a5e18;

  /* Promise pills and a selected choice, in warm light tones. */
  --color-pill-green-bg: #e3efdc;
  --color-pill-green-ink: #245c2a;
  --color-pill-orange-ink: #8a4a1f;
  --color-choice-selected: #e7f0e7;

  /* The signature solid drop shadow stays, in a warm cream a shade darker than
     the page — not the near-black of the dark theme. */
  --color-drop: #d9cfbc;

  /* The brand lock-up on cream: "Minds" forest, "& Moves" rust, motto warm
     brown, emblem a touch larger (46px) since it now sits on its own colour. */
  --brand-word-1: #1f5a3a;
  --brand-word-2: #c75a2c;
  --brand-tagline: #6d6152;
  --brand-emblem-size: 2.875rem;
}