/* =====================================================
   SKIMAX – FILTRY+
   KOMPLETNÍ CSS
   Bez vlastního JS pro "Další / Méně"
   Původní logika Filtry+ zůstává zachovaná

   TMAVÁ MODRÁ:  #0F65E6
   SVĚTLÁ MODRÁ: #C9E9FF
   ČERNÁ:        #09171A
   BÍLÁ:         #F9FDFE
===================================================== */


/* =====================================================
   1) HLAVNÍ WRAPPER
===================================================== */

#dkLabTopFilters {
    width: 100%;
}


/* =====================================================
   2) ZÁKLADNÍ RESET
===================================================== */

#dkLabTopFilters #filters,
#dkLabTopFilters #filters .filter-sections,
#dkLabTopFilters #filters #category-filter-hover,
#dkLabTopFilters #filters .filter-section,
#dkLabTopFilters #filters .slider-wrapper,
#dkLabTopFilters #filters .slider-wrapper--bordered,
#dkLabTopFilters #filters fieldset,
#dkLabTopFilters #filters .param-filter-top {
    outline: 0 !important;
    box-shadow: none !important;
}


/* =====================================================
   3) POMOCNÝ FORMULÁŘ CENY
===================================================== */

#dkLabTopFilters #price-filter-form {
    display: none !important;
}


/* =====================================================
   4) LAYOUT FILTRŮ
===================================================== */

#dkLabTopFilters #filters {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;

    gap: 1rem !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;
}


/* pomocné obaly nerozbíjejí layout */

#dkLabTopFilters #filters > .filter-sections,
#dkLabTopFilters #filters .filter-sections > #category-filter-hover {
    display: contents !important;
}


/* =====================================================
   5) JEDNOTLIVÉ FILTRY
===================================================== */

#dkLabTopFilters #manufacturer-filter,
#dkLabTopFilters #category-filter-hover > .filter-section,
#dkLabTopFilters .filter-sections > .slider-wrapper,
#dkLabTopFilters .filter-sections > .filter-section-boolean {
    position: relative !important;

    float: none !important;

    width: auto !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    outline: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}


/* =====================================================
   6) CENA – ODSTRANĚNÍ HRANATÉHO WRAPPERU
===================================================== */

#dkLabTopFilters #filters .slider-wrapper,
#dkLabTopFilters #filters .slider-wrapper--bordered {
    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    outline: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}


#dkLabTopFilters #filters .slider-wrapper::before,
#dkLabTopFilters #filters .slider-wrapper::after,
#dkLabTopFilters #filters .slider-wrapper--bordered::before,
#dkLabTopFilters #filters .slider-wrapper--bordered::after {
    content: none !important;
    display: none !important;
}


/* =====================================================
   7) TLAČÍTKA FILTRŮ
===================================================== */

#dkLabTopFilters #filters .filter-section > h4,
#dkLabTopFilters #filters .slider-wrapper > h4 {
    position: relative !important;

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

    width: auto !important;
    min-width: 0 !important;
    min-height: 4.6rem !important;

    margin: 0 !important;
    padding: 1.15rem 3.4rem 1.15rem 1.7rem !important;

    box-sizing: border-box !important;

    background: #F9FDFE !important;

    border: 1px solid #0F65E6 !important;
    border-radius: 1.5rem !important;

    outline: 0 !important;
    box-shadow: none !important;

    color: #09171A !important;

    font-size: 1.4rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    text-transform: none !important;
    white-space: nowrap !important;

    cursor: pointer !important;

    transition:
        background-color .3s ease,
        border-color .3s ease,
        color .3s ease,
        transform .3s ease !important;
}


/* =====================================================
   8) TEXT V TLAČÍTKU
===================================================== */

#dkLabTopFilters #filters .filter-section > h4 > span,
#dkLabTopFilters #filters .slider-wrapper > h4 > span {
    display: inline-flex !important;
    align-items: center !important;

    gap: .9rem !important;

    margin: 0 !important;
    padding: 0 !important;

    color: inherit !important;

    font: inherit !important;
}


/* =====================================================
   9) PŮVODNÍ ŠIPKY FILTRŮ PRYČ
===================================================== */

#dkLabTopFilters #filters .filter-section > h4::before,
#dkLabTopFilters #filters .filter-section > h4::after,
#dkLabTopFilters #filters .slider-wrapper > h4::before,
#dkLabTopFilters #filters .slider-wrapper > h4::after,
#dkLabTopFilters #filters .filter-section > h4 > span::before,
#dkLabTopFilters #filters .slider-wrapper > h4 > span::before {
    content: none !important;
    display: none !important;
}


/* =====================================================
   10) JEDNA ČISTÁ ŠIPKA FILTRŮ
===================================================== */

#dkLabTopFilters #filters .filter-section > h4 > span::after,
#dkLabTopFilters #filters .slider-wrapper > h4 > span::after {
    content: "" !important;

    display: inline-block !important;

    width: .55rem !important;
    height: .55rem !important;

    flex: 0 0 .55rem !important;

    margin-top: -.3rem !important;

    border: 0 !important;
    border-right: 1.5px solid currentColor !important;
    border-bottom: 1.5px solid currentColor !important;

    background: transparent !important;

    box-shadow: none !important;

    transform: rotate(45deg) !important;
    transform-origin: center !important;
}


/* =====================================================
   11) HOVER
===================================================== */

#dkLabTopFilters #filters .filter-section > h4:hover,
#dkLabTopFilters #filters .slider-wrapper > h4:hover {
    background: #C9E9FF !important;

    border-color: #0F65E6 !important;

    color: #0F65E6 !important;

    transform: translateY(-1px);
}


/* =====================================================
   12) AKTIVNÍ FILTR
===================================================== */

#dkLabTopFilters #filters .filter-section:has(input:checked) > h4,
#dkLabTopFilters #filters .filter-section.checked > h4 {
    background: #0F65E6 !important;

    border-color: #0F65E6 !important;

    color: #F9FDFE !important;
}


#dkLabTopFilters #filters .filter-section:has(input:checked) > h4:hover,
#dkLabTopFilters #filters .filter-section.checked > h4:hover {
    background: #C9E9FF !important;

    color: #0F65E6 !important;
}


/* =====================================================
   13) OTEVŘENÁ NABÍDKA FILTRU
===================================================== */

#dkLabTopFilters #filters .filter-section > form {
    width: max-content !important;

    min-width: 24rem !important;
    max-width: 34rem !important;

    max-height: 38rem !important;

    box-sizing: border-box !important;

    margin-top: .75rem !important;
    padding: .4rem 0 !important;

    background: #F9FDFE !important;

    border: 1px solid #C9E9FF !important;
    border-radius: 1.5rem !important;

    outline: 0 !important;

    box-shadow:
        0 1rem 3rem rgba(9, 23, 26, .12) !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    z-index: 1000 !important;
}


/* =====================================================
   14) FIELDSET
===================================================== */

#dkLabTopFilters #filters fieldset {
    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    outline: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}


/* =====================================================
   15) ŘÁDKY V DROPDOWNU
===================================================== */

#dkLabTopFilters #filters .div--collapsable {
    position: relative !important;

    display: flex !important;
    align-items: center !important;

    width: 100% !important;

    margin: 0 !important;
    padding: .55rem 1.5rem !important;

    box-sizing: border-box !important;

    border: 0 !important;
    border-radius: 0 !important;

    outline: 0 !important;

    background: #F9FDFE !important;

    box-shadow: none !important;

    white-space: nowrap !important;

    transition:
        background-color .2s ease !important;
}


#dkLabTopFilters #filters .div--collapsable:hover {
    background: #C9E9FF !important;
}


/* =====================================================
   16) CHECKBOX
   Necháváme původní funkci Filtry+
===================================================== */

#dkLabTopFilters #filters .div--collapsable input[type="checkbox"] {
    accent-color: #0F65E6;
}


/* =====================================================
   17) LABEL
===================================================== */

#dkLabTopFilters #filters .filter-label {
    color: #09171A !important;
}


#dkLabTopFilters #filters input[type="checkbox"]:checked + .filter-label,
#dkLabTopFilters #filters .filter-label.active {
    color: #0F65E6 !important;

    font-weight: 700 !important;
}


/* =====================================================
   18) POČET PRODUKTŮ
===================================================== */

#dkLabTopFilters #filters .filter-count {
    color: #09171A !important;

    font-size: 1.15rem !important;
    font-weight: 400 !important;

    opacity: .45;
}


/* =====================================================
   19) DALŠÍ / MÉNĚ MOŽNOSTÍ
   Nezobrazujeme – všechny položky jsou v nabídce viditelné.
===================================================== */

#dkLabTopFilters #filters .filter-more {
    display: none !important;
}


/* =====================================================
   20) SCROLLBAR
===================================================== */

#dkLabTopFilters #filters .filter-section > form::-webkit-scrollbar {
    width: .6rem;
}


#dkLabTopFilters #filters .filter-section > form::-webkit-scrollbar-thumb {
    background: #C9E9FF;

    border-radius: 3rem;
}


/* =====================================================
   21) CENA – OTEVŘENÁ NABÍDKA
===================================================== */

#dkLabTopFilters #filters .dkLab-slider-wrapper {
    min-width: 32rem !important;

    box-sizing: border-box !important;

    margin-top: .75rem !important;
    padding: 1.8rem !important;

    background: #F9FDFE !important;

    border: 1px solid #C9E9FF !important;
    border-radius: 1.5rem !important;

    outline: 0 !important;

    box-shadow:
        0 1rem 3rem rgba(9, 23, 26, .12) !important;

    z-index: 1000 !important;
}


/* =====================================================
   22) CENA – HODNOTY
===================================================== */

#dkLabTopFilters #filters .slider-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 2rem !important;

    margin: 0 0 2rem !important;
    padding: 0 !important;

    color: #09171A !important;

    font-size: 1.4rem !important;
    font-weight: 700 !important;

    white-space: nowrap !important;
}

#dkLabTopFilters #filters .slider-header .from,
#dkLabTopFilters #filters .slider-header .to {
    white-space: nowrap !important;
}



/* =====================================================
   23) CENOVÝ SLIDER
===================================================== */

#dkLabTopFilters #filters .param-price-filter {
    height: .6rem !important;

    border: 0 !important;
    border-radius: 3rem !important;

    background: #C9E9FF !important;

    box-shadow: none !important;
}


#dkLabTopFilters #filters .ui-slider-range {
    border: 0 !important;
    border-radius: 3rem !important;

    background: #0F65E6 !important;

    box-shadow: none !important;
}






/* =====================================================
   CENA – BÍLÉ KOLEČKO UVNITŘ OVLADAČE
   Původní Filtry+ mají top: 3px; left: 3px;
   tím se bílé kolečko posouvá dolů a doprava.
===================================================== */

#dkLabTopFilters #filters .ui-slider-horizontal .ui-slider-handle::after {
    top: 0 !important;
    left: 0 !important;
}

#dkLabTopFilters #filters .ui-slider-handle {
    width: 1.8rem !important;
    height: 1.8rem !important;

    box-sizing: border-box !important;

    background: #F9FDFE !important;

    border: .3rem solid #0F65E6 !important;
    border-radius: 50% !important;

    outline: 0 !important;
    box-shadow: none !important;

    cursor: grab !important;
}


/* =====================================================
   24) PŘÍZNAKY
===================================================== */

#dkLabTopFilters #filters .filter-section-boolean .param-filter-top {
    min-width: 24rem !important;

    box-sizing: border-box !important;

    margin-top: .75rem !important;
    padding: .65rem 0 !important;

    background: #F9FDFE !important;

    border: 1px solid #C9E9FF !important;
    border-radius: 1.5rem !important;

    box-shadow:
        0 1rem 3rem rgba(9, 23, 26, .12) !important;

    overflow: hidden !important;

    z-index: 1000 !important;
}


#dkLabTopFilters #filters .filter-section-boolean .param-filter-top form {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;

    box-shadow: none !important;

    overflow: visible !important;
}


/* =====================================================
   25) POČET PRODUKTŮ
===================================================== */

#dkLabTopFilters #filters .filter-section-count {
    flex: 1 0 100% !important;

    width: 100% !important;

    margin: .5rem 0 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}


#dkLabTopFilters #filters .filter-total-count {
    margin: 0 !important;
    padding: 0 !important;

    color: #09171A !important;

    font-size: 1.25rem !important;
}


#dkLabTopFilters #filters .filter-total-count strong {
    color: #0F65E6 !important;
}


/* =====================================================
   26) ZRUŠIT FILTRY
===================================================== */

#dkLabTopFilters #clear-filters {
    margin: 1rem 0 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;
}


#dkLabTopFilters #clear-filters a,
#dkLabTopFilters #clear-filters button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 4.4rem !important;

    padding: 1rem 1.6rem !important;

    background: #C9E9FF !important;

    border: 1px solid #0F65E6 !important;
    border-radius: 1.5rem !important;

    color: #0F65E6 !important;

    font-weight: 700 !important;

    text-decoration: none !important;

    cursor: pointer !important;

    transition:
        background-color .3s ease,
        color .3s ease !important;
}


#dkLabTopFilters #clear-filters a:hover,
#dkLabTopFilters #clear-filters button:hover {
    background: #0F65E6 !important;

    color: #F9FDFE !important;
}


/* =====================================================
   27) SEŘADIT DLE
===================================================== */

#dkLabTopFilters #category-header .span--sort {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 4.6rem !important;

    margin: 0 !important;
    padding: 1.15rem 4.4rem 1.15rem 1.7rem !important;

    box-sizing: border-box !important;

    background: #F9FDFE !important;

    border: 1px solid #0F65E6 !important;
    border-radius: 1.5rem !important;

    outline: 0 !important;
    box-shadow: none !important;

    color: #09171A !important;

    font-size: 1.4rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    white-space: nowrap !important;

    cursor: pointer !important;

    transition:
        background-color .3s ease,
        border-color .3s ease,
        color .3s ease !important;
}


/* =====================================================
   PŮVODNÍ ŠIPKA ŘAZENÍ
   Necháváme ji kompletně Filtrům+.
   Nepřekreslujeme ::before ani ::after.
===================================================== */


/* =====================================================
   SEŘADIT DLE – POZICE PŮVODNÍ ŠIPKY FILTRY+
   Ikonu nepřekreslujeme, pouze ji držíme vpravo od textu.
===================================================== */

#dkLabTopFilters #category-header .span--sort::after {
    right: 1.7rem !important;
    left: auto !important;
}

#dkLabTopFilters #category-header .span--sort:hover {
    background: #C9E9FF !important;

    color: #0F65E6 !important;
}


/* =====================================================
   28) DROPDOWN ŘAZENÍ
===================================================== */

#dkLabTopFilters #category-header .listSorting {
    background: #F9FDFE !important;

    border: 1px solid #C9E9FF !important;
    border-radius: 1.5rem !important;

    outline: 0 !important;

    box-shadow:
        0 1rem 3rem rgba(9, 23, 26, .12) !important;

    overflow: hidden !important;

    z-index: 1000 !important;
}


#dkLabTopFilters #category-header .listSorting__controls {
    margin: 0 !important;
    padding: .65rem 0 !important;

    background: #F9FDFE !important;

    list-style: none !important;
}


#dkLabTopFilters #category-header .listSorting__controls li {
    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
}


#dkLabTopFilters #category-header .listSorting__control {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: .9rem 1.5rem !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: #F9FDFE !important;

    color: #09171A !important;

    text-align: left !important;

    font-weight: 500 !important;

    cursor: pointer !important;

    transition:
        background-color .2s ease,
        color .2s ease !important;
}


#dkLabTopFilters #category-header .listSorting__control:hover {
    background: #C9E9FF !important;

    color: #0F65E6 !important;
}


#dkLabTopFilters #category-header .listSorting__control--current {
    color: #0F65E6 !important;

    font-weight: 700 !important;
}


/* =====================================================
   29) ZOBRAZIT / SKRÝT FILTRY
===================================================== */

#dkLabTopFilters .dkLab-filters-pack-button {
    margin: 0 0 1.5rem !important;
}


#dkLabTopFilters .dkLab-filters-pack-button .btn {
    padding: 1rem 1.6rem !important;

    background: #C9E9FF !important;

    border: 1px solid #0F65E6 !important;
    border-radius: 1.5rem !important;

    color: #0F65E6 !important;

    font-weight: 700 !important;

    box-shadow: none !important;
}


/* =====================================================
   30) MOBILE
===================================================== */

@media (max-width: 767px) {

    #dkLabTopFilters #filters {
        gap: .75rem !important;
    }


    #dkLabTopFilters #manufacturer-filter,
    #dkLabTopFilters #category-filter-hover > .filter-section,
    #dkLabTopFilters .filter-sections > .slider-wrapper,
    #dkLabTopFilters .filter-sections > .filter-section-boolean {
        flex: 1 1 calc(50% - .75rem) !important;
    }


    #dkLabTopFilters #filters .filter-section > h4,
    #dkLabTopFilters #filters .slider-wrapper > h4 {
        width: 100% !important;

        min-height: 4.4rem !important;

        padding: 1rem 1.3rem !important;

        border-radius: 1.25rem !important;

        font-size: 1.3rem !important;
    }


    #dkLabTopFilters #filters .filter-section > form {
        min-width: 22rem !important;
        max-width: min(32rem, calc(100vw - 3rem)) !important;

        border-radius: 1.25rem !important;
    }


    #dkLabTopFilters #filters .dkLab-slider-wrapper,
    #dkLabTopFilters #filters .filter-section-boolean .param-filter-top {
        min-width: 28rem !important;
        max-width: calc(100vw - 3rem) !important;

        border-radius: 1.25rem !important;
    }


    #dkLabTopFilters #category-header .span--sort {
        min-height: 4.4rem !important;

        padding: 1rem 4rem 1rem 1.3rem !important;

        border-radius: 1.25rem !important;

        font-size: 1.3rem !important;
    }

}


/* =====================================================
   31) MALÝ MOBIL
===================================================== */

@media (max-width: 420px) {

    #dkLabTopFilters #manufacturer-filter,
    #dkLabTopFilters #category-filter-hover > .filter-section,
    #dkLabTopFilters .filter-sections > .slider-wrapper,
    #dkLabTopFilters .filter-sections > .filter-section-boolean {
        flex-basis: 100% !important;
    }

}


/* =====================================================
   SKIMAX – RESPONSIVE FIX V19
   ZÁKLAD = V12
   Bez dalších změn funkce filtrů.
===================================================== */


/* =====================================================
   1) POČET POLOŽEK – VŽDY POD FILTRY VLEVO
===================================================== */

#dkLabTopFilters #filters .filter-section-count {
    position: static !important;
    float: none !important;
    clear: both !important;

    display: block !important;

    flex: 0 0 100% !important;

    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;

    order: 9999 !important;

    margin: .5rem 0 0 !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;

    box-sizing: border-box !important;
}

#dkLabTopFilters #filters .filter-section-count .filter-total-count {
    position: static !important;

    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    text-align: left !important;
    white-space: nowrap !important;
}


/* =====================================================
   2) ODSTRANĚNÍ PŘÍPADNÉHO DRUHÉHO MODRÉHO RÁMEČKU
===================================================== */

#dkLabTopFilters #filters .filter-section,
#dkLabTopFilters #filters .slider-wrapper,
#dkLabTopFilters #filters .filter-section:focus,
#dkLabTopFilters #filters .slider-wrapper:focus,
#dkLabTopFilters #filters .filter-section:focus-within,
#dkLabTopFilters #filters .slider-wrapper:focus-within {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

#dkLabTopFilters #filters .filter-section > h4,
#dkLabTopFilters #filters .slider-wrapper > h4,
#dkLabTopFilters #filters .filter-section > h4:focus,
#dkLabTopFilters #filters .slider-wrapper > h4:focus {
    outline: 0 !important;
    box-shadow: none !important;
}


/* =====================================================
   3) STEJNÁ ŠÍŘKA VŠECH FILTRŮ – VELKÝ DESKTOP
===================================================== */

@media (min-width: 1600px) {

    #dkLabTopFilters #manufacturer-filter,
    #dkLabTopFilters #category-filter-hover > .filter-section,
    #dkLabTopFilters #filters .slider-wrapper,
    #dkLabTopFilters #filters .filter-section-boolean {
        flex: 0 0 12rem !important;

        width: 12rem !important;
        min-width: 12rem !important;
        max-width: 12rem !important;

        box-sizing: border-box !important;
    }

    #dkLabTopFilters #manufacturer-filter > h4,
    #dkLabTopFilters #category-filter-hover > .filter-section > h4,
    #dkLabTopFilters #filters .slider-wrapper > h4,
    #dkLabTopFilters #filters .filter-section-boolean > h4 {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }
}


/* =====================================================
   4) DO 1599 PX – SEŘADIT DLE SAMOSTATNĚ NAD FILTRY
   Tím se už nemůže překrývat s Pohlavím ani jiným filtrem.
===================================================== */

@media (max-width: 1599px) {

    #dkLabTopFilters #category-header {
        position: static !important;

        float: none !important;
        clear: both !important;

        display: block !important;

        width: 100% !important;
        height: auto !important;

        margin: 0 0 1.5rem !important;
        padding: 0 !important;

        text-align: left !important;

        transform: none !important;
    }

    #dkLabTopFilters #category-header .span--sort {
        position: relative !important;

        float: none !important;

        display: inline-flex !important;
        align-items: center !important;

        margin: 0 !important;
    }


    /* dva opravdu stejné sloupce */
    #dkLabTopFilters #manufacturer-filter,
    #dkLabTopFilters #category-filter-hover > .filter-section,
    #dkLabTopFilters #filters .slider-wrapper,
    #dkLabTopFilters #filters .filter-section-boolean {
        flex: 0 0 calc(50% - .5rem) !important;

        width: calc(50% - .5rem) !important;
        min-width: calc(50% - .5rem) !important;
        max-width: calc(50% - .5rem) !important;

        box-sizing: border-box !important;
    }

    #dkLabTopFilters #manufacturer-filter > h4,
    #dkLabTopFilters #category-filter-hover > .filter-section > h4,
    #dkLabTopFilters #filters .slider-wrapper > h4,
    #dkLabTopFilters #filters .filter-section-boolean > h4 {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        box-sizing: border-box !important;
    }
}


/* =====================================================
   5) BĚŽNÉ ŠIPKY FILTRŮ
   Stejný pravý okraj jako levý okraj textu.
===================================================== */

#dkLabTopFilters #filters .filter-section > h4,
#dkLabTopFilters #filters .slider-wrapper > h4 {
    padding-left: 1.7rem !important;
    padding-right: 1.7rem !important;
}

#dkLabTopFilters #filters .filter-section > h4 > span,
#dkLabTopFilters #filters .slider-wrapper > h4 > span {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;

    gap: 1rem !important;
}

#dkLabTopFilters #filters .filter-section > h4 > span::after,
#dkLabTopFilters #filters .slider-wrapper > h4 > span::after {
    width: .55rem !important;
    height: .55rem !important;

    flex: 0 0 .55rem !important;

    margin: -.2rem 0 0 !important;

    align-self: center !important;

    transform: rotate(45deg) !important;
}


/* =====================================================
   6) SEŘADIT DLE – JEN MALÁ ŠIPKA V TLAČÍTKU
===================================================== */

/* velká samostatná šipka wrapperu úplně pryč */
#dkLabTopFilters #category-header::before,
#dkLabTopFilters #category-header::after,
#dkLabTopFilters .category-header::before,
#dkLabTopFilters .category-header::after {
    content: none !important;
    display: none !important;
}

#dkLabTopFilters #category-header .span--sort {
    position: relative !important;

    padding-left: 1.7rem !important;
    padding-right: 4rem !important;
}


/* původní velkou šipku samotného span také nepoužijeme;
   vykreslíme jednu malou, stejně velkou jako u filtrů */
#dkLabTopFilters #category-header .span--sort::before {
    content: none !important;
    display: none !important;
}

#dkLabTopFilters #category-header .span--sort::after {
    content: "" !important;

    position: absolute !important;

    display: block !important;

    left: auto !important;
    right: 1.7rem !important;

    top: 50% !important;
    bottom: auto !important;

    width: .55rem !important;
    height: .55rem !important;

    margin: -.3rem 0 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-right: 1.5px solid #09171A !important;
    border-bottom: 1.5px solid #09171A !important;

    background: transparent !important;

    box-shadow: none !important;

    transform: rotate(45deg) !important;
    transform-origin: center !important;
}

#dkLabTopFilters #category-header .span--sort:hover::after {
    border-right-color: #0F65E6 !important;
    border-bottom-color: #0F65E6 !important;
}


/* =====================================================
   7) MOBIL
===================================================== */

@media (max-width: 767px) {

    #dkLabTopFilters #filters .filter-section > h4,
    #dkLabTopFilters #filters .slider-wrapper > h4 {
        padding-left: 1.4rem !important;
        padding-right: 1.4rem !important;
    }

    #dkLabTopFilters #category-header .span--sort {
        padding-left: 1.4rem !important;
        padding-right: 3.6rem !important;
    }

    #dkLabTopFilters #category-header .span--sort::after {
        right: 1.4rem !important;

        width: .5rem !important;
        height: .5rem !important;

        margin-top: -.28rem !important;
    }
}


/* =====================================================
   8) POD 420 PX STÁLE DVA STEJNÉ SLOUPCE
===================================================== */

@media (max-width: 420px) {

    #dkLabTopFilters #manufacturer-filter,
    #dkLabTopFilters #category-filter-hover > .filter-section,
    #dkLabTopFilters #filters .slider-wrapper,
    #dkLabTopFilters #filters .filter-section-boolean {
        flex: 0 0 calc(50% - .5rem) !important;

        width: calc(50% - .5rem) !important;
        min-width: calc(50% - .5rem) !important;
        max-width: calc(50% - .5rem) !important;
    }
}


/* =====================================================
   9) PŮVODNÍ MOBILNÍ TLAČÍTKO "ZOBRAZIT / SKRÝT FILTRY"
   Filtry jsou nyní zobrazené přímo, proto celý původní
   ovládací prvek Filtry+ kompletně vypínáme.
===================================================== */

.dkLab-filters-pack-button,
.dkLab-filters-pack-button *,
.dkLab-filters-pack-button::before,
.dkLab-filters-pack-button::after,
.dkLab-filters-pack-button .open,
.dkLab-filters-pack-button .close,
.dkLab-filters-pack-button .span__pack-button,
.dkLab-filters-pack-button .span__pack-button::before,
.dkLab-filters-pack-button .span__pack-button::after {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;

    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 0 !important;
    max-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    outline: 0 !important;

    overflow: hidden !important;

    pointer-events: none !important;

    content: none !important;
}

/* Samotný wrapper nesmí zabírat žádné místo v layoutu. */
.dkLab-filters-pack-button {
    position: absolute !important;
    inset: auto !important;
}


/* =====================================================
   SKIMAX – FINÁLNÍ OPRAVY FILTRŮ
   19. 8. 2026
   - Seřadit dle barevně sjednoceno s filtry
   - dlouhé názvy na desktopu dostanou přirozenou šířku
   - text se již nevylévá z tlačítek
   - mobilní dropdowny se drží uvnitř viewportu
===================================================== */

/* =====================================================
   32) SEŘADIT DLE – STEJNÝ VZHLED JAKO OSTATNÍ FILTRY
===================================================== */

#dkLabTopFilters #category-header .span--sort,
#dkLabTopFilters .category-header .span--sort,
#category-header .span--sort,
.category-header .span--sort {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 4.6rem !important;
    margin: 0 !important;
    padding: 1.15rem 4rem 1.15rem 1.7rem !important;
    box-sizing: border-box !important;
    background: #F9FDFE !important;
    border: 1px solid #0F65E6 !important;
    border-radius: 1.5rem !important;
    outline: 0 !important;
    box-shadow: none !important;
    color: #09171A !important;
    font-size: 1.4rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .3s ease !important;
}

#dkLabTopFilters #category-header .span--sort:hover,
#dkLabTopFilters .category-header .span--sort:hover,
#category-header .span--sort:hover,
.category-header .span--sort:hover {
    background: #C9E9FF !important;
    border-color: #0F65E6 !important;
    color: #0F65E6 !important;
    transform: translateY(-1px) !important;
}

#dkLabTopFilters #category-header .span--sort::before,
#dkLabTopFilters .category-header .span--sort::before,
#category-header .span--sort::before,
.category-header .span--sort::before {
    content: none !important;
    display: none !important;
}

#dkLabTopFilters #category-header .span--sort::after,
#dkLabTopFilters .category-header .span--sort::after,
#category-header .span--sort::after,
.category-header .span--sort::after {
    content: "" !important;
    position: absolute !important;
    display: block !important;
    top: 50% !important;
    right: 1.7rem !important;
    bottom: auto !important;
    left: auto !important;
    width: .55rem !important;
    height: .55rem !important;
    margin: -.3rem 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-right: 1.5px solid currentColor !important;
    border-bottom: 1.5px solid currentColor !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: rotate(45deg) !important;
    transform-origin: center !important;
}

#dkLabTopFilters #category-header .listSorting,
#dkLabTopFilters .category-header .listSorting,
#category-header .listSorting,
.category-header .listSorting {
    background: #F9FDFE !important;
    border: 1px solid #C9E9FF !important;
    border-radius: 1.5rem !important;
    outline: 0 !important;
    box-shadow: 0 1rem 3rem rgba(9, 23, 26, .12) !important;
    overflow: hidden !important;
    z-index: 1000 !important;
}

#dkLabTopFilters #category-header .listSorting__control:hover,
#dkLabTopFilters .category-header .listSorting__control:hover,
#category-header .listSorting__control:hover,
.category-header .listSorting__control:hover {
    background: #C9E9FF !important;
    color: #0F65E6 !important;
}

#dkLabTopFilters #category-header .listSorting__control--current,
#dkLabTopFilters .category-header .listSorting__control--current,
#category-header .listSorting__control--current,
.category-header .listSorting__control--current {
    color: #0F65E6 !important;
    font-weight: 700 !important;
}

/* =====================================================
   33) DLOUHÉ NÁZVY FILTRŮ – VELKÝ DESKTOP
   Krátké zůstanou kompaktní, delší si vezmou potřebnou šířku.
===================================================== */

@media (min-width: 1600px) {
    #dkLabTopFilters #manufacturer-filter,
    #dkLabTopFilters #category-filter-hover > .filter-section,
    #dkLabTopFilters #filters .slider-wrapper,
    #dkLabTopFilters #filters .filter-section-boolean {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 12rem !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }

    #dkLabTopFilters #manufacturer-filter > h4,
    #dkLabTopFilters #category-filter-hover > .filter-section > h4,
    #dkLabTopFilters #filters .slider-wrapper > h4,
    #dkLabTopFilters #filters .filter-section-boolean > h4 {
        width: auto !important;
        min-width: 12rem !important;
        max-width: none !important;
        padding-left: 1.7rem !important;
        padding-right: 1.7rem !important;
        box-sizing: border-box !important;
    }

    #dkLabTopFilters #filters .filter-section > h4 > span,
    #dkLabTopFilters #filters .slider-wrapper > h4 > span {
        width: auto !important;
        min-width: 0 !important;
        white-space: nowrap !important;
    }
}

/* =====================================================
   34) STŘEDNÍ ŠÍŘKY – text se může zalomit na dva řádky
===================================================== */

@media (max-width: 1599px) {
    #dkLabTopFilters #filters .filter-section > h4,
    #dkLabTopFilters #filters .slider-wrapper > h4 {
        height: auto !important;
        min-height: 4.6rem !important;
    }

    #dkLabTopFilters #filters .filter-section > h4 > span,
    #dkLabTopFilters #filters .slider-wrapper > h4 > span {
        min-width: 0 !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }
}

/* =====================================================
   35) MOBIL – DLOUHÉ NÁZVY A DROPDOWNY UVNITŘ VIEWPORTU
===================================================== */

@media (max-width: 767px) {
    #dkLabTopFilters #filters .filter-section > h4,
    #dkLabTopFilters #filters .slider-wrapper > h4 {
        min-height: 4.4rem !important;
        padding: 1rem 1.4rem !important;
        border-radius: 1.25rem !important;
        font-size: 1.3rem !important;
    }

    #dkLabTopFilters #filters .filter-section > h4 > span,
    #dkLabTopFilters #filters .slider-wrapper > h4 > span {
        min-width: 0 !important;
        gap: .8rem !important;
        line-height: 1.2 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    #dkLabTopFilters #filters .filter-section > h4 > span::after,
    #dkLabTopFilters #filters .slider-wrapper > h4 > span::after {
        flex: 0 0 .5rem !important;
        width: .5rem !important;
        height: .5rem !important;
    }

    #dkLabTopFilters #category-header .span--sort,
    #dkLabTopFilters .category-header .span--sort,
    #category-header .span--sort,
    .category-header .span--sort {
        min-height: 4.4rem !important;
        padding: 1rem 3.6rem 1rem 1.4rem !important;
        border: 1px solid #0F65E6 !important;
        border-radius: 1.25rem !important;
        background: #F9FDFE !important;
        color: #09171A !important;
        font-size: 1.3rem !important;
    }

    #dkLabTopFilters #category-header .span--sort::after,
    #dkLabTopFilters .category-header .span--sort::after,
    #category-header .span--sort::after,
    .category-header .span--sort::after {
        right: 1.4rem !important;
        width: .5rem !important;
        height: .5rem !important;
        margin-top: -.28rem !important;
    }

    #dkLabTopFilters #filters .filter-section {
        position: relative !important;
    }

    #dkLabTopFilters #filters .filter-section > form {
        width: min(28rem, calc(100vw - 3rem)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 3rem) !important;
        box-sizing: border-box !important;
        border-radius: 1.25rem !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    #dkLabTopFilters #category-filter-hover > .filter-section:nth-child(even) > form {
        left: auto !important;
        right: 0 !important;
    }

    #dkLabTopFilters #category-filter-hover > .filter-section:nth-child(odd) > form,
    #dkLabTopFilters #manufacturer-filter > form {
        left: 0 !important;
        right: auto !important;
    }

    #dkLabTopFilters #filters .slider-wrapper {
        position: relative !important;
    }

    #dkLabTopFilters #filters .dkLab-slider-wrapper {
        width: min(30rem, calc(100vw - 3rem)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 3rem) !important;
        box-sizing: border-box !important;
        left: auto !important;
        right: 0 !important;
        border-radius: 1.25rem !important;
    }

    #dkLabTopFilters #filters .filter-section-boolean {
        position: relative !important;
    }

    #dkLabTopFilters #filters .filter-section-boolean .param-filter-top {
        width: min(28rem, calc(100vw - 3rem)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 3rem) !important;
        box-sizing: border-box !important;
        left: auto !important;
        right: 0 !important;
        border-radius: 1.25rem !important;
    }

    #dkLabTopFilters #filters .div--collapsable {
        white-space: normal !important;
    }

    #dkLabTopFilters #filters .filter-label {
        min-width: 0 !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    #dkLabTopFilters #category-header,
    #dkLabTopFilters .category-header,
    #category-header,
    .category-header {
        position: relative !important;
    }

    #dkLabTopFilters #category-header .listSorting,
    #dkLabTopFilters .category-header .listSorting,
    #category-header .listSorting,
    .category-header .listSorting {
        width: min(28rem, calc(100vw - 3rem)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 3rem) !important;
        box-sizing: border-box !important;
        left: 0 !important;
        right: auto !important;
        border-radius: 1.25rem !important;
    }
}

/* =====================================================
   36) MALÝ MOBIL
===================================================== */

@media (max-width: 420px) {
    #dkLabTopFilters #filters .filter-section > form,
    #dkLabTopFilters #filters .dkLab-slider-wrapper,
    #dkLabTopFilters #filters .filter-section-boolean .param-filter-top,
    #dkLabTopFilters #category-header .listSorting,
    #dkLabTopFilters .category-header .listSorting,
    #category-header .listSorting,
    .category-header .listSorting {
        width: calc(100vw - 2rem) !important;
        max-width: calc(100vw - 2rem) !important;
    }

    #dkLabTopFilters #filters .filter-section > h4,
    #dkLabTopFilters #filters .slider-wrapper > h4 {
        padding-left: 1.2rem !important;
        padding-right: 1.2rem !important;
    }
}


/* =====================================================
   SEŘADIT DLE – FINÁLNÍ OPRAVA RÁMEČKU
===================================================== */

#dkLabTopFilters #category-header > span.span--sort {
    border: 1px solid #0F65E6 !important;
}

#dkLabTopFilters #category-header > span.span--sort:hover {
    border: 1px solid #0F65E6 !important;
    background: #C9E9FF !important;
    color: #0F65E6 !important;
}


/* =====================================================
   SKIMAX – MOBILNÍ DROPDOWNY V3
   KOMPLEXNÍ FIX PRO VŠECHNY FILTRY

   Na mobilu se otevřená nabídka vždy drží uvnitř šířky
   své buňky. Díky tomu nezáleží na tom, zda se konkrétní
   parametr dynamicky zařadí do levého nebo pravého sloupce.
   Žádný dropdown tak nemůže přetéct mimo viewport.
===================================================== */

@media (max-width: 767px) {

    /* Každá buňka filtru je vlastní bezpečný containing block. */
    #dkLabTopFilters #manufacturer-filter,
    #dkLabTopFilters #category-filter-hover > .filter-section,
    #dkLabTopFilters #filters .slider-wrapper,
    #dkLabTopFilters #filters .filter-section-boolean {
        position: relative !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }


    /* -----------------------------------------------------
       BĚŽNÉ PARAMETROVÉ DROPDOWNY
       Vždy přesně šířka buňky – tedy bezpečně i vpravo.
    ----------------------------------------------------- */

    #dkLabTopFilters #filters .filter-section > form,
    #dkLabTopFilters #manufacturer-filter > form,
    #dkLabTopFilters #category-filter-hover > .filter-section > form {
        left: 0 !important;
        right: auto !important;

        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;

        border-radius: 1.25rem !important;
    }


    /* Zrušení starého dělení lichý / sudý sloupec.
       Už není potřeba a nemůže rozhodit dynamicky přidané filtry. */

    #dkLabTopFilters #category-filter-hover > .filter-section:nth-child(even) > form,
    #dkLabTopFilters #category-filter-hover > .filter-section:nth-child(odd) > form {
        left: 0 !important;
        right: auto !important;
    }


    /* -----------------------------------------------------
       CENA
    ----------------------------------------------------- */

    #dkLabTopFilters #filters .slider-wrapper .dkLab-slider-wrapper,
    #dkLabTopFilters #filters .dkLab-slider-wrapper {
        left: 0 !important;
        right: auto !important;

        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box !important;

        border-radius: 1.25rem !important;
    }


    /* Cena uvnitř menší mobilní buňky potřebuje kompaktnější obsah. */

    #dkLabTopFilters #filters .dkLab-slider-wrapper {
        padding: 1.4rem !important;
    }

    #dkLabTopFilters #filters .slider-header {
        gap: .8rem !important;
        margin-bottom: 1.5rem !important;
        font-size: 1.2rem !important;
    }

    #dkLabTopFilters #filters .slider-header .from,
    #dkLabTopFilters #filters .slider-header .to {
        min-width: 0 !important;
        white-space: nowrap !important;
    }


    /* -----------------------------------------------------
       PŘÍZNAKY / BOOLEAN FILTRY
    ----------------------------------------------------- */

    #dkLabTopFilters #filters .filter-section-boolean .param-filter-top {
        left: 0 !important;
        right: auto !important;

        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;

        box-sizing: border-box !important;

        border-radius: 1.25rem !important;
    }

    #dkLabTopFilters #filters .filter-section-boolean .param-filter-top form {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }


    /* -----------------------------------------------------
       OBSAH DROPDOWNU
       Delší názvy se zalomí místo horizontálního přetečení.
    ----------------------------------------------------- */

    #dkLabTopFilters #filters .div--collapsable {
        width: 100% !important;
        min-width: 0 !important;

        padding: .7rem 1rem !important;

        box-sizing: border-box !important;

        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    #dkLabTopFilters #filters .filter-label {
        min-width: 0 !important;
        max-width: 100% !important;

        line-height: 1.25 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    #dkLabTopFilters #filters .filter-count {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }


    /* -----------------------------------------------------
       SEŘADIT DLE
       Také nesmí přesáhnout viewport.
    ----------------------------------------------------- */

    #dkLabTopFilters #category-header {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #dkLabTopFilters #category-header .listSorting {
        left: 0 !important;
        right: auto !important;

        width: min(100%, calc(100vw - 2rem)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 2rem) !important;

        box-sizing: border-box !important;

        border-radius: 1.25rem !important;
    }

    #dkLabTopFilters #category-header .listSorting__control {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }
}


/* =====================================================
   MALÝ MOBIL – V3
===================================================== */

@media (max-width: 420px) {

    #dkLabTopFilters #filters .filter-section > form,
    #dkLabTopFilters #manufacturer-filter > form,
    #dkLabTopFilters #category-filter-hover > .filter-section > form,
    #dkLabTopFilters #filters .slider-wrapper .dkLab-slider-wrapper,
    #dkLabTopFilters #filters .dkLab-slider-wrapper,
    #dkLabTopFilters #filters .filter-section-boolean .param-filter-top {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
    }
}

/* =====================================================
   PŘÍZNAKY – ZOBRAZIT VŠECHNY POLOŽKY
   Wrapper se přizpůsobí obsahu, při větším počtu scrolluje.
===================================================== */

#dkLabTopFilters #filters .filter-section-boolean .param-filter-top {
    height: auto !important;
    max-height: 38rem !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
}

#dkLabTopFilters #filters .filter-section-boolean .param-filter-top form {
    height: auto !important;
    max-height: none !important;

    overflow: visible !important;
}

/* scrollbar příznaků */
#dkLabTopFilters #filters .filter-section-boolean .param-filter-top::-webkit-scrollbar {
    width: .6rem;
}

#dkLabTopFilters #filters .filter-section-boolean .param-filter-top::-webkit-scrollbar-thumb {
    background: #C9E9FF;
    border-radius: 3rem;
}

/* =====================================================
   SKIMAX – DESKTOP FIX: SEŘADIT DLE NEPŘEKRÝVÁ FILTRY
   19. 8. 2026

   Na velkém desktopu je řazení umístěné vpravo.
   Filtrům proto výslovně rezervujeme prostor, aby
   poslední filtr nikdy nezajížděl pod "Seřadit dle".
===================================================== */

@media (min-width: 1600px) {

    #dkLabTopFilters {
        position: relative !important;
        box-sizing: border-box !important;
    }

    /* Rezervace místa pro tlačítko "Seřadit dle" */
    #dkLabTopFilters #filters {
        width: calc(100% - 14rem) !important;
        max-width: calc(100% - 14rem) !important;

        padding-right: 0 !important;

        /* o něco kompaktnější mezery, aby se filtry
           bezpečně vešly i na hraničních desktopových šířkách */
        gap: .8rem !important;

        box-sizing: border-box !important;
    }

    /* Řazení držíme samostatně napravo */
    #dkLabTopFilters #category-header {
        position: absolute !important;

        top: 0 !important;
        right: 0 !important;
        left: auto !important;

        float: none !important;
        clear: none !important;

        display: block !important;

        width: 13rem !important;
        min-width: 13rem !important;
        max-width: 13rem !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        text-align: left !important;

        transform: none !important;
    }

    #dkLabTopFilters #category-header > .span--sort,
    #dkLabTopFilters #category-header .span--sort {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        box-sizing: border-box !important;
    }
}