/* Theme Token Foundation — :root defaults for all CSS custom properties.
   Themes override these via [data-theme="..."] selectors.
   If no theme is loaded, these values provide a usable default. */

:root {
  /* Primitive tokens */
  --color-bg: #ffffff;
  --color-text: #1f2937;
  --color-muted: #6b7280;
  --color-border: #e5e7eb;
  --color-accent: #667eea;

  /* Semantic tokens */
  --surface-primary: #ffffff;
  --surface-secondary: #f9fafb;
  --text-primary: #111827;
  --text-secondary: #6b7280;
  --interactive-primary: #667eea;
  --interactive-hover: #5a67d8;

  /* Typography */
  --font-body: Inter, system-ui, sans-serif;
  --font-heading: Inter, system-ui, sans-serif;

  /* Shape */
  --radius-sm: 4px;
  --radius-md: 8px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);

  /* Density */
  --density: 1;
}

/* Density presets */
[data-density="compact"] { --density: 0.85; }
[data-density="comfortable"] { --density: 1.2; }

/* Accessibility: high contrast mode */
[data-accessibility="high"] {
  --shadow-sm: none;
  --color-muted: #374151;
  --text-secondary: #374151;
}

[data-accessibility="high"] *::before,
[data-accessibility="high"] *::after {
  content: none !important;
}