/*
====================================================
NÉV: Karácsony Most (karacsonymost.hu) brand design tokenek
PROJEKT: Occasion Engine
TÍPUS: CSS – site-szintű brand tokenek (site.theme_key = "christmas")
VERZIÓ: v1.0.0-handoff
UTOLSÓ FRISSÍTÉS: 2026-09-30
LEÍRÁS: Az állandó, egész éves Karácsony Most brand tokenjei.
        Kiválasztás: <html data-theme="{site.theme_key}"> (SiteLayout már így renderel).
        A közös komponens-CSS (karacsony.components.css) KIZÁRÓLAG ezekre a
        token-nevekre hivatkozik. Más brand saját fájlt kap ugyanezekkel a nevekkel.
        Nincs szezonális vagy dátumfüggő theme-váltás.
        Töréspontok (media queryben nem lehet változó, ezért itt dokumentálva):
          sm  = 640px   (tablet-tól)
          md  = 1024px  (desktop-tól)
          lg  = 1280px  (széles desktop)
CHANGELOG: v1.0.0 - 2026-09-30 - Handoff: komponens-tokenek, z-index, layout, szövegszínek
           v0.2.0 - 2026-09-30 - Site-szintű, állandó brand; selector: christmas
           v0.1.0 - 2026-09-30 - Első verzió
====================================================
*/
[data-theme="christmas"] {
  color-scheme: light;

  /* ---------- Szín: alap ---------- */
  --c-paper: #F6F1E9;          /* oldalalap */
  --c-snow: #FFFCF7;           /* kártya, panel, mező */
  --c-ink: #1B1916;            /* elsődleges szöveg – 15.9:1 papíron */
  --c-ink-2: #57504A;          /* másodlagos szöveg – 7.1:1 papíron */
  --c-line: #E4DACB;           /* kártyakeret, elválasztó (dekor) */
  --c-line-2: #D3C5AF;         /* mező-, chip-, ghost gomb keret */

  /* ---------- Szín: brand ---------- */
  --c-brand: #133A2F;          /* fenyő – elsődleges gomb, sötét sáv; fehér szöveggel 12:1 */
  --c-brand-hover: #0F3027;
  --c-brand-deep: #0C2A22;     /* lábléc, overlay alap */
  --c-brand-soft: #E3ECE6;     /* eltávolítható chip, csempe */
  --c-accent: #E8A33D;         /* gyertya – fókusz-halo, sötét alapú CTA, szikra */
  --c-accent-hover: #DA9530;
  --c-accent-soft: #F6E6C6;    /* info-pill, visszaszámláló, összár-doboz */
  --c-accent-ink: #7A4E0E;     /* akcent szövegként világos alapon – 6.2:1 */
  --c-berry: #9B2C3A;          /* ritka jel: szalag, szikra – soha nem felület/gomb */
  --c-berry-soft: #F3E1E0;

  /* ---------- Szín: állapot ---------- */
  --c-error: #A1352B;
  --c-error-soft: #F3E1E0;
  --c-success: #2F6B4F;
  --c-noimg: #EFE7DA;          /* kép nélküli ajánlat csempe */
  --c-skeleton: #ECE3D5;
  --c-overlay: rgba(12, 42, 34, .45);   /* bottom sheet / menü háttér */
  --c-on-dark: #FFFFFF;
  --c-on-dark-2: rgba(255, 255, 255, .80);
  --c-on-dark-3: rgba(255, 255, 255, .58);
  --c-on-dark-line: rgba(255, 255, 255, .22);

  /* Termékcsempe tónusok – kategória-slug hash alapján (lásd handoff 6.1) */
  --c-tile-1: #EADFCF; --c-tile-2: #E1E8E2; --c-tile-3: #EEE0DC;
  --c-tile-4: #E4E3EC; --c-tile-5: #E7E4DD; --c-tile-6: #F6E6C6;
  /* Célcsoport-csempe tónusok – facet.sort_order sorrendjében ismétlődnek */
  --c-aud-1: #F3E1E0; --c-aud-2: #E3ECE6; --c-aud-3: #F6E6C6;
  --c-aud-4: #E4E3EC; --c-aud-5: #EFE7DA; --c-aud-6: #E1E8E2;

  /* ---------- Tipográfia ---------- */
  --f-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --f-text: 'Figtree', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --fs-display: clamp(2.75rem, 1.55rem + 4.7vw, 5rem);    /* 44 → 80 */
  --fs-h1: clamp(2.125rem, 1.45rem + 2.7vw, 3.75rem);     /* 34 → 60 */
  --fs-h1-page: clamp(2rem, 1.5rem + 2vw, 3.5rem);        /* 32 → 56 (kereső) */
  --fs-h2: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem);        /* 28 → 40 */
  --fs-h3: clamp(1.375rem, 1.2rem + .7vw, 2rem);          /* 22 → 32 (csomagcím) */
  --fs-h4: clamp(1.25rem, 1.15rem + .4vw, 1.5rem);        /* 20 → 24 (top pick cím) */
  --fs-card-title: 1.25rem;    /* 20 – rácskártya */
  --fs-row-title: 1.0625rem;   /* 17 – sorkártya */
  --fs-lead: clamp(1.0625rem, 1rem + .35vw, 1.25rem);     /* 17 → 20 */
  --fs-body: clamp(1rem, .97rem + .15vw, 1.0625rem);      /* 16 → 17 */
  --fs-prose: clamp(1.03rem, 1rem + .15vw, 1.09rem);      /* 16.5 → 17.5 (landing body) */
  --fs-ui: 1rem;               /* 16 – gomb, mező */
  --fs-ui-sm: .9375rem;        /* 15 – chip, sm gomb */
  --fs-small: .875rem;         /* 14 */
  --fs-micro: .78125rem;       /* 12.5 – eyebrow, frissesség */
  --fs-price: 1.1875rem;       /* 19 */
  --fs-price-sm: 1.0625rem;    /* 17 */

  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
  --lh-display: .98; --lh-tight: 1.05; --lh-heading: 1.15; --lh-card: 1.22;
  --lh-ui: 1.2; --lh-body: 1.6; --lh-prose: 1.7;
  --ls-display: -0.028em; --ls-h1: -0.022em; --ls-h2: -0.018em; --ls-eyebrow: 0.09em;

  /* ---------- Tér (4-es alap) ---------- */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;
  --section-gap: clamp(56px, 2.5rem + 3.5vw, 96px);   /* szekciók között */
  --section-gap-tight: clamp(40px, 2rem + 2.5vw, 80px);
  --stack-head: clamp(18px, 1rem + .6vw, 28px);       /* szekciófej → tartalom */
  --gutter: clamp(12px, .5rem + 1vw, 24px);           /* rács gap */
  --page-margin: clamp(16px, 4vw, 40px);              /* oldalmargó */
  --content-max: 1200px;
  --prose-max: 700px;
  --measure: 68ch;
  --header-h: 60px;            /* md-től 76px – components.css kezeli */

  /* ---------- Forma ---------- */
  --r-xs: 8px; --r-sm: 12px; --r-md: 18px; --r-lg: 24px; --r-xl: 28px; --r-pill: 999px;
  --bw: 1px; --bw-field: 1.5px;
  --shadow-raise: 0 1px 2px rgba(27,25,22,.06), 0 10px 28px rgba(27,25,22,.08);
  --shadow-pop: 0 10px 30px rgba(27,25,22,.18);
  --shadow-sticky: 0 1px 0 var(--c-line);

  /* ---------- Komponens-tokenek ---------- */
  --btn-h: 48px; --btn-h-sm: 40px; --btn-h-lg: 56px;
  --btn-px: 24px; --btn-px-sm: 16px; --btn-px-lg: 30px;
  --chip-h: 40px; --chip-h-touch: 44px; --chip-px: 16px;
  --field-h: 52px; --field-h-sm: 48px;
  --card-pad: 16px 18px 18px;
  --card-media-ratio: 4 / 3;
  --card-media-pad: 16px;        /* partnerkép belső margó a csempén */
  --row-thumb: 104px;            /* mobil sorkártya bélyegkép (320px-en 88px) */
  --bundle-thumb: 80px;          /* mobilon 64px */
  --icon-sm: 16px; --icon: 20px; --icon-lg: 24px;
  --tap-min: 44px;

  /* ---------- Interakció ---------- */
  --focus-outline: 2px solid var(--c-brand);
  --focus-offset: 2px;
  --focus-halo: 0 0 0 6px rgba(232,163,61,.45);
  --focus-outline-dark: 2px solid var(--c-accent);
  --focus-halo-dark: 0 0 0 6px rgba(255,255,255,.28);
  --hover-lift: translateY(-2px);
  --dur-fast: 120ms; --dur: 180ms; --dur-slow: 260ms;
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-sheet: cubic-bezier(.2,.8,.2,1);

  /* ---------- Rétegek ---------- */
  --z-sticky: 20; --z-header: 30; --z-sheet: 40; --z-popover: 50;
}

@media (prefers-reduced-motion: reduce) {
  [data-theme="christmas"] { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; --hover-lift: none; }
}