/* =========================================================================
   Doppler klub LP — landing page styling
   Scope: body.in-doppler-klub (stranka /doppler-klub/)
   Prefix: .roi-klub-*
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Override default Shoptet elementu
   ------------------------------------------------------------------------- */

/* Skryt default H1 "Doppler klub" v article > header */
body.in-doppler-klub article.pageArticleDetail > header {
    display: none;
}

/* Skryt default Shoptet breadcrumbs (nahradime vlastnimi v banneru) */
body.in-doppler-klub > .overall-wrapper #content-wrapper > .breadcrumbs {
    display: none;
}

/* Banner sedne na header — zrusit horni padding content-wrapperu */
body.in-doppler-klub #content-wrapper {
    padding-top: 0;
}

/* Article nesmi mit overflow-x clip ktery by branil banneru break out */
body.in-doppler-klub article.pageArticleDetail {
    overflow: visible;
}

/* Clip horizontalni scroll na cele strance — Shoptet legacy navigation-in menu
   se pozicuje daleko vpravo (x ~180k px), bez clipu vznika obrovsky horiz scroll. */
body.in-doppler-klub {
    overflow-x: clip;
}

/* Roztahnout content-inner na plnou sirku (default je max-width 1170px) — jen na /doppler-klub/.
   Banner se stejne breakoutuje, ale perks sekce a dalsi obsah ma vetsi prostor. */
@media (min-width: 1200px) {
    body.in-doppler-klub .content-inner {
        max-width: 100%;
    }
}

/* -------------------------------------------------------------------------
   2. LP root wrapper
   ------------------------------------------------------------------------- */

body.in-doppler-klub .roi-klub-lp {
    font-family: 'Poppins', sans-serif;
    color: #1a1a1a;
}

/* -------------------------------------------------------------------------
   3. Banner (hero) — full-width breakout

   Stranka /doppler-klub/ ma .content-inner s max-width:1170px ktera neni
   centrovana v parentu (left-aligned). Klasicky trik s calc(50% - 50vw)
   na ::before tedy nedosahne na pravy okraj viewportu.

   Reseni: roztahnout cely .roi-klub-hero element pres viewport via negativni
   margin -50vw + padding 50vw (content uvnitr je tahnuty zpet do __inner
   maxwidth 1200). Body ma overflow-x: clip ktery oclipnu pretekajici 100vw
   element bez horizontalniho scrollu.
   ------------------------------------------------------------------------- */

.roi-klub-hero {
    position: relative;
    isolation: isolate;
    margin-left: -50vw;
    margin-right: -50vw;
    padding: 32px 50vw 80px 50vw;
    margin-bottom: 60px;
    background: #F7E2BF;
    overflow: hidden;
}

.roi-klub-hero__bg-k {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 487px;
    height: 765px;
    background: url('/user/documents/upload/webotvurci/doppler-klub-imgs/doppler-klub-lp-design.svg') center bottom / contain no-repeat;
    z-index: 0;
    pointer-events: none;
}

.roi-klub-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

/* -------------------------------------------------------------------------
   4. Breadcrumbs uvnitr banneru
   ------------------------------------------------------------------------- */

.roi-klub-breadcrumbs {
    font: 400 14px/1.5 'Roboto', sans-serif;
    color: #6b6b6b;
    margin-bottom: 80px;
}

.roi-klub-breadcrumbs a {
    color: #6b6b6b;
    text-decoration: none;
}

.roi-klub-breadcrumbs a:hover {
    text-decoration: underline;
}

.roi-klub-breadcrumbs__sep {
    margin: 0 8px;
    color: #6b6b6b;
}

/* -------------------------------------------------------------------------
   5. Banner 2-col layout: main + steps
   ------------------------------------------------------------------------- */

.roi-klub-hero__cols {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 80px;
    align-items: start;
}

/* -------------------------------------------------------------------------
   6. Banner — levy sloupec (logo, title, lead, CTA)
   ------------------------------------------------------------------------- */

.roi-klub-hero__logo {
    display: block;
    height: 45px;
    width: auto;
    margin-bottom: 32px;
}

.roi-klub-hero__title {
    /* Default 400 — bold casti jsou v <strong> */
    font: 400 50px/1.5 'Poppins', sans-serif;
    color: #1a1a1a;
    margin: 0 0 24px;
}

.roi-klub-hero__title strong {
    font-weight: 700;
}

.roi-klub-hero__lead {
    font: 400 20px/1.5 'Poppins', sans-serif;
    color: #1a1a1a;
    margin: 0 0 40px;
    max-width: 620px;
}

.roi-klub-hero__lead strong {
    font-weight: 700;
}

.roi-klub-hero__cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #000;
    color: #fff;
    padding: 18px 32px;
    font: 600 18px/1 'Poppins', sans-serif;
    text-decoration: none;
    transition: background-color .2s ease, transform .2s ease;
}

.roi-klub-hero__cta:hover {
    background: #1a1a1a;
    color: #fff;
    transform: translateY(-1px);
    text-decoration: none;
}

.roi-klub-hero__cta-arrow {
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url('/user/documents/upload/webotvurci/doppler-klub-imgs/arrow-right-ico.png') center / contain no-repeat;
    /* Skrýt text › který je v HTML jako fallback */
    font-size: 0;
    color: transparent;
    line-height: 1;
}

/* -------------------------------------------------------------------------
   7. Banner — pravy sloupec (kroky 01 / 02)
   ------------------------------------------------------------------------- */

.roi-klub-hero__steps {
    list-style: none;
    padding: 0;
    margin: 8px 0 0;
    display: flex;
    flex-direction: column;
    gap: 48px;
}

/* Override legacy Shoptet ol li::before counter
   (ten generuje cervene kruhy s cislem pred polozkami). */
.roi-klub-hero__steps li::before {
    content: none !important;
    display: none !important;
    background: none !important;
}

.roi-klub-step {
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 16px;
    align-items: start;
}

.roi-klub-step__num {
    font: 700 32px/1 'Poppins', sans-serif;
    color: #A72C3A;
}

.roi-klub-step__title {
    font: 700 22px/1.2 'Poppins', sans-serif;
    color: #1a1a1a;
    margin: 0 0 12px;
}

.roi-klub-step__text {
    font: 400 15px/1.5 'Roboto', sans-serif;
    color: #1a1a1a;
    margin: 0;
}

.roi-klub-step__text a {
    color: #A72C3A;
    text-decoration: underline;
}

.roi-klub-step__text a:hover {
    text-decoration: none;
}

/* -------------------------------------------------------------------------
   8. Sekce 6 vyhod (perks)
   ------------------------------------------------------------------------- */

.roi-klub-perks {
    padding: 40px 0 80px;
}

.roi-klub-perks__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

.roi-klub-perks__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px 80px;
}

.roi-klub-perk {
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: 24px;
    align-items: start;
}

.roi-klub-perk__icon {
    width: auto;
    height: auto;
    display: block;
    background: #A72C3A;
    /* Padding kolem nat. velikosti ikony — celkovy box ~60px, ikona uvnitr 22-30px */
    padding: 19.5px;
    box-sizing: content-box;
}

.roi-klub-perk__body {
    display: flex;
    flex-direction: column;
}

.roi-klub-perk__kicker {
    font: 400 16px/1.4 'Poppins', sans-serif;
    color: #A72C3A;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
}

.roi-klub-perk__title {
    font: 700 25px/1.4 'Poppins', sans-serif;
    color: #1a1a1a;
    margin: 0 0 12px;
}

.roi-klub-perk__text {
    font: 400 16px/1.5 'Poppins', sans-serif;
    color: #454545;
    margin: 0;
}

.roi-klub-perk__text strong {
    font-weight: 700;
    color: #1a1a1a;
}

/* -------------------------------------------------------------------------
   9. Responsive — tablet (max 991px)
   ------------------------------------------------------------------------- */

@media (max-width: 991px) {
    .roi-klub-hero {
        padding: 48px 50vw 64px 50vw;
    }

    .roi-klub-hero__cols {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .roi-klub-hero__title {
        font-size: 40px;
    }

    .roi-klub-hero__lead {
        font-size: 18px;
    }

    .roi-klub-hero__bg-k {
        width: 380px;
        height: 600px;
        opacity: 0.6;
    }

    .roi-klub-perks__grid {
        gap: 40px 48px;
    }
}

/* -------------------------------------------------------------------------
   10. Responsive — mobil (max 767px)
   ------------------------------------------------------------------------- */

@media (max-width: 767px) {
    /* 2026-05-17 (Lubomir feedback): zvetsit top spacing aby logo neslo hned
       za searchbar; zmensit ikonky perks aby mobile layout dychal. */
    .roi-klub-hero {
        padding: 48px 50vw 48px 50vw;
        margin-bottom: 40px;
    }

    .roi-klub-hero__inner {
        padding: 0 16px;
        padding-top: 64px;
    }

    .roi-klub-breadcrumbs {
        margin-bottom: 20px;
        font-size: 13px;
    }

    .roi-klub-hero__logo {
        height: 34px;
        margin-bottom: 20px;
    }

    .roi-klub-hero__title {
        font-size: 32px;
        margin-bottom: 16px;
    }

    .roi-klub-hero__lead {
        font-size: 17px;
        margin-bottom: 32px;
    }

    .roi-klub-hero__cta {
        padding: 14px 24px;
        font-size: 16px;
        width: 100%;
        justify-content: center;
    }

    .roi-klub-hero__steps {
        gap: 32px;
    }

    .roi-klub-step {
        grid-template-columns: 40px 1fr;
        gap: 12px;
    }

    .roi-klub-step__num {
        font-size: 24px;
    }

    .roi-klub-step__title {
        font-size: 19px;
    }

    .roi-klub-hero__bg-k {
        width: 280px;
        height: 440px;
        opacity: 0.45;
        transform: translateX(-50%);
    }

    .roi-klub-perks {
        padding: 24px 0 48px;
    }

    .roi-klub-perks__inner {
        padding: 0 16px;
    }

    .roi-klub-perks__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .roi-klub-perk {
        grid-template-columns: 44px 1fr;
        gap: 14px;
    }

    /* Ikony perks — zmenseno z desktop ~60x60 (content-box width:auto+padding:19.5)
       na mobile total 44x44 (border-box). Base ma box-sizing: content-box, na mobile
       override na border-box aby width 44 zahrnula padding 8 -> image 28x28 inside. */
    .roi-klub-perk__icon {
        width: 44px;
        height: 44px;
        padding: 8px;
        box-sizing: border-box;
    }

    .roi-klub-perk__kicker {
        font-size: 13px;
        margin-bottom: 4px;
    }

    .roi-klub-perk__title {
        font-size: 20px;
        margin-bottom: 6px;
    }

    .roi-klub-perk__text {
        font-size: 15px;
        line-height: 1.5;
    }
}

/* =========================================================================
   SEKCE 11 — PDP klub (body.type-detail)
   Banner pro non-member, member-info pro Klub clena, return-info, warranty.
   Prefix: .roi-pd-klub-*
   ========================================================================= */

/* ---------- 11.1 Price-info (non-member) ----------
   Default INLINE napravo od ceny uvnitr .price-final. --below modifier
   vyuziva block-level row pod cenou s duplikatni cenou na zacatku. */
.roi-pd-klub-price-info {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 12px;
    font: 400 16px/1.4 'Poppins', sans-serif !important;
    font-weight: 400 !important;
    color: #1a1a1a !important;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
}
.roi-pd-klub-price-info--below {
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 0;
    margin: 12px 0 16px;
    flex: 0 0 auto;
    justify-content: flex-start;
}
.roi-pd-klub-price-info__price {
    color: #A72C3A;
    font-weight: 700 !important;
    font-size: 18px;
}
.roi-pd-klub-price-info__pct {
    color: #A72C3A;
    font-weight: 700 !important;
}
.roi-pd-klub-price-info__logo {
    height: 20px;
    width: auto;
    margin-left: 4px;
}

/* ---------- 11.2 Banner (cream + K bg + 2-col features + CTA) ---------- */
.roi-pd-klub-banner-wrapper {
    margin: 0 0 16px;
}
.roi-pd-klub-banner {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 16px 24px;
    padding: 16px 20px;
    background: #F7E2BF;
    border-radius: 4px;
    flex-wrap: wrap;
}
.roi-pd-klub-banner__bg-k {
    position: absolute;
    top: 50%;
    left: 40%;
    transform: translate(-50%, -50%);
    width: 220px;
    height: 300px;
    background: url('/user/documents/upload/webotvurci/doppler-klub-imgs/doppler-klub-lp-design.svg') center / contain no-repeat;
    opacity: 0.28;
    pointer-events: none;
    z-index: 0;
}
.roi-pd-klub-banner__features {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 6px;
    flex: 1 1 100%;
    min-width: 0;
}
@media (min-width: 1200px) {
    .roi-pd-klub-banner {
        flex-wrap: nowrap;
    }
    .roi-pd-klub-banner__features {
        flex: 1 1 auto;
    }
}
.roi-pd-klub-banner__col {
    position: relative;
    z-index: 1;
    list-style: none;
    padding: 0;
    margin: 0;
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.roi-pd-klub-banner__col li {
    position: relative;
    display: block;
    padding-left: 24px;
    font: 400 14px/1.4 'Poppins', sans-serif;
    color: #1a1a1a;
}
.roi-pd-klub-banner__col li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.25em;
    width: 16px;
    height: 16px;
    background: url('/user/documents/upload/webotvurci/doppler-klub-imgs/check-ico.svg') center / contain no-repeat;
}
.roi-pd-klub-banner__col li strong {
    font-weight: 700;
}
.roi-pd-klub-banner__cta-link {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
    text-decoration: none;
    font: 400 12px/1.4 'Poppins', sans-serif;
    color: #1a1a1a;
    gap: 4px;
    margin-left: auto;
    transition: opacity .2s ease;
}
.roi-pd-klub-banner__cta-link:hover {
    text-decoration: none;
    color: #1a1a1a;
    opacity: 0.85;
}
.roi-pd-klub-banner__cta-link strong {
    font: 700 16px/1.3 'Poppins', sans-serif;
    color: #A72C3A;
    white-space: nowrap;
}

/* ---------- 11.3 Shipping row (table left, return info right) ---------- */
.roi-pd-klub-shipping-row {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 16px;
    width: 100%;
    flex-wrap: nowrap;
    padding: 20px 0;
}
.roi-pd-klub-shipping-row > .detail-parameters.shipping-options-layout {
    flex: 1 1 auto;
    margin: 0;
}
.roi-pd-klub-return-info {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #A72C3A;
    font: 700 14px/1.4 'Poppins', sans-serif;
    white-space: nowrap;
    flex: 0 0 auto;
}
.roi-pd-klub-return-info__icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

/* ---------- 11.4 Záruka bonus "+ 1 rok s DopplerKlubem" ---------- */
.roi-pd-klub-warranty-bonus {
    color: #A72C3A;
    font-weight: 700;
}

/* ---------- 11.5 Member variant (inline next to price) ----------
   Override legacy .price-final-holder:nth-last-child(2){display:none} pres :has() */
.type-detail .price-final:has(.roi-pd-klub-member-info) {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 16px !important;
}
.type-detail .price-final:has(.roi-pd-klub-member-info) > .price-final-holder {
    display: inline-block !important;
    flex: 0 0 auto;
}
.roi-pd-klub-member-wrapper {
    margin: 12px 0 16px;
}
.roi-pd-klub-member-info {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 12px;
    font: 400 16px/1.4 'Poppins', sans-serif !important;
    font-weight: 400 !important;
    color: #1a1a1a !important;
    text-shadow: none;
    flex: 0 0 auto;
}
.roi-pd-klub-member-info__text strong {
    font-weight: 700 !important;
}
.roi-pd-klub-member-info__logo {
    height: 20px;
    width: auto;
    margin-left: 4px;
}

/* ---------- 11.6 Delivery time styling (POZOR — pulze patri do
   product-detail-style.css. Zatim drzime tady; pri budoucim cleanup-u
   se to presune do PDP CSS. User explicit confirmoval (option B). */
.type-detail .delivery-time span {
    font-family: Poppins, sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
    color: #20B284 !important;
    text-decoration: underline !important;
    text-decoration-color: #20B284 !important;
    text-underline-offset: 1px !important;
    margin-left: 0px;
}

/* ---------- 11.7 PDP Responsive (mobile) ---------- */
@media (max-width: 767px) {
    .roi-pd-klub-banner {
        flex-wrap: wrap;
        gap: 12px 16px;
        padding: 16px;
    }
    .roi-pd-klub-banner__features {
        grid-template-columns: 1fr;
    }
    .roi-pd-klub-banner__cta-link {
        margin-left: auto;
        align-items: flex-end;
        text-align: right;
    }
    .roi-pd-klub-banner__bg-k {
        opacity: 0.18;
        width: 160px;
        height: 220px;
    }
    .roi-pd-klub-member-info,
    .roi-pd-klub-price-info {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-end;
        flex-wrap: wrap;
        gap: 8px;
        padding-top: 8px;
        font: 400 14px/1.4 'Poppins', sans-serif !important;
        font-weight: 400 !important;
        color: #1a1a1a !important;
        text-shadow: none;
        flex: 0 0 auto;
    }
    .type-detail .price-final:has(.roi-pd-klub-price-info) {
        justify-content: space-between !important;
    }
    .roi-pd-klub-shipping-row {
        flex-wrap: wrap;
        justify-content: space-between;
    }
}

/* =========================================================================
   SEKCE 12 — Registrace klub (body.in-registrace)
   Intro "Vytvorit ucet" + lead + banner invite/member + extras pole.
   Prefix: .roi-reg-*
   ========================================================================= */

/* ---------- 12.1 Skryt default Shoptet H1 "Registrace" ---------- */
body.in-registrace h1.roi-reg-original-hidden {
    display: none !important;
}

/* ---------- 12.2 Intro wrapper + title + lead ---------- */
.roi-reg-intro {
    max-width: 100%;
    margin: 0 0 40px;
    font-family: "Poppins", sans-serif;
    color: #1a1a1a;
    text-align: center;
}
.roi-reg-intro__title {
    font: 600 36px/43.2px "Poppins", sans-serif !important;
    letter-spacing: 0.5px !important;
    color: #A72C3A !important;
    text-align: center !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
}
.roi-reg-intro__lead {
    font: 400 20px/1.5 "Poppins", sans-serif;
    letter-spacing: 0;
    color: #1a1a1a;
    margin: 0 0 32px;
    text-align: center;
}
.roi-reg-intro__lead strong { font-weight: 700; }

/* ---------- 12.3 Banner (sdileny zaklad pro invite + member) ---------- */
.roi-reg-klub-banner {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: linear-gradient(180deg, #F8E6C7 0%, #F8E6C7 31%, #FBF1DB 100%);
    border: 1px solid #F8E6C7;
    border-radius: 4px;
    padding: 40px 32px;
    text-align: center;
    margin: 0 0 8px;
}
.roi-reg-klub-banner__bg-k {
    position: absolute;
    top: 0; right: -40px; bottom: 0;
    width: 320px;
    background: url("/user/documents/upload/webotvurci/doppler-klub-imgs/doppler-klub-lp-design.svg") right center / contain no-repeat;
    opacity: 0.55;
    pointer-events: none;
    z-index: 0;
}
.roi-reg-klub-banner > *:not(.roi-reg-klub-banner__bg-k) {
    position: relative;
    z-index: 1;
}
.roi-reg-klub-banner__logo {
    display: block;
    height: 32px;
    width: auto;
    margin: 0 auto 20px;
}

/* State toggle: kazda varianta zobrazena jen ve svem state */
.roi-reg-intro[data-state="invite"] .roi-reg-klub-banner--member { display: none !important; }
.roi-reg-intro[data-state="member"] .roi-reg-klub-banner--invite { display: none !important; }

/* ---------- 12.4 Invite varianta (non-member) ---------- */
.roi-reg-klub-banner--invite .roi-reg-klub-banner__heading {
    font: 600 25px/1.5 "Poppins", sans-serif !important;
    letter-spacing: 0 !important;
    color: #1a1a1a !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    text-align: center !important;
}
.roi-reg-klub-banner--invite .roi-reg-klub-banner__lead {
    font: 400 16px/1.5 "Poppins", sans-serif;
    letter-spacing: 0;
    color: #1a1a1a;
    margin: 0 auto 24px;
    max-width: 520px;
}
.roi-reg-klub-banner--invite .roi-reg-klub-banner__lead strong { font-weight: 700; }
.roi-reg-klub-banner__lead-klub { color: #A72C3A; font-weight: 700; }
.roi-reg-klub-banner__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font: 600 18px/1.4 "Poppins", sans-serif;
    color: #A72C3A;
    /* text-decoration JE na child <span> s textem, NE na celem flex parent
       (jinak podtrzeni jde i pod sipku — vypada blbe) */
    text-decoration: none;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    appearance: none;
}
.roi-reg-klub-banner__cta > span:not(.roi-reg-klub-banner__cta-arrow) {
    text-decoration: underline;
    text-underline-offset: 4px;
}
.roi-reg-klub-banner__cta:hover,
.roi-reg-klub-banner__cta:focus {
    color: #A72C3A;
    opacity: 0.8;
    text-decoration: none;
}
.roi-reg-klub-banner__cta:hover > span:not(.roi-reg-klub-banner__cta-arrow),
.roi-reg-klub-banner__cta:focus > span:not(.roi-reg-klub-banner__cta-arrow) {
    text-decoration: underline;
}
.roi-reg-klub-banner__cta-arrow {
    font-size: 28px;
    line-height: 1;
    text-decoration: none;
    /* mikro posun nahoru aby vizualne sedel s textem (cifry chevron jsou
       optikalne nizko proti baseline) */
    margin-top: -2px;
}

/* ---------- 12.5 Member varianta ("Jake vyhody na vas cekaji" + 6 perks) ---------- */
.roi-reg-klub-banner--member {
    padding: 48px 40px;
}
.roi-reg-klub-banner--member .roi-reg-klub-banner__heading {
    font: 600 25px/1.5 "Poppins", sans-serif !important;
    letter-spacing: 0 !important;
    color: #1a1a1a !important;
    margin: 0 0 32px !important;
    padding: 0 !important;
    text-align: center !important;
}
.roi-reg-klub-perks {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 40px;
    max-width: 640px;
}
.roi-reg-klub-perk {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: 16px;
    align-items: center;
    text-align: left;
}
.roi-reg-klub-perk__icon {
    width: 46px;
    height: 46px;
    background: #A72C3A;
    padding: 12px;
    box-sizing: border-box;
    display: block;
    object-fit: contain;
}
.roi-reg-klub-perk__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.roi-reg-klub-perk__title {
    font: 700 17px/1.3 "Poppins", sans-serif;
    color: #1a1a1a;
}
.roi-reg-klub-perk__kicker {
    font: 600 12px/1.3 "Poppins", sans-serif;
    color: #A72C3A;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ---------- 12.6 Form pulse highlight po kliku CTA ---------- */
@keyframes roi-reg-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(167, 44, 58, 0.55); }
    50%  { box-shadow: 0 0 0 16px rgba(167, 44, 58, 0); }
    100% { box-shadow: 0 0 0 0 rgba(167, 44, 58, 0); }
}
#register-form.roi-reg-highlight {
    animation: roi-reg-pulse 1.6s ease-out;
    border-radius: 8px;
}

/* ---------- 12.6b Souhlas s podminkami — cervene odkazy (brand red) ----------
   Tri linky v <span class="required-asterisk"> uvnitr <label for="consents*">:
   "Obchodnimi podminkami", "Podminkami vernostniho programu DopplerKlub",
   "Podminkami ochrany osobnich udaju". Dle Figmy maji byt brand red, ne
   default Shoptet color. */
body.in-registrace #register-form label[for^="consents"] a {
    color: #A72C3A;
    text-decoration: underline;
    text-underline-offset: 2px;
}
body.in-registrace #register-form label[for^="consents"] a:hover,
body.in-registrace #register-form label[for^="consents"] a:focus {
    color: #A72C3A;
    opacity: 0.85;
    text-decoration: underline;
}

/* ---------- 12.7 Extra pole (jmeno + datum narozeni) v MEMBER state ---------- */
.roi-reg-personal-extras { display: contents; }
.roi-reg-personal-extras .form-group[data-roi-reg-hint] {
    position: relative;
}
.roi-reg-personal-extras .form-group[data-roi-reg-hint] input.form-control {
    padding-right: 220px;
    margin-bottom: 20px !important;
}
.roi-reg-personal-extras .form-group[data-roi-reg-hint]::after {
    content: attr(data-roi-reg-hint);
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    font: 400 15px/1 "Poppins", sans-serif;
    color: #20B284;
    pointer-events: none;
    white-space: nowrap;
}
.roi-reg-birth-fg input.form-control { width: 100%; }

/* ---------- 12.8 Registrace Responsive ---------- */
@media (max-width: 600px) {
    .roi-reg-personal-extras .form-group[data-roi-reg-hint] input.form-control {
        padding-right: 16px;
        margin-bottom: 0 !important;
    }
    .roi-reg-personal-extras .form-group[data-roi-reg-hint] {
        margin-bottom: 24px;
    }
    .roi-reg-personal-extras .form-group[data-roi-reg-hint]::after {
        position: static;
        transform: none;
        display: block;
        margin-top: 12px;
        text-align: right;
        line-height: 1.4;
    }
}
@media (max-width: 767px) {
    .roi-reg-intro__title { font-size: 28px !important; line-height: 1.2 !important; }
    .roi-reg-intro__lead { font-size: 17px; }
    .roi-reg-klub-banner { padding: 32px 20px; }
    .roi-reg-klub-banner__bg-k { width: 200px; right: -30px; opacity: 0.35; }
    .roi-reg-klub-banner--invite .roi-reg-klub-banner__heading,
    .roi-reg-klub-banner--member .roi-reg-klub-banner__heading { font-size: 22px !important; }
    .roi-reg-klub-banner__cta { font-size: 16px; }
    .roi-reg-klub-banner--member { padding: 36px 24px; }
    .roi-reg-klub-perks {
        grid-template-columns: 1fr;
        gap: 16px;
        max-width: 360px;
    }
}

/* =========================================================================
   SEKCE 13 — Login modal klub banner
   Banner vpravo od login formu (desktop) nebo pod (mobile).
   Prefix: .roi-klub-login-*
   ========================================================================= */

/* ---------- 13.1 Login modal 2-col layout ---------- */
#login.popup-widget #customerLogin {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 24px;
}
#login.popup-widget .roi-klub-login-left {
    flex: 1 1 320px;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
#login.popup-widget .roi-klub-login-left > h2#loginHeading {
    margin-top: 0;
}
#login.popup-widget .roi-klub-login-left > form {
    flex: 0 0 auto;
}

/* ---------- 13.2 Banner (right column) ---------- */
.roi-klub-login-banner {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    flex: 0 0 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    padding: 16px 24px 24px;
    background: #F7E2BF;
    border-radius: 4px;
    text-align: center;
}
.roi-klub-login-banner__bg-k {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 280px;
    height: 360px;
    background: url('/user/documents/upload/webotvurci/doppler-klub-imgs/doppler-klub-lp-design.svg') center / contain no-repeat;
    opacity: 0.22;
    pointer-events: none;
    z-index: 0;
}
.roi-klub-login-banner__badge {
    position: relative;
    z-index: 2;
    align-self: center;
    margin-bottom: 8px;
    padding: 4px 12px;
    background: #A72C3A;
    color: #FFFFFF;
    font: 700 11px/1 'Poppins', sans-serif;
    letter-spacing: 0.5px;
    border-radius: 999px;
    text-transform: uppercase;
}
.roi-klub-login-banner__logo {
    position: relative;
    z-index: 1;
    width: auto;
    height: 28px;
    margin: 0 0 8px;
}
.roi-klub-login-banner__main {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    margin: 0;
}
.roi-klub-login-banner__pct {
    font: 700 76px/0.95 'Poppins', sans-serif;
    color: #A72C3A;
    letter-spacing: -2px;
    margin: 0;
}
.roi-klub-login-banner__shipping {
    margin: 0;
    font: 700 16px/1.2 'Poppins', sans-serif;
    color: #A72C3A;
    letter-spacing: 0.4px;
}
.roi-klub-login-banner__shipping strong { font-weight: 700; }
.roi-klub-login-banner__shipping .light {
    color: #A72C3A;
    font-weight: 400;
    opacity: 0.85;
}
.roi-klub-login-banner__sub {
    position: relative;
    z-index: 1;
    margin: 4px 0 8px;
    font: 400 14px/1.4 'Poppins', sans-serif;
    color: #1a1a1a;
}
.roi-klub-login-banner__cta {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: #1a1a1a;
    color: #FFFFFF;
    text-decoration: none;
    font: 700 14px/1 'Poppins', sans-serif;
    border-radius: 4px;
    transition: background 0.2s ease;
}
.roi-klub-login-banner__cta:hover,
.roi-klub-login-banner__cta:focus {
    background: #000000;
    color: #FFFFFF;
    text-decoration: none;
}
.roi-klub-login-banner__cta-arrow {
    font-size: 16px;
    line-height: 1;
}

/* ---------- 13.3 Login Responsive (mobile <= 767px) ---------- */
@media (max-width: 767px) {
    #login.popup-widget #customerLogin {
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 16px;
    }
    #login.popup-widget .roi-klub-login-left {
        flex: 0 0 auto;
        width: 100%;
    }
    .roi-klub-login-banner {
        flex: 0 0 auto;
        width: 100%;
        padding: 28px 20px 24px;
    }
    .roi-klub-login-banner__pct {
        font-size: 96px;
    }
}

/* =========================================================================
   SEKCE 14 — Checkout shipping toggle (URL /objednavka/) — SK MUTACE
   Klub member -> schovat #shipping-29 (4,03 €), ponechat #shipping-98 (ZADARMO)
   Non-klub -> schovat #shipping-98, ponechat #shipping-29
   Body class .roi-klub-active spravuje JS modul (initCheckoutKlub).
   SK ma jine ID nez CZ (CZ: 89, SK: 98) — viz doppler-klub-script-sk.js
   roiKlub.SHIPPING_ID_KLUB = 98.
   ========================================================================= */

body.roi-klub-active #shipping-29 {
    display: none !important;
}
body:not(.roi-klub-active) #shipping-98 {
    display: none !important;
}

/* =========================================================================
   SEKCE 15 — Category banner (body.type-category)
   Promo banner v produktovem gridu #products:
     - Desktop: 4. polozka (po 3. produktu)
     - Mobile:  3. polozka (po 2. produktu)
   Velikost banneru = velikost produkt card (CSS vars nastavuje JS).
   2 varianty: --member (zjistit vice) / non-member (chci se registrovat).
   Prefix: .roi-klub-cat-*
   ========================================================================= */

.roi-klub-cat-banner {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    flex: 0 0 auto;
    box-sizing: border-box;
    width: var(--roi-klub-cat-banner-w, 266.5px);
    min-height: var(--roi-klub-cat-banner-h, 464.5px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 20px;
    background: #F7E2BF;
    border-radius: 0;
    text-align: center;
    color: #1a1a1a;
}

/* "K" dekorativni background SVG */
.roi-klub-cat-banner__bg-k {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 320px;
    height: 420px;
    background: url('/user/documents/upload/webotvurci/doppler-klub-imgs/doppler-klub-lp-design.svg') center / contain no-repeat;
    opacity: 0.22;
    pointer-events: none;
    z-index: 0;
}

/* NOVINKA badge (non-member only) */
.roi-klub-cat-banner__badge {
    position: relative;
    z-index: 2;
    align-self: center;
    margin-bottom: 4px;
    padding: 4px 14px;
    background: #A72C3A;
    color: #FFFFFF;
    font: 700 11px/1 'Poppins', sans-serif;
    letter-spacing: 0.5px;
    border-radius: 999px;
    text-transform: uppercase;
}

.roi-klub-cat-banner__logo {
    position: relative;
    z-index: 1;
    width: auto;
    height: 32px;
    margin: 0 0 4px;
}

/* Main "-5%" velky cerveny */
.roi-klub-cat-banner__main {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    margin: 0;
}
.roi-klub-cat-banner__pct {
    font: 700 86px/0.95 'Poppins', sans-serif;
    color: #A72C3A;
    letter-spacing: -2px;
    margin: 0;
}
.roi-klub-cat-banner__shipping {
    margin: 0;
    font: 700 15px/1.2 'Poppins', sans-serif;
    color: #A72C3A;
    letter-spacing: 0.4px;
}
.roi-klub-cat-banner__shipping .light {
    font-weight: 400;
    opacity: 0.85;
}

/* Sub text "Vice dalsich benefitu pro prihlasene" */
.roi-klub-cat-banner__sub {
    position: relative;
    z-index: 1;
    margin: 0;
    font: 400 14px/1.4 'Poppins', sans-serif;
    color: #1a1a1a;
}
.roi-klub-cat-banner__sub strong { font-weight: 700; }

/* MEMBER variant — hlavni text "Aktualne jste prihlaseni..." */
.roi-klub-cat-banner__member-msg {
    position: relative;
    z-index: 1;
    margin: 0;
    font: 700 22px/1.25 'Poppins', sans-serif;
    color: #1a1a1a;
}
.roi-klub-cat-banner__member-msg .light { font-weight: 400; }

/* CTA cerne tlacitko (member: Zjistit vice / non-member: Chci se registrovat) */
.roi-klub-cat-banner__cta {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: #1a1a1a;
    color: #FFFFFF !important;
    text-decoration: none !important;
    font: 700 14px/1 'Poppins', sans-serif;
    border-radius: 4px;
    transition: background 0.2s ease;
}
.roi-klub-cat-banner__cta:hover,
.roi-klub-cat-banner__cta:focus {
    background: #000000;
    color: #FFFFFF !important;
    text-decoration: none !important;
}
.roi-klub-cat-banner__cta-arrow {
    font-size: 16px;
    line-height: 1;
}

/* MEMBER — zmensit "-5%" trochu (text je dulezitejsi) */
.roi-klub-cat-banner--member .roi-klub-cat-banner__pct {
    font-size: 76px;
}

/* Mobile (<=767px) — kompaktnejsi */
@media (max-width: 767px) {
    .roi-klub-cat-banner {
        gap: 12px;
        padding: 18px;
        min-height: 0;
    }
    .roi-klub-cat-banner__pct {
        font-size: 72px;
    }
    .roi-klub-cat-banner--member .roi-klub-cat-banner__pct {
        font-size: 64px;
    }
}


/* =========================================================================
   12. Category PRODUCT CARD klub info (per-product)
   -------------------------------------------------------------------------
   2 varianty (inject z JS dle isClubMember):

   MEMBER (group 4):
     Vedle .price-standard se objevi inline badge:
       <span.roi-cat-klub-member-badge>
         <span.__pct>−5%</span>
         <img.__logo />
       </span>

   NON-MEMBER:
     Pod .prices uvnitr .p-bottom se vlozi cely klikatelny <a>:
       <a.roi-cat-klub-promo href="/registrace/">
         <span.__price>417 Kc</span>
         <span.__pct>−5%</span>
         <img.__logo />
         <span.__cta>Zaregistrujte se ›</span>
       </a>

   Prefix: .roi-cat-klub-* (kategorie product card scope)
   ========================================================================= */

/* -------- 12.0 NON-MEMBER sale pill badge --------
   Vlozeno vedle .price-standard pokud je produkt v sale (non-member usera).
   Vizualne: red bg + white text pill, drobnejsi nez nativni Shoptet flag-sleva. */
.roi-cat-sale-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 6px;
    padding: 2px 10px;
    background: #A72C3A;
    color: #fff !important;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 1.4;
    border-radius: 999px;
    text-decoration: none !important;
    vertical-align: middle;
    white-space: nowrap;
}

/* Badge nesmi byt preskrtnut (parent .price-standard ma line-through) */
.roi-cat-sale-badge,
.roi-cat-sale-badge * {
    text-decoration: none !important;
}

/* -------- 12.0b MEMBER: skryt Shoptet .price-save flag --------
   Pro klub membera (priceRatio 0.95) Shoptet automaticky generuje
   <span class="price-save flag flag-sleva">5 %</span> badge u kazdeho
   produktu — to je redundantni s nasi .roi-cat-klub-member-badge.
   Skryt jen pro produkty oznacene jako klub member (data-roi-klub-info="member"). */
.product[data-roi-klub-info="member"] .price-save,
.product[data-roi-klub-info="member"] .price-save.flag,
.product[data-roi-klub-info="member"] .price-save.flag.flag-sleva {
    display: none !important;
}

/* -------- 12.1 MEMBER inline badge --------
   POZN: badge je vlozen UVNITR .price-standard ktery ma text-decoration:line-through.
   To se kaskaduje na inline child elementy => "-5% dopplerklub" se preskrtne.
   Fix: text-decoration:none na badge + jeho potomky (override cascade). */
.roi-cat-klub-member-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 6px;
    vertical-align: middle;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    color: #A72C3A;
    text-decoration: none !important;
}

.roi-cat-klub-member-badge *,
.roi-cat-klub-member-badge::before,
.roi-cat-klub-member-badge::after {
    text-decoration: none !important;
}

.roi-cat-klub-member-badge__pct {
    font-weight: 700;
}

.roi-cat-klub-member-badge__logo {
    display: inline-block;
    height: 13px;
    width: auto;
    vertical-align: middle;
}

/* -------- 12.2 NON-MEMBER promo radka -------- */
.roi-cat-klub-promo {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
    padding: 4px 0;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    line-height: 1.3;
    color: #A72C3A;
    text-decoration: none;
}

.roi-cat-klub-promo:hover,
.roi-cat-klub-promo:focus {
    text-decoration: none;
    color: #A72C3A;
}

.roi-cat-klub-promo__price {
    /* 2026-05-16 Figma typo: Poppins 500 16px / 160% / #A72C3A (brand red) */
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 160%;
    color: #A72C3A;
}

.roi-cat-klub-promo__pct {
    font-weight: 700;
    color: #A72C3A;
}

.roi-cat-klub-promo__logo {
    display: inline-block;
    height: 13px;
    width: auto;
    vertical-align: middle;
}

.roi-cat-klub-promo__cta {
    font-weight: 500;
    color: #A72C3A;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}

.roi-cat-klub-promo__arrow {
    margin-left: 2px;
}

.roi-cat-klub-promo:hover .roi-cat-klub-promo__cta,
.roi-cat-klub-promo:focus .roi-cat-klub-promo__cta {
    text-decoration: none;
}

/* Mobile (<=767px) — drobnejsi typo aby se veslo do product card */
@media (max-width: 767px) {
    .roi-cat-klub-member-badge,
    .roi-cat-klub-promo {
        font-size: 12px;
    }
    .roi-cat-klub-promo__cta {
        font-size: 12px;
    }
    .roi-cat-klub-promo__price {
        font-size: 14px;  /* drobnejsi nez desktop 16px */
    }
}

/* -------- 12.3 Skladem (availability) NA PRVNI MISTE v product card
   2026-05-16: Uzivatel feedback - Skladem ma byt vzdy na prvnim miste
   v cenovem bloku (nad strikethrough cenou + final cenou + klub promo).

   DOM struktura:
     .p-bottom
       <div data-micro="offer">
         .availability  (Skladem)
         .prices        (price-final + price-standard)
         .roi-cat-klub-promo  (nase nova radka)

   Default Shoptet rendruje vizualne PRICES PRVNI (flex-direction column-reverse).
   Override: explicitne nastavime flex-direction column (normalni DOM order),
   takze visualni poradi je: Skladem -> Prices -> Klub promo. */
body.type-category .product .p-bottom > div {
    display: flex !important;
    flex-direction: column !important;
}

body.type-category .product .p-bottom .availability {
    order: 1;
}
body.type-category .product .p-bottom .prices {
    order: 2;
}
body.type-category .product .p-bottom .roi-cat-klub-promo {
    order: 3;
}

/* -------- 12.4 Prices container — kompletni layout overrride
   2026-05-17: User-pozadovany layout, override default Shoptet/legacy chovani.

   - .prices: column-reverse (preskrtnuta NAHORE, hlavni cena DOLE)
     order -1 v .p-bottom > div flex-column kontextu (PRED .availability ktera
     ma order 1) — VIZUALNE pak: Prices -> Skladem -> Klub promo.
     POZN: pro Skladem nahore by uzivatel mel preferovat order:1 + .availability:0,
     ale aktualni deploy pouziva order:-1 na .prices (vychazi z product-detail-style.css?v=1.86).
   - .price-final / .price-standard: width 100% aby kazda cena byla na svem radku
     (jinak by se inline rozlozily a badge by overflownul)
   - Mobile (max-width: 767px): availability height auto aby Skladem text nebyl
     orezan na fixni height z legacy CSS. */
.products-block .p-bottom .prices {
    width: 40%;
    order: -1;
    text-align: left;
    min-height: 40px;
    display: flex;
    flex-direction: column-reverse;
}

.products-block > div .p .p-bottom > div .prices .price-standard,
.products-block > div .p .p-bottom > div .prices .price-final {
    width: 100%;
}

/* -------- 12.5 Member badge overflow fix
   2026-05-17: Mobile (375px) member state — .roi-cat-klub-member-badge je injektovan
   UVNITR .price-standard. Legacy Shoptet .price-standard ma fixed height 26px +
   line-height 26px (z css/doppler-all.css:1209), takze pokud "36 490 Kc" + badge
   prekroci sirku ~168px (mobile product card), badge prepada MIMO parent height
   a vizualne se zajede pod .price-final cenou.

   Fix: price-standard z display:block + height:26px na display:inline-flex + wrap.
   Badge wrapuje na 2. radku UVNITR parent height (auto), bez vlivu na sourozence. */
#products .product .p-bottom .prices .price-standard,
.products-block > div .p .p-bottom > div .prices .price-standard {
    height: auto !important;
    line-height: 1.6 !important;
    display: inline-flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px !important;
}

/* -------- 12.6 Badge line-through fix (universal: member + sale)
   2026-05-17: CSS spec gotcha — .price-standard (block-level flex container) ma
   text-decoration:line-through. Decoration se kresli pres VSECHNY inline-level
   children INCLUDING tech s vlastnim text-decoration:none. Spec: "Descendant boxes
   with text-decoration-line do NOT prevent the parent's text-decoration from being
   drawn over them."

   Pokryto pro 2 typy badge:
   - .roi-cat-klub-member-badge — pro prihlasene cleny klubu (groupId=4)
   - .roi-cat-sale-badge        — pro non-membera, pokud produkt ma admin sale (-20% atd.)

   Fix: zrusit line-through z .price-standard PARENT a aplikovat jen na text-wrapper
   <span>/<strong> child (default Shoptet text), badge sibling pak zustane bez prekrti.

   DOM (member):
     .price-standard          ← text-decoration: none (override line-through)
       > <span><strong>29 990 Kc</strong></span>  ← line-through (text span)
       > .roi-cat-klub-member-badge               ← NO line-through ✓

   DOM (non-member sale):
     .price-standard          ← text-decoration: none
       > <span><strong>23 150 Kc</strong></span>  ← line-through (text span)
       > .roi-cat-sale-badge "−20 %"              ← NO line-through ✓ */
#products .product .p-bottom .prices .price-standard:has(.roi-cat-klub-member-badge),
#products .product .p-bottom .prices .price-standard:has(.roi-cat-sale-badge),
.products-block > div .p .p-bottom > div .prices .price-standard:has(.roi-cat-klub-member-badge),
.products-block > div .p .p-bottom > div .prices .price-standard:has(.roi-cat-sale-badge) {
    text-decoration: none !important;
}

#products .product .p-bottom .prices .price-standard:has(.roi-cat-klub-member-badge) > span:not(.roi-cat-klub-member-badge):not(.roi-cat-sale-badge),
#products .product .p-bottom .prices .price-standard:has(.roi-cat-klub-member-badge) > strong,
#products .product .p-bottom .prices .price-standard:has(.roi-cat-sale-badge) > span:not(.roi-cat-klub-member-badge):not(.roi-cat-sale-badge),
#products .product .p-bottom .prices .price-standard:has(.roi-cat-sale-badge) > strong,
.products-block > div .p .p-bottom > div .prices .price-standard:has(.roi-cat-klub-member-badge) > span:not(.roi-cat-klub-member-badge):not(.roi-cat-sale-badge),
.products-block > div .p .p-bottom > div .prices .price-standard:has(.roi-cat-klub-member-badge) > strong,
.products-block > div .p .p-bottom > div .prices .price-standard:has(.roi-cat-sale-badge) > span:not(.roi-cat-klub-member-badge):not(.roi-cat-sale-badge),
.products-block > div .p .p-bottom > div .prices .price-standard:has(.roi-cat-sale-badge) > strong {
    text-decoration: line-through !important;
    text-decoration-color: #383838 !important;
}

@media screen and (max-width: 767px) {
    .columns-mobile-2 .products-block > div .p .availability {
        height: auto;
    }

    /* User-pozadovane mobile fix-y 2026-05-17:
       - badge bez left marginu (uz pres flex gap)
       - price-standard bez gap (mobile compact)
       - price-final margin-top 10px pri sale produktu (oddeleni od price-standard wrap)
       - text wrapper > span padding-right 5px (mezera pred badge) */
    .roi-cat-klub-member-badge {
        margin-left: 0;
    }
    #products .product .p-bottom .prices .price-standard,
    .products-block > div .p .p-bottom > div .prices .price-standard {
        gap: 0 !important;
    }
    #products .product:has(.price-standard) .price-final {
        margin-top: 10px;
    }
    .price-standard > span {
        padding-right: 5px;
    }
}


/* =========================================================================
   13. Member-only hide rules (body.roi-klub-member)
   -------------------------------------------------------------------------
   2026-05-17 v2: Pokud je zakaznik prihlasen jako klub clen (groupId=4), JS
   pridava body class .roi-klub-member (viz doppler-klub-script.js Section 11
   dispatcher: roiKlub.ensureBodyClass('roi-klub-member', roiKlub.isClubMember())).

   GLOBAL hide (vsechny viewporty) — clenovi maji dopravu zdarma bez limitu,
   propagace je redundantni:
     - .top-navigation-bar .container > .text — string "Doprava zdarma pri
       nakupu nad 2000 Kc" v hornim baru (vedle Akce/Nase katalogy/O nas/
       Kontakty). Zustava .top-navigation-menu napravo.
     - .site-msg.information — alternativni site banner (pripadny separatni
       informacni banner, fallback pro pripad ze ho Shoptet znovu zobrazi).

   MOBILE-ONLY hide:
     - .roi-hdr-mobile-klub — drawer link "Doppler klub - Klub vyhod" (na
       desktopu nezobrazujeme tlacitko jinde, na mobilu byl drawer redundantni
       protoze clenovi uz nepotrebuje klubu propagaci).
   ========================================================================= */
body.roi-klub-member .top-navigation-bar .container > .text,
body.roi-klub-member .site-msg.information {
    display: none !important;
}

@media (max-width: 767px) {
    body.roi-klub-member .roi-hdr-mobile-klub {
        display: none !important;
    }
}