/* ============================================================
   MirAI × shadcn/ui — token bridge
   ----------------------------------------------------------------
   Drop-in replacement for shadcn's default globals.css. Adopts the
   MirAI tri-color palette and brutalist surface treatment.

   shadcn convention: CSS variables hold HSL triplets WITHOUT the
   hsl() wrapper, so Tailwind can compose with alpha modifiers like
   `bg-primary/50`. The wrapper is added in tailwind.config:

     primary: "hsl(var(--primary) / <alpha-value>)"

   Source of truth: tokens/tokens.json
   ----------------------------------------------------------------
   IMPORTANT — MirAI rules that shadcn does NOT enforce automatically:
     · Tri-color rule: all "muted" / "secondary" surfaces resolve
       to derived grays of pure black, not new hues.
     · No soft drops, no glass blur. Default `--shadow-*` are HARD.
     · `--radius` is 8 px — the INTERACTIVE radius. Static / data
       surfaces should use rounded-sm (4 px) or rounded-none.
   ============================================================ */

@layer base {
  :root {
    /* ---- Surfaces ------------------------------------------ */
    --background:        0 0% 100%;       /* #FFFFFF — Pure White */
    --foreground:        0 0% 0%;         /* #000000 — Pure Black */

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

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

    /* ---- Brand ---------------------------------------------- */
    --primary:           229 62% 59%;     /* #556DD7 — MirAI Blue */
    --primary-foreground:0 0% 100%;

    /* ---- Derived grays (pure black + alpha, flattened on #FFF) */
    --secondary:           0 0% 96%;      /* surface-muted */
    --secondary-foreground:0 0% 0%;

    --muted:               0 0% 96%;
    --muted-foreground:    0 0% 35%;      /* text-secondary */

    --accent:              0 0% 94%;      /* surface-hover */
    --accent-foreground:   0 0% 0%;

    /* ---- States --------------------------------------------- */
    --destructive:           0 65% 46%;   /* #C12A2A */
    --destructive-foreground:0 0% 100%;

    --success:           150 64% 33%;     /* #1F8A5B */
    --warning:           45  100% 50%;    /* hazard-tape yellow accent */

    /* ---- Inputs / borders / ring ---------------------------- */
    --border:  0 0% 85%;                  /* rgba(0,0,0,0.15) flattened on white */
    --input:   0 0% 85%;
    --ring:    229 62% 59%;               /* focus ring uses MirAI Blue */

    /* ---- Radius (shadcn slot — uses INTERACTIVE radius) ----- */
    --radius: 0.5rem;                     /* 8px — buttons/inputs/menus */

    /* ---- MirAI-specific extensions -------------------------- */
    --radius-structural: 0.25rem;         /* 4px — data cards */
    --radius-none:       0px;             /* 0px — structural walls */

    --shadow-hard-sm: 2px 2px 0 0 hsl(var(--foreground));
    --shadow-hard:    4px 4px 0 0 hsl(var(--foreground));
    --shadow-hard-lg: 6px 6px 0 0 hsl(var(--foreground));
    --shadow-hard-blue: 4px 4px 0 0 hsl(var(--primary));

    --ease-out:    cubic-bezier(0.2, 0.8, 0.2, 1);
    --ease-in-out: cubic-bezier(0.4, 0,   0.2, 1);
    --dur-fast:  120ms;
    --dur-base:  180ms;
    --dur-slow:  280ms;

    /* Font stack — Space Grotesk only. */
    --font-sans: "Space Grotesk", ui-sans-serif, system-ui, -apple-system,
                 "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-mono: "Space Grotesk", ui-monospace, "SF Mono", Menlo, monospace;
  }

  /* MirAI has no dark theme — black is reserved for structural
     accents, not full surfaces. The `.dark` block below exists so
     shadcn's prebuilt components don't break; it intentionally
     inverts only what's needed for high-contrast moments. */
  .dark {
    --background:           0 0% 0%;
    --foreground:           0 0% 100%;
    --card:                 0 0% 0%;
    --card-foreground:      0 0% 100%;
    --popover:              0 0% 0%;
    --popover-foreground:   0 0% 100%;
    --primary:              229 62% 59%;
    --primary-foreground:   0 0% 100%;
    --secondary:            0 0% 12%;
    --secondary-foreground: 0 0% 100%;
    --muted:                0 0% 12%;
    --muted-foreground:     0 0% 65%;
    --accent:               0 0% 18%;
    --accent-foreground:    0 0% 100%;
    --destructive:          0 65% 46%;
    --destructive-foreground:0 0% 100%;
    --border:               0 0% 20%;
    --input:                0 0% 20%;
    --ring:                 229 62% 59%;
  }

  body {
    font-family: var(--font-sans);
    background: hsl(var(--background));
    color: hsl(var(--foreground));
    -webkit-font-smoothing: antialiased;
  }

  /* Numerals: tabular by default for audit-log / financial data. */
  .tabular, code, pre, table, [data-numeric] {
    font-variant-numeric: tabular-nums;
  }
}