/* ============================================================
   JONAP.CZ — MERGED CSS
   Pořadí zdrojů:
     1) webupravypx.css  — základ šablony
     2) UX2.css          — alternativní produkty (On Running styl),
                           mobilní menu (accordion), podkategorie (scroll)
     3) SMupravy.css     — video v detailu produktu
   ============================================================ */


/* ============================================================
   1. FONTY & GLOBÁLNÍ
   ============================================================ */

body, div, p, li, label, input, a, #carousel .extended-banner-title, #footer .custom-footer > div h4, .quantity .increase::before, .quantity .decrease::before, .box-categories > h4, #filters h4, .product-appendix, .advanced-order .h2, .p-price .price-final {font-family: 'Figtree', sans-serif !important;}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .navigation-in > ul > li > a, .extended-banner-title, .fav-cat li > div a, .menu-helper > span, .p .name, .prices, .prices > div, .vote-initials, .vote-name, .news-item .text .title, .social-login-buttons-divider, .subcategories li a .text, .price-standard, .price-final, .price-additional, #productsAlternative::before, .benefitBanner__title, #variants::before, .variant-name, #ratingTab::before, .rate-wrapper .rate-average, .vote-form > form::before, #productDiscussion::before, .cart-table .main-link, .free-gift::before, .free-gift-name, .cart-table tr.related td::before, .cart-related-name, .price-primary, .payment-info b, .payment-shipping-price, .cart-item.cart-item-gift > div > strong, .id--15 .cart-table .p-name, .id--15 .cart-table .p-price, #search-group-categories .search-results-group-list ul li a, .empty-content-404::before, .obj-detail .p-name a, .klient-centrum.obj-detail .content td:last-child, .step-title, .empty-cart-boxes ul li a, .dklab_instagram_widget_heading > .text, .plugin-fixed-header__name, .fvDoplnek .fvDoplnek-produkt .fvDoplnek-text .price, .fvDoplnek-text .name, .hodnoceni-hp .autor {font-family: "roc-grotesk", sans-serif !important;}

body {line-height: 1.6;color: #192826;}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{font-weight: 600;}
h1, .h1 {font-size: 50px;}


/* ============================================================
   2. NAVIGACE (desktop)
   ============================================================ */

@media screen and (min-width: 1200px){
.navigation-in > ul {width:800px;margin: 0;-webkit-justify-content: center !important;justify-content: center !important;left: 50%;position: absolute;-webkit-transform: translateX(-50%);transform: translateX(-50%);padding-left: 20px;}
.navigation-in{width: 100% !important;}
#navigation:not(.ready) {opacity: 1;}
.navigation-in > ul > li > a{font-size: 20px;color: #000;padding: 33px 32px;}
.navigation-in > ul > li:nth-child(2){margin-right: 70px;}
.navigation-in > ul > li:nth-child(3){margin-left: 60px;}
.submenu-arrow{display: none !important;}
#header .site-name a img {max-height: 40px;}
.menu-helper{visibility: hidden !important;}
.navigation-in ul li.splitted {visibility: visible;display: block !important;}
.header-top{padding: 0;}
}

@media screen and (min-width: 992px){
    #header .site-name {position: absolute;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);}
}

@media screen and (min-width: 992px) and (max-width: 1199px){
    #header .site-name {margin-left: 0;padding: 0;}
}

body:not(.type-index) #header {border-bottom: 1px solid #E5E5E5 !important;}


/* ============================================================
   3. BANNERS ROW & CAROUSEL
   ============================================================ */

@media screen and (min-width: 768px){
.banners-row .col-sm-8{width: 62%;}
.banners-row .col-sm-4{display: block !important; width: 38%;padding-left: 32px;}
.homepage-box.before-carousel{padding: 20px 20px 0 20px;}
.top-banner + .top-banner{margin-top: 40px;}
.carousel-tabs{width: 100%;}
}

@media screen and (max-width: 991px){
.banners-row .col-sm-8 {width: 100%;}
.banners-row .col-sm-4 {display: flex !important;width: auto;padding: 20px 0 0 0;flex-wrap: wrap;margin: 0 -10px;}
.top-banner{width: 50%; padding: 0 10px; margin: 0 !important;}
}

@media screen and (max-width: 767px){
.top-banner {width: 100%;padding: 0 10px;margin: 10px 0 0 0 !important;}
}

.carousel-inner .item a{padding: 40px 32px; background-color: #557757; border-radius: 10px;display: block;}
.carousel-inner .item img{border-radius: 12px;}
.carousel .extended-banner-texts{display: block;position: relative;}
.extended-banner-text{font-size: 26px; color: #fff;position: relative;display: block;top: auto;}
.extended-banner-title, .carousel .extended-banner-text strong{position: relative; font-size: 42px;display: block;line-height: 1.1;font-family: "roc-grotesk", sans-serif !important;font-weight: 600;margin-bottom: 8px;}
.carousel-tabs, #carousel::after {display: none !important;}
.carousel .extended-banner-text strong{color: #A2CFA6;}
.carousel .extended-banner-text{margin-top: 40px;}
.extended-banner-link {line-height: 70px;background-color: #fff;font-size: 20px;height: auto;padding: 0 46px;border-radius: 4px;font-weight: 600;border: 1px solid #fff;}
.extended-banner-link:hover{color: #fff !important; background-color: var(--color-secondary); border-color: var(--color-secondary);}
.carousel .extended-banner-link {margin-top: 0; -webkit-transform: translateY(-50%);transform: translateY(-50%);}
.top-banner a{display: flex; flex-wrap: wrap; padding: 32px; border-radius: 10px; background-color: #333737;}
.top-banner + .top-banner a{background-color: #EEC55B;}
.top-banner img{padding-left: 0;border-radius: 12px;max-height: 294px;width: auto;margin-left: auto;}

@media screen and (min-width: 1200px) and (max-width: 1439px){
    .top-banner img {max-height: 236px;}
}

.top-banner .extended-banner-texts{width: 50%; padding-right: 12px;}

@media screen and (min-width: 768px){
.banners-row .col-sm-4 .banner-wrapper:not(.top-banner){display: none;}
}

.top-banner .extended-banner-title{color: #949C9C;}
.top-banner + .top-banner .extended-banner-title{color: #DE7D04;}
.top-banner .extended-banner-text{color: #fff;}
.top-banner .extended-banner-link{left: 24px;right: auto;bottom: 24px;top: auto;color: #192826;}
.carousel .extended-banner-link{color: #638163;}
.top-banner + .top-banner .extended-banner-link{color: #DE7D04;}

@media screen and (min-width: 768px){
    .homepage-box.before-carousel > div > .container{width: 742px;}
}
@media screen and (min-width: 992px){
    .homepage-box.before-carousel > div > .container{width: 979px;}
}
@media screen and (min-width: 1200px){
    .homepage-box.before-carousel > div > .container{width: 1178px;}
}
@media screen and (min-width: 1440px){
    .homepage-box.before-carousel > div > .container{width: 1418px;}
}


/* ============================================================
   4. BENEFIT BANNER
   ============================================================ */

.benefitBanner__title {font-size: 20px;}
.benefitBanner__item {margin-top: 36px;}
.type-index .benefitBanner {margin-top: 0;}
.next-to-carousel-banners{margin: 60px 0 0 0;}


/* ============================================================
   5. NEXT TO CAROUSEL BANNERS
   ============================================================ */

.next-to-carousel-banners .banner-wrapper{padding: 0 16px 0 0;}
.next-to-carousel-banners .col2 .banner-wrapper{padding-right: 0; padding-left: 16px;}
.next-to-carousel-banners .banner-wrapper > a{display: block; background-color: #333737; padding: 32px;border-radius: 10px;position: relative;}
.next-to-carousel-banners .banner-wrapper > a::after{content: ""; background: url('/user/documents/upload/Images/banner-center-after.png') 50% 50% no-repeat; background-size: cover; width: 240px; height: 240px; position: absolute; right: 0; top: 0;}
.next-to-carousel-banners .extended-banner-texts {display: block;margin-top: 32px;}
.next-to-carousel-banners .extended-banner-title{color: #fff; margin-bottom: 0;line-height: 71px;}
.next-to-carousel-banners .extended-banner-link{bottom: 32px;top: auto;right: 32px;}


/* ============================================================
   6. PRODUKTY — BLOKY & SLIDER
   ============================================================ */

h4.homepage-group-title, .h4.homepage-group-title {margin-top: 80px;font-size: 40px;margin-bottom: 24px;font-weight: 600;}
.products-block.products .product {padding: 10px;box-shadow: none !important;}
.products-block .p {background-color: #F5F5F5;padding: 20px;border-radius: 10px;}
.products-block .p img{mix-blend-mode: darken;}
.products-block.products .p .name {height: 48px;font-size: 20px;margin-bottom: 4px;line-height: 24px;text-align: left;font-weight: 600;}
.products-block .p-bottom .prices {text-align: left;-webkit-justify-content: left;-ms-justify-content: left;-o-justify-content: left;justify-content: left;margin-top: 6px;}
.product .availability {font-size: 16px;margin-top: 0;font-weight: 600;text-align: left;}
.skladem::before {display: none;}
.products-block.products .p .price strong, .products-block.products .p .price span {font-size: 18px;font-weight: 500;font-family: 'Figtree', sans-serif !important;}
.slick-prev, .slick-next {width: 50px !important;height: 50px !important;margin-top: 0;background-color: #192826;border-radius: 50%;}
.slick-prev:hover, .slick-next:hover{background-color: #666;}
.slick-prev {left: -13px !important;}
.slick-next {right: -13px !important;}
.slick-prev::before, .slick-next::before{content: url('/user/documents/upload/Images/sipka-slider.svg') !important;line-height: 1px;height: 50px;-webkit-transform: scale(1.5);transform: scale(1.5);width: 50px !important;}
.slick-prev::before{-webkit-transform: scale(1.7)rotate(180deg);transform: scale(1.7)rotate(180deg);}
.slick-dots li button {background-color: #192826 !important;}
.slick-arrow.slick-disabled{display: none !important;}


/* ============================================================
   7. BANNERS CONTENT (střední banner)
   ============================================================ */

.banners-content .banner-wrapper > a{background-color: #638163; padding: 40px; display: flex;flex-wrap: wrap; border-radius: 10px;position: relative;align-items: center;}
.banners-content .banner-wrapper img{order: 2; width: 50%; padding-left: 30px;}
.banners-content .extended-banner-texts{width: 50%; padding-right: 30px;}
.banners-content .extended-banner-title{color: #A2CFA6;margin-bottom: 16px;}
.banners-content .extended-banner-text{max-width: 480px;}
.banners-content .extended-banner-link{position: relative;left: auto;right: auto;top: auto;bottom: auto;display: inline-block;margin-top: 40px;}
.banners-content .banner-wrapper > a::after{content: "";background: url('/user/documents/upload/Images/main-banner-after.png') 50% 50% no-repeat;background-size: auto;background-size: contain;width: 600px;height: 205px;position: absolute;left: 20%;bottom: 0;}
.banners-content .banner-wrapper > a::before{content: "";background: url('/user/documents/upload/Images/main-banner-before.png') 50% 50% no-repeat;background-size: auto;background-size: contain;width: 240px;height: 240px;position: absolute;right: 0;top: 0;}
.homepage-box.middle-banners-wrapper {margin-top: 80px;}


/* ============================================================
   8. CLANKY HP (blog sekce)
   ============================================================ */

.clanky-hp{background-color: #FCFCF0; padding: 80px 0 40px 0; margin-top: 80px;}
.clanky-hp h2{text-align: center; margin: 0 0 32px 0;}
.news-item {margin-bottom: 40px;padding: 0 24px;}
.news-item .text {position: relative !important;width: 100% !important;background: none !important;padding: 0;margin-top: 32px;bottom: auto;right: auto;}
.news-item .text .title {font-size: 20px;color: #192826 !important;font-weight: 600;}
.news-item time{display: none;}
.news-item .text .description {display: block;order: 3;margin-top: 16px;color: #525243;}
.btn.cist-vice{border-color: rgba(25, 40, 38, 0.2);border-radius: 4px;margin-top: 23px;text-transform: none;font-size: 16px;}
.btn.cist-vice:hover{border-color: var(--color-secondary);background-color: var(--color-secondary); color: #fff;}
/* Pozn.: .subcategories li a::after odstraněno — nahrazeno v UX2 (display:none) */
.btn.cist-vice::after {content: url('/user/documents/upload/Images/sipka-cerna-prava.svg');display: inline-block;-webkit-transform: scale(1.4);transform: scale(1.4);vertical-align: middle;line-height: 1;margin-left: 8px;}
.btn.cist-vice:hover::after{-webkit-filter: brightness(0) invert(1);filter: brightness(0) invert(1);}
.news-wrapper {margin-left: -24px;margin-right: -24px;}


/* ============================================================
   9. WELCOME SLIDER
   ============================================================ */

.homepage-box.welcome-wrapper {margin-top: 64px;}
.welcome h1 {text-align: center;max-width: 700px;margin: 0 auto 80px auto;}
.slider-item{padding: 0; display: flex !important; flex-wrap: wrap;align-items: center;}
.slider-item .text{width: 50%; padding-right: 40px;}
.slider-item .image{width: 50%; padding-left: 40px;}
.p-detail-inner h1 {font-weight: 600;}
.welcome h3{font-size: 32px;margin: 0 0 24px 0;}
.welcome p{font-size: 20px;color: #192826;max-width: 550px;}
.welcome .slick-dots {position: absolute !important;left: 72px;width: auto !important;bottom: 80px !important;}
.welcome .slick-dots li{width: auto !important;}
.welcome .slick-dots li button{font-family: "roc-grotesk", sans-serif !important;font-size: 32px;color: #192826;background: none !important;padding: 0 14px !important;width: auto !important;font-weight: 500;}
.welcome .slick-prev, .welcome .slick-next {bottom: 57px;top: auto;-webkit-transform: none;transform: none;}
.welcome .slick-prev {left: 0 !important;}
.welcome .slick-next {right: auto !important;left: 252px !important;}
.welcome .slick-track {padding: 0;}


/* ============================================================
   10. FOOTER & INSTAGRAM & ODBER
   ============================================================ */

#footer .custom-footer__instagram{display: none;}
.odber{border-top: 0;}
.custom-footer__instagram{padding-top: 80px;background-color: #fff;}
.instagram-widget {max-width: none;margin: 0;}
.instagram-widget > a{width: 20% !important;}
@media screen and (min-width: 768px){
.instagram-widget > a:nth-child(n+6){display: none !important;}
}
.instagram-follow-btn{display: none;}
.custom-footer__instagram h4{text-align: center;margin: 0;padding: 20px 10px;background-color: #FCFCF0;font-size: 32px;}
.odber {background-color: #192826;padding-top: 80px; padding-bottom: 80px;}
.odber h4 {color: #fff;font-size: 30px;}
.odber .subscribe-form.compact-form .form-control {font-size: 16px;padding-left: 16px;border-radius: 6px;background-color: #FCFCF0;border: 0;}
.subscribe-form::before {display: none;}
.subscribe-form.compact-form .btn {right: 4px;top: 4px;height: 48px;width: 140px;border-radius: 4px;font-size: 18px;text-transform: none;}
input::placeholder{color: #939388;}
.odber .form-group label.whole-width, .odber .form-group label.whole-width a {color: #fff;}
.custom-footer{position: relative;}
.logo-footer{position: absolute;top: 50px;right: 0;}
.logo-footer img{height: 80px;}


/* ============================================================
   11. BREADCRUMBS & HEADER (mimo homepage)
   ============================================================ */

.breadcrumbs-wrapper{visibility: hidden;}
.container.breadcrumbs-wrapper {margin-bottom: 12px;}


/* ============================================================
   12. KATEGORIE — HEADER, FILTRY, INLINE PRODUKTY
   ============================================================ */

.category-perex {color: #192826;font-size: 20px;}
.category-title{margin-bottom: 12px !important;}
.products-inline.products-top .product {padding: 10px;}
.products-inline.products-top{margin-left: -10px; margin-right: -10px;width: calc(100% + 20px);}
.products-inline.products-top .product .p {padding: 20px;background-color: #F5F5F5;border-radius: 10px;}
.products-inline.products-top .product .p img{mix-blend-mode: darken;}
.products-inline.products-top .product .p::before{display: none;}
.products-inline.products-top > div .p .p-in .p-bottom > div{display: block;}
.products-inline > div .p .p-in .p-in-in .name{font-size: 18px;line-height: 22px;height: 44px;display: block;overflow: hidden;margin-bottom: 2px;font-weight: 600;color: #192826;}
.products-inline.products-top > div .p .p-in .p-bottom .prices{margin-top: 0;}
.products-inline .price-final{font-family: 'Figtree', sans-serif !important;}
.products-inline .price-final strong{font-weight: 500;}
.products-inline > div .p .p-in .p-bottom > div .prices .price-standard-wrapper{display: none !important;}
.products-inline.products-top > div .p .p-in .p-bottom .availability {font-size: 14px;line-height: 20px;}
.products-inline.products-top .slick-prev, .products-inline.products-top .slick-next {top: auto !important;width: 50px !important;height: 50px !important;margin-top: 0;bottom: 56px;}
.products-inline.products-top .slick-prev::before, .products-inline.products-top .slick-next::before {line-height: 34px !important;width: 50px !important;}
.products-inline.products-top .slick-next{right: -16px !important;}
.products-inline.products-top .slick-prev{left: -13px !important;}
.category-header > div{display: none;}
.category-header {padding-top: 0;border-top: 0;margin-bottom: 10px;}
body:not(.type-index):not(.type-product) .products-block {margin-left: -10px;margin-right: -10px;}
.category-header form fieldset label {color: #979797;border-bottom: 0;padding: 0;font-family: "roc-grotesk", sans-serif !important;font-weight: 500;}
.category-header input[type="radio"]:checked + label {color: #000;font-weight: 500;text-decoration: underline;}
.products-inline.products-top.slick-dotted.slick-slider {margin-bottom: 50px !important;}
.products-inline.products-top .slick-dots {bottom: 12px !important;}
.flag {border-radius: 3px;font-family: "roc-grotesk", sans-serif !important;font-weight: 600;padding: 0 12px;text-transform: uppercase;line-height: 24px;}
.flag.flag-new{background-color: #192826;}
.type-category .pagination-wrapper .pagination{display: none;}
.pagination-wrapper.pagi-yes {margin-top: 30px;}
.pagination-loader {margin-bottom: 0;}
.btn, a.btn{text-transform: none; font-size: 18px;border-radius: 4px;}
.btn.load-products {height: 56px;line-height: 54px;font-size: 18px;padding: 0 40px;border-radius: 4px;}
#filters h4 {font-size: 24px;font-family: "roc-grotesk", sans-serif !important;font-weight: 500;color: #192826;}
.filter-section {border-bottom-color: #DBDBDB;}
@media screen and (min-width: 1200px){
    .multiple-columns-body .content {flex: 1 1 calc(100% - 340px);width: calc(100% - 340px);}
    .sidebar {flex: 1 1 340px;width: 340px;padding-right: 60px;}
}
#filters h4::after {content: "+";font-size: 28px;right: 5px;margin-top: -20px;color: #979797;font-weight: 600;}
#filters .otevreny h4::after {content: "_";margin-top: 2px;right: 7px;}


/* ============================================================
   13. PRODUKT DETAIL
   ============================================================ */

/* Přesunuto z adminu — flagy se zobrazují ve info sekci, ne nad fotkou */
.p-info-wrapper .flags.flags-default,
.p-info-wrapper .flags.flags-inline {
  position: static !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 0 0 12px 0 !important;
  margin: 0 !important;
  left: auto !important;
  top: auto !important;
  z-index: auto !important;
  width: 100% !important;
}
.p-info-wrapper .flags .flag {
  display: inline-block !important;
  position: static !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  font-family: "roc-grotesk", sans-serif !important;
  line-height: 28px !important;
  height: 28px !important;
  padding: 0 12px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
.p-info-wrapper .flags::before,
.p-info-wrapper .flags::after {
  display: none !important;
}
.p-info-wrapper .availability-value > span {font-weight: 600;font-size: 20px;}
.p-info-wrapper .availability-value{margin-bottom:16px;}
.p-detail-inner-header h1 {margin-bottom: 10px;line-height: 1.1 !important;}
.p-info-wrapper > .p-short-description {font-size: 16px;color: #192826;margin-bottom: 32px;}
.product-image{display: flex; flex-wrap: wrap;margin-left: -10px; margin-right: -10px;}
.product-image .p-main-image{width: calc(50% - 20px); margin: 0 10px 20px 10px;}
.p-main-image{display: block;border-radius: 10px;background-color: #F5F5F5;}
.p-main-image img{mix-blend-mode: darken;border-radius: 10px;}
@media screen and (min-width: 1200px){
    .one-column-body .p-image-wrapper {width: 60%;}
    .one-column-body .p-info-wrapper {width: 40%;}
}
.buy-box .p-final-price-wrapper{width: calc(100% - 360px);}
.p-info-wrapper .price-final {line-height: 1;color: #192826;}
.p-info-wrapper .price-standard{width: auto;order: 2;color: #979797;font-weight: 500;font-family: "roc-grotesk", sans-serif !important;font-style: normal;font-size: 18px;margin-left: 12px;}
.p-info-wrapper .detail-parameters th, #productsAlternative::before {margin-bottom: 16px;font-size: 16px;text-transform: uppercase;font-weight: 600;font-family: "roc-grotesk", sans-serif !important;}
.variant-list .hidden-split-parameter{display: flex;flex-wrap: wrap;margin: 0 -4px;}
.p-info-wrapper .advanced-parameter.obrazek {width: calc(16.6666% - 8px);height: 46px;margin: 0 4px 8px 4px;}
.p-info-wrapper .advanced-parameter.obrazek .advanced-parameter-inner{width: 100%; height: 100%;border-color: #DBDBDB;border-radius: 5px;}
.p-info-wrapper .advanced-parameter.obrazek .advanced-parameter-inner:hover, .p-info-wrapper .advanced-parameter.obrazek .advanced-parameter-inner.yes-before {border-color: #192826;}
.p-info-wrapper .advanced-parameter.obrazek .advanced-parameter-inner.yes-before {background-color: #F5F5F5;}
.p-info-wrapper .advanced-parameter-inner.yes-before::before{border-radius: 4px 0;font-size: 6px;}
.buy-box > .top {margin-bottom: 0;}
.buy-box .bottom {background-color: transparent;padding: 0;}
.p-detail .add-to-cart .quantity {width: 140px;margin-right: 10px;padding: 0 46px;border-color: #DBDBDB;border-radius: 4px;}
.p-detail .quantity input {width: 48px;font-size: 24px;color: #292929;}
.p-detail .add-to-cart .quantity .increase, .p-detail .add-to-cart .quantity .decrease {width: 46px;}
.p-info-wrapper .btn.add-to-cart-button.btn-lg{width: calc(100% - 150px);}
.buy-box .add-to-cart {width: 360px;}
.btn.btn-cart, a.btn.btn-cart, .btn.add-to-cart-button, a.btn.add-to-cart-button {text-transform: none;}
.delivery-in-detail {margin-top: 28px;margin-bottom: 0;}
.shipping-options {font-size: 16px;color: #192826;}
.shipping-options::before {display: none;}
.social-buttons-wrapper{display: none;}
.p-info-wrapper .advanced-parameter-inner img {height: 24px;mix-blend-mode: darken;width: auto;}
.p-detail .quantity .increase::before, .p-detail .quantity .decrease::before {font-size: 28px;}


/* ============================================================
   14. ALTERNATIVNÍ PRODUKTY — základ (nevisuální pravidla)
   Vizuální styl (On Running, 7 bot) je definován v sekci UX2.
   ============================================================ */

#productsAlternative .flags,
#productsAlternative .flags.flags-default,
#productsAlternative .flags.flags-extra,
#productsAlternative .p-in,
#productsAlternative .flags-inline {
  display: none !important;
}
#productsAlternative .image{margin-bottom: 0;}
#productsAlternative .products-block{justify-content: left;}
/* Obsah nadpisu — styling přebírá UX2 */
#productsAlternative::before {content: "Barva";text-align: left;}
.doplnky #productsAlternative::before {content: "Podobné produkty";}
.podobne-link{display: none !important;}


/* ============================================================
   15. TABS & POPIS PRODUKTU
   ============================================================ */

.one-column-body .shp-tabs-wrapper > .row > div:not(.shp-tabs-row)::before {display: none;}
.shp-tabs-wrapper > .row > div:not(.shp-tabs-row) {background-color: transparent;}
.shp-tabs-row {display: none;}
#tab-content{padding-top: 0;padding-bottom: 0;}
.basic-description > h3:first-child{display: none !important;}
.basic-description h2, .basic-description h3{margin: 60px 0 24px 0 !important;}
.basic-description > h3:first-child + h2{margin-top: 0 !important;}
.basic-description h2, .basic-description h3, .basic-description h2 span, .basic-description h3 span{font-weight: 600 !important;}
.basic-description ul{display: flex; flex-wrap: wrap; list-style: none; margin: 0 0 -20px 0; padding: 0;}
.basic-description ul + p{margin-top: 32px;}
.basic-description ul li{width: 50%; margin-bottom: 20px;padding: 0 24px 0 28px; background: url('/user/documents/upload/Images/li.svg') 0 4px no-repeat;}
.basic-description li, article li, .news-item-detail li, .basic-description p, article p, .news-item-detail p{color: #192826;}
#productDiscussion{display: none !important;}
@media screen and (min-width: 1200px){
    .extended-description {width: 40%;padding-left: 48px;}
    .basic-description{width: 60%;padding-right: 20px;}
}
.shp-tabs-wrapper {max-width: none;margin-bottom: 0;}
.extended-description h3 {margin-bottom: 24px;}
.extended-description .detail-parameters th, .extended-description .detail-parameters td {padding: 0 0 16px 0;color: #192826;font-weight: 400 !important;}
.extended-description .detail-parameters th{color: #979797;}
.produkt-clanky {margin-top: 32px;}
.produkt-clanky .news-item {display: flex;flex-wrap: wrap;width: 100%;margin-bottom: 24px;}
.produkt-clanky .news-item .image{width: 120px;}
.produkt-clanky .news-item .text{width: calc(100% - 120px) !important; padding-left: 24px;flex: none;margin: 0;}
.produkt-clanky .news-item .text .description {margin-top: 6px;font-size: 14px;}
.produkt-clanky .btn.cist-vice {height: auto;line-height: 1;border: 0;padding: 0;margin: 14px 0 0 144px;text-align: left;min-width: auto;font-size: 14px;font-weight: 600;letter-spacing: 0;background: none !important;color: #000 !important;}
.produkt-clanky .btn.cist-vice:hover{text-decoration: underline;}
.produkt-clanky .btn.cist-vice::after{-webkit-transform: none;transform: none;margin-left: 5px;}
.produkt-clanky .btn.cist-vice:hover::after{-webkit-filter: none;filter: none;}
#productsRelated:empty{display: none !important;}
.produkt-pribeh .homepage-box.welcome-wrapper {margin-top: 0;}
.product .price-standard{width: auto;}


/* ============================================================
   16. VARIANT LIST & POPUP TABULKA
   ============================================================ */

.variant-list{position: relative;}
#myBtnTabulka_velikosti{margin: 0;position: absolute;top: 0;right: 0;padding: 0;box-shadow: none !important;width: auto;color: #192826;text-decoration: underline;line-height: 1;background: none !important;}
#myBtnTabulka_velikosti:hover{text-decoration: none;}
#myBtnTabulka_velikosti::before{display: none !important;}
.link-icon.watchdog span{display: block;}
.link-icon.watchdog {display: inline-block;font-weight: 400;font-size: 16px;color: #192826;}
.popup-overlay{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.7; z-index: 10000;}
.popup-window{display: none; position: fixed; left: 50%; top: 50%; width: 800px; padding: 40px; max-height: calc(100vh - 20px); z-index: 10001;-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%);overflow: auto; scrollbar-width: thin;background-color: #fff;border-radius: 4px;}
.popup-window h3{margin: 0 0 32px;}
.popup-open .popup-overlay, .popup-open .popup-window{display: block;}
.tabulka-link{line-height: 1;font-weight: 400;color: #000;text-transform: none;}
.tabulka-link:hover{text-decoration: none;}
.popup-window table{border: 0;width: 100%;}
.popup-window td{border: 0;padding: 10px 16px;}
.popup-window tr{background-color: #f6f6f6;}
.popup-window tr:nth-child(2n){background-color: #fff;}
.popup-window tr:first-child td{font-weight: 600;}
.popup-window .close{position: absolute; right: 0; top: 0; width: 40px; height: 40px;color: #666;cursor: pointer;text-align: center;line-height: 40px;}
.popup-window .close:hover{color: #000;}
.popup-window .close::before{content: '\e950'; font-family: ikony;}


/* ============================================================
   17. RADCE (velikostní průvodce)
   ============================================================ */

.radce > div{display: none;}
.radce {border: 1px solid #DBDBDB; border-radius: 6px;margin-bottom: 32px;}
.radce:hover, .radce.otevreno{border-color: #192826;}
.radce > h4{padding: 16px 48px 16px 20px; font-size: 16px; line-height: 20px; text-transform: uppercase; font-weight: 500;position: relative;margin: 0;cursor: pointer;}
.radce > h4::before{content: url('/user/documents/upload/Images/metr.svg'); display: inline-block; vertical-align: middle; line-height: 1; margin-right:20px;height: 20px;position: relative;top: -1px;opacity: 0.5;}
.radce > h4::after{content: url('/user/documents/upload/Images/sipka-cerna-dolu.svg'); position: absolute; right: 20px;opacity: 0.5;}
.radce > h4:hover::before, .radce.otevreno > h4::before, .radce > h4:hover::after, .radce.otevreno > h4::after{opacity: 1;}
.radce.otevreno > h4::after{-webkit-transform: rotate(180deg);transform: rotate(180deg);margin-top: -6px;}
.radce-inner{padding: 0 20px 16px;}
.radce-inner .top{display: flex; flex-wrap: wrap;justify-content: space-between;line-height: 22px;align-items: center;}
.radce-inner .top span{max-width: 260px;}
.radce-inner a:not(:hover){text-decoration: underline;}
.radce-inner .bottom a + a::before{content: ""; width: 4px; height: 4px; background-color: #ACACAC; border-radius: 50%; display: inline-block;margin:0 8px;position: relative;top: -2px;}


/* ============================================================
   18. IFRAME
   ============================================================ */

#iframe-wrapper {width: auto;height: auto;}
#iframe-wrapper iframe {width: 100%;border: 0;}


/* ============================================================
   19. RESPONZIVNÍ ÚPRAVY (webupravypx základ)
   ============================================================ */

@media screen and (max-width: 1439px){
    .extended-banner-title, .carousel .extended-banner-text strong {font-size: 32px;}
    .extended-banner-link {line-height: 50px;padding: 0 24px;}
    .next-to-carousel-banners .extended-banner-title {line-height: 51px;}
    .welcome .slick-prev, .welcome .slick-next {bottom: 20px;}
    .welcome .slick-dots {bottom: 40px !important;}
    /* .subcategories li {width: 50%} odstraněno — nahrazeno UX2 */
}

@media screen and (min-width: 1200px) and (max-width: 1439px){
    .banners-row .col-sm-8 {width: 61.3%;}
    .banners-row .col-sm-4 {width: 38.7%;}
}

@media screen and (min-width: 992px) and (max-width: 1439px){
    .buy-box .p-final-price-wrapper {margin-bottom: 24px;width: 100%;}
}

@media screen and (max-width: 1199px){
    .banners-row .col-sm-8 {width: 100%;}
    .banners-row .col-sm-4 {display: flex !important;width: 100%;padding-left: 0;margin-top: 20px;flex-wrap: wrap;}
    .banners-row .col-sm-4 .top-banner{width: 50%; margin-top: 0 !important;padding-right: 10px;}
    .banners-row .col-sm-4 .top-banner + .top-banner{padding-right: 0; padding-left: 10px;}
    .next-to-carousel-banners .banner-wrapper > a::after {width: 160px; height: 160px;}
    .banners-content .banner-wrapper > a::before {width: 160px;height: 160px;}
    .banners-content .banner-wrapper > a::after{width: 400px;height: 130px;}
    .clanky-hp .news-item:nth-child(3){display: none !important;}
    .welcome .slick-dots li {width: auto !important;height: auto !important;}
    .welcome .slick-dots li button{line-height: 1;height: auto !important;}
    .welcome .slick-dots {bottom: auto !important;position: relative !important;margin-top: 60px;left: auto;height: auto;padding-bottom: 28px;}
    .welcome .slick-prev, .welcome .slick-next {bottom: 20px;}
    .welcome .slick-next {right: auto !important;left: calc(50% + 100px) !important;}
    .welcome .slick-prev {left: auto !important;right: calc(50% + 100px);}
    .custom-footer__section1{display: none !important;}
    .products-inline.products-top > div .p .p-in {width: calc(100% - 48px);}
    .products-inline.products-top > div .p .image {width: 48px;}
    .products-inline > div .p .p-in .p-in-in .name {font-size: 16px;line-height: 20px;height: 40px;}
    .type-product #tab-content > div:not(.otevreno) > :not(.shp-tab), .type-product #tab-content > ul:not(.otevreno) > :not(.shp-tab) {display: block !important;}
    .type-product .shp-tab{display: none;}
    .extended-description{margin-top: 50px;}
    body.type-product #tab-content > div.extended-description:not(.otevreno) table{display: table !important;}
    .produkt-clanky {margin-top: 40px;}
    .type-product #tab-content {border-bottom: 0;margin-bottom: 48px;}
    .top-banner img {max-height: 200px;}
}

@media screen and (min-width: 768px) and (max-width: 1199px){
    .custom-footer > div {width: 33.3333% !important;}
}

@media screen and (max-width: 991px){
    .banners-row .col-sm-4 {margin-top: 0;}
    .extended-banner-title, .carousel .extended-banner-text strong {font-size: 28px;}
    .extended-banner-text {font-size: 22px;}
    .extended-banner-link {font-size: 16px;}
    .next-to-carousel-banners.cols-2 > div {width: 100%;}
    .next-to-carousel-banners .banner-wrapper {padding: 0;}
    .next-to-carousel-banners .col2 .banner-wrapper {padding-left: 0;margin-top: 20px;}
    .btn.cist-vice {margin-left: auto;margin-right: auto;display: block;width: 160px;}
    .category-header form fieldset label {margin: 0 12px;}
    .type-product #tab-content {padding-left: 0;padding-right: 0;}
    .produkt-clanky .news-item .text{text-align: left;}
    .produkt-clanky .news-item .text .title{height: auto;}
    .popup-window {width: calc(100% - 20px);}
}

@media screen and (max-width: 767px){
    .carousel-inner .item a {padding: 24px;border-radius: 0;}
    .carousel .extended-banner-link, .next-to-carousel-banners .extended-banner-link {position: relative;-webkit-transform: none;transform: none;display: block;width: 160px;margin: 16px auto 0 auto;text-align: center;}
    .extended-banner-text strong {font-size: 26px;}
    .extended-banner-text {font-size: 18px;}
    .carousel .extended-banner-text{text-align: center;margin-top: 24px;}
    .top-banner a {padding: 20px 16px;}
    .benefitBanner {display: flex;flex-wrap: wrap;}
    .benefitBanner__item {text-align: center;width: 50%;margin-bottom: 0;}
    .benefitBanner__title {font-size: 18px;}
    .benefitBanner__content{padding: 0;}
    .next-to-carousel-banners {margin-top: 32px;}
    .banners-row .col-sm-4{padding: 0 10px !important; margin: 0 !important;}
    .next-to-carousel-banners .col2 .banner-wrapper{margin-top: 10px;}
    .next-to-carousel-banners .extended-banner-link {bottom: auto;right: auto;}
    .next-to-carousel-banners .banner-wrapper > a {padding: 24px;}
    .next-to-carousel-banners .extended-banner-title {line-height: 40px;text-align: center;}
    .next-to-carousel-banners .extended-banner-texts {margin-top: 20px;}
    .next-to-carousel-banners .banner-wrapper > a::after {width: 120px;height: 120px;}
    h4.homepage-group-title, .h4.homepage-group-title {margin-top: 48px;font-size: 30px;}
    .products-block.products .p .name {height: 44px;font-size: 18px;line-height: 22px;}
    .product .availability {display: block;width: 100%;}
    .products-block.products .p .price {text-align: left !important;}
    .widget-parameter-wrapper.justified {-webkit-justify-content: left;-ms-justify-content: left;-o-justify-content: left;justify-content: left;}
    .homepage-box.middle-banners-wrapper {margin-top: 0;margin-bottom: 30px;}
    .varianty-link::after {display: none;}
    .products-block.products .product {padding: 5px;border: 0 !important;}
    .products-block {margin-left: -5px;margin-right: -5px;}
    body:not(.type-index):not(.type-product) .products-block {margin-left: -5px;margin-right: -5px;}
    .slick-prev, .slick-next, .products-inline.products-top .slick-prev, .products-inline.products-top .slick-next {width: 30px !important;height: 30px !important;z-index: 1 !important;}
    .slick-prev::before, .slick-next::before, .products-inline.products-top .slick-prev::before, .products-inline.products-top .slick-next::before {content: url('/user/documents/upload/Images/sipka-slider.svg') !important;height: 30px;-webkit-transform: none;transform: none;width: 30px !important;line-height: 12px !important;}
    .slick-prev::before, .products-inline.products-top .slick-prev::before {-webkit-transform: rotate(180deg);transform: rotate(180deg);}
    .slick-prev {left: -4px !important;}
    .slick-next {right: -4px !important;}
    .products-inline.products-top .slick-next{right: 2px !important;}
    .products-inline.products-top .slick-prev{left: 2px !important;}
    .banners-content .extended-banner-texts {width: 100%;padding-right: 0;text-align: center;margin-bottom: 32px;}
    .banners-content .banner-wrapper img {width: 100%;padding-left: 0;}
    .banners-content .extended-banner-link{margin-top: 20px;}
    .banners-content .banner-wrapper > a::before {width: 80px;height: 80px;}
    .clanky-hp {padding: 40px 10px 0 10px;margin-top: 48px;}
    .slider-item .text {width: 100%;padding-right: 0;text-align: center;}
    .welcome h3 {font-size: 24px;}
    .slider-item .image {width: 100%;padding-left: 0;margin-top: 10px;}
    .welcome .slick-dots {margin-top: 32px;}
    .welcome .slick-prev, .welcome .slick-next {bottom: 32px;}
    .custom-footer__instagram {padding-top: 40px;}
    .custom-footer__instagram h4, .odber h4{font-size: 22px;}
    .instagram-widget > a {width: 33.333333% !important;}
    .odber {padding-top: 48px;padding-bottom: 48px;}
    .banners-content .banner-wrapper > a::after {width: 100%;height: 80px;left: 0;}
    .news-wrapper {margin-left: 0;margin-right: 0;}
    .news-item {padding: 0;}
    .logo-footer {top: 24px;right: auto;left: calc(50% - 40px);}
    .custom-footer {padding-top: 126px;}
    .category-perex {font-size: 16px;}
    .container.breadcrumbs-wrapper {display: none;}
    body:not(.type-index) h1{margin-top: 32px;}
    h1, .h1 {font-size: 40px;}
    .category-perex {margin-top: 0;}
    /* .subcategories li — odstraněno, nahrazeno UX2 */
    .category-top > h4{margin-top: 32px;}
    .products-inline.products-top .product {border: 0;padding: 0 10px;}
    .category-header form fieldset label {color: #222;margin: 0;font-size: 14px !important;}
    .category-header form {border: 1px solid #dbdbdb;}
    #filters h4 {font-size: 16px;}
    #filters h4::after {right: 16px;}
    #filters .otevreny h4::after {right: 18px;}
    .p-detail .add-to-cart .quantity {position: relative;bottom: auto;}
    .p-info-wrapper .btn.add-to-cart-button.btn-lg{margin-top: 0;}
    .type-product #tab-content {padding-left: 10px;padding-right: 10px;}
    .p-image-wrapper {margin-bottom: 10px;}
    /* #productsAlternative border — odstraněno, nahrazeno UX2 (border: 0) */
    #productsAlternative .p-switchable .related-sm-screen-hide {display: block;}
    .p-main-image {width: calc(50% - 10px);margin: 0 5px 10px 5px;}
    .product-image {margin-left: -5px;margin-right: -5px;}
    .basic-description ul li {width: 100%;padding-right: 0;}
    .basic-description h2, .basic-description h3 {margin: 48px 0 24px 0 !important;}
    .odber h4 {max-width: 270px;margin-left: auto;margin-right: auto;}
    .buy-box .p-final-price-wrapper {width: 100%;margin-bottom: 24px;}
    .popup-window{padding: 20px;}
    .popup-window h3{margin-bottom: 16px;}
}

@media screen and (max-width: 479px){
    .popup-window > div{overflow-x: auto;}
    .popup-window table{width: 100%;}
    .radce-inner .top span {max-width: none;margin-bottom: 10px;}
}


/* ============================================================
   UX2 — ALTERNATIVNÍ PRODUKTY (On Running styl, 7 bot)
   ============================================================ */

/* Reset původních stylů */
#productsAlternative .product {
  border: 0 !important;
  border-radius: 0 !important;
  height: auto !important;
  margin: 0 !important;
}

#productsAlternative .products-block.products .product {
  padding: 0 !important;
  height: auto !important;
  border: 0 !important;
  box-sizing: border-box !important;
}

#productsAlternative .products-block.products .product:hover {
  border: 0 !important;
  box-shadow: none !important;
}

/* Aktivní produkt — bez rámečku */
#productsAlternative .product.aktivni-produkt {
  border: 0 !important;
  border-color: transparent !important;
}

#productsAlternative .product.aktivni-produkt::before {
  display: none !important;
}

/* Underline pod aktivním produktem */
#productsAlternative .product {
  position: relative;
}

#productsAlternative .product.aktivni-produkt::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: #192826;
  position: absolute;
  bottom: -6px;
  left: 0;
}

/* Vnitřní padding a pozadí */
#productsAlternative .products-block .p {
  background-color: transparent !important;
  padding: 8px !important;
  border-radius: 0 !important;
}

#productsAlternative .products-block .aktivni-produkt .p {
  background-color: transparent !important;
}

/* Obrázky */
#productsAlternative .products-block .p img {
  height: 44px !important;
  width: auto !important;
  mix-blend-mode: darken;
}

/* Nadpis "Barva" — styling (content definován výše) */
#productsAlternative::before {
  font-size: 16px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  color: #192826 !important;
  margin-bottom: 16px !important;
  letter-spacing: 0 !important;
}

#productsAlternative {
  margin: 0 0 24px 0;
  padding-bottom: 8px;
}

/* Skrytí šipek a teček */
#productsAlternative .slick-arrow,
#productsAlternative .slick-dots {
  display: none !important;
}

/* DESKTOP — 7 bot na řádek */
@media screen and (min-width: 768px) {

  #productsAlternative .products-block {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 !important;
    justify-content: flex-start !important;
    margin: 0 !important;
  }

  #productsAlternative .products-block.products .product {
    width: calc(100% / 7) !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
  }

  #productsAlternative .slick-track {
    display: flex !important;
    width: auto !important;
    padding: 0 !important;
  }

  #productsAlternative .slick-list {
    margin: 0 !important;
  }
}

/* MOBIL — 6 viditelných + 7. čouhá */
@media screen and (max-width: 767px) {

  #productsAlternative .products-block {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    margin: 0 -10px 0 0 !important;
    padding-right: 10px !important;
  }

  #productsAlternative .products-block::-webkit-scrollbar {
    display: none;
  }

  #productsAlternative .products-block {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  #productsAlternative .products-block.products .product {
    flex: 0 0 calc(100% / 6.5) !important;
    width: calc(100% / 6.5) !important;
    margin: 0 !important;
    scroll-snap-align: start;
    border: 0 !important;
  }

  #productsAlternative .products-block.products .product.aktivni-produkt {
    border: 0 !important;
    border-color: transparent !important;
  }

  #productsAlternative .products-block .p img {
    height: 38px !important;
  }

  #productsAlternative .products-block .p {
    padding: 6px 4px !important;
  }
}


/* ============================================================
   UX2 — MOBILNÍ MENU (accordion, On Running styl)
   ============================================================ */

@media screen and (max-width: 991px) {

  /* RESET SHOPTET SLIDE PANELŮ */
  .navigation-in,
  .navigation-in .menu,
  .navigation-in ul,
  .navigation-in ul li,
  .navigation-in ul ul {
    transform: none !important;
    transition: none !important;
    -webkit-transform: none !important;
    -webkit-transition: none !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
  }

  .navigation-in.menu {
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  /* Level 1 — vždy viditelný */
  .navigation-in > ul.menu-level-1 {
    display: block !important;
    width: 100% !important;
    position: static !important;
    transform: none !important;
  }

  /* Level 2 — skrytý, accordion */
  .navigation-in ul.menu-level-2 {
    display: none !important;
    position: static !important;
    transform: none !important;
    width: 100% !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .navigation-in ul li.menu-accordion-open > ul.menu-level-2 {
    display: block !important;
  }

  /* Level 3 — skrytý */
  .menu-level-3 {
    display: none !important;
    position: static !important;
    transform: none !important;
    width: 100% !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }

  .menu-level-2 > li.menu-accordion-open .menu-level-3 {
    display: block !important;
  }

  /* Skrytí back tlačítek a headerů */
  .navigation-in ul::before,
  .navigation-in ul ul::before,
  .menu-level-2::before,
  .menu-level-3::before {
    display: none !important;
  }

  .navigation-in .menu-level-2 > .menu-back,
  .navigation-in .menu-level-3 > .menu-back {
    display: none !important;
  }

  /* LEVEL 1 — hlavní kategorie */
  .navigation-in > ul > li {
    border-bottom: 1px solid #E5E5E5 !important;
    padding: 0 !important;
    margin: 0 !important;
    position: relative !important;
    display: block !important;
    width: 100% !important;
  }

  .navigation-in > ul > li > a {
    font-size: 26px !important;
    font-weight: 600 !important;
    color: #000 !important;
    padding: 22px 70px 22px 24px !important;
    display: block !important;
    line-height: 1.2 !important;
    font-family: "roc-grotesk", sans-serif !important;
    text-decoration: none !important;
    background: none !important;
    position: relative !important;
  }

  .navigation-in > ul > li > a b {
    font-weight: 600 !important;
  }

  .navigation-in > ul > li > a > .submenu-arrow {
    display: none !important;
  }

  /* Plus/minus toggle tlačítko */
  .menu-toggle-btn {
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    background: none !important;
    z-index: 5 !important;
    cursor: pointer !important;
    font-size: 28px !important;
    font-weight: 300 !important;
    color: #000 !important;
    font-family: "roc-grotesk", sans-serif !important;
    line-height: 1 !important;
    padding: 0 !important;
    -webkit-tap-highlight-color: transparent;
  }

  .navigation-in > ul > li:not(.ext) {
    border-bottom: 1px solid #E5E5E5 !important;
  }

  .navigation-in > ul > li.menu-accordion-open {
    background-color: #F5F5F5 !important;
  }

  .navigation-in > ul > li.menu-accordion-open > a {
    padding-bottom: 12px !important;
  }

  /* LEVEL 2 — podkategorie */
  .menu-level-2 > li > a.menu-image {
    display: none !important;
  }

  .menu-level-2 > li {
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    position: relative !important;
    display: block !important;
    width: 100% !important;
  }

  .menu-level-2 > li > div {
    position: relative !important;
    display: block !important;
  }

  .menu-level-2 > li > div > a {
    font-size: 18px !important;
    font-weight: 400 !important;
    color: #000 !important;
    padding: 14px 70px 14px 40px !important;
    display: block !important;
    line-height: 1.3 !important;
    font-family: "roc-grotesk", sans-serif !important;
    text-decoration: none !important;
    background: none !important;
  }

  .menu-level-2 > li > div > a span {
    font-size: 18px !important;
    font-weight: 400 !important;
    font-family: "roc-grotesk", sans-serif !important;
  }

  .menu-level-2 > li > div > .submenu-arrow {
    display: none !important;
  }

  .menu-level-2 .menu-toggle-btn {
    font-size: 22px !important;
    color: #999 !important;
    right: 8px !important;
    width: 44px !important;
    height: 44px !important;
  }

  .menu-level-2 > li.menu-accordion-open {
    background-color: #ECECEC !important;
    border-radius: 0 !important;
  }

  /* LEVEL 3 — třetí úroveň */
  .menu-level-2 > li.menu-accordion-open > div > ul.menu-level-3 {
    display: block !important;
  }

  .menu-level-3 {
    list-style: none !important;
    padding: 0 0 8px 0 !important;
    margin: 0 !important;
  }

  .menu-level-3 > li {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }

  .menu-level-3 > li > a {
    font-size: 15px !important;
    color: #666 !important;
    padding: 8px 0 8px 56px !important;
    display: block !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    font-family: "roc-grotesk", sans-serif !important;
    line-height: 1.4 !important;
    border-top: 1px solid #E9E9E9 !important;
  }

  .menu-level-3 > li:first-child > a {
    border-top: 0 !important;
  }

  .menu-level-3 > li > a:hover,
  .menu-level-3 > li > a:active {
    color: #000 !important;
  }

  /* Toggle level 1 — fixní pozice */
  .navigation-in > ul > li > .menu-toggle-btn {
    position: absolute !important;
    right: 16px !important;
    top: 22px !important;
    transform: none !important;
    z-index: 10 !important;
    width: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  .navigation-in > ul > li {
    overflow: visible !important;
  }

  .navigation-in > ul > li.menu-accordion-open > .menu-toggle-btn {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    right: 16px !important;
    top: 22px !important;
  }

  /* Toggle level 2 */
  .menu-level-2 > li > div {
    position: relative !important;
  }

  .menu-level-2 > li > div > .menu-toggle-btn {
    position: absolute !important;
    right: 8px !important;
    top: 14px !important;
    transform: none !important;
  }

  /* Level 3 — maximální specificita fontu */
  .navigation-in .has-third-level div > ul.menu-level-3 > li > a,
  .navigation-in .menu-level-2 .has-third-level div ul.menu-level-3 li a,
  .navigation-in ul ul ul.menu-level-3 li a,
  #navigation .menu-level-3 > li > a {
    font-family: "roc-grotesk", sans-serif !important;
    font-size: 15px !important;
    color: #666 !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
    padding: 8px 0 8px 56px !important;
    display: block !important;
  }

  #navigation .menu-level-3 > li > a:hover,
  .navigation-in .has-third-level div > ul.menu-level-3 > li > a:hover {
    color: #000 !important;
  }

  /* BANNER v menu */
  .mega-menu-custom-banner.mobile-mega-menu-inserted {
    padding: 20px 24px 8px 24px !important;
    display: block !important;
  }

  .mobile-menu-banner {
    display: block !important;
  }

  .mobile-menu-banner a {
    display: block !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    position: relative !important;
  }

  .mobile-menu-banner img {
    width: 100% !important;
    border-radius: 10px !important;
    display: block !important;
  }

  .mobile-menu-banner .menu-banner-text {
    position: absolute !important;
    bottom: 12px !important;
    right: 12px !important;
    background-color: #fff !important;
    padding: 6px 14px !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-family: "roc-grotesk", sans-serif !important;
    color: #000 !important;
  }

  .ohne-style-menu-banners.desktop-only {
    display: none !important;
  }

  .mobile-menu-banner.mobile-only {
    display: block !important;
  }

  /* SPODNÍ ČÁST MENU */
  .menu-spodek {
    margin-top: 32px !important;
    padding: 20px 24px !important;
    border-top: 1px solid #E5E5E5 !important;
  }

  .menu-spodek .leva ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .menu-spodek .leva ul li a {
    font-size: 14px !important;
    color: #666 !important;
    font-family: "roc-grotesk", sans-serif !important;
  }

  .navigationActions {
    padding: 12px 24px !important;
    border-top: 1px solid #E5E5E5 !important;
    margin-top: 16px !important;
  }

  .navigationActions > li > a {
    font-size: 16px !important;
    font-family: "roc-grotesk", sans-serif !important;
    color: #000 !important;
  }
}


/* ============================================================
   UX2 — PODKATEGORIE (horizontální scroll, pill styl)
   ============================================================ */

.subcategories.with-image,
.subcategories {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  gap: 10px !important;
  margin: 0 0 40px 0 !important;
  padding: 0 !important;
  list-style: none !important;
  align-items: stretch !important;
}

/* Skrytí scrollbaru */
.subcategories.with-image::-webkit-scrollbar,
.subcategories::-webkit-scrollbar {
  display: none;
}
.subcategories.with-image,
.subcategories {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Reset grid tříd */
.subcategories.with-image > li,
.subcategories > li,
.subcategories.with-image > li.col-xs-6,
.subcategories.with-image > li.col-sm-6,
.subcategories.with-image > li.col-lg-3,
.subcategories.with-image > li.col-xl-3 {
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
  scroll-snap-align: start;
}

/* Obdélníková karta */
.subcategories.with-image li a,
.subcategories li a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  height: 56px !important;
  padding: 0 20px 0 10px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #F5F5F5 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  font-family: "roc-grotesk", sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #192826 !important;
  transition: background-color 0.2s ease !important;
}

.subcategories.with-image li a:hover,
.subcategories li a:hover {
  background-color: #EBEBEB !important;
}

/* Šipka — skrytá */
.subcategories.with-image li a::after,
.subcategories li a::after {
  display: none !important;
}

/* Fotka v kartě */
.subcategories.with-image li a .image {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background-color: #F5F5F5 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}

.subcategories.with-image li a .image img {
  width: 40px !important;
  height: 40px !important;
  object-fit: contain !important;
  border-radius: 8px !important;
  mix-blend-mode: darken !important;
  margin: 0 !important;
  max-height: none !important;
}

/* Text */
.subcategories.with-image li a .text,
.subcategories li a .text {
  width: auto !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  font-family: "roc-grotesk", sans-serif !important;
  text-align: left !important;
  padding: 0 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  display: inline !important;
  line-height: 1 !important;
}

/* Skrytí breadcrumb chipu */
.subcategory-breadcrumb-li {
  display: none !important;
}

/* MOBIL */
@media screen and (max-width: 767px) {
  .subcategories.with-image,
  .subcategories {
    margin: 0 -10px 32px 0 !important;
    padding-right: 10px !important;
    gap: 8px !important;
  }

  .subcategories.with-image li a,
  .subcategories li a {
    font-size: 15px !important;
    height: 50px !important;
    padding: 0 16px 0 8px !important;
    gap: 10px !important;
  }

  .subcategories.with-image li a .image {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
  }

  .subcategories.with-image li a .image img {
    width: 36px !important;
    height: 36px !important;
  }

  .subcategories.with-image li a .text,
  .subcategories li a .text {
    font-size: 15px !important;
  }
}

/* TABLET & DESKTOP — wrap místo scroll */
@media screen and (min-width: 768px) {
  .subcategories.with-image,
  .subcategories {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
  }
}

@media screen and (min-width: 992px) {
  .subcategories.with-image,
  .subcategories {
    margin-bottom: 48px !important;
    gap: 12px !important;
  }
}


/* ============================================================
   SMupravy — VIDEO V DETAILU PRODUKTU
   ============================================================ */

@media only screen and (max-width: 768px){
  .type-detail .p-image-wrapper video {
    width: calc(50% - 20px);
    height: auto;
    object-fit: cover;
    aspect-ratio: 4/1;
    margin: 0 10px 20px 10px;
    border-radius: 5px;
  }
}

@media only screen and (min-width: 768px){
  .type-detail .p-image-wrapper video {
    width: calc(50% - 20px);
    height: auto;
    object-fit: cover;
    aspect-ratio: 4/1;
    margin: 0 10px 20px 10px;
    border-radius: 5px;
  }
}


/* ============================================================
   ADMIN — PAXIO OPRAVY (homepage header & navigace)
   ============================================================ */

@media screen and (min-width: 1200px) {
  .type-index #header,
  .type-index .top-navigation-bar {
    position: relative !important;
    top: 0 !important;
  }
  .type-index .top-navigation-bar {
    background-color: #F5F5F5 !important;
  }
  .type-index .navigation-in > ul > li > a,
  .type-index .lupa,
  .type-index .top-nav-button::before,
  .type-index .menu-helper:not(:hover),
  .type-index .menu-helper:not(:hover) > span,
  .type-index .btn.cart-count::before,
  .type-index a.btn.cart-count::before,
  .type-index .btn.cart-count .cart-price,
  .type-index .top-navigation-bar a,
  .type-index .dropdown button {
    color: #000;
  }
  .type-index .navigation-buttons > a[data-target="cart"] i,
  .cart-count:not(.full)::after {
    background-color: #000;
    color: #fff;
  }
  .type-index .site-name img {
    -webkit-filter: none;
    filter: none;
  }
  .type-index .dropdown {
    border-color: #C4C4C4 !important;
  }
  .type-index .dropdown .caret::before {
    color: #000 !important;
  }
  .one-column-body .carousel-inner > .item.carousel-link a::before,
  .one-column-body .carousel-inner > .item:not(.carousel-link)::before {
    display: none;
  }
}

/* JS-driven viditelnost — zobrazí JavaScript po načtení obsahu */
.clanky-hp, .produkt-clanky {visibility: hidden;}

/* Zobrazení neaktivních variant v alternativních produktech */
#productsAlternative .p-switchable .inactive {display: block;}


/* ============================================================
   ADMIN — PRODUKTOVÉ BANNERY (custom-promo-inserted)
   ============================================================ */

.custom-promo-inserted,
.custom-promo-inserted-single {
  box-sizing: border-box;
  display: flex;
  border: none !important;
  padding: 10px;
}
.custom-promo-inserted {
  flex: 0 0 66.666% !important;
  width: 66.666% !important;
  max-width: 66.666% !important;
}
.custom-promo-inserted-single {
  flex: 0 0 33.333% !important;
  width: 33.333% !important;
  max-width: 33.333% !important;
}
.custom-promo-inserted img,
.custom-promo-inserted video,
.custom-promo-inserted iframe,
.custom-promo-inserted-single img,
.custom-promo-inserted-single video,
.custom-promo-inserted-single iframe {
  width: 100% !important;
  height: 100% !important;
  max-height: 480px;
  object-fit: cover;
  border-radius: 12px;
}
.custom-promo-inserted video::-webkit-media-controls,
.custom-promo-inserted video::-webkit-media-controls-start-playback-button,
.custom-promo-inserted-single video::-webkit-media-controls,
.custom-promo-inserted-single video::-webkit-media-controls-start-playback-button {
  display: none !important;
  -webkit-appearance: none !important;
}
.custom-promo-inserted video,
.custom-promo-inserted-single video {
  pointer-events: none;
}

@media (max-width: 992px) {
  .custom-promo-inserted {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 10px !important;
  }
  .custom-promo-inserted-single {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
    padding: 10px !important;
  }
  .custom-promo-inserted-single img,
  .custom-promo-inserted-single video {
    aspect-ratio: 3/4;
    max-height: none;
    height: auto;
  }
}


/* ============================================================
   ADMIN — OHNE MEGA MENU (desktop, min-1200px)
   ============================================================ */

@media screen and (min-width: 1200px) {
  .mobile-only,
  .mobile-menu-banner,
  div.custom-mega-menu-inserted .mobile-only,
  div.mega-menu-custom-banner .mobile-only {
    display: none !important;
  }
  .desktop-only,
  div.custom-mega-menu-inserted .desktop-only,
  div.mega-menu-custom-banner .desktop-only {
    display: flex !important;
  }
  ul.menu-level-2.has-custom-banner {
    padding-right: 48% !important;
    min-height: 400px;
  }
  ul.menu-level-2.has-custom-banner > li {
    width: 25% !important;
    flex-basis: 25% !important;
    margin-bottom: 30px;
    padding-right: 15px !important;
    box-sizing: border-box;
  }
  .custom-mega-menu-inserted {
    display: block !important;
    position: absolute;
    top: 0;
    right: 0;
    width: 48%;
    height: 100%;
    padding: 20px 30px 20px 0 !important;
    box-sizing: border-box;
    max-height: 420px !important;
    overflow: hidden !important;
  }
  .ohne-style-menu-banners {
    display: flex;
    gap: 20px;
    height: 100%;
    max-height: 380px !important;
  }
  .menu-banner-item {
    flex: 1;
    position: relative;
    display: block;
    height: 100%;
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none !important;
  }
  .menu-banner-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
  }
  .menu-banner-item:hover img {
    transform: scale(1.05);
  }
  .menu-banner-text {
    position: absolute;
    bottom: 15px;
    right: 15px;
    color: #000;
    background: #fff;
    padding: 6px 14px;
    font-family: "roc-grotesk", sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    border-radius: 4px;
    z-index: 999;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  }
}


/* ============================================================
   ADMIN — MOBILNÍ KARTA MEGA MENU (tablet + mobil, max-1199px)
   ============================================================ */

@media screen and (max-width: 1199px) {
  .desktop-only,
  .ohne-style-menu-banners,
  div.mega-menu-custom-banner .desktop-only {
    display: none !important;
  }
  .mobile-only,
  .mobile-menu-banner,
  div.mega-menu-custom-banner .mobile-only {
    display: block !important;
  }
  ul.menu-level-2.has-custom-banner {
    padding-right: 0 !important;
    min-height: auto !important;
  }
  .custom-mega-menu-inserted,
  .mobile-mega-menu-inserted {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    padding: 15px 20px 30px 20px !important;
    border-top: 1px solid #eee;
    margin-top: 10px;
    display: block !important;
  }
  .mobile-menu-banner a {
    display: block;
    position: relative;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none !important;
  }
  .mobile-menu-banner img {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    object-fit: cover;
    display: block;
  }
  .mobile-menu-banner .menu-banner-text {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: #fff;
    color: #000;
    padding: 4px 10px;
    font-family: "roc-grotesk", sans-serif;
    font-size: 12px;
    font-weight: 700;
    border-radius: 4px;
    text-transform: uppercase;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  }
}


/* ============================================================
   ADMIN — PRODUCT FLAGS
   Skrytí flagů nad fotkou, zobrazení ve info sekci
   ============================================================ */

/* Flagy nad fotkou — skrýt */
.p-image-wrapper .flags.flags-default,
.p-image-wrapper .flags.flags-inline {
  display: none !important;
}

/* Flagy v info sekci (mobile) */
@media screen and (max-width: 767px) {
  .p-info-wrapper .flags .flag {
    font-size: 11px !important;
    line-height: 24px !important;
    height: 24px !important;
    padding: 0 10px !important;
  }
}