/* ==========================================================
   PRODUCT HEADER
========================================================== */

.blank-mode .p-detail-inner h1,
.p-detail-inner h1,
.p-detail-inner .h1{

    font-family:var(--sh-font-family-headings);

    font-size:var(--sh-heading-md);
    font-weight:var(--sh-font-weight-heading);
    line-height:var(--sh-line-height-heading);

    color:var(--sh-color-text);

    margin-top:0;
    margin-bottom:var(--sh-space-sm);

}

/* ==========================================================
   PRODUCT MOBILE HEADER
========================================================== */

.p-detail-inner .p-detail-inner-header-mobile {

    text-align: left !important;

}



/* ==========================================================
   BRAND
========================================================== */

.p-detail-inner .brand-wrapper {

    font-family: var(--sh-font-family-headings);

    font-size: var(--sh-text-xs);
    font-weight: var(--sh-font-weight-medium);
    line-height: var(--sh-line-height-heading);

    letter-spacing: .08em;

}

/* výrobce nad názvem produktu — vždy akcentová barva, nezávisle na
   tom, odkud by si ji jinak Shoptetův výchozí styl odkazu bral */
.p-detail-inner .brand-wrapper,
.p-detail-inner .brand-wrapper a,
.p-detail-inner .brand-wrapper-manufacturer-name {
    color: var(--sh-color-accent) !important;
}

/* ==========================================================
   RATING
========================================================== */

.p-detail-inner .stars-wrapper {

    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;

}

/* hvězdičky */

.p-detail-inner .stars-wrapper .stars,
.p-detail-inner .stars-wrapper .star-list {

    display: inline-flex;
    align-items: center;
    gap: 4px;
    line-height: 1;
    height: 12px !important;

}

/* počet hodnocení */

.p-detail-inner .stars-wrapper .stars-label {

    display: inline-flex;
    align-items: center;
    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-xs);
    font-weight: var(--sh-font-weight-body);

    line-height: 1.4;
    margin: 0;
    padding-top: 3px !important;

}

/* button */

.p-detail-inner .stars-wrapper .js-ratingDialogTrigger {

    display: inline-flex;
    align-items: left;
    padding: 0;
    margin: 0;
    font-size: 0;
    line-height: 1.4;
    padding-top: 3px !important;
    background: transparent;

}

/* nový text */

.p-detail-inner .stars-wrapper .js-ratingDialogTrigger::after {

    content: "Ohodnotit produkt";

    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-xs);
    font-weight: var(--sh-font-weight-medium);
    background: transparent !important;
    color: var(--sh-color-accent);

}


/* ==========================================================
   PRODUCT DETAIL – MOBILE HEADER
========================================================== */

@media (max-width: 767px){

    .p-detail-inner .h1{
        font-family:var(--sh-font-family-headings);
        font-weight:var(--sh-font-weight-heading);
        line-height:1.15;
        margin:0 0 var(--sh-space-sm);
    }

        .p-detail-inner .p-detail-inner-header-mobile .brand-wrapper{
        margin-top:24px;
        margin-bottom:8px;
        padding-bottom:0;
    }

    .p-detail-inner .brand-wrapper-manufacturer-name{
        font-size:var(--sh-text-sm);
        font-weight:var(--sh-font-weight-body);
        text-transform:uppercase;
        letter-spacing:.08em;
    }
    }


    .p-detail-inner .p-detail-inner-header-mobile .stars-wrapper{

    justify-content:flex-start !important;

    align-items:center;

    text-align:left;

    padding-bottom:var(--sh-space-sm);

}

/* pokud se stars-wrapper zalomí (velmi úzké obrazovky), tlačítko
   "Ohodnotit produkt" musí zůstat zarovnané k levému okraji, ne
   odsazené podle toho, kde se zalomilo */
.p-detail-inner .p-detail-inner-header-mobile .stars-wrapper .js-ratingDialogTrigger{
    margin-left: 0;
    align-self: flex-start;
}

/* ==========================================================
  MNOŽSTVÍ
========================================================== */

.quantity {
    border-width: 0px;
    background: var(--sh-color-surface);
    display: inline-block;
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-medium);
    line-height: 1;
    padding-left: 24px;
    padding-right: 24px;
    position: relative;
    vertical-align: middle;
    }

.quantity {
    border-radius: var(--sh-radius-btn) !important;
     }

.quantity input {
    font-family: inherit;
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-medium);
}

.p-detail .add-to-cart .quantity {
    border-width: 0px;
    border-radius: var(--sh-radius-btn);
}

.quantity .decrease__sign, .quantity .increase__sign {
    display: block;
    font-family: inherit;
     font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-medium);
    border:none;
    outline: none;
}

.quantity .decrease, .quantity .increase {
    background-color: var(--sh-color-surface);
    border-style:none;
    border:none;
   }

@media (min-width: 768px) {
    .p-detail-inner .p-to-cart-block .quantity {
     margin-right: 24px;
        }
         }

   .quantity .decrease {
    border-bottom-left-radius: var(--sh-radius-btn) !important;
    border-top-left-radius: var(--sh-radius-btn) !important;
    left: 4px;
}

.quantity .increase {
     border-bottom-right-radius: var(--sh-radius-btn) !important;
    border-top-right-radius: var(--sh-radius-btn) !important;
right: 4px;
} 

.quantity input::selection { 
    background: transparent; 
    color: var(--sh-color-accent);
    outline:none;
    }

    
.quantity input:focus {
    background: transparent;
    color: var(--sh-color-accent);
    outline:none;
    border-color: transparent !important;
    box-shadow: none !important;
    }

.quantity .increase:hover, .quantity .decrease:hover { 
     background:transparent; 
    color: var(--sh-color-accent); 
}

 .quantity .increase:active, .quantity .decrease:active { 
    background:transparent; 
    color: var(--sh-color-accent); 
}

.quantity .increase:focus, .quantity .increase:focus-visible, .quantity .decrease:focus, .quantity .decrease:focus-visible { 
    outline: none; 
    box-shadow: none; 
}

/* ==========================================================
   TLAČÍTKO DO KOŠÍKU
========================================================== */

.add-to-cart-button > span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    font-family:var(--sh-font-family-headings);
    font-size:var(--sh-text-base);
    font-weight:var(--sh-font-weight-heading);
}


.add-to-cart-button .icon-cart{
    font-size:15px;
    line-height:1;
    }

/* ==========================================================
   PRICE
========================================================== */

.p-detail-inner .p-price-wrapper .price-final,
.p-detail-inner .p-price-wrapper .price-final-holder {

    font-family: var(--sh-font-family-headings) !important;
    font-size: var(--sh-heading-md) !important;
    font-weight: var(--sh-font-weight-heading) !important;


}

/* ==========================================================
   PRODUCT CODE
========================================================== */

.p-detail-inner .detail-parameter-product-code,
.p-detail-inner .detail-parameter-product-code span {

    font-family: var(--sh-font-family-body);

    font-size: var(--sh-text-xs);
    font-weight: var(--sh-font-weight-body);
    line-height: var(--sh-line-height-body);

    text-transform: uppercase;
    letter-spacing: .08em;

}

.p-detail-inner .detail-parameter-product-code .p-code-label {

    font-weight: var(--sh-font-weight-medium);

}

/* ==========================================================
   VARIANTS
========================================================== */

.p-detail-inner .variant-list select,
.p-detail-inner .surcharge-list select,
.p-detail-inner .variant-list .form-control {

    border-radius: var(--sh-radius-md);

}

/* ==========================================================
   PRODUCT GALLERY
========================================================== */

.p-detail-inner .p-image-wrapper .p-image,
.p-detail-inner .p-image-wrapper .p-image img,
.p-detail-inner .p-image-wrapper .p-main-image {

    border-radius: var(--sh-radius-md);
    overflow: hidden;

}

/* ---------- slevový štítek na obrázku (.flag-discount) ----------
   Shoptet dává .flags-extra "top:-55px; bottom:0" (box vyšší než
   obrázek) a vycentruje štítek uvnitř přes align-items:center — proto
   vizuálně "levituje" nad spodním okrajem místo aby na něm ležel.
   align-items:flex-end ho přisune přímo na spodní hranu obrázku. */
.p-detail-inner .p-image .flags-extra {
    align-items: flex-end;
}

/* Shoptet renderuje .flag-discount jako svislou "stužku"
   (flex-direction:column, pevná šířka/výška) — cena a sleva pod sebou.
   Přepnuto na řádek, ať jsou "42 Kč" a "-20 %" vedle sebe. main-14 má
   navíc od 768px min-width/min-height:100px + border-radius:50% (aby
   ze štítku byl kruh) – s obsahem vedle sebe to text jen mačkalo do
   kruhu; zrušeno a nahrazeno pilulkovým tvarem podle zbytku webu. */
.p-detail-inner .p-image .flag-discount {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: var(--sh-space-xs);

    width: auto;
    height: auto;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: var(--sh-space-xs) var(--sh-space-sm);

    border-radius: var(--sh-radius-btn);
}

/* Zdrojové náhledy (varianty i tahle galerie) jedou přes Shoptetem
   generovanou "related" velikost, která je pevně 1:1 (100×100px) bez
   ohledu na nastavení poměru stran v administraci – to nastavení řídí
   jen hlavní galerii/výpisy, ne tenhle typ náhledu. Stejný trik, co už
   funguje u vyhledávacího widgetu (header.css .searchWhisperer__product_image):
   wrapperu vynutíme poměr 4:3 a obrázek uvnitř ořízneme přes object-fit,
   místo abychom se spoléhali na přirozený poměr zdroje. */
/* .p-thumbnails-inner obsahuje mezi viditelnými náhledy i skrytý
   .cbox-gal (spouštěč lightboxu, main-14 ho schovává přes
   ".p-thumbnails a.cbox-gal{display:none}"). Cílili jsme na obecné
   "a", což mělo vyšší specificitu a display:block ho omylem odkrylo –
   proto ta mezera navíc. Teď cílíme jen na .p-thumbnail. */
.p-thumbnails-wrapper .p-thumbnails .p-thumbnails-inner a.p-thumbnail {
    display: block;
    aspect-ratio: 4 / 3;
    height: 100px;
    width: auto;
    overflow: hidden;

    margin-right: var(--sh-space-s);
}

.p-thumbnails-wrapper .p-thumbnails .p-thumbnails-inner a.p-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* main-14 dává za poslední viditelný náhled bílý gradient (aby byla
   čitelná šipka "další"), napevno #fff – na naší krémové stránce byl
   vidět jako bílá skvrna. Přebarveno na skutečné pozadí stránky. */
.p-thumbnails.overflow-next:after {
    background-image: linear-gradient(90deg, rgba(244, 240, 230, 0) 0, var(--sh-color-bg) 50%);
}

@media (max-width: 767px){

    .p-thumbnails-wrapper .p-thumbnails .p-thumbnails-inner a.p-thumbnail {
        height: 48px;
        width: auto;
    }

}

/* náhledy u variant (VARIANTA: ...) – main-14 dává pevných 100×100px
   a border-radius:8px. Stejný aspect-ratio + object-fit:cover trik
   jako u galerie výše, border-radius sjednocený s designem. */
/* main-14 dává na .advanced-parameter (obalový label) 8px mezeru
   vpravo/dole – zmenšeno na menší token */
.p-detail-inner .advanced-parameter.has-image {
    margin: 0 var(--sh-space-xs) var(--sh-space-xs) 0;
}

.p-detail-inner .advanced-parameter.has-image .advanced-parameter-inner {
    width: auto;
    height: 64px;
    aspect-ratio: 4 / 3;
    overflow: hidden;

    border-width: 0;
    border-radius: var(--sh-radius-md);
    background-color: var(--sh-color-surface);
}

.p-detail-inner .advanced-parameter.has-image .advanced-parameter-inner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-thumbnail,
.p-thumbnail img,
.box-gal,
.box-gal img {

    border-radius: var(--sh-radius-md) !important;

}

/* sjednocení stylu šipek v lightboxu galerie – jiná sada ikon
   (\e90b/\e90c) než zbytek webu (\e90e-\e911, "chevron" styl) */
#cboxPrevious:before {
    content: "\e90f" !important;
}

#cboxNext:before {
    content: "\e910" !important;
}

/* radius sjednocený s naší proměnnou na všech colorbox oknech
   (popup "Přidáno do košíku", výběr výdejního místa Balíkovny...) –
   #cboxLoadedContent je jen vnitřní scroll wrapper, samotné viditelné
   pozadí okna má #cboxContent (main-14: #cboxContent{background-color:
   var(--colors-surface-primary)}), proto radius na obou; pozadí
   explicitně naší proměnnou, ať to není závislé na tom, že Shoptetova
   proměnná zrovna vede na stejnou barvu */
#cboxContent,
#cboxLoadedContent {
    border-radius: var(--sh-radius-md) !important;
}

#cboxContent {
    background-color: var(--sh-color-bg) !important;
}

/* zavírací "x" – main-14 mu dává napevno bílé pozadí (#cboxClose{
   background-color:#fff !important}), na naší krémové ploše okna
   vytvářelo bílý čtvereček */
#cboxClose {
    background-color: var(--sh-color-bg) !important;
}

/* main-14 dává obsahu popupu napevno 16px padding na všechny strany */
.colorbox-html-content {
    padding: var(--sh-space-box);
}

/* ==========================================================
   POPUP "PŘIDÁNO DO KOŠÍKU"
========================================================== */

.advanced-order {
    text-align: left !important;
}

/* nadpis "Přidáno do košíku" – main-14 na něj dává obecné .h1
   rozměry (stejné jako třeba nadpis stránky), v malém popupu
   zbytečně velké, ale úplně nejmenší velikost (--sh-text-xl) zase
   pro nadpis moc drobná */
.advanced-order .h1 {
    font-size: var(--sh-heading-sm) !important;
}

/* název produktu – vlastní data-testid, ať necílí zároveň na
   ".advanced-order-suggestion" níže (obojí sdílí třídu "h2") */
.advanced-order .h2[data-testid="textPopupProductName"] {
    font-size: var(--sh-text-xl) !important;
}

/* main-14 dává ikoně dodávky 48px — mnohem menší, stejně jako je
   zmenšená (schovaná) v .extras-wrapper na stránce košíku */
.advanced-order .icon-van {
    font-size: 20px !important;
}

/* mezera nad pruhem dopravy zdarma – stejný vzor jako u kroků
   v košíku (cart.css / header.css .cart-free-shipping) */
.advanced-order .extras-wrap {
    padding-top: var(--sh-space-sm);
}

/* main-14 řádek i ikonu+text uvnitř centruje (justify-content:center
   na .extras-wrap i na .extra) – zarovnáno doleva ke zbytku popupu */
.advanced-order .extras-wrap,
.advanced-order .extras-wrap .extra {
    justify-content: flex-start !important;
}

/* main-14 dává ".extra" navíc vlastní boční margin (16px) – s textem
   teď zarovnaným doleva zbytečně odsazuje ikonu dodávky od levého
   okraje popupu */
.advanced-order .extras-wrap .extra {
    margin-left: 0 !important;
}

/* malý odstup nad ukazatelem do dopravy zdarma – main-14 dává
   .price-range margin-top:0, lepilo se to hned pod text */
.advanced-order .price-range {
    margin-top: var(--sh-space-xs) !important;
}

/* "Objednejte ještě za X Kč a budete mít dopravu ZDARMA" – stejný
   styl jako na stránce košíku (cart.css: .extras-wrapper .extra span
   / span strong), main-14 tu dává jen 12px/letter-spacing */
.advanced-order .extras-wrap .extra span {
    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-medium);
    letter-spacing: normal;
    color: var(--sh-color-text);
}

.advanced-order .extras-wrap .extra span strong {
    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-bold);
    letter-spacing: normal;
    color: var(--sh-color-text);
}

/* tlačítka "Zpět do obchodu" / "Nákupní košík" – main-14 je centruje
   a dává mezi ně 16px (.advancedOrder__buttons{justify-content:center;
   gap:8px 16px}) */
.advancedOrder__buttons {
    justify-content: flex-start !important;
    gap: 8px var(--sh-space-xs) !important;
}

/* "Ostatní zákazníci také nakoupili" – stejná třída "h2" jako název
   produktu výše, ale main-14 pro ni nemá vlastní velikost o nic menší
   (obě dědí generický .h2 ~20–24px); vypadá to spíš jako popisek než
   nadpis sekce, proto vlastní, výraznější styl */
.advanced-order .h2.advanced-order-suggestion {
    font-family: var(--sh-font-family-headings);
    font-size: var(--sh-heading-sm) !important;
    font-weight: var(--sh-font-weight-heading);
    color: var(--sh-color-text);
}

/* "Zpět do obchodu" – outline tlačítko ve stejném stylu jako
   .sh-btn--outline v sekci "Náš příběh" na homepage (homepage.css:
   .sh-origin-social__actions .sh-btn--outline).
   !important nutné — cart.css má ".next-step-back" (krokování v
   košíku, jiný kontext, stejná třída) s border/padding na !important,
   které by jinak vyhrálo bez ohledu na vyšší specificitu tady. */
.advancedOrder__buttons .next-step-back {
    display: inline-block !important;
    padding: 14px 40px !important;

    font-family: var(--sh-font-family-headings);
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-body);

    background: transparent !important;
    color: var(--sh-color-accent) !important;
    border: 1.5px solid var(--sh-color-cta) !important;
    border-radius: var(--sh-radius-btn) !important;

    cursor: pointer;
    transition: var(--sh-transition);
}

.advancedOrder__buttons .next-step-back:hover {
    background: var(--sh-color-cta) !important;
    color: var(--sh-color-text-inverse) !important;
    transform: var(--sh-btn-hover-transform);
    box-shadow: var(--sh-btn-hover-shadow);
}

/* ==========================================================
   PRODUCT TABS
========================================================== */

.p-detail-full-width {

    padding-top: 0 !important;
    padding-bottom: 0 !important;

    background: var(--sh-color-bg) !important;

}

.p-detail-full-width > .container-full-width,
.p-detail-full-width .container-full-width {

    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: var(--sh-space-md); 
padding-bottom: var(--sh-space-md);
}

/* držák záložek */

.p-detail-full-width .shp-tabs-holder,
.p-detail-full-width .shp-tabs {

    background: var(--sh-color-bg) !important;

    border: none !important;
    box-shadow: none !important;

}

/* neaktivní záložky */

.p-detail-full-width .shp-tabs-holder ul.shp-tabs li.shp-tab a,
.p-detail-full-width .shp-tabs-row .shp-tabs-holder ul.shp-tabs li.shp-tab a {

    border: none !important;
    border-radius: var(--sh-radius-md) var(--sh-radius-md) 0 0 !important;

    box-shadow: none !important;

    color: var(--sh-color-text-muted) !important;

    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-medium);

}

/* hover neaktivní záložky – stejná barva jako aktivní stav */
.p-detail-full-width .shp-tabs-holder ul.shp-tabs li.shp-tab:not(.active) a:hover,
.p-detail-full-width .shp-tabs-row .shp-tabs-holder ul.shp-tabs li.shp-tab:not(.active) a:hover {

    color: var(--sh-color-accent) !important;

    background-color: var(--sh-color-surface) !important;
    border-color: transparent !important;

}

/* aktivní záložka */

.p-detail-full-width .shp-tabs-holder ul.shp-tabs li.shp-tab.active a,
.p-detail-full-width .shp-tabs-row .shp-tabs-holder ul.shp-tabs li.shp-tab.active a {

    background: var(--sh-color-surface) !important;

    color: var(--sh-color-accent) !important;

    box-shadow: none !important;

}

/* obsah */

.p-detail-full-width .tab-content,
.p-detail-full-width #tab-content {

    background: var(--sh-color-surface) !important;

    border: none !important;

    border-radius: 0 var(--sh-radius-md) var(--sh-radius-md) var(--sh-radius-md) !important;

    /* nahoře/dole o něco větší mezera než po stranách (--sh-space-box) */
    padding: clamp(20px, 2.5vw, 44px) var(--sh-space-box) !important;

    box-shadow: none !important;


}

/* formulář diskuze – main-14 dává ".discussion-form" napevno
   padding:16px + kompenzující margin-left/right:-16px (bleed technika
   – "vykrvácí" přes okraj rodiče, který má vlastní 16px padding).
   Boční padding nechceme, ale bez vynulování i té záporné marže by se
   formulář posunul o 16px mimo zarovnání se zbytkem obsahu tabu. */
.p-detail .discussion-form {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}

/* tabulka parametrů */

.p-detail-full-width .tab-pane .detail-parameters {

    border-radius: var(--sh-radius-md);

}

/* typography */
.p-detail-full-width .shp-tabs-row .shp-tabs-holder ul.shp-tabs li.shp-tab a {

    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-medium);

}

.p-detail-full-width .shp-tabs-row .shp-tabs-holder ul.shp-tabs li.shp-tab.active a {

    font-weight: var(--sh-font-weight-heading) !important;

}

/* ==========================================================
   PRODUCT DETAIL SPACING
========================================================== */

/* výrobce */

.p-detail-inner .brand-wrapper{

    margin-bottom: var(--sh-space-xs);

}

/* nadpis */

.p-detail-inner h1{

    margin-bottom: var(--sh-space-sm);

}

/* rating */

.p-detail-inner .stars-wrapper{

    margin-bottom: var(--sh-space-md);

}

/* krátký popis */

.p-detail-inner .p-short-description{

    margin-bottom: var(--sh-space-sm);

}

@media (max-width: 1199px){

    .p-detail-inner .p-short-description{
        margin-top: var(--sh-space-s);
    }

}

/* cena */

.p-detail-inner .p-price-wrapper{

    margin-bottom: var(--sh-space-s);

}

/* sklad + kód */

.p-detail-inner .detail-parameters{

    margin-bottom: var(--sh-space-sm);

}

/* přidání do košíku */

.p-detail-inner .p-to-cart-block{

    margin-bottom: var(--sh-space-md);

}

/* ikonky */

.p-detail-inner .social-buttons-wrapper{
    margin-top: var(--sh-space-md);
    margin-bottom: var(--sh-space-s);

}

/* ==========================================================
   obrázek - mobil tablet
========================================================== */

/* na tabletu/mobilu je popis příliš blízko obrázkům, přidán větší
   odstup pod miniaturami (na desktopu je vedle sebe s popisem,
   takže tam navíc mezera potřeba není) */
@media (max-width: 991px){

    .p-thumbnails{
        margin-bottom: var(--sh-space-md);
    }

}

/* ==========================================================
   PRODUCT CTA – MÁTE DOTAZ?
========================================================== */

/* schovat tisk a sdílení */
.p-detail-inner .link-icon.print,
.p-detail-inner .link-icon.share {
    display: none;
}

/* wrapper */
.p-detail-inner .social-buttons-wrapper {
    margin-top: var(--sh-space-md);
    margin-bottom: var(--sh-space-xl);
}

@media (max-width: 991px) {
    .p-detail-inner .social-buttons-wrapper {
        margin-bottom: var(--sh-space-md);
    }
}

.p-detail-inner .social-buttons-wrapper .link-icons {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}

/* samotný odkaz */
.p-detail-inner .link-icon.chat {

    display: flex;
    align-items: flex-start;

    margin: 0;
    padding: 0;

    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-body);

    text-transform: none;
    text-align: left;

    color: var(--sh-color-text);

}

/* schovat ikonku */
.p-detail-inner .link-icon.chat i {
    display: none;
}

/* schovat původní text */
.p-detail-inner .link-icon.chat span {
    font-size: 0;
    line-height: 0;
}

/* nový dvouřádkový obsah */
.p-detail-inner .link-icon.chat span::before {

    content: "Máte dotaz k produktu?";
    display: block;

    margin-bottom: .25rem;

    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-body);
    line-height: var(--sh-line-height-body);

    color: var(--sh-color-text);

}

.p-detail-inner .link-icon.chat span::after {

    content: "Napište nám →";
    display: block;

    font-family: var(--sh-font-family-headings);
    font-size: var(--sh-text-base);
    font-weight: var(--sh-font-weight-bold);
    line-height: var(--sh-line-height-body);

    color: var(--sh-color-cta);

}

/* zrušit defaultní hover Shoptetu */
.p-detail-inner .link-icon.chat:hover,
.p-detail-inner .link-icon.chat:focus {

    background: transparent !important;
    box-shadow: none !important;
    border: none !important;

}

/* zachovat pouze podtržení odkazu */
.p-detail-inner .link-icon.chat:hover span::after {

    text-decoration: underline;

}

/* ==========================================================
   PRODUCT SLIDERS – SPOLEČNÉ NASTAVENÍ
========================================================== */

/* odsazení celého slideru */
.product-slider-holder.has-navigation {
    padding-top: var(--sh-space-sm) !important;
    padding-bottom: var(--sh-space-md) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* odsazení jednotlivých karet */
.product-slider .products-block > .product,
.products-related-wrapper .products-block > div {
    padding-left: 0 !important;
    padding-right: var(--sh-space-sm) !important;
}

/* zjednodušení karet */
.products-wrapper .ratings-wrapper,
.products-wrapper .p-desc,
.products-wrapper .p-code {
    display: none !important;
}


/* ==========================================================
   RELATED PRODUCTS – HEADER
========================================================== */

.p-detail .products-related-header {

    margin-top: var(--sh-space-section);
    margin-bottom: var(--sh-space-s);

    font-size: 0;
    text-align: left !important;

}

.p-detail .products-related-header::before {

    content: "Co by se mohlo hodit?";

    display: block;

    font-family: var(--sh-font-family-headings);
    font-size: var(--sh-heading-md);
    font-weight: var(--sh-font-weight-heading);
    line-height: var(--sh-line-height-heading);

    color: var(--sh-color-text);

}


/* ==========================================================
   HEADERS SE ŠIPKAMI
========================================================== */

/* zarovnání doleva vždy – i pro nadpisy sliderů, u kterých se nakonec
   šipky nepřidávají (4 nebo míň produktů), aby nespadly zpátky na
   Shoptetovo výchozí text-align:center. main-14 má i variantu
   ".products-header{text-align:center}" se stejnou specificitou jako
   naše třída – !important pro jistotu. */
.related-products-heading-left {
    text-align: left !important;
}

.related-products-heading-with-navigation {

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: var(--sh-space-sm);

    text-align: left;

}

.related-products-heading-navigation {

    display: flex;
    align-items: center;

    gap: var(--sh-space-s);

    margin-right: var(--sh-space-sm);

    flex-shrink: 0;

}


/* ==========================================================
   NAVIGATION BUTTONS
========================================================== */

/* originální šipky (JS je teď klonuje místo přesouvání, viz komentář
   u skriptu) necháme na jejich původním místě ve slideru – Shoptet na
   ně váže přepočet layoutu při resize. Jen je vizuálně schováme, ale
   nechají se dál interaktivní/měřitelné pro Shoptetův vlastní kód. */
.is-heading-nav-original {
    opacity: 0 !important;
    pointer-events: none !important;
}

.related-products-heading-navigation
.product-slider-navigation {

    position: static;

    width: 48px;
    height: 48px;

    margin: 0;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    background: var(--sh-color-active);

    border: none;
    border-radius: 999px;

    color: var(--sh-color-text-inverse);

    opacity: 1;
    transform: none;

    transition: var(--sh-transition);

}

.related-products-heading-navigation
.product-slider-navigation:hover {

    background: var(--sh-color-active-hover);
    color: var(--sh-color-text-inverse);

}

.related-products-heading-navigation
.product-slider-navigation::before {

    font-family: "shoptet" !important;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 14px;
    line-height: 1;

}

.related-products-heading-navigation
.navigation-prev::before {

    content: "\e90f";

}

.related-products-heading-navigation
.navigation-next::before {

    content: "\e910";

}


/* ==========================================================
   SCHOVAT PŮVODNÍ ŠIPKY
========================================================== */

.products-wrapper > .product-slider-navigation {

    visibility: hidden !important;
    pointer-events: none !important;

}

/* ==========================================================
   PRODUCT SLIDERS – MOBILE
========================================================== */

@media (max-width: 767px){

    .related-products-heading-navigation{
        gap:12px;
        margin-right:0;
    }

    .related-products-heading-navigation
    .product-slider-navigation{

        width:40px;
        height:40px;
    }

    .related-products-heading-navigation
    .product-slider-navigation::before{

        font-size:12px;
    }

}

/* ==========================================================
   PRODUKTOVÁ KARTA (kategorie, homepage slidery, related products)
========================================================== */

/* přeškrtnutá původní cena – main-14 margin:0 5px ji posouvá mimo
   levý okraj, kde sedí .price-final nad ní */
.prices {
    justify-content: flex-start !important;
}

.price-standard {
    margin-left: 0;
    margin-right: auto;

    font-family: var(--sh-font-family-body);
    color: var(--sh-color-text-muted);
}

/* dostupnost ("Skladem", "Vyprodáno"...) – main-14 na ni dává jen
   font-size:12px bez rodiny/řádkování */
.availability {
    font-family: var(--sh-font-family-body);
    font-size: var(--sh-text-sm);
    font-weight: var(--sh-font-weight-body);
    line-height: var(--sh-line-height-body);
}