/**
 * Kandoo checkout — sjednocené stylování 1. a 2. kroku košíku.
 * Tilda prefix zajišťuje pozdní load (po custom.css) v abecedním scandiru autoload/.
 */

/* Popisek "Cena za kus" má smysl jen na mobilu, kde tabulka nemá hlavičku */
.cart_unit__label {
    display: none;
}

/* --------------------------------------------------------------------------
   Design tokens — warm leather palette, restrained hierarchy
   -------------------------------------------------------------------------- */
:root {
    /* Warm neutrals — barvy sekcí dle klienta (tiket #3072, bod 4) */
    --cs-bg-page: #FAF6F0;
    --cs-bg-products: transparent;
    --cs-bg-services: #D6CBB8;
    --cs-bg-gifts: #CFC4B8;
    --cs-bg-card: #FFFFFF;
    /* Podklad souhrnu — stejný odstín jako .cart_summary_right (pobídka
       "doprava zdarma"), aby na sebe plochy navazovaly bez předělu. */
    --cs-bg-summary: #FAF8F5;

    /* Status — zelená dle shop .btn-success (#548A4B) */
    --cs-accent-ok: #548A4B;
    --cs-accent-ok-bg: #EAF1E8;
    --cs-accent-pending: #8B5E3C;
    --cs-accent-pending-bg: #F1E7DE;
    --cs-accent-primary: #B95D43;

    /* Ink & muted */
    --cs-ink: #1A1611;
    --cs-ink-light: #3D332A;
    --cs-muted: #75695C;
    --cs-line: #E5DDD0;
    --cs-line-soft: #EFE8DB;
    --cs-line-strong: #C7B9A5;

    /* Rhythm — e-shop používá ostré rohy */
    --cs-radius: 0;
    --cs-radius-lg: 0;
    --cs-gap: 24px;
    --cs-gap-lg: 32px;
    --cs-section-pad: 24px 28px;
}

/* --------------------------------------------------------------------------
   Section titles — editorial small caps, subtle divider
   -------------------------------------------------------------------------- */

#cart_summary thead h4,
.cs-section__title {
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin: 0;
    color: var(--cs-ink);
}

.cs-section__title--regular {
    font-size: 15px !important;
    letter-spacing: 0.02em;
    text-transform: none;
    font-weight: 600 !important;
}

.cs-section__subtitle {
    font-size: 13px;
    color: var(--cs-muted);
    font-weight: 400;
    margin-top: 6px;
    letter-spacing: 0;
}

/* Section header row — smaller icon inline with title */
#cart_summary tr[class*="cs-section-header--"] > th.cs-section__title {
    position: relative;
}

#cart_summary tr[class*="cs-section-header--"] > th.cs-section__title h4 {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

/* ==========================================================================
   Cart summary tabulka — fixed layout, aby ji nerozšířil dlouhý obsah
   (např. cross-sell swiper s 15+ produkty vedle sebe uvnitř colspan buňky).
   ========================================================================== */

#order-detail-content {
    max-width: 100%;
}

.cart_summary_left {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}

.cart_summary_right {
    min-width: 280px;
    max-width: 33%;
    flex: 0 0 33%;
}

#cart_summary {
    table-layout: fixed;
    width: 100%;
    max-width: 100%;
}

#cart_summary td,
#cart_summary th {
    max-width: 100%;
    overflow-wrap: break-word;
}

/* Cross-sell POD tabulkou — místo bloku ve tbody */
.cs-crosssell-below {
    margin-top: 40px;
    max-width: 100%;
    overflow: hidden;
}

.cs-crosssell-below > *,
.cs-crosssell-below .crosssell-products,
.cs-crosssell-below .swiper {
    max-width: 100%;
}

/* Modul crosssell má vlastní border-top — pryč (druhá čára) */
.cs-crosssell-below section.prestaservis-crosssell,
.cs-crosssell-below .prestaservis-crosssell {
    border-top: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Nadpis "Doporučujeme také" — výrazný titulek s terakotovým akcentem.
   Cíleno jen na přímý h2/h3 sekce, NE na názvy produktů v karuselu. */
.cs-crosssell-below > h2,
.cs-crosssell-below > h3,
.cs-crosssell-below .prestaservis-crosssell > h2,
.cs-crosssell-below .prestaservis-crosssell > h3 {
    font-size: 22px !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
    color: var(--cs-ink) !important;
    margin: 0 0 24px !important;
    padding: 0 0 14px !important;
    text-align: left !important;
    line-height: 1.3 !important;
    position: relative;
    border: 0 !important;
    background: transparent !important;
}

.cs-crosssell-below > h2::after,
.cs-crosssell-below > h3::after,
.cs-crosssell-below .prestaservis-crosssell > h2::after,
.cs-crosssell-below .prestaservis-crosssell > h3::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: 3px;
    background: var(--cs-accent-primary);
}

/* --------------------------------------------------------------------------
   Barevné sekce — Vybrané služby / Dárky-slevy
   Jemné warm neutrální pozadí, žádné agresivní boxy.
   -------------------------------------------------------------------------- */

/* Reset default table cell styling */
#cart_summary td, #cart_summary th {
    border: 0;
    background: transparent;
}

/* Vybrané zboží header — bez pozadí, jen thin border-bottom */
#cart_summary thead:first-of-type > tr > th {
    background: transparent;
    padding: 24px 4px 16px;
    border-bottom: 1px solid var(--cs-line);
    text-align: left;
    color: var(--cs-muted);
    font-weight: 500;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Numerické sloupce vpravo, množství uprostřed */
#cart_summary thead:first-of-type > tr > th.cart_unit,
#cart_summary thead:first-of-type > tr > th.cart_total {
    text-align: right;
}

#cart_summary thead:first-of-type > tr > th.cart_quantity {
    text-align: center;
}

#cart_summary thead:first-of-type > tr > th.collapsed_row_header,
#cart_summary thead:first-of-type > tr > th.collapsed_row_header h4 {
    color: var(--cs-ink);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
}

/* Numerické buňky v tbody také zarovnány */
#cart_summary tbody > tr.cart_item > td.cart_unit,
#cart_summary tbody > tr.cart_item > td.cart_total {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}

#cart_summary tbody > tr.cart_item > td.cart_quantity {
    text-align: center;
}

#cart_summary tbody > tr.cart_item > td.cart_total {
    font-weight: 600;
    font-size: 15px;
    color: var(--cs-ink);
}

/* Delete × v malé barvě */
#cart_summary tbody > tr.cart_item > td.cart_delete a,
#cart_summary tbody > tr.cart_item .cart_quantity_delete {
    color: var(--cs-muted);
    font-size: 18px;
    text-decoration: none;
    line-height: 1;
    transition: color 0.15s ease;
    display: inline-block;
    padding: 4px;
}

#cart_summary tbody > tr.cart_item > td.cart_delete a:hover,
#cart_summary tbody > tr.cart_item .cart_quantity_delete:hover {
    color: var(--cs-accent-pending);
}

/* --------------------------------------------------------------------------
   Panely sekcí — Vybrané služby / Dárky a kuponové slevy
   Samostatné <section> bloky POD tabulkou zboží. Žádné table-cell hacky.
   Barvy dle požadavku klienta (tiket #3072, bod 4).
   -------------------------------------------------------------------------- */

.cs-panel {
    border-radius: var(--cs-radius-lg);
    padding: 24px 28px 26px;
    margin-top: 24px;
}

.cs-panel--services {
    background: var(--cs-bg-services);
}

.cs-panel--gifts {
    background: var(--cs-bg-gifts);
}

.cs-panel__header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 16px;
    margin-bottom: 18px;
    border-bottom: 1px solid rgba(26, 22, 17, 0.1);
}

.cs-panel__header h4 {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cs-ink);
    margin: 0;
    line-height: 1.4;
}

.cs-panel__icon {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--cs-accent-pending);
    flex-shrink: 0;
}

.cs-panel__icon svg {
    width: 16px;
    height: 16px;
}

.cs-panel__body {
    max-width: 100%;
    overflow: hidden;
}

/* První hlavička "Vybrané zboží" — ikonka tašky */
#cart_summary thead:first-of-type tr th.collapsed_row_header h4::before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 10px;
    vertical-align: -1px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238B5E3C' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M6 2L3 6v14a2 2 0 002 2h14a2 2 0 002-2V6l-3-4z'/><line x1='3' y1='6' x2='21' y2='6'/><path d='M16 10a4 4 0 01-8 0'/></svg>");
}

/* --------------------------------------------------------------------------
   Vybrané zboží — product line polishing
   -------------------------------------------------------------------------- */

#cart_summary tbody > tr.cart_item {
    background: transparent;
}

#cart_summary tbody > tr.cart_item > td {
    padding: 20px 4px;
    border-bottom: 1px solid var(--cs-line-soft);
    vertical-align: middle;
}

#cart_summary tbody > tr.cart_item:last-child > td {
    border-bottom: 0;
}

/* --------------------------------------------------------------------------
   Sjednocený řádek služby — insurance + leathercare
   Bez bílého boxu okolo SVG ikony; product image dostane bílý box.
   -------------------------------------------------------------------------- */

.cs-service-row {
    display: grid;
    grid-template-columns: 48px 1fr auto;
    align-items: center;
    gap: 16px;
    padding: 18px 22px;
    background: var(--cs-bg-card);
    margin-bottom: 8px;
    transition: background-color 0.15s ease;
}

.cs-service-row:last-child {
    margin-bottom: 0;
}

.cs-service-row__image {
    width: 48px;
    height: 48px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cs-ink);
    flex-shrink: 0;
}

/* Skutečný produkt image (leathercare) — bez dekorace, jen fotka */
.cs-service-row__image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* Ikonový SVG (insurance shield) — bez pozadí, čistě lineart */
.cs-service-row__image svg {
    width: 32px;
    height: 32px;
    stroke-width: 1.4;
}

.cs-service-row__label {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    line-height: 1.45;
    color: var(--cs-ink);
    font-size: 14.5px;
    font-weight: 500;
    margin: 0;
    letter-spacing: 0.005em;
}

/* --------------------------------------------------------------------------
   Sjednocený checkbox — custom render (theme nutí width/height auto
   + vertical-align text-top, což dělá malý checkbox nahoře).
   Jeden styl pro služby i kupón: 20px, hairline, checked = terakota + ✓.
   -------------------------------------------------------------------------- */

.cs-service-row__label input[type="checkbox"],
.cs-voucher-toggle__checkbox {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: inline-block;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    flex: 0 0 20px;
    margin: 0 !important;
    padding: 0 !important;
    border: 1.5px solid #9C8C77;
    border-radius: 0;
    background: #fff;
    cursor: pointer;
    vertical-align: middle !important;
    position: relative;
    transition: background 0.12s ease, border-color 0.12s ease;
}

.cs-service-row__label input[type="checkbox"]:hover,
.cs-voucher-toggle__checkbox:hover {
    border-color: var(--cs-accent-primary);
}

.cs-service-row__label input[type="checkbox"]:checked,
.cs-voucher-toggle__checkbox:checked {
    background-color: var(--cs-accent-primary);
    border-color: var(--cs-accent-primary);
}

.cs-service-row__label input[type="checkbox"]:checked::after,
.cs-voucher-toggle__checkbox:checked::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
    background-size: 13px;
    background-position: center;
    background-repeat: no-repeat;
}

.cs-service-row__label small {
    display: block;
    color: var(--cs-muted);
    font-size: 13px;
    font-weight: 400;
    margin-top: 3px;
    letter-spacing: 0;
}

.cs-service-row__price {
    font-size: 15px;
    font-weight: 600;
    color: var(--cs-ink);
    text-align: right;
    min-width: 90px;
    font-variant-numeric: tabular-nums;
}

.cs-service-row.is-checked .cs-service-row__label {
    color: var(--cs-ink);
}

.cs-service-row.is-checked .cs-service-row__image {
    color: var(--cs-accent-ok);
}

@media (max-width: 991.98px) {
    /* menší odsazení panelů — na úzkém displeji (a vedle sidebaru na
       tabletu) se paddingy sčítají a na obsah zbývá příliš málo místa */
    .cs-panel {
        padding: 16px 14px 18px;
    }
    .cs-block {
        padding: 16px 14px;
    }
    /* kompaktní layout: ikona | checkbox+text | cena (nahoře u titulku) */
    .cs-service-row {
        grid-template-columns: 40px minmax(0, 1fr) auto;
        grid-template-areas: "image label price";
        gap: 12px;
        align-items: start;
        padding: 14px 12px;
    }
    .cs-service-row__image {
        grid-area: image;
        width: 40px;
        height: 40px;
        align-self: center;
    }
    .cs-service-row__label { grid-area: label; font-size: 13px; }
    .cs-service-row__price {
        grid-area: price;
        text-align: right;
        min-width: 0;
        padding-left: 0;
        white-space: nowrap;
        align-self: start;
    }
}

/* ==========================================================================
   Dvojsloupec dárek | kupon
   ========================================================================== */

.cs-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: stretch;
}

/* Sloupce jako flex column → karty uvnitř se roztáhnou na stejnou výšku.
   Přebíjí theme #HOOK_SHOPPING_CART { display: table }. */
.cs-two-col > * {
    min-width: 0;
    display: flex !important;
    flex-direction: column;
}

.cs-two-col > * > .cs-block {
    flex: 1 1 auto;
}

/* Theme #cart_summary_voucher { margin-top: 7px; font-weight: 700 }
   → karta kupónu posunutá dolů a tučný text uvnitř */
#cart_summary_voucher.cs-voucher-toggle {
    margin: 0 !important;
    font-weight: 400;
}

@media (max-width: 767px) {
    .cs-two-col {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

/* --------------------------------------------------------------------------
   Blok dárku + kuponu — refined card design
   -------------------------------------------------------------------------- */

.cs-block {
    background: var(--cs-bg-card);
    padding: 22px 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
}

/* Hlavička karty: ikona 20px + gap 12px — stejná mřížka jako checkbox řádek níže */
.cs-block__header {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cs-block__header h3 {
    font-size: 15px;
    font-weight: 600;
    color: var(--cs-ink);
    margin: 0;
    letter-spacing: 0.01em;
    line-height: 1.3;
}

.cs-block__icon {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cs-ink);
    flex-shrink: 0;
}

.cs-block__icon svg,
.cs-block__icon img {
    width: 20px;
    height: 20px;
    filter: none;
    stroke-width: 1.6;
}

/* Akce (tlačítko) vždy dole — sjednocuje výšku obou karet */
.cs-block__cta {
    margin-top: auto;
}

/* Status lišta */
.cs-status {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0.005em;
}

.cs-status--ok {
    background: var(--cs-accent-ok-bg);
    color: var(--cs-accent-ok);
}

.cs-status--pending {
    background: var(--cs-accent-pending-bg);
    color: var(--cs-accent-pending);
}

.cs-status__icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* Progress bar */
.cs-progress {
    width: 100%;
    height: 6px;
    background: rgba(139, 94, 60, 0.15);
    border-radius: 0;
    overflow: hidden;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
}

.cs-progress::-webkit-progress-bar {
    background: rgba(139, 94, 60, 0.15);
    border-radius: 0;
}

.cs-progress::-webkit-progress-value {
    background: var(--cs-accent-pending);
    border-radius: 0;
    transition: width 0.3s ease;
}

.cs-progress::-moz-progress-bar {
    background: var(--cs-accent-pending);
    border-radius: 0;
}

.cs-progress-label {
    font-size: 12.5px;
    color: var(--cs-muted);
    margin-top: -6px;
}

/* Tlačítko výběru dárku — shodné se shop .btn-primary (PŘIDAT DO KOŠÍKU) */
.cs-block__cta,
.cs-block__cta:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    padding: 11px 22px;
    background: var(--cs-accent-primary);
    color: #fff;
    border: 0;
    border-radius: 0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s ease;
}

.cs-block__cta:hover {
    background: #A34E36;
    color: #fff;
}

.cs-block__cta--outline {
    background: transparent;
    color: var(--cs-ink);
    border: 1px solid var(--cs-line-strong);
}

.cs-block__cta--outline:hover {
    background: var(--cs-ink);
    border-color: var(--cs-ink);
    color: #fff;
}

.cs-block__selected {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: var(--cs-bg-page);
}

.cs-block__selected img {
    width: 44px;
    height: 44px;
    object-fit: cover;
    flex-shrink: 0;
}

.cs-block__selected-name {
    font-size: 13px;
    color: var(--cs-ink);
    font-weight: 500;
    line-height: 1.3;
}

/* ==========================================================================
   Voucher toggle — zavřený box, po zaškrtnutí odkryje input
   ========================================================================== */

/* Voucher toggle uvnitř .cs-block: header nahoře, checkbox+label na řádku, body pod */
.cs-voucher-toggle {
    display: grid !important;
    grid-template-columns: auto 1fr;
    grid-template-areas:
        "header header"
        "check label"
        "body body";
    gap: 0 12px;
    align-items: center;
    align-content: start;
}

.cs-voucher-toggle .cs-block__header {
    grid-area: header;
    margin-bottom: 16px;
}

.cs-voucher-toggle__checkbox {
    grid-area: check;
    align-self: center;
    justify-self: start;
}

.cs-voucher-toggle__label {
    grid-area: label;
    align-self: center;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--cs-ink-light);
    margin: 0;
    letter-spacing: 0.005em;
    padding: 0;
    line-height: 1;
}

.cs-voucher-toggle__label:hover {
    color: var(--cs-ink);
}

.cs-voucher-body {
    grid-area: body;
    display: none;
    margin-top: 16px;
}

.cs-voucher-toggle__checkbox:checked ~ .cs-voucher-body,
.cs-voucher-body.is-open {
    display: block;
}

.cs-voucher-body form {
    display: flex;
    gap: 10px;
    align-items: stretch;
}

/* Input — přebíjí theme #cart_summary_voucher .discount_name
   (width 200px, margin-left 5px, padding-top 6px → nezarovnaný text) */
#cart_summary_voucher .cs-voucher-body input.discount_name,
.cs-voucher-body input.discount_name,
.cs-voucher-body input[type="text"] {
    flex: 1 1 auto;
    width: auto !important;
    max-width: none !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    background: var(--cs-bg-card);
    border: 1px solid var(--cs-line-strong);
    border-radius: 0;
    font-size: 14px;
    line-height: normal;
    min-width: 0 !important;
    color: var(--cs-ink);
    letter-spacing: 0.02em;
    transition: border-color 0.15s ease;
    box-sizing: border-box;
}

#cart_summary_voucher .cs-voucher-body input.discount_name:focus,
.cs-voucher-body input.discount_name:focus,
.cs-voucher-body input[type="text"]:focus {
    outline: 0;
    border-color: var(--cs-accent-primary);
    box-shadow: none;
}

/* Potvrdit — shodné se shop .btn-primary, stejná výška jako input.
   Theme custom.css dává submitu position: relative; top: -3px → reset. */
.cs-voucher-body button[type="submit"],
.cs-voucher-body input[type="submit"] {
    position: static !important;
    top: auto !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 24px !important;
    background: var(--cs-accent-primary) !important;
    color: #fff;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease;
    box-sizing: border-box;
}

.cs-voucher-body button[type="submit"]:hover,
.cs-voucher-body input[type="submit"]:hover {
    background: #A34E36 !important;
}

.cs-applied-discounts {
    list-style: none;
    padding: 0;
    margin: 0;
}

.cs-applied-discounts li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    font-size: 13.5px;
    color: var(--cs-ink);
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.cs-applied-discounts li:last-child {
    border-bottom: 0;
}

.cs-applied-discounts__name {
    font-weight: 500;
}

.cs-applied-discounts__remove {
    color: var(--cs-accent-pending);
    text-decoration: none;
    font-size: 16px;
    line-height: 1;
}

/* ==========================================================================
   Součtová tabulka — "Celkem bez DPH" menší, prošedlé
   ========================================================================== */

#cart_summary_total tr.tax_excl_total > td,
#cart_summary_total .cs-total--subtle,
#cart_summary_total .cs-total--subtle td {
    font-size: 12.5px !important;
    font-weight: 400 !important;
    color: var(--cs-muted) !important;
    letter-spacing: 0;
}

/* ==========================================================================
   Sticky sidebar — jednotná CSS-only implementace pro 1. i 2. krok
   Doplňuje/nahrazuje jQuery sticky logiku v global.js.
   ========================================================================== */

#order-detail-content .cart_summary_right,
.checkout-grid__right {
    position: sticky;
    top: 20px;
    align-self: start;
}

/**
 * `.web-wrap` má `overflow: hidden`, což by rozbilo position: sticky uvnitř.
 * Otevíráme overflow POUZE v procesu objednávky, aby sticky sidebar fungoval.
 * Modaly/tooltipy zůstávají uzavřené v `.container`.
 */
body#module-shoppingcart-payment .web-wrap,
body#module-shoppingcart-customer .web-wrap,
body#order .web-wrap,
body#order-opc .web-wrap,
body[id^="module-shoppingcart"] .web-wrap {
    overflow: visible !important;
}

@media (max-width: 767.98px) {
    /* Na mobilu je souhrn pod obsahem — musí se roztáhnout na celou šířku,
       jinak zůstane úzký sloupec podle sidebarových pravidel výše */
    #order-detail-content .cart_summary_right,
    .checkout-grid__right {
        position: static;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        flex: 1 1 auto;
    }
    /* Fixní zelené tlačítko: menší font + prostor vpravo pro plovoucí
       bublinu „Napište nám zprávu", aby text nebyl překrytý */
    #order-detail-content .btn.standard-checkout {
        font-size: 18px;
        padding-left: 20px;
        padding-right: 90px;
    }
}

/* ==========================================================================
   2. krok — checkout grid (doprava/platba vlevo, souhrn vpravo)
   ========================================================================== */

.checkout-grid,
.shoppingcartpayment > form.checkout-grid,
.shoppingcartcustomer > form.checkout-grid,
form.checkout-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
    gap: 32px;
    align-items: start;
}

.checkout-grid__left {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.checkout-grid__right {
    min-width: 0;
}

@media (max-width: 991.98px) {
    /* Selektory musí mít stejnou specificitu jako desktopová definice výše,
       jinak mobilní 1fr prohraje s `form.checkout-grid` */
    .checkout-grid,
    .shoppingcartpayment > form.checkout-grid,
    .shoppingcartcustomer > form.checkout-grid,
    form.checkout-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    /* Radio dopravce až na kraj karty — modul odsazuje o 32px + 10px margin,
       na úzkém displeji je to zbytečná mezera. Prefix body# kvůli specificitě:
       style.css modulu se načítá až po theme CSS. */
    body#module-shoppingcart-payment .shippingpart .shippingitem {
        padding-left: 0;
    }
    body#module-shoppingcart-payment .shippingpart .shippingitem input[type="radio"] {
        margin-left: 0;
    }
}

/* Souhrnná karta — JEDNO pravidlo pro 1., 2. i 3. krok.
   POZOR: --cs-bg-products je `transparent`, takže panel 2. kroku dřív neměl
   žádné pozadí ani rám a souhrn se na bílé stránce ztrácel. */
body .cs-summary-card {
    background: var(--cs-bg-summary) !important;
    /* Bez rámečku: v 1. kroku má sidebar stejné pozadí, takže by linka jen
       rozsekla jednolitou plochu. Panel drží pohromadě odstín, ne rám. */
    border: 0 none !important;
    border-radius: var(--cs-radius);
    padding: 18px 20px 20px !important;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

body .cs-summary-card > h3 {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--cs-muted) !important;
    margin: 0 !important;
    padding: 0 0 12px !important;
    border-bottom: 1px solid var(--cs-line);
    background: transparent !important;
    text-align: left !important;
}

/* Tabulka uvnitř karty už vlastní rám a pozadí mít nesmí — kartu dělá obal */
body .cs-summary-card .cs-summary-table {
    background: transparent !important;
    border: 0 none !important;
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
}

.cs-summary-card table {
    width: 100%;
    border-collapse: collapse;
}

.cs-summary-card table td {
    padding: 6px 0;
    font-size: 14px;
    color: var(--cs-ink);
    border: 0;
    background: transparent;
}

.cs-summary-card table td:last-child {
    text-align: right;
    font-weight: 500;
}

.cs-summary-card table tr.cs-summary-total > td {
    font-size: 16px;
    font-weight: 700;
    padding-top: 12px;
    border-top: 1px solid var(--cs-line);
}

.cs-summary-card table tr.cs-summary-subtle > td {
    font-size: 12.5px;
    color: var(--cs-muted);
    font-weight: 400;
}

.cs-summary-sidebar .pickup-error {
    display: none;
    padding: 8px 12px;
    background: #fdecea;
    color: #b3261e;
    border-radius: 0;
    font-size: 13px;
    font-weight: 500;
}

.cs-summary-sidebar.has-pickup-error .pickup-error {
    display: block;
}

/* Zelené aktivní tlačítko Pokračovat */
.cs-btn-continue,
a.cs-btn-continue,
.submitbutton.cs-btn-continue {
    display: block !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 14px 20px !important;
    background: #548A4B !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    float: none !important;
    transition: background 0.15s ease !important;
    text-align: center !important;
    /* Uvnitř souhrnu má tlačítko sedět hned pod součty, ne o kus níž */
    margin: 4px 0 0 !important;
}

.cs-btn-continue:hover,
.submitbutton.cs-btn-continue:hover {
    background: #47753F !important;
}

.cs-btn-continue:disabled,
.cs-btn-continue.is-disabled,
.submitbutton.cs-btn-continue:disabled {
    background: #a7a7a7 !important;
    cursor: not-allowed !important;
}

/* ==========================================================================
   Pickup point tlačítka — sjednocený vzhled napříč dopravci
   ========================================================================== */

.pickup-btn,
/* Tlačítka výdejních míst — obtažené (bílé, terakotový rámeček), sjednoceno
   napříč Balíkovna/Zásilkovna/DPD/PPL. (Dřív plné tmavé hranaté.) */
.prestaservis_balikovna_show_widget,
#open-packeta-widget {
    display: inline-block !important;
    width: auto !important;
    padding: 9px 16px !important;
    background: #fff !important;
    color: var(--cs-accent-primary, #B95D43) !important;
    border: 1px solid var(--cs-accent-primary, #B95D43) !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em;
    cursor: pointer !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
    margin: 0 !important;
}

.pickup-btn:hover,
.prestaservis_balikovna_show_widget:hover,
#open-packeta-widget:hover {
    background: var(--cs-accent-primary, #B95D43) !important;
    color: #fff !important;
}

.pickup-selected-info,
.prestaservis_balikovna_selected,
#selected-pickup-point {
    display: block;
    margin-top: 8px;
    padding: 8px 10px;
    background: #fff;
    border-left: 3px solid var(--cs-accent-ok);
    border-radius: 0;
    font-size: 13px;
    color: var(--cs-ink);
}

/* ==========================================================================
   Fix "sleva na 2. kus" nečitelnost — obecné pravidlo pro discount texty
   uvnitř tabulky košíku (voucher description, cart_rule hint)
   ========================================================================== */

#cart_summary .cart_discount,
#cart_summary td.cart_discount_price,
#cart_summary td.cart_discount_name,
.cart-discount-hint,
.cart_voucher_description {
    font-size: 13.5px !important;
    line-height: 1.4 !important;
    color: var(--cs-ink) !important;
    white-space: normal !important;
    word-wrap: break-word;
}

/* ==========================================================================
   Cross-sell (prestaservis_cartproducts) — kompaktní horizontální lišta
   ========================================================================== */

.cs-crosssell-compact .prestaservis_cartproducts_block {
    padding: 12px 16px;
    background: var(--cs-bg-products);
    border-radius: var(--cs-radius);
    margin-bottom: 12px;
}

.cs-crosssell-compact .prestaservis_cartproducts_block > h2,
.cs-crosssell-compact .prestaservis_cartproducts_block > h3 {
    font-size: 14px !important;
    font-weight: 600 !important;
    margin: 0 0 10px !important;
    color: var(--cs-ink);
}

.cs-crosssell-compact .prestaservis_cartproducts {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 6px;
}

.cs-crosssell-compact .prestaservis_cartproducts #product_list,
.cs-crosssell-compact .prestaservis_cartproducts .productlist {
    display: flex;
    gap: 10px;
    flex-wrap: nowrap;
    min-width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
}

.cs-crosssell-compact .card-product {
    flex: 0 0 160px;
    padding: 8px;
    background: #fff;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    font-size: 12.5px;
}

.cs-crosssell-compact .card-product img {
    max-width: 100%;
    height: 80px;
    object-fit: contain;
}

.cs-crosssell-compact .card-product h3 {
    font-size: 12.5px;
    line-height: 1.3;
    margin: 0;
    color: var(--cs-ink);
}

.cs-crosssell-compact .card-product .btn {
    padding: 6px 10px;
    font-size: 12px;
}

/* ==========================================================================
   Mobil + tablet (max 991.98px) — tabulka zboží jako stohované karty
   Desktop má table-layout: fixed; na úzkém displeji (na tabletu je vedle
   tabulky ještě sidebar) tabulku převádíme na grid: název přes celou šířku,
   pod ním množství vlevo a cena vpravo, křížek pro smazání vpravo nahoře.
   ========================================================================== */
@media (max-width: 991.98px) {
    #cart_summary,
    #cart_summary > thead,
    #cart_summary > tbody,
    #cart_summary > thead > tr,
    #cart_summary > tbody > tr,
    #cart_summary > tbody > tr > td {
        display: block;
        width: 100%;
    }

    /* hlavička: zůstává jen nadpis „Vybrané zboží" */
    #cart_summary thead:first-of-type > tr > th.collapsed_row_header {
        display: block;
        width: 100%;
        padding: 20px 0 12px;
    }
    #cart_summary thead:first-of-type > tr > th.cart_unit,
    #cart_summary thead:first-of-type > tr > th.cart_quantity,
    #cart_summary thead:first-of-type > tr > th.cart_total,
    #cart_summary thead:first-of-type > tr > th:last-child {
        display: none;
    }

    /* Řádek zboží: miniatura vlevo přes celou výšku, vpravo název + křížek,
       pod tím cena za kus (vč. přeškrtnuté původní) a nakonec množství + celkem. */
    #cart_summary > tbody > tr.cart_item {
        display: grid;
        /* Třetí sloupec MUSÍ mít pevnou šířku. S `auto` se po změně množství
           (3 965 → 11 895 Kč) sloupec rozšíří, název se přelomí jinak a celý
           řádek poskočí — přesně ten posun, co vadil klientovi. */
        grid-template-columns: 72px minmax(0, 1fr) 100px;
        grid-template-areas:
            "img  name  remove"
            "img  unit  unit"
            "img  qty   total";
        gap: 6px 14px;
        align-items: center;
        padding: 16px 0;
        border-bottom: 1px solid var(--cs-line);
    }
    #cart_summary > tbody > tr.cart_item > td {
        display: block;
        width: auto;
        padding: 0;
        border: 0;
    }
    /* Miniatura produktu.
       !important je nutné: custom.css schovává .cart_product i .cart_unit
       (blok `.cart_summary_left #cart_summary …`) a pod 420 px navíc dává
       .cartImageMobile { display:none } a td.cart_product { width:0 }. */
    #cart_summary > tbody > tr.cart_item > td.cart_product {
        grid-area: img;
        align-self: start;
        display: block !important;
        width: 72px !important;
        min-width: 72px !important;
        padding: 0 !important;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_product a {
        display: block;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_product img.cartImageDesktop {
        display: none !important;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_product img.cartImageMobile {
        display: block !important;
        width: 72px !important;
        height: auto !important;
        max-width: none !important;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_description {
        grid-area: name;
        font-size: 14px;
        line-height: 1.45;
        overflow-wrap: anywhere;
    }
    /* Cena za kus — bez hlavičky tabulky by šlo o holé číslo, proto popisek */
    #cart_summary > tbody > tr.cart_item > td.cart_unit {
        grid-area: unit;
        display: flex !important;
        align-items: baseline;
        flex-wrap: wrap;
        gap: 4px 8px;
        font-size: 13px;
        color: var(--cs-muted);
    }
    #cart_summary > tbody > tr.cart_item > td.cart_unit .cart_unit__label {
        display: inline;
        font-size: 13px;
        color: var(--cs-muted);
    }
    #cart_summary > tbody > tr.cart_item > td.cart_unit .old-price {
        font-size: 12.5px;
        color: var(--cs-muted);
        order: 1;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_unit .old-price + br {
        display: none;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_unit .current-price {
        order: 2;
        font-size: 13.5px;
        font-weight: 600;
        color: var(--cs-ink);
    }
    /* Obě ceny drží pohromadě a nelámou se mezi sebou — když se nevejdou,
       zalomí se celý blok pod popisek. */
    #cart_summary > tbody > tr.cart_item > td.cart_unit > .price {
        display: inline-flex;
        align-items: baseline;
        flex-wrap: nowrap;
        white-space: nowrap;
        gap: 8px;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_quantity {
        grid-area: qty;
        display: flex;
        align-items: center;
        gap: 8px;
        text-align: left;
    }
    /* +/- patří ZA číslo (klientský požadavek). Globální styl je má jako
       float: right s výškou 14 px — přepsat na úhledný sloupeček vedle inputu. */
    #cart_summary > tbody > tr.cart_item > td.cart_quantity .cart_quantity_input {
        order: 1;
        float: none;
        height: 34px;
        box-sizing: border-box;
        text-align: center;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_quantity .cart_quantity_button {
        order: 2;
        float: none !important;
        margin: 0 !important;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 34px;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_quantity .cart_quantity_button a {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 24px !important;
        height: 16px !important;
        margin: 0 !important;
        line-height: 1;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_quantity .cart_quantity_button i {
        font-size: 15px;
        line-height: 1;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_total {
        grid-area: total;
        text-align: right;
        white-space: nowrap;
        align-self: center;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_remove_item {
        grid-area: remove;
        text-align: right;
        align-self: start;
    }
}

/* ==========================================================================
   UX 2026-07 bod 12: Sjednocené součtové tabulky napříč kroky košíku
   --------------------------------------------------------------------------
   Jeden vzhled pro:
     1. krok  #cart_summary_total   (šablona tématu)
     2. krok  .cs-summary-sidebar   (modul shoppingcart / payment.tpl)
     3. krok  .order_total          (modul shoppingcart / customer.tpl)

   Popisek vlevo, částka vpravo (sloupec se přizpůsobí obsahu — pevná šířka
   v úzkém sidebaru 2. kroku nechávala čísla viset uprostřed), součet oddělený
   linkou, řádek "bez DPH" decentní.

   Selektory jsou prefixované `body`, protože modulový style.css se načítá až
   po tomto souboru a jeho pravidla .order_total používají !important.
   ========================================================================== */
body .cs-summary-table {
    width: 100%;
    background: transparent !important;
    border: 0 none !important;
    border-collapse: collapse;
    margin-top: 0 !important;
    text-align: left;
}

body .cs-summary-table td {
    padding: 9px 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 14px;
    font-weight: 400;
    color: var(--cs-ink, #1A1611);
    vertical-align: middle;
}

/* Popisek nesmí tlačit částku na druhý řádek */
body .cs-summary-table td:first-child {
    padding-right: 16px !important;
}

/* !important kvůli #cart_summary_total .price { width: 145px } v custom.css,
   které by jinak (jako ID selektor) vyhrálo a vrátilo levé zarovnání. */
body .cs-summary-table td:last-child,
body .cs-summary-table td.priceitem,
body .cs-summary-table td.price {
    width: 1% !important;
    white-space: nowrap;
    text-align: right !important;
    font-weight: 600;
    color: var(--cs-ink, #1A1611);
}

/* Součet "Celkem s DPH" — oddělený linkou, výrazný */
body .cs-summary-table tr.cs-summary-table__total > td {
    font-size: 17px !important;
    font-weight: 700 !important;
    padding-top: 14px !important;
    padding-bottom: 4px !important;
    border-top: 1px solid var(--cs-line-strong, #C7B9A5) !important;
}

/* Částka součtu v akcentní barvě — jinak celý souhrn splývá do jedné šedi */
body .cs-summary-table tr.cs-summary-table__total > td:last-child {
    font-size: 20px !important;
    color: var(--cs-accent-primary, #B95D43) !important;
}

/* "ZDARMA" u dopravy je dobrá zpráva — ať je vidět (souhrn i seznam dopravců) */
.cs-free {
    color: var(--cs-accent-ok, #548A4B);
    font-weight: 700;
}

/* "Celkem bez DPH" — doplňková informace, drží se pod součtem */
body .cs-summary-table tr.cs-summary-table__subtle > td {
    font-size: 12.5px !important;
    font-weight: 400 !important;
    color: var(--cs-muted, #8a8279) !important;
    padding-top: 0 !important;
    padding-bottom: 10px !important;
}

/* Řádek s tlačítkem "Pokračovat v objednávce" v 1. kroku není součtový */
body .cs-summary-table tr.cart_total_price_cart > td {
    padding: 16px 0 0 !important;
    width: auto !important;
    white-space: normal;
    text-align: left !important;
}

/* 3. krok: karta má sedět nahoře u formuláře, ne 56/96 px pod ním */
body#module-shoppingcart-customer .cs-summary-card {
    margin-top: 0;
}

/* Pobídka "doprava zdarma" v 1. kroku sedí ve stejné ploše jako souhrn —
   srovnat vnitřní odsazení, ať obsah lícuje (modul má natvrdo 40 px). */
#order-detail-content .cart_summary_right .modal-body {
    padding: 0 20px !important;
}
#order-detail-content .cart_summary_right .info-modal {
    margin: 12px 0 0 !important;
}

/* Nejužší mobily: zmenšit miniaturu i sloupec s cenou, ať na název zbyde místo.
   Šířky zůstávají PEVNÉ, aby změna množství nerozhýbala layout. */
@media (max-width: 419.98px) {
    #cart_summary > tbody > tr.cart_item {
        grid-template-columns: 60px minmax(0, 1fr) 92px;
        gap: 6px 10px;
    }
    #cart_summary > tbody > tr.cart_item > td.cart_product,
    #cart_summary > tbody > tr.cart_item > td.cart_product img.cartImageMobile {
        width: 60px !important;
        min-width: 60px !important;
    }
}

/* ==========================================================================
   Bod 5: vysvětlivky u plateb — bublina za ikonkou "i"
   Čisté CSS, bez JS. Bublina se ukáže na hover i na focus (klávesnice/dotyk).
   ========================================================================== */
.cs-hint {
    position: relative;
    display: inline-block;
    vertical-align: baseline;
    margin-left: 8px;
    line-height: 0;
}

.cs-hint__toggle {
    box-sizing: border-box;
    width: 18px;
    height: 18px;
    padding: 0;
    border: 1px solid var(--cs-line-strong, #C7B9A5);
    border-radius: 50%;
    background: transparent;
    color: var(--cs-muted, #75695C);
    font-size: 11px;
    font-weight: 700;
    font-style: italic;
    line-height: 16px;
    text-align: center;
    cursor: help;
    display: inline-block;
    vertical-align: middle;
    user-select: none;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.cs-hint__toggle:hover,
.cs-hint__toggle:focus,
.cs-hint.is-open .cs-hint__toggle {
    border-color: var(--cs-accent-primary, #B95D43);
    color: var(--cs-accent-primary, #B95D43);
    outline: none;
}

.cs-hint__bubble {
    position: absolute;
    bottom: calc(100% + 9px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    z-index: 30;
    width: max-content;
    max-width: 240px;
    padding: 10px 13px;
    background: var(--cs-ink, #1A1611);
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    white-space: normal;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(26, 22, 17, 0.28);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
}

/* Zobáček bubliny */
.cs-hint__bubble::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: var(--cs-ink, #1A1611);
}

/* .is-open nastavuje JS na klik (viz modules/shoppingcart/js/custom.js) —
   :focus by po druhém kliknutí zůstal aktivní a bublina by nešla zavřít. */
.cs-hint:hover .cs-hint__bubble,
.cs-hint.is-open .cs-hint__bubble {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

/* Na mobilu se bublina nevejde vedle — roztáhnout na šířku položky */
@media (max-width: 575.98px) {
    .cs-hint__bubble {
        left: 0;
        transform: translateX(0) translateY(4px);
        max-width: min(260px, 70vw);
    }
    .cs-hint__bubble::after {
        left: 8px;
        transform: none;
    }
    .cs-hint:hover .cs-hint__bubble,
    .cs-hint.is-open .cs-hint__bubble {
        transform: translateX(0) translateY(0);
    }
}

/* Nahrazuje inline style="display:none" u dobírky ve virtuálním košíku */
.paymentitem--hidden {
    display: none;
}

/* Vysvětlivka "i" u karty platby: text i ikonka v jednom toku. */
#module-shoppingcart-payment .paymentpart .cs-pay-card .paymentitem__name {
    display: inline;
    min-width: 0;
}
#module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint {
    margin-left: 6px;
    vertical-align: baseline;
    /* Na desktopu (široký panel plateb) bublina míří přímo na ikonku se
       zobáčkem — vypadá to jako pořádný tooltip. Na úzkém mobilu by se u
       ikonky uprostřed řádku ořízla, tam ji níže kotvíme k řádku. */
    position: relative;
}
#module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint__bubble {
    left: 50%;
    right: auto;
    transform: translateX(-50%) translateY(4px);
}
#module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint:hover .cs-hint__bubble,
#module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint.is-open .cs-hint__bubble {
    transform: translateX(-50%) translateY(0);
}
#module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint__bubble::after {
    display: block;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
}

/* Úzký displej: ikonka je u dlouhých názvů uprostřed řádku a bublina mířená
   od ní by se ořízla. Kotvíme ji proto k celému řádku, zarovnáme doleva
   a kompaktně (max-content), takže je vždy celá uvnitř obrazovky. */
@media (max-width: 767.98px) {
    #module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint {
        position: static;
    }
    #module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint__bubble {
        left: 12px;
        right: auto;
        transform: translateY(4px);
        max-width: calc(100vw - 48px);
    }
    #module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint:hover .cs-hint__bubble,
    #module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint.is-open .cs-hint__bubble {
        transform: translateY(0);
    }
    #module-shoppingcart-payment .paymentpart .cs-pay-card .cs-hint__bubble::after {
        display: none;
    }
}

/* ==========================================================================
   Bod 7 (3. krok): souhlas bez zaškrtávátka + dvouřádkové CTA
   ========================================================================== */
.order_terms_note {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--cs-muted, #75695C);
}
.order_terms_note a {
    color: var(--cs-ink, #1A1611);
    text-decoration: underline;
}
.order_terms_note a:hover {
    color: var(--cs-accent-primary, #B95D43);
}
.order_terms_note .bottom {
    display: block;
    margin-top: 6px;
    font-size: 12.5px;
}

/* Dvouřádkové tlačítko: hlavní text + menší doplněk pod ním.
   Selektor musí mít alespoň dvě třídy — základní pravidlo
   `.submitbutton.cs-btn-continue { display: block !important }` výše by jinak
   vyhrálo specificitou a oba texty by zůstaly na jednom řádku. */
.cs-btn-continue.cs-btn-continue--stacked,
.submitbutton.cs-btn-continue--stacked,
button.cs-btn-continue--stacked {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}
/* Pojistka: i kdyby flex někde neprošel, block spany se stejně zalomí */
.cs-btn-continue--stacked .cs-btn-continue__main,
.cs-btn-continue--stacked .cs-btn-continue__sub {
    display: block;
    width: 100%;
    text-align: center;
}
.cs-btn-continue--stacked .cs-btn-continue__main {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
}
.cs-btn-continue--stacked .cs-btn-continue__sub {
    font-size: 12px;
    font-weight: 400;
    line-height: 1.2;
    opacity: 0.85;
    text-transform: none;
    letter-spacing: 0;
}

/* ==========================================================================
   Bod 9: CTA ukotvené dole na obrazovce mobilu — ve VŠECH krocích košíku
   --------------------------------------------------------------------------
   Dřív byl fixní jen 1. krok (custom.css → #order-detail-content
   .btn.standard-checkout) a navíc bez pozadí a šířky. Všechna tři tlačítka
   dnes sdílí třídu .cs-btn-continue, takže stačí jedno pravidlo.
   ========================================================================== */
@media (max-width: 991.98px) {
    body#order .cs-btn-continue,
    body#module-shoppingcart-payment .cs-btn-continue,
    body#module-shoppingcart-customer .cs-btn-continue {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: auto !important;
        margin: 0 !important;
        border-radius: 0 !important;
        z-index: 999;
        box-shadow: 0 -2px 14px rgba(26, 22, 17, 0.18);
    }

    /* Aby lišta nepřekryla konec stránky (souhlas, odkaz Zpět…).
       3. krok má CTA dvouřádkové, proto o kus víc. */
    body#order #page_container,
    body#module-shoppingcart-payment #page_container {
        padding-bottom: 76px;
    }
    body#module-shoppingcart-customer #page_container {
        padding-bottom: 96px;
    }

    /* Bublina "Napište nám" sedí vpravo dole — posunout nad lištu,
       jinak ji fixní CTA překryje. */
    body#order .chat-bubble,
    body#module-shoppingcart-payment .chat-bubble,
    body#module-shoppingcart-customer .chat-bubble {
        bottom: 74px;
    }
    body#order .prestaservis_chat_window .chat_content,
    body#module-shoppingcart-payment .prestaservis_chat_window .chat_content,
    body#module-shoppingcart-customer .prestaservis_chat_window .chat_content {
        bottom: 134px;
    }
}

/* ==========================================================================
   Klient 2026-07 (krok 1): uplatněná sleva v bílé kartě jako blok dárku
   --------------------------------------------------------------------------
   Bílý rámeček + zelený pruh "Sleva je aktivní" + řádky název / hodnota,
   aby uplatněný kupón nezanikl v béžové ploše panelu.
   ========================================================================== */
.cs-voucher-applied {
    /* .cs-block dodává bílé pozadí a padding – jen doplnit rozestup řádků */
    gap: 14px;
}
.cs-voucher-applied__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.cs-voucher-applied__row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--cs-line-soft, #EFE8DB);
}
.cs-voucher-applied__row:first-child {
    padding-top: 0;
}
.cs-voucher-applied__row:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.cs-voucher-applied__name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--cs-ink, #1A1611);
    overflow-wrap: anywhere;
}
.cs-voucher-applied__value {
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 700;
    color: var(--cs-accent-ok, #548A4B);
    white-space: nowrap;
}
.cs-voucher-applied__remove {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--cs-muted, #75695C);
    text-decoration: none;
    font-size: 18px;
    line-height: 1;
    border-radius: 50%;
    transition: color 0.15s ease, background 0.15s ease;
}
.cs-voucher-applied__remove:hover {
    color: var(--cs-accent-pending, #8B5E3C);
    background: rgba(0, 0, 0, 0.05);
}

/* ==========================================================================
   Klient 2026-07 (krok 2): doprava i platba jako klikací karty
   --------------------------------------------------------------------------
   Layout CSS gridem (spolehlivější než wrap-flex). Native radio schované,
   klik řeší celý <label>. Vybraná karta: oranžový rámeček + odznak "Vybráno".
   ========================================================================== */
.cs-ship-grid,
.cs-pay-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 8px;
    padding: 0;
    list-style: none;
}
.cs-ship-grid--packetery {
    margin-top: 12px;
}

/* Vybrané výdejní místo zobrazuje v kartě jednotně .cs-pickup-selected (plní ho
   server, po výběru ve widgetu custom-v2.js). Balíkovna si kreslí ještě vlastní
   řádek s toutéž adresou – schováme ho, ať tam adresa nesvítí dvakrát. Element
   ale musí zůstat v DOM, čte se z něj stav vybrané pobočky. */
.cs-ship-card__pickup .prestaservis_balikovna_selected {
    display: none !important;
}

/* Sloupce dopravy: vlevo doručení na adresu, vpravo výdejní místa a boxy.
   Karty jsou zabalené po sloupcích (ne sypané do gridu za sebou), takže
   rozdělení drží bez ohledu na pozice dopravců v BO. */
.cs-ship-col {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.cs-ship-card,
.cs-pay-card {
    position: relative;
    display: grid;
    grid-template-columns: 22px 60px 1fr auto;
    align-items: center;
    column-gap: 14px;
    row-gap: 0;
    padding: 15px 18px;
    background: #fff;
    border: 1px solid var(--cs-line, #E5DDD0);
    border-radius: 8px;
    cursor: pointer;
    margin: 0 !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
/* karty jen tak vysoké jak jejich obsah — nenatahovat na souseda v řádku */
.cs-ship-grid,
.cs-pay-grid {
    align-items: start;
}
.cs-pay-card {
    /* auto sloupec: každé logo dle svého poměru, název hned za ním */
    grid-template-columns: 22px auto 1fr auto;
}
.cs-ship-card:hover,
.cs-pay-card:hover {
    border-color: var(--cs-line-strong, #C7B9A5);
}

/* native radio schované — width/min-width !important kvůli globálnímu
   input[type=radio]{width:35px;min-width:35px} v custom.css */
.cs-ship-card > input[type="radio"],
.cs-pay-card > input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0 !important;
    min-width: 0 !important;
    height: 0;
    margin: 0;
    pointer-events: none;
}

/* vlastní kolečko radia */
.cs-ship-card__radio,
.cs-pay-card__radio {
    grid-column: 1;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    min-width: 20px;
    border-radius: 50%;
    border: 2px solid var(--cs-line-strong, #C7B9A5);
    background: #fff;
    position: relative;
    transition: border-color 0.15s ease;
}
.cs-ship-card > input:checked ~ .cs-ship-card__radio,
.cs-pay-card > input:checked ~ .cs-pay-card__radio {
    border-color: var(--cs-accent-primary, #B95D43);
}
.cs-ship-card > input:checked ~ .cs-ship-card__radio::after,
.cs-pay-card > input:checked ~ .cs-pay-card__radio::after {
    content: '';
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: var(--cs-accent-primary, #B95D43);
}

/* logo dopravce — pevný sloupec 60 px, zarovnané doleva */
.cs-ship-card__logo {
    grid-column: 2;
    width: auto;
    height: auto;
    max-width: 60px;
    max-height: 24px;
    object-fit: contain;
    object-position: left center;
}
/* ikona platby */
.cs-pay-card__icon {
    grid-column: 2;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    color: var(--cs-ink, #1A1611);
}
.cs-pay-card__icon svg {
    width: 26px;
    height: 26px;
}
/* oficiální logo platební metody (Comgate) v ikonovém sloupci */
.cs-pay-card__logo {
    height: 24px;
    width: auto;
    max-width: 96px;
    object-fit: contain;
    object-position: left center;
}

/* text karty */
.cs-ship-card__body {
    grid-column: 3;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cs-pay-card__name {
    grid-column: 3;
    min-width: 0;
}
.cs-ship-card__name,
.cs-pay-card__name {
    font-size: 14.5px;
    font-weight: 600;
    color: var(--cs-ink, #1A1611);
    line-height: 1.3;
}
.cs-ship-card__delay {
    font-size: 12.5px;
    color: var(--cs-muted, #75695C);
    line-height: 1.3;
}

/* cena vpravo */
.cs-ship-card__price,
.cs-pay-card__price {
    grid-column: 4;
    justify-self: end;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    color: var(--cs-ink, #1A1611);
}

/* odznak "Vybráno" — jen u vybrané karty */
.cs-ship-card__badge,
.cs-pay-card__badge {
    position: absolute;
    top: 8px;
    right: 10px;
    display: none;
    background: rgba(185, 93, 67, 0.12);
    color: var(--cs-accent-primary, #B95D43);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 9px;
    border-radius: 4px;
    line-height: 1.3;
}
/* Klient: u plateb žádný odznak "Vybráno" — výběr značí jen oranžový rámeček */
.cs-pay-card__badge {
    display: none !important;
}

/* výdejní místo (hook) — celá šířka, nový řádek, jen u vybrané karty */
.cs-ship-card__pickup {
    grid-column: 1 / -1;
    min-width: 0;
}
.cs-ship-card:not(:has(> input:checked)) .cs-ship-card__pickup {
    display: none;
}
/* Bílý panel u výdejního místa JEN když je pobočka skutečně vybraná — třídu
   cs-pickup--filled přidává custom.js (hasPickupSelected). Dřív se řídilo přes
   :has(*), jenže i skrytý #packeteryCache (Zásilkovna) nebo samotné tlačítko
   widgetu ho spouštěly prázdný. Panel se tak u dopravy "na adresu" ani před
   výběrem pobočky neukáže. */
.cs-ship-card__pickup.cs-pickup--filled,
#zasilkovna .zas-box.cs-pickup--filled {
    margin-top: 12px;
    background: #fff;
    padding: 12px 14px !important;
    border-radius: 6px;
    border: 1px solid var(--cs-line-soft, #EFE8DB);
}
/* tlačítko výběru pobočky bez cizích marginů z widgetu */
.cs-ship-card__pickup .pickup-btn,
.cs-ship-card__pickup .btn {
    margin: 0;
}

/* VYBRANÁ karta: oranžový rámeček + odznak */
.cs-ship-card:has(> input:checked),
.cs-pay-card:has(> input:checked) {
    border-color: var(--cs-accent-primary, #B95D43);
    box-shadow: inset 0 0 0 1px var(--cs-accent-primary, #B95D43);
    background: #fdf6f3;
}
.cs-ship-card:has(> input:checked) .cs-ship-card__badge,
.cs-pay-card:has(> input:checked) .cs-pay-card__badge {
    display: block;
}

/* skrytá dobírka u virtuálního košíku */
.cs-pay-card.paymentitem--hidden {
    display: none;
}

/* mobil: karty pod sebe */
@media (max-width: 767.98px) {
    .cs-ship-grid,
    .cs-pay-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   OPRAVA specificity: global.css `form.std label { display: block }` (0,1,2)
   přebíjelo .cs-ship-card/.cs-pay-card (0,1,0) → karty se rozpadaly do bloku
   a vlastní kolečko (inline span) ignorovalo šířku (tenká čárka). Prefix
   .shoppingcartpayment zvedne specificitu na 0,2,0 a grid vyhraje.
   ========================================================================== */
.shoppingcartpayment .cs-ship-card,
.shoppingcartpayment .cs-pay-card {
    display: grid;
}
.shoppingcartpayment .cs-ship-card__radio,
.shoppingcartpayment .cs-pay-card__radio,
.shoppingcartpayment .cs-ship-card__logo,
.shoppingcartpayment .cs-pay-card__icon,
.shoppingcartpayment .cs-ship-card__body,
.shoppingcartpayment .cs-pay-card__name,
.shoppingcartpayment .cs-ship-card__price,
.shoppingcartpayment .cs-pay-card__price {
    /* jistota, že grid-item spany nezůstanou blokové z form.std label span apod. */
    margin-bottom: 0;
}

/* Klient 2026-07: doladění velikosti jednotlivých log plateb (různý vizuál).
   Twisto (široký wordmark) menší, Apple/Google Pay (kompaktní značky) větší. */
.cs-pay-card__logo--LATER_TWISTO {
    height: 18px;
}
.cs-pay-card__logo--APPLEPAY_REDIRECT,
.cs-pay-card__logo--GOOGLEPAY_REDIRECT {
    height: 28px;
}

/* ==========================================================================
   Klient 2026-07 (krok 3): sekce jako karty s ikonami, 2sloupcová pole
   ========================================================================== */
#module-shoppingcart-customer .cs-checkout-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
#module-shoppingcart-customer .cs-form-card {
    background: #fff;
    border: 1px solid var(--cs-line, #E5DDD0);
    padding: 20px 22px;
}
#module-shoppingcart-customer .cs-form-card__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}
#module-shoppingcart-customer .cs-form-card__icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cs-accent-primary, #B95D43);
}
#module-shoppingcart-customer .cs-form-card__icon svg { width: 22px; height: 22px; }
#module-shoppingcart-customer .cs-form-card__head h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: var(--cs-ink, #1A1611);
}
#module-shoppingcart-customer .cs-form-card__req {
    margin-left: auto;
    font-size: 12.5px;
    color: var(--cs-muted, #75695C);
    white-space: nowrap;
}
#module-shoppingcart-customer .cs-req { color: #C0392B; font-weight: 700; }

#module-shoppingcart-customer .cs-field-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 16px;
}
#module-shoppingcart-customer .cs-field-grid > .text { margin: 0 0 0 0; }
#module-shoppingcart-customer .cs-form-card .text label {
    display: block;
    font-size: 13px;
    color: var(--cs-ink, #1A1611);
    margin-bottom: 4px;
}
#module-shoppingcart-customer .cs-form-card .text.required label:after {
    content: " *";
    color: #C0392B;
}
#module-shoppingcart-customer .cs-form-card .text input,
#module-shoppingcart-customer .cs-form-card textarea {
    width: 100%;
    box-sizing: border-box;
}
#module-shoppingcart-customer .cs-form-card textarea { min-height: 90px; }

#module-shoppingcart-customer .cs-checkline {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 14px 0 0;
    font-size: 14px;
    color: var(--cs-ink, #1A1611);
    cursor: pointer;
}
#module-shoppingcart-customer .cs-checkline input[type="checkbox"] {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px;
    margin: 0;
    flex-shrink: 0;
}
#module-shoppingcart-customer .delivery_address { margin-top: 14px; }
#module-shoppingcart-customer .cs-form-card__sub {
    margin: -8px 0 12px;
    font-size: 13px;
    color: var(--cs-muted, #75695C);
}

/* Firma — sbalovací karta */
#module-shoppingcart-customer .cs-form-card--toggle { padding: 0; }
#module-shoppingcart-customer .cs-form-card__toggle {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 18px 22px;
    cursor: pointer;
}
#module-shoppingcart-customer .cs-form-card__toggle input[type="checkbox"] {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px;
    margin: 0;
    flex-shrink: 0;
}
#module-shoppingcart-customer .cs-form-card__toggle-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--cs-ink, #1A1611);
}
#module-shoppingcart-customer .cs-form-card__chevron {
    margin-left: auto;
    display: flex;
    color: var(--cs-muted, #75695C);
    transition: transform 0.2s ease;
}
#module-shoppingcart-customer .cs-form-card__chevron svg { width: 18px; height: 18px; }
#module-shoppingcart-customer .cs-form-card--toggle:has(#show_company:checked) .cs-form-card__chevron {
    transform: rotate(180deg);
}
#module-shoppingcart-customer #company { padding: 0 22px 20px; }

/* mobil: pole pod sebe */
@media (max-width: 767.98px) {
    #module-shoppingcart-customer .cs-field-grid { grid-template-columns: 1fr; }
}

/* OPRAVA: staré #company_block #show_company_label { display:table } (3 ID)
   přebíjelo flex → ikona/checkbox/text se skládaly. Vyšší specificita. */
#module-shoppingcart-customer #company_block #show_company_label.cs-form-card__toggle {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 18px 22px;
}
/* Souhlas + tlačítko stejně široké jako shrnutí (460px), zarovnané vlevo */
body#module-shoppingcart-customer .order_terms_block {
    width: 100%;
    box-sizing: border-box;
    margin-top: 16px;
}

/* Klient: pryč šedé pozadí za platbami (style.css .paymentpart { background:#efefef }) */
#module-shoppingcart-payment .shoppingcartpayment .paymentpart {
    background: transparent !important;
    padding: 0 !important;
}

/* ==========================================================================
   Klient 2026-07: doladění 2. kroku dle návrhu
   ========================================================================== */
/* Nadpisy "Způsob dopravy" / "Způsob platby" vlevo, bez čar, menší (návrh) */
#module-shoppingcart-payment .checkout-grid__left .block__header {
    overflow: visible;
    padding-top: 0;
    margin-bottom: 16px;
}
#module-shoppingcart-payment .checkout-grid__left .block__header h2 {
    text-align: left;
    justify-content: flex-start;
    display: block;
    font-size: 18px;
    font-weight: 600;
    color: var(--cs-ink, #1A1611);
}
#module-shoppingcart-payment .checkout-grid__left .block__header h2 span:before,
#module-shoppingcart-payment .checkout-grid__left .block__header h2 span:after {
    display: none;
}
#module-shoppingcart-payment .checkout-grid__left .block__header--payment {
    margin-top: 8px;
}

/* Výdejní místo uvnitř vybrané karty jako jeden úhledný řádek: adresa vlevo,
   tlačítko "Vyberte/Změnit výdejní místo" vpravo (dle návrhu). */
.cs-ship-card__pickup {
    display: flex;
    align-items: center;
    gap: 10px 12px;
    flex-wrap: wrap;
}
/* Vybraná pobočka: adresa vlevo se špendlíkem, BEZ boxu a bez prefixu (návrh) */
.cs-ship-card__pickup .pickup-selected-info,
.cs-ship-card__pickup .prestaservis_balikovna_selected,
.cs-ship-card__pickup #selected-pickup-point,
.cs-ship-card__pickup #result_dpdparcelshop_zip_city,
.cs-ship-card__pickup #result_pplparcelshop_zip_city,
.cs-ship-card__pickup .result_dpdparcelshop {
    order: 1;
    flex: 1 1 200px;
    min-width: 0;
    margin: 0 !important;
    padding: 0 0 0 22px !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 13px;
    line-height: 1.35;
    color: var(--cs-ink, #1A1611);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B95D43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.3-7-11a7 7 0 0 1 14 0c0 4.7-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
    background-size: 16px 16px !important;
}
/* dlouhý prefix "Vybraná pobočka balíkovny:" schovat — návrh ukazuje jen adresu */
.cs-ship-card__pickup .prestaservis_balikovna_selected b {
    display: none;
}
/* tlačítko vpravo — obtažené (bílé, terakotový rámeček), ne plné (návrh) */
.cs-ship-card__pickup .pickup-btn,
.cs-ship-card__pickup .btn {
    order: 2;
    margin: 0;
    flex-shrink: 0;
    white-space: nowrap;
    background: #fff !important;
    color: var(--cs-accent-primary, #B95D43) !important;
    border: 1px solid var(--cs-accent-primary, #B95D43) !important;
    box-shadow: none !important;
    padding: 9px 16px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em;
}
.cs-ship-card__pickup .pickup-btn:hover,
.cs-ship-card__pickup .btn:hover {
    background: var(--cs-accent-primary, #B95D43) !important;
    color: #fff !important;
}

/* ==========================================================================
   Zásilkovna (packetery): widget front.js vkládá .zas-box (staré markup s
   <h3> a inline paddingem) přímo do <label id="zasilkovna">, takže se to
   rozpadalo do gridu karty ("rozhozený text"). Sjednotíme vzhled s ostatními
   výdejními místy: adresa vlevo se špendlíkem, obtažené tlačítko vpravo.
   ========================================================================== */
#zasilkovna .zas-box {
    grid-column: 1 / -1;
    margin-top: 12px;
    padding: 0 !important;
    display: flex;
    align-items: center;
    gap: 10px 12px;
    flex-wrap: wrap;
}
/* zobrazit jen když je karta vybraná (stejně jako .cs-ship-card__pickup) */
.cs-ship-card:not(:has(> input:checked)) .zas-box {
    display: none;
}
#zasilkovna .zas-box h3 {
    order: 2;
    margin: 0;
    padding: 0;
    font-size: inherit;
    font-weight: 400;
    line-height: 1;
}
#zasilkovna .zas-box #open-packeta-widget {
    margin: 0 !important;
    flex-shrink: 0;
    white-space: nowrap;
    background: #fff !important;
    color: var(--cs-accent-primary, #B95D43) !important;
    border: 1px solid var(--cs-accent-primary, #B95D43) !important;
    box-shadow: none !important;
    border-radius: 6px;
    padding: 9px 16px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em;
    text-transform: none;
}
#zasilkovna .zas-box #open-packeta-widget:hover {
    background: var(--cs-accent-primary, #B95D43) !important;
    color: #fff !important;
}
#zasilkovna .zas-box #selected-pickup-point {
    order: 1;
    flex: 1 1 200px;
    min-width: 0;
    /* font-size:0 skryje stray ": " text node po schovaném <b> prefixu;
       vlastní adresa (#picked-delivery-place) má normální velikost níže */
    font-size: 0;
    line-height: 1.35;
    color: var(--cs-ink, #1A1611);
    padding-left: 22px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B95D43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.3-7-11a7 7 0 0 1 14 0c0 4.7-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 16px 16px;
}
/* anglický prefix "Selected pickup point:" schovat — ukazujeme jen adresu */
#zasilkovna .zas-box #selected-pickup-point b {
    display: none;
}
#zasilkovna .zas-box #selected-pickup-point #picked-delivery-place {
    font-size: 13px;
    font-weight: 600;
}

/* ==========================================================================
   DPD / PPL: jejich JS vkládá vlastní "otevřít widget" tlačítko (<h3><span|button
   class="btn btn-primary" id="open-...-widget">) a adresu do .shippingtext. Tu
   třídu jsme přesunuli na .cs-ship-card__pickup, takže tlačítko i adresa teď
   spadnou DO panelu výdejního místa a stylují se jako Zásilkovna/Balíkovna:
   adresa vlevo se špendlíkem, obtažené tlačítko vpravo, bílý panel
   (cs-pickup--filled). Mapy se otevírají v modálu, v kartě je proto skryjeme.
   ========================================================================== */
#open-dpdparcelshop-widget,
#open-pplparcelshop-widget {
    order: 2;
    flex: 0 0 auto;
    margin: 0 !important;
    white-space: nowrap;
    background: #fff !important;
    color: var(--cs-accent-primary, #B95D43) !important;
    border: 1px solid var(--cs-accent-primary, #B95D43) !important;
    box-shadow: none !important;
    border-radius: 6px;
    padding: 9px 16px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em;
    line-height: 1.2 !important;
    text-transform: none;
    cursor: pointer;
}
#open-dpdparcelshop-widget:hover,
#open-pplparcelshop-widget:hover {
    background: var(--cs-accent-primary, #B95D43) !important;
    color: #fff !important;
}
/* <h3> obal kolem tlačítka „rozpustit" — tlačítko se stane přímým flex-childem
   panelu (a order:2 ho pošle doprava). */
.cs-ship-card__pickup h3 {
    display: contents;
}
/* Mapy widgetů se otevírají v modálu → v kartě je nezobrazovat. Scope na pickup:
   po přesunu do modálu (mimo pickup) selektor nesedí, tam mapa zůstane vidět. */
.cs-ship-card__pickup .mapa_iframe,
.cs-ship-card__pickup #vyhledejte_pobocku_dpdparcelshop,
.cs-ship-card__pickup #vyhledejte_pobocku_pplparcelshop,
.cs-ship-card__pickup #find_dpdparcelshop_zip_city,
.cs-ship-card__pickup #find_pplparcelshop_zip_city {
    display: none !important;
}
/* Balíkovna popup NEskrÝvat natvrdo — je to skutečný picker, který se otevírá
   po kliknutí na „Změnit výdejní místo" (má vlastní inline display:none a modul
   si ho sám zobrazí). Force-hide by výběr pobočky rozbil. */
/* Vybraná pobočka DPD/PPL (#result_..._zip_city, .chosen_branch_...) jako adresa
   se špendlíkem. PPL vkládá adresu i hned ZA panel — cílíme proto přes .cs-ship-card,
   ať vypadá stejně, ať skončí kdekoli. */
.cs-ship-card #result_dpdparcelshop_zip_city,
.cs-ship-card #result_pplparcelshop_zip_city,
.cs-ship-card .chosen_branch_dpdparcelshop,
.cs-ship-card .chosen_branch_pplparcelshop {
    order: 1;
    flex: 1 1 200px;
    min-width: 0;
    display: block;
    margin: 0 !important;
    padding: 0 0 0 22px !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 13px !important;
    line-height: 1.35;
    color: var(--cs-ink, #1A1611) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B95D43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.3-7-11a7 7 0 0 1 14 0c0 4.7-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: left 3px !important;
    background-size: 16px 16px !important;
}
/* PPL adresu vloženou hned za panel „vtáhnout" pod panel jako jeho pokračování
   (celá šířka karty), ať to drží pohromadě s bílým panelem výše. */
.cs-ship-card__pickup.cs-pickup--filled + #result_pplparcelshop_zip_city {
    grid-column: 1 / -1;
    margin-top: -6px !important;
    padding: 10px 14px 12px 36px !important;
    background-color: #fff !important;
    background-position: left 14px top 12px !important;
    border: 1px solid var(--cs-line-soft, #EFE8DB);
    border-top: 0;
    border-radius: 0 0 6px 6px;
}

/* ==========================================================================
   Klient 2026-07: čisté formátování bloku souhlasu (3. krok)
   Přebíjí modulové style.css (font-weight:800 na labelu, float:right na <p>).
   Scope .checkout-grid__right kvůli specificitě.
   ========================================================================== */
#module-shoppingcart-customer .checkout-grid__right .order_terms_block {
    background: var(--cs-bg-summary, #FAF8F5);
    padding: 18px 20px;
}
/* Zboží.cz souhlas: checkbox + popisek na řádku, normální velikost (ne obří tučný) */
#module-shoppingcart-customer .checkout-grid__right .order_terms_block .shaim_zbozi_checkbox {
    display: flex !important;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 14px;
    width: 100%;
    float: none;
}
#module-shoppingcart-customer .checkout-grid__right .order_terms_block .shaim_zbozi_checkbox input[type="checkbox"] {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px;
    margin: 2px 0 0 !important;
    padding: 0 !important;
    top: 0 !important;
    position: static !important;
    vertical-align: top;
}
#module-shoppingcart-customer .checkout-grid__right .order_terms_block .shaim_zbozi_checkbox label {
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 400;
    font-size: 13px;
    line-height: 1.45;
    color: var(--cs-ink, #1A1611);
    display: block;
    float: none;
    margin: 0;
    padding: 0;
}
/* informativní text — normální tok, decentní */
#module-shoppingcart-customer .checkout-grid__right .order_terms_block p,
#module-shoppingcart-customer .checkout-grid__right .order_terms_block .order_terms_note {
    float: none !important;
    width: auto !important;
    display: block;
    font-size: 12.5px;
    color: var(--cs-muted, #75695C);
    line-height: 1.5;
    margin: 0 0 14px;
}
#module-shoppingcart-customer .checkout-grid__right .order_terms_block .order_terms_note a {
    color: var(--cs-ink, #1A1611);
    text-decoration: underline;
}
#module-shoppingcart-customer .checkout-grid__right .order_terms_block .order_terms_note .bottom {
    display: block;
    margin-top: 6px;
}

/* Klient: mezera mezi odznakem VYBRÁNO a cenou ZDARMA u vybrané karty dopravy.
   Cena se u vybrané karty zarovná nahoru a posune pod odznak. */
.cs-ship-card:has(> input:checked) .cs-ship-card__price {
    align-self: start;
    margin-top: 34px;
}