/* ==========================================================
   Flux × Tailwind v4 — token enforcement layer
   AUTO-GENERATED from flux.json — do not edit directly.
   Run "npm run generate-tokens" or edit src/tokens/flux.json.
   ----------------------------------------------------------
   FOR CONSUMER PROTOTYPE REPOS ONLY (not the Flux site itself).

   This file makes Flux *displace* Tailwind's defaults instead of
   merely sitting on top of them: it resets the built-in color
   palette and remaps the common Tailwind names onto Flux, so an
   agent typing gray-500 / blue-600 / rounded-lg / text-xl gets
   on-brand Flux output instead of generic Tailwind values.

   Hardened anti-leak coverage:
     - ALL Tailwind color families (slate/gray/.../rose) -> Flux ramps
     - font weights collapsed to the only loaded Lexend weights (300/700)
     - font-family pinned to Lexend (graceful system fallback)
     - default focus ring -> Flux primary teal (not blue / currentColor)
     - radius, type scale, spacing and shadows -> Flux tokens

   Import order (Tailwind v4, CSS-first):
     @import "tailwindcss";
     @import url("https://flux.kaptio.com/tokens/flux.css");      /* raw --flux-* custom properties */
     @import url("https://flux.kaptio.com/tokens/flux-tailwind.css"); /* THIS FILE — must come last */

   Non-Tailwind projects do NOT need this file — use flux.css alone.
   ========================================================== */

@theme {
  /* --- Reset: drop Tailwind's entire default color palette --- */
  --color-*: initial;

  /* --- Keyword colors (restored after reset; utilities depend on them) --- */
  --color-transparent: transparent;
  --color-current: currentColor;
  --color-inherit: inherit;
  --color-black: #212121;
  --color-white: #FFFFFF;
  --color-background: #F9FAF8;

  /* --- Flux primary teal, addressable as bg-flux-600 / text-flux-400 etc. --- */
  --color-flux-900: #021e24;
  --color-flux-800: #032E36;
  --color-flux-700: #034050;
  --color-flux-600: #034955;
  --color-flux-500: #056271;
  --color-flux-400: #056F82;
  --color-flux-300: #69A9B4;
  --color-flux-200: #B4D4DA;
  --color-flux-100: #E6F1F2;
  --color-flux-50: #EFF5F5;

  /* --- Flux grey ramp, addressable as bg-grey-100 / text-grey-500 etc. --- */
  --color-grey-50: #F5F5F5;
  --color-grey-100: #EBEBEB;
  --color-grey-200: #C3C3C3;
  --color-grey-300: #878787;
  --color-grey-500: #6B7280;
  --color-grey-700: #374151;

  /* --- Real Flux blue (awaiting-supplier badge), kept as flux-blue-* --- */
  --color-flux-blue-600: #356CD1;
  --color-flux-blue-400: #4285FF;
  --color-flux-blue-300: #8EB6FF;
  --color-flux-blue-200: #C6DAFF;
  --color-flux-blue-100: #ECF5FF;

  /* --- Semantic --- */
  --color-success: #10B981;
  --color-error: #C1121F;
  --color-warning: #F59E0B;
  --color-info: #056F82;

  /* --- Product layer accents --- */
  --color-core: #056F82;
  --color-pex: #F18525;
  --color-edge: #DE37A4;
  --color-agents: #8B5CF6;

  /* --- Tailwind muscle-memory remaps: every common family + step -> Flux --- */
  /* gray-* -> Flux grey */
  --color-gray-50: #F5F5F5;
  --color-gray-100: #EBEBEB;
  --color-gray-200: #C3C3C3;
  --color-gray-300: #878787;
  --color-gray-400: #878787;
  --color-gray-500: #6B7280;
  --color-gray-600: #6B7280;
  --color-gray-700: #374151;
  --color-gray-800: #212121;
  --color-gray-900: #212121;
  --color-gray-950: #212121;
  /* slate-* -> Flux grey */
  --color-slate-50: #F5F5F5;
  --color-slate-100: #EBEBEB;
  --color-slate-200: #C3C3C3;
  --color-slate-300: #878787;
  --color-slate-400: #878787;
  --color-slate-500: #6B7280;
  --color-slate-600: #6B7280;
  --color-slate-700: #374151;
  --color-slate-800: #212121;
  --color-slate-900: #212121;
  --color-slate-950: #212121;
  /* zinc-* -> Flux grey */
  --color-zinc-50: #F5F5F5;
  --color-zinc-100: #EBEBEB;
  --color-zinc-200: #C3C3C3;
  --color-zinc-300: #878787;
  --color-zinc-400: #878787;
  --color-zinc-500: #6B7280;
  --color-zinc-600: #6B7280;
  --color-zinc-700: #374151;
  --color-zinc-800: #212121;
  --color-zinc-900: #212121;
  --color-zinc-950: #212121;
  /* neutral-* -> Flux grey */
  --color-neutral-50: #F5F5F5;
  --color-neutral-100: #EBEBEB;
  --color-neutral-200: #C3C3C3;
  --color-neutral-300: #878787;
  --color-neutral-400: #878787;
  --color-neutral-500: #6B7280;
  --color-neutral-600: #6B7280;
  --color-neutral-700: #374151;
  --color-neutral-800: #212121;
  --color-neutral-900: #212121;
  --color-neutral-950: #212121;
  /* stone-* -> Flux grey */
  --color-stone-50: #F5F5F5;
  --color-stone-100: #EBEBEB;
  --color-stone-200: #C3C3C3;
  --color-stone-300: #878787;
  --color-stone-400: #878787;
  --color-stone-500: #6B7280;
  --color-stone-600: #6B7280;
  --color-stone-700: #374151;
  --color-stone-800: #212121;
  --color-stone-900: #212121;
  --color-stone-950: #212121;
  /* blue-* -> Flux primary */
  --color-blue-50: #EFF5F5;
  --color-blue-100: #E6F1F2;
  --color-blue-200: #B4D4DA;
  --color-blue-300: #69A9B4;
  --color-blue-400: #056F82;
  --color-blue-500: #056271;
  --color-blue-600: #034955;
  --color-blue-700: #034050;
  --color-blue-800: #032E36;
  --color-blue-900: #021e24;
  --color-blue-950: #021e24;
  /* indigo-* -> Flux primary */
  --color-indigo-50: #EFF5F5;
  --color-indigo-100: #E6F1F2;
  --color-indigo-200: #B4D4DA;
  --color-indigo-300: #69A9B4;
  --color-indigo-400: #056F82;
  --color-indigo-500: #056271;
  --color-indigo-600: #034955;
  --color-indigo-700: #034050;
  --color-indigo-800: #032E36;
  --color-indigo-900: #021e24;
  --color-indigo-950: #021e24;
  /* sky-* -> Flux primary */
  --color-sky-50: #EFF5F5;
  --color-sky-100: #E6F1F2;
  --color-sky-200: #B4D4DA;
  --color-sky-300: #69A9B4;
  --color-sky-400: #056F82;
  --color-sky-500: #056271;
  --color-sky-600: #034955;
  --color-sky-700: #034050;
  --color-sky-800: #032E36;
  --color-sky-900: #021e24;
  --color-sky-950: #021e24;
  /* cyan-* -> Flux primary */
  --color-cyan-50: #EFF5F5;
  --color-cyan-100: #E6F1F2;
  --color-cyan-200: #B4D4DA;
  --color-cyan-300: #69A9B4;
  --color-cyan-400: #056F82;
  --color-cyan-500: #056271;
  --color-cyan-600: #034955;
  --color-cyan-700: #034050;
  --color-cyan-800: #032E36;
  --color-cyan-900: #021e24;
  --color-cyan-950: #021e24;
  /* teal-* -> Flux primary */
  --color-teal-50: #EFF5F5;
  --color-teal-100: #E6F1F2;
  --color-teal-200: #B4D4DA;
  --color-teal-300: #69A9B4;
  --color-teal-400: #056F82;
  --color-teal-500: #056271;
  --color-teal-600: #034955;
  --color-teal-700: #034050;
  --color-teal-800: #032E36;
  --color-teal-900: #021e24;
  --color-teal-950: #021e24;
  /* yellow-* -> Flux yellow */
  --color-yellow-50: #FFF8EC;
  --color-yellow-100: #FFF8EC;
  --color-yellow-200: #FFEBC6;
  --color-yellow-300: #FFD78E;
  --color-yellow-400: #FFBC42;
  --color-yellow-500: #FFBC42;
  --color-yellow-600: #DC8E00;
  --color-yellow-700: #DC8E00;
  --color-yellow-800: #976100;
  --color-yellow-900: #976100;
  --color-yellow-950: #976100;
  /* amber-* -> Flux yellow */
  --color-amber-50: #FFF8EC;
  --color-amber-100: #FFF8EC;
  --color-amber-200: #FFEBC6;
  --color-amber-300: #FFD78E;
  --color-amber-400: #FFBC42;
  --color-amber-500: #FFBC42;
  --color-amber-600: #DC8E00;
  --color-amber-700: #DC8E00;
  --color-amber-800: #976100;
  --color-amber-900: #976100;
  --color-amber-950: #976100;
  /* pink-* -> Flux pink */
  --color-pink-50: #FCEBF6;
  --color-pink-100: #FCEBF6;
  --color-pink-200: #F5C3E4;
  --color-pink-300: #EB87C8;
  --color-pink-400: #DE37A4;
  --color-pink-500: #DE37A4;
  --color-pink-600: #AF0072;
  --color-pink-700: #AF0072;
  --color-pink-800: #AF0072;
  --color-pink-900: #AF0072;
  --color-pink-950: #AF0072;
  /* fuchsia-* -> Flux pink */
  --color-fuchsia-50: #FCEBF6;
  --color-fuchsia-100: #FCEBF6;
  --color-fuchsia-200: #F5C3E4;
  --color-fuchsia-300: #EB87C8;
  --color-fuchsia-400: #DE37A4;
  --color-fuchsia-500: #DE37A4;
  --color-fuchsia-600: #AF0072;
  --color-fuchsia-700: #AF0072;
  --color-fuchsia-800: #AF0072;
  --color-fuchsia-900: #AF0072;
  --color-fuchsia-950: #AF0072;
  /* rose-* -> Flux pink */
  --color-rose-50: #FCEBF6;
  --color-rose-100: #FCEBF6;
  --color-rose-200: #F5C3E4;
  --color-rose-300: #EB87C8;
  --color-rose-400: #DE37A4;
  --color-rose-500: #DE37A4;
  --color-rose-600: #AF0072;
  --color-rose-700: #AF0072;
  --color-rose-800: #AF0072;
  --color-rose-900: #AF0072;
  --color-rose-950: #AF0072;
  /* orange-* -> Flux orange */
  --color-orange-50: #FFF1EE;
  --color-orange-100: #FFF1EE;
  --color-orange-200: #FFD4CD;
  --color-orange-300: #FFA99B;
  --color-orange-400: #FF6F59;
  --color-orange-500: #FF6F59;
  --color-orange-600: #CF1B00;
  --color-orange-700: #CF1B00;
  --color-orange-800: #9C1500;
  --color-orange-900: #9C1500;
  --color-orange-950: #9C1500;
  /* red-* -> Flux orange */
  --color-red-50: #FFF1EE;
  --color-red-100: #FFF1EE;
  --color-red-200: #FFD4CD;
  --color-red-300: #FFA99B;
  --color-red-400: #FF6F59;
  --color-red-500: #FF6F59;
  --color-red-600: #CF1B00;
  --color-red-700: #CF1B00;
  --color-red-800: #9C1500;
  --color-red-900: #9C1500;
  --color-red-950: #9C1500;
  /* green-* -> Flux green */
  --color-green-50: #EAF6E7;
  --color-green-100: #EAF6E7;
  --color-green-200: #BFE5B8;
  --color-green-300: #80CA70;
  --color-green-400: #2BA711;
  --color-green-500: #2BA711;
  --color-green-600: #197C04;
  --color-green-700: #197C04;
  --color-green-800: #197C04;
  --color-green-900: #197C04;
  --color-green-950: #197C04;
  /* emerald-* -> Flux green */
  --color-emerald-50: #EAF6E7;
  --color-emerald-100: #EAF6E7;
  --color-emerald-200: #BFE5B8;
  --color-emerald-300: #80CA70;
  --color-emerald-400: #2BA711;
  --color-emerald-500: #2BA711;
  --color-emerald-600: #197C04;
  --color-emerald-700: #197C04;
  --color-emerald-800: #197C04;
  --color-emerald-900: #197C04;
  --color-emerald-950: #197C04;
  /* lime-* -> Flux green */
  --color-lime-50: #EAF6E7;
  --color-lime-100: #EAF6E7;
  --color-lime-200: #BFE5B8;
  --color-lime-300: #80CA70;
  --color-lime-400: #2BA711;
  --color-lime-500: #2BA711;
  --color-lime-600: #197C04;
  --color-lime-700: #197C04;
  --color-lime-800: #197C04;
  --color-lime-900: #197C04;
  --color-lime-950: #197C04;
  /* purple-* -> Flux purple */
  --color-purple-50: #F1EFFF;
  --color-purple-100: #F1EFFF;
  --color-purple-200: #D5CFFF;
  --color-purple-300: #ADA0FF;
  --color-purple-400: #6F59FF;
  --color-purple-500: #6F59FF;
  --color-purple-600: #5A47D6;
  --color-purple-700: #5A47D6;
  --color-purple-800: #5A47D6;
  --color-purple-900: #5A47D6;
  --color-purple-950: #5A47D6;
  /* violet-* -> Flux purple */
  --color-violet-50: #F1EFFF;
  --color-violet-100: #F1EFFF;
  --color-violet-200: #D5CFFF;
  --color-violet-300: #ADA0FF;
  --color-violet-400: #6F59FF;
  --color-violet-500: #6F59FF;
  --color-violet-600: #5A47D6;
  --color-violet-700: #5A47D6;
  --color-violet-800: #5A47D6;
  --color-violet-900: #5A47D6;
  --color-violet-950: #5A47D6;

  /* --- Border radius -> Flux radii (rounded, rounded-md, rounded-lg, ...) --- */
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-2xl: 1.5rem;
  --radius-full: 9999px;

  /* --- Box shadow -> Flux teal-tinted shadow scale (shadow-sm/md/lg/xl) --- */
  --shadow-2xs: 0 1px 2px 0 rgba(3, 46, 54, 0.05);
  --shadow-xs: 0 1px 2px 0 rgba(3, 46, 54, 0.05);
  --shadow-sm: 0 1px 2px 0 rgba(3, 46, 54, 0.05);
  --shadow: 0 4px 6px -1px rgba(3, 46, 54, 0.07), 0 2px 4px -2px rgba(3, 46, 54, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(3, 46, 54, 0.07), 0 2px 4px -2px rgba(3, 46, 54, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(3, 46, 54, 0.08), 0 4px 6px -4px rgba(3, 46, 54, 0.04);
  --shadow-xl: 0 20px 25px -5px rgba(3, 46, 54, 0.08), 0 8px 10px -6px rgba(3, 46, 54, 0.04);
  --shadow-2xl: 0 20px 25px -5px rgba(3, 46, 54, 0.08), 0 8px 10px -6px rgba(3, 46, 54, 0.04);

  /* --- Font families -> Lexend / JetBrains Mono --- */
  --font-sans: 'Lexend', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --default-font-family: 'Lexend', system-ui, -apple-system, sans-serif;
  --default-mono-font-family: 'JetBrains Mono', ui-monospace, monospace;

  /* --- Font weights -> collapse onto the only loaded Lexend weights (300/700) --- */
  --font-weight-thin: 300;
  --font-weight-extralight: 300;
  --font-weight-light: 300;
  --font-weight-normal: 300;
  --font-weight-medium: 300;
  --font-weight-semibold: 700;
  --font-weight-bold: 700;
  --font-weight-extrabold: 700;
  --font-weight-black: 700;

  /* --- Default focus ring -> Flux primary teal (never blue / currentColor) --- */
  --default-ring-color: #69A9B4;

  /* --- Type scale -> Flux sizes (text-sm, text-xl, ...) --- */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;

  /* --- Spacing base. Tailwind v4 derives every step from one base unit;
     Flux is a 4px grid, so the base stays 0.25rem (= --flux-space-1).
     This keeps p-4 / gap-6 / etc. on the Flux 4px grid. --- */
  --spacing: 0.25rem;
}