/*  Generated: 2026-08-07 15:07:02 */
/* ==========================================================================
   RESPONSIVE STYLESHEET
   ==========================================================================
   Breakpoints (desktop-first):
   - 1711px+     : Extra large (handled in stylesheet.css)
   - 1200-1710px : Large desktop (Phase 64-S 2026-05-29 — container max-width 1440→1710)
   - 1025-1199px : Desktop
   - 768-1024px  : Tablet landscape
   - 481-767px   : Tablet portrait
   - 0-480px     : Mobile
   ========================================================================== */

@media (min-width: 1711px) {
    .darekzdarma {
        margin: 52px 0px 0px 0px;
    }
    .detail-box {
        margin-top: 24px;
    }
    .owl-box-head {
        margin-top: 44px;
    }
    .owl-box-head,
    #description-add p.title {
        font-size: 2.8rem;
    }
}
@media (max-width: 1710px) {
    body {
        background-image: none;
    }
    .container {
    }
    #stranka.container {
        padding-bottom: 45px;
    }
}

@media (min-width: 1200px) {
    .centerBoxContentsProducts-in:hover:after {
        transform: rotateX(0);
        opacity: 1;
    }
    .centerBoxContentsProducts-in:hover {
        z-index: 1;
        background: #fff;
    }
    .centerBoxContentsProducts-in:hover .product-button {

    }
    #productDescription1 #description-more h2 {
        font-size: 3.8rem;
    }
    /*#productImagesBox .product-list-24h {
        width: 100px;
        height: 100px;
    }*/
    .centeredContent .product-list-24h {
        width: 76px;
        height: 76px;
    }
    .youtube-video img {
        width: 60px;
    }
    .centeredContent .youtube-video {
        bottom: 8px;
    }
    .centeredContent .youtube-video img {
        width: 40px;
    }
    .sleva_big {
        font-size: 25px;
        font-size: 2.9rem;
        width: 80px;
        height: 80px;
        line-height: 80px;
    }
}
@media (min-width: 1200px) and (max-width: 1600px) {
    .best-buy .best-buy-countdown .countdown {
        font-size: 2.2rem;
    }
}

@media (min-width: 1025px) and (max-width: 1199px) {
    .best-buy .best-buy-countdown .countdown {
        font-size: 1.6rem;
    }
    .best-buy .best-buy-countdown {
        font-size: 1.4rem;
    }
    #top-search-menu .top-block span span {
        display: none;
    }
}
@media (max-width: 1199px) {
    #top-search-menu .top-block span, #top-search-menu .top-block a {
        padding-left: 2px;
        padding-right: 2px;
    }
    /* --- merged from RESPONSIVE LISTING section --- */
    .special-productlist-box {
        grid-template-columns: repeat(3, 1fr);
    }
    .special-productlist-box .centerBoxContentsProducts:last-of-type {
        grid-column: span 2;
    }
    #product-filtr {
        padding: 5px 10px;
    }
    .head_menu a,
    #top_bottom .top-block.right a {
        font-size: 1.4rem;
    }
    .head_menu span.fas {
        padding-right: 8px;
    }
}
/* Phase 64: odstraněn `@media (min-width:1301px){ .index .columnLeft{display:block} }`
   override, který forcoval HP kategorie menu rozbalené na desktopu a překrýval
   rotátor. Reference (woodseeds/ceske-matrace) ho nemá → menu collapse default
   (`stylesheet.css .index .columnLeft{display:none}`) + rozbalení na hover. */
@media (max-width: 1300px) {
    .top_category a {
        flex-direction: column;
    }
    .index #top_bottom .header-left,
    #top_bottom .header-left {
        width: 30%;
    }
    .index #top_bottom .header-right,
    #top_bottom .header-right {
        width: 70%;
    }
    #novinky-akce .novinky_in strong {
        font-size: 2rem;
    }
}
@media (min-width: 1025px) and (max-width: 1300px) {
    .topsubmenu li.first {
        display: none;
    }
    #top-menu-1 a.top-menu-1 {
        font-size: 1.4rem;
        padding: 0px 10px;
    }
    #top-kosik-ucet {
        width: 48%;
    }
    #top-search-menu {
        max-width: 52%;
    }
    .centeredContent .nase-cena, .centeredContent .nase-cena-bez {
        font-size: calc( 16px + (22 - 18)*(100vw - 1025px) / (1300 - 1025));
    }
    #snippet-tabProductListSecond-tabList .product-button {
        display: none;
    }
}

@media (min-width: 1025px) and (max-width: 1200px) {
    .head_menu {
        font-size: 1.3rem;
    }
    .head_menu a span span {
        display: none;
    }
}

@media (min-width: 1025px) {
    #infozakaznik,
    #kontakt_bottom,
    #o_nas,
    #nejprodavanejsi,
    .ikon_bottom,
    #vernost {
    }
    #slider1_container {
        margin: 0px auto 0px auto;
    }
    .parametry-out {
        width: 57%;
    }
    .parametry {
        width: 100%;
    }
    .columnCenter,
    .columnCenter.width-100,
    .columnCenter.productdetail {
        background-color: transparent;
        padding-top: 16px;
    }
    .owl-carousel .owl-wrapper-outer{
        padding-bottom: 44px;
        padding-top: 4px;
    }
    #header {
        margin-bottom: 25px;
    }
    .index #header {
        margin-bottom: 0px;
    }
    #top-search-menu {
        padding: 0px 0 0 0px;
    }
    #top-mujucet span.fas {
        -webkit-text-stroke: 0px #fff;
        top: 4px;
        font-size: 3.4rem;
    }
    #top-kosik span.fas {
        top: 5px;
        font-size: 3.3rem;
    }
    #top-kosik,
    #top-mujucet {
        height: 44px;
    }
    #top-mujucet {
        padding-left: 42px;
        margin-left: 0;
    }
    #top-kosik {
        margin-left: 30px;
        padding-left: 45px;
    }
    #top .header-left {
        padding-right: 0;
    }
    .header-right {
        padding: 0px 0 0px 28px;
    }
    .index h2.centerBoxHeading,
    h2.centerBoxHeading.sluzby {
        font-size: 3.2rem;
        padding: 0 0 37px 0;
        margin-top: 37px;
    }
    h2.centerBoxHeading.sluzby span {
        top: -250px;
    }
    .block-banner--bottom {
        margin-bottom: 37px;
    }
    .block-banner--bottom.bottom {
        margin-bottom: 14px;
    }
    .block-banner--bottom.video-bottom {
        margin-bottom: 30px;
    }
    .index .block-banner--bottom.video-bottom {
        margin-bottom: 47px;
    }
    .block-banner--bottom.top {
        margin-top: 37px;
    }
    #snippet-tabProductListFirst-tabList {
        margin-bottom: 37px;
    }
    .index #snippet-tabProductListSecond-tabList h2.centerBoxHeading {
        padding-bottom: 18px;
        margin-top: 4px;
    }
    #snippet-tabProductListSecond-tabList {
        margin-bottom: 37px;
    }
    .block-banner--bottom {
        gap: 30px;
    }
    .block-banner--in {
        flex: 1;
    }
    .page .block-banner--in {
        width: calc(50% - 15px);
        flex: auto;
    }
    .page .block-banner--in.full {
        width: 100%;
    }
    .proc-block__in h3 {
        font-size: 2rem;
    }
    .proc-block__in i {
        font-size: 4rem;
    }
    .proc-block__in p {
        font-size: 1.4rem;
    }
    .ban_hp_top {
        margin-top: 57px;
    }
}

@media (max-width: 1024px) {
    .no-1024 {
        display: none!important;
    }
    .hodnoceniblok .right {
        float: left;
    }
    #top-menu-1-button {
        display: block;
    }
    #top-menu-1,
    #productsListingBottom .navSplitPagesResult,
    #grid-view,
    .kosik-button .shopingCardButton-submit span span {
        display: none;
    }
    #productDetailRight .show-all-variants-list .kosik-button button span span {
        display: block;
    }
    #top-menu-1.open {
        display: block;
    }
    #top-menu-1-obal {
        padding-right: 0px;
        width: auto;
    }
    #productName {
        font-size: 2.2rem;
    }
    .heureka_produkt .ratingtext1 {
        padding: 28px 53px 28px 25px;
    }
    .heureka_produkt .ratingtext1 span.fa {
        right: 20px;
        top: 23px;
    }
    .heureka_produkt div.hodnoceniblok {
        padding: 0 25px 30px;
    }
    #contactUsNoticeContent iframe {
        max-width: 100%;
        height: auto;
    }
    #productsListingTop {
        margin: 5px 0 0px 0;
    }
    #indexProductList .filtr-nazev {
        position: relative;
        top: 0px;
        left: 0px;
        width: 100%;
        text-align: left;
        padding-left: 0px;
        color: #000;
        font-weight: bold;
        margin: 15px 0 7px 0;
    }
    #indexProductList .filtr-nazev.sorter {
        margin-bottom: 2px;
    }
    .filtr-posuvnik {
        padding: 0px;
    }
    .filtr-velikost .filtr-hodnoty a, .filtr-velikost .filtr-hodnoty span.disabled, .filtr-hodnoty .filtr-znacky-text span {
        margin: 0 2% 2% 0;
        min-width: 27px;
    }
    .filtr-barva .filtr-box-1, .filtr-barva .filtr-box-1-disablde {
        margin: 0px 13px 13px 0px;
        width: 32px;
        height: 32px;
    }
    .filtr-barva .filtr-box-1 span, .filtr-barva .filtr-box-1-disablde span {
        width: 30px;
        height: 30px;
    }
    .filtr_modal_bottom {
        display: block;
        position: fixed;
        width: 100%;
        height: 56px;
        left: 0px;
        right: 0px;
        bottom: 0px;
        top: auto;
        border-top: 1px solid #e5e5e5;
        border-bottom: 1px solid #e5e5e5;
        margin-top: 25px;
        padding: 10px 0;
        background-color: #fff;
        transform: translate3d(0,0,0);
    }
    .filtr_modal_bottom div {
        width: 50%;
        display: block;
        float: left;
        padding: 0px 10px;
    }
    .filtr_modal_bottom div.first {
        border-right: 1px solid #e5e5e5;
    }
    .filtr_modal_bottom button,
    .filtr_modal_bottom a {
        font-size: 1.4rem;
        font-weight: bold;
        text-decoration: none;
        text-align: center;
        width: 100%;
        display: block;
        line-height: 36px;
        background-color: #090;
        color: #fff;
        padding: 0px;
        text-transform: none;
    }
    .filtr_modal_bottom a {
        background-color: #cc0000;
    }
    .filtr_modal_bottom button:hover,
    .filtr_modal_bottom a:hover {
        background-color: #000;
        color: #fff;
    }
    #filter-modal .close {
        right: 5px;
        top: 2px;
        color: #e5e5e5;
        font-size: 4.8rem;
    }
    #filter-modal .sorter-box-mobile {
        text-align: left;
        padding-left: 0px;
    }
    #filter-modal .sorter-box-mobile li {
        list-style-type: none;
    }
    #filter-modal .sorter-box-mobile li a {
        position: relative;
        text-decoration: none;
        padding: 5px 0;
        display: block;
    }
    #filter-modal .sorter-box-mobile li.selected a:after {
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f00c";
        position:absolute;
        right: 0px;
        top: calc(50% - 10px);
        display: block;
        height: 16px;
        width: 16px;
        font-size: 1.6rem;
    }
    #filter-modal .filter-price {
        width: 100%;
    }
    #filter-modal .filter-price .filter-price-input {
        height: 34px;
        line-height: 34px;
    }
    .apply-filter {
        height: 34px;
    }
    #snippet--cart {
        margin-bottom: 35px;
    }
    .header-left,
    .header-right {
        flex: 1;
    }
    .header-right {
        position: initial;
    }
    .linkHomePage a img {
        width: 74px;
    }
    #top-search.open {
        display: block!important;
        position: absolute;
        left: 0px;
        top: 79px;
        width: 100%;
        box-shadow: 1px 5px 10px 0 rgba(93, 93, 93, 0.75);
        z-index: 1000;
    }
    .top-search-input {
        height: 42px;
        line-height: 42px;
        padding: 0px 50px 0px 20px;
        border-radius: initial;
        border-width: 0px;
    }
    .top-search-button {
        height: 42px;
        line-height: 42px;
        border-radius: initial;
        border-width: 0px;
    }
    #navigation-search {
        display: inline-block;
    }
    #top-search-menu,
    #top-kosik-ucet {
        width: auto;
        padding: 0;
        position: initial;
    }
    #header {
        box-shadow: 0 0 8px rgba(201,201,201,0.75);
        margin-bottom: 20px;
    }
    #top-kosik-ucet {
        margin-left: 0px;
    }
    .best-buy-hp,
    .width-66.specialListExtra8,
    .container .container-in .width-33 {
        padding: 0px;
        width: 100%;
    }
    #snippet-tabProductListThird-tabList .centerBoxContentsProducts {
        width: 50%;
    }
    #snippet-tabProductListThird-tabList .centerBoxContentsProducts:nth-child(2n-2) .centerBoxContentsProducts-in:before {
        content: none;
    }
    #bottom .odber-novinek-bottom,
    .odber-novinek-bottom .input-odber {
        width: 100%;
    }
    #hodnoceni-total,
    .product-info-detail-row.kod .product_kod,
    .product_znacka {
        clear: both;
        display: block;
        padding-bottom: 5px;
    }
    #zalozky_main .best-buy .best-buy-image {
        max-width: 20%;
        float: left;
    }
    .product-description {
        flex-wrap: wrap;
    }
    .product-description .param_slozeni {
        width: 40%;
    }
    .product-description .description {
        width: 55%;
    }
    .product-description .description.description-wide {
        width: 100%;
    }
    .product-description .manufacturers {
        width: 100%;
        margin-top: 24px;
    }
    .lego.category a {
        width: 25%;
    }
    #description-more .cybex-block-in {
        width: 100%;
    }
    #description-more .cybex-block-in.order {
        order: -1 !important;
    }
    #description-more .cybex-block-in.text {
        padding: 7%;
    }
    .cookies-info__inner {
        flex-wrap: wrap;
    }
    .cookies-info__button:first-child {
        margin-top: 10px;
    }
    .cookies-info__content,
    .cookies-info__buttons {
        width: 100%;
    }
    .cookies-info__text > span {
        display: inline-block;
        max-height: 20vh!important;
    }
    .container-in {
        padding: 8px;
    }
    .top_category {
        gap: 10px;
        flex-wrap: wrap;
    }
    .top_category a h3 {
        text-align: center;
    }
    .index #snippet-tabProductListSecond-tabList h2.centerBoxHeading {
        margin-bottom: 8px;
    }
    .services {
        flex-wrap: wrap;
        gap: 24px;
    }
    .services .services--in {
        width: calc(50% - 12px);
    }
    #novinky-akce {
        flex-direction: column;
        gap: 15px;
    }
    #novinky-akce #frm-subscribersForm {
        width: 100%;
    }
    #bottom .container_in {
        gap: 15px;
        padding: 15px;
    }
    #bottom-2 .container_in {
        padding: 15px 15px 0 15px;
    }
    .special-productlist-box .centerBoxContentsProducts:last-of-type {
        grid-column: span 2;
    }
    .block-doprava--in ul li span,
    .prodejny .block-doprava--in ul li span.open-time {
    }
    .prodejny .block-doprava--in > div div {
        flex-wrap: wrap;
    }
    .prodejny ul {
        width: 100%;
    }
    .best_out {
        flex-wrap: wrap;
        gap: 24px;
    }
    #best,
    .best-buy,
    .parametry-out {
        width: 100%;
    }
    .centeredContent .nase-cena, .centeredContent .nase-cena-bez {
        font-size: 1.8rem;
    }
    #top_bottom .top-block.right {
        right: 0px;
    }
    #top_bottom .top-block.right a {
        padding-right: 20px;
    }
    .columnCenter {
        width: 75.4%;
    }
    .columnLeft {
        width: 24.6%;
    }
    #top_bottom .top-block a {
        padding-left: 8px;
        padding-right: 8px;
    }
    /* --- merged from RESPONSIVE LISTING section --- */
    .categorie-list ul li {
        width: calc(33.333% - 10px);
    }
    #top_categoriesContent {
        top: 0px;
    }
    .special-productlist-box {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }
    .productListing,
    .vsechny-barevne-varianty {
        grid-template-columns: repeat(3, 1fr);
    }
    #snippet-tabProductListSecond-tabList .container-in .specialList {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .container .container-in .specialListExtra4 {
        gap: 8px;
    }
    .block-banner--bottom {
        flex-wrap: wrap;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    #cartAdd {
        margin-bottom: 0px;
    }
    #productDetailRight .splatky-essox {
        width: 100%;
        min-width: 100%;
        margin: 0;
    }
    #bottom .container .bottom_right ul li span.phone {
        display: block;
    }
}
@media (min-width: 768px) and (max-width: 1024px) {
    #header {
        z-index: 2;
    }
    .leftBoxContainer a.category-top {
        padding-left: 10px;
    }
    .leftBoxContainer a:hover.category-top, .leftBoxContainer a.category-top.selected {
        background-position: 15px 18px;
    }
    ul.detail-box-links li a, ul.detail-box-links li span, ul.sorter-box li a, ul.sorter-box li span {
        font-size: 1.6rem;
        padding: 0 10px;
    }
    #top-search-menu {
        max-width: 45%;
    }
    #top .container {
        padding-top: 22px;
        padding-bottom: 22px;
    }
    .HomepagePagesLinks {
        width: 100%;
        text-align: center;
    }
    .HomepagePagesLinks a, .HomepagePagesLinks span {
        display: inline-block;
        float: none;
    }
    .ceny-coupon, .ceny-discount {
        padding: 10px 10px 12px 10px;
    }
    #productDetailRight .ceny-obal .ceny.coupon {
        padding: 0 10px;
    }
    .ceny-coupon .left span.coupon-price, .ceny-discount .left span.coupon-price {
        padding-right: 5px;
    }
    .ceny-coupon .left, .ceny-discount .left,
    .ceny-coupon .right, .ceny-discount .right {
        width: 100%;
        text-align: left;
    }
    .ceny-coupon .right, .ceny-discount .right {
        padding-top: 6px;
    }
    .product-info-detail-row.lista-ikony a {
        width: 50%;
        float: left;
    }
    .product-info-detail-row.lista-ikony a.iko-velikosti {
        border-right: 1px solid #e5e5e5;
    }
    .product-info-detail-row.lista-ikony a.iko-oblibene,
    .product-info-detail-row.lista-ikony a.iko-velikosti,
    .product-info-detail-row.lista-ikony a.add-product-to-comparison {
        border-bottom: 0px solid #e5e5e5;
    }
    #dodani_zbozi {
        font-size: 1.4rem;
        padding: 10px 45px;
    }
    .centeredContent .ikony {
        min-height: 46px;
    }
    .index #top-search-menu {
        padding: 0px 0 0 0px;
    }
    #top_categoriesContent {
        display: block;
    }
    #top_categoriesContent .categories .categoriesContent:after {
        transform:rotate(45deg);
        position:absolute;
        right: 14px;
        top: 9px;
        background: #fff;
        border:1px solid #e0e0e0;
        border-width:1px 0 0 1px;
        content:'';
        display:block;
        height:20px;
        margin:0 0 -10px -12px;
        width:20px;
    }
    #sk_line_3 a {
        float: none;
        margin-bottom: 10px;
    }
    #bottom-0 a {
        text-align: center;
    }
    #bottom-0 a span.fas,
    #bottom-0 a span.fab,
    #bottom-0 a span.far {
        padding: 0 0px 0 0;
    }
    #bottom-0 a span {
        display: block;
        float: none;
    }
    .top_category a {
        width: calc((100% / 4) - (40px / 4));
    }
    .top_category a:nth-child(6n-1) {
        border-left: 0px solid #e3e3e3;
    }
    #bottom .container .bottom_right ul li span.open-time {
    }
}
@media (min-width: 481px) and (max-width: 1024px) {
    .block-banner--bottom {
        gap: 20px;
    }
    .block-banner--bottom.bottom {
        margin-bottom: 20px;
    }
    .block-banner--in {
        width: calc(50% - (20px / 2));
    }
}

@media (min-width: 941px) {
    .iko-oblibene.bottom {
        display: none;
    }
}
@media (max-width: 940px) {
    #top-block a {
        line-height: 30px;
        font-size: 1.2rem;
        padding: 0 5px;
    }
    #top-block a.two {
        padding-left: 0px;
    }
    #top-block a.first {
        margin-right: 10px;
    }
    .product-detail-note {
        flex-wrap: wrap;
    }
    .product-button {
        display: none;
    }
    #productDetailRight #iko-oblibene {
        display: none;
    }
    /* --- merged from RESPONSIVE LISTING section --- */
    .proc-block {
        grid-template: auto / repeat(2,1fr);
    }
}

@media (min-width: 768px) and (max-width: 940px) {
    .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {
        top: 40px;
        right: 0px;
        color: #e5e5e5;
    }
    #productAdditionalImages-obal,
    .mfp-bottom-bar {
        display: none;
    }
    ul.detail-box-links li a, ul.detail-box-links li span, ul.sorter-box li a, ul.sorter-box li span {
        font-size: 1.4rem;
        padding: 0 5px;
    }
    #productMainImage {
        padding-left: 0px;
    }
    .ban_product_info .right {
        padding-top: 13px;
    }
    #best .index-0 .index_center .center_bottom {
        padding-bottom: 10px;
    }
    #best .index-0 .index_center {
        padding-top: 7px;
    }
    .kosik-button button {
        padding: 0 0 0 108px;
        font-size: 1.8rem;
    }
    .ban_product_info span.fa-mobile {
        font-size: 8rem;
        padding-right: 10px;
    }
    #productDetailRight .ceny-obal .sleva {
        padding-left: 0px;
    }
    .zaruka_big span {
        font-size: 2rem;
        padding-right: 15px;
        margin-right: 15px;
    }
    .darekzdarma .listing_foto,
    .darekzdarma .darek_right {
        width: 100%;
    }
    .darekzdarma .listing_foto,
    .darekzdarma .darek_right a {
        margin: 15px 0;
    }
    .darekzdarma .listing_foto a img {
        display: inline-block;
        max-width: 180px;
    }
    .darekzdarma .darek_right,
    .darekzdarma .darek_right a {
        text-align: center;
    }
    .darekzdarma .vyprodani {
        position: relative;
        right: initial;
        bottom: initial;
        text-align: center;
        margin-top: 10px;
        float: left;
        width: 100%;
    }
    #productAttributes .wrapperAttribsOptions .optionSelect {
        position: absolute;
        width: 45%;
    }
    #zalozky_main .best-buy .best-buy-image {
        max-width: 26%;
    }
    #kontakt_bottom .kontakt-box-2 {
        font-size: 1.6rem;
    }
    .barevne_varianty a {
        width: calc((100% / 4) - (24px / 4));
    }
}
@media (min-width: 767px) {
    .no-more-767 {
        display: none!important;
    }
}
@media (min-width: 768px) {
    .no-more-768 {
        display: none!important;
    }
    .affix {
        top: 20px;
        z-index: 9999 !important;
        position: fixed !important;
    }
    #description-add.cybex .left ul li p {
        text-align: left;
    }
    .cookies-info__content{
        margin-right:150px;
    }
    .block-banner {
        grid-template:
            "main main main main"
            "banner1 banner2 banner3 banner4" /
            1fr 1fr 1fr 1fr;
    }
    .proc-block__in span {
        display: none;
    }
    .nas_tym {
        grid-template: auto / repeat(3,1fr);
    }
    .nas_tym h2 {
        grid-column: span 3;
    }
}
@media (max-width: 767px) {
    .no-767 {
        display: none!important;
    }
    .container {
        padding-left: 8px;
        padding-right: 8px;
    }
    h1 {
        font-size: 2.2rem;
    }
    .mobilstyle {
        width: 100%!important;
        max-width: 100%!important;
        text-align: center;
        padding-left: 0;
    }
    #top-block {
        text-align: center;
    }
    #top.container {
        height: 55px;
    }
    #top-kosik,
    #top-mujucet {
        margin-left: 22px;
    }
    #top-search.open {
        top: 55px;
    }
    #navBreadCrumb span,
    #best,
    #nejprodavanejsi-button,
    .best-buy,
    #indexProductList .best_out {
        display: none;
    }
    .productdetail #navBreadCrumb span.last_active,
    .productdetail #navBreadCrumb span.last_active a,
    .productdetail #navBreadCrumb span.last_active span {
        display: block;
        display: inline-block;
        text-decoration: none;
    }
    .columnCenter.productdetail #navBreadCrumb {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .productdetail #navBreadCrumb span.last_active a::before {
        content: "<";
        display: inline-block;
    }
    /* Phase 85 B1 — category mód: odkrýt obsah breadcrumbu na kategorii.
       Přebíjí `#navBreadCrumb span { display:none }` výše (id+class+element > id+element),
       platí JEN pro .breadcrumb-category (šablony kategorie) — produkt drží „< zpět". */
    #navBreadCrumb.breadcrumb-category span {
        display: inline;
    }
    #productMainImage {
        padding-left: 0px;
    }
    #novinky-akce .novinky_title {
        font-size: 2rem;
        padding: 0 0 10px 0;
    }
    #novinky-akce p {
        display: none;
    }
    span.bottom_title {
        padding: 0px 0 5px 0;
    }
    #bottom-2 .footerbox.podpora span.bottom_title {
        padding-top: 0px;
    }
    .productDetailLeft, #productDetailRight {
        width: 100%!important;
    }
    .productDetailLeft {
        margin-top: 15px;
    }
    #productDetailRight .expedice_text_in,
    .product-info-detail-row.kod {
        padding-left: 0px;
        padding-right: 0px;
    }
    .detail-box-folder {
        padding-left: 0px;
    }
    #nl-box-window,
    #nl-content {
        width: 300px;
        height: 195px;
    }
    #odber-novinek-center p,
    #odber1 .right {
        float: none;
        display: inline-block;
    }
    #contactUsNoticeContent .kontakt-block,
    #contactUsNoticeContent .right{
        width: 100%;
    }
    #contactUsNoticeContent .left {
        width: 100%;
    }
    #contactUsNoticeContent .left p,
    #contactUsNoticeContent p {
        text-align: center;
    }
    #contactUsForm .input-text {
        width: 50%;
    }
    #contactUsForm .alert.forward {
        margin-bottom: 10px;
    }
    .productDetailLeft #productImagesBox .ikony {
        top: -10px;
    }
    .productDetailLeft #productImagesBox .ikony.two img {
        width: 44px;
        height: auto;
    }
    #cartAdd {
        margin: 0 0 45px 0;
    }
    .centerBoxContentsProducts-in {
        padding: 10px;
    }
    .centeredContent .ikony {
        left: -10px;
    }
    .snippet-woman {
        margin-bottom: 25px;
    }
    .centeredContent .doporucena-cena {
        display: none;
    }
    .centerBoxContentsProducts .listing_foto {
        padding: 0px;
        text-align: center;
    }
    .detail-box {
        margin-top: 25px;
    }
    #dodani_zbozi {
        font-size: 1.2rem;
    }
    #description-add .spec_description div.left,
    #description-add .spec_description div.right {
        width: 100%;
    }
    #description-add .spec_description div.left span,
    #description-add .spec_description div.left p {
        display: inline-block;
        float: none;
    }
    #description-add .spec_description div.left p.title {
        display: block;
    }
    .centeredContent .listing-coupon-box {
        font-size: 1rem;
    }
    #description-add .spec_description table td {
        display: block;
        width: 100%;
    }
    /* #header VYJMUT z tohoto inherit pravidla (Phase 63-C fix) — sticky hlavička
       potřebuje explicitní z-index nad obsahem, jinak ji pozdější positioned obsah
       v DOM (banery, #zbozi z-index:9999, …) překreslí. .mm-slideout ponechán. */
    .mm-slideout {
        z-index: inherit!important;
    }
    /* Phase 63-C: sticky mobilní hlavička (parita s ceske-matrace.cz). #header
       sticky na mobilu drží hlavičku (i top-action-strip 63-A + mobile-search-bar
       + našeptávač, vše vnořené) nahoře na všech stránkách včetně PDP, bez JS.
       z-index:11000 = nad veškerým obsahem (max ~10002: #zbozi/instagram/menu),
       pod modaly (99999+). Tím se zvednutím #header opraví i překryv našeptávače
       (je vnořený). Při otevřeném mmenu sticky VYPNOUT na static: html.mm-opened
       transformuje .mm-slideout (obal #header) → sticky uvnitř transformovaného
       předka se rozbije; transform navíc #header odsune, takže menu overlay funguje. */
    #header {
        position: sticky;
        top: 0;
        z-index: 11000;
    }
    html.mm-opened #header {
        /* Při otevřeném mmenu: relative + z-index:0 vytvoří stacking context, který
           udrží celou hlavičku (vč. badge z-index:10000 a ikon) POD menu (z-index:1000)
           — jinak vysoký z-index badge/ikon prosvítá nad otevřené menu (user report
           2026-06-04). relative (ne sticky) = bezpečné uvnitř .mm-slideout transformu. */
        position: relative;
        z-index: 0;
    }
    /* Phase 63-D: skrýt in-header lupu na mobilu (search teď v #mobile-search-bar).
       Bez !important — @max-767 je v source pozdější než @max-1024 inline-block. */
    #navigation-search {
        display: none;
    }
    /* Phase 63-B fix (2026-06-04): .header-right flex na mobilu → účet + košík +
       hamburger NA JEDNÉ ŘÁDCE, vertikálně zarovnané (původní float verze lámala
       hamburger na samostatný řádek). Lupa skrytá (63-D) → flex bezpečný.
       #top-kosik-ucet musí být taky flex (jinak jeho vnitřní float:right děti
       košík/účet kolabují vertikálně v zúženém flex-itemu). order: účet → košík
       → hamburger (vpravo), parita s ceske-matrace, bez DOM přesunu. */
    .header-right {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 16px;
    }
    #top-search-menu { order: 1; }
    #top-kosik-ucet {
        display: flex;
        align-items: center;
        gap: 16px;
        width: auto;
        order: 2;
    }
    #top-mujucet { order: 1; }
    #top-kosik {
        order: 2;
        position: relative; /* anchor pro .total-item badge (position:absolute) */
    }
    .header-right-button { order: 3; }
    /* Mobil: text účtu/košíku skrytý (no-1024) → jen ikona. Odstranit desktop
       padding-left (28/45px) + margin-left (22px), které byly prostorem pro
       absolutní FA ikonu — jinak prázdná mezera mezi účtem a košíkem (user report
       2026-06-04). Ikona static (inline), spacing řeší flex gap. */
    #top-mujucet, #top-kosik {
        padding-left: 0;
        margin-left: 0;
    }
    #top-kosik .header-icon,
    #top-mujucet .header-icon {
        position: static;
        width: 26px;
        height: 26px;
    }
    /* Phase 63-D: mobilní search bar (port z ceske-matrace.cz cm-custom.css 125-310,
       #top-naseptavac → #mobile-naseptavac). Persistent search pod sticky hlavičkou
       + kontaktní řádek + collapse-on-scroll (.is-hidden, JS) + našeptávač overlay.
       Reuse našeho /ajax/search snippetu (.sub/.sub-heading/.sub-heading-item). */
    #mobile-search-bar {
        position: relative;
        padding: 0 12px 8px;
        transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease;
        max-height: 80px;
        opacity: 1;
        z-index: 100;
    }
    #mobile-search-bar.is-hidden {
        max-height: 0!important;
        opacity: 0!important;
        padding-top: 0!important;
        padding-bottom: 0!important;
        overflow: hidden;
    }
    #mobile-search-bar .container {
        padding: 0;
        display: block!important;
    }

    .mobile-search-wrap {
        position: relative;
        display: flex;
        align-items: center;
        width: 95%;
        margin: 0 auto;
        border: 1px solid #bbb;
        border-radius: 8px;
        background: #fff;
    }
    .mobile-search-input {
        width: 100%;
        height: 36px;
        line-height: 36px;
        padding: 0 40px 0 14px;
        /* Phase 75 B7 (2026-06-28): 1.4rem (14px) → 1.6rem (16px). iOS Safari
           AUTO-ZOOMUJE stránku při fokusu inputu s font-size < 16px → našeptávač
           „moc široký", nedosáhneš na spodek, kolize s header collapse (user
           iPhone). 16px = práh bez zoomu. (Real-device Safari chování, nejde
           reprodukovat v Playwright.) */
        font-size: 1.6rem;
        color: #333;
        background: transparent;
        border: none;
        border-radius: 8px;
        -webkit-appearance: none;
        outline: none;
        box-sizing: border-box;
    }
    .mobile-search-input::placeholder {
        color: #aaa;
    }
    .mobile-search-btn {
        position: absolute;
        right: 4px;
        top: 50%;
        transform: translateY(-50%);
        width: 32px;
        height: 32px;
        border: none;
        background: transparent;
        cursor: pointer;
        color: #666;
        font-size: 1.4rem;
        padding: 0;
    }

    .mobile-contact-line {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 12px;
        padding: 4px 0 0;
        font-size: 1.1rem;
    }
    .mobile-contact-line a {
        /* Mobilní kontaktní řádek (telefon "Rádi Vám poradíme") — stejná proměnná
           jako desktop #top-kosik-ucet. Default #666/#333 = beze změny pro 40 světlých
           tenantů; 7 dark-header tenantů (:root override) → bílá i na mobilu.
           Issue 1 mobile follow-up 2026-06-17 (desktop fix 77df44a6 mobil nepokryl). */
        color: var(--header-contact-text-color, #666);
        text-decoration: none;
    }
    .mobile-contact-line a:last-child {
        font-weight: 600;
        color: var(--header-contact-text-color, #333);
    }
    .mobile-contact-line .fas {
        font-size: 1rem;
        -webkit-text-stroke: 0!important;
    }

    #mobile-search-bar .naseptavac-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        /* Phase 75 B7 (2026-06-28): 0.4 → 0.65 — při našeptávání podkladová
           stránka (produkty) prosvítala přes 40% backdrop = vizuální „overflow"
           nepořádek (Beneš/user mobil). Tmavší backdrop = čistý search overlay. */
        background: rgba(0,0,0,0.65);
        z-index: 9998;
    }
    #mobile-search-bar .naseptavac-overlay.is-visible {
        display: block;
    }
    #mobile-search-bar #mobile-naseptavac {
        position: absolute;
        top: 100%;
        /* Phase 75 B7: edge-to-edge (left 2.5%→0, width 95%→100%) — 2,5% boční
           mezera nechávala prosvítat podkladové červené badge/„-XX%" kruhy
           (červený proužek vlevo, user screenshot). + max-height 65→72vh (víc
           výsledků viditelných, menší ořez). border-radius 0 = edge-to-edge. */
        left: 0;
        width: 100%;
        max-height: 72vh;
        overflow-y: auto;
        border: none;
        border-radius: 0;
        box-shadow: 0 8px 24px rgba(0,0,0,0.25);
        z-index: 9999;
        background: #fff;
        -webkit-overflow-scrolling: touch;
    }
    #mobile-search-bar #mobile-naseptavac .sub {
        float: none;
        width: 100%;
        border: none;
    }
    #mobile-search-bar #mobile-naseptavac .sub-heading {
        padding: 5px 10px 3px;
        margin: 0;
        font-size: 1.1rem;
        font-weight: 700;
        color: #888;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        background: #fafafa;
        float: none;
        width: auto;
        border-bottom: 1px solid #f0f0f0;
    }
    #mobile-search-bar #mobile-naseptavac .sub-heading:first-child {
        border-radius: 0;
    }
    #mobile-search-bar #mobile-naseptavac .sub-heading-item {
        float: none;
        width: auto;
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 5px 10px;
        border-bottom: 1px solid #f5f5f5;
    }
    #mobile-search-bar #mobile-naseptavac .sub-heading-item a {
        display: inline;
        padding: 0;
        margin: 0;
        font-size: 1.4rem;
        color: #333;
        text-decoration: none;
        line-height: 1.4;
        flex: 1;
        min-width: 0;
    }
    #mobile-search-bar #mobile-naseptavac .sub-heading-item a:hover,
    #mobile-search-bar #mobile-naseptavac .sub-heading-item a:active {
        background: #f5f5f5;
        color: #111;
    }
    #mobile-search-bar #mobile-naseptavac img.sub-heading-prev {
        max-width: 30px;
        width: auto;
        height: auto;
        border-radius: 6px;
        object-fit: contain;
        flex-shrink: 0;
        float: none;
    }
    #mobile-search-bar #mobile-naseptavac .sub-heading-item:has(.naseptavac-name) img.sub-heading-prev {
        max-width: 40px;
        width: 40px;
        height: 40px;
        object-fit: cover;
        border-radius: 6px;
    }
    #mobile-search-bar #mobile-naseptavac .sub-heading-name {
        float: none;
        width: auto;
        flex: 1;
    }
    #mobile-search-bar #mobile-naseptavac .naseptavac-name {
        font-size: 1.3rem;
        line-height: 1.3;
    }
    #mobile-search-bar #mobile-naseptavac .naseptavac-price {
        font-size: 1.2rem;
        font-weight: 600;
        margin-top: 2px;
    }
    #frm-watchForm label.inputLabel {
        width: 100%;
        padding-bottom: 5px;
    }
    #frm-watchForm .input-text {
        width: 91%;
        margin-bottom: 22px;
    }
    label.label_space,
    .alert.label_space {
        float: none;
        margin-bottom: 22px;
        display: inline-block;
    }
    .categorie-list ul li a img {
        height: auto;
        width: 45px;
    }
    #top_category {
        margin: 20px -8px;
    }
    #top_category a {
        width: 50%;
        padding: 7px;
    }
    .index .specialListExtra8 .centerBoxContentsProducts:nth-child(2n-2) .centerBoxContentsProducts-in:before {
        content: none;
    }
    #indexDefault .nav-tabs-out ul.nav-tabs {
        padding: 25px 0 15px 0;
        white-space: nowrap;
        overflow-y: hidden;
        overflow-x: auto;
        width: 100%;
    }
    .container-in .nav-tabs-out,
    #snippet-tabProductListThird-tabList .nav-tabs-out {
        border-bottom: 0px solid #ddd;
    }
    #snippet-tabProductListThird-tabList .centerBoxContentsProducts {
        width: 100%;
    }
    #snippet-tabProductListThird-tabList .centerBoxContentsProducts .centerBoxContentsProducts-in:before {
        content: none;
    }
    .ban_side_by_side div {
        width: 100%;
        padding: 0!important;
    }
    .ban_side_by_side div:first-child {
        margin-bottom: 17px;
    }
    table.table_cybex tr td {
        width: 49%;
    }
    #productDescription1 #description-more h2 {
        font-size: 2rem;
    }
    .bannListing {
        gap: 14px;
    }
    .bannListing a {
        max-width: calc(50% - 7px);
    }
    #description-more .abc-block {
        flex-direction: column;
    }
    #description-more .abc-block-in {
        width: 100%;
    }
    #top .container {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .top_category a {
        width: calc((100% / 2) - (20px / 2));
    }
    .top_category a:nth-child(2n-1) {
        border-left: 0px solid #e3e3e3;
    }
    #bottom .container_in {
        grid-template-columns: 1fr;
        padding-top: 0;
        gap: 0;
    }
    .block-doprava {
        flex-wrap: wrap;
    }
    .prodejny .block-doprava--in,
    .sluzby .block-doprava--in,
    .sluzby.tonovani .block-doprava--in,
    .block-doprava--in {
        width: 100%;
    }
    ul.detail-box-links li a,
    ul.detail-box-links li span,
    ul.sorter-box li a,
    ul.sorter-box li span {
        padding: 0 6px;
    }
    .footerbox {
        width: 50%;
    }
    .footerbox-full {
        margin-top: 0px;
    }
    #bottom .container .bottom_left {
        display: flex;
        flex-wrap: wrap;
    }
    #bottom .container .bottom_right .footerbox {
        width: 100%;
    }
    /*.bottom_right {
        border-bottom: 1px solid #e3e3e3;
        padding-bottom: 28px;
    }*/
    .bottom_copyright {
        border-top: 1px solid #e3e3e3;
        padding: 18px 0;
    }
    #cartEmptyText .btn.green {
        margin-top: 20px;
    }
    #productsListingListingTopLinks,
    #indexProductListCatDescription.zkraceny,
    #clickAllText {
        display: none;
    }
    .index #top_bottom .header-left,
    #top_bottom .header-left {
        width: 60%;
    }
    .index #top_bottom .header-right,
    #top_bottom .header-right {
        width: 40%;
    }
    .proc-block {
        gap: 8px;
    }
    .proc-block__in i {
        font-size: 2.4rem;
    }
    .proc-block__in h3 {
        font-size: 1.1rem;
        margin: 10px 0 4px 0;
    }
    .proc-block__in p {
        font-size: 0.9rem;
    }
    .proc-block__in {
        padding: 16px 12px 12px 12px;
    }
    .proc-block__in span {
        display: inline;
    }
    .doprava-text {
        margin-bottom: 24px;
    }
    #box-doprava,
    #zalozka-doprava div.doprava-row {
        padding: 14px;
    }
    #box-doprava {
        padding-top: 20px;
    }
    #zalozka-doprava div.doprava-row,
    #zalozka-doprava div.doprava-item-text {
        gap: 14px;
    }
    .listing_foto a img {
        display: block;
        /* center block image v širších cellech (specialList/tabProductList HP) —
           text-align:center necentruje block element; 268px obrázek v 323px cellu
           jinak leží vlevo (user 2026-06-05). Standardní grid cell==image → no-op. */
        margin-left: auto;
        margin-right: auto;
    }
    .centeredContent .product-list-24h,
    .centeredContent .youtube-video {
        bottom: -4px;
    }
    /* --- merged from RESPONSIVE LISTING section --- */
    .categorie-list ul li {
        width: 100%;
        margin: -1px 0 0 0;
    }
    .productListing,
    .special-productlist-box,
    .owl-prdlist,
    .vsechny-barevne-varianty {
        grid-template-columns: repeat(2, 1fr);
    }
    .special-productlist-box,
    .owl-prdlist {
        gap: 8px;
    }
    .productListing div.centerBoxContentsProducts {
        order: 3;
    }
    .productListing div.centerBoxContentsProducts:nth-child(-n+11) {
        order: 1;
    }
    div.bannerListing {
        width: 100%;
        order: 2;
    }
    #advSearchResultsDefault .productListing div.centerBoxContentsProducts,
    #advSearchResultsDefault .productListing div.centerBoxContentsProducts:nth-child(-n+11),
    #advSearchResultsDefault div.bannerListing {
        order: inherit;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    h2.centerBoxHeading {
        font-size: 2.2rem!important;
    }
    #bottom .container .bottom_right .footerbox {
        grid-template: auto / 1fr 1fr;
    }
    #bottom .container .bottom_right .footerbox span.bottom_title {
        grid-column: span 2;
    }
}
@media (min-width: 481px) {
    .block-banner {
        grid-template:
            "main main main main"
            "banner1 banner2 banner3 banner4" /
            1fr 1fr 1fr 1fr;
    }
    .block-banner--bottom.detail {
        gap: 17px;
    }
}

@media (max-width: 480px) {
    .no-480 {
        display: none!important;
    }
    h2.centerBoxHeading,
    .index h2.centerBoxHeading {
        font-size: 1.8rem;
        padding-bottom: 10px;
        border-bottom: 0px solid red;
        margin: 10px 0;
    }
    .index h2.centerBoxHeading span {
        background-color: transparent;
        color: #1a1a1a;
        padding: 0px;
    }
    .bottom_right .footerbox {
        padding-bottom: 0;
    }
    .footerbox .fa-ikon {
        padding: 0 0 8px 0;
    }
    #kontakt_bottom .kontakt-box-2 {
        padding-top: 15px;
    }
    #kontakt_bottom .kontakt-box-2 .text {
        width: 100%;
        text-align: center;
        margin-bottom: 14px;
    }
    #kontakt_bottom .kontakt-box-2 .text span {
        display: inline-block;
        float: none;
        font-size: 2.1rem;
    }
    .odber-novinek-bottom .input-odber {
        padding: 10px 35px 10px 10px;
    }
    .odber-novinek-bottom .button-odber {
        width: 62px;
        padding-left: 5px;
        padding-right: 5px;
    }
    .kontakt-widget {
        text-align: center;
    }
    .ceny-coupon, .ceny-discount {
        padding: 10px 0;
        font-size: 1.4rem;
    }
    #productDetailRight .ceny-obal .ceny.coupon {
        padding: 0 0px;
    }
    .ceny-coupon .left span.coupon-price, .ceny-discount .left span.coupon-price {
        font-size: 2.4rem;
        padding-right: 2px;
    }
    .ceny-coupon .right, .ceny-discount .right {
        padding-top: 11px;
    }
    #zobrazit {
        clear: both;
        margin-top: 0px;
        float: left;
    }
    ul.detail-box-links li {
        float: none;
        margin-right: 0px;
    }
    ul.detail-box-links li a,
    ul.detail-box-links li.selected a,
    ul.detail-box-links li span {
        border-top: 1px solid #c5c4c4!important;
        float: none;
    }
    .centerColumn {
        position: relative;
    }
    .filtr-pole {
        width: 100%;
    }
    #advSearchResultsDefault .filtr-nazev {
        text-align: left;
        width: 30%;
    }
    .filtr-hodnoty .search-input.cena {
        width: 34%;
    }
    #indexProductList #frm-filterSpecial-filtr div.filtr-hodnoty .filtr-input {
        width: 50%;
    }
    #productsListingListingBottomLinks {
        float: none;
        display: inline-block;
    }
    #productsListingListingTopLinks {
        margin-bottom: 15px;
    }
    #modalCartContent .text {
        font-size: 1.8rem;
        padding: 10px 0 10px;
        text-align: center;
    }
    #sk_line_1 {
        padding: 0px 10px;
        text-align: center;
        border-bottom: 2px solid #e5e5e5;
        padding-bottom: 10px;
    }
    #sk_line_1 .sk_product_info {
        padding: 0px 0px;
    }
    #sk_line_1 .sk_product_info .foto {
        position: relative;
        display: inline-block;
    }
    #sk_line_1 .sk_product_info .nazev {
        padding: 10px 0;
    }
    #sk_line_1 .sk_order_it {
        position: relative;
        display: inline-block;
        top: 0px;
    }
    #sk_line_3 img {
        float: left;
        width: 100%;
    }
    #best .index-0 {
        padding: 0px;
    }
    #best .index-0 .index_center {
        position: relative;
        width: 100%;
        padding: 98px 0 15px 0;
    }
    #best .index-0 .index_center .center_top .dostupnost_text,
    #best .index-0 .index_center .center_top a {
        float: none;
    }
    #best .index-0 .index_center .center_top .dostupnost_text {
        padding-top: 5px;
    }
    #best .index-0 .index_center .center_bottom {
        text-align: center;
    }
    #odber-novinek-center {
        text-align: center;
    }
    #odber-novinek-center p {
        padding-right: 0;
        text-align: center;
    }
    #odber-novinek-center .right {
        display: inline-block;
        float: none;
        padding-top: 10px;
        text-align: center;
    }
    #odber1 .input-text, #odber1 .button-odber {
        display: inline-block;
        float: left;
        position: relative;
        right: auto;
        top: auto;
    }
    #odber1 .button-odber {
        margin-left: 5px;
    }
    .product-info-detail-row.lista-ikony a {
        padding: 8px 5px;
    }
    #sk_line_1 .line-foto, #sk_line_1 .cena-nazev {
        position: relative;
        float: none;
        padding: 0px;
    }
    #sk_line_1 .line-foto {
        padding: 10px 0;
    }
    #sk_line_3 .btn {
        width: 100%;
        margin-bottom: 10px;
    }
    #contactUsForm input {
        width: 90%;
    }
    .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {
        top: 40px;
        right: 0px;
        color: #e5e5e5;
    }
    .table_compare table td {
        position: static;
    }
    th.fixed {
        z-index: 1;
    }
    .parametry.compare .parametry_nazev {
        position: relative;
    }
    .table_compare .inner {
        margin-left: 0;
    }
    .compare-table table td, .compare-table table th {
        float: left;
        position: relative;
    }
    .table_compare .scrollbar-top {
        margin-left: 0px;
    }
    .darekzdarma .listingDescription {
        height: 14px;
    }
    .darekzdarma .vyprodani {
        font-size: 1.1rem;
    }
    .darekzdarma .darekcena {
        margin-top: 10px;
    }
    .poradna-top td {
        display: block;
    }
    .poradna-top td.poradna_img {
        padding-top: 25px;
        padding-left: 0px!important;
    }
    #contactUsNoticeContent img.left {
        padding: 0 0px 10px 0!important;
    }
    .zaruka_big span {
        font-size: 2rem;
        padding-right: 15px;
        margin-right: 15px;
    }
    .darekzdarma .listing_foto,
    .darekzdarma .darek_right {
        width: 100%;
    }
    .darekzdarma .listing_foto,
    .darekzdarma .darek_right a {
        margin: 15px 0;
    }
    .darekzdarma .listing_foto a img {
        display: inline-block;
        max-width: 180px;
    }
    .darekzdarma .darek_right,
    .darekzdarma .darek_right a {
        text-align: center;
    }
    .darekzdarma .vyprodani {
        position: relative;
        right: initial;
        bottom: initial;
        text-align: center;
        margin-top: 10px;
        float: left;
        width: 100%;
    }
    #next-listing {
        bottom: 2px;
        left: inherit;
        right: 0;
        width: 140px;
        height: 35px;
    }
    #next-listing a {
        height: 35px;
        line-height: 35px;
        font-size: 1.6rem;
    }
    #go-top a {
        left: 0;
        width: 100%;
    }
    #productsListingListingBottomLinks {
        padding-bottom: 40px;
    }
    #productsListingBottom {
        border-bottom: 0px #c5c4c4 solid;
        margin-bottom: 0;
    }
    #productsListingTopNumber {
        width: 100%;
        margin-bottom: 15px;
    }
    .centeredContent .vanoce-out span {
        display: none;
    }
    .centeredContent .vanoce-out p {
        font-size: 1.1rem;
    }
    #productDetailRight .vanoce-out {
        padding-left: 0px;
        padding-right: 0px;
    }
    #productDetailRight .vanoce-out p {
        font-size: 1.2rem;
    }
    .qtip {
        max-width: 310px;
    }
    a#backToTop span {
        bottom: 15px;
        right: 15px;
        width: 48px;
        height: 48px;
        line-height: 48px;
        font-size: 2.4rem;
    }
    #productDetailRight .ceny-obal .sleva {
        padding-left: 0px;
    }
    .product-description .param_slozeni,
    .product-description .description,
    .product-description .description.description-wide,
    .product-description .manufacturers {
        width: 100%;
        margin-top: 24px;
    }
    .lego.age {
        flex-wrap: wrap;
    }
    .lego.age a,
    .lego.category a {
        width: 50%;
        margin-bottom: 15px;
    }
    .lego.age a span strong {
        line-height: 40px;
    }
    #indexProductListCatDescription.zkraceny {
        height: 49px;
    }
    #productDetailRight .show-all-variants-list a,
    #productDetailRight .show-all-variants-list .velikosti-listing-in {
        flex-wrap: wrap;
    }
    #productDetailRight .show-all-variants-list .velikosti-listing-in {
        padding: 0;
    }
    #productDetailRight .show-all-variants-list a {
        min-width: inherit;
        padding: 10px 80px 10px 60px;
    }
    #productDetailRight .show-all-variants-list a .variants-name,
    #productDetailRight .show-all-variants-list a .variants-qu,
    #productDetailRight .show-all-variants-list .variants-price {
        width: 100%;
        padding: 0px 0 0 10px;
        max-width: inherit;
        text-align: left;
    }
    #productDetailRight .show-all-variants-list a img {
        position: absolute;
        left: 0;
        top: 10px;
        padding-bottom: 0px;
    }
    #productDetailRight .show-all-variants-list .velikosti_button {
        position: absolute;
        right: 0;
        top: 24px;
    }
    #productDetailRight .show-all-variants-list a .variants-color,
    #productDetailRight .show-all-variants-list .variants-24h {
        display: none;
    }
    #productDetailRight .show-all-variants-list .kosik-button .shopingCardButton-submit span span {
        display: block;
    }
    .ban_product_info {
        padding: 15px 10px;
    }
    .ban_product_info span.fa-mobile-alt {
        padding-right: 10px;
    }
    .ban_product_info span.fa-mobile-alt {
        font-size: 7.6rem;
    }
    .prodejna_img_out img.prodejna_img {
        padding: 0 0 15px 0!important;
    }
    .bannListing a {
        max-width: 100%;
    }
    .block-banner--bottom {
        flex-direction: column;
    }
    .block-banner--bottom.bottom {
        margin-bottom: 8px;
    }
    .services .services--in {
        width: 100%;
    }
    #cartAdd-out {
        flex-wrap: wrap;
        height: auto;
    }
    #cartAdd {
        margin-bottom: 0px;
    }
    #productDetailRight .splatky-essox {
        width: 100%;
        min-width: 100%;
        margin: 0;
    }
    .footerbox-full {
        width: 100%;
    }
    .footerbox-full:last-child {
        border-bottom: 1px solid #e3e3e3;
    }
    .barevne_varianty a {
        width: calc((100% / 4) - (24px / 4));
    }
    .footerbox-full .footerbox {
        width: 100%;
    }
    .centeredContent .dostupnost_text {
        font-size: 0.9rem;
    }
    .index #top_bottom .header-left,
    #top_bottom .header-left {
        width: 70%;
    }
    .head_menu a {
        padding: 5px 0px;
    }
    .bottom_copyright {
        flex-direction: column;
    }
    .centeredContent .vanoce-out {
        padding: 10px 0 0px 0;
        gap: 0px;
        flex-direction: column;
    }
    #zalozka-doprava div.doprava-item-text {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    #zalozka-doprava .price-item {
        text-align: left;
    }
    /* --- merged from RESPONSIVE LISTING section --- */
    .centerBoxContentsProducts,
    #shoppingCartDefault .centerBoxContentsProducts,
    .index .centerBoxContentsProducts {
        padding: 0px;
    }
    .productListing div.centerBoxContentsProducts:nth-child(2n-2),
    .vsechny-barevne-varianty div.centerBoxContentsProducts:nth-child(2n-3) {
        border-left: 0px solid #e9e9e9;
    }
    #similarproducts .centerBoxContentsProducts,
    #similarproducts .centerBoxContentsProducts1 {
        width: 100%;
    }
}

/* *********** RESPONSIVE LISTING (non-duplicate blocks) *********** */

@media (min-width: 981px) {
    .productListing div.centerBoxContentsProducts:nth-child(4n-2),
    .vsechny-barevne-varianty div.centerBoxContentsProducts:nth-child(4n-3) {
        border-left: 0px solid #e9e9e9;
    }
}
@media (min-width: 481px) and (max-width: 980px) {
    .productListing,
    .vsechny-barevne-varianty {
        grid-template-columns: repeat(3, 1fr);
    }
    .productListing div.centerBoxContentsProducts:nth-child(3n-1),
    .vsechny-barevne-varianty div.centerBoxContentsProducts:nth-child(3n-2) {
        border-left: 0px solid #e9e9e9;
    }
}

/* === Phase 63 desktop (2026-06-04 user): header-right flex layout (parita s
   ceske-matrace) — search (vlevo, roste) + subbloky kontakt/účet/košík (vpravo)
   NA JEDNÉ ŘÁDCE. Dřív byly subbloky full-width block + search se stackoval pod ně
   a zajížděl pod "Aktuálně se nakupuje" odkazy. + vertikální oddělovače mezi
   subbloky. Scoped ≥1025 (desktop, kde se zobrazují labely a plný search). === */
@media (min-width: 1025px) {
    /* SCOPE #top .header-right — JEN hlavní hlavička (topContainer v #top).
       NE nav .header-right (produktySkladem/topBottom v #top_bottom = AKČNÍ/SLEVY
       banner), který class .header-right SDÍLÍ. Bez scope flex rozbil ten banner. */
    #top .header-right {
        display: flex;
        align-items: center;
        gap: 16px; /* menší → víc místa pro širší search (user 2026-06-04) */
        float: right;
    }
    #top-search-menu {
        order: 1;
        /* search roste do prostoru vlevo od subbloků (kontakt+účet+košík vpravo),
           cap max-width 620px (parita s matrace). flex-grow:1 = vyplní volné místo;
           reálná šířka ~518px (subbloky berou zbytek header-right). */
        flex: 1 1 auto;
        max-width: 620px;
        width: 100%;
        float: none;
        margin: 0;
    }
    #top-kosik-ucet {
        order: 2;
        flex: 0 0 auto;
        width: auto; /* subbloky content-width, vpravo (search vlevo grow) */
    }
    /* Separátor padding přes ID selektory (#top-mujucet/#top-kosik = 2 ids) —
       MUSÍ beat `#top-kosik-ucet #top-mujucet { margin:0; padding:0 }` (taky 2 ids,
       ale dřív v source). Bez toho byl padding/margin 0 → text přilepený k
       separátoru (root cause nahuštění, user 2026-06-04). account + cart =
       :not(:first); kontakt (1.) separátor nemá. */
    #top-kosik-ucet #top-mujucet,
    #top-kosik-ucet #top-kosik {
        position: relative;
        padding-left: 24px;
        margin-left: 24px;
    }
    /* vertikální oddělovač = centered pseudo (fixní výška, parita s matrace) */
    #top-kosik-ucet #top-mujucet::before,
    #top-kosik-ucet #top-kosik::before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 1px;
        height: 46px;
        background: #c4c4c4;
    }
    /* search box parita s matrace na desktopu (bibik byl 52px pill + černý button
       = moc velký/jiný). Matrace: #top-search wrapper 1px border + 7px rounded
       obdélník, input bez borderu, button bílý bg + subtle lupa. Mobil OK
       (#mobile-search-bar/.mobile-search-input separátní) → netknut. */
    #top-search-menu form {
        width: 100%; /* form vyplní menu → #top-search může width:100% = širší search */
    }
    #top-search {
        /* matrace search box: SOUVISLÉ orámování na wrapperu (#999 prominentní,
           user "výraznější"), input i button bez vlastního borderu/bg → žádný
           překryv u lupy. width:100% → vyplní širší menu (620). */
        width: 100%;
        border: 1px solid #999;
        border-radius: 7px;
    }
    .top-search-input {
        height: 42px;
        line-height: 42px;
        padding: 0 47px 0 15px;
        border: none;
        border-radius: 7px 0 0 7px;
    }
    /* 63-F: matrace search button UNIVERZÁLNĚ pro všechny tenanty. Transparent bg
       (žádný box → SOUVISLÉ orámování, lupa plave na bílém inputu, žádný překryv
       borderu u lupy — user 2026-06-04). #top-search-menu specificity beats tenant
       custom → bezpečná propagace (lupa vždy kontrastuje s bílým inputem). */
    #top-search-menu .top-search-button {
        height: 42px;
        line-height: 42px;
        width: 42px;
        background-color: transparent;
        border: 0;
        right: 0;
    }
    /* lupa JAKO MATRACE: černá + bílý text-stroke 1px (na bílém inputu ztenčí
       = thin look, ne tučná) — color:#000, font-size:1.8rem (matrace exact). */
    #top-search-menu .top-search-button span {
        color: #000;
        font-size: 1.8rem;
        -webkit-text-stroke: 1px #fff;
    }
}

/* ==========================================================================
   Phase 85 — blok podkategorií jako „chipy" (JEN mobil, max-width: 767px)
   ==========================================================================
   PROBLÉM: `.categorie-list ul li { width: 100% }` (ř. 1584) stavěl na mobilu
   každou podkategorii na vlastní celoširoký řádek. Na www.bibik.cz/kocarky to
   bylo 9 řádků = 598 px a první produkt až na 1339 px, tedy 2,02 obrazovky.
   Naměřeno WebKitem na iPhonu 13 (docs/phase-85-category-page-ux/baseline/).

   ŘEŠENÍ: mřížka o dvou sloupcích místo celoširokých řádků. Naměřeno
   (WebKit, iPhone 13, produkce, výška bloku a pozice prvního produktu, před → po):

              stránka       pol.    390 px               320 px (iPhone SE)
     bibik  /kocarky          9   598→243, 1339→ 983   598→313, 1309→1023
     bibik  /autosedacky     13   858→408, 1599→1148   865→425, 1576→1136
     bibik  /krmeni          16  1053→455, 1794→1196  1067→525, 1778→1236
     goldex /zlate-sperky     9   598→243, 1210→ 854   598→260, 1180→ 842
     zasnubni-prsteny.cz      4   273→135,  885→ 747   287→135,  869→ 717

   Na /kocarky to je 2,02 → 1,48 obrazovky k prvnímu produktu a 9 řádků → 5.

   Mřížka je proti volnému tečení lepší právě tam, kde to bolí nejvíc — u dlouhých
   názvů. Kategorie se čtyřmi dlouhými názvy: volné tečení 195 px na 4 řádcích,
   mřížka 135 px na 2. Na snadných případech je naopak o něco vyšší (/kocarky 243
   vs 195), protože delší názvy se v užší buňce lámou na dva řádky. Na 320 px je
   mřížka nižší skoro všude.

   ROZSAH ZÁMĚRNĚ ÚZKÝ:
   - Jen mobil. Desktop a tablet se nemění — zadání majitele je mobilní.
   - Jen vlastnosti ROZVRŽENÍ. Pozadí, rámeček ani rádius se nesahá, protože
     si je nastavují jednotliví tenanti (bibik-cz ř. 71, goldex-eshop-cz ř. 240)
     a se stejnou specificitou by nás přebili pořadím načítání. Ověřeno: žádný
     z 15 živých klientských CSS souborů nemění rozvržení tohoto bloku, jen barvy
     (`git grep -ln "categorie-list" -- '*.css'` vrátí 18, ale 3 jsou mrtvé
     zálohy `.back`/`.backup`, které se nenačítají).
   - Markup se NEMĚNÍ. Tím zůstávají platné všechny tři šablony
     (Category/default, Category/topDefault, Manufacture/default), 18 přepisů
     tenantů, měřicí skript i regresní testy.

   Hlídá: core/tests/e2e/regression/category-subcategory-chips.spec.ts
   ========================================================================== */
@media (max-width: 767px) {
    /* MŘÍŽKA O DVOU SLOUPCÍCH, ne volně tekoucí řádek.
       Volné tečení (`flex-wrap`) dělá plošky široké podle délky názvu, takže pravý
       okraj je roztřepený — na /kocarky 8 různých šířek, na /krmeni 14, volno vpravo
       15–157 px. Owner to odmítl (2026-08-04).
       Centrování to NEŘEŠÍ: změřeno, že rozbije i levou hranu (na /krmeni osm různých
       levých okrajů řádků) a pravou nesrovná — u seznamu čteného shora dolů je
       roztřepená levá hrana to nejdražší.
       Roztažení přes `flex-grow` taky ne: u kategorie s dlouhými názvy se 3 ze 4
       plošek roztáhnou na plnou šířku, tedy zpět k původnímu stavu.
       Mřížka odstraní příčinu — všechny plošky mají JEDNU šířku a obě hrany lícují. */
    .categorie-list ul {
        display: grid;
        /* minmax(0, 1fr), NE holé 1fr — jinak se sloupec nesmí zmenšit pod min-content
           položky a mřížka přeteče do stran (viz .claude/rules/css-architecture.md). */
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    /* `ul:after { content:''; flex:auto }` (stylesheet.css ř. 4225) je výplňkový prvek
       pro flex. V mřížce se z něj stane BUŇKA: u sudého počtu položek založí nový
       řádek a přidá 8 px navíc (změřeno na /krmeni: 450 vs 442 px). */
    .categorie-list ul:after {
        content: none;
    }
    .categorie-list ul li {
        width: auto;
        margin: 0;
    }
    .categorie-list ul li a {
        /* DOTYKOVÝ CÍL 39,5 px — VĚDOMÉ ROZHODNUTÍ MAJITELE (2026-08-04), ne přehlédnutí.
           14 px písmo × 1.25 + 20 padding + 2 border = 39,5 px. Ověřeno subpixelově
           (`getBoundingClientRect`, ne `offsetHeight` — ten zaokrouhluje a schoval by
           například hodnotu 43,5 jako 44).

           Kde to stojí vůči normám:
             WCAG 2.2 AA  (2.5.8 Target Size Minimum) = 24 px → SPLNĚNO s rezervou
             WCAG 2.1 AAA (2.5.5 Target Size)         = 44 px → nesplněno, záměrně
             Material Design chip                     = 32 dp → jsme nad tím
           Plošky navíc dělí 8px mezera, takže se sousedé nepřekrývají.

           Zadání znělo „kompaktnější, ale pořád dobře ovladatelné". Změřené stupně:
             16 px, 12/14 → ploška 46,0 px, blok 329 px  (původní návrh)
             14 px, 12/12 → ploška 43,5 px, blok 211 px
             14 px, 10/12 → ploška 39,5 px, blok 195 px  ← ZVOLENO
             14 px,  8/12 → ploška 35,5 px, blok 179 px
           Hlavní úsporu dělá PÍSMO (−118 px), ne odsazení (−16 px). NESNIŽOVAT dál
           bez nového rozhodnutí — pod 24 px by to porušilo i WCAG AA.

           ⚠️ NEZKOUŠET ZNOVU: rozšířit dotykovou zónu přes `a:after` se zápornými
           `top`/`bottom` (vizuálně malá ploška, velká klikací zóna) NEFUNGUJE
           spolehlivě. Změřeno zásahovým testem po pixelech (`elementFromPoint`):
           u části plošek zůstal dotyk na vizuálních 35,5 px, protože zónu přebije
           sousední řádek. Rozsah vyšel 35,5–42,5 px, tedy nepředvídatelný. */
        padding: 10px 12px;
        font-size: 1.4rem;
        line-height: 1.25;
    }
    /* Zástupný obrázek pryč — je to N-krát totéž logo pod sebou.
       Změřeno 2026-08-04 per ŽIVÝ rozsah (projectId z tenant params.neon, ne všechny
       řádky v DB — na tom jsem se poprvé spletl):
         beneo, 42 živých tenantů : 344 bloků, ve VŠECH 344 nemá obrázek žádná
                                    položka; 0 z 2125 položek má obrázek
                                    (obrázky drží projekty 121 a 125 = neobsluhované)
         goldex, 15 živých        : 235 bloků, 187 bez obrázku (79,6 %);
                                    123 z 826 položek obrázek MÁ, ale soubory
                                    vracejí 404 (vzorek 15/15) = pre-existující vada
         kamnax, iceny            : NEZMĚŘENO
       Pravidlo `img { width: 24px }` níže tedy dnes nezmenšuje žádný funkční obrázek —
       zůstává proto, aby chipy nenarostly, pokud se ta data někdy opraví. */
    .categorie-list ul li a img[src$="no_image.png"] {
        display: none;
    }
    .categorie-list ul li a img {
        width: 24px;
        height: auto;
        margin-right: 8px;
    }
    /* Šipka je jinak pozičně vázaná na `padding-right: 38px`, které tu ruším.
       Na dotyku stejně není hover, kterým se zobrazuje. */
    .categorie-list ul li a:before {
        content: none;
    }
}

/* ==========================================================================
   Phase 85 — sloučený toolbar výpisu: Filtrovat | řazení | počet
   ==========================================================================
   PROBLÉM: tři celoširoké pruhy pod sebou. Změřeno na /kocarky (iPhone 13):
     „Upřesnit parametry"            38 px
     „Řazení: Nejprodávanější"       36 px
     „Zobrazeno 1–22 (z 3 369 zboží)" 52 px
     = 151 px od filtru k prvnímu produktu

   ŘEŠENÍ: obal `.listing-toolbar` v šabloně + flex. Naměřeno na prototypu proti
   produkci: první produkt 983 → 882 px (−101), a všechno NAD toolbarem zůstalo
   beze změny na pixel.

   PROČ OBAL A NE ČISTÉ CSS — obojí změřeno, obojí horší:
     flex na #indexProductList → rozbije kolaps okrajů u 10 ze 14 dětí,
       H1 33→57 px, a první produkt se posune 983→1006 px, tedy OPAČNĚ.
     floaty bez obalu → jen −45 px, prvky zůstanou pod sebou, protože mají
       zevnitř width:100% a začal by řetěz přebíjení.

   ŠÍŘKY (320 px, k dispozici 304, buňky dělené podle obsahu):
     počet „3 369"           → na řazení zbývá 150 px
     nejdelší dnešní volba   116 px  ✓
     nejdelší z 8 dle zadání 137 px  ✓ (vejde se i po případném rozšíření řazení)
     počet „3 369 produktů"  → zbývá 82 px ✗ → proto se slovo pod 360 px skrývá

   ⚠️ PŘIPRAVENO NA STICKY (bod 6B): `.listing-toolbar` je JEDEN prvek s neprůhledným
   pozadím, takže přidat `position:sticky; top:<výška hlavičky>; z-index:10500` bude
   stačit. Ověřeno, že to projde: žádný předek nemá `overflow` ani `transform`
   (tichý zabiják sticky) a volné pásmo z-indexů je 10000–10999 (#header má 11000,
   modály 11500). NEDÁVAT `overflow` na žádného předka tohoto prvku.
   Otevřené: hlavička se má při scrollu sbalovat, takže offset se musí před nasazením
   sticky ověřit REÁLNÝM scrollováním (window.scrollTo to nespustí — měřeno 167 px).
   ========================================================================== */

/* Na desktopu musí být obal pro layout NEVIDITELNÝ. `display: contents` ho vyjme
   z rozvržení úplně, takže se desktop nemůže pohnout ani o pixel. Prostý blok by
   teoreticky mohl změnit kolaps okrajů. */
.listing-toolbar {
    display: contents;
}

@media (max-width: 767px) {
    .listing-toolbar {
        display: flex;
        align-items: stretch;
        margin: 8px 0;
        border: 1px solid #e3e3e3;
        border-radius: 7px;
        /* neprůhledné pozadí — nutné, protože prvek je sticky a jinak by pod ním
           prosvítal projíždějící obsah */
        background: #fff;

        /* PŘIPNUTÍ PŘI SCROLLU (bod 6B ze zadání: „toolbar se připne, musí být
           nízký, lehký, nepřekrývat obsah").

           top = výška SBALENÉ hlavičky. `#header` je sám position:sticky top:0,
           takže se toolbar naskládá pod něj. Změřeno reálným scrollováním
           (window.scrollTo to nespustí) na bibik i goldex — shodně:
             nahoře 167 px · po sbalení 99 px · při scrollu zpět nahoru zůstane 99
           Hlavička se sbaluje od scrollY ≈ 80 px, zatímco toolbar se přilepí
           nejdřív kolem 330 px, takže se rozbalená hlavička a připnutý toolbar
           nikdy nepotkají.

           Tenant s jinou hlavičkou přepíše `--listing-sticky-top` ve svém
           custom-stylesheet.css — netřeba sahat sem.

           z-index: volné pásmo je 10000–10999. Nad obsahem (9999), pod hlavičkou
           (11000) a pod modály filtru i košíku (11500), aby toolbar nikdy
           nepřekryl otevřený dialog.

           ⚠️ Sticky tiše zabije `overflow` na KTERÉMKOLI předkovi. Ověřeno, že
           celý řetěz až po <html> má `overflow: visible` a žádný `transform` —
           při zásahu do obalů kolem výpisu to platí znovu ověřit. */
        position: sticky;
        top: var(--listing-sticky-top, 99px);
        z-index: 10500;
    }

    /* Obsah lišty je v šablonách za `{if $isMobile}`, což se rozhoduje SERVEROVĚ
       podle User-Agenta — kdežto pravidla výše se řídí ŠÍŘKOU OKNA. Ty dvě věci
       se rozejdou u desktopového prohlížeče v úzkém okně, na části tabletů a
       v in-app prohlížečích s nerozpoznaným UA: uvnitř zůstane desktopový
       `<ul class="detail-box-links">` (renderovaný za `{if !$isMobile}`), stane
       se z něj flex prvek a vznikne 237px orámovaný PŘIPNUTÝ blok trvale pod
       hlavičkou (změřeno Phase 7B revizí na devel, okno 390 px).

       `body.mobile` nastavuje server podle téhož rozpoznání jako `$isMobile`,
       takže tahle podmínka drží CSS a obsah v jednom příběhu. */
    body:not(.mobile) .listing-toolbar {
        display: contents;
        position: static;
    }

    /* Filtr a počet se smrsknou na obsah, řazení dostane zbytek. Stejné třetiny
       nefungují: „Filtrovat" potřebuje 56 px a bralo by 100, takže na dlouhý název
       řazení by nezbylo (změřeno — ořezávalo se na 320 px). */
    .listing-toolbar > #button-count {
        flex: 0 0 auto;
        width: auto;
        margin: 0;
    }
    .listing-toolbar > #select-sorter-out {
        flex: 1 1 auto;
        min-width: 0;
        width: auto;
        margin: 0;
        border: 0;
        border-left: 1px solid #e3e3e3;
        border-right: 1px solid #e3e3e3;
        border-radius: 0;
    }
    .listing-toolbar > [id^="snippet--paginationTop"] {
        flex: 0 0 auto;
        margin: 0;
    }

    /* Jednotlivé prvky měly každý vlastní rámeček — teď je jeden na obalu. */
    .listing-toolbar .modal-button-filtr {
        border: 0;
        border-radius: 0;
        background: transparent;
        margin: 0;
        /* 8 px vodorovně, ne víc: na 320px displeji chybělo řazení přesně 2 px
           na nejdelší volbu („Od nejlevnějšího", 116 px). Buňka filtru je
           nejužitečnější místo, kde je vzít — „Filtrovat" je krátké slovo. */
        padding: 11px 8px;
        font-size: 1.3rem;
        /* Legacy CSS dědí `line-height: 36px`, což samo o sobě dělalo z buňky 58 px
           (36 + 22 odsazení). Bez tohohle řádku je celý toolbar 65 px místo 42. */
        line-height: 1.25;
        white-space: nowrap;
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .listing-toolbar .modal-button-filtr::after {
        content: none;
    }
    /* Zapnutý filtr musí být vidět — jinak zákazník nepozná, že je výpis omezený.
       Barva webu, ne šedá: je to stav, ne dekorace. */
    .listing-toolbar .modal-button-filtr.has-filters {
        color: var(--primary-color, #00c4ed);
        font-weight: 700;
    }
    .listing-toolbar .modal-button-filtr.has-filters .fas {
        color: var(--primary-color, #00c4ed);
    }

    /* Stav po klepnutí. Deklaruje se tu VÝPLŇ I BARVA TEXTU SPOLEČNĚ, jedním
       pravidlem — schválně, ať stav nezávisí na tom, co který klient ve svém
       tématu má.

       Tady se to třikrát pokazilo právě proto, že jsem spoléhal na cizí kus
       kaskády:
         1. `core/css/stylesheet.css:4858` dá `background: primary` + `color:#fff`.
            Se `has-filters` (text taktéž primary) vznikla barva na barvě.
         2. Přebil jsem POUZE pozadí na šedé — jenže `color:#fff` zůstal, takže
            bílá na šedé. Horší než původní stav.
         3. Opřel jsem se o to, že výplň dodá téma klienta. Jenže
            `clients/kamnax/group/src/css/tenant-shared.css` tohle pravidlo
            NEMÁ (ověřeno: beneo 1, goldex 1, iceny 1, kamnax 0) → průhledné
            pozadí + bílý text na bílé liště = neviditelné.

       Na mobilu to NENÍ okrajový stav: iOS drží :hover i po klepnutí, dokud
       uživatel neklepne jinam. Reálná cesta je ta hlavní — Filtry → vybrat →
       Zobrazit → a zůstat u nečitelného tlačítka.

       Specificita (0,0,3,0) resp. (0,0,4,0) přebíjí core i téma (0,0,2,0)
       nezávisle na pořadí načtení. */
    .listing-toolbar .modal-button-filtr:hover,
    .listing-toolbar .modal-button-filtr:focus {
        background: var(--primary-color, #00c4ed);
        color: #fff;
    }
    .listing-toolbar .modal-button-filtr:hover .fas,
    .listing-toolbar .modal-button-filtr:focus .fas,
    .listing-toolbar .modal-button-filtr.has-filters:hover,
    .listing-toolbar .modal-button-filtr.has-filters:hover .fas {
        color: #fff;
    }
    .listing-toolbar .modal-button-filtr:hover .filter-count,
    .listing-toolbar .modal-button-filtr:focus .filter-count {
        background: #fff;
        color: var(--primary-color, #00c4ed);
    }

    /* Odznak je ZÁMĚRNĚ mimo `.listing-toolbar` scope: `{control filter:button}`
       vykresluje DEVĚT výpisů, ale lištu má jen SEDM (chybí Manufacture = výpisy
       značek, na bibiku jich je ~300, a Category/virtual). Kdyby styl visel na
       liště, odznak by se tam vykreslil bez pozadí i zaoblení — zákazník by
       místo odznaku viděl holé „Filtry 1“. Nalezeno Phase 7B revizí. */
    .modal-button-filtr .filter-count {
        display: inline-block;
        min-width: 16px;
        padding: 0 4px;
        border-radius: 8px;
        background: var(--primary-color, #00c4ed);
        color: #fff;
        font-size: 1.1rem;
        font-weight: 700;
        line-height: 16px;
        text-align: center;
    }

    /* Ze štítku zůstane JEN IKONA, text „Řazení:" se skryje. Důvod je měřený:
       slovo „Řadit:" stojí 31 px a na 320px displeji se s ním celý toolbar nevejde,
       zatímco ikona udělá totéž za 14 px. Bez ní by „Nejprodávanější" stálo v řádku
       samo a nevypadalo jako řazení — na to upozornil owner.
       `font-size: 0` na obalu zhasne textový uzel, ikona si velikost vrátí. */
    .listing-toolbar #select-sorter-out > div {
        display: block;
        position: absolute;
        left: 7px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 0;
        line-height: 0;
        z-index: 1;
        pointer-events: none;   /* ať jde skrz na <select> */
    }
    .listing-toolbar #select-sorter-out > div .fas {
        font-size: 1.3rem;
        line-height: 1;
        padding: 0;
        /* Stejná barva jako text, NE šedá — je to ovládací prvek. Šedá se čte
           jako „neaktivní" (upozornil owner 2026-08-05). Šedý zůstává jen počet
           výsledků, což je doplňková informace, ne ovladač. */
        color: #1a1a1a;
    }
    .listing-toolbar #select-sorter {
        width: 100%;
        border: 0;
        background: transparent;
        /* Vpravo je REZERVA POD ŠIPKU rozbalovátka (`#select-sorter-out::after`,
           absolutně pozicovaná). S 22 px šipka překrývala konec názvu — „Nejprodáváne›".
           Test na přetečení to NEODHALIL, protože pseudo-prvek mimo tok nezvětší
           scrollWidth; našlo se to až na screenshotu.

           Buňka musí pojmout NEJDELŠÍ volbu, ne výchozí: „Od nejlevnějšího" = 116 px
           (výchozí „Nejprodávanější" má 114). Změřeno ve skutečném písmu selectu. */
        padding: 11px 18px 11px 24px;   /* vlevo místo pro ikonu řazení */
        font-size: 1.3rem;
        line-height: 1.25;   /* legacy 36px — viz poznámka u .modal-button-filtr */
        text-align: center;
        text-align-last: center;
    }
    .listing-toolbar #select-sorter-out::after {
        right: 5px;
        font-size: 1.1rem;
    }

    /* Počet: bez velkých okrajů, na jeden řádek. */
    .listing-toolbar #productsListingTop {
        margin: 0;
        padding: 11px 10px;
        /* menší a šedý záměrně — vzniká pořadí důležitosti: akce (Filtry) >
           stav (řazení) > doplňková informace (počet). Dřív měly všechny tři
           buňky stejnou váhu a řádek byl plochý. */
        font-size: 1.2rem;
        color: #666;
        line-height: 1.25;
        white-space: nowrap;
        text-align: center;
    }
    .listing-toolbar #productsListingTop strong {
        color: #1a1a1a;
    }
    /* Číslo počtu si nese `margin-bottom: 15px` (responsive ř. 1921) a pevnou
       `height/line-height: 26px` (stylesheet ř. 4403). Dohromady 26 + 15 + 22 = 63 px,
       což byla NEJVYŠŠÍ buňka a ostatní se na ni roztahovaly (toolbar 65 místo 42).

       ⚠️ Selektor MUSÍ obsahovat #id. Verze `.listing-toolbar .navSplitPagesResult`
       (0,0,2,0) prohrála s `#productsListingTopNumber` (0,1,0,0) — jedno #id přebije
       libovolný počet tříd (.claude/rules/css-architecture.md). */
    .listing-toolbar #productsListingTopNumber,
    .listing-toolbar .navSplitPagesResult {
        float: none;
        height: auto;
        margin: 0;
        line-height: 1.25;
    }
    /* Prázdný clearBoth mezi modálem a řazením je v toku a stal by se z něj
       nulově široká buňka. */
    .listing-toolbar > .clearBoth {
        display: none;
    }
    .listing-toolbar #productsListingTop .clearBoth {
        display: none;
    }
    /* Horní stránkování je na mobilu skryté už dnes; v toolbaru by navíc
       zakládalo prázdnou buňku. */
    .listing-toolbar .navSplitPagesLinks {
        display: none;
    }
}

/* Slovo „výsledků" se nevejde jen na NEJUŽŠÍ displeje. Změřeno (13px písmo,
   nejdelší volba řazení „Od nejlevnějšího" 107 px):
     320 px → k dispozici 304, potřeba 325 → slovo se skryje, zůstane číslo
     360 px a výš → vejde se celé „3 369 výsledků"
   Ustupuje slovo, ne název řazení: aktivní řazení nese informaci, kterou zákazník
   jinde nezjistí. Znění „výsledků" je podle FABINI, vzorového webu ze zadání
   (rozhodnutí ownera 2026-08-05). */
@media (max-width: 359px) {
    .listing-toolbar #productsListingTop .toolbar-count-word {
        display: none;
    }
}