/* ============================================================
   E4 TÊXTIL — DESIGN TOKENS
   Espelha Design_System_E4Textil.JSON (fonte da verdade).
   Todo CSS do tema consome estas variáveis — nunca hardcode.
   ============================================================ */
:root {
  /* ---- BRAND ---- */
  --color-ink: #000000;
  --color-ink-soft: #1A1A1A;
  --color-ink-muted: #3D3D3D;
  --color-paper: #FFFFFF;

  /* ---- SEMANTIC ---- */
  --color-primary: #000000;
  --color-primary-hover: #1A1A1A;
  --color-primary-contrast: #FFFFFF;
  --color-secondary: #F2F0ED;
  --color-secondary-hover: #E8E5E0;
  --color-secondary-contrast: #000000;
  --color-main-bg: #FFFFFF;

  /* ---- NEUTRAL 0–950 ---- */
  --neutral-0: #FFFFFF;
  --neutral-50: #FAFAF9;
  --neutral-100: #F5F4F2;
  --neutral-200: #EDEBE7;
  --neutral-300: #E0E0E0;
  --neutral-400: #C1C1C1;
  --neutral-500: #9E9E9E;
  --neutral-600: #878787;
  --neutral-700: #5D5D5D;
  --neutral-800: #404040;
  --neutral-900: #262626;
  --neutral-950: #0A0A0A;

  /* ---- UI ---- */
  --ui-background: #FFFFFF;
  --ui-surface: #FAFAF9;
  --ui-surface-muted: #F5F4F2;
  --ui-surface-inverted: #000000;
  --ui-border: #E0E0E0;
  --ui-border-muted: #EDEBE7;
  --ui-border-strong: #C1C1C1;
  --ui-overlay: rgba(0, 0, 0, 0.4);
  --ui-overlay-light: rgba(255, 255, 255, 0.48);

  /* ---- TEXT ---- */
  --text-primary: #000000;
  --text-secondary: #5D5D5D;
  --text-tertiary: #878787;
  --text-muted: #9E9E9E;
  --text-disabled: #C1C1C1;
  --text-on-dark: #FFFFFF;
  --text-on-dark-muted: rgba(255, 255, 255, 0.72);

  /* ---- FUNCTIONAL (sistema, NÃO marca) ---- */
  --fn-danger: #D2042C;
  --fn-danger-light: #FDF1F2;
  --fn-success: #1F8A4C;
  --fn-success-light: #EEF7F0;
  --fn-warning: #B8860B;
  --fn-warning-light: #FBF6E9;
  --fn-info: #000000;

  /* ---- STARS (monocromáticas) ---- */
  --star-filled: #000000;
  --star-empty: #C1C1C1;

  /* ---- TYPOGRAPHY ---- */
  --font-display: "Jost", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Alexandria", "Jost", -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-accent: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-ui: "Inter", -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;

  --fs-xs: 10px;   --lh-xs: 14px;
  --fs-sm: 12px;   --lh-sm: 16px;
  --fs-base: 14px; --lh-base: 20px;
  --fs-md: 16px;   --lh-md: 24px;
  --fs-lg: 18px;   --lh-lg: 26px;
  --fs-xl: 20px;   --lh-xl: 28px;
  --fs-2xl: 24px;  --lh-2xl: 30px;
  --fs-3xl: 32px;  --lh-3xl: 38px;
  --fs-4xl: 40px;  --lh-4xl: 46px;
  --fs-5xl: 48px;  --lh-5xl: 54px;
  --fs-6xl: 60px;  --lh-6xl: 64px;

  --fw-extralight: 200;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --fw-black: 900;

  --ls-tighter: -0.02em;
  --ls-tight: -0.01em;
  --ls-normal: 0;
  --ls-wide: 0.02em;
  --ls-wider: 0.08em;
  --ls-widest: 0.16em;

  /* ---- SPACING (base 4px) ---- */
  --sp-0: 0px;
  --sp-0_5: 2px;
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 28px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-20: 80px;
  --sp-24: 96px;
  --sp-28: 112px;
  --sp-32: 128px;

  /* ---- CONTEXTUAL LAYOUT ---- */
  --container-max: 1320px;
  --grid-gap: 24px;
  --header-height: 80px;

  /* ---- RADIUS (forma híbrida) ---- */
  --radius-none: 0px;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-pill: 100px;
  --radius-circle: 50%;

  /* ---- SHADOWS (sutis) ---- */
  --shadow-none: none;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-sm: 0 4px 16px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 12px 32px rgba(0, 0, 0, 0.10);
  --shadow-lg: 0 24px 48px rgba(0, 0, 0, 0.14);
  --shadow-header: 0 2px 12px rgba(0, 0, 0, 0.06);
  --shadow-card-hover: 0 8px 24px rgba(0, 0, 0, 0.10);

  /* ---- Z-INDEX ---- */
  --z-base: 0;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-header: 300;
  --z-overlay: 400;
  --z-modal: 500;
  --z-popover: 600;
  --z-toast: 700;
  --z-tooltip: 800;
  --z-max: 900;

  /* ---- TRANSITIONS ---- */
  --t-fast: 150ms ease;
  --t-base: 200ms ease;
  --t-slow: 300ms ease;
}