#category-description {
    text-align: justify;
    padding: 15px;
}
#subcategories {
    background: #fff;
    margin-bottom: 1.563rem;
    padding: 0;
    margin-top: 15px;
}
#subcategories ul {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    padding: 15px;
}
#subcategories ul li {
    width: 23.959%;
    text-align: center;
}
#subcategories ul li .subcategory-image {
    padding: 0 0 8px 0;
}
#subcategories ul li .subcategory-image a {
    display: block;
    padding: 9px;
    border: 1px solid #d6d4d4;
}
#subcategories ul li .subcategory-image a img {
    max-width: 100%;
    height: auto;
    vertical-align: top;
}
#subcategories ul li .subcategory-name {
    font-size: 18px;
    color: #555454;
    text-transform: uppercase;
}
#subcategories ul li .subcategory-image a img {
    width: 160px;
    height: auto;
}
.product-block-title a {
    color: #000;
    font-weight: 700;
}
.product-block-title p {
    text-align: center;
}
.carousel-control .icon-next,
.carousel-control .icon-prev {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    font-family: serif;
    line-height: 1;
}
.carousel-control .icon-next {
    right: 50%;
    margin-right: -10px;
}

/* Tablet - 3 kolumny */
@media (max-width: 991px) {
    #subcategories ul li {
        width: 31%;
    }
    #subcategories ul li .subcategory-name {
        font-size: 16px;
    }
}

/* Mały tablet - 2 kolumny */
@media (max-width: 767px) {
    #subcategories ul li {
        width: 48%;
    }
    #subcategories ul li .subcategory-name {
        font-size: 15px;
    }
}

/* Telefon - 1 kolumna */
@media (max-width: 479px) {
    #subcategories ul li {
        width: 100%;
    }
    #subcategories ul li .subcategory-name {
        font-size: 14px;
    }
}

/**FILTRY**/
#amazzing_filter .af_filter_content, #amazzing_filter form {
    width: 100%;
    display: inline-block;
}
.af_filter {
    width: 30%;
    float: left;
    margin: 15px;
    border: 0 !important;
    height: 85px;
    position: relative;
}
#amazzing_filter .af_filter_content, #amazzing_filter form {
    width: 100%;
    display: inline-block;
}
.from_display.slider_value {
    width: 65px !important;
}
.to_display.slider_value {
    border: 1px solid #009899 !important;
    width: 65px;
}
.af_filter .slider-bar {
    margin: 10px 0 14px 5px;
    padding: 0 7px;
    clear: none !important;
}
.slider-bar {
    width: 63% !important;
    float: left !important;
}
#js-active-search-filters{
    display: none;
}
.total-products {
    padding: 0px;
}
.products-selection .sort-by-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.products-selection .sort-by {
    white-space: normal;
    word-break: break-word;
    text-align: right;
    margin-right: 12px;
}
.products-sort-order .select-title {
    display: inline-block;
    width: 100%;
    color: #232323;
    background: #fff;
    padding: .625rem;
    cursor: pointer;
    border: 1px solid rgba(0, 0, 0, .25);
    box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .2);
    text-align: inherit;
}
.row.products-selection {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}
.products-sort-order.dropdown {
    min-width: 450px;
}
@media (max-width: 1199px) {
    .row.products-selection {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }
    .products-sort-order.dropdown {
        min-width: 100%;
    }
    .sort-elements{
        min-width: 100%;  
    }
}

/* ============================================
   PRODUCT MINIATURE - WIDOK KATEGORII (DESKTOP)
   ============================================ */

.product-miniature.desktop-view {
    background: #fff;
    border: 2px solid #009899;
    margin-top: 20px;
    padding: 15px;
    box-shadow: 2px 2px 8px 0 rgba(0, 0, 0, .2);
}

.thumbnail-container {
    width: 100%;
    
}

/* --- Tytuł produktu --- */
.product-title-wrapper {
    width: 100%;
    padding: 0 0 10px 0;
}

.product-title-wrapper .product-title {
    margin: 0;
    text-align: center;
}

.product-title-link {
    font-size: 14pt;
    font-weight: 700;
    color: #000;
    text-decoration: none;
    text-align: center;
    text-transform: math-auto;
}

/* --- Layout 3-kolumnowy --- */
.widok_kat {
    display: flex;
    width: 100%;
    gap: 25px;
}
.discount-section th{
    text-align: left !important;
}
.discount-section th, .discount-section td {
    font-size: 16px;
}
/* --- Kolumna 1: Zdjęcie --- */
.img-contener {
    flex: 0 0 200px;
    text-align: center;
}

.img-contener a:first-child {
    display: block;
    border: 1px solid #009899;
    padding: 8px;
}

.product-thumb-img {
    max-width: 180px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.product-more-btn {
    text-align: center;
    margin-top: 8px;
}

.product-more-btn .btn {
    padding: 6px 20px;
    font-size: 13px;
    text-transform: uppercase;
    background: #009899;
    border-color: #009899;
    color: #fff;
    font-weight: bold;
}

.product-more-btn .btn:hover {
    background: #007a7a;
    border-color: #007a7a;
}
#category .card-block.fsch-home-block {
    padding: 15px;
}
.category-description-bottom {
    padding: 15px;
    background-color: #fff;
}
div#amazzing_filter {
    background-color: #fff;
    padding: 15px;
    margin-top: 15px;
    margin-bottom: 15px;
}
.products__sort-dropdown .dropdown-menu.show {
    width: 300px;
}
.products__sort-dropdown .dropdown-menu.show a.dropdown-item.js-search-link {
    color: #009899;
}
/* --- Kolumna 2: Cechy --- */
.features-style {
    flex: 1 1 auto;
    min-width: 590px;
    max-width: 590px;
    margin: 0;
}

.product-features dl {
    margin: 0;
    padding: 0;
}

.feature-row {
    display: flex;
    width: 100%;
    padding: 2px 0;
    gap: 10px;
}

.feature-row--full {
    display: flex;
    width: 100%;
    margin-bottom: 5px;
}

.feature-name {
    margin: 0;
    padding-left: 3px;
    width: 55%;
    font-weight: bold;
    font-size: 16px;
    color: #000;
}

.feature-value {
    margin: 0;
    padding: 0 5px;
    font-size: 16px;
    color: #000;
}

.feature-description {
    margin: 0;
    padding-left: 3px;
    width: 100%;
    font-weight: normal;
    font-size: 14px;
    color: #555;
    margin-bottom: 5px;
}

.tolerancje_kategoria {
    font-size: 12px;
    color: #888;
    margin-left: 3px;
}

/* --- Kolumna 3: Rabaty + Koszyk --- */
.product-discount-table {
    flex: 0 0 auto;
    min-width: 420px;
    max-width: 420px;
    text-align: center;
}

.discount-section {
    width: 100%;
    margin-bottom: 10px;
}

/* Tabela rabatowa */
.discount-section table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.discount-section table th {
    background: #f5f5f5;
    padding: 6px 10px;
    font-weight: 700;
    text-align: center;
    border-bottom: 2px solid #ddd;
}

.discount-section table td {
    padding: 5px 10px;
    text-align: center;
    border-bottom: 1px solid #eee;
}

.discount-section table tr:hover td {
    background: #fafafa;
}
li.product-flag.out_of_stock{
    display: none;
}
/* Omnibus - najniższa cena */
.omnibus-price {
    font-size: 12px;
    color: #000;
    margin: 8px 0;
    text-align: center;
}

/* Koszyk */
.add-to-cart-section {
    margin-top: 25px;
    text-align: center;
}

.add-to-cart-section form {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 10px;
}

.add-to-cart-section .quantity {
    width: 70px;
    height: 44px;
    text-align: center;
    font-size: 16px;
    border: 1px solid #cecece;
    outline: none;
}

.add-to-cart-section .quantity::-webkit-inner-spin-button,
.add-to-cart-section .quantity::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.add-to-cart-section .add-to-cart {
    height: 44px;
    padding: 0 18px;
    background: #cc2314 !important;
    border: 2px solid #cc2314 !important;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.product-more-btn a.add_to_cart.btn.btn-primary.btn-sm{
    background-color: #009899 !important;
    border-color: #009899 !important;
    color: #fff !important;
}
.add-to-cart-section .add-to-cart:hover {
    background: #a81d10;
    border-color: #a81d10;
}

.add-to-cart-section .add-to-cart .material-icons {
    font-size: 22px;
    color: #fff;
}

/* Dostępna ilość */
.stock-info {
    display: block;
    margin-top: 10px;
    font-size: 16px;
    font-weight: 700;
    color: #333;
}

.stock-qty {
    color: #d32f2f;
    font-size: 16px;
}

.stock-unavailable {
    color: #d32f2f;
    font-size: 16px;
}
.category-description-long .fsch-home-block{
    padding: 15px 15px !important;
}

/* ============================================
   RESPONSYWNOŚĆ
   ============================================ */

/* Tablet - cechy pod zdjęciem, tabela obok */
@media (max-width: 1199px) {
    .features-style {
        min-width: 250px;
    }

    .product-discount-table {
        min-width: 280px;
    }
}

/* Mniejszy tablet - wszystko w kolumnie */
@media (max-width: 991px) {
    .widok_kat {
        flex-wrap: wrap;
    }

    .img-contener {
        flex: 0 0 180px;
    }

    .features-style {
        flex: 1 1 calc(100% - 200px);
        min-width: 250px;
        max-width: none;
    }

    .product-discount-table {
        flex: 1 1 100%;
        max-width: none;
        min-width: auto;
        margin-top: 15px;
    }
}

/* Telefon */
@media (max-width: 576px) {
    .product-miniature.desktop-view {
        padding: 10px;
    }

    .widok_kat {
        flex-direction: column;
        align-items: center;
    }

    .img-contener {
        flex: none;
        width: 100%;
    }

    .features-style {
        flex: none;
        width: 100%;
        min-width: auto;
        max-width: none;
    }

    .feature-name {
        width: 45%;
    }

    .product-discount-table {
        width: 100%;
    }

    .add-to-cart-section .quantity {
        width: 60px;
        height: 40px;
    }

    .add-to-cart-section .add-to-cart {
        height: 40px;
    }
    
}
a.btn.btn-secondary {
    color: #7a7a7a;
    box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .2);
    font-weight: 600;
    padding: .5rem 1.25rem;
    background: #fff;
    border-color: transparent;
}
.block-category.card.card-block {
    padding: 10px;
}
.block-category.card.card-block h1{
    text-align: center;
}
.subcategories-list a {
    color: #000;
    font-size: 16px;
    font-weight: 700;
}
.pagination--wenes {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    width: 100%;
    max-width: none;
    margin: 0px 0px 15px 0px;
    border-top: 1px solid #d9dee1;
    box-sizing: border-box;
}
.pagination .page-list {
    background: #fff;
    padding: .375rem;
    margin-bottom: 0;
    box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .2);
}
.pagination__pages {
    width: 100%;
    display: flex;
    justify-content: center;
}

.pagination--wenes .page-list {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0;
    padding: 15px;
    list-style: none;
    width: 100%;
    box-sizing: border-box;
}

.pagination--wenes .page-list li {
    display: flex;
}

.pagination--wenes .page-list a,
.pagination--wenes .page-list .spacer {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 48px;
    padding: 0 16px;
    background: #fff;
    border: 1px solid #d9dee1;
    border-radius: 6px;
    color: #333;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    box-sizing: border-box;
    transition: box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}

.pagination--wenes .page-list .spacer {
    border-color: transparent;
    background: transparent;
    color: #999;
    min-width: 16px;
    padding: 0;
}

.pagination--wenes .page-list a:hover,
.pagination--wenes .page-list a:focus {
    box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    border-color: #17a2a0;
    color: #17a2a0;
    text-decoration: none;
}

.pagination--wenes .page-list li.current a {
    background: #17a2a0;
    border-color: #17a2a0;
    color: #fff;
}

.pagination--wenes .page-list li.current a:hover {
    color: #fff;
}

.pagination--wenes .page-list a.disabled {
    pointer-events: none;
}

.pagination--wenes .page-list a.previous,
.pagination--wenes .page-list a.next {
    gap: 8px;
    padding: 0 20px;
    font-weight: 600;
}

.pagination__arrow {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
}

.pagination__summary {
    font-size: 14px;
    color: #767676;
}

@media (max-width: 767px) {
    .pagination--wenes .page-list {
        flex-wrap: nowrap;
        gap: 4px;
        padding: 15px 8px;
        margin: 15px 0px 0px 0px;
    }

    .pagination--wenes .page-list a,
    .pagination--wenes .page-list .spacer {
        min-width: 34px;
        height: 34px;
        font-size: 15px;
        padding: 0;
        flex-shrink: 0;
    }

    .pagination__nav-label {
        display: none;
    }

    .pagination--wenes .page-list a.previous,
    .pagination--wenes .page-list a.next {
        padding: 0;
        width: 37px;
    }
}
@media (min-width:1600px) {
    #amazzing_filter .af_filter_content,
    #amazzing_filter form {
        width: 100%;
        display: inline-block
    }
    #amazzing_filter form {
        padding-top: 5px
    }
    .af_filter {
        width: 30%;
        float: left;
        margin: 15px;
        border: 0 !important;
        height: 85px
    }
    #amazzing_filter .af_subtitle::before,
    .cf.slider-option,
    .selected-filters-label {
        display: none !important
    }
    #amazzing_filter .af_subtitle {
        font-size: .7rem
    }
    .to_display.slider_value.edit {
        float: right !important;
        width: 65px !important
    }
    .from_display.slider_value {
        float: left !important;
        width: 65px !important;
        border: 1px solid #009899 !important
    }
    .slider-bar {
        width: 63% !important;
        float: left !important
    }
    .af_filter .slider-bar {
        margin: 10px 0 14px 5px;
        padding: 0 7px;
        clear: none !important
    }
    .slider .slider_value.edit .input-text {
        display: inline-block;
        border: 0;
        padding: 0;
        max-width: 50px !important;
        outline: 0;
        line-height: 1em
    }
    .clearAll {
        background-color: #009899 !important;
        color: #fff !important;
        box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .2);
        text-transform: uppercase;
        font-weight: 600;
        padding: .5rem 1.25rem !important
    }
    .clearAll .txt {
        color: #fff !important;
        font-weight: 700;
        font-size: 14px !important;
        margin-top: 0 !important
    }
    .af_filter:hover .slider_value,
    .slider .slider_value.edit {
        border-color: #009899 !important
    }
    .to_display.slider_value {
        border: 1px solid #009899 !important;
        width: 65px
    }
    .af_filter.f111 .slider-bar {
        width: 45% !important
    }
    .af_filter.f111 .to_display.slider_value,
    .af_filter.f111 .to_display.slider_value.edit {
        float: right !important;
        width: 82px !important
    }
    .af_filter.f111 .from_display.slider_value,
    .af_filter.f111 .from_display.slider_value.edit {
        float: left !important;
        width: 82px !important
    }
    .af_filter.f111 .slider .slider_value.edit .input-text {
        display: inline-block;
        border: 0;
        padding: 0;
        max-width: 76px !important;
        outline: 0;
        line-height: 1em
    }
    .category-id-3420 .f12_slider .from_display,
    .category-id-3420 .f12_slider .to_display,
    .category-id-3464 .f32_slider .from_display,
    .category-id-3464 .f32_slider .to_display {
        width: 65px !important
    }
    .category-id-3420 .f12_slider .slider-bar,
    .category-id-3464 .f32_slider .slider-bar {
        width: 57% !important
    }
    .category-id-3488 .af_filter.clearfix.f115 {
        min-height: 120px !important
    }
}

@media (min-width:1200px) and (max-width:1599px) {
    #amazzing_filter .af_filter_content,
    #amazzing_filter form {
        width: 100%;
        display: inline-block
    }
    #amazzing_filter form {
        padding-top: 5px
    }
    .af_filter {
        width: 30%;
        float: left;
        margin: 15px;
        border: 0 !important;
        height: 85px
    }
    #amazzing_filter .af_subtitle::before,
    .cf.slider-option,
    .selected-filters-label {
        display: none !important
    }
    #amazzing_filter .af_subtitle {
        font-size: .7rem
    }
    .to_display.slider_value.edit {
        float: right !important;
        width: 65px !important
    }
    .from_display.slider_value {
        float: left !important;
        width: 65px !important;
        border: 1px solid #009899 !important
    }
    .slider-bar {
        width: 63% !important;
        float: left !important
    }
    .af_filter .slider-bar {
        margin: 10px 0 14px 5px;
        padding: 0 7px;
        clear: none !important
    }
    .slider .slider_value.edit .input-text {
        display: inline-block;
        border: 0;
        padding: 0;
        max-width: 50px !important;
        outline: 0;
        line-height: 1em
    }
    .clearAll {
        background-color: #009899 !important;
        color: #fff !important;
        box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .2);
        text-transform: uppercase;
        font-weight: 600;
        padding: .5rem 1.25rem !important
    }
    .clearAll .txt {
        color: #fff !important;
        font-weight: 700;
        font-size: 14px !important;
        margin-top: 0 !important
    }
    .af_filter:hover .slider_value,
    .slider .slider_value.edit {
        border-color: #009899 !important
    }
    .to_display.slider_value {
        border: 1px solid #009899 !important;
        width: 65px
    }
    .af_filter.f111 .slider-bar {
        width: 50% !important
    }
    .af_filter.f111 .to_display.slider_value {
        float: right !important;
        width: 82px !important
    }
    .af_filter.f111 .from_display.slider_value {
        float: left !important;
        width: 72px !important
    }
    .category-id-3420 .f12_slider .from_display,
    .category-id-3420 .f12_slider .to_display,
    .category-id-3464 .f32_slider .from_display,
    .category-id-3464 .f32_slider .to_display {
        width: 65px !important
    }
    .category-id-3420 .f12_slider .slider-bar,
    .category-id-3464 .f32_slider .slider-bar {
        width: 57% !important
    }
    .category-id-3488 .af_filter.clearfix.f115 {
        min-height: 120px !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    #amazzing_filter .af_filter_content,
    #amazzing_filter form {
        width: 100%;
        display: inline-block
    }
    #amazzing_filter form {
        padding-top: 5px
    }
    .af_filter {
        width: 46%;
        float: left;
        margin: 15px;
        border: 0 !important
    }
    #amazzing_filter .af_subtitle::before,
    .cf.slider-option,
    .selected-filters-label {
        display: none !important
    }
    #amazzing_filter .af_subtitle {
        font-size: .7rem
    }
    .to_display.slider_value.edit {
        float: right !important;
        width: 55px !important
    }
    .from_display.slider_value {
        float: left !important;
        width: 55px !important;
        border: 1px solid #009899 !important
    }
    .slider-bar {
        width: 66% !important;
        float: left !important
    }
    .af_filter .slider-bar {
        margin: 10px 0 14px 5px;
        padding: 0 7px;
        clear: none !important
    }
    .slider .slider_value.edit .input-text {
        display: inline-block;
        border: 0;
        padding: 0;
        max-width: 50px !important;
        outline: 0;
        line-height: 1em
    }
    .clearAll {
        background-color: #009899 !important;
        color: #fff !important;
        box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .2);
        text-transform: uppercase;
        font-weight: 600;
        padding: .5rem 1.25rem !important
    }
    .clearAll .txt {
        color: #fff !important;
        font-weight: 700;
        font-size: 14px !important;
        margin-top: 0 !important
    }
    .af_filter:hover .slider_value,
    .slider .slider_value.edit {
        border-color: #009899 !important
    }
    .to_display.slider_value {
        border: 1px solid #009899 !important;
        width: 65px
    }
    .af_filter.f111 .slider-bar {
        width: 60% !important
    }
    .af_filter.f111 .to_display.slider_value {
        float: right !important;
        width: 82px !important
    }
    .af_filter.f111 .from_display.slider_value {
        float: left !important;
        width: 72px !important
    }
    .category-id-3420 .f12_slider .from_display,
    .category-id-3420 .f12_slider .to_display,
    .category-id-3464 .f32_slider .from_display,
    .category-id-3464 .f32_slider .to_display {
        width: 65px !important
    }
    .category-id-3420 .f12_slider .slider-bar,
    .category-id-3464 .f32_slider .slider-bar {
        width: 65% !important
    }
    .category-id-3488 .af_filter.clearfix.f115 {
        min-height: 120px !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    #amazzing_filter .af_filter_content,
    #amazzing_filter form {
        width: 100%;
        display: inline-block
    }
    #amazzing_filter form {
        padding-top: 5px
    }
    .af_filter {
        width: 95%;
        float: left;
        margin: 15px;
        border: 0 !important
    }
    #amazzing_filter .af_subtitle::before,
    .cf.slider-option,
    .selected-filters-label {
        display: none !important
    }
    #amazzing_filter .af_subtitle {
        font-size: .7rem
    }
    .to_display.slider_value.edit {
        float: right !important;
        width: 55px !important
    }
    .from_display.slider_value {
        float: left !important;
        width: 55px !important;
        border: 1px solid #009899 !important
    }
    .slider-bar {
        width: 78% !important;
        float: left !important
    }
    .af_filter .slider-bar {
        margin: 10px 0 14px 5px;
        padding: 0 7px;
        clear: none !important
    }
    .slider .slider_value.edit .input-text {
        display: inline-block;
        border: 0;
        padding: 0;
        max-width: 50px !important;
        outline: 0;
        line-height: 1em
    }
    .clearAll {
        background-color: #009899 !important;
        color: #fff !important;
        box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .2);
        text-transform: uppercase;
        font-weight: 600;
        padding: .5rem 1.25rem !important
    }
    .clearAll .txt {
        color: #fff !important;
        font-weight: 700;
        font-size: 14px !important;
        margin-top: 0 !important
    }
    .af_filter:hover .slider_value,
    .slider .slider_value.edit {
        border-color: #009899 !important
    }
    .to_display.slider_value {
        border: 1px solid #009899 !important;
        width: 65px
    }
    .af_filter.f111 .slider-bar {
        width: 74% !important
    }
    .af_filter.f111 .to_display.slider_value {
        float: right !important;
        width: 82px !important
    }
    .af_filter.f111 .from_display.slider_value {
        float: left !important;
        width: 72px !important
    }
    .category-id-3420 .f12_slider .from_display,
    .category-id-3420 .f12_slider .to_display,
    .category-id-3464 .f32_slider .from_display,
    .category-id-3464 .f32_slider .to_display {
        width: 65px !important
    }
    .category-id-3420 .f12_slider .slider-bar,
    .category-id-3464 .f32_slider .slider-bar {
        width: 77% !important
    }
    .category-id-3488 .af_filter.clearfix.f115 {
        min-height: 120px !important
    }
}

#header .user-info i,
#sbi_camera_button,
.mobile .user-info a,
.tabs {
    display: inline-block
}

.category-id-3429 .f111 .af_filter_content,
.category-id-3450 .f111 .af_filter_content,
.category-id-3480 .f111 .af_filter_content,
.category-id-3480 .f32 .af_filter_content {
    margin-top: 13px
}

.af_filter.tb li.active {
    border-color: #009899 !important
}

#header .header-nav .right-nav,
.category-id-4533 .f12 .af_filter_content,
.category-id-4533 .f49 .af_filter_content {
    margin-top: 12px
}
@media (max-width:767px) {
    #amazzing_filter .af_filter_content,
    #amazzing_filter form {
        width: 100%;
        display: inline-block
    }
    #amazzing_filter form {
        padding-top: 5px
    }
    #tab-content img {
        width: 100%;
        height: auto
    }
    .af_filter {
        width: 95%;
        float: left;
        margin: 0;
        border: 0 !important
    }
    #amazzing_filter .af_subtitle::before,
    .cf.slider-option,
    .selected-filters-label {
        display: none !important
    }
    #amazzing_filter .af_subtitle {
        font-size: .7rem
    }
    .to_display.slider_value.edit {
        float: right !important;
        width: 20% !important
    }
    .from_display.slider_value {
        float: left !important;
        width: 20% !important
    }
    .slider-bar {
        width: 100% !important;
        float: left !important
    }
    .af_filter .slider-bar {
        margin: 10px 0 14px 5px;
        padding: 0 7px;
        clear: both !important
    }
    .slider .slider_value.edit .input-text {
        display: inline-block;
        border: 0;
        padding: 0;
        max-width: 47px !important;
        outline: 0;
        line-height: 1em
    }
    .clearAll {
        background-color: #009899 !important;
        color: #fff !important;
        box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .2);
        text-transform: uppercase;
        font-weight: 600;
        padding: .5rem 1.25rem !important
    }
    .clearAll .txt {
        color: #fff !important;
        font-weight: 700;
        font-size: 14px !important;
        margin-top: 0 !important
    }
    .af_filter:hover .slider_value,
    .slider .slider_value.edit {
        border-color: #009899 !important
    }
    .from_display.slider_value,
    .to_display.slider_value {
        border: 1px solid #009899 !important
    }
    .widok_kat {
        display: flex;
        justify-content: space-between;
        flex-flow: row wrap
    }
    .widok_kat .product-discount-table {
        margin: 0 auto !important
    }
    #to-magnesy,
    .col-md-4.links {
        padding: 0 !important
    }
    .footer-container .links ul>li a {
        color: #7a7a7a !important;
        cursor: pointer !important;
        font-size: .875rem !important;
        font-weight: 400 !important
    }
    .footer-container .links ul>li {
        padding: .625rem !important;
        border-bottom: 1px solid #fff !important;
        font-weight: 700 !important;
        background-color: #fff !important;
        margin: 0 !important
    }
    .block-contact.col-md-4.links.wrapper {
        margin-top: 15px;
        font-size: .875rem !important
    }
    .block-contact.col-md-4.links.wrapper .hidden-sm-down {
        margin-left: 0 !important;
        padding: .625rem !important
    }
    #to-magnesy li {
        color: #7a7a7a;
        font-weight: 400 !important
    }
    .faq-page,
    .faq-page-sprzedaz {
        cursor: pointer;
        font-family: Noto Sans, sans-serif;
        color: #000;
        font-size: 14pt !important;
        text-align: left !important;
        padding: 10px;
        line-height: 1.6rem;
        border: none;
        outline: 0;
        transition: .4s;
        margin: 0 !important
    }
    .faq-body p {
        font-size: 12pt !important;
        text-align: left !important
    }
    .MsoNormalTable p {
        text-align: center !important;
    }
}
/* ============================================
   KAFELKI PODKATEGORII – rowne wysokosci i spojne nazwy

   Dwa problemy, ktore to naprawia:

   1. Kafelki miały rozna wysokosc, bo ramka ze zdjeciem dopasowywala sie do
      proporcji obrazka, a podpisy zajmowaly raz jedna, raz dwie linie. Ramka
      dostaje stala wysokosc, a <li> staje sie kolumna flex, wiec wszystkie
      kafelki w wierszu koncza sie na tej samej wysokosci.

   2. Nazwy podkategorii wygladaly roznie w zaleznosci od tego, czy markup
      opakowuje je w <p>, czy nie – regula .subcategory-name nie ustawiala
      font-weight ani nie nadpisywala koloru linku. Teraz waga i kolor sa
      podane wprost, tak samo dla <a> i dla <p> w srodku.
   ============================================ */

#subcategories ul {
    align-items: stretch;
}

#subcategories ul li {
    display: flex;
    flex-direction: column;
}

#subcategories ul li .subcategory-image {
    flex: 0 0 auto;
}

/* Ramka o stalej wysokosci – to ona wyrownuje kafelki miedzy soba */
#subcategories ul li .subcategory-image a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 180px;
    box-sizing: border-box;
}

#subcategories ul li .subcategory-image a img {
    /* max-width 160px zachowuje dotychczasowy limit szerokosci (wczesniej byl
       to sztywny width:160px), a max-height wpisuje obrazek w ramke bez
       znieksztalcania proporcji. */
    width: auto;
    height: auto;
    max-width: 160px;
    max-height: 100%;
}

/* Nazwa: zawsze pogrubiona, ten sam kolor niezaleznie od struktury markupu */
#subcategories ul li .subcategory-name,
#subcategories ul li .subcategory-name p {
    font-weight: 700;
    color: #555454;
    text-transform: uppercase;
    text-decoration: none;
}

#subcategories ul li .subcategory-name {
    display: block;
    padding-top: 4px;
}

#subcategories ul li .subcategory-name p {
    margin: 0;
    font-size: inherit;
    line-height: 1.3;
}

#subcategories ul li .subcategory-name:hover,
#subcategories ul li .subcategory-name:hover p {
    color: #232323;
}

@media (max-width: 991px) {
    #subcategories ul li .subcategory-image a {
        height: 160px;
    }
}

@media (max-width: 767px) {
    #subcategories ul li .subcategory-image a {
        height: 150px;
    }
}

@media (max-width: 479px) {
    #subcategories ul li .subcategory-image a {
        height: 180px;
    }
}
/* ============================================
   FLAGI (Wyprzedaz! / Promocja!)

   Blok przywrocony - zaginal miedzy wersjami pliku, a bez niego .product-flags
   zostaje z position:absolute dziedziczonym z motywu Hummingbird. Rodzic nie ma
   position:relative, wiec flagi pozycjonuja sie wzgledem dalekiego przodka
   i w praktyce znikaja z kafelka. Tu wracaja jako paski w kolumnie z cenami.
   ============================================ */

.product-discount-table .product-flags {
    position: static;
    display: block;
    width: 100%;
    margin: 10px 0;
    padding: 0;
    list-style: none;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
}

.product-discount-table .product-flag {
    display: block;
    width: 100%;
    margin: 0 0 6px;
    padding: 8px 10px;
    background: #cc2314;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .02em;
    border-radius: 0;
    white-space: normal;
}

.product-discount-table .product-flag:last-child {
    margin-bottom: 0;
}

.product-discount-table .product-flag.on-sale {
    background: #f29e72;
}

li.product-flag.out_of_stock,
li.product-flag.new,
li.product-flag.online-only,
li.product-flag.pack {
    display: none;
}

/* ============================================
   TABELA CEN – ZAPOBIEGANIE WYCHODZENIU POZA KAFELEK

   .product-discount-table ma na stale min-width/max-width 420px, a regula
   zmniejszajaca do 280px zaczyna sie dopiero od 1199px. Miedzy 1200 a ok.
   1400px kolumna nie miescila sie w kafelku i tabela wychodzila poza obszar.
   ============================================ */

/* Zabezpieczenie niezalezne od szerokosci ekranu.
   Celowo NIE ruszamy tu max-width - przepelnienie powoduje min-width: 420px,
   a nadpisanie max-width zmienialoby wyglad takze na szerokim desktopie,
   gdzie uklad jest poprawny. */
.product-discount-table {
    box-sizing: border-box;
}

.discount-section {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.discount-section table {
    max-width: 100%;
}

/* Blok z progiem 1200-1399px usuniety - zastapiony elastycznymi
   kolumnami na koncu pliku (patrz WIERSZ LISTINGU). */

/* ============================================
   ODSTEP NAD SORTOWANIEM NA TELEFONIE
   Blok sortowania przylegal bezposrednio do karty z opisem kategorii.
   ============================================ */

@media (max-width: 767.98px) {
    .products-selection {
        margin-top: 20px;
    }

    .products-selection .sort-by-row {
        margin-bottom: 8px;
    }

    #js-product-list-top,
    .products-sort-order.dropdown {
        margin-top: 10px;
    }
}

/* ============================================
   ZDJECIE PRODUKTU W KATEGORII – WYSRODKOWANIE

   Przyczyna: ponizej 992px kolumna ze zdjeciem ma flex: 0 0 180px (linia 497),
   a ramka wokol zdjecia jest szersza - 180px obrazka + 2x8px paddingu
   + 2x1px ramki = 198px, w DevToolsach 200x198. Zawartosc szersza niz
   kontener nie da sie wysrodkowac przez text-align, wiec nadmiar wychodzil
   w prawo, a zdjecie zostawalo przy lewej krawedzi.

   Ponizej 992px zdjecie i tak laduje we wlasnym wierszu (features-style
   i product-discount-table maja lacznie za duzy min-width), wiec kolumna
   dostaje pelna szerokosc i realnie centruje zawartosc.
   ============================================ */

.img-contener a:first-child {
    display: inline-block;
    max-width: 100%;
    box-sizing: border-box;
}

.img-contener .product-thumb-img,
.img-contener img {
    display: block;
    margin: 0 auto;
}

@media (max-width: 991.98px) {
    .img-contener {
        flex: 1 1 100% !important;
        width: 100%;
        max-width: 100%;
        text-align: center;
    }

    /* Przycisk "WIECEJ" trzyma szerokosc ramki ze zdjeciem */
    .img-contener .product-more-btn {
        text-align: center;
    }
}

/* Powyzej telefonu zdjecie nieco wieksze.
   max-width nie powieksza obrazka ponad jego naturalna szerokosc - jesli
   zrodlo (home_default) ma mniej niz podana wartosc, zdjecie zostanie
   w oryginalnym rozmiarze zamiast sie rozmyc. */
@media (min-width: 577px) {
    .product-thumb-img {
        max-width: 220px;
    }
}

@media (min-width: 992px) {
    .product-thumb-img {
        max-width: 240px;
    }

    .img-contener {
        flex: 0 0 260px;
    }
}


/* ============================================
   WIERSZ LISTINGU – DOPASOWANIE DO SZEROKOSCI KARTY

   Arytmetyka regul bazowych:
     zdjecie 200 + gap 25 + cechy 590 + gap 25 + tabela cen 420 = 1260 px
   Kontener .container Bootstrapa ma przy 1200px szerokosc 1140 px, a po
   odjeciu paddingu karty zostaje okolo 1100 px. Wiersz nie mial szans sie
   zmiescic i tabela cen wychodzila poza obszar.

   Wczesniejsza proba zwezala tylko tabele, ale prawdziwa blokada byla
   w .features-style, ktore ma min-width ORAZ max-width 590px i nie moglo
   sie skurczyc. Zamiast dobierac kolejne progi, obie kolumny sa teraz
   elastyczne - min-width: 0 pozwala elementowi flex zejsc ponizej szerokosci
   swojej zawartosci, co domyslnie jest zablokowane.
   ============================================ */

@media (min-width: 992px) {
    .widok_kat {
        min-width: 0;
    }

    /* Zdjecie zostaje na stalej szerokosci - jest przewidywalne */
    .widok_kat > .img-contener {
        flex: 0 0 200px;
        min-width: 0;
    }

    /* Cechy: wypelniaja to, co zostanie, i moga sie zwezic */
    .widok_kat > .features-style {
        flex: 1 1 auto;
        min-width: 0;
        max-width: none;
    }

    /* Tabela cen: docelowo 420px, ale wolno jej sie skurczyc */
    .widok_kat > .product-discount-table {
        flex: 0 1 420px;
        min-width: 0;
        max-width: 420px;
    }

    /* Gdy miejsca zabraknie, tabela przewija sie w poziomie
       zamiast rozpychac karte. */
    .discount-section {
        max-width: 100%;
        overflow-x: auto;
    }

    .discount-section table {
        min-width: 280px;
    }
}

/* ============================================
   FILTRY (amazzingfilter 3.3.5) – KOLORY I ODSTEPY

   Reguly sa tutaj, a nie w plikach modulu, zeby przetrwaly jego aktualizacje.
   Producent usunal w 3.3.5 swoj views/css/custom.css, ktory wczesniej sluzyl
   do takich poprawek.

   Kolory z oryginalu, ktore nadpisujemy:
     .selected-bar  #D0D5DB   -> #009899
     .pointer       #ECEFF0 z obwodka #AAB2BD -> bialy z obwodka #009899
     .clearAll      tlo #D0D5DB, tekst #666
   ============================================ */

/* --- Pasek zaznaczonego zakresu --- */
.af-slider .selected-bar {
    background: #009899;
}

/* --- Uchwyty suwaka --- */
.af-slider .pointer {
    background: #fff;
    border-color: #009899;
}

.af-slider .pointer.last-active,
.af-slider .pointer:hover {
    border-color: #007b7c;
}

/* --- Odstep miedzy polami wartosci a uchwytami ---
   Uklad suwaka jest w tym pliku dostrojony osobno dla kazdego progu
   (szerokosci .slider-bar w liniach ~738, 846, 943, 1040, 1163). CELOWO
   ich nie ruszamy - globalne nadpisanie szerokosci skasowaloby to dostrojenie
   i pasek spadal pod pola przy waskich kolumnach.

   Zamiast tego zwezamy pola wartosci o 8px z kazdej strony i o tyle samo
   odsuwamy pasek. Bilans szerokosci wychodzi 5px na PLUS wzgledem oryginalu,
   wiec wiersz miesci sie wszedzie tam, gdzie miescil sie wczesniej. */
.from_display.slider_value,
.to_display.slider_value {
    width: 57px !important;
}

.af_filter .slider-bar,
#amazzing_filter .slider-bar {
    margin-left: 12px;
    margin-right: 12px;
}

/* --- Pasek wybranych wartosci pod przyciskiem "Wyczysc" ---
   Wartosci sa juz widoczne w polach przy suwakach, wiec ich powtarzanie
   pod przyciskiem tylko zabiera miejsce. Ukrywamy same pozycje,
   przycisk zostaje. */
.selectedFilters .cf {
    display: none !important;
}

/* --- Przycisk "Wyczysc" --- */
.selectedFilters {
    margin-top: 0;
}

.selectedFilters .clearAll {
    background: none;
    padding: 0;
    text-align: right;
}

.selectedFilters .clearAll a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: #009899;
    color: #fff;
    border-radius: 3px;
    line-height: 1.2;
    text-decoration: none;
    transition: background .15s ease;
}

.selectedFilters .clearAll a:hover,
.selectedFilters .clearAll a:focus {
    background: #007b7c;
    color: #fff;
}

.selectedFilters .clearAll .txt {
    font-size: .8125rem;
    line-height: 1.2;
    margin-top: 0;
    vertical-align: middle;
}

.selectedFilters .clearAll i {
    margin-left: 0;
    font-size: 14px;
}


/* ============================================
   FILTRY – PRZYCISKI W WIDOKU MOBILNYM

   Motyw nadaje .btn-primary swoj jasnoniebieski, przez co "Zobacz produkty"
   i "Ukryj" odstawaly od resztu sklepu.
   ============================================ */

#amazzing_filter .viewFilteredProducts,
#amazzing_filter .btn.viewFilteredProducts {
    background: #009899 !important;
    border-color: #009899 !important;
    color: #fff !important;
}

#amazzing_filter .viewFilteredProducts:hover,
#amazzing_filter .viewFilteredProducts:focus {
    background: #007b7c !important;
    border-color: #007b7c !important;
}

/* Licznik produktow w przycisku - jasniejszy, ale czytelny */
#amazzing_filter .viewFilteredProducts .count,
#amazzing_filter .viewFilteredProducts span {
    color: #fff;
    opacity: .85;
}

/* Przycisk zwijania panelu filtrow */
#amazzing_filter .btn.compact-toggle,
#amazzing_filter .compact-toggle.compact-close {
    color: #009899;
    background: none;
    border: 0;
}

#amazzing_filter .btn.compact-toggle:hover,
#amazzing_filter .compact-toggle.compact-close:hover {
    color: #007b7c;
}

.compact-toggle.sticky,
#amazzing_filter .compact-toggle.sticky {
    background: #009899 !important;
    color: #fff !important;
}