/* assets/css/tokens.css
 * Design tokens: color, typography, spacing, radius, shadow.
 * Loaded once, globally, from includes/header.php.
 */
:root {
  /* Brand color — green, refined from the existing #2e7d32 */
  --color-primary-light: #4caf50;
  --color-primary: #2e7d32;
  --color-primary-dark: #1b5e20;
  --color-primary-contrast: #ffffff;

  /* Brand accent — gold */
  --color-accent: #d4a017;
  --color-accent-light: #f2c94c;
  --color-accent-contrast: #1a1a1a;

  /* Neutrals */
  --color-bg: #f7f8f9;
  --color-surface: #ffffff;
  --color-border: #e2e5e9;
  --color-text: #1f2933;
  --color-text-muted: #5b6673;
  --color-text-inverse: #ffffff;

  /* Semantic */
  --color-success: #1e7e34;
  --color-success-bg: #e6f4ea;
  --color-warning: #92600a;
  --color-warning-bg: #fff3cd;
  --color-danger: #b02a2a;
  --color-danger-bg: #fbe7e7;
  --color-info: #1565c0;
  --color-info-bg: #e3f0fc;

  /* Typography */
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;
  --line-height-base: 1.5;
  --line-height-tight: 1.25;

  /* Spacing (4px scale) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 999px;

  /* Shadow */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.15);
}