/* TinyLand: baza temei, pe toate paginile.
   1. Tokenii din design_handoff_homepage_foto/tokens.css (mobil, cu suprascrieri de la 1025 px), neschimbați.
      Montserrat vine din temă (assets/fonts/), nu din Elementor sau Google.
   2. CSS-ul de bază din handoff („CSS în tema copil”): ce nu se poate seta din Elementor gratuit. */

:root {
  /* Brand */
  --tl-navy: #2F3542;          /* text, titluri pe deschis, butoane contur, zile alese */
  --tl-navy-hover: #252A35;
  --tl-gold: #C9A45F;          /* doar pe fundal închis (pe alb are 2,3:1) */
  --tl-gold-ink: #7E5F27;      /* auriu pentru text și iconițe pe fundal deschis */
  --tl-wa: #2A8069;            /* numai acțiunile WhatsApp */
  --tl-wa-hover: #22695A;

  /* Neutre */
  --tl-paper: #F7F5F1;         /* fundalul paginii */
  --tl-white: #FFFFFF;
  --tl-stone: #EEEBE5;         /* fundal Întrebări, comutator căsuță */
  --tl-line: #DCD7CE;
  --tl-muted: #5E6470;         /* text secundar pe deschis */
  --tl-night: #1F242C;         /* hero, galerie, căsuțe, voucher, footer */
  --tl-on-dark: #C5CAD3;       /* text secundar pe Noapte */
  --tl-on-photo: #E4E6EA;
  --tl-line-dark: #3D4452;

  /* Ecran complet (galerie) */
  --tl-lightbox: #0F1216;
  --tl-lightbox-btn: #262B33;

  /* Calendar */
  --tl-cal-booked: #E6E3DE;
  --tl-cal-booked-ink: #8A867E;
  --tl-cal-range: #E4E6EA;
  --tl-cal-free-border: #E2DED6;
  --tl-cal-past-ink: #BDB9B2;
  --tl-cal-sel-price: #D5D8DE;
  --tl-cal-legend-border: #CFCAC1;

  /* Tipografie — mobil */
  --tl-font: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --tl-h1: 36px;        --tl-h1-lh: 1.08;   --tl-h1-ls: -0.02em;
  --tl-h2: 28px;        --tl-h2-lh: 1.12;   --tl-h2-ls: -0.015em;
  --tl-h3-card: 28px;   --tl-h3-card-lh: 1.1;
  --tl-h3: 21px;        --tl-h3-lh: 1.2;
  --tl-lead: 16px;      --tl-lead-lh: 1.6;
  --tl-body: 16px;      --tl-body-lh: 1.6;
  --tl-card-text: 15px;
  --tl-note: 13px;
  --tl-eyebrow: 12px;   --tl-eyebrow-ls: 0.14em;
  --tl-button: 16px;
  --tl-price: 32px;
  --tl-logo: 20px;

  /* Spațiere — mobil */
  --tl-gutter: 20px;
  --tl-section-y: 64px;
  --tl-head-gap: 28px;         /* antet secțiune → conținut */
  --tl-container: 1280px;      /* cu --tl-gutter lateral → 1200 px util */
  --tl-tap: 44px;

  /* Colțuri, umbre */
  --tl-r-sm: 4px;              /* butoane, zile */
  --tl-r-toggle: 6px;
  --tl-r-md: 8px;              /* card calendar, hartă */
  --tl-r-full: 999px;
  --tl-shadow-toggle: 0 1px 2px rgba(31, 36, 44, 0.16);
  --tl-shadow-bar: 0 -8px 24px rgba(31, 36, 44, 0.10);
  --tl-focus: 0 0 0 2px #FFFFFF, 0 0 0 4px #2F3542;
}

@media (min-width: 1025px) {
  :root {
    --tl-h1: 64px;  --tl-h1-lh: 1.04;
    --tl-h2: 44px;
    --tl-h3-card: 36px;
    --tl-h3: 26px;
    --tl-lead: 19px;
    --tl-note: 14px;
    --tl-price: 40px;
    --tl-logo: 22px;
    --tl-gutter: 40px;
    --tl-section-y: 112px;
    --tl-head-gap: 48px;
  }
}

/* ───────── Baza (handoff, „CSS în tema copil”) ───────── */

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  font-family: var(--tl-font);
  color: var(--tl-navy);
  background-color: var(--tl-paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Câmpurile și butoanele iau fontul paginii (Astra le pune fontul sistemului). */
button, input, select, textarea { font-family: inherit; }

h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }

a:focus-visible,
button:focus-visible {
  outline: none;
  box-shadow: var(--tl-focus);
}

/* Pagina nu se derulează cât e deschis meniul de pe telefon sau ecranul complet al galeriei (pus din JS). */
html.tl-blocat,
html.tl-blocat body { overflow: hidden; }

/* Bannerul de cookie-uri (snippetul WPCode 1338) setează butoanelor secundare doar fundalul deschis (#f7f7f7), iar Astra pune
   button{color:#fff}: „Doar necesare”, „Setări”, „Înapoi” ieșeau alb pe alb (17 oct). Refuzul trebuie să se vadă la fel de bine
   ca acordul. Butonul principal (.primary) rămâne alb pe negru. */
#cookie-banner button:not(.primary),
#cookie-banner button:not(.primary):hover,
#cookie-banner button:not(.primary):focus { color: #111; }
