/* Ledger Design System — canonical tokens (v1.1)
 * Source of truth: delviotax/delvio-design · LEDGER_DESIGN_SYSTEM.md §2, §9
 * Plain :root block for non-Tailwind stacks (Jinja2, Flask, Streamlit CSS
 * injection, vanilla CSS). Tailwind v4 apps use the @theme block in §9 instead.
 *
 * Do NOT hardcode these hex values in components — reference the variables.
 * The red/yellow/green data-entry state colors (LEDGER §6) are NOT here:
 * they are hardcoded at the field-widget level and no theme may restyle them.
 */
:root {
  /* Surfaces */
  --color-ink: #12100c;
  --color-paper: #f7f5f0;
  --color-paper-2: #fffdf8;
  --color-paper-3: #f2ede0;

  /* Gold accents */
  --color-gold: #a8842c;          /* chrome/accent only — not must-read text (§12.1) */
  --color-gold-dark: #8a6c24;     /* gold hover + small/must-read gold text (§12.1) */
  --color-gold-bright: #f5c542;   /* CTA fill (ink text) */
  --color-gold-bright-hover: #e7b93a;

  /* Text */
  --color-muted: #4b463c;         /* secondary body text */
  --color-muted-2: #7a7264;       /* supplementary >=12px, paper-2 only (§12.2) */

  /* Structure */
  --color-line: #e2ddd0;          /* hairline borders, dividers, row separators */

  /* Amounts / status (NOT the entry-field convention) */
  --color-pos: #2f7a4d;
  --color-pos-hover: #27663f;
  --color-neg: #b04a4a;
  --color-neg-hover: #9a3e3e;
  --color-neg-subtle: #f7ecec;

  /* Selection */
  --color-selection-bg: #f5c542;
  --color-selection-text: #12100c;

  /* Focus ring — gold @ 25% (§7, §11) */
  --focus-ring: rgba(168, 132, 44, 0.25);

  /* Type */
  --font-serif: Georgia, "Times New Roman", serif;
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Radius (§5) */
  --radius: 4px;
  --radius-lg: 6px;
}
