/*
 * Băiatul cu Imprimanta — tokeni de design (v1, 2026-10-21)
 *
 * Variabile CSS simple, fără dependențe. Le folosesc site-ul (Astro) și configuratorul lămpii (worker separat).
 * Copie publică, mereu la zi: https://baiatulcuimprimanta.ro/staging/tokens.css
 * Fonturi (Google Fonts):
 *   https://fonts.googleapis.com/css2?family=Archivo+Black&family=Nunito+Sans:wght@400;700;800&display=swap
 * Documentație: docs/design-system.md
 */
:root {
  /* ---- Culori de brand ---- */
  --bci-orange: #e8862a; /* șapca: fundaluri, butoane principale (cu text închis) */
  --bci-orange-hover: #f0953f;
  --bci-orange-soft: #fbe3c8; /* fundal pentru note și evidențieri */
  --bci-orange-text: #a5520f; /* portocaliu pentru TEXT pe crem (4,7:1) */
  --bci-ink: #1c2522; /* negru-verzui: text, contururi, umbre */
  --bci-ink-2: #2a332f; /* suprafețe închise (footer, imprimanta din ilustrații) */
  --bci-cream: #f2ede4; /* fundalul paginii */

  /* ---- Neutre ---- */
  --bci-cream-deep: #e8dfd0; /* secțiuni alternate */
  --bci-paper: #fbf8f3; /* carduri, panouri */
  --bci-white: #ffffff; /* câmpuri de formular */
  --bci-line: #d9cfbf; /* separatoare fine */
  --bci-text: var(--bci-ink);
  --bci-text-soft: #4a524e; /* text secundar (6,9:1) */
  --bci-text-muted: #5d625f; /* note, etichete mici (5,3:1) */
  --bci-text-on-dark: var(--bci-cream);

  /* ---- Stări ---- */
  --bci-success: #128040; /* și butonul WhatsApp (text alb 5,0:1) */
  --bci-success-hover: #0e6a35;
  --bci-success-soft: #e3f3e8;
  --bci-error: #b3261e;
  --bci-error-soft: #fdecea;
  --bci-warning: var(--bci-orange-text);
  --bci-warning-soft: var(--bci-orange-soft);
  --bci-focus: var(--bci-orange); /* conturul de focus (3 px) */

  /* ---- Tipografie ---- */
  --bci-font-display: 'Archivo Black', 'Arial Black', system-ui, sans-serif; /* titluri, butoane, prețuri */
  --bci-font-body: 'Nunito Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --bci-text-xs: 0.8125rem; /* 13 px: badge-uri, etichete */
  --bci-text-sm: 0.9375rem; /* 15 px: note, text secundar */
  --bci-text-base: 1.0625rem; /* 17 px: corp */
  --bci-text-lg: 1.1875rem; /* 19 px: lead */
  --bci-text-xl: 1.375rem; /* 22 px: titluri de card */
  --bci-text-2xl: clamp(1.5rem, 4.5vw, 2rem); /* titluri de secțiune mici */
  --bci-text-3xl: clamp(1.9rem, 6vw, 2.75rem); /* titluri de secțiune */
  --bci-text-4xl: clamp(2.3rem, 8.5vw, 4rem); /* titlul paginii */
  --bci-leading-tight: 1.05;
  --bci-leading-snug: 1.3;
  --bci-leading: 1.6;
  --bci-tracking-display: -0.01em;
  --bci-tracking-caps: 0.08em; /* etichete cu majuscule */

  /* ---- Spațiere (grilă de 4 px) ---- */
  --bci-space-1: 4px;
  --bci-space-2: 8px;
  --bci-space-3: 12px;
  --bci-space-4: 16px;
  --bci-space-5: 20px;
  --bci-space-6: 24px;
  --bci-space-8: 32px;
  --bci-space-10: 40px;
  --bci-space-12: 48px;
  --bci-space-16: 64px;
  --bci-space-20: 80px;
  --bci-section: clamp(48px, 9vw, 96px); /* spațiul vertical dintre secțiuni */
  --bci-gutter: 16px; /* marginea laterală pe mobil */
  --bci-wrap: 1120px; /* lățimea maximă a conținutului */

  /* ---- Forme ---- */
  --bci-border: 2.5px; /* contur standard */
  --bci-border-strong: 3px; /* butoane, logo */
  --bci-radius-sm: 10px;
  --bci-radius-md: 14px;
  --bci-radius-lg: 20px;
  --bci-radius-pill: 999px;

  /* ---- Umbre: „printate”, dure, fără blur ---- */
  --bci-shadow-sm: 0 3px 0 var(--bci-ink);
  --bci-shadow-md: 0 5px 0 var(--bci-ink);
  --bci-shadow-lg: 0 8px 0 var(--bci-ink);
  --bci-shadow-float: 0 10px 30px rgba(28, 37, 34, 0.2); /* doar pentru toast-uri și meniuri */

  /* ---- Controale ---- */
  --bci-touch: 44px; /* ținta minimă de atingere */
  --bci-control-h: 52px; /* butoane și câmpuri */

  /* ---- Mișcare ---- */
  --bci-dur-fast: 120ms;
  --bci-dur: 220ms;
  --bci-ease: cubic-bezier(0.2, 0.9, 0.3, 1.15);

  /* ---- Straturi ---- */
  --bci-z-header: 50;
  --bci-z-sticky: 60;
  --bci-z-toast: 100;
}