/* v2-tokens.css — shadcn-style design tokens, red primary */

body.v2 {
  /* Surfaces (HSL components, used as hsl(var(--background))) */
  --background: 0 0% 100%;
  --foreground: 0 0% 9%;

  --card: 0 0% 100%;
  --card-foreground: 0 0% 9%;

  --popover: 0 0% 100%;
  --popover-foreground: 0 0% 9%;

  --muted: 0 0% 96%;
  --muted-foreground: 0 0% 45%;

  --subtle: 0 0% 98%;

  --border: 0 0% 90%;
  --input: 0 0% 90%;
  --ring: 0 72% 51%;

  /* Brand */
  --primary: 0 72% 51%;
  --primary-hover: 0 72% 45%;
  --primary-foreground: 0 86% 97%;

  --secondary: 0 0% 96%;
  --secondary-foreground: 0 0% 9%;

  --accent: 0 0% 96%;
  --accent-foreground: 0 0% 9%;

  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 98%;

  --success: 142 71% 45%;
  --success-foreground: 0 0% 100%;

  --warning: 38 92% 50%;
  --warning-foreground: 0 0% 9%;

  /* Type scale */
  --font-sans: 'Somar Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Radii */
  --radius-sm: 0.375rem;
  --radius:    0.5rem;
  --radius-md: 0.625rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;

  /* Shadows */
  --shadow-xs: 0 1px 2px 0 hsl(0 0% 0% / 0.04);
  --shadow-sm: 0 1px 3px 0 hsl(0 0% 0% / 0.06), 0 1px 2px -1px hsl(0 0% 0% / 0.06);
  --shadow:    0 4px 6px -1px hsl(0 0% 0% / 0.08), 0 2px 4px -2px hsl(0 0% 0% / 0.06);
  --shadow-md: 0 10px 15px -3px hsl(0 0% 0% / 0.10), 0 4px 6px -4px hsl(0 0% 0% / 0.08);
  --shadow-lg: 0 20px 25px -5px hsl(0 0% 0% / 0.10), 0 8px 10px -6px hsl(0 0% 0% / 0.08);

  /* Container */
  --container-max: 1200px;
}

/* Dark mode mirror */
@media (prefers-color-scheme: dark) {
  body.v2 {
    --background: 0 0% 4%;
    --foreground: 0 0% 98%;

    --card: 0 0% 6%;
    --card-foreground: 0 0% 98%;

    --popover: 0 0% 6%;
    --popover-foreground: 0 0% 98%;

    --muted: 0 0% 12%;
    --muted-foreground: 0 0% 64%;

    --subtle: 0 0% 8%;

    --border: 0 0% 16%;
    --input: 0 0% 16%;
    --ring: 0 72% 51%;

    --primary: 0 72% 51%;
    --primary-hover: 0 72% 56%;
    --primary-foreground: 0 86% 97%;

    --secondary: 0 0% 14%;
    --secondary-foreground: 0 0% 98%;

    --accent: 0 0% 14%;
    --accent-foreground: 0 0% 98%;

    --destructive: 0 63% 41%;
    --destructive-foreground: 0 0% 98%;

    --shadow-xs: 0 1px 2px 0 hsl(0 0% 0% / 0.4);
    --shadow-sm: 0 1px 3px 0 hsl(0 0% 0% / 0.5), 0 1px 2px -1px hsl(0 0% 0% / 0.5);
    --shadow:    0 4px 6px -1px hsl(0 0% 0% / 0.6), 0 2px 4px -2px hsl(0 0% 0% / 0.4);
    --shadow-md: 0 10px 15px -3px hsl(0 0% 0% / 0.7), 0 4px 6px -4px hsl(0 0% 0% / 0.5);
    --shadow-lg: 0 20px 25px -5px hsl(0 0% 0% / 0.8), 0 8px 10px -6px hsl(0 0% 0% / 0.5);
  }
}