/* =========================================
   GLOBAL RESET & VARIABLES
   ========================================= */
.ModulRwdUkryj { display: block !important; }

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&display=swap');

:root {
  /* ===== BRAND COLORS (Nasycone i żywe z LOGO) ===== */
  --kolor-szablonu: #3A82C4;         
  --kolor-szablonu-2: #2B669D;       

  /* ===== ACCENT / CTA COLOR (Vibrant Pink) ===== */
  --kolor-akcent: #FF5A82;           
  --kolor-czerwony: #FF5A82;         

  /* ===== TEXT / NEUTRALS ===== */
  --kolor-glowny-czcionki: #1E293B;  
  --kolor-bialy: #ffffff;
  --kolor-czarny: #0F172A;

  --tlo-szare: #F4F7FB;              
  --kolor-szary: #E2E8F0;
  --kolor-szary-jasny: #F1F5F9;
  --kolor-szary-jasny-2: #E2E8F0;
  --kolor-szary-ciemny: #64748B;
  --kolor-szary-ciemny-2: #475569;
  --kolor-szary-ciemny-3: #334155;
  --kolor-szary-ciemny-4: #334155;
  --kolor-szary-ciemny-5: #1F2937;
  --kolor-linia: #E2E8F0;

  /* ===== MODULES / BOXES ===== */
  --kolor-tlo-naglowek-modul: #21334D;
  --kolor-czcionka-naglowek-modul: #000;
  --kolor-tlo-modul: #ffffff;

  --kolor-tlo-naglowek-box: #F1F5F9;
  --kolor-czcionka-naglowek-box: #334155;
  --kolor-tlo-box: #ffffff;

  --kolor-tlo-naglowek-box-kategorie: #2F4668;
  --kolor-czcionka-naglowek-box-kategorie: #ffffff;
  --kolor-tlo-box-kategorie: #21334D;
  --kolor-box-kategorie-najechanie-kursorem: #16243A;
  --kolor-czcionka-kategori-aktywna: #ffffff;

  /* ===== HEADER STRIP ===== */
  --kolor-paska-naglowka: #FFFFFF;

  /* ===== FORMS & OTHER ===== */
  --kolor-tlo-pola: #ffffff;
  --kolor-ramka-pola: #B8C6DA;
  --kolor-ramka-pola-hover: #91A6C6;
  --kolor-radio-zaznaczony: #ffffff;
  --kolor-tlo-radio-zaznaczony: #21334D;
  --kolor-tla-blad: #FFF5F5;
  --kolor-czerwony-blad: #EF4444;

  /* ===== RADIUS ===== */
  --zaokraglenie-input: 8px;
  --zaokraglenie-checkbox: 6px;
  --zaokraglenie-3-px: 6px;
  --zaokraglenie-4-px: 8px;
  --zaokraglenie-5-px: 10px;
  --zaokraglenie-6-px: 14px;
  --cien-pola: 0 0 0 rgba(0,0,0,0);

  /* ===== FILTERS ===== */
  --filtr-brand-blue: invert(45%) sepia(45%) saturate(760%) hue-rotate(174deg) brightness(94%) contrast(87%);
  --filtr-bialy: invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(106%) contrast(101%);
  --filtr-szary-ciemny: invert(24%) sepia(13%) saturate(911%) hue-rotate(175deg) brightness(97%) contrast(89%);
}

html, body, button, input, select, textarea {
  font-family: 'Manrope', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
}
body {
  background: var(--tlo-szare) !important;
  color: var(--kolor-glowny-czcionki) !important;
}

/* =========================================
   GLOBAL BUTTONS & BOXES
   ========================================= */

/* --- Secondary / default buttons → brand blue --- */
button, .btn, .button, input[type="submit"], input[type="button"],
.przycisk, .cmxform .przycisk {
  background: var(--kolor-szablonu) !important;
  color: #ffffff !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
}
button:hover, .btn:hover, .button:hover, input[type="submit"]:hover,
.przycisk:hover, .cmxform .przycisk:hover {
  background: var(--kolor-szablonu-2) !important;
  color: #ffffff !important;
  transform: none !important;
}

/* --- Primary CTA buttons → accent pink --- */
.przyciskZamow,
.przyciskZaplac,
.KontenerKoszykButton a.przycisk,
#przycisk_zamow a.przycisk {
  background: var(--kolor-akcent) !important;
  color: #ffffff !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 14px rgba(255, 90, 130, 0.30) !important;
  transition: background 0.2s, box-shadow 0.2s, transform 0.15s !important;
}
.przyciskZamow:hover,
.przyciskZaplac:hover,
.KontenerKoszykButton a.przycisk:hover,
#przycisk_zamow a.przycisk:hover {
  background: #E6456D !important;
  color: #ffffff !important;
  box-shadow: 0 6px 18px rgba(255, 90, 130, 0.45) !important;
  transform: translateY(-2px) !important;
}

.naglowek, .Naglowek, .NaglowekBox, .BoxNaglowek {
  background: var(--kolor-tlo-naglowek-box) !important;
  color: var(--kolor-czcionka-naglowek-box) !important;
}

/* =========================================
   UKRYTE ELEMENTY (CHIRURGICZNE CIĘCIA)
   ========================================= */
.NaglowekZmianaJezykaWaluty,
#Koszyk .ZawartoscKoszyka,
.SzukanieKoszyk .ZawartoscKoszyka,
.IkonyNawigacja .PozycjaOpisIkony,
.IkonyNawigacja .PozycjaStrzalka,
.NaglowekKonto, 
.LinkMailNaglowek { 
  display: none !important; 
}

/* =========================================
   HEADER BASE & LAYOUT
   ========================================= */
.SklepNaglowek { 
    background: var(--kolor-paska-naglowka) !important; 
    color: var(--kolor-glowny-czcionki) !important; 
    border-bottom: 1px solid var(--kolor-linia) !important; 
}
.SklepNaglowek * { color: var(--kolor-glowny-czcionki) !important; }
.StrNaglowek, .SzukanieKoszyk { background: transparent !important; overflow: visible !important; }
.NaglowekTop .Strona > div { float: none !important; }

.SklepNaglowek .NaglowekTop {
    position: relative !important; 
}

.SzukanieKoszyk > .Strona {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 30px !important;
    padding: 20px 0 !important; 
    margin-bottom: 0 !important;
    position: relative !important;
}

/* Otwarcie miejsca pod powiększone LOGO */
.SzukanieKoszyk > .Strona::before {
    content: "" !important;
    flex: 0 0 220px !important; 
    height: 60px !important;    
    background: none !important;
    display: block !important;
}

/* Kontener Wyszukiwarki */
.SzukanieKoszyk > .Strona > .Wyszukiwanie {
    flex: 1 1 auto !important;
    max-width: 520px !important;
    margin: 0 auto !important;
}

.SzukanieKoszyk > .Strona > .IkonyNawigacja *,
.SzukanieKoszyk > .Strona > .NaglowekZmianaJezykaWaluty * { float: none !important; }

/* =========================================
   GUARD: Protect .Strona containers from leaked module CSS
   ShopGold only substitutes {KLASA_CSS_MODUL} in single-line module CSS.
   Multi-line module CSS causes rules to apply globally to all .Strona.
   ========================================= */
.Strona {
    overflow: visible !important;
    border-radius: 0 !important;
}
/* Allow the category module container to keep its own styles */
.ModulCssDodatkowy .Strona {
    overflow: hidden !important;
    border-radius: 18px !important;
}

/* =========================================
   LOGO (KLIKALNY BANER - WYŚRODKOWANY)
   ========================================= */
.SklepNaglowek .NaglowekTop > .Logo.Strona {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 100% !important;
    max-height: 90px !important; 
    margin: 0 auto !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    pointer-events: none !important;
    z-index: 100 !important;
    overflow: visible !important;
}

#LinkLogo {
    pointer-events: auto !important;
    display: block !important;
    position: relative !important;
    top: auto !important;
    transform: none !important;
    width: 220px !important; 
    height: 60px !important; 
    background: url("/images/sklep_2026/loga/logo_baner_v2.png") no-repeat left center !important;
    background-size: contain !important;
    cursor: pointer !important;
    border: none !important;
    outline: none !important;
    margin: 0 !important;
}

/* =========================================
   SEARCH BAR
   ========================================= */
.KontenterWyszukiwania .RamkaSzukania, .KontenerWyszukiwania .RamkaSzukania {
    display: flex !important;
    align-items: center !important;
    background: var(--kolor-szary-jasny) !important;
    border-radius: 50px !important;
    padding: 0 !important;
    width: 100% !important;
    height: 48px !important;
    border: 2px solid transparent !important;
    box-shadow: none !important; 
    overflow: hidden !important; 
    transition: all 0.3s ease !important;
}

.KontenterWyszukiwania .RamkaSzukania:focus-within, .KontenerWyszukiwania .RamkaSzukania:focus-within {
    background: #ffffff !important;
    border-color: var(--kolor-szablonu) !important; 
    box-shadow: 0 4px 15px rgba(90, 125, 154, 0.15) !important;
}

#InSzukaj {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    padding: 0 15px 0 25px !important;
    height: 100% !important;
    color: var(--kolor-czarny) !important;
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    outline: none !important; 
}

#ButSzukaj {
    flex: 0 0 55px !important;
    width: 55px !important; 
    height: 100% !important;
    background-color: transparent !important; 
    border-radius: 0 50px 50px 0 !important;
    border: none !important;
    cursor: pointer !important;
    margin: 0 !important;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%235A7D9A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3ccircle cx='11' cy='11' r='8'%3e%3c/circle%3e%3cline x1='21' y1='21' x2='16.65' y2='16.65'%3e%3c/line%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 20px 20px !important;
    transition: opacity 0.2s ease, transform 0.2s ease !important;
}

#ButSzukaj:hover, #ButSzukaj:focus {
    opacity: 0.6 !important;
    background-color: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    transform: scale(1.05) !important;
}

#ButSzukaj::after, #ButSzukaj::before,
#ButSzukaj:hover::after, #ButSzukaj:hover::before,
#ButSzukaj:focus::after, #ButSzukaj:focus::before { 
    display: none !important; 
    content: none !important; 
    background: none !important; 
}

/* --- Autocomplete Podpowiedzi --- */
#Podpowiedzi {
    position: absolute !important;
    top: calc(100% + 8px) !important; 
    left: 0 !important;
    width: 100% !important;
    z-index: 99999 !important;
    margin: 0 !important;
    padding: 0 !important;
}

#Podpowiedzi div.OknoAutouzupelnienia {
    position: relative !important; 
    top: 0 !important;
    left: 0 !important;
    width: 100% !important; 
    max-width: none !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.15) !important;
    border: 1px solid var(--kolor-linia) !important;
    overflow: hidden !important;
}

#Podpowiedzi div.OknoAutouzupelnienia *,
#Podpowiedzi div.OknoAutouzupelnienia a,
#Podpowiedzi div.OknoAutouzupelnienia span,
#Podpowiedzi div.OknoAutouzupelnienia em {
    color: var(--kolor-czarny) !important;
    text-decoration: none !important;
}

#Podpowiedzi .NaglowekPodpowiedzi {
    background: var(--kolor-szary-jasny) !important;
    padding: 12px 20px !important;
    margin: 0 !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-weight: 700 !important;
    border-bottom: 1px solid var(--kolor-linia) !important;
    color: var(--kolor-szary-ciemny-4) !important;
}

#Podpowiedzi .OknoAutouzupelnieniaZamknij {
    position: absolute !important;
    top: 10px !important;
    right: 15px !important;
    margin: 0 !important;
    z-index: 100 !important;
}

#Podpowiedzi .OknoAutouzupelnieniaZamknij b {
    font-family: 'Manrope', sans-serif !important;
    font-size: 22px !important;
    font-weight: 400 !important;
    color: var(--kolor-szary-ciemny-2) !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer !important;
    line-height: 1 !important;
    transition: color 0.2s ease, transform 0.2s ease !important;
    display: inline-block !important;
}

#Podpowiedzi .OknoAutouzupelnieniaZamknij b:hover {
    color: var(--kolor-czerwony) !important;
    transform: scale(1.1) !important;
}

#Podpowiedzi div.OknoAutouzupelnieniaTresc {
    padding: 15px !important;
    max-height: 55vh !important; 
    overflow-y: auto !important;
}

#Podpowiedzi .PodpowiedzProdukt {
    border-bottom: 1px solid var(--kolor-szary) !important;
    padding: 10px !important;
    margin-bottom: 0 !important;
    border-radius: 8px !important;
    transition: background 0.2s ease !important;
}
#Podpowiedzi .PodpowiedzProdukt:last-child { border-bottom: none !important; }
#Podpowiedzi .PodpowiedzProdukt:hover { background: var(--tlo-szare) !important; }

#Podpowiedzi .PodpowiedzProduktFoto { width: 60px !important; text-align: center !important; }
#Podpowiedzi .PodpowiedzProduktFoto img { max-width: 50px !important; border-radius: 4px !important; }

#Podpowiedzi .PodpowiedzProduktNazwaCena {
    width: calc(100% - 60px) !important;
    padding-left: 10px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

#Podpowiedzi .PodpowiedzProduktCena,
#Podpowiedzi .PodpowiedzProduktCena * {
    color: var(--kolor-szablonu) !important; 
    font-weight: 700 !important;
    font-size: 14px !important;
    margin-top: 4px !important;
}

#Podpowiedzi .OknoAutouzupelnieniaSlowa {
    border-right: 1px solid var(--kolor-linia) !important;
    padding-right: 10px !important;
    margin-right: 15px !important;
}
#Podpowiedzi .PodpowiedzFraza {
    padding: 8px 12px !important;
    border-radius: 6px !important;
    margin-bottom: 2px !important;
    font-size: 13px !important;
    transition: background 0.2s ease !important;
}
#Podpowiedzi .PodpowiedzFraza:hover { background: var(--kolor-szary-jasny-2) !important; }

/* =========================================
   PHONE / CONTACT DATA (GHOSTING FIX)
   ========================================= */
.SklepNaglowek .NaglowekTop > .Strona:last-child { 
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: transparent !important;
    margin: 0 auto !important;
    pointer-events: none !important;
    display: flex !important; 
    justify-content: flex-end !important;
    padding: 8px 0 0 0 !important;
}

.NaglowekDaneKontaktowe {
    position: absolute !important;
    top: 32px !important; 
    right: 210px !important; 
    background: transparent !important;
    pointer-events: auto !important; 
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    display: block !important;
    float: none !important;
}

.LinkTelefonNaglowek {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--kolor-czarny) !important;
    display: flex !important;
    align-items: center !important;
    text-decoration: none !important;
    padding: 5px 10px !important;
    transition: color 0.2s ease !important;
    background: transparent !important;
}

.LinkTelefonNaglowek:hover {
    color: var(--kolor-szablonu) !important;
}

.LinkTelefonNaglowek::before {
    transform: scale(1.2) !important;
    margin-right: 8px !important;
    filter: var(--filtr-szary-ciemny) !important;
}

/* =========================================
   ICONS: KOSZYK, KONTO, SZUKAJ
   ========================================= */
@media only screen and (min-width: 1024px) {
    .IkonyNawigacja {
        background: transparent !important; 
        padding: 0 !important;
        margin-left: 20px !important;
    }
}

.IkonyNawigacja .IkonaNaglowek,
.IkonyNawigacja label.LogowanieMenuLabel,
.IkonyNawigacja label.SzukajMenuLabel {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;  
    height: 48px !important;
    min-width: 48px !important;
    background-color: transparent !important; 
    border-radius: 12px !important; 
    margin: 0 0 0 10px !important;
    border: 1px solid var(--kolor-linia) !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

.IkonyNawigacja .IkonaNaglowek:hover,
.IkonyNawigacja label.LogowanieMenuLabel:hover,
.IkonyNawigacja label.SzukajMenuLabel:hover {
    background-color: #ffffff !important;
    border-color: var(--kolor-szablonu) !important;
    box-shadow: 0 4px 12px rgba(58, 130, 196, 0.15) !important;
    transform: translateY(-2px) !important;
}

.IkonyNawigacja span.PozycjaIkonka {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    background-color: transparent !important;
    filter: var(--filtr-brand-blue) !important; 
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background-size: 24px 24px !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Wibrujący różowy bąbelek powiadomień koszyka */
.IkonyNawigacja span.PozycjaIlosc,
.IkonyNawigacja span.KoszykIlosc,
.SzukanieKoszyk .KoszykIlosc {
    position: absolute !important;
    top: -6px !important;
    right: -6px !important;
    background-color: var(--kolor-akcent) !important; 
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 24px !important;
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    text-align: center !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 3px solid #ffffff !important; 
    margin: 0 !important;
    padding: 0 !important;
    z-index: 10 !important;
    box-shadow: 0 4px 8px rgba(255, 90, 130, 0.4) !important; 
}

/* =========================================
   POPUPS / DROPDOWNS (LOGOWANIE, KOSZYK)
   ========================================= */
.LogowanieNaglowek { display: block !important; }
.LogowanieNaglowek .PozycjeLogowanie { display: block !important; }

.KoszykRozwijany *, .SchowekRozwijany *, .PorownywanieRozwijane * { color: var(--kolor-czarny) !important; }

.KoszykRozwijany .RozwinietaWersja,
.SchowekRozwijany .RozwinietaWersja,
.PorownywanieRozwijane .RozwinietaWersja,
.LogowanieNaglowek .PozycjeLogowanie {
    background-color: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
    border: 1px solid var(--kolor-linia) !important;
    padding: 15px !important;
    overflow: hidden !important;
}

.LogowanieNaglowek .PozycjeLogowanie::before,
.LogowanieNaglowek .PozycjeLogowanie::after {
    display: none !important;
    content: none !important;
}

.LogowanieNaglowek .PozycjeLogowanie li a {
    display: block !important;
    padding: 8px 12px !important;
    color: var(--kolor-czarny) !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

.LogowanieNaglowek .PozycjeLogowanie li a:hover {
    background: var(--tlo-szare) !important;
    color: var(--kolor-szablonu) !important;
}

.PustyKoszykSchowek {
    color: var(--kolor-szary-ciemny-3) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

/* Mini-cart "Przejdź do koszyka" button */
.ZawartoscKoszykaSchowkaDoKasy a.przycisk {
    display: block !important;
    background: var(--kolor-akcent) !important;
    color: #fff !important;
    border: none !important;
    border-left: none !important;
    border-radius: 10px !important;
    padding: 10px 20px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
    cursor: pointer !important;
    box-shadow: 0 3px 8px rgba(255, 90, 130, 0.25) !important;
    transition: background 0.2s, box-shadow 0.2s !important;
}
.ZawartoscKoszykaSchowkaDoKasy a.przycisk:hover {
    background: #E6456D !important;
    box-shadow: 0 5px 12px rgba(255, 90, 130, 0.4) !important;
}

/* "DO KASY" — large size override (color from global CTA block above) */
.KontenerKoszykButton a.przycisk,
#przycisk_zamow a.przycisk {
    width: auto !important;
    min-width: 260px !important;
    padding: 16px 40px !important;
    font-size: 16px !important;
    letter-spacing: .04em !important;
}

/* =========================================
   HORIZONTAL MENU
   ========================================= */
.GorneMenuKontener, .GorneMenuTlo, .GorneMenu {
  background: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
}

.GorneMenuKontener { 
    box-shadow: none !important; 
    border-bottom: 1px solid var(--kolor-linia) !important; 
    position: relative !important; 
    z-index: 90 !important; 
}

ul.GlowneGorneMenu {
    display: flex !important;
    justify-content: space-around !important; 
    align-items: center !important;
    flex-wrap: nowrap !important; 
    white-space: nowrap !important;
    gap: 2px !important; 
    padding: 10px 0 !important;
    background: transparent !important;
    border: none !important;
}

ul.GlowneGorneMenu > li { border: none !important; background: transparent !important; margin: 0 !important; padding: 0 !important; }

ul.GlowneGorneMenu > li > div > a{
  font-family: 'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif !important;
  font-size: 14px !important;
  letter-spacing: .04em !important;
  color: #0f172a !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;

  display: inline-flex !important;
  align-items: center !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;

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

.GorneMenu b {
    font-weight: 600 !important;
}

ul.GlowneGorneMenu > li > div > a:hover { 
    background: var(--tlo-szare) !important; 
    color: var(--kolor-szablonu) !important; 
}

/* Przycisk Kategorie */
ul.GlowneGorneMenu > li:first-child > div > a {
    background: var(--kolor-szablonu) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    padding: 12px 20px 12px 42px !important;
    position: relative !important;
    font-size: 14px !important;
}

ul.GlowneGorneMenu > li:first-child:hover > div > a {
    background: var(--kolor-szablonu-2) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(47, 70, 104, 0.2) !important;
}

ul.GlowneGorneMenu > li:first-child > div > a::before {
    content: "" !important;
    position: absolute !important;
    left: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 18px !important;
    height: 18px !important;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cline x1='3' y1='12' x2='21' y2='12'%3e%3c/line%3e%3cline x1='3' y1='6' x2='21' y2='6'%3e%3c/line%3e%3cline x1='3' y1='18' x2='21' y2='18'%3e%3c/line%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

ul.GlowneGorneMenu > li:first-child label.IkonaSubMenu { display: none !important; }

/* Ostatni link w menu (Promocje) */
ul.GlowneGorneMenu > li:last-child > div > a {
    color: var(--kolor-akcent) !important;
}

/* Active page indicator */
ul.GlowneGorneMenu > li > div > a.AktywnyLinkMenu {
    background: transparent !important;
    color: var(--kolor-szablonu) !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    position: relative !important;
}
ul.GlowneGorneMenu > li > div > a.AktywnyLinkMenu::after {
    content: "" !important;
    position: absolute !important;
    bottom: 4px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 18px !important;
    height: 2px !important;
    background: var(--kolor-szablonu) !important;
    border-radius: 2px !important;
}

/* Kategorie dropdown */
ul.MenuRozwijaneKolumny {
    background: #fff !important;
    border: 1px solid var(--kolor-linia) !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12) !important;
    padding: 6px !important;
    margin-top: 6px !important;
    min-width: 220px !important;
}
ul.MenuRozwijaneKolumny li.LinkiMenu {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}
ul.MenuRozwijaneKolumny li.LinkiMenu a {
    display: block !important;
    padding: 8px 14px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--kolor-szary-ciemny-3) !important;
    text-decoration: none !important;
    transition: background 0.15s, color 0.15s !important;
    white-space: nowrap !important;
}
ul.MenuRozwijaneKolumny li.LinkiMenu a:hover {
    background: var(--tlo-szare) !important;
    color: var(--kolor-szablonu) !important;
}

/* =========================================
   PRODUCT BADGES (ikonki: promocja, nowosc, hit…)
   ========================================= */
/* Make all product badges pill-shaped instead of the default 3px radius */
.Ikona b {
    border-radius: 9999px !important;
    padding: 3px 10px !important;
}

/* =========================================
   PRODUCT CARDS & LAYOUTS
   ========================================= */
.ModulKolumny-1 .StrTresc, .ModulKolumny-2 .StrTresc, .ModulKolumny-3 .StrTresc, .ModulKolumny-4 .StrTresc, .KolumnaKreator .StrTresc {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.OknaFlexRwd::before, .OknaFlexRwd::after, .OknoFlex .ElementOknoRamka::before, .OknoFlex .ElementOknoRamka::after { 
    display: none !important; content: none !important; 
}

.ProduktOkno {
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid var(--kolor-linia) !important;
    border-radius: 12px !important;
    margin: 10px 10px 35px 10px !important;
    padding: 20px !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.02) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
    box-sizing: border-box !important;
    height: calc(100% - 45px) !important; 
}

.ProduktOkno:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 24px rgba(47, 70, 104, 0.08) !important;
    border-color: var(--kolor-szablonu) !important;
}

.ProduktOkno .ElementOknoRamka {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    padding: 0 !important;
    border: none !important;
}

.ProduktOkno .Foto {
    height: 160px !important; 
    flex: 0 0 160px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 0 15px 0 !important;
    border: none !important;
    background: transparent !important;
}
.ProduktOkno .Foto img { max-height: 140px !important; max-width: 100% !important; object-fit: contain !important; mix-blend-mode: multiply !important; }

.ProduktOkno h3 {
    height: 56px !important;
    flex: 0 0 56px !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.ProduktOkno h3 a {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
    color: var(--kolor-czarny) !important;
    text-align: center !important;
}

.ProduktOkno .CenaProduktu {
    height: 55px !important;
    flex: 0 0 55px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important; 
    text-align: center !important;
    padding: 0 0 15px 0 !important;
    margin-top: auto !important; 
}
.ProduktOkno .CenaAktualna { font-size: 20px !important; font-weight: 800 !important; color: var(--kolor-szablonu) !important; line-height: 1 !important; }
.ProduktOkno .CenaPoprzednia { font-size: 12px !important; color: var(--kolor-szary-ciemny) !important; margin-bottom: 4px !important; line-height: 1 !important; }

.ProduktOkno .ZakupKontener { flex: 0 0 auto !important; padding: 0 !important; border: none !important; width: 100% !important; }
.ProduktOkno .SchowekKontener { text-align: center !important; padding: 0 0 10px 0 !important; width: 100% !important; }
.ProduktOkno .Schowek {
    background-size: 14px 14px !important;
    padding: 2px 0 2px 20px !important;
    font-size: 11px !important;
    color: var(--kolor-szary-ciemny) !important;
    display: inline-block !important;
    text-transform: lowercase !important;
    font-weight: 500 !important;
    transition: color 0.2s ease !important;
}
.ProduktOkno .Schowek::before { display: none !important; }
.ProduktOkno .Schowek:hover { color: var(--kolor-szablonu) !important; }

.ProduktOkno .Zakup { display: flex !important; width: 100% !important; gap: 8px !important; }
.ProduktOkno .Zakup em { display: none !important; }

.ProduktOkno .InputIlosc {
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 40px !important;
    padding: 0 !important;
    text-align: center !important;
    border-radius: 8px !important;
    border: 1px solid var(--kolor-linia) !important;
    font-weight: 600 !important;
    color: var(--kolor-czarny) !important;
}

.ProduktOkno .DoKoszyka, .ProduktOkno .ZapytanieProduktListing {
    flex: 1 1 auto !important; 
    width: 100% !important;
    height: 40px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}
.ProduktOkno .DoKoszyka { 
    background-color: var(--kolor-akcent) !important; 
    color: #ffffff !important; 
    box-shadow: 0 4px 12px rgba(255, 90, 130, 0.3) !important; 
    transition: all 0.3s ease !important;
}
.ProduktOkno .DoKoszyka:hover { 
    background-color: #E6456D !important; 
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(255, 90, 130, 0.4) !important;
}
.ProduktOkno .ZapytanieProduktListing { background-color: var(--kolor-szary-ciemny-3) !important; color: #ffffff !important; }
.ProduktOkno .ZapytanieProduktListing:hover { background-color: var(--kolor-szary-ciemny-5) !important; }

.ProduktOkno .DoKoszyka::before { margin-right: 8px !important; width: 18px !important; height: 18px !important; filter: var(--filtr-bialy) !important; position: static !important; }
.ProduktOkno .DoKoszyka::after { display: none !important; }

/* --- Listing card "Do koszyka" button --- */
.Listing .DoKoszyka {
    background-color: var(--kolor-akcent) !important;
    color: #ffffff !important;
    box-shadow: 0 3px 8px rgba(255, 90, 130, 0.25) !important;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
    padding: 10px 16px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    text-align: center !important;
}

.Listing .DoKoszyka:hover {
    background-color: #E6456D !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 5px 12px rgba(255, 90, 130, 0.35) !important;
}

/* Replace sliding strip with a simple static inline icon */
.Listing .DoKoszyka::before {
    position: static !important;
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    background-size: 16px 16px !important;
    filter: var(--filtr-bialy) !important;
    vertical-align: middle !important;
    margin-right: 6px !important;
    transition: none !important;
}

.Listing .DoKoszyka::after {
    display: none !important;
}

/* =========================================
   LISTING — KARTY PRODUKTÓW
   ========================================= */

/* Hide clutter: producer/catalog rows and compare/wishlist links */
.Listing ul.ListaOpisowa,
.Listing .PorownajSchowek,
.Listing .Zakup em {
    display: none !important;
}

/* Card container */
.Listing .ElementListingRamka {
    display: flex !important;
    flex-direction: column !important;
    background: #fff !important;
    border-radius: 14px !important;
    border: 1px solid var(--kolor-linia) !important;
    overflow: hidden !important;
    transition: box-shadow 0.2s ease, transform 0.2s ease !important;
    height: 100% !important;
}

.Listing .ElementListingRamka:hover {
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.10) !important;
    transform: translateY(-2px) !important;
}

/* Product image — larger, centered, white bg */
.Listing .Foto {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
    background: #fafafa !important;
    min-height: 200px !important;
}

.Listing .Foto a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 200px !important;
    height: 200px !important;
}

.Listing .Foto img {
    width: 200px !important;
    height: 200px !important;
    object-fit: contain !important;
    mix-blend-mode: multiply !important;
}

/* Product info */
.Listing .ProdCena {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 12px 16px 8px !important;
    text-align: center !important;
    flex: 1 !important;
}

.Listing .ProdCena h3 {
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    color: var(--kolor-szary-ciemny-3) !important;
}

.Listing .ProdCena h3 a {
    color: inherit !important;
    text-decoration: none !important;
}

.Listing .ProdCena h3 a:hover {
    color: var(--kolor-akcent) !important;
}

.Listing .CenaAktualna {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: var(--kolor-akcent) !important;
}

/* Quantity + button row */
.Listing .ZakupKontener {
    padding: 8px 16px 14px !important;
}

.Listing .Zakup {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    justify-content: center !important;
}

.Listing .InputIlosc {
    width: 44px !important;
    text-align: center !important;
    border: 1px solid var(--kolor-linia) !important;
    border-radius: 6px !important;
    padding: 6px 4px !important;
    font-size: 14px !important;
}

/* Mobile: 2-column grid */
@media (max-width: 767px) {
    .Listing .OknaFlexRwd {
        gap: 10px !important;
    }

    .Listing .Okno.OknoRwd {
        width: calc(50% - 5px) !important;
        flex: 0 0 calc(50% - 5px) !important;
        margin: 0 !important;
    }

    .Listing .Foto {
        min-height: 150px !important;
        padding: 12px !important;
    }

    .Listing .Foto a,
    .Listing .Foto img {
        width: 150px !important;
        height: 150px !important;
    }

    .Listing .ProdCena {
        padding: 10px 10px 6px !important;
    }

    .Listing .ProdCena h3 {
        font-size: 12px !important;
    }

    .Listing .CenaAktualna {
        font-size: 15px !important;
    }

    .Listing .ZakupKontener {
        padding: 6px 10px 12px !important;
    }
}

/* =========================================
   ZAKŁADKI KARTY PRODUKTU
   ========================================= */
.ZakladkiProduktu, ul.Zakladki {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    border-bottom: 2px solid var(--kolor-linia) !important;
    padding: 0 0 10px 0 !important;
    margin-bottom: 25px !important;
    list-style: none !important;
}

ul.Zakladki li {
    background: transparent !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

ul.Zakladki li span,
ul.Zakladki li a {
    display: block !important;
    background: var(--tlo-szare) !important;
    color: var(--kolor-szary-ciemny-3) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 12px 24px !important;
    border-radius: 8px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
}

ul.Zakladki li:hover span,
ul.Zakladki li:hover a {
    background: #ffffff !important;
    color: var(--kolor-szablonu) !important;
    border-color: var(--kolor-szablonu) !important;
}

/* Active tab — target the li directly (compiled CSS sets bg on li, not child elements) */
#ZakladkiProduktu #Zakladki li.aktywna,
ul.Zakladki li.ZakladkaAktywna,
ul.Zakladki li.aktywna {
    background: #ffffff !important;
    color: var(--kolor-szablonu) !important;
    border: 1px solid var(--kolor-szablonu) !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}
ul.Zakladki li.ZakladkaAktywna span,
ul.Zakladki li.ZakladkaAktywna a,
ul.Zakladki li.aktywna span,
ul.Zakladki li.aktywna a {
    background: transparent !important;
    color: var(--kolor-szablonu) !important;
    border: none !important;
    box-shadow: none !important;
}

.ZakladkiTresc, .TrescZakladki {
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: var(--kolor-glowny-czcionki) !important;
}
.ZakladkiTresc a, .TrescZakladki a {
    color: var(--kolor-szablonu) !important;
    text-decoration: underline !important;
}
.ZakladkiTresc h1, .ZakladkiTresc h2, .ZakladkiTresc h3,
.TrescZakladki h1, .TrescZakladki h2, .TrescZakladki h3 {
    font-size: revert !important;
    font-weight: 700 !important;
    color: var(--kolor-czarny) !important;
    margin: 1em 0 0.5em !important;
}
.ZakladkiTresc p, .TrescZakladki p {
    margin: 0 0 0.8em !important;
}
.ZakladkiTresc img, .TrescZakladki img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 8px !important;
}

/* =========================================
   PRODUCT DETAIL PAGE — "DODAJ DO KOSZYKA"
   ========================================= */
/* Solid accent pink — hide the sliding pseudo-elements entirely */
.DoKoszykaKartaProduktu,
#PrzyciskKupowania .DoKoszykaKartaProduktu {
    background-color: var(--kolor-akcent) !important;
    background-image: none !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 14px 20px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: .04em !important;
    box-shadow: 0 4px 14px rgba(255, 90, 130, 0.30) !important;
    transition: background 0.2s, box-shadow 0.2s, transform 0.15s !important;
    overflow: hidden !important;
    position: relative !important;
}
.DoKoszykaKartaProduktu:hover,
#PrzyciskKupowania .DoKoszykaKartaProduktu:hover {
    background-color: #E6456D !important;
    color: #ffffff !important;
    padding: 14px 20px !important;
    box-shadow: 0 6px 18px rgba(255, 90, 130, 0.45) !important;
    transform: translateY(-2px) !important;
    text-shadow: none !important;
}
/* Hide the sliding animated strips completely */
.DoKoszykaKartaProduktu::before,
.DoKoszykaKartaProduktu::after,
#PrzyciskKupowania .DoKoszykaKartaProduktu::before,
#PrzyciskKupowania .DoKoszykaKartaProduktu::after,
.DoKoszykaKartaProduktu:hover::before,
.DoKoszykaKartaProduktu:hover::after,
#PrzyciskKupowania .DoKoszykaKartaProduktu:hover::before,
#PrzyciskKupowania .DoKoszykaKartaProduktu:hover::after {
    display: none !important;
}

/* =========================================
   SLIDER ARROWS
   Covers:
   - .Animacja-Pierwsza-33: main hero banner
   - .AnimacjaKreator: all animated product/category modules
   - #ZdjeciaProduktu: product image gallery
   ========================================= */

/* Button shape — white circle with shadow */
.Animacja-Pierwsza-33 .slick-prev,
.Animacja-Pierwsza-33 .slick-next,
.AnimacjaKreator .slick-prev,
.AnimacjaKreator .slick-next,
#ZdjeciaProduktu .slick-prev,
#ZdjeciaProduktu .slick-next {
    width: 44px !important;
    height: 44px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.12) !important;
    z-index: 10 !important;
    opacity: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.Animacja-Pierwsza-33 .slick-prev:hover,
.Animacja-Pierwsza-33 .slick-next:hover,
.AnimacjaKreator .slick-prev:hover,
.AnimacjaKreator .slick-next:hover,
#ZdjeciaProduktu .slick-prev:hover,
#ZdjeciaProduktu .slick-next:hover {
    transform: translateY(-50%) scale(1.08) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.18) !important;
    background: #ffffff !important;
}

/* Arrow icon — CSS chevron, no font character */
.Animacja-Pierwsza-33 .slick-prev::before,
.Animacja-Pierwsza-33 .slick-next::before,
.AnimacjaKreator .slick-prev::before,
.AnimacjaKreator .slick-next::before,
#ZdjeciaProduktu .slick-prev::before,
#ZdjeciaProduktu .slick-next::before {
    content: "" !important;
    font-family: none !important;
    display: block !important;
    width: 11px !important;
    height: 11px !important;
    border: solid #4a5568 !important;
    border-width: 0 2px 2px 0 !important;
    position: static !important;
    opacity: 1 !important;
    color: transparent !important;
}

/* Left arrow: chevron points left */
.Animacja-Pierwsza-33 .slick-prev::before,
.AnimacjaKreator .slick-prev::before,
#ZdjeciaProduktu .slick-prev::before {
    transform: translateX(2px) rotate(135deg) !important;
}

/* Right arrow: chevron points right */
.Animacja-Pierwsza-33 .slick-next::before,
.AnimacjaKreator .slick-next::before,
#ZdjeciaProduktu .slick-next::before {
    transform: translateX(-2px) rotate(-45deg) !important;
}

/* =========================================
   USP BAR
   ========================================= */
/* Empty quick-links bar — hide when ShopGold has none configured */
.SzybkieLinki.SzybkieLinkiBrak {
    display: none !important;
}

.usp-bar {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 40px !important;
    background-color: var(--tlo-szare) !important; 
    border-bottom: 1px solid var(--kolor-linia) !important;
    padding: 10px 20px !important;
    font-family: 'Manrope', sans-serif !important;
    color: var(--kolor-czarny) !important;
    font-size: 13px !important;
}

.usp-item {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
}

.usp-item strong {
    font-weight: 700 !important;
    color: var(--kolor-szablonu) !important;
}

.usp-item::before {
    content: "" !important;
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
}

.usp-shipping::before { background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A82C4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3crect x='1' y='3' width='15' height='13'%3e%3c/rect%3e%3cpolygon points='16 8 20 8 23 11 23 16 16 16 16 8'%3e%3c/polygon%3e%3ccircle cx='5.5' cy='18.5' r='2.5'%3e%3c/circle%3e%3ccircle cx='18.5' cy='18.5' r='2.5'%3e%3c/circle%3e%3c/svg%3e") !important; }
.usp-store::before { background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A82C4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'%3e%3c/path%3e%3cpolyline points='9 22 9 12 15 12 15 22'%3e%3c/polyline%3e%3c/svg%3e") !important; }
.usp-return::before { background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A82C4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='1 4 1 10 7 10'%3e%3c/polyline%3e%3cpath d='M3.51 15a9 9 0 1 0 2.13-9.36L1 10'%3e%3c/path%3e%3c/svg%3e") !important; }
.usp-expert::before { background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A82C4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'%3e%3c/path%3e%3c/svg%3e") !important; }

/* =========================================
   NEWSLETTER
   ========================================= */
.ModulNewsletter {
    background: var(--kolor-szary-jasny) !important;
    border: 1px solid var(--kolor-linia) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
    overflow: hidden !important;
}

.ModulNewsletter strong {
    background: transparent !important;
    color: var(--kolor-szablonu) !important;
    text-align: center !important;
}

.ModulNewsletter strong::after {
    filter: var(--filtr-brand-blue) !important; 
    opacity: 0.8 !important;
}

#emailNewsletterModul {
    border-radius: 8px !important;
    border: 1px solid var(--kolor-linia) !important;
    padding: 14px !important;
    color: var(--kolor-czarny) !important;
}
#emailNewsletterModul:focus {
    border-color: var(--kolor-szablonu) !important;
}

#submitNewsletterModul {
    background-color: var(--kolor-akcent) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    padding: 12px 25px !important;
    font-weight: 700 !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
#submitNewsletterModul:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 10px rgba(255, 90, 130, 0.3) !important;
}

#submitUnsubscribeNewsletterModul {
    background-color: var(--kolor-szary-ciemny) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
}

/* =========================================
   FOOTER (JASNA I LEKKA STOPKA)
   ========================================= */
.StopkaTlo {
    background: #ffffff !important; 
    border-top: 1px solid var(--kolor-linia) !important;
    padding: 50px 0 20px 0 !important; 
}

.KolumnaStopki strong.NaglowekStopki {
    color: var(--kolor-czarny) !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding: 0 0 15px 0 !important;
    margin-bottom: 15px !important;
    border-bottom: 1px solid var(--kolor-linia) !important;
    display: block !important;
}

.KolumnaStopki ul.LinkiStopki li a {
    color: var(--kolor-szary-ciemny-2) !important; 
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 6px 0 !important;
    transition: all 0.3s ease !important;
    display: inline-block !important; 
}

.KolumnaStopki ul.LinkiStopki li a:hover {
    color: var(--kolor-szablonu) !important;
    transform: translateX(5px) !important; 
}

.StopkaDolneMenu {
    border-top: 1px solid var(--kolor-linia) !important;
    padding-top: 20px !important;
    margin: 0 !important;
    text-align: center !important;
}

.StopkaDolneMenu li a {
    color: var(--kolor-szary-ciemny-2) !important;
    border-color: var(--kolor-linia) !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
}

.StopkaDolneMenu li a:hover {
    color: var(--kolor-szablonu) !important;
}

.Copy {
    background: var(--tlo-szare) !important; 
    color: var(--kolor-szary-ciemny-3) !important;
    text-align: center !important;
    padding: 15px 0 !important;
    font-size: 12px !important;
    border-top: 1px solid var(--kolor-linia) !important;
}

.Copy a {
    color: var(--kolor-szary-ciemny-3) !important;
    font-weight: 700 !important;
}

.Copy a:hover { color: var(--kolor-szablonu) !important; }
.Copy a[href*="shopgold"] { display: none !important; }

#doGory, #doDolu {
    background-color: #ffffff !important;
    border-radius: 50px !important;
    opacity: 1 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.15) !important;
    border: 1px solid var(--kolor-linia) !important;
    transition: all 0.3s ease !important;
    width: 44px !important;
    height: 44px !important;
    background-size: 24px 24px !important;
    background-position: center !important;
}

#doGory:hover, #doDolu:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.2) !important;
    border-color: var(--kolor-szablonu) !important;
}

#doGory { bottom: 160px; }


/* =========================================
   MEDIA QUERIES (ZAWSZE NA DOLE)
   ========================================= */
@media only screen and (min-width: 1024px) {
    #Podpowiedzi div.OknoAutouzupelnienia { width: 100% !important; }
    
    .GorneMenu div > a::after, 
    .GorneMenu div > span::after,
    ul.GlowneGorneMenu > li > div > a::after,
    ul.GlowneGorneMenu > li > div > span::after {
        display: none !important;
        content: none !important;
        width: 0 !important;
    }
    
    .StopkaKolumny {
        display: grid !important;
        grid-template-columns: repeat(5, 1fr) !important; 
        gap: 30px !important;
        margin-bottom: 40px !important;
    }
    .KolumnaStopki { padding: 0 !important; }
}

@media (max-width: 1024px) {
    .usp-bar {
        flex-wrap: wrap !important;
        gap: 8px 20px !important;
        padding: 8px 10px !important;
    }
    .usp-return, .usp-expert { display: none !important; }
    .usp-item { font-size: 11px !important; }
}

@media only screen and (max-width: 1023px) {
    .SzukanieKoszyk > .Strona {
        display: grid !important;
        grid-template-columns: auto 1fr auto !important; 
        grid-template-areas: 
            "menu logo icons"
            "search search search" !important;
        gap: 10px !important;
        padding: 10px !important;
        height: auto !important;
        align-items: center !important;
    }

    .SzukanieKoszyk > .Strona::before { display: none !important; }
    
    #LinkLogo {
        grid-area: logo !important;
        position: absolute !important;
        top: 17% !important;
        left: auto !important;
        transform: none !important;
        width: 100% !important;
        max-width: 160px !important;
        height: 45px !important;
        margin: 0 auto !important;
        background-position: center !important;
    }

    .IkonyNawigacja .MenuNaglowek {
        grid-area: menu !important;
        margin: 0 !important;
    }

    .SzukanieKoszyk > .Strona > .IkonyNawigacja {
        grid-area: icons !important;
        display: flex !important;
        justify-content: flex-end !important;
        gap: 5px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .SzukanieKoszyk > .Strona > .Wyszukiwanie {
        grid-area: search !important;
        display: block !important; 
        width: 100% !important;
        margin: 5px 0 0 0 !important;
        max-width: 100% !important;
    }
    
    .KontenterWyszukiwania .RamkaSzukania {
        height: 44px !important; 
    }

    .SzukajNaglowek, .OpisNaglowek, .usp-bar, .NaglowekDaneKontaktowe { 
        display: none !important; 
    }

    .IkonyNawigacja .IkonaNaglowek,
    .IkonyNawigacja label.LogowanieMenuLabel,
    .IkonyNawigacja label.SzukajMenuLabel {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        border-radius: 10px !important;
        margin: 0 !important;
    }

    .IkonyNawigacja span.PozycjaIkonka {
        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;
        min-height: 20px !important;
        background-size: 20px 20px !important;
    }

    .IkonyNawigacja span.PozycjaIlosc, 
    .IkonyNawigacja span.KoszykIlosc {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        line-height: 18px !important;
        font-size: 10px !important;
        top: -4px !important;
        right: -4px !important;
    }
    
    /* Off-canvas menu fixes */
    .MenuMobilneCheckbox:checked ~ .GorneMenuKontener {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background-color: rgba(15, 23, 42, 0.7) !important; 
        z-index: 10000 !important;
    }

    .GorneMenuTlo {
        background: #ffffff !important;
        box-shadow: 5px 0 25px rgba(0,0,0,0.15) !important;
        width: 85% !important;
        max-width: 380px !important;
        height: 100vh !important;
        z-index: 10001 !important;
    }

    #IkonaZwinieciaMenu {
        background-color: var(--kolor-szablonu) !important;
        border-radius: 50% !important;
        width: 44px !important;
        height: 44px !important;
        right: -55px !important; 
        top: 15px !important;
        background-size: 20px 20px !important;
        filter: var(--filtr-bialy) !important;
        box-shadow: 0 4px 10px rgba(0,0,0,0.2) !important;
        z-index: 10005 !important;
    }

    ul.GlowneGorneMenu {
        display: flex !important;
        flex-direction: column !important; 
        align-items: stretch !important;
        padding: 20px 0 !important;
    }

    ul.GlowneGorneMenu > li {
        width: 100% !important;
        border-bottom: 1px solid var(--kolor-linia) !important;
    }

    ul.GlowneGorneMenu > li > div > a {
        display: block !important;
        padding: 15px 20px !important;
        font-size: 15px !important; 
    }

    ul.GlowneGorneMenu > li:first-child > div > a {
        background: transparent !important;
        color: var(--kolor-czarny) !important;
        padding: 15px 20px !important;
    }

    ul.GlowneGorneMenu > li:first-child > div > a::before {
        display: none !important; 
    }

    .KolumnaStopki strong.NaglowekStopki {
        border-bottom: 1px solid var(--kolor-linia) !important;
        margin-bottom: 0 !important;
        padding: 15px 10px !important;
    }
    
    .KolumnaStopki strong.NaglowekStopki::after {
        color: var(--kolor-szary-ciemny-3) !important;
    }
}

/* =========================================================================
   MODERNIZACJA WIDOKU MOBILNEGO (INSPIROWANE TOMI.PL)
   ========================================================================= */
@media (max-width: 1023px) {

    /* 1. UKRYCIE PŁYWAJĄCYCH ZAKŁADEK NA MOBILE (Poprawa użyteczności) */
    #wysZakladki {
        display: none !important;
    }

    /* 2. CZYSTY I WYŚRODKOWANY NAGŁÓWEK */
    .SzukanieKoszyk > .Strona {
        grid-template-columns: 50px 1fr auto !important; /* Wymuszenie równego podziału */
        padding: 10px 15px !important;
        background: #ffffff !important;
        row-gap: 10px !important;
    }

    /* Idealnie wyśrodkowane logo */
    #LinkLogo {
        grid-area: logo !important;
        width: 100% !important;
        max-width: 130px !important; /* Nieco mniejsze, bardziej eleganckie */
        height: 40px !important;
        margin: 0 auto !important;
        background-position: center !important;
        top: 0 !important;
    }

    /* 3. LEKKIE IKONY (BEZ RAMEK) JAK W REFERENCJI */
    .IkonyNawigacja .IkonaNaglowek,
    .IkonyNawigacja label.LogowanieMenuLabel,
    .IkonyNawigacja label.SzukajMenuLabel {
        border: none !important; /* Usunięcie ramek */
        background: transparent !important; /* Usunięcie szarego tła */
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        box-shadow: none !important;
    }

    /* Zmiana koloru ikon na bardzo ciemny szary/grafit (jak w Tomi) */
    #IkonaWysuwaniaMenu, .IkonyNawigacja span.PozycjaIkonka {
        filter: brightness(0) !important; 
    }

    /* Dopasowanie przycisku Menu (Hamburgera), by nie uciekał */
    .IkonyNawigacja .MenuNaglowek {
        justify-content: flex-start !important;
    }

    /* Dyskretniejszy bąbelek powiadomień koszyka */
    .IkonyNawigacja span.PozycjaIlosc, 
    .IkonyNawigacja span.KoszykIlosc {
        width: 16px !important;
        height: 16px !important;
        min-width: 16px !important;
        line-height: 14px !important;
        font-size: 10px !important;
        top: 0px !important;
        right: 0px !important;
        border: 2px solid #ffffff !important;
    }

    /* 4. SUBTELNIEJSZA WYSZUKIWARKA */
    .SzukanieKoszyk > .Strona > .Wyszukiwanie {
        margin: 0 !important;
    }
    
    .KontenterWyszukiwania .RamkaSzukania {
        background: #F4F6F8 !important; /* Delikatny jasnoszary kolor bez ostrych krawędzi */
        height: 44px !important;
        border-radius: 8px !important; /* Zaokrąglone rogi, ale nie pełna "pigułka" */
    }

    #InSzukaj {
        font-size: 14px !important;
        padding: 0 10px 0 15px !important;
    }

    /* 5. KOMPAKTOWE I NOWOCZESNE KARTY PRODUKTU */
    .ProduktOkno {
        padding: 15px 12px !important;
        border-radius: 16px !important; /* Gładsze rogi w stylu Tomi */
        border: none !important;
        background: #ffffff !important;
        box-shadow: 0 4px 15px rgba(0,0,0,0.04) !important; /* Ledwo widoczny, luksusowy cień */
        margin: 5px 5px 20px 5px !important;
    }

    /* Zmniejszenie wysokości zdjęcia, by karta była zgrabniejsza */
    .ProduktOkno .Foto {
        height: 130px !important;
        flex: 0 0 130px !important;
        padding: 0 0 10px 0 !important;
    }
    .ProduktOkno .Foto img {
        max-height: 120px !important;
    }

    /* Ciaśniejszy tekst i cena */
    .ProduktOkno h3 {
        height: auto !important;
        min-height: 38px !important;
        margin-bottom: 8px !important;
    }
    .ProduktOkno h3 a {
        font-size: 12px !important;
        -webkit-line-clamp: 2 !important; /* Ucięcie nazwy produktu do max 2 linijek */
    }

    .ProduktOkno .CenaProduktu {
        height: auto !important;
        flex: 0 0 auto !important;
        padding: 0 0 12px 0 !important;
    }
    .ProduktOkno .CenaAktualna {
        font-size: 19px !important;
    }

    /* Przycisk koszyka i schowek */
    .ProduktOkno .SchowekKontener {
        padding: 0 0 8px 0 !important;
    }
    .ProduktOkno .Schowek {
        font-size: 10px !important;
        padding-left: 18px !important;
        background-size: 12px 12px !important;
    }

    .ProduktOkno .Zakup {
        gap: 6px !important;
    }
    .ProduktOkno .DoKoszyka {
        height: 40px !important;
        font-size: 11px !important;
        border-radius: 8px !important;
        font-weight: 800 !important;
    }
    .ProduktOkno .InputIlosc {
        height: 40px !important;
        width: 40px !important;
        flex: 0 0 40px !important;
        border-radius: 8px !important;
    }
    
    /* 6. LIFTING PASKA "OSTATNIO OGLĄDANE" */
    #PrzyklejOstatnieProd {
        border-radius: 16px 16px 0 0 !important; /* Zaokrąglenie od góry */
        background: #1E293B !important; /* Ciemny, elegancki grafit */
        color: #ffffff !important;
        border: none !important;
    }
    #PrzyklejOstatnieProd .Rozwiniecie {
        color: #ffffff !important;
        font-size: 13px !important;
    }
}
/* =========================================================================
   PERFEKCYJNY WIDOK MOBILNY (STICKY HEADER + TELEFON + FIX LUPKI)
   ========================================================================= */
@media (max-width: 1023px) {
    
    /* 1. STICKY HEADER - Naprawa obcinania i przyklejenie */
    body, .CalaStrona {
        overflow: unset !important;
        overflow-x: clip !important; /* Pozwala na sticky, blokując rozjazd na boki */
    }
    
    .SklepNaglowek {
        position: -webkit-sticky !important; /* Wsparcie dla iPhone/Safari */
        position: sticky !important;
        top: -1px !important;
        z-index: 9990 !important;
        background: #ffffff !important;
        box-shadow: 0 4px 15px rgba(0,0,0,0.06) !important;
        width: 100% !important;
        margin: 0 !important;
    }

    /* 2. BAZOWY KONTENER (Ścieśniamy marginesy, żeby wszystko zmieścić) */
    .SzukanieKoszyk > .Strona {
        display: flex !important;
        flex-wrap: wrap !important;
        padding: 10px !important; 
        background: #ffffff !important;
        position: relative !important;
        align-items: center !important;
    }

    /* 3. PASEK IKON (Hamburger z lewej, reszta z prawej) */
    .SzukanieKoszyk > .Strona > .IkonyNawigacja {
        display: flex !important;
        width: 100% !important;
        align-items: center !important;
        justify-content: flex-end !important; 
        gap: 6px !important; /* Ciasne, zgrabne odstępy */
        margin: 0 !important;
        padding: 0 !important;
    }

    .SzukajNaglowek { display: flex !important; }

    /* TWÓRCA MAGII: Hamburger idzie maksymalnie na lewo */
    .IkonyNawigacja .MenuNaglowek {
        margin-right: auto !important; 
        margin-left: 0 !important;
    }

    /* TWÓRCA MAGII 2: Robimy "Dziurę" przed Lupką na włożenie Telefonu (42px) */
    .IkonyNawigacja .SzukajNaglowek {
        margin-left: 42px !important; 
        margin-right: 0 !important;
    }

    /* Wygląd Ikon (zmniejszone do 34px) */
    .IkonyNawigacja .IkonaNaglowek,
    .IkonyNawigacja label.LogowanieMenuLabel,
    .IkonyNawigacja label.SzukajMenuLabel {
        border: none !important;
        background: transparent !important;
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* MORDERCA SKAKANIA LUPKI (Zerujemy wszystkie animacje ShopGolda) */
    .IkonyNawigacja label.SzukajMenuLabel,
    .IkonyNawigacja label.SzukajMenuLabel:hover,
    .IkonyNawigacja label.SzukajMenuLabel:active,
    .IkonyNawigacja label.SzukajMenuLabel:focus,
    .SzukajMenuCheckbox:checked ~ label.SzukajMenuLabel {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        transform: none !important;
        top: 0 !important;
        left: 0 !important;
        position: relative !important;
        margin: 0 !important;
    }

    /* Ciemny grafit wszystkich ikon (Premium Look) */
    .IkonyNawigacja span.PozycjaIkonka {
        filter: invert(12%) sepia(21%) saturate(1478%) hue-rotate(186deg) brightness(97%) contrast(96%) !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        background-size: 22px 22px !important;
        margin: 0 auto !important;
    }

    /* Bąbelek powiadomień koszyka */
    .IkonyNawigacja span.PozycjaIlosc, 
    .IkonyNawigacja span.KoszykIlosc {
        width: 16px !important;
        height: 16px !important;
        min-width: 16px !important;
        line-height: 14px !important;
        font-size: 9px !important;
        top: 0px !important;
        right: -2px !important;
        border: 2px solid #ffffff !important;
    }

    /* 4. TELEFON (Idealnie wpasowany w wyrwę obok lupy) */
    .SklepNaglowek .NaglowekTop > .Strona:last-child {
        display: block !important;
        position: absolute !important;
        top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
        pointer-events: none !important;
        margin: 0 !important; padding: 0 !important;
        background: transparent !important;
        z-index: 105 !important;
    }
    
    .NaglowekDaneKontaktowe {
        display: flex !important;
        position: absolute !important;
        top: 20px !important;
        right: 120px !important;
        height: 22px !important;
        width: 32px !important;
        align-items: center !important;
        justify-content: center !important;
        pointer-events: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Ukrywamy cyfry, pokazujemy grafitową słuchawkę */
    .LinkTelefonNaglowek {
        font-size: 0 !important; 
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important; margin: 0 !important;
        background: transparent !important;
    }
    .LinkTelefonNaglowek::before {
        margin: 0 !important;
        /* ZMNIEJSZENIE I "ODCHUDZENIE" IKONY TELEFONU */
        transform: scale(0.9) !important;
        font-weight: 400 !important;
        filter: invert(12%) sepia(21%) saturate(1478%) hue-rotate(186deg) brightness(97%) contrast(96%) !important;
    }

    /* 5. LOGO (Zamknięte w bezpiecznej, lewej strefie) */
    .SklepNaglowek .NaglowekTop > .Logo.Strona {
        position: absolute !important;
        top: 6px !important;
        left: 65px !important;
        right: 245px !important;
        height: 50px !important;
        width: auto !important;
        transform: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        z-index: 100 !important;
        pointer-events: none !important;
        margin: 0 !important;
    }

    #LinkLogo {
        pointer-events: auto !important;
        width: 100% !important;
        max-width: 110px !important;
        height: 100% !important;
        background-position: left center !important; /* Logo przysuwa się do Menu */
        background-size: contain !important;
        margin: 0 !important;
        position: relative !important;
        top: auto !important; left: auto !important; transform: none !important;
    }

    /* 6. WYSZUKIWARKA (Wysuwa się bez pulsowania) */
    .SzukanieKoszyk > .Strona > .Wyszukiwanie {
        display: none !important; 
        width: 100% !important;
        max-width: 100% !important;
        margin: 10px 0 0 0 !important;
        order: 10 !important;
    }

    #SzukajMenuCheckbox:checked ~ .Wyszukiwanie {
        display: block !important;
        animation: rozwinSzukajke 0.3s ease-out forwards;
    }

    .KontenterWyszukiwania .RamkaSzukania {
        background: #F4F6F8 !important;
        height: 44px !important;
        border-radius: 8px !important;
        border: 1px solid var(--kolor-linia) !important;
        box-shadow: none !important; /* Blokada cienia */
        transition: border-color 0.2s ease !important;
    }

    .KontenterWyszukiwania .RamkaSzukania:focus-within {
        border-color: var(--kolor-szablonu) !important;
        box-shadow: none !important; /* Blokada pulsowania */
        background: #ffffff !important;
    }

    #InSzukaj {
        font-size: 14px !important;
        padding: 0 10px 0 15px !important;
    }
    
    .IkonaNawigacjiMenu{
      margin: 0 !important;
    }
    
    .IkonaNawigacjiMenu.SzukajNaglowek {
      margin-right: 32px !important;
    }

    /* ==========================================================
       7. FIX MENU MOBILNEGO (USUNIĘCIE NIEBIESKIEGO "KATEGORIE")
       ========================================================== */
    ul.GlowneGorneMenu > li:first-child > div > a {
        background: transparent !important; /* Zdejmuje niebieskie tło */
        color: #111827 !important; /* Nadaje ciemny grafitowy kolor tekstu */
        padding: 15px 20px !important; /* Wraca do standardowych marginesów wiersza */
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    ul.GlowneGorneMenu > li:first-child > div > a::before {
        display: none !important; /* Usuwa białą ikonkę hamburgera z napisu */
    }
    ul.GlowneGorneMenu > li:first-child:hover > div > a {
        background: #F4F7FB !important; /* Szare podświetlenie przy naciśnięciu palcem */
        color: #3A82C4 !important;
        transform: none !important;
        box-shadow: none !important;
    }
}

/* Przyjemna animacja wyjeżdżania wyszukiwarki */
@keyframes rozwinSzukajke {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* === MIGRATED FROM KOD_HEAD INLINE STYLE === */
#LinkiPowiazaneProduktu ul li img { max-width: 100px !important; }

/* =========================================================================
   V2.1 - LISTING / KATEGORIE (DODAJ NA SAMYM KONCU PLIKU)
   ========================================================================= */

.Listing { margin: 0 0 22px 0 !important; }

.Listing .OpisListing {
    background: #fff !important;
    border: 1px solid var(--kolor-linia) !important;
    border-radius: 14px !important;
    padding: 18px !important;
    margin-bottom: 16px !important;
    display: flex !important;
    gap: 20px !important;
    align-items: flex-start !important;
}
.Listing .OpisListing::after { display: none !important; }

.Listing .OpisListing .ZdjecieListing {
    flex: 0 0 120px !important;
    margin: 0 !important;
    float: none !important;
}
.Listing .OpisListing .ZdjecieListing img {
    width: 120px !important;
    height: 120px !important;
    object-fit: contain !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    mix-blend-mode: multiply !important;
}

/* Text block — collapsible */
.Listing .OpisListingGorny {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    position: relative !important;
}
.Listing .OpisListingGorny:not(.is-expanded) {
    max-height: 13em !important;
    overflow: hidden !important;
}
.Listing .OpisListingGorny:not(.is-expanded)::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important; left: 0 !important; right: 0 !important;
    height: 2em !important;
    background: linear-gradient(transparent, #fff) !important;
    pointer-events: none !important;
}
/* Button sits below the card, not inside the flex row */
.listing-opis-toggle {
    display: block !important;
    margin: -8px 0 12px 0 !important;
    padding: 6px 0 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--kolor-szablonu) !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    font-family: inherit !important;
    text-align: left !important;
}
.listing-opis-toggle:hover {
    color: var(--kolor-szablonu-2) !important;
    background: none !important;
    text-decoration: underline !important;
}

/* Podkategorie */
.Listing .Podkategorie {
  background: var(--tlo-szare) !important;
  border: none !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
  margin-bottom: 16px !important;
}
.Listing .Podkategorie strong {
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  color: var(--kolor-szary-ciemny) !important;
  margin: 0 0 10px 0 !important;
  display: block !important;
}
.Listing .Podkategorie ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
.Listing .Podkategorie ul li {
    display: block !important;
    width: auto !important;
    padding: 0 !important;
}
.Listing .Podkategorie ul.KategoriaBezZdjecia a,
.Listing .Podkategorie ul.KategoriaZdjecie a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: #fff !important;
    padding: 5px 13px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--kolor-szary-ciemny-3) !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.07), 0 0 0 1px rgba(0,0,0,.04) !important;
    transition: background 0.15s, color 0.15s, box-shadow 0.15s !important;
}
.Listing .Podkategorie ul.KategoriaBezZdjecia a:hover,
.Listing .Podkategorie ul.KategoriaZdjecie a:hover {
    background: var(--kolor-szablonu) !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(58, 130, 196, .35) !important;
}
.Listing .Podkategorie a em {
    font-style: normal !important;
    font-size: 10px !important;
    color: var(--kolor-szary-ciemny) !important;
    font-weight: 500 !important;
}
.Listing .Podkategorie ul.KategoriaBezZdjecia a:hover em,
.Listing .Podkategorie ul.KategoriaZdjecie a:hover em {
    color: rgba(255,255,255,.75) !important;
}

/* Collapse: hide items beyond first row (~12) when not expanded */
.Listing .PodkategoreLista.podkat-collapsed li:nth-child(n+13) { display: none !important; }

.podkat-toggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-top: 10px !important;
    padding: 0 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: var(--kolor-szablonu) !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    font-family: inherit !important;
}
.podkat-toggle:hover { color: var(--kolor-szablonu-2) !important; background: none !important; text-decoration: underline !important; }

/* Pasek sterowania listingiem */
.Listing .ListingNawigacja {
  background: #fff !important;
  border: 1px solid var(--kolor-linia) !important;
  border-radius: 14px !important;
  padding: 10px 14px !important;
  margin-bottom: 14px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 20px !important;
  align-items: center !important;
}
.Listing .SposobWyswietlania { display: none !important; }

.Listing .IndexStron,
.Listing .Sortowanie,
.Listing .IloscProdStronie {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  float: none !important;
  margin: 0 !important;
  width: auto !important;
}
/* Override ShopGold breakpoint font-size inflation */
.Listing .IndexStron *,
.Listing .Sortowanie *,
.Listing .IloscProdStronie * {
  font-size: 13px !important;
  margin: 0 !important;
}
/* Labels */
.Listing .Sortowanie b,
.Listing .IloscProdStronie b,
.Listing .IndexStron b {
  display: inline !important;
  font-weight: 600 !important;
  color: var(--kolor-szary-ciemny) !important;
  white-space: nowrap !important;
  margin-right: 2px !important;
}
/* "z N" span inside IndexStron */
.Listing .IndexStron span {
  color: var(--kolor-szary-ciemny) !important;
  margin: 0 !important;
}
/* Sort select */
.Listing .Sortowanie select {
  height: 30px !important;
  padding: 0 8px !important;
  border: 1px solid var(--kolor-linia) !important;
  border-radius: 8px !important;
  background: var(--kolor-szary-jasny) !important;
  color: var(--kolor-szary-ciemny-3) !important;
  cursor: pointer !important;
}
/* Sort links */
.Listing .Sortowanie ul { margin: 0 !important; display: inline-flex !important; gap: 4px !important; }
/* Page & per-page buttons */
.Listing .IndexStron a,
.Listing .IloscProdStronie span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 28px !important;
  height: 28px !important;
  padding: 0 6px !important;
  background: var(--kolor-szary-jasny) !important;
  border: 1px solid var(--kolor-linia) !important;
  color: var(--kolor-szary-ciemny-3) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  cursor: pointer !important;
}
.Listing .IndexStron a:hover,
.Listing .IloscProdStronie span:hover {
  border-color: var(--kolor-szablonu) !important;
  color: var(--kolor-szablonu) !important;
  background: #fff !important;
}
.Listing .IndexStron a.Aktywna,
.Listing .IloscProdStronie span.Tak {
  background: var(--kolor-szablonu) !important;
  border-color: var(--kolor-szablonu) !important;
  color: #fff !important;
}

/* Filtry */
.Listing .ListingFiltry {
  background: #f8fbff !important;
  border: 1px solid var(--kolor-linia) !important;
  border-radius: 14px !important;
  padding: 14px !important;
  margin-bottom: 16px !important;
}
.Listing .ListingFiltry strong {
  margin: 0 0 10px 0 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  font-family: inherit !important;
  text-transform: uppercase !important;
  color: var(--kolor-szary-ciemny-3) !important;
}
.Listing .ListingFiltry .Multi span {
  border: 1px solid var(--kolor-linia) !important;
  border-radius: 10px !important;
  background-color: #fff !important;
  padding: 10px 34px 10px 10px !important;
}
.Listing .ListingFiltry .Multi .Wybor {
  border: 1px solid var(--kolor-linia) !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .08) !important;
}
.Listing .ListingFiltry input[type="text"],
.Listing .ListingFiltry input[type="number"],
.Listing .ListingFiltry select {
  height: 40px !important;
  border: 1px solid var(--kolor-linia) !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--kolor-czarny) !important;
}
.Listing .ListingFiltry .Rg a {
  background: none !important;
  border: 1px solid var(--kolor-linia) !important;
  border-radius: 10px !important;
  padding: 8px 12px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
.Listing .ListingFiltry .Rg a:hover {
  border-color: var(--kolor-akcent) !important;
  color: var(--kolor-akcent) !important;
}

/* Siatka produktów w listingu */
.Listing .Okno,
.Listing .Wiersz {
  border-right: none !important;
  border-bottom: none !important;
  padding: 8px !important;
}
.Listing .Okno .Zobacz { display: none !important; } /* usuwa stary overlay "zobacz szczegóły" */
.Listing .Okno .ProduktOkno { margin: 0 !important; height: 100% !important; }

@media (max-width: 1023px) {
  .Listing .OpisListing { padding: 12px !important; gap: 12px !important; }
  .Listing .OpisListing .ZdjecieListing { flex: 0 0 80px !important; }
  .Listing .OpisListing .ZdjecieListing img { width: 80px !important; height: 80px !important; }

  /* Subcategories already wrap on mobile as flex, no changes needed */

  .Listing .ListingNawigacja { flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; padding: 10px 12px !important; }
  .Listing .IndexStron,
  .Listing .Sortowanie,
  .Listing .IloscProdStronie { width: 100% !important; }

  .Listing .ListingFiltry { padding: 10px !important; }
  .Listing .ListingFiltry .Multi,
  .Listing .ListingFiltry .ZakresCen,
  .Listing .ListingFiltry .Rg {
    float: none !important;
    width: 100% !important;
    margin: 0 0 8px 0 !important;
  }
  .Listing .ListingFiltry .Multi span,
  .Listing .ListingFiltry input,
  .Listing .ListingFiltry select { width: 100% !important; }
}

@media (max-width: 1023px) {
  .Listing .ListingFiltry {
    padding: 0 !important;
    overflow: hidden !important;
  }

  .Listing .ListingFiltry .listing-filtry-toggle {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border: 0 !important;
    border-bottom: 1px solid var(--kolor-linia) !important;
    background: #ffffff !important;
    color: var(--kolor-szary-ciemny-3) !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: .03em !important;
    padding: 12px 14px !important;
    border-radius: 0 !important;
  }

  .Listing .ListingFiltry .listing-filtry-toggle .arrow {
    width: 10px;
    height: 10px;
    border-right: 2px solid var(--kolor-szary-ciemny-3);
    border-bottom: 2px solid var(--kolor-szary-ciemny-3);
    transform: rotate(45deg);
    transition: transform .2s ease;
  }

  .Listing .ListingFiltry:not(.is-collapsed) .listing-filtry-toggle .arrow {
    transform: rotate(-135deg);
  }

  .Listing .ListingFiltry .listing-filtry-content {
    padding: 10px !important;
  }
}

/* =========================================================================
   V2.2 - FIX: PRZYCISK "DO KOSZYKA" + LINIE MIĘDZY PRODUKTAMI
   ========================================================================= */

/* 1) Usunięcie separatorów/kresek z legacy listingu */
.Listing .OknaFlexRwd::before,
.Listing .OknaFlexRwd::after,
.Listing .Okno::before,
.Listing .Okno::after,
.Listing .Wiersz::before,
.Listing .Wiersz::after,
.Listing .ElementOknoRamka::before,
.Listing .ElementOknoRamka::after {
  display: none !important;
  content: none !important;
}

.Listing .Okno,
.Listing .Wiersz,
.Listing .ElementOknoRamka,
.Listing .OknoFlex .ElementOknoRamka,
.Listing .OknaFlexRwd > div,
.Listing .OknaFlexRwd > li {
  border: 0 !important;
  border-right: 0 !important;
  border-left: 0 !important;
  border-bottom: 0 !important;
}

/* === HOMEPAGE CATEGORY GRID === */

/* Allow hover lift animation to not get clipped */
.ModulCssDodatkowy .Strona {
    overflow: visible !important;
}

/* ShopGold sets background-clip:content-box on KategoriaOkno cards, which makes
   the white background stop at the padding edge — border area shows page-bg (gray).
   Override to border-box so white fills all the way to the border. */
.ModulCssDodatkowy .ElementOknoRamka {
    background-clip: border-box !important;
    border: 1px solid #dfe8f2 !important;
}

/* Compact card — column layout, centered icon+label */
.ModulCssDodatkowy .ElementOknoRamka > a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    min-height: 0 !important;
    padding: 20px 10px 16px !important;
    gap: 12px !important;
}

/* Icon container — center the image inside */
.ModulCssDodatkowy .GrafikaKategoria {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 96px !important;
    height: 96px !important;
    border-radius: 20px !important;
}

.ModulCssDodatkowy .GrafikaKategoria img {
    max-width: 76px !important;
    max-height: 76px !important;
}

/* Name — full width, readable size */
.ModulCssDodatkowy .NazwaKategoria {
    font-size: 14px !important;
    max-width: 100% !important;
    line-height: 1.3 !important;
}

/* Hover: use brand pink instead of blue */
.ModulCssDodatkowy .ElementOknoRamka:hover .NazwaKategoria {
    color: var(--kolor-akcent) !important;
}

/* Mobile: 2 columns instead of 3 — labels become readable */
@media (max-width: 768px) {
    .ModulCssDodatkowy .OknaFlexRwd {
        gap: 12px !important;
        padding: 0 4px !important;
    }

    .ModulCssDodatkowy .KategoriaOkno {
        width: calc(50% - 6px) !important;
        flex: 0 0 calc(50% - 6px) !important;
        margin: 0 !important;
    }

    .ModulCssDodatkowy .ElementOknoRamka > a {
        padding: 16px 12px 14px !important;
        gap: 10px !important;
    }

    .ModulCssDodatkowy .GrafikaKategoria {
        width: 80px !important;
        height: 80px !important;
        border-radius: 16px !important;
    }

    .ModulCssDodatkowy .GrafikaKategoria img {
        max-width: 64px !important;
        max-height: 64px !important;
    }

    .ModulCssDodatkowy .NazwaKategoria {
        font-size: 14px !important;
        max-width: 100% !important;
    }
}

/* === COOKIE BANNER: slim bottom bar (positioning via JS in custom.js) === */

/* Overlay — make transparent so only the bar is visible */
#InfoCookie {
  background: transparent !important;
  pointer-events: none !important;
}

/* Inner bar — visual styling only; JS sets position/transform */
#InfoCookieProste {
  pointer-events: auto !important;
  background: rgba(28, 28, 28, 0.96) !important;
  padding: 12px 24px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
  max-width: none !important;
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.4) !important;
}

.CookieTekst {
  flex: 1 !important;
  color: #d0d0d0 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

.InfoCookiePrzycisk {
  flex-shrink: 0 !important;
}

#InfoAkcept.przyciskCookie {
  display: inline-block !important;
  padding: 8px 20px !important;
  background: var(--clr-primary) !important;
  color: #fff !important;
  border-radius: var(--radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: opacity 0.2s !important;
  text-decoration: none !important;
}

#InfoAkcept.przyciskCookie:hover {
  opacity: 0.85 !important;
}

@media (max-width: 600px) {
  #InfoCookieProste {
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 10px 16px !important;
    gap: 10px !important;
  }

  .CookieTekst {
    font-size: 12px !important;
  }

  #InfoAkcept.przyciskCookie {
    display: block !important;
    text-align: center !important;
    padding: 10px !important;
  }
}

/* === FIX: LOGO/SEARCH OVERLAP ON NARROW PHONES (≤400px) === */
@media (max-width: 400px) {
    #LinkLogo {
        max-width: 75px !important;
    }
}

@media (max-width: 380px) {
    #LinkLogo {
        max-width: 65px !important;
    }
}

/* === NOWOŚCI MODULE (ModulId-35) CARD FIX ===
   Equal-height fix: flex chain must use flex:1 (not height:100%) at each level.
   height:100% requires parent to have an explicit height; flex:1 works without it.
   ============================================ */

/* Steps 1-2: grid container+items — desktop only.
   On mobile we leave ShopGold's carousel JS in control (flex-wrap:wrap breaks sliding). */
@media (min-width: 641px) {
    .ModulId-35 .OknaFlexRwd {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: stretch !important;
    }
    .ModulId-35 .OknaFlexRwd .OknoFlex,
    .ModulId-35 .OknaFlexRwd .ProduktOkno {
        display: flex !important;
        flex-direction: column !important;
    }
}
/* Step 3: transparent outer wrapper, no card styling */
.ModulId-35 .ProduktOkno {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    padding: 8px !important;
    margin: 0 !important;
}
.ModulId-35 .ProduktOkno:hover {
    transform: none !important;
    box-shadow: none !important;
    border-color: transparent !important;
}
/* Step 4: ElementOknoRamka is the card — flex:1 fills full column height */
.ModulId-35 .ProduktOkno .ElementOknoRamka {
    margin: 0 !important;
    border: 1px solid #dfe8f2 !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #fff 0%, #fbfdff 100%) !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05), 0 2px 8px rgba(15, 23, 42, 0.035) !important;
    overflow: hidden !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
.ModulId-35 .ProduktOkno:hover .ElementOknoRamka {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.10), 0 4px 12px rgba(15, 23, 42, 0.05) !important;
    border-color: var(--kolor-szablonu) !important;
}
/* Step 5: h3 stretches → price/buy always at bottom; name clamped to 2 lines, centered */
.ModulId-35 .ProduktOkno h3 {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 12px !important;
}
.ModulId-35 .ProduktOkno h3 a {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-align: center !important;
}

/* === NOWOŚCI MODULE — MOBILE HEADER ===
   On narrow screens: stack title + link vertically,
   shrink title, hide the long subtitle to save space.
   ============================================ */
@media (max-width: 640px) {
    .ModulId-35 .StrNaglowek {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        margin-bottom: 16px !important;
    }
    .ModulId-35 .StrNaglowek span span {
        font-size: 26px !important;
    }
    /* Hide the long subtitle on mobile — takes too much vertical space */
    .ModulId-35 .StrNaglowek i {
        display: none !important;
    }
    /* Right-align the link so it sits opposite to the title */
    .ModulId-35 .NowosciWszystkie {
        font-size: 13px !important;
        align-self: flex-end !important;
    }
}

/* === BREADCRUMB: hide on homepage ===
   standardowy-d template renders #Nawigacja on ALL pages unconditionally.
   Homepage breadcrumb has only 1 item (no itemprop position="2").
   CSS :has() is supported in all modern browsers (Chrome 105+, Safari 15.4+, FF 121+).
   ========================================== */
#Nawigacja:not(:has([content="2"])) {
    display: none !important;
}

/* === CART COUNT BADGE ===
   The compiled theme CSS already styles .IkonaNawigacjiMenu .IkonaNaglowek span.PozycjaIlosc
   but the cart template (#Koszyk) doesn't include that span — custom.js injects it.
   display:flex + equal min-width/height guarantees a circle on both mobile and desktop.
   ========================================== */
#Koszyk .IkonaNaglowek .PozycjaIlosc {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    background: var(--kolor-akcent) !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
    border-radius: 10px !important;
    min-width: 20px !important;
    height: 20px !important;
    padding: 0 4px !important;
    font-family: 'Manrope', system-ui, sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    top: -4px !important;
    right: -6px !important;
}

/* === BESTSELLERY MODULE (ModulId-32) ===
   Grid: 4 columns on desktop, 2 columns on mobile showing only 4 items (2×2).
   Card styling mirrors nowości — single ElementOknoRamka card, no double box.
   Equal heights: OknaFlexRwd stretches items, h3 fills remaining space above price.
   ========================================== */

/* Force 4-column grid — overrides ShopGold's default 3-col setting */
.ModulId-32 .OknaFlexRwd {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
}
.ModulId-32 .OknaFlexRwd .OknoFlex,
.ModulId-32 .OknaFlexRwd .ProduktOkno {
    width: 25% !important;
    flex: 0 0 25% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Card container: transparent outer, ElementOknoRamka is the card */
.ModulId-32 .ProduktOkno {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 8px !important;
}
.ModulId-32 .ProduktOkno:hover {
    transform: none !important;
    box-shadow: none !important;
    border-color: transparent !important;
}
.ModulId-32 .ProduktOkno .ElementOknoRamka {
    margin: 0 !important;
    border: 1px solid #dfe8f2 !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #fff 0%, #fbfdff 100%) !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05), 0 2px 8px rgba(15, 23, 42, 0.035) !important;
    overflow: hidden !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
.ModulId-32 .ProduktOkno:hover .ElementOknoRamka {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.10), 0 4px 12px rgba(15, 23, 42, 0.05) !important;
    border-color: var(--kolor-szablonu) !important;
}
/* h3 stretches → price/buy always at bottom; name clamped to 2 lines, centered */
.ModulId-32 .ProduktOkno h3 {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 12px !important;
}
.ModulId-32 .ProduktOkno h3 a {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-align: center !important;
}

/* Mobile: 2 columns, hide items 5-8 → 2×2 grid */
@media (max-width: 640px) {
    /* Ensure container stretches rows and has no extra padding/gap */
    .ModulId-32 .OknaFlexRwd {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: stretch !important;
        padding: 0 !important;
        gap: 0 !important;
    }
    /* Grid items: 2 columns, flex column for height chain */
    .ModulId-32 .OknaFlexRwd .OknoFlex,
    .ModulId-32 .OknaFlexRwd .ProduktOkno,
    .ModulId-32 .OknaFlexRwd > div {
        width: 50% !important;
        flex: 0 0 50% !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        margin: 0 !important;
    }
    .ModulId-32 .StrNaglowek {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        margin-bottom: 16px !important;
    }
    .ModulId-32 .StrNaglowek span span {
        font-size: 26px !important;
    }
    .ModulId-32 .StrNaglowek i {
        display: none !important;
    }
    .ModulId-32 .BestsellerzyWszystkie {
        font-size: 13px !important;
        align-self: flex-end !important;
    }
    /* Reduce card padding on mobile to keep items within 50% */
    .ModulId-32 .ProduktOkno {
        padding: 4px !important;
    }
    /* Show only first 4 items (2×2) */
    .ModulId-32 .OknaFlexRwd .OknoFlex:nth-child(n+5),
    .ModulId-32 .OknaFlexRwd .ProduktOkno:nth-child(n+5),
    .ModulId-32 .OknaFlexRwd > div:nth-child(n+5) {
        display: none !important;
    }
}