/* ===================================================================
 * GŁÓWNA SIATKA PRODUKTÓW (FLEXBOX, KOMPATYBILNA Z WC)
 * =================================================================== */

/* ✅ POPRAWKA: Wymuszenie dziedziczenia czcionki z motywu - zapobiega Times New Roman i innym hardcoded czcionkom */
.woocommerce-content-wrapper,
.woocommerce-content-wrapper * {
    font-family: inherit !important;
    font-size: inherit;
    line-height: inherit;
}

.woocommerce ul.products,
ul.products[style] {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: var(--ka-archive-gap, 20px) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none;
    box-sizing: border-box;
    width: 100%;
    max-width: 1200px; /* dostosuj jeśli chcesz szerzej/wężej */
}

/* Upewnij się, że żaden kontener nie daje paddingu bocznego */
.woocommerce-content-wrapper,
.ka-creator-container,
.ka-creator-container.container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ✅ POPRAWKA: Upewnij się, że kontenery w kontekście search są na pełnej szerokości (bez paddingów Bootstrap) */
.ka-search-posts-section .ka-creator-container,
.ka-search-categories-section .ka-creator-container,
.ka-search-products-section .ka-creator-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Produkty - szerokość w kolumnach */
.woocommerce ul.products.columns-2 li.product {
    width: calc((100% - var(--ka-archive-gap, 20px)) / 2) !important;
}
.woocommerce ul.products.columns-3 li.product {
    width: calc((100% - 2 * var(--ka-archive-gap, 20px)) / 3) !important;
}
.woocommerce ul.products.columns-4 li.product {
    width: calc((100% - 3 * var(--ka-archive-gap, 20px)) / 4) !important;
}
.woocommerce ul.products.columns-5 li.product {
    width: calc((100% - 4 * var(--ka-archive-gap, 20px)) / 5) !important;
}
.woocommerce ul.products.columns-6 li.product {
    width: calc((100% - 5 * var(--ka-archive-gap, 20px)) / 6) !important;
}

/* KA Blocs specyficzne: */
.ka-creator-container .products.columns-5 li.product { width: 18.4% !important; }
.ka-creator-container .products.columns-6 li.product { width: 15% !important; }

.woocommerce ul.products li.product {
    margin: 0 !important;
    box-sizing: border-box;
    transition: box-shadow .2s;
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
}
.woocommerce ul.products li.product:hover {
    border-color: var(--ka-products-border-color-hover, var(--bs-primary, var(--wp--preset--color--primary, currentColor)));
    box-shadow: var(--ka-box-shadow-hover, var(--bs-box-shadow, 0 4px 12px rgba(0, 0, 0, 0.15)));
    transform: translateY(-2px);
}

/* Mobile: 1 kolumna - PEŁNA SZEROKOŚĆ EKRANU */
@media (max-width: 767px) {
    ul.products,
    .woocommerce ul.products,
    .woocommerce-content-wrapper ul.products,
    ul.products[style],
    .woocommerce ul.products[style],
    .woocommerce-content-wrapper ul.products[style] {
        display: block !important;
        gap: var(--ka-archive-gap, 10px) !important; /* Poprawka: respektuj ustawienie z panelu admin */
        max-width: 100% !important; /* Pełna szerokość na mobile */
        margin: 0 !important; /* Usuń margin auto na mobile */
        width: 100% !important;
    }
    ul.products li.product,
    .woocommerce ul.products li.product,
    .woocommerce-content-wrapper ul.products li.product,
    ul.products[style] li.product,
    .woocommerce ul.products[style] li.product,
    .woocommerce-content-wrapper ul.products[style] li.product {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
        float: none !important;
        margin: 0 0 var(--ka-archive-gap, 10px) 0 !important; /* Dodaję margines dolny na mobile */
    }
    
    /* NADPISANIE WSZYSTKICH KLAS KOLUMN NA MOBILE */
    .woocommerce ul.products.columns-1 li.product,
    .woocommerce ul.products.columns-2 li.product,
    .woocommerce ul.products.columns-3 li.product,
    .woocommerce ul.products.columns-4 li.product,
    .woocommerce ul.products.columns-5 li.product,
    .woocommerce ul.products.columns-6 li.product,
    ul.products.columns-1 li.product,
    ul.products.columns-2 li.product,
    ul.products.columns-3 li.product,
    ul.products.columns-4 li.product,
    ul.products.columns-5 li.product,
    ul.products.columns-6 li.product {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex: none !important;
        flex-basis: 100% !important;
    }
    
    /* DODATKOWE NADPISANIE DLA WSZYSTKICH MOŻLIWYCH KOMBINACJI KLAS */
    ul.products[class*="columns-"] li.product,
    .woocommerce ul.products[class*="columns-"] li.product,
    .woocommerce-content-wrapper ul.products[class*="columns-"] li.product,
    .ka-blocs-fix ul.products[class*="columns-"] li.product,
    .ka-blocs-fix.woocommerce ul.products[class*="columns-"] li.product,
    .ka-creator-container ul.products[class*="columns-"] li.product,
    .ka-creator-container .woocommerce ul.products[class*="columns-"] li.product {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex: none !important;
        flex-basis: 100% !important;
        float: none !important;
        margin: 0 0 var(--ka-archive-gap, 10px) 0 !important; /* Dodaję margines dolny */
    }
    
    /* Dodatkowe style dla lepszego wyglądu na mobile */
    .woocommerce ul.products li.product:last-child,
    ul.products li.product:last-child {
        margin-bottom: 0 !important; /* Ostatni produkt bez marginesu dolnego */
    }
    
    /* Poprawka dla kontenera na mobile */
    .woocommerce-content-wrapper ul.products {
        margin-bottom: 0 !important; /* Usuń dodatkowy margines na dole listy */
    }
}

/* ===================================================================
  * SORTOWANIE I PAGINACJA
  * =================================================================== */
 .ka-archive-sorting-wrapper,
 .ka-archive-pagination-wrapper {
     display: flex;
     width: 100%;
     margin-top: 1.5em;
     margin-bottom: 1.5em;
 }
 .ka-archive-sorting-wrapper .woocommerce-ordering,
 .ka-archive-pagination-wrapper .woocommerce-pagination {
     float: none;
     margin: 0;
 }
 .ka-archive-align--left   { justify-content: flex-start; }
 .ka-archive-align--center { justify-content: center; }
 .ka-archive-align--right  { justify-content: flex-end; }
 
 /* ===================================================================
  *  OGÓLNE I DODATKOWE
  * =================================================================== */
 .woocommerce-content-wrapper {
     border: none !important;
     border-radius: 0 !important;
     box-shadow: none !important;
     background: transparent !important;
     padding: 0 !important;
 }
 .woocommerce-notice, .ka-component-error {
     border: 1px solid #e1e5e9;
     border-radius: 8px;
     padding: 20px;
     margin: 20px 0;
     /* ✅ POPRAWKA: Użyj wartości z motywu */
    background: var(--bs-light, var(--wp--preset--color--background, #f8f9fa));
 }
 .ka-creator-container {
     /* Usunięto border, box-shadow, background, padding - wrapper jest neutralny */
 }
 .ka-creator-container.ka-container-no-border {
     border: none !important;
     box-shadow: none !important;
     background: transparent !important;
     padding: 0 !important;
 }
 
 /* ===================================================================
  *  WIDOK LISTY (LIST VIEW)
  * =================================================================== */
 .ka-view-mode--list ul.products {
     display: block;
 }
.ka-view-mode--list li.product {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2em;
    padding-bottom: 2em;
    /* ✅ POPRAWKA: Użyj wartości z motywu jako fallback */
    border-bottom: 1px solid var(--ka-list-separator-border, var(--bs-border-color, #eee));
}
 .ka-view-mode--list li.product a.woocommerce-LoopProduct-link img {
     width: 150px;
     height: 150px;
     object-fit: cover;
     margin-right: 1.5em;
     float: none;
 }
 .ka-view-mode--list li.product .woocommerce-loop-product__title {
     font-size: 1.5em;
     flex-grow: 1;
 }
 .ka-view-mode--list li.product .price {
     margin-top: 0.5em;
     display: block;
     font-size: 1.2em;
 }
 .ka-view-mode--list li.product .button {
     margin-left: 1.5em;
     white-space: nowrap;
 }
 .ka-view-mode--list li.product a.woocommerce-LoopProduct-link {
     display: flex;
     align-items: center;
     text-decoration: none;
     flex-grow: 1;
 }
 
/* ===================================================================
  *  WYRÓWNANIA I PRZYCISKI
  * =================================================================== */
ul.products li.product.ka-text-align--left   { text-align: left; }
ul.products li.product.ka-text-align--center { text-align: center; }
ul.products li.product.ka-text-align--right  { text-align: right; }
ul.products li.product.ka-image-align--center a.woocommerce-LoopProduct-link img { margin-left: auto; margin-right: auto; }
ul.products li.product.ka-image-align--left a.woocommerce-LoopProduct-link img   { margin-left: 0; margin-right: auto; }
ul.products li.product.ka-image-align--right a.woocommerce-LoopProduct-link img  { margin-left: auto; margin-right: 0; }

/* ===================================================================
  *  POZYCJA TEKSTU (analogicznie do Shop Categories)
  * =================================================================== */
/* WooCommerce struktura: li.product > a.woocommerce-LoopProduct-link */
/* ✅ POPRAWKA: Użyj bardziej specyficznych selektorów - klasa jest na wrapperze */
/* ✅ POPRAWKA: Link produktu musi mieć display: flex aby flex-direction działał */
.woocommerce-content-wrapper.ka-products-text--bottom ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce-content-wrapper.ka-products-text--top ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce-content-wrapper.ka-products-text--left ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce-content-wrapper.ka-products-text--right ul.products li.product a.woocommerce-LoopProduct-link {
    display: flex !important;
}

.woocommerce-content-wrapper.ka-products-text--bottom ul.products li.product a.woocommerce-LoopProduct-link {
    flex-direction: column !important;
}

.woocommerce-content-wrapper.ka-products-text--top ul.products li.product a.woocommerce-LoopProduct-link {
    flex-direction: column-reverse !important;
}

.woocommerce-content-wrapper.ka-products-text--left ul.products li.product a.woocommerce-LoopProduct-link {
    flex-direction: row-reverse !important;
}

.woocommerce-content-wrapper.ka-products-text--right ul.products li.product a.woocommerce-LoopProduct-link {
    flex-direction: row !important;
}

/* Odstęp między obrazkiem a treścią (analogicznie do Shop Categories) */
/* ✅ POPRAWKA: Usuń domyślny padding-bottom z linka (nadpisuje domyślny padding z CSS motywu) */
.woocommerce-content-wrapper ul.products li.product a.woocommerce-LoopProduct-link {
    padding-bottom: 0 !important;
}

/* ✅ POPRAWKA: Ustaw margin-bottom tylko dla pozycji bottom/top */
.woocommerce-content-wrapper.ka-products-text--bottom ul.products li.product a.woocommerce-LoopProduct-link img,
.woocommerce-content-wrapper.ka-products-text--top ul.products li.product a.woocommerce-LoopProduct-link img {
    margin-bottom: var(--ka-products-image-gap, var(--bs-gutter-x, var(--wp--preset--spacing--small, 0.5rem)));
}

/* Usuń margin-bottom dla pozycji left/right (odstęp kontrolowany przez padding) */
.woocommerce-content-wrapper.ka-products-text--left ul.products li.product a.woocommerce-LoopProduct-link img,
.woocommerce-content-wrapper.ka-products-text--right ul.products li.product a.woocommerce-LoopProduct-link img {
    margin-bottom: 0 !important;
}

/* ✅ POPRAWKA: Padding dla pozycji left/right (analogicznie do Shop Categories) */
/* WooCommerce struktura: a.woocommerce-LoopProduct-link zawiera img jako pierwszy element, potem tytuł, cena, przycisk */
.woocommerce-content-wrapper.ka-products-text--left ul.products li.product a.woocommerce-LoopProduct-link > *:not(img):first-child {
    padding-left: var(--ka-products-image-gap, var(--bs-gutter-x, var(--wp--preset--spacing--small, 0.5rem)));
}

.woocommerce-content-wrapper.ka-products-text--right ul.products li.product a.woocommerce-LoopProduct-link > *:not(img):first-child {
    padding-right: var(--ka-products-image-gap, var(--bs-gutter-x, var(--wp--preset--spacing--small, 0.5rem)));
}

/* Mobile: zawsze kolumna (analogicznie do Shop Categories) */
@media (max-width: 767px) {
    .woocommerce-content-wrapper.ka-products-text--left ul.products li.product a.woocommerce-LoopProduct-link,
    .woocommerce-content-wrapper.ka-products-text--right ul.products li.product a.woocommerce-LoopProduct-link {
        flex-direction: column !important;
    }
    
    .woocommerce-content-wrapper.ka-products-text--left ul.products li.product a.woocommerce-LoopProduct-link img,
    .woocommerce-content-wrapper.ka-products-text--right ul.products li.product a.woocommerce-LoopProduct-link img {
        margin-bottom: var(--ka-products-image-gap, var(--bs-gutter-x, var(--wp--preset--spacing--small, 0.5rem)));
    }
    
    .woocommerce-content-wrapper.ka-products-text--left ul.products li.product a.woocommerce-LoopProduct-link > *:not(img),
    .woocommerce-content-wrapper.ka-products-text--right ul.products li.product a.woocommerce-LoopProduct-link > *:not(img) {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
 .ka-image-align--center .woocommerce-loop-product__link img { float: none; margin: 0 auto; }
 .ka-image-align--right .woocommerce-loop-product__link img { float: none; margin: 0 0 0 auto; }
 .ka-button-align--left .add_to_cart_button { float: left; }
 .ka-button-align--center .add_to_cart_button { float: none; margin: 0 auto; display: table; }
 .ka-button-align--right .add_to_cart_button { float: right; }
 .ka-button-align--full .add_to_cart_button { display: block; width: 100%; text-align: center; }
 li.product .button { display: inline-block; }
 
 /* ===================================================================
  *  POPRAWKI DLA MOTYWU BLOCS.IO I WC
  * =================================================================== */
 .woocommerce ul.products li.product a.button.przycisk {
     /* ✅ POPRAWKA: Użyj wartości z motywu jako fallback */
     background-color: var(--swatch-var-5240, var(--bs-primary, var(--wp--preset--color--primary, #2271b1))) !important;
     color: var(--swatch-var-2835, var(--bs-white, #fff)) !important;
     border-color: var(--swatch-var-2835, var(--bs-primary, var(--wp--preset--color--primary, #2271b1))) !important;
     border-radius: 20px !important;
     border-width: 3px !important;
     text-transform: uppercase !important;
     /* ✅ POPRAWKA: Dziedziczenie z motywu */
    font-weight: inherit !important;
     transition: transform .3s ease-in-out !important;
 }
 .woocommerce ul.products li.product a.button.przycisk:hover {
     transform: scale(1.2) !important;
     background-color: var(--swatch-var-5240) !important;
     color: var(--swatch-var-2835) !important;
 }
 .woocommerce ul.products li.product a.button.add_to_cart_button[class*="btn"],
 .woocommerce ul.products li.product a.button.add_to_cart_button[class*="przycisk"] {
     background: inherit !important;
     color: inherit !important; 
     border: inherit !important;
     padding: inherit !important;
     border-radius: inherit !important;
     font-weight: inherit !important;
     line-height: inherit !important;
     text-shadow: none !important;
     box-shadow: none !important;
 }
 
 /* ===================================================================
  *  POPRAWKI: Ukrywanie ramek produktów (tylko dla produktów, nie kategorii)
  * =================================================================== */
 .ka-products-no-border ul.products li.product {
     border: none !important;
     box-shadow: none !important;
     background: transparent !important;
 }
 
 /* Poprawione ukrywanie ramki kontenera (większa specyficzność) */
 .ka-creator-container.ka-container-no-border,
 .ka-creator-container.container.ka-container-no-border {
     border: none !important;
     border-width: 0 !important;
     box-shadow: none !important;
     background: transparent !important;
     background: none !important;
     padding: 0 !important;
 }

/* --- Efekty i animacje dla produktów (analogicznie jak kategorie) --- */
/* ✅ POPRAWKA: Użyj wartości z motywu jako fallback */
.woocommerce-content-wrapper ul.products li.product {
    background: var(--ka-products-bg, var(--bs-body-bg, var(--wp--preset--color--background, #fff))) !important;
    border: 1px solid var(--ka-products-border-color, var(--bs-border-color, #dee2e6)) !important;
    border-radius: var(--ka-products-radius, var(--ka-product-radius, var(--bs-border-radius, 0.375rem))) !important;
    box-shadow: var(--ka-product-shadow, var(--bs-box-shadow-sm, 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075))) !important;
    transition: inherit !important;
}
.woocommerce-content-wrapper ul.products li.product:hover {
    background: var(--ka-products-bg-hover, var(--bs-body-bg, var(--wp--preset--color--background, #fff))) !important;
    border-color: var(--ka-products-border-color-hover, var(--bs-primary, var(--wp--preset--color--primary, currentColor))) !important;
    box-shadow: var(--ka-box-shadow-hover, var(--bs-box-shadow, 0 4px 12px rgba(0, 0, 0, 0.15))) !important;
}
.ka-products-no-hover ul.products li.product:hover {
    background: var(--ka-products-bg, var(--bs-body-bg, var(--wp--preset--color--background, #fff))) !important;
    border-color: var(--ka-products-border-color, var(--bs-border-color, #dee2e6)) !important;
    box-shadow: var(--ka-product-shadow, var(--bs-box-shadow-sm, 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075))) !important;
    transform: none !important;
}
.ka-products-with-animations ul.products li.product {
    transition: all 0.3s ease !important;
}
.ka-products-with-animations ul.products li.product:hover {
    transform: translateY(-2px) !important;
    border-color: var(--ka-products-border-color-hover, var(--bs-primary, var(--wp--preset--color--primary, currentColor))) !important;
    box-shadow: var(--ka-box-shadow-hover, var(--bs-box-shadow, 0 4px 12px rgba(0, 0, 0, 0.15))) !important;
}
.ka-products-no-border ul.products li.product {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}
.ka-product-display-wrapper.ka-products-no-border ul.products li.product {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}
.ka-product-display-wrapper.ka-products-no-border ul.products li.product img {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}
.ka-product-display-wrapper.ka-products-no-border ul.products li.product a.woocommerce-LoopProduct-link {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    outline: none !important;
}

/* --- DOMYŚLNE STYLE TYLKO DLA PRZYCISKU BEZ KLAS Z KREATORA --- */
/* ✅ POPRAWKA: Użyj wartości z motywu jako fallback */
.woocommerce ul.products li.product .button:not(.btn):not(.przycisk):not(.btn-d):not(.btn-lg):not(.btn-rd):not(.d-bloc) {
    background: var(--ka-button-bg, var(--bs-primary, var(--wp--preset--color--primary, #2271b1)));
    color: var(--ka-button-color, var(--bs-white, #fff));
    border-radius: var(--ka-button-radius, var(--bs-border-radius, 0.375rem));
    padding: 10px 18px;
    font-weight: inherit;
    margin-top: auto;
    transition: inherit;
    border: none;
    width: 100%;
}
.woocommerce ul.products li.product .button:not(.btn):not(.przycisk):not(.btn-d):not(.btn-lg):not(.btn-rd):not(.d-bloc):hover {
    background: var(--ka-button-bg-hover, var(--bs-primary-hover, var(--bs-dark, #1a5a8a)));
    color: var(--ka-button-color-hover, var(--bs-white, #fff));
}

/* --- POZWÓL NA PEŁNĄ KONTROLĘ KLASOM Z KREATORA --- */
/* Jeśli wpiszesz w kreatorze np. btn btn-d btn-lg przycisk, to style tych klas będą miały priorytet, jeśli są załadowane na stronie. */

/* ===================================================================
 * POPRAWKA: PRIORYTET KLAS Z KREATORA NAD KLASAMI WOOCOMMERCE
 * =================================================================== */

/* Wymuszenie priorytetu klas z kreatora nad klasami WooCommerce */
.woocommerce ul.products li.product a.button[class*="bloc-button"],
.woocommerce ul.products li.product a.button[class*="btn"],
.woocommerce ul.products li.product a.button[class*="przycisk"],
.woocommerce ul.products li.product button.button[class*="bloc-button"],
.woocommerce ul.products li.product button.button[class*="btn"],
.woocommerce ul.products li.product button.button[class*="przycisk"] {
    /* Resetowanie stylów WooCommerce */
    background: inherit !important;
    /* USUNIĘTO: color: inherit !important; - powodowało konflikt z przyciskami */
    border: inherit !important;
    padding: inherit !important;
    border-radius: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-shadow: none !important;
    box-shadow: none !important;
    text-transform: inherit !important;
    font-size: inherit !important;
    display: inherit !important;
    width: inherit !important;
    height: inherit !important;
    margin: inherit !important;
    float: inherit !important;
    position: inherit !important;
    transition: inherit !important;
}

/* Dodatkowe zabezpieczenie: wykluczenie przycisków z reguły color: inherit */
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product a.button[class*="bloc-button"],
.woocommerce ul.products li.product a.button[class*="btn"],
.woocommerce ul.products li.product a.button[class*="przycisk"],
.woocommerce ul.products li.product button.button,
.woocommerce ul.products li.product button.button[class*="bloc-button"],
.woocommerce ul.products li.product button.button[class*="btn"],
.woocommerce ul.products li.product button.button[class*="przycisk"] {
    /* Przyciski nie dziedziczą koloru - używają własnych stylów */
    color: initial !important;
}

/* Specjalne style dla klas Blocs */
.woocommerce ul.products li.product a.button.bloc-button,
.woocommerce ul.products li.product button.button.bloc-button {
    /* Style dla klasy bloc-button */
    background: var(--swatch-var-5240) !important;
    color: var(--swatch-var-2835) !important;
    border-color: var(--swatch-var-2835) !important;
    border-radius: 20px !important;
    border-width: 3px !important;
    text-transform: uppercase !important;
    /* ✅ POPRAWKA: Dziedziczenie z motywu */
    font-weight: inherit !important;
    transition: transform .3s ease-in-out !important;
}

.woocommerce ul.products li.product a.button.bloc-button:hover,
.woocommerce ul.products li.product button.button.bloc-button:hover {
    transform: scale(1.2) !important;
    background-color: var(--swatch-var-5240) !important;
    color: var(--swatch-var-2835) !important;
}

/* Style dla klas btn (Bootstrap-style) */
.woocommerce ul.products li.product a.button.btn,
.woocommerce ul.products li.product button.button.btn {
    display: inline-block !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    text-align: center !important;
    vertical-align: middle !important;
    cursor: pointer !important;
    user-select: none !important;
    border: 1px solid transparent !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 1rem !important;
    border-radius: 0.25rem !important;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

/* Style dla klas btn-d (dark button) */
/* ✅ POPRAWKA: Użyj wartości z motywu jako fallback */
.woocommerce ul.products li.product a.button.btn-d,
.woocommerce ul.products li.product button.button.btn-d {
    color: var(--ka-btn-d-color, var(--bs-white, #fff)) !important;
    background-color: var(--ka-btn-d-bg, var(--bs-dark, #212529)) !important;
    border-color: var(--ka-btn-d-border, var(--bs-dark, #212529)) !important;
}

.woocommerce ul.products li.product a.button.btn-d:hover,
.woocommerce ul.products li.product button.button.btn-d:hover {
    color: var(--ka-btn-d-color-hover, var(--bs-white, #fff)) !important;
    background-color: var(--ka-btn-d-bg-hover, var(--bs-gray-900, #1e2124)) !important;
    border-color: var(--ka-btn-d-border-hover, var(--bs-gray-950, #1a1e21)) !important;
}

/* Style dla klas btn-lg (large button) */
.woocommerce ul.products li.product a.button.btn-lg,
.woocommerce ul.products li.product button.button.btn-lg {
    padding: 0.5rem 1rem !important;
    font-size: 1.25rem !important;
    border-radius: 0.3rem !important;
}

/* Style dla klas btn-rd (rounded button) */
.woocommerce ul.products li.product a.button.btn-rd,
.woocommerce ul.products li.product button.button.btn-rd {
    border-radius: 50px !important;
}

/* Style dla klas float-lg-end */
.woocommerce ul.products li.product a.button.float-lg-end,
.woocommerce ul.products li.product button.button.float-lg-end {
    float: right !important;
}

/* Style dla klasy przycisk */
.woocommerce ul.products li.product a.button.przycisk,
.woocommerce ul.products li.product button.button.przycisk {
    /* Dodatkowe style dla klasy przycisk */
    font-weight: 600 !important;
    text-decoration: none !important;
}

/* ===================================================================
 * POPRAWKI SPECJALNE DLA MOTYWU BLOCS.IO
 * =================================================================== */

/* Resetowanie stylów Blocs.io dla produktów */
.ka-creator-container .woocommerce ul.products,
.ka-creator-container ul.products {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: var(--ka-archive-gap, 20px) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 1200px !important;
    /* Resetowanie stylów Blocs */
    float: none !important;
    clear: none !important;
    position: static !important;
}

/* Wymuszenie prawidłowej szerokości kolumn dla Blocs */
.ka-creator-container .woocommerce ul.products.columns-1 li.product,
.ka-creator-container ul.products.columns-1 li.product {
    width: 100% !important;
    flex: 0 0 100% !important;
}

.ka-creator-container .woocommerce ul.products.columns-2 li.product,
.ka-creator-container ul.products.columns-2 li.product {
    width: calc((100% - var(--ka-archive-gap, 20px)) / 2) !important;
    flex: 0 0 calc((100% - var(--ka-archive-gap, 20px)) / 2) !important;
}

.ka-creator-container .woocommerce ul.products.columns-3 li.product,
.ka-creator-container ul.products.columns-3 li.product {
    width: calc((100% - 2 * var(--ka-archive-gap, 20px)) / 3) !important;
    flex: 0 0 calc((100% - 2 * var(--ka-archive-gap, 20px)) / 3) !important;
}

.ka-creator-container .woocommerce ul.products.columns-4 li.product,
.ka-creator-container ul.products.columns-4 li.product {
    width: calc((100% - 3 * var(--ka-archive-gap, 20px)) / 4) !important;
    flex: 0 0 calc((100% - 3 * var(--ka-archive-gap, 20px)) / 4) !important;
}

.ka-creator-container .woocommerce ul.products.columns-5 li.product,
.ka-creator-container ul.products.columns-5 li.product {
    width: calc((100% - 4 * var(--ka-archive-gap, 20px)) / 5) !important;
    flex: 0 0 calc((100% - 4 * var(--ka-archive-gap, 20px)) / 5) !important;
}

.ka-creator-container .woocommerce ul.products.columns-6 li.product,
.ka-creator-container ul.products.columns-6 li.product {
    width: calc((100% - 5 * var(--ka-archive-gap, 20px)) / 6) !important;
    flex: 0 0 calc((100% - 5 * var(--ka-archive-gap, 20px)) / 6) !important;
}

/* Resetowanie produktów dla ka-blocs-fix */
.ka-blocs-fix.woocommerce ul.products li.product,
.ka-blocs-fix ul.products li.product {
    margin: 0 !important;
    box-sizing: border-box !important;
    transition: box-shadow .2s !important;
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
    /* Resetowanie stylów Blocs */
    float: none !important;
    clear: none !important;
    position: static !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Naprawienie problemu z pustymi kolumnami dla ka-blocs-fix */
.ka-blocs-fix.woocommerce ul.products li.product:empty,
.ka-blocs-fix ul.products li.product:empty {
    display: none !important;
}

/* Wymuszenie wyświetlania produktów dla ka-blocs-fix */
.ka-blocs-fix.woocommerce ul.products li.product:not(:empty),
.ka-blocs-fix ul.products li.product:not(:empty) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Responsywność dla ka-blocs-fix */
@media (max-width: 767px) {
    .ka-blocs-fix.woocommerce ul.products,
    .ka-blocs-fix ul.products {
        display: block !important;
        gap: var(--ka-archive-gap, 10px) !important; /* Poprawka: respektuj ustawienie z panelu admin */
        max-width: 100% !important; /* Pełna szerokość na mobile */
        margin: 0 !important; /* Usuń margin auto na mobile */
        width: 100% !important;
    }
    
    .ka-blocs-fix.woocommerce ul.products li.product,
    .ka-blocs-fix ul.products li.product {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
        float: none !important;
        margin: 0 0 var(--ka-archive-gap, 10px) 0 !important; /* Poprawka: dodaj margines dolny */
        flex: none !important;
    }
    
    /* Dodatkowe style dla lepszego wyglądu na mobile dla ka-blocs-fix */
    .ka-blocs-fix.woocommerce ul.products li.product:last-child,
    .ka-blocs-fix ul.products li.product:last-child {
        margin-bottom: 0 !important; /* Ostatni produkt bez marginesu dolnego */
    }
    
    /* Poprawka dla kontenera ka-blocs-fix na mobile */
    .ka-blocs-fix.woocommerce ul.products,
    .ka-blocs-fix ul.products {
        margin-bottom: 0 !important; /* Usuń dodatkowy margines na dole listy */
    }
}

/* ===================================================================
 * SPECJALNE POPRAWKI DLA BLOCS.IO - KLASA KA-BLOCS-FIX
 * =================================================================== */

/* Wymuszenie prawidłowego wyświetlania dla Blocs */
.ka-blocs-fix.woocommerce ul.products,
.ka-blocs-fix ul.products {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: var(--ka-archive-gap, 20px) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 1200px !important;
    /* Resetowanie stylów Blocs */
    float: none !important;
    clear: none !important;
    position: static !important;
    overflow: visible !important;
}

/* Wymuszenie prawidłowej szerokości dla ka-blocs-fix */
.ka-blocs-fix.woocommerce ul.products.columns-1 li.product,
.ka-blocs-fix ul.products.columns-1 li.product {
    width: 100% !important;
    flex: 0 0 100% !important;
    float: none !important;
    clear: none !important;
}

.ka-blocs-fix.woocommerce ul.products.columns-2 li.product,
.ka-blocs-fix ul.products.columns-2 li.product {
    width: calc((100% - var(--ka-archive-gap, 20px)) / 2) !important;
    flex: 0 0 calc((100% - var(--ka-archive-gap, 20px)) / 2) !important;
    float: none !important;
    clear: none !important;
}

.ka-blocs-fix.woocommerce ul.products.columns-3 li.product,
.ka-blocs-fix ul.products.columns-3 li.product {
    width: calc((100% - 2 * var(--ka-archive-gap, 20px)) / 3) !important;
    flex: 0 0 calc((100% - 2 * var(--ka-archive-gap, 20px)) / 3) !important;
    float: none !important;
    clear: none !important;
}

.ka-blocs-fix.woocommerce ul.products.columns-4 li.product,
.ka-blocs-fix ul.products.columns-4 li.product {
    width: calc((100% - 3 * var(--ka-archive-gap, 20px)) / 4) !important;
    flex: 0 0 calc((100% - 3 * var(--ka-archive-gap, 20px)) / 4) !important;
    float: none !important;
    clear: none !important;
}

.ka-blocs-fix.woocommerce ul.products.columns-5 li.product,
.ka-blocs-fix ul.products.columns-5 li.product {
    width: calc((100% - 4 * var(--ka-archive-gap, 20px)) / 5) !important;
    flex: 0 0 calc((100% - 4 * var(--ka-archive-gap, 20px)) / 5) !important;
    float: none !important;
    clear: none !important;
}

.ka-blocs-fix.woocommerce ul.products.columns-6 li.product,
.ka-blocs-fix ul.products.columns-6 li.product {
    width: calc((100% - 5 * var(--ka-archive-gap, 20px)) / 6) !important;
    flex: 0 0 calc((100% - 5 * var(--ka-archive-gap, 20px)) / 6) !important;
    float: none !important;
    clear: none !important;
}

/* Resetowanie produktów dla ka-blocs-fix */
.ka-blocs-fix.woocommerce ul.products li.product,
.ka-blocs-fix ul.products li.product {
    margin: 0 !important;
    box-sizing: border-box !important;
    transition: box-shadow .2s !important;
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
    /* Resetowanie stylów Blocs */
    float: none !important;
    clear: none !important;
    position: static !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Naprawienie problemu z pustymi kolumnami dla ka-blocs-fix */
.ka-blocs-fix.woocommerce ul.products li.product:empty,
.ka-blocs-fix ul.products li.product:empty {
    display: none !important;
}

/* Wymuszenie wyświetlania produktów dla ka-blocs-fix */
.ka-blocs-fix.woocommerce ul.products li.product:not(:empty),
.ka-blocs-fix ul.products li.product:not(:empty) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Responsywność dla ka-blocs-fix */
@media (max-width: 767px) {
    .ka-blocs-fix.woocommerce ul.products,
    .ka-blocs-fix ul.products {
        display: block !important;
        gap: 0 !important;
        max-width: 100% !important; /* Pełna szerokość na mobile */
        margin: 0 !important; /* Usuń margin auto na mobile */
        width: 100% !important;
    }
    
    .ka-blocs-fix.woocommerce ul.products li.product,
    .ka-blocs-fix ul.products li.product {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
        float: none !important;
        margin: 0 !important;
        flex: none !important;
    }
}

/* ===================================================================
 * SPECJALNE POPRAWKI DLA BLOCS.IO - KONTENER KA-CREATOR
 * =================================================================== */

/* Resetowanie stylów produktów dla Blocs */
.ka-creator-container .woocommerce ul.products li.product,
.ka-creator-container ul.products li.product {
    margin: 0 !important;
    box-sizing: border-box !important;
    transition: box-shadow .2s !important;
    width: auto !important;
    max-width: none !important;
    flex-basis: auto !important;
    /* Resetowanie stylów Blocs */
    float: none !important;
    clear: none !important;
    position: static !important;
    display: block !important;
}

/* Naprawienie problemu z pustymi kolumnami */
.ka-creator-container .woocommerce ul.products li.product:empty,
.ka-creator-container ul.products li.product:empty {
    display: none !important;
}

/* Wymuszenie wyświetlania produktów */
.ka-creator-container .woocommerce ul.products li.product:not(:empty),
.ka-creator-container ul.products li.product:not(:empty) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Resetowanie kontenera Blocs */
.ka-creator-container {
    /* Usunięcie stylów Blocs które mogą kolidować */
    overflow: visible !important;
    position: relative !important;
}

.ka-creator-container .woocommerce-content-wrapper {
    /* Resetowanie wrappera */
    overflow: visible !important;
    position: relative !important;
    float: none !important;
    clear: none !important;
}

/* Naprawienie problemu z flexbox w Blocs */
.ka-creator-container .woocommerce ul.products,
.ka-creator-container ul.products {
    /* Wymuszenie flexbox */
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
}

/* Responsywność dla Blocs */
@media (max-width: 767px) {
    .ka-creator-container .woocommerce ul.products,
    .ka-creator-container ul.products {
        display: block !important;
        gap: 0 !important;
        max-width: 100% !important; /* Pełna szerokość na mobile */
        margin: 0 !important; /* Usuń margin auto na mobile */
        width: 100% !important;
    }
    
    .ka-creator-container .woocommerce ul.products li.product,
    .ka-creator-container ul.products li.product {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
        float: none !important;
        margin: 0 !important;
        flex: none !important;
    }
    
    /* NADPISANIE WSZYSTKICH KLAS KOLUMN NA MOBILE DLA KA-CREATOR-CONTAINER */
    .ka-creator-container .woocommerce ul.products.columns-1 li.product,
    .ka-creator-container .woocommerce ul.products.columns-2 li.product,
    .ka-creator-container .woocommerce ul.products.columns-3 li.product,
    .ka-creator-container .woocommerce ul.products.columns-4 li.product,
    .ka-creator-container .woocommerce ul.products.columns-5 li.product,
    .ka-creator-container .woocommerce ul.products.columns-6 li.product,
    .ka-creator-container ul.products.columns-1 li.product,
    .ka-creator-container ul.products.columns-2 li.product,
    .ka-creator-container ul.products.columns-3 li.product,
    .ka-creator-container ul.products.columns-4 li.product,
    .ka-creator-container ul.products.columns-5 li.product,
    .ka-creator-container ul.products.columns-6 li.product {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex: none !important;
        flex-basis: 100% !important;
    }
}

/* Dodatkowe zabezpieczenia dla Blocs */
.ka-creator-container * {
    box-sizing: border-box !important;
}

/* Naprawienie problemu z clearfix w Blocs */
.ka-creator-container .woocommerce ul.products::after,
.ka-creator-container ul.products::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

/* Wymuszenie prawidłowego wyświetlania obrazków w Blocs */
.ka-creator-container .woocommerce ul.products li.product img,
.ka-creator-container ul.products li.product img {
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
}

/* Naprawienie problemu z linkami w Blocs */
.ka-creator-container .woocommerce ul.products li.product a,
.ka-creator-container ul.products li.product a {
    text-decoration: none !important;
    /* color: inherit !important; */
}

/* Wymuszenie wyświetlania cen w Blocs */
.ka-creator-container .woocommerce ul.products li.product .price,
.ka-creator-container ul.products li.product .price {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Naprawienie problemu z przyciskami w Blocs */
.ka-creator-container .woocommerce ul.products li.product .button,
.ka-creator-container ul.products li.product .button {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}
