/* ==========================================================================
   Kytky od potoka - Svatby
   "Svatba na miru" (F5, page-svatba-na-miru.php) - per-page glue. Vetsina
   sekce je 1:1 z designu (pages.css/components.css - .steps, .split,
   .stat-row, .availability, .faq, .gallery-band, .post-grid...), tady jen:
   1) mapovani CF7 markupu svatebniho dotazniku (`.kop-inquiry`) na designove
      tridy (CF7 generuje vlastni obaly, ktere neumime ovlivnit v `_form`),
   2) pár drobnosti stranky (kotva pro scroll, zvyrazneni vybraneho terminu).
   Nacita se JEN na teto strance, AZ ZA calendar.css (viz inc/enqueue.php).
   Zásada: nic, co uz resi wp.css globalne (napr. `.photo > img`), tu
   neduplikujeme.
   ========================================================================== */

/* --- Utility tridy (vzor `.mt-lg`/`.text-center` v components.css - ktere
   NEUPRAVUJEME, viz zasada v hlavicce) - nahrazuji inline `style="..."`
   atributy v page-svatba-na-miru.php (karty "Vas termin"/"Denni kapacita" a
   `.section-head` uvnitr `.feature-strap` v portfolio/blog bandu). Zadny
   vizualni rozdil oproti puvodnimu inline zapisu. --- */
.text-note { color: var(--c-muted); font-size: 0.9rem; }
.text-strong { color: var(--c-text); }
.mb-0 { margin-bottom: 0; }

/* --- Kotvy pro klik na "Vyplnit dotaznik"/"Zjistit volne terminy" v hero
   a pro odkaz z karty "Vas termin" - bez tohohle by cil zajel pod sticky
   `.site-header` (base.css, min-height 72px + padding). Stejny odsazovaci
   rozmer jako `.checkout-grid__aside` v checkout.css. Cilime na vlastni
   tridu (`.scroll-anchor`), NE na `#terminy`/`#dotaznik` - ty ID vlastnime
   (jsou to nase vlastni sekce, viz page-svatba-na-miru.php), takze pro ne
   neplati vyjimka pro plugin markup, a ID selektor v CSS proto nepouzivame. */
.scroll-anchor {
  scroll-margin-top: calc(88px + var(--space-md));
}

/* --- Vybrany termin v karte "Vas termin" (`[data-date-echo]`, viz
   assets/js/kop-svatba.js) - jakmile se vyplni, at je vic videt nez
   okolni text "Vybrany den:". --- */
[data-date-echo] {
  font-weight: 600;
  color: var(--c-accent-deep);
}

/* ==========================================================================
   Svatebni dotaznik (`.card.kop-inquiry` > CF7 shortcode [contact-form-7],
   viz page-svatba-na-miru.php + obsah stranky). CF7 kolem kazdeho tagu
   generuje vlastni obaly (`.wpcf7-form-control-wrap`, `.wpcf7-list-item`...),
   ktere v `_form` neovlivnime - mapujeme je tady na designove komponenty
   z pages.css (`.form-grid`/`.form-field`/`.choice*`/`.input`...).
   ========================================================================== */

/* Obal kazdeho CF7 tagu je `<span>` (`.wpcf7-form-control-wrap{position:
   relative}` z includes/css/styles.css, jinak inline) - na blok, at se
   spravne zalomi hint/chybova hlaska pod pole. */
.kop-inquiry .wpcf7-form-control-wrap { display: block; }
/* Samotne input/select/textarea uz maji `class:input`/`class:select`/
   `class:textarea` primo v `_form` (viz sekce 6 F5 planu), takze je stylu
   pages.css `.input,.select,.textarea{width:100%}` uz chytaji - tohle je
   jen dodatecne pojisteni, kdyby nekdy tag o tridu prisel. */
.kop-inquiry .wpcf7-form-control-wrap input,
.kop-inquiry .wpcf7-form-control-wrap select,
.kop-inquiry .wpcf7-form-control-wrap textarea {
  width: 100%;
}

/* --- Hvezdicka u radio skupin ("Styl svatby", "Zajem o osobni konzultaci").
   CF7 6.x dela z KAZDEHO [radio] fakticky povinne pole bez ohledu na
   hvezdicku v definici (plugins/contact-form-7/modules/checkbox.php:
   `if ( $tag->is_required() or 'radio' === $tag->type )`) - zjisteno realnym
   odeslanim pri review F5, kdy obe skupiny blokovaly odeslani hlaskou
   "Toto pole je povinne.", i kdyz v `_form` hvezdicka nebyla. Aby to
   uzivatel vedel predem, doplnili jsme hvezdicku primo do obou `<legend>`
   v `_form` (stejny tvar jako u "Jmeno"/"E-mail":
   `<span class="req" aria-hidden="true">*</span>`) - tady jen vzhled,
   stejny jako `.form-label .req` v pages.css. --- */
.kop-inquiry .fieldset-legend .req { color: var(--c-accent-deep); }

/* --- Radio/checkbox "pilulky" (styl svatby, barvy, konzultace) - CF7 markup
   (s `use_label_element`): `.wpcf7-list-item > label > input + span.wpcf7-
   -list-item-label`. Mapovano na vzhled `.choice`/`.choice__label` z
   pages.css beze zmeny tehle tridy. --- */
.kop-inquiry .wpcf7-radio,
.kop-inquiry .wpcf7-checkbox {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
/* `.wpcf7-list-item` -> `.choice` (CF7 default `display:inline-block;
   margin:0 0 0 1em`, viz includes/css/styles.css - rusime odsazeni, pozice
   je referencni bod pro absolutne umisteny input nize). */
.kop-inquiry .wpcf7-list-item {
  position: relative;
  margin: 0;
}
.kop-inquiry .wpcf7-list-item label {
  display: block;
  cursor: pointer;
}
/* Samotny input schovany (jako `.choice input`), ale porad focusovatelny -
   pokryva celou plochu `.wpcf7-list-item` (viz position:relative vyse). */
.kop-inquiry .wpcf7-list-item input[type="radio"],
.kop-inquiry .wpcf7-list-item input[type="checkbox"] {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
/* `.wpcf7-list-item-label` -> vzhled `.choice__label` (pilulka). */
.kop-inquiry .wpcf7-list-item-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0.9rem;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-pill);
  background: var(--c-surface);
  font-size: 0.9rem;
  color: var(--c-text);
  transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}
.kop-inquiry .wpcf7-list-item-label:hover { border-color: var(--c-accent); }
.kop-inquiry .wpcf7-list-item input:checked + .wpcf7-list-item-label {
  border-color: var(--c-accent-deep);
  background: var(--c-blush-wash);
  color: var(--c-primary-ink);
  font-weight: 600;
}
.kop-inquiry .wpcf7-list-item input:focus-visible + .wpcf7-list-item-label {
  outline: 2px solid var(--c-primary);
  outline-offset: 2px;
}

/* --- Barevne vzorky u pole "Barvy a paleta" (`[checkbox barvy ...]`, viz
   sekce 6 F5 planu - hodnoty CF7 tagu = ceske popisky). Kruh 15px pred
   textem pilulky, stejne rozmery jako `.swatch` v pages.css (tam je to
   samostatny `<span>`, tady jde o `::before` - CF7 nam nedovoli vlastni
   vnitrni markup). Scopovano na `data-name="barvy"` (CF7 dava na
   `.wpcf7-form-control-wrap`), at nekoliduje s pripadnymi shodnymi hodnotami
   v jinych polich. --- */
.kop-inquiry .wpcf7-form-control-wrap[data-name="barvy"] .wpcf7-list-item-label::before {
  content: "";
  width: 15px;
  height: 15px;
  flex: none;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.12);
}
/* Ctyri z sesti presne odpovidaji existujicim tokenum (tokens.css) - pouzity
   primo misto natvrdo zapsaneho hexu. Zbyle dva (Bila a ivory, Jemne pastely)
   zadny token nema presnou shodu (nejblizsi jsou --c-bg #F7F3EE a
   --c-gold-soft #E7D8B8 - jiny odstin), takze zustava hex primo z navrhu. */
.kop-inquiry .wpcf7-form-control-wrap[data-name="barvy"] input[value="Pudrová / blush"] + .wpcf7-list-item-label::before { background: var(--c-accent); } /* #C98B86 */
.kop-inquiry .wpcf7-form-control-wrap[data-name="barvy"] input[value="Švestková"] + .wpcf7-list-item-label::before { background: var(--c-primary); } /* #5E2A52 */
.kop-inquiry .wpcf7-form-control-wrap[data-name="barvy"] input[value="Bílá a ivory"] + .wpcf7-list-item-label::before { background: #F3EADA; } /* zadny token neodpovida presne */
.kop-inquiry .wpcf7-form-control-wrap[data-name="barvy"] input[value="Šalvějová zeleň"] + .wpcf7-list-item-label::before { background: var(--c-botanical); } /* #7FA66B */
.kop-inquiry .wpcf7-form-control-wrap[data-name="barvy"] input[value="Zlatá / šampaň"] + .wpcf7-list-item-label::before { background: var(--c-gold); } /* #C9A96A */
.kop-inquiry .wpcf7-form-control-wrap[data-name="barvy"] input[value="Jemné pastely"] + .wpcf7-list-item-label::before { background: #EAD8CF; } /* zadny token neodpovida presne */

/* --- Validace: chybova hlaska u pole (`.wpcf7-not-valid-tip`, CF7 default
   barva #dc3232/1em - includes/css/styles.css, 1 trida). --- */
.kop-inquiry .wpcf7-not-valid-tip {
  display: block;
  margin-top: 0.3rem;
  color: var(--c-accent-deep);
  font-size: 0.8rem;
  font-weight: 400;
}

/* --- Souhrnna hlaska po odeslani (`.wpcf7-response-output`) - CF7 default
   (`.wpcf7 form .wpcf7-response-output` + stavove `.wpcf7 form.sent/...`,
   viz includes/css/styles.css) ma vyssi "tvar" (typ `form` navic), proto
   nase selektory drzi aspon stejny pocet trid (`.kop-inquiry`+`.wpcf7-form`
   navic), aby vyhraly bez ohledu na poradi/typ. --- */
.kop-inquiry .wpcf7-form .wpcf7-response-output {
  margin: var(--space-md) 0 0;
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  background: var(--c-surface-2);
  color: var(--c-text);
  font-size: 0.92rem;
}
.kop-inquiry .wpcf7-form.sent .wpcf7-response-output {
  border-color: color-mix(in oklab, var(--c-success) 45%, transparent);
  background: color-mix(in oklab, var(--c-success) 12%, var(--c-surface));
}
.kop-inquiry .wpcf7-form.invalid .wpcf7-response-output,
.kop-inquiry .wpcf7-form.unaccepted .wpcf7-response-output,
.kop-inquiry .wpcf7-form.failed .wpcf7-response-output,
.kop-inquiry .wpcf7-form.aborted .wpcf7-response-output,
.kop-inquiry .wpcf7-form.spam .wpcf7-response-output,
.kop-inquiry .wpcf7-form.payment-required .wpcf7-response-output {
  border-color: color-mix(in oklab, var(--c-error) 40%, transparent);
  background: color-mix(in oklab, var(--c-error) 10%, var(--c-surface));
}

/* --- Cloudflare Turnstile (plugin simple-cloudflare-turnstile,
   cfturnstile_cf7_all=on) vklada svuj widget primo pred [submit] (viz
   inc/integrations/forms/contact-form-7.php: cfturnstile_field_cf7()),
   tedy dovnitr naseho `.stack-cta`. Appearance je "interaction-only", widget
   je tedy vetsinou prazdny (0px) a zvetsi se jen, kdyz Cloudflare vyzada
   interakci - `:not(:empty)` rezervuje misto jen tehdy, at se stranka
   neposkakuje, ale v klidovem stavu nezustava trvala mezera. Plugin do
   `.cf7-cf-turnstile` vklada inline `style="margin-top:0;margin-bottom:
   -15px"` - to bez `!important` (zakazano) prebit nejde, necha se puvodni. */
.kop-inquiry .stack-cta .cf7-cf-turnstile {
  flex-basis: 100%;
  width: 100%;
}
.kop-inquiry .cf-turnstile:not(:empty) {
  min-height: 65px;
  margin-bottom: var(--space-sm);
}