/* BG Szukajka - wyszukiwarka i filtry
   Kolory z serwisu: navy #0e1c2b, blekit #29ABE2. Font Lato (globalny w Elementorze). */

.ms-sz,
.ms-filtry{font-family:"Lato",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}

/* ---------- pole wyszukiwania ---------- */
.ms-sz{position:relative}
.ms-sz__form{display:flex;align-items:stretch;gap:0;
    border:1px solid #d6dde4;border-radius:6px;overflow:hidden;background:#fff}
.ms-sz__form:focus-within{border-color:#29ABE2;box-shadow:0 0 0 3px rgba(41,171,226,.14)}
.ms-sz__kategoria{border:0;border-right:1px solid #e4e9ee;background:#f7f9fb;
    padding:0 10px;font-size:14px;color:#4a5a6a;max-width:170px}
.ms-sz__pole{flex:1;border:0;padding:11px 14px;font-size:15px;min-width:0;outline:0;background:transparent}
.ms-sz__przycisk{border:0;background:#29ABE2;width:46px;cursor:pointer;display:flex;
    align-items:center;justify-content:center;transition:background .15s}
.ms-sz__przycisk:hover{background:#1b93c7}
.ms-sz__lupa{display:block;width:15px;height:15px;border:2px solid #fff;border-radius:50%;position:relative}
.ms-sz__lupa::after{content:"";position:absolute;right:-6px;bottom:-5px;width:7px;height:2px;
    background:#fff;transform:rotate(45deg)}

/* ---------- podpowiedzi ---------- */
.ms-sz__wyniki{position:absolute;z-index:9999;left:0;right:0;top:calc(100% + 6px);
    background:#fff;border:1px solid #e1e7ec;border-radius:8px;
    box-shadow:0 12px 32px rgba(14,28,43,.14);overflow:hidden}
.ms-sz__lista{margin:0;padding:0;list-style:none;max-height:420px;overflow-y:auto}
.ms-sz__pozycja a{display:flex;gap:12px;align-items:center;padding:10px 14px;
    text-decoration:none;color:#0e1c2b;border-bottom:1px solid #f1f4f7}
.ms-sz__pozycja:last-child a{border-bottom:0}
.ms-sz__pozycja a:hover,.ms-sz__pozycja.jest-aktywna a{background:#f4fafd}
.ms-sz__pozycja img{width:48px;height:48px;object-fit:contain;flex:0 0 48px;background:#fff}
.ms-sz__opis{display:flex;flex-direction:column;gap:2px;min-width:0}
.ms-sz__tytul{font-weight:600;font-size:14px;line-height:1.3}
.ms-sz__kat{font-size:12px;color:#9aa7b4}
.ms-sz__cena{font-size:13px;color:#29ABE2;font-weight:700}
.ms-sz__brak{color:#b32d2e;font-style:normal;font-weight:400;font-size:12px}
.ms-sz__pusto{padding:16px;color:#7d8a97;font-size:14px;text-align:center}
.ms-sz__wiecej{display:block;padding:12px;text-align:center;background:#f7f9fb;
    color:#0e1c2b;font-weight:700;font-size:13px;text-decoration:none;
    text-transform:uppercase;letter-spacing:.04em}
.ms-sz__wiecej:hover{background:#eef4f8;color:#29ABE2}

/* ---------- panel filtrow ---------- */
.ms-filtry__przelacznik{display:none;width:100%;padding:12px 16px;margin-bottom:12px;
    border:1px solid #d6dde4;border-radius:6px;background:#fff;
    font-weight:700;cursor:pointer;text-align:left}
.ms-filtry__sekcja{padding:18px 0;border-bottom:1px solid #e8ecf0}
.ms-filtry__sekcja:last-of-type{border-bottom:0}
.ms-filtry__naglowek{margin:0 0 10px;font-size:13px;font-weight:700;letter-spacing:.05em;
    text-transform:uppercase;color:#0e1c2b}

.ms-filtry__lista{margin:0;padding:0;list-style:none}
.ms-filtry__lista--dzieci{display:none;margin:4px 0 8px}
/* motyw zeruje padding list z wyzsza specyficznoscia, stad wymuszenie */
.ms-filtry ul.ms-filtry__lista--dzieci{padding-left:18px !important}
.ms-filtry__pozycja.jest-rozwinieta > .ms-filtry__lista--dzieci{display:block}
.ms-filtry__pozycja{display:flex;flex-wrap:wrap;align-items:center;margin:0 0 7px;line-height:1.4}
.ms-filtry__pozycja > a{flex:1 1 auto;color:#4a5a6a;text-decoration:none;transition:color .15s;
    display:inline-flex;align-items:center;gap:6px}
.ms-filtry__pozycja > .ms-filtry__lista--dzieci{flex:1 1 100%}
.ms-filtry__pozycja a:hover{color:#29ABE2}
.ms-filtry__pozycja.jest-aktywna > a{color:#0e1c2b;font-weight:700}
.ms-filtry__licznik{color:#9aa7b4;font-size:12px}

/* strzalka rozwijajaca podkategorie - rysowana krawedziami, bez fontu ikon */
.ms-filtry__strzalka{flex:0 0 22px;position:relative;width:22px;height:22px;
    padding:0;margin:0;border:0;border-radius:0;box-shadow:none;cursor:pointer;
    background:transparent !important;-webkit-appearance:none;appearance:none;
    min-width:0;min-height:0;line-height:1}
.ms-filtry__strzalka:hover,.ms-filtry__strzalka:focus{background:transparent !important;outline:0}
.ms-filtry__strzalka::before{content:"";position:absolute;left:7px;top:6px;
    width:6px;height:6px;border-right:2px solid #7d8a97;border-bottom:2px solid #7d8a97;
    transform:rotate(45deg);transition:transform .18s ease,border-color .15s}
.ms-filtry__strzalka[aria-expanded="true"]::before{transform:rotate(-135deg);top:9px}
.ms-filtry__strzalka:hover::before{border-color:#29ABE2}

/* ptaszek przy atrybutach */
.ms-filtry__ptaszek{width:16px;height:16px;flex:0 0 16px;border:1px solid #c7d0d8;
    border-radius:3px;background:#fff;position:relative;transition:all .15s}
.ms-filtry__pozycja.jest-aktywna .ms-filtry__ptaszek{background:#29ABE2;border-color:#29ABE2}
.ms-filtry__pozycja.jest-aktywna .ms-filtry__ptaszek::after{content:"";position:absolute;
    left:5px;top:1px;width:4px;height:9px;border-right:2px solid #fff;border-bottom:2px solid #fff;
    transform:rotate(45deg)}

/* cena */
.ms-filtry__cena{display:flex;align-items:center;gap:6px}
.ms-filtry__cena input{width:72px;padding:7px 8px;border:1px solid #d6dde4;border-radius:4px;
    font-size:14px}
.ms-filtry__myslnik{color:#9aa7b4}
.ms-filtry__ok{padding:7px 12px;border:0;border-radius:4px;background:#0e1c2b;color:#fff;
    font-size:13px;font-weight:700;cursor:pointer}
.ms-filtry__ok:hover{background:#29ABE2}

.ms-filtry__reset{padding-top:16px}
.ms-filtry__reset a{color:#b32d2e;font-size:13px;text-decoration:none}
.ms-filtry__reset a:hover{text-decoration:underline}

@media (min-width:1025px){
    .ms-filtry{position:sticky;top:120px;max-height:calc(100vh - 140px);overflow-y:auto;
        padding-right:6px}
}
@media (max-width:1024px){
    .ms-filtry__przelacznik{display:block}
    .ms-filtry__tresc{display:none}
    .ms-filtry__tresc.jest-otwarty{display:block}
}

/* motyw OceanWP podkresla linki i koloruje ceny - nadpisujemy w obrebie podpowiedzi */
.ms-sz__pozycja a,.ms-sz__pozycja a:hover,.ms-sz__pozycja a *{text-decoration:none !important}
.ms-sz__cena,.ms-sz__cena *,.ms-sz__cena .amount,.ms-sz__cena bdi{color:#29ABE2 !important}
.ms-sz__brak,.ms-sz__brak *{color:#b32d2e !important}
.ms-sz__tytul{color:#0e1c2b}
.ms-filtry__pozycja a,.ms-filtry__pozycja a *{text-decoration:none !important}


/* ---------- pasek darmowej dostawy ---------- */
.ms-dostawa{margin:0 0 20px;padding:14px 16px;border:1px solid #e1e7ec;border-radius:8px;background:#f7fbfd}
.ms-dostawa__tekst{margin:0 0 8px;font-size:14px;font-weight:600;color:#0e1c2b}
.ms-dostawa__tor{height:8px;border-radius:4px;background:#e4ecf2;overflow:hidden}
.ms-dostawa__wypelnienie{display:block;height:100%;background:#29ABE2;transition:width .3s ease}
.ms-dostawa--osiagnieta{border-color:#bfe3c8;background:#f3faf5}
.ms-dostawa--osiagnieta .ms-dostawa__wypelnienie{background:#1a8a3f}
.ms-dostawa--osiagnieta .ms-dostawa__tekst{color:#1a8a3f}

/* ---------- elementy zaufania ---------- */
.ms-zaufanie{display:flex;flex-wrap:wrap;gap:8px 18px;margin:16px 0 0;padding:0;list-style:none}
.ms-zaufanie__punkt{position:relative;padding-left:20px;font-size:13px;color:#4a5a6a}
.ms-zaufanie__punkt::before{content:"";position:absolute;left:2px;top:4px;width:5px;height:9px;
    border-right:2px solid #1a8a3f;border-bottom:2px solid #1a8a3f;transform:rotate(45deg)}

/* ---------- przyklejony przycisk na telefonie ---------- */
.ms-pasek{display:none}
@media (max-width:767px){
    .ms-pasek{position:fixed;left:0;right:0;bottom:0;z-index:9998;display:flex;align-items:center;
        justify-content:space-between;gap:12px;padding:10px 14px;background:#fff;
        border-top:1px solid #e1e7ec;box-shadow:0 -6px 18px rgba(14,28,43,.10)}
    .ms-pasek[hidden]{display:none}
    .ms-pasek__cena{font-weight:700;color:#0e1c2b;font-size:16px}
    .ms-pasek__cena .amount,.ms-pasek__cena bdi{color:#0e1c2b}
    .ms-pasek__przycisk{flex:0 0 auto;padding:12px 22px;border-radius:5px;background:#29ABE2;
        color:#fff;font-weight:700;text-decoration:none;font-size:14px}
    .ms-pasek__brak{color:#b32d2e;font-weight:700;font-size:14px}
}

/* ==========================================================================
   MS - archiwa sklepu: rowna ramka zdjecia i plakietki jedna pod druga
   Wersja 3 z 2026-10-14. Dotyczy /sklep/ i wszystkich kategorii.
   UWAGA 1: lista produktow idzie przez Elementora i NIE MA nad soba klasy
   .woocommerce - selektory musza zaczynac sie od ul.products.
   UWAGA 2: OceanWP trzyma DRUGIE zdjecie (pokazywane przy
   najechaniu) wewnatrz .woo-entry-image jako element pozycjonowany bezwzglednie.
   Nie wolno robic z .woo-entry-image kontenera flex ani dawac drugiemu zdjeciu
   wysokosci - wypada wtedy z warstwy i rysuje sie POD pierwszym, czyli kazdy
   produkt ma dwa zdjecia pod soba.
   ========================================================================== */

/* --- 1. Kwadratowa ramka na zdjecie, produkt widoczny w calosci --- */
ul.products li.product .woo-entry-image {
    position: relative !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden;
    background: #fff;
}

/* tylko glowne zdjecie - drugiego nie dotykamy */
ul.products li.product .woo-entry-image-main {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    object-position: center;
    padding: 10px;
    box-sizing: border-box;
}

/* drugie zdjecie zostaje tam, gdzie je polozyl motyw, tylko dopasowujemy kadr */
ul.products li.product .woo-entry-image-secondary {
    object-fit: contain !important;
    padding: 10px;
    box-sizing: border-box;
}

/* --- 2. Wyrownanie tytulow i cen bez ruszania ukladu motywu --- */
ul.products li.product li.category {
    min-height: 2.4em;
}

ul.products li.product li.title {
    min-height: 2.8em;
}

/* --- 3a. Kotwica pozycjonowania: OBIE plakietki sa dziecmi li.image-wrap,
       a ten element nie mial position:relative, wiec top/left liczyly sie
       wzgledem dalszego przodka i plakietki ladowaly NAD zdjeciem, jedna na drugiej. --- */
ul.products li.product li.image-wrap {
    position: relative !important;
}

/* --- 3. Plakietki jedna pod druga, zero nachodzenia --- */
ul.products li.product .onsale,
ul.products li.product span.onsale {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0;
    transform: none !important;
    z-index: 12;
}

ul.products li.product .outofstock-badge {
    position: absolute !important;
    top: 48px !important;
    left: 10px !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0;
    transform: none !important;
    z-index: 11;
}

/* produkt bez przeceny - etykieta braku wraca na gore */
ul.products li.product:not(.sale) .outofstock-badge {
    top: 10px !important;
}

@media (max-width: 767px) {
    ul.products li.product .woo-entry-image-main,
    ul.products li.product .woo-entry-image-secondary {
        padding: 6px;
    }
    ul.products li.product .outofstock-badge {
        top: 42px !important;
    }
}


/* ===== Modul: czesci i akcesoria ===== */

.ms-cz {
    --ms-cz-akcent: #00aeef;
    --ms-cz-ciemny: #2a2e33;
    --ms-cz-jasne: #f4f6f8;
    --ms-cz-ramka: #e2e7ec;
    --ms-cz-szary: #5b6670;
    color: var(--ms-cz-ciemny);
}

.ms-cz__etykieta {
    margin: 0 0 10px;
    color: var(--ms-cz-akcent);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.ms-cz__naglowek {
    margin: 0 0 6px;
    line-height: 1.2;
}

.ms-cz__wstep {
    margin: 0 0 26px;
    color: var(--ms-cz-szary);
    font-size: 15px;
}

/* zakladki */

.ms-cz__zakladki {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 26px;
    border-bottom: 2px solid #e6eaee;
}

.ms-cz__zakladka {
    margin: 0 0 -2px;
    padding: 12px 26px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: none;
    color: var(--ms-cz-szary);
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.ms-cz__zakladka:hover,
.ms-cz__zakladka:focus-visible {
    color: var(--ms-cz-ciemny);
}

.ms-cz__zakladka.jest-wybrana {
    color: var(--ms-cz-akcent);
    border-bottom-color: var(--ms-cz-akcent);
}

.ms-cz__panel {
    display: none;
}

.ms-cz__panel.jest-widoczny {
    display: block;
}

/* kafelki */

.ms-cz__siatka {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ms-cz__siatka--mala {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 16px;
}

.ms-cz__pole {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ms-cz__kafel {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 18px;
    border: 1px solid var(--ms-cz-ramka);
    border-radius: 4px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.ms-cz__kafel:hover,
.ms-cz__kafel:focus-visible {
    border-color: var(--ms-cz-akcent);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .07);
    color: inherit;
    text-decoration: none;
}

.ms-cz__foto {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px;
    margin-bottom: 12px;
}

.ms-cz__foto img {
    max-width: 100%;
    max-height: 120px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.ms-cz__siatka--mala .ms-cz__foto {
    height: 92px;
    margin-bottom: 10px;
}

.ms-cz__siatka--mala .ms-cz__foto img {
    max-height: 92px;
}

/* kategoria bez obrazka - lepiej pokazac spokojne tlo niz pusta dziure */
.ms-cz__brak {
    width: 100%;
    height: 100%;
    border: 1px dashed #c4ccd4;
    border-radius: 3px;
    background: var(--ms-cz-jasne);
}

.ms-cz__model {
    margin-bottom: 4px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.ms-cz__model--maly {
    font-size: 13px;
    font-weight: 600;
}

.ms-cz__ile {
    margin-bottom: 10px;
    color: var(--ms-cz-szary);
    font-size: 13px;
}

.ms-cz__ile strong {
    color: var(--ms-cz-ciemny);
    font-size: 15px;
}

.ms-cz__cena {
    color: var(--ms-cz-akcent);
    font-size: 16px;
    font-weight: 800;
}

.ms-cz__strzalka {
    margin-top: auto;
    color: var(--ms-cz-akcent);
    font-size: 13px;
    font-weight: 700;
}

.ms-cz__kafel--wiecej {
    border-style: dashed;
    background: var(--ms-cz-jasne);
}

.ms-cz__plus {
    color: var(--ms-cz-akcent);
    font-size: 46px;
    font-weight: 300;
    line-height: 1;
}

.ms-cz__pomoc {
    margin: 20px 0 0;
    padding: 14px 18px;
    border-left: 3px solid var(--ms-cz-akcent);
    background: var(--ms-cz-jasne);
    color: #42505c;
    font-size: 14px;
}

.ms-cz__pomoc a {
    color: var(--ms-cz-akcent);
    font-weight: 600;
    text-decoration: none;
}

/* widocznosc fokusu - motyw potrafi ja zdjac z calej strony */
.ms-cz a:focus-visible,
.ms-cz button:focus-visible {
    outline: 2px solid var(--ms-cz-akcent);
    outline-offset: 2px;
}

@media (max-width: 1024px) {
    .ms-cz__siatka {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ms-cz__siatka--mala {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .ms-cz__siatka,
    .ms-cz__siatka--mala {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .ms-cz__kafel {
        padding: 14px;
    }

    .ms-cz__foto,
    .ms-cz__siatka--mala .ms-cz__foto {
        height: 92px;
    }

    .ms-cz__foto img,
    .ms-cz__siatka--mala .ms-cz__foto img {
        max-height: 92px;
    }

    .ms-cz__zakladka {
        padding: 10px 16px;
        font-size: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ms-cz__kafel {
        transition: none;
    }
}

/* dwa osobne wejscia w jednym kafelku: czesci i akcesoria */

.ms-cz__kafel--dzielony {
    cursor: default;
}

.ms-cz__kafel--dzielony:hover {
    border-color: var(--ms-cz-ramka);
    box-shadow: none;
}

.ms-cz__wejscia {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: auto;
    padding-top: 10px;
}

.ms-cz__wejscie {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid var(--ms-cz-ramka);
    border-radius: 3px;
    background: #fff;
    color: var(--ms-cz-ciemny);
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    transition: border-color .15s ease, background-color .15s ease;
}

.ms-cz__wejscie:hover,
.ms-cz__wejscie:focus-visible {
    border-color: var(--ms-cz-akcent);
    background: var(--ms-cz-jasne);
    color: var(--ms-cz-ciemny);
    text-decoration: none;
}

.ms-cz__rodzaj {
    flex: 1 1 auto;
}

.ms-cz__liczba {
    flex: 0 0 auto;
    min-width: 26px;
    padding: 1px 7px;
    border-radius: 999px;
    background: var(--ms-cz-jasne);
    color: var(--ms-cz-szary);
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.ms-cz__strzalka-mala {
    flex: 0 0 auto;
    color: var(--ms-cz-akcent);
    font-weight: 700;
}

.ms-cz__wejscie--puste {
    border-style: dashed;
    color: #9aa5ae;
}

.ms-cz__wejscie--puste .ms-cz__liczba {
    background: transparent;
    font-weight: 600;
}

/* tekst tylko dla czytnikow ekranu - motyw nie zawsze ma wlasna klase */
.ms-cz .screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

@media (prefers-reduced-motion: reduce) {
    .ms-cz__wejscie {
        transition: none;
    }
}



/* ==========================================================================
   MS - karta produktu: cena i elementy zaufania
   Wersja 2 z 2026-11-10. Cene rysuje widget Elementora, nie szablon
   WooCommerce - stad selektor po klasie widgetu.
   ========================================================================== */

.single-product .elementor-widget-woocommerce-product-price .price,
.single-product .elementor-widget-woocommerce-product-price .price .amount,
.single-product .elementor-widget-woocommerce-product-price .price bdi,
.single-product .elementor-widget-woocommerce-product-price .price ins,
.single-product .elementor-widget-woocommerce-product-price .price ins .amount,
.single-product .elementor-widget-woocommerce-product-price .price ins bdi {
    color: #2a2e33;
    font-size: 24px;
    font-weight: 700;
    text-decoration: none;
}

.single-product .elementor-widget-woocommerce-product-price .price {
    margin-bottom: 14px;
    line-height: 1.2;
}

/* cena przed obnizka: szara i mniejsza, zeby roznica byla widoczna */
.single-product .elementor-widget-woocommerce-product-price .price del,
.single-product .elementor-widget-woocommerce-product-price .price del .amount,
.single-product .elementor-widget-woocommerce-product-price .price del bdi {
    color: #8a949d;
    font-size: 17px;
    font-weight: 400;
}

.single-product .elementor-widget-woocommerce-product-price .price .woocommerce-Price-currencySymbol {
    font-size: .8em;
    font-weight: 600;
}

/* ---------- elementy zaufania: ikona w kolku, trzy rowne kolumny ---------- */

.ms-zaufanie {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.ms-zaufanie__punkt {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 0;
    font-size: 13px;
    line-height: 1.3;
    color: #4a5a6a;
}

/* zielony ptaszek z pierwszej wersji */
.ms-zaufanie__punkt::before {
    content: none !important;
}

.ms-zaufanie__kolko {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #e8f7fe;
    color: #00aeef;
}

.ms-zaufanie__ikona {
    width: 18px;
    height: 18px;
}

@media (max-width: 600px) {
    .ms-zaufanie {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

@media (max-width: 767px) {
    .single-product .elementor-widget-woocommerce-product-price .price,
    .single-product .elementor-widget-woocommerce-product-price .price .amount,
    .single-product .elementor-widget-woocommerce-product-price .price bdi {
        font-size: 21px;
    }
}

/* ---------- jeden przyklejony pasek na raz ----------
   OceanWP ma wlasny pasek u gory (owp-floating-bar), my swoj na dole
   (ms-pasek). Na telefonie zostaje nasz, na komputerze motywu - inaczej
   na malym ekranie wychodza dwa paski naraz, gora i dol. */

@media (max-width: 767px) {
    .owp-floating-bar {
        display: none !important;
    }
}

/* ---------- lupa w szukajce ----------
   Motyw nadpisuje nasz przycisk wlasnym stylem dla button[type=submit]:
   wychodzi display:block i padding 14/20, przez co lupa siedzi za bardzo
   w prawo. Stad wyzsza specyficznosc i zerowanie paddingu. */

.ms-sz .ms-sz__form button.ms-sz__przycisk,
button.ms-sz__przycisk[type="submit"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 0 !important;
    border-radius: 0;
}

/* raczka lupy wystaje w prawo i w dol, wiec samo kolko przesuwamy
   o te roznice - inaczej ikona jest optycznie za nisko i za bardzo w prawo */
.ms-sz .ms-sz__form .ms-sz__lupa,
button.ms-sz__przycisk .ms-sz__lupa {
    transform: translate(-2px, -2px);
}

/* ---------- karta produktu: rowny rytm kolumny i galerii ----------
   Punkty zaufania maja rozna dlugosc tekstu. Przy wyrownaniu do lewej
   odstepy miedzy nimi wygladaja na nierowne, dlatego kazdy srodkuje sie
   we wlasnej kolumnie. */

.ms-zaufanie__punkt {
    justify-content: center;
    text-align: left;
}

.ms-zaufanie {
    align-items: center;
}

/* zdjecie glowne bywa wyzsze niz cala kolumna z opisem - wtedy po prawej
   zostaje pusta plansza. Ograniczamy wysokosc i srodkujemy. */
.single-product .woocommerce-product-gallery__image img,
.single-product .elementor-widget-woocommerce-product-images .woocommerce-product-gallery__image img {
    max-height: 520px;
    width: auto;
    margin: 0 auto;
    object-fit: contain;
}

.single-product .woocommerce-product-gallery__image {
    text-align: center;
}

/* miniatury galerii rowno, cztery w rzedzie */
.single-product .flex-control-thumbs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
    padding: 0;
    list-style: none;
}

.single-product .flex-control-thumbs li {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

.single-product .flex-control-thumbs img {
    width: 100%;
    height: auto;
    border: 1px solid #e2e7ec;
    border-radius: 4px;
    opacity: 1;
}

@media (max-width: 600px) {
    .ms-zaufanie__punkt {
        justify-content: flex-start;
    }
}

/* ---------- odstep nad punktami zaufania ----------
   Motyw zeruje marginesy list w kolumnie produktu, wiec nasz margines
   z wczesniejszej reguly nie dochodzil do skutku. */

.single-product .ms-zaufanie,
.elementor-add-to-cart .ms-zaufanie {
    margin-top: 22px !important;
    margin-bottom: 0 !important;
    padding-top: 18px;
    border-top: 1px solid #e8edf2;
}

/* ---------- podobne produkty ----------
   Nad nazwa produktu wyswietlala sie cala sciezka kategorii, po trzy
   wiersze kursywa. Zabiera uwage, a nic nie wnosi - przy podobnych
   produktach kategoria jest ta sama co ogladany produkt. */

.related .product .category,
.related .product .woo-product-category,
.upsells .product .category {
    display: none !important;
}

/* karty rownej wysokosci, przycisk zawsze na dole */
.related ul.woo-entry-inner,
.upsells ul.woo-entry-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
    padding: 0;
}

.related ul.woo-entry-inner > li.title,
.upsells ul.woo-entry-inner > li.title {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    min-height: 44px;
    margin-bottom: 6px;
}

.related ul.woo-entry-inner > li.price,
.upsells ul.woo-entry-inner > li.price {
    margin-bottom: 12px;
}

.related ul.woo-entry-inner > li.woo-entry-buttons,
.related ul.woo-entry-inner > li.btn-wrap,
.upsells ul.woo-entry-inner > li.woo-entry-buttons,
.upsells ul.woo-entry-inner > li.btn-wrap {
    margin-top: auto;
}

/* zdjecia produktow w rownej ramce - inaczej karty skacza na roznej wysokosci */
.related .woo-entry-image,
.upsells .woo-entry-image {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 230px;
    margin-bottom: 14px;
    overflow: hidden;
}

.related .woo-entry-image img,
.upsells .woo-entry-image img {
    max-height: 230px;
    width: auto;
    object-fit: contain;
}

@media (max-width: 767px) {
    .related .woo-entry-image,
    .upsells .woo-entry-image {
        height: 170px;
    }

    .related .woo-entry-image img,
    .upsells .woo-entry-image img {
        max-height: 170px;
    }
}