/* Etapa 5, Task 1: typografie a tvary AB v košíku (blok woocommerce/cart).
   Do markupu bloku se nesahá, jen CSS na třídy, které generuje WooCommerce
   (ověřeno živě Playwright outerHTML na naplněném košíku 5. 9. 2026 - viz
   task-1-report.md). Soubor se enqueuje jen na is_cart()||is_checkout()
   (functions.php, sekce "Etapa 5"), pokladna (Task 2) sem přidává vlastní
   sekci níž.

   Vše scopováno tělem stránky (.woocommerce-cart), aby se pravidla po
   Tasku 2 (pokladna, .woocommerce-checkout) nepřekrývala. */

/* Položky košíku jako karty AB: bílá, linka tokenu, sražený roh 9 px.
   <tr> nemůže mít margin (tabulkový box model), proto mezeru mezi
   "kartami" dělá border-spacing na tabulce (0 = beze mezery mezi
   sloupci, 12px = mezera mezi řádky). */
.woocommerce-cart table.wc-block-cart-items{
  border-collapse:separate;border-spacing:0 12px}
.woocommerce-cart tr.wc-block-cart-items__row{
  background:#fff;border:1px solid var(--wp--preset--color--linka,#E1E2E5);
  clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
    calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px)}
.woocommerce-cart td.wc-block-cart-item__image{padding-left:16px}
.woocommerce-cart td.wc-block-cart-item__total{padding-right:16px}

/* Název položky 16 px Barlow (dnes 14 px). */
.woocommerce-cart .wc-block-components-product-name{
  font:400 16px/1.3 var(--wp--preset--font-family--text,Barlow);
  color:var(--wp--preset--color--inkoust,#0A0A0C)}

/* Cena celkem řádku 22 px Big Shoulders (stejný jazyk jako karta výpisu,
   viz mlv-vypis.css) - jednotková cena pod názvem zůstává drobným
   doplňkovým údajem, ne hlavní částkou řádku. */
.woocommerce-cart .wc-block-cart-item__total .wc-block-components-product-price__value{
  font:800 22px/1 var(--wp--preset--font-family--nadpis,"Big Shoulders");
  color:var(--wp--preset--color--inkoust,#0A0A0C)}
.woocommerce-cart .wc-block-cart-item__prices .wc-block-components-product-price__value{
  font:400 14px/1.3 var(--wp--preset--font-family--text,Barlow);
  color:var(--wp--preset--color--sediva,#4E4E52)}

/* border-radius:0 na všech blocích Woo v košíku (dnes 4 kulaté prvky:
   miniatura viz níž je už 0, selektor domain výslovně požadovaný
   brief - vstupy množství a systémové hlášení typu "minimální hodnota
   objednávky"). */
.woocommerce-cart .wc-block-cart-item__image img,
.woocommerce-cart .wc-block-components-quantity-selector,
.woocommerce-cart .wc-block-components-quantity-selector *,
.woocommerce-cart .wc-block-components-notice-banner,
.woocommerce-cart .wc-block-components-notice-banner *{border-radius:0}

/* Souhrn vpravo ("Celkem k platbě"): popisky a hodnoty 16 px, celková
   částka (Odhadovaný součet) zvýrazněná 24 px Big Shoulders. */
.woocommerce-cart .wc-block-components-totals-item__label,
.woocommerce-cart .wc-block-components-totals-item__value{
  font-size:16px;font-family:var(--wp--preset--font-family--text,Barlow)}
.woocommerce-cart .wc-block-components-totals-footer-item-tax-value{
  font:800 24px/1 var(--wp--preset--font-family--nadpis,"Big Shoulders");
  color:var(--wp--preset--color--inkoust,#0A0A0C)}

/* Tlačítko "Pokračujte k pokladně": červená výplň tokenu, sražený roh
   9 px - stejná konstrukce jako CTA na detailu (mlv-detail.css). Dnes
   černé (dědí výchozí wp-element-button), bez clip-path. */
.woocommerce-cart .wc-block-cart__submit-button{
  background:var(--wp--preset--color--cervena,#E00103);color:#fff;
  border-radius:0;
  clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
    calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px)}
.woocommerce-cart .wc-block-cart__submit-button:hover,
.woocommerce-cart .wc-block-cart__submit-button:focus-visible{
  background:var(--wp--preset--color--inkoust,#0A0A0C)}


/* ============================================================
   Etapa 5, Task 2: pokladna (blok woocommerce/checkout) ve stylu AB.
   Scope tělem stránky (.woocommerce-checkout), aby se pravidla
   nepřekrývala s košíkem výš (.woocommerce-cart). Do markupu bloku se
   nesahá, jen CSS na třídy generované WooCommerce Blocks (ověřeno živě
   Playwright outerHTML na naplněné pokladně 5. 9. 2026 - viz
   task-2-report.md). Logika kroků, DPH, dopravy a plateb se nemění -
   přepínače zůstávají skutečnými <input type="radio">/<select>, jen
   jinak vykreslenými; po nasazení ověřeno funkčně (klik + checked,
   přepočet částky), viz zmer-kosik.py::kontrola_prepinace_dopravy_a_platby. */

/* Žádný border-radius nikde v pokladně (dnes 26 kulatých prvků: chybové
   hlášení o minimu objednávky + jeho ikona, všechny vstupy vč.
   checkboxu a radiobuttonů, karta adresy, select země, karty dopravy/
   platby, karta souhrnu objednávky, odznak počtu kusů u položky). */
.woocommerce-checkout .wc-block-components-notice-banner,
.woocommerce-checkout .wc-block-components-notice-banner svg,
.woocommerce-checkout .wc-block-components-address-card,
.woocommerce-checkout .wc-blocks-components-select__container,
.woocommerce-checkout .wc-blocks-components-select__select,
.woocommerce-checkout .wc-block-components-radio-control__option,
.woocommerce-checkout .wc-block-components-radio-control-accordion-option,
.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block,
.woocommerce-checkout .wc-block-components-order-summary-item__quantity{
  border-radius:0}

/* Vstupy (text, radio) mají vlastní pravidlo s !important: WC Blocks
   jim radius 4 px/50 % vnucuje pravidlem se stejnou specificitou jako
   výš (třída + tag), které v kaskádě drží navrch pořadím enqueue (WC
   styl se načte až po našem) - ověřeno na živém běhu, prostý výběr bez
   !important je nepřebil. Checkbox NENÍ součástí - jeho vlastní
   pravidlo ve WC Blocks má vyšší specificitu, řeší se zvlášť níž
   zrcadlením tříd, beze !important (review ověřilo živě). */
.woocommerce-checkout input{border-radius:0 !important}

/* Checkbox: WC Blocks pravidlo `.wc-block-components-checkbox
   .wc-block-components-checkbox__input[type="checkbox"]` má VYŠŠÍ
   specificitu než prostý výběr `input` výš - zrcadlením stejných tříd
   (plus náš scope .woocommerce-checkout navrch) specificitu přebijeme
   a !important není potřeba - ověřeno živě. */
.woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]{
  border-radius:0}

/* Formulářová pole hranatá s linkou tokenu (dnes tenký téměř černý
   poloprůhledný okraj) - text/e-mail/telefon i select země. !important
   ze stejného důvodu jako radius vstupů výš - stejná specificita, drží
   to jen pořadí enqueue (WC Blocks pravidlo se v kaskádě řadí za nás). */
.woocommerce-checkout .wc-block-components-text-input input,
.woocommerce-checkout .wc-blocks-components-select__select{
  border-color:var(--wp--preset--color--linka,#E1E2E5) !important;
  background:#fff}

/* Focus: 2 px červený obrys tokenu (dnes tmavý výchozí prohlížečový
   obrys) - stejná konstrukce jako swatch/posuvník jinde na webu, viz
   mlv-color-swatches.css, mlv-vypis.css. */
.woocommerce-checkout .wc-block-components-text-input input:focus-visible,
.woocommerce-checkout .wc-blocks-components-select__select:focus-visible,
.woocommerce-checkout .wc-block-components-checkbox__input:focus-visible,
.woocommerce-checkout .wc-block-components-radio-control__input:focus-visible{
  outline:2px solid var(--wp--preset--color--cervena,#E00103);
  outline-offset:2px}
/* Checkbox po Tabu zůstával s tmavým výchozím obrysem: WC Blocks vlastní
   pravidlo `.wc-block-components-checkbox
   .wc-block-components-checkbox__input[type="checkbox"]:focus` má vyšší
   specificitu než řádek výš a v kaskádě vyhrává. Zrcadlením stejných tříd
   (se scopem .woocommerce-checkout navrch) specificitu přebijeme, radio
   zůstává na řádku výš beze změny - tam WC podobné pravidlo nemá. */
.woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:focus-visible{
  outline:2px solid var(--wp--preset--color--cervena,#E00103);
  outline-offset:2px}

/* Přepínače dopravy a platby jako výběrové karty AB: bílá, linka
   tokenu, sražený roh 9 px; aktivní volba černá linka 2 px místo
   dnešního neviditelného rámečku. Mění se JEN vzhled <label> okolo
   skutečného <input type="radio"> - výběr (klik, klávesnice, checked)
   se nedotýká, WooCommerce sám přepíná třídu *-option-checked. */
.woocommerce-checkout .wc-block-components-radio-control__option{
  display:block;background:#fff;margin-bottom:8px;
  border:1px solid var(--wp--preset--color--linka,#E1E2E5);
  clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
    calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px)}
.woocommerce-checkout .wc-block-components-radio-control__option-checked{
  border:2px solid var(--wp--preset--color--inkoust,#0A0A0C)}
/* Varianta *-option-checked--checked-option-highlighted má ve WC Blocks
   vlastní pravidlo se třemi třídami (vyšší specificita než výš) - proto
   tu i radius zvlášť, ale zrcadlením stejných tří tříd (plus náš scope
   .woocommerce-checkout navrch) - specificita tak vyhraje i beze
   !important, jinak zůstane kulatá jen ta vybraná (ověřeno živě). */
.woocommerce-checkout .wc-block-components-radio-control__option.wc-block-components-radio-control__option-checked.wc-block-components-radio-control__option--checked-option-highlighted{
  border-radius:0}

/* Souhrn objednávky vpravo jako karta AB (dnes tenký šedý rámeček,
   radius 5 px - viz pravidlo výš). */
.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block{
  background:#fff;border:1px solid var(--wp--preset--color--linka,#E1E2E5)}

/* Ceny v souhrnu objednávky Big Shoulders (dnes 14 px Barlow) - stejný
   jazyk jako souhrn košíku výš a karta výpisu (mlv-vypis.css). Řádkové
   položky (Mezisoučet, Doručení, jednotlivé produkty) 16 px, celková
   částka (Cena celkem) zvýrazněná 24 px. */
.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block .wc-block-formatted-money-amount{
  font-family:var(--wp--preset--font-family--nadpis,"Big Shoulders")}
.woocommerce-checkout .wc-block-components-totals-item__value{font-size:16px}
.woocommerce-checkout .wc-block-components-totals-footer-item-tax-value{
  font:800 24px/1 var(--wp--preset--font-family--nadpis,"Big Shoulders");
  color:var(--wp--preset--color--inkoust,#0A0A0C)}

/* Tlačítko "Odeslat objednávku": červená výplň tokenu (dnes černá),
   sražený roh 9 px (dnes bez řezu; výška ~54 px už vyhovuje >= 44 px). */
.woocommerce-checkout .wc-block-components-checkout-place-order-button{
  background:var(--wp--preset--color--cervena,#E00103);color:#fff;
  clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
    calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px)}
.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover,
.woocommerce-checkout .wc-block-components-checkout-place-order-button:focus-visible{
  background:var(--wp--preset--color--inkoust,#0A0A0C)}

/* ============================================================
   Etapa 5b, rozhodnutí zadavatele 7. 9. 2026, bod 1: úzká hlavička
   pokladny. Markup v patterns/hlavicka-pokladna.php, šablona v
   templates/page-checkout.html. Servisní proužek (.servis) a obal
   (.obal) si berou vzhled z mlv-ram.css - ten se zavádí bez podmínky
   na každé stránce, takže na pokladně platí. Vlastní lišta se ZÁMĚRNĚ
   nejmenuje .lista: ta je v mlv-ram.css sticky a má min-height 112 px,
   což je pravý opak „úzké". */
.mlv-pokladna-lista{background:#fff;
  border-bottom:1px solid var(--wp--preset--color--linka,#E1E2E5);
  font-family:var(--wp--preset--font-family--text,Barlow,system-ui,sans-serif)}
.mlv-pokladna-lista .obal{display:flex;align-items:center;
  justify-content:space-between;gap:16px 24px;min-height:64px;padding:10px 20px}
/* Logo bez sloganu, 40 px - stejná výška jako zmenšená hlavička webu
   (.lista.mensi .znacka .bez v mlv-ram.css). */
.mlv-pokladna-lista .znacka img{display:block;width:auto;height:40px}
.mlv-pokladna-kontakt{margin:0;font-size:16px;
  color:var(--wp--preset--color--sediva,#4E4E52)}
.mlv-pokladna-kontakt a{color:var(--wp--preset--color--inkoust,#0A0A0C);
  font-weight:600;text-decoration:none}
.mlv-pokladna-zpet{display:inline-flex;align-items:center;gap:8px;
  font-size:16px;color:var(--wp--preset--color--sediva,#4E4E52);
  text-decoration:none}
.mlv-pokladna-zpet svg{width:20px;height:20px;fill:none;stroke:currentColor;
  stroke-width:1.6}
.mlv-pokladna-kontakt a:hover,.mlv-pokladna-kontakt a:focus-visible,
.mlv-pokladna-zpet:hover,.mlv-pokladna-zpet:focus-visible{
  color:var(--wp--preset--color--cervena,#E00103)}
/* Na mobilu se tři prvky nevejdou do řádku; telefon jde pod logo a
   odkaz zpět zůstane vpravo nahoře (měřák hlídá 0 přetoku na 390 px). */
@media (max-width:640px){
  .mlv-pokladna-lista .obal{flex-wrap:wrap;min-height:0;padding:10px 20px}
  .mlv-pokladna-kontakt{order:3;flex-basis:100%;font-size:14px}
}

/* Rozhodnutí zadavatele 7. 9. 2026, bod 2: JEDINÁ výjimka z pravidla
   „žádný border-radius". Pravidlo `.woocommerce-checkout input{
   border-radius:0 !important}` výš zhranatilo i radiobuttony, takže
   nevybraná volba dopravy byla čtvereček k nerozeznání od zaškrtávátka
   nad ní. Selektor je o jeden atribut specifičtější než pravidlo výš
   ((0,2,1) vs (0,1,1)), takže vyhraje i mezi dvěma !important; !important
   tu být MUSÍ, jinak ho přebije to výš. Zaškrtávátka zůstávají hranatá
   (mají vlastní pravidlo se třídami, tohohle selektoru se netýkají). */
.woocommerce-checkout input[type="radio"]{border-radius:50% !important}