/* ============================================================
   DELIVERY24 — Design Tokens
   Shared component DNA across the Athenia suite (Kmarero family).
   White-label: each brand overrides the --brand-* / mood tokens.
   Zero external dependencies. System / self-hostable fonts only.
   ============================================================ */

:root {
  /* ---- Athenia suite constant (integra con el resto de la suite) ---- */
  --gold: #C9A227;
  --gold-soft: rgba(201, 162, 39, 0.12);

  /* ---- Component rhythm (from Athenia tokens) ---- */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;
  --space-12: 48px; --space-16: 64px;

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  --text-xs: 11px; --text-sm: 13px; --text-base: 15px; --text-md: 16px;
  --text-lg: 18px; --text-xl: 21px; --text-2xl: 26px; --text-3xl: 32px;
  --text-4xl: 40px; --text-5xl: 52px;

  --w-regular: 400; --w-medium: 500; --w-semibold: 600; --w-bold: 700; --w-black: 800;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 140ms; --dur-base: 260ms; --dur-slow: 460ms;

  /* Universal body font — reliable everywhere, no CDN */
  --font-system: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;

  /* ---- Default brand (overridden by [data-brand]) ---- */
  --brand: #E0142F;
  --brand-ink: #FF3B54;
  --brand-on: #FFFFFF;
  --brand-accent: #E0142F;
  --brand-soft: rgba(224, 20, 47, 0.12);

  /* mood = light by default; brands may flip to dark */
  --bg: #FBF7F1;
  --surface: #FFFFFF;
  --surface-2: #F4EEE6;
  --surface-3: #ECE4D8;
  --on: #20242B;
  --on-muted: #7C828C;
  --on-faint: #A8AEB8;
  --line: #ECE6DC;
  --line-strong: #DCD4C7;
  --shadow-card: 0 1px 2px rgba(20,24,32,.04), 0 8px 24px rgba(20,24,32,.06);
  --shadow-pop: 0 12px 40px rgba(20,24,32,.16);
  --scrim: rgba(20, 18, 16, 0.55);

  --display: var(--font-system);
  --display-spacing: -0.02em;
  --display-transform: none;
  --display-weight: 800;
}

/* ============================================================
   BRAND SKINS
   ============================================================ */

/* ---- KAMIKAZE · sushi · rojo bermellón sobre negro carbón ---- */
[data-brand="kamikaze"] {
  --brand: #E0142F;
  --brand-ink: #FF4258;
  --brand-on: #FFFFFF;
  --brand-accent: #E0142F;
  --brand-soft: rgba(224, 20, 47, 0.16);

  --bg: #0C0D10;
  --surface: #15171C;
  --surface-2: #1C1F26;
  --surface-3: #262A33;
  --on: #F6F3EE;
  --on-muted: #9DA1AB;
  --on-faint: #6A6E78;
  --line: #262A33;
  --line-strong: #343945;
  --shadow-card: 0 1px 2px rgba(0,0,0,.4), 0 10px 30px rgba(0,0,0,.5);
  --shadow-pop: 0 16px 50px rgba(0,0,0,.6);
  --scrim: rgba(0, 0, 0, 0.62);

  --display: "Futura", "Trebuchet MS", var(--font-system);
  --display-spacing: 0.01em;
  --display-transform: none;
  --display-weight: 700;
}

/* ---- NARIGONI · helados/cafetería · rosa fresa + crema + menta ---- */
[data-brand="narigoni"] {
  --brand: #F25C8A;
  --brand-ink: #D63E6E;
  --brand-on: #FFFFFF;
  --brand-accent: #9FD9C2;
  --brand-soft: rgba(242, 92, 138, 0.14);

  --bg: #FBF5EF;
  --surface: #FFFFFF;
  --surface-2: #F7EFE6;
  --surface-3: #EFE5DA;
  --on: #3A2B33;
  --on-muted: #93838C;
  --on-faint: #BCAEB4;
  --line: #F0E6DB;
  --line-strong: #E4D6C9;
  --shadow-card: 0 1px 2px rgba(58,43,51,.04), 0 10px 26px rgba(58,43,51,.08);
  --shadow-pop: 0 14px 42px rgba(58,43,51,.16);
  --scrim: rgba(58, 43, 51, 0.5);

  --display: "Georgia", "Iowan Old Style", "Times New Roman", serif;
  --display-spacing: -0.01em;
  --display-transform: none;
  --display-weight: 700;
}

/* ---- CHICKEN MAKERS · pollo crujiente · naranja + amarillo sobre crudo ---- */
[data-brand="chicken"] {
  --brand: #E8731F;
  --brand-ink: #C75E12;
  --brand-on: #FFFFFF;
  --brand-accent: #F2B705;
  --brand-soft: rgba(232, 115, 31, 0.14);

  --bg: #FBF2E4;
  --surface: #FFFFFF;
  --surface-2: #FBEFD9;
  --surface-3: #F6E4C5;
  --on: #2A2018;
  --on-muted: #8C7B66;
  --on-faint: #BBA98F;
  --line: #F2E5CF;
  --line-strong: #E8D5B5;
  --shadow-card: 0 1px 2px rgba(42,32,24,.05), 0 10px 26px rgba(42,32,24,.09);
  --shadow-pop: 0 14px 42px rgba(42,32,24,.18);
  --scrim: rgba(42, 32, 24, 0.5);

  --display: "Arial Black", "Arial Bold", var(--font-system);
  --display-spacing: -0.01em;
  --display-transform: uppercase;
  --display-weight: 800;
}
