/* ESPEON custom CSS — načítáno přes <link> v Záhlaví (mimo 8192 limit HTML kódů)
 * Verze: 2026-07-08
 * Obsah: UX opravy košíku (#70). Blogová typografie (#73) zůstává v Zápatí.
 * Nasazení + rollback: viz DEPLOY.md ve stejné složce.
 * ------------------------------------------------------------------------- */

/* === Mini-košík (hover popup): rozložení řádku ========================= */
/* PŮVODNÍ funkční verze (potvrzená uživatelem v dry-runu, než jsme šli na jiný
   úkol). Pevné šířky sloupců + menší font přerozdělí řádek tak, že „balení" je
   odsazené, „g" u gramáže i „ZDARMA" zůstanou na svém řádku a název nenaráží do
   jednotky. Třídy popupu: .cart-widget .cart-widget-product-image/-amount/-unit
   + .cart-widget-inner. (Nezaměňovat s třídami STRÁNKY košíku .p-name/.p-price.) */
@media (min-width: 992px) {
  .cart-widget .cart-widget-inner { font-size: 13px; line-height: 1.35; }
  .cart-widget .cart-widget-product-image { width: 52px; }
  .cart-widget .cart-widget-product-amount { width: 60px; padding: 0 4px; }
  .cart-widget .cart-widget-product-unit { width: 50px; white-space: nowrap; padding: 0 2px 0 8px; }
  /* Menší font názvu, ať se „100 ks" i „3.5 g" hezky vejdou bez osamoceného
     slova na posledním řádku (obrázek zpět v původní velikosti 52px). */
  .cart-widget .cart-widget-product-name { font-size: 11.5px; line-height: 1.3; text-wrap: pretty; }
}

/* === Košík: rekapitulace objednávky (checkout) ========================= */
/* „balení" nesmí narážet do svislé přepážky (přetok buňky). */
.order-summary .cart-item-amount { padding: 8px 6px; }
.order-summary .cart-item-amount .unit-value { font-size: 13px; white-space: nowrap; }

/* === Košík: slevový kupón sbalený do odkazu ============================ */
/* Velké prázdné pole „Vložit slevový kupón" → decentní odkaz „Mám slevový
   kód", který se přes JS (espeon-cart.js) rozbalí na místě. */
.espeon-coupon-toggle {
  display: inline-flex; align-items: center; gap: 6px;
  color: #732382; text-decoration: underline; cursor: pointer;
  font-weight: 600; font-size: 14px; margin: 2px 0 6px;
}
.espeon-coupon-toggle:before { content: "%"; font-weight: 700; }

/* === Produkt: hláška o dopravě zdarma =================================== */
.espeon-prod-freeship {
  display: inline-block; margin: 6px 0; font-size: 13px; font-weight: 600;
  color: #2e7d32;
}
.espeon-prod-freeship:before { content: "🚚 "; }

/* === Checkout: bezpečnostní microcopy u platby ========================= */
.espeon-pay-trust {
  margin: 4px 0 10px; font-size: 13px; color: #555;
}

/* === Košík: informace o nákladech (nad tlačítkem Pokračovat) =========== */
.espeon-cost-info {
  margin: 10px 0; padding: 10px 12px; background: #f6f0f8;
  border-radius: 8px; font-size: 13px; line-height: 1.5; color: #444;
}
.espeon-cost-info b { color: #2e7d32; }
.espeon-return { margin-top: 6px; font-size: 12px; color: #777; }
.espeon-reg-vp { margin: 4px 0 0 24px; font-size: 12px; color: #732382; }

/* === Košík: Uložit na později ========================================== */
.espeon-sfl-link {
  display: inline-block; margin-right: 12px; font-size: 12px;
  color: #732382; text-decoration: underline; cursor: pointer;
}
.espeon-saved { margin: 16px 0; padding: 12px 14px; border: 1px solid #ead9ee; border-radius: 8px; }
.espeon-saved-h { margin: 0 0 8px; font-size: 15px; }
.espeon-saved-item { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-top: 1px solid #f0e6f3; }
.espeon-saved-item img { width: 40px; height: 40px; object-fit: contain; }
.espeon-saved-name { flex: 1; font-size: 13px; }
.espeon-saved-add { font-size: 13px; color: #732382; font-weight: 600; white-space: nowrap; }
.espeon-sfl-del { color: #999; text-decoration: none; font-size: 18px; line-height: 1; }

/* === Mobil: souhrn + hlavní CTA nalepené dole (Baymard mobile) ========= */
/* Aby cena a tlačítko Pokračovat zůstaly viditelné při scrollu na telefonu. */
@media (max-width: 600px) {
  .cart-summary .next-step,
  .cart-summary .next-step--cart {
    position: sticky; bottom: 0; z-index: 20;
    background: #fff; padding: 8px 0;
    box-shadow: 0 -2px 8px rgba(0,0,0,.08);
  }
}
