/* =====================================================================
   KLARKÄLLA – custom CSS (child theme: hello-elementor-child/assets/css/klarkalla.css)
   Wersja: tylko elementy już użyte na stronie · 07.10.2026

   Klasy nadawane ręcznie (Advanced → CSS Classes):
     kk-ticker    – kontener rotatora w top barze (w nim 3 kontenery z komunikatami)
     kk-dropdown  – kontener w dropdownie „Produkter” (widget Menu)
     kk-search    – widget Search w headerze
     kk-glass     – półprzezroczysty panel „szkło” na kaflu ze zdjęciem
     kk-cat-img   – kafel kategorii ze zdjęciem (zoom + cały kafel klikalny)
     kk-glass-tm  – „szkło” pod treścią banera w hero, tylko tablet i telefon
     kk-pimg      – zdjęcie w karcie produktu (kwadrat, cover)
     kk-tag       – plakietka „Nyhet” w karcie produktu (tag produktu)
     kk-push-bottom – przycisk w karcie produktu wyrównany do dołu
     kk-scroll    – Loop Grid przewijany palcem (karuzela) na telefonie
     kk-hscroll   – kontener (Grid/Flexbox) przewijany palcem na telefonie
     kk-checklist – Icon List z ikoną w różowym kółku
     kk-form      – formularz Elementor (padding pól, focus, placeholder)
     kk-faq       – FAQ (Nested Accordion): pytanie i odpowiedź w jednej karcie
     kk-reviews   – Reviews: strzałki w kółku, kropki-pigułki, cudzysłów
     kk-carousel  – Loop Carousel (np. pakiety): strzałki w kółku, kropki-pigułki
     kk-paket     – Loop Carousel pakietów: paski + strzałki nad kartą (razem z kk-carousel)
     kk-pmedia    – duże zdjęcie w karcie pakietu
     kk-save      – plakietka „Spara X %” (tag produktu spara-…)
     kk-thumbs    – miniatury zawartości pakietu z plusami (Basic Gallery)
     kk-pprice    – cena w karcie pakietu (przekreślona + duża różowa)
     kk-count     – „Paket · X produkter” w karcie pakietu (tag produktu „X produkter”)
     kk-paket-panel – jasny panel obok karuzeli pakietów (białe kółka w checkliście)
     kk-news      – newsletter w stopce: pole + przycisk w jednej pigułce (Elementor Form)
     kk-account   – ikona konta w headerze (kółko 44 px na tablecie i telefonie)
     kk-anchors   – kontener z kotwicami na stronie produktu (przewijany rząd bez paska)
     kk-checklist--white – wariant kk-checklist z białymi kółkami (na kolorowym tle, np. nagłówek kategorii)
     kk-guide     – sekcja poradnika pod produktami (ACF „guide”) z przyciskiem kk-more („Visa mer”)
     kk-chips     – chipy kategorii (widget WordPress Menu) na stronie Produkter
     kk-pdp-main  – lewa kolumna strony produktu (na telefonie: box zakupowy między galerią a treściami)

   Klasa nadawana automatycznie (skrypt w Elementor → Custom Code):
     kk-current   – bieżąca strona / kategoria w menu

   Bez własnych klas (celujemy w klasy Elementora):
     widget Menu (tablet/mobile), widget Menu Cart (przycisk + boczny panel)
   ===================================================================== */


/* =====================================================================
   1. ZMIENNE – paleta (nazwy = Global Colors w Elementorze)
   ===================================================================== */
:root{
  /* Pinks */
  --pink-deep:#9C3D59;
  --pink-strong:#BF5070;
  --pink-medium:#D6728D;
  --pink-soft:#E58FA3;
  --pink-pale:#F2C4CE;
  --pink-blush:#F7DDE2;
  --pink-mist:#FDF0F2;
  /* Greens */
  --green-forest-night:#173A2A;
  --green-forest:#1F4A36;
  --green-pine:#2B5E45;
  --green-leaf:#4E8A63;
  --green-moss-grey:#9DB5A5;
  --green-mint-grey:#CFE0D5;
  --green-sage:#E4ECE5;
  --green-sage-mist:#EEF4EF;
  /* Neutrals */
  --white:#FFFFFF;
  --cream-warm-white:#FFFAF8;
  --cream-linen:#F4F1EC;
  --sand-light-border:#E7DFDA;
  --taupe-placeholder:#AAA59F;
  --taupe-muted-text:#716C68;
  --charcoal-body-text:#30302F;

  /* header – wysokość koszyka na desktopie */
  --kk-header-ctrl-h:64px;
}


/* globalnie: nic nie może poszerzać strony w poziomie (np. karuzele, ujemne marginesy)
   clip zamiast hidden – nie psuje sticky headera ani rozwijanego menu */
html,body{overflow-x:clip;max-width:100%}


/* =====================================================================
   2. TOP BAR – rotator komunikatów (kk-ticker)
   ===================================================================== */
.kk-ticker{position:relative;height:40px;overflow:hidden}
.kk-ticker > .e-con,
.kk-ticker > .e-con-inner > .e-con{
  position:absolute;inset:0;
  --padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;padding:0;
  display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;white-space:nowrap;
  opacity:0;transform:translateY(100%);
  animation:kk-ticker 12s linear infinite;
}
.kk-ticker > .e-con:nth-child(2),
.kk-ticker > .e-con-inner > .e-con:nth-child(2){animation-delay:4s}
.kk-ticker > .e-con:nth-child(3),
.kk-ticker > .e-con-inner > .e-con:nth-child(3){animation-delay:8s}
.kk-ticker:hover .e-con{animation-play-state:paused}

@keyframes kk-ticker{
  0%     {opacity:0;transform:translateY(100%)}
  5%     {opacity:1;transform:translateY(0)}
  33.33% {opacity:1;transform:translateY(0)}
  38.33% {opacity:0;transform:translateY(-100%)}
  100%   {opacity:0;transform:translateY(-100%)}
}

/* w edytorze Elementora komunikaty stoją jeden pod drugim, żeby dało się je edytować */
.elementor-editor-active .kk-ticker{height:auto;overflow:visible}
.elementor-editor-active .kk-ticker .e-con{position:relative;opacity:1;transform:none;animation:none}

@media (prefers-reduced-motion:reduce){
  .kk-ticker .e-con{animation:none}
  .kk-ticker > .e-con:first-child,
  .kk-ticker > .e-con-inner > .e-con:first-child{opacity:1;transform:none}
}


/* =====================================================================
   3. HEADER – MENU (widget Menu, dropdown „Produkter” = kk-dropdown)
   ===================================================================== */

/* pozycje w dropdownie – desktop i mobile */
.kk-dropdown a{
  display:block;
  padding:4px 12px;
  border-radius:10px;
  transition:background-color .2s ease,color .2s ease;
}
.kk-dropdown a:hover,
.kk-dropdown a:focus-visible,
.kk-dropdown a:active{
  background:var(--pink-mist);
  color:var(--pink-deep);
}

/* bieżąca kategoria w dropdownie */
.elementor-widget-n-menu .e-n-menu-content a.kk-current{
  background:var(--pink-mist) !important;
  border-radius:10px;
}
.elementor-widget-n-menu .e-n-menu-content a.kk-current,
.elementor-widget-n-menu .e-n-menu-content a.kk-current *{
  color:var(--pink-deep) !important;
}

/* bieżąca strona – kk-current od skryptu lub e-current od Elementora (nie na wynikach wyszukiwania: /?s= to też „/”) */
body:not(.search) .elementor-widget-n-menu .e-n-menu-title:is(.kk-current,.e-current){
  background:var(--pink-mist) !important;
  border-color:var(--pink-mist) !important;
}
body:not(.search) .elementor-widget-n-menu .e-n-menu-title:is(.kk-current,.e-current) .e-n-menu-title-text{
  color:var(--pink-deep) !important;
}
body:not(.search) .elementor-widget-n-menu .e-n-menu-title:is(.kk-current,.e-current) svg{
  fill:var(--pink-deep) !important;
}

/* tablet i telefon */
@media (max-width:1024px){

  /* jedno ciągłe białe tło, bez odstępów i zaokrągleń */
  .elementor-widget-n-menu .e-n-menu-heading{gap:0 !important;background:var(--white)}
  .elementor-widget-n-menu .e-n-menu-title{border-radius:0 !important;margin:0 !important}
  .elementor-widget-n-menu .e-n-menu-content{background:transparent;box-shadow:none}

  /* rozwinięty dropdown (np. Produkter) */
  .elementor-widget-n-menu .e-n-menu-title:is([aria-expanded="true"],:has([aria-expanded="true"])){
    background:var(--pink-mist) !important;
  }
  .elementor-widget-n-menu .e-n-menu-title:is([aria-expanded="true"],:has([aria-expanded="true"])) .e-n-menu-title-text{
    color:var(--pink-deep) !important;
  }
  .elementor-widget-n-menu .e-n-menu-title:is([aria-expanded="true"],:has([aria-expanded="true"])) svg{
    fill:var(--pink-deep) !important;
  }

  /* dropdown „Produkter”: pełna szerokość, białe tło, wcięcie od lewej */
  .kk-dropdown.e-con{
    --width:100%;width:100% !important;max-width:none !important;
    box-shadow:none !important;border:0 !important;border-radius:0 !important;
    background:var(--white) !important;
    --gap:0px;gap:0 !important;
    --padding-top:0px;--padding-bottom:8px;--padding-left:12px;--padding-right:12px;
  }
  .kk-dropdown .elementor-widget,
  .kk-dropdown .elementor-widget-container,
  .kk-dropdown .elementor-button{
    background:transparent !important;border-radius:0 !important;box-shadow:none !important;
  }
}


/* =====================================================================
   4. HEADER – WYSZUKIWARKA (widget Search = kk-search)
   ===================================================================== */

/* pigułka */
.kk-search .e-search-form{
  display:flex;align-items:center;gap:6px;
  width:250px;max-width:100%;
  box-sizing:border-box;
  padding:4px 4px 4px 16px;
  background:var(--cream-warm-white);
  border:1px solid var(--sand-light-border);
  border-radius:999px;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.kk-search .e-search-form:focus-within{
  border-color:var(--pink-strong);
  box-shadow:0 0 0 3px rgba(191,80,112,.1);   /* Pink – strong 10% */
}

/* pole tekstowe */
.kk-search .e-search-input-wrapper{flex:1;min-width:0}
.kk-search .e-search-input{
  width:100%;height:34px;
  padding:0 !important;margin:0;
  background:transparent !important;
  border:0 !important;border-radius:0 !important;
  box-shadow:none !important;outline:none;
  font-family:inherit;font-size:14px;line-height:1.35;
  color:var(--charcoal-body-text);
}
.kk-search .e-search-input::placeholder{color:var(--taupe-placeholder)}

/* okrągły przycisk z lupą */
.kk-search .e-search-submit{
  flex:0 0 34px;
  width:34px !important;height:34px !important;
  min-width:34px !important;max-width:34px !important;
  box-sizing:border-box;
  padding:0 !important;margin:0 !important;
  display:grid !important;place-items:center;
  line-height:0;
  background:var(--pink-strong) !important;
  border:0 !important;border-radius:50% !important;
  cursor:pointer;
  transition:background-color .2s ease;
}
.kk-search .e-search-submit:hover,
.kk-search .e-search-submit:focus-visible{
  background:var(--pink-deep) !important;
}
.kk-search .e-search-submit svg,
.kk-search .e-search-submit i{
  width:13px !important;height:13px !important;
  font-size:13px !important;
  margin:0 !important;
  fill:var(--white) !important;
  color:var(--white) !important;
}

/* tekst „Sök” w przycisku – niewidoczny, ale czytany przez czytniki ekranu */
.kk-search .e-search-submit span{
  position:absolute;
  width:1px;height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
}


/* =====================================================================
   5. HEADER – KOSZYK (widget Menu Cart)
   ===================================================================== */

/* kolory przycisku koszyka z panelu widgetu (Style → Menu Icon) – globalny styl przycisków
   (Site Settings → Buttons: tło Pink – strong, tekst White) je przykrywał, bo przycisk ma klasę .elementor-button */
.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button{
  color:var(--toggle-button-text-color,var(--green-forest)) !important;
  background-color:var(--toggle-button-background-color,var(--white)) !important;
  border-color:var(--toggle-button-border-color,var(--sand-light-border)) !important}
.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button:hover{
  color:var(--toggle-button-hover-text-color,var(--toggle-button-text-color,var(--green-forest))) !important;
  background-color:var(--toggle-button-hover-background-color,var(--toggle-button-background-color,var(--white))) !important;
  border-color:var(--toggle-button-hover-border-color,var(--toggle-button-border-color,var(--sand-light-border))) !important}

/* desktop – wysokość przycisku z :root (--kk-header-ctrl-h) */
@media (min-width:1025px){
  .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button{
    height:var(--kk-header-ctrl-h) !important;
    min-height:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
    box-sizing:border-box;
    align-items:center !important;
  }
}

/* tablet i telefon – okrągły przycisk z samą ikoną, po prawej */
@media (max-width:1024px){
  .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button{
    width:44px !important;height:44px !important;
    min-width:0 !important;
    padding:0 !important;
    gap:0 !important;
    justify-content:center !important;
    border-radius:50% !important;
  }
  .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button .elementor-button-text{
    display:none !important;                 /* kwota tylko na desktopie */
  }
  .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button .elementor-button-icon{
    margin:0 !important;
  }
}

/* boczny panel – kolory przycisków z panelu widgetu (Style → Buttons).
   Widget podaje je jako zmienne, a globalny styl przycisków (Site Settings → Buttons) je przykrywał –
   na stronie tekst „Till kassan” był ciemny, choć w panelu jest biały. Tu tylko każemy użyć wartości z panelu. */
.elementor-menu-cart__footer-buttons .elementor-button--checkout{color:var(--checkout-button-text-color,#fff) !important}
.elementor-menu-cart__footer-buttons .elementor-button--checkout:hover{color:var(--checkout-button-hover-text-color,var(--checkout-button-text-color,#fff)) !important}
.elementor-menu-cart__footer-buttons .elementor-button--checkout{background-color:var(--checkout-button-background-color,var(--pink-strong)) !important}
.elementor-menu-cart__footer-buttons .elementor-button--checkout:hover{background-color:var(--checkout-button-hover-background-color,var(--pink-mist)) !important}
.elementor-menu-cart__footer-buttons .elementor-button--view-cart{color:var(--view-cart-button-text-color,var(--pink-deep)) !important;background-color:var(--view-cart-button-background-color,var(--white)) !important}
.elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover{color:var(--view-cart-button-hover-text-color,var(--pink-deep)) !important;background-color:var(--view-cart-button-hover-background-color,var(--pink-mist)) !important}

/* boczny panel – przyciski View cart / Checkout w dwóch równych kolumnach */
.elementor-menu-cart__footer-buttons{
  display:grid !important;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.elementor-menu-cart__footer-buttons .elementor-button{
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  box-sizing:border-box;
  padding:12px 10px !important;
  justify-content:center;
  text-align:center;
  white-space:nowrap;
}


/* =====================================================================
   6. KAFLE KATEGORII (kk-cat-img, kk-glass)
   ===================================================================== */

/* panel „szkło” na kaflu ze zdjęciem */
.kk-glass{
  background:rgba(255,250,248,.88) !important;   /* Cream – warm white 88% */
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
}

/* kafel ze zdjęciem – powiększenie zdjęcia po najechaniu
   (zdjęcie ustawione jako Background OVERLAY: Classic, Image, Cover) */
.kk-cat-img{position:relative;overflow:hidden}
.kk-cat-img::before{transition:transform .6s ease}
.kk-cat-img:hover::before{transform:scale(1.04)}

/* cały kafel klikalny, choć link jest tylko na przycisku
   (NIE ustawiaj linku na kontenerze – link w linku rozbija stronę na żywo) */
.kk-cat-img .e-con,
.kk-cat-img .elementor-widget,
.kk-cat-img .elementor-widget-container,
.kk-cat-img .elementor-button-wrapper,
.kk-cat-img .elementor-button{position:static !important}
.kk-cat-img .elementor-button::after{content:"";position:absolute;inset:0;z-index:2}


/* =====================================================================
   7. HERO – panel „szkło” pod treścią banera, tylko tablet i telefon
   Container (treść banera) → CSS Classes: kk-glass-tm
   ===================================================================== */
@media (max-width:1024px){
  .kk-glass-tm{
    background:rgba(255,250,248,.88) !important;   /* Cream – warm white 88% */
    -webkit-backdrop-filter:blur(6px);
    backdrop-filter:blur(6px);
  }
}


/* =====================================================================
   8. KARTA PRODUKTU (Loop Item „Karta produktu” w Loop Grid)
   Featured Image → kk-pimg · Post Info (tagi) → kk-tag · Add To Cart → kk-push-bottom
   ===================================================================== */

/* zdjęcie zawsze kwadratowe, przycięte */
.kk-pimg img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  background:var(--cream-linen);
}

/* plakietka „Nyhet” – z tagów produktu pokazuje TYLKO tag „Nyhet”
   (Post Info → Terms → Product tags, Link: Yes, klasa kk-tag) */
.kk-tag .elementor-icon-list-items{margin:0;padding:0}
.kk-tag .elementor-post-info__terms-list{font-size:0}          /* ukrywa przecinki między tagami */
.kk-tag .elementor-post-info__terms-list-item{display:none}    /* ukrywa wszystkie tagi… */
.kk-tag a.elementor-post-info__terms-list-item[href*="nyhet"]{ /* …oprócz „Nyhet” */
  display:inline-block;
  padding:4px 10px;
  border-radius:999px;
  background:var(--green-pine);
  color:var(--white) !important;
  font-size:11px;font-weight:600;line-height:1.2;
  letter-spacing:.06em;text-transform:uppercase;
  pointer-events:none;                                         /* nieklikalna */
}

/* przycisk zawsze na dole karty (karty mają równą wysokość) */
.kk-push-bottom{margin-top:auto}


/* =====================================================================
   9. LOOP GRID → przewijana karuzela na telefonie (scroll-snap, bez JS)
   Loop Grid → Advanced → CSS Classes: kk-scroll
   ===================================================================== */
@media (max-width:767px){
  .kk-scroll .elementor-loop-container{
    display:flex !important;
    grid-template-columns:none !important;
    gap:12px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-padding:0 20px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;                 /* Firefox – bez paska przewijania */
    margin:0 -20px;                       /* karty dochodzą do krawędzi panelu */
    padding:0 20px 4px;
  }
  .kk-scroll .elementor-loop-container::-webkit-scrollbar{display:none}
  .kk-scroll .e-loop-item{
    flex:0 0 78%;                         /* widać kawałek następnej karty */
    scroll-snap-align:start;
  }
}


/* =====================================================================
   10. KONTENER (Grid / Flexbox) → przewijana karuzela na telefonie
   Kontener z elementami (np. Grid z Icon Boxami USP) → CSS Classes: kk-hscroll
   ===================================================================== */
@media (max-width:767px){
  .kk-hscroll,
  .kk-hscroll > .e-con-inner{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    grid-template-columns:none !important;
    gap:12px !important;
  }
  .kk-hscroll{
    padding-left:10px !important;         /* odstęp pierwszego boxu od lewej krawędzi */
    scroll-padding-left:10px;             /* boxy „zatrzaskują się” 10 px od krawędzi */
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;                 /* Firefox – bez paska przewijania */
  }
  .kk-hscroll::-webkit-scrollbar{display:none}
  .kk-hscroll > .elementor-element,
  .kk-hscroll > .e-con-inner > .elementor-element{
    flex:0 0 75% !important;              /* widać kawałek następnego elementu */
    max-width:75% !important;
    scroll-snap-align:start;
  }
}
/* kopie elementów (dodaje je skrypt auto-scroll dla pętli) – widoczne tylko na telefonie */
@media (min-width:768px){
  .kk-hscroll .kk-clone{display:none !important}
}


/* =====================================================================
   11. ICON LIST – ikona w kółku (np. lista w sekcji Varför)
   Icon List → CSS Classes: kk-checklist · kolor i rozmiar ikony ustawiasz w panelu
   ===================================================================== */
.kk-checklist .elementor-icon-list-item{align-items:flex-start !important}
.kk-checklist .elementor-icon-list-icon{
  flex:0 0 22px;
  width:22px;height:22px;
  margin-top:1px;
  padding:0 !important;
  border-radius:50%;
  background:var(--pink-mist);
  display:inline-flex !important;
  align-items:center;justify-content:center;
}
.kk-checklist .elementor-icon-list-icon svg,
.kk-checklist .elementor-icon-list-icon i{margin:0 !important}


/* =====================================================================
   12. FORMULARZ (Elementor Form) – detale, których nie ma w panelu
   Form → Advanced → CSS Classes: kk-form
   (kolory, fonty, ramki, przycisk i karta – ustawione w panelu)
   ===================================================================== */
.kk-form .elementor-field-textual{
  padding:12px 14px !important;
  min-height:0 !important;
  line-height:1.35 !important;
  box-shadow:none;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.kk-form .elementor-field-textual::placeholder{color:var(--taupe-placeholder);opacity:1}
.kk-form .elementor-field-textual:hover{border-color:var(--pink-pale) !important}
.kk-form .elementor-field-textual:focus{
  outline:none;
  border-color:var(--pink-strong) !important;
  box-shadow:0 0 0 3px rgba(191,80,112,.1) !important;   /* Pink – strong 10% */
}
.kk-form textarea.elementor-field-textual{height:84px;min-height:84px;resize:none}
.kk-form .elementor-field-type-submit .elementor-button{min-width:190px}
/* zgoda (Acceptance) – checkbox w kolorze marki, tekst jak opis */
.kk-form .elementor-field-type-acceptance .elementor-field-option{display:flex;align-items:flex-start;gap:8px}
.kk-form .elementor-field-type-acceptance input[type="checkbox"]{
  flex:0 0 16px;width:16px;height:16px;margin:2px 0 0;
  accent-color:var(--pink-strong);
}
.kk-form .elementor-field-type-acceptance label{
  font-size:13px;line-height:1.5;color:var(--taupe-muted-text);
}
@media (max-width:767px){
  .kk-form .elementor-field-textual{font-size:16px !important}   /* iOS: bez przybliżania przy wpisywaniu */
}


/* =====================================================================
   13. FAQ (Nested Accordion) – całe pytanie + odpowiedź jako JEDNA karta
   Accordion → Advanced → CSS Classes: kk-faq
   (panel stylizuje osobno nagłówek i treść – stąd „wcięcia” przy otwartym pytaniu)
   ===================================================================== */
.kk-faq .e-n-accordion-item{
  background:var(--cream-warm-white);
  border:1px solid var(--sand-light-border);
  border-radius:14px;
  overflow:hidden;
  transition:border-color .2s ease;
}
.kk-faq .e-n-accordion-item:hover{border-color:var(--pink-pale)}
.kk-faq .e-n-accordion-item[open]{border-color:var(--pink-soft)}

/* nagłówek i treść bez własnych ramek, teł i zaokrągleń */
.kk-faq .e-n-accordion-item-title,
.kk-faq .e-n-accordion-item > .e-con{
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
.kk-faq .e-n-accordion-item > .e-con{padding-top:0 !important}


/* =====================================================================
   14. KARUZELE – strzałki w kółku + kropki-pigułki
   Reviews → CSS Classes: kk-reviews
   Loop Carousel (np. pakiety) → CSS Classes: kk-carousel
   (karty, teksty, gwiazdki – ustawione w panelu)
   ===================================================================== */
:is(.kk-reviews,.kk-carousel) .elementor-swiper-button{
  width:40px !important;height:40px !important;
  display:flex !important;align-items:center;justify-content:center;
  z-index:5;
  background:var(--pink-strong);
  border:1px solid var(--pink-strong);
  border-radius:50%;
  color:var(--white) !important;
  font-size:14px !important;
  transition:background-color .2s ease,color .2s ease;
}
:is(.kk-reviews,.kk-carousel) .elementor-swiper-button svg{
  width:14px !important;height:14px !important;
  fill:currentColor !important;
}
:is(.kk-reviews,.kk-carousel) .elementor-swiper-button:hover,
:is(.kk-reviews,.kk-carousel) .elementor-swiper-button:focus-visible{
  background:var(--pink-mist);
  color:var(--pink-deep) !important;
}
:is(.kk-reviews,.kk-carousel) .elementor-swiper-button.swiper-button-disabled{opacity:.35;cursor:default}

/* cudzysłów nad treścią opinii (tylko Reviews) */
.kk-reviews .elementor-testimonial__text::before{
  content:"\201C";
  display:block;
  height:28px;
  margin-bottom:8px;
  font-family:Georgia,serif;
  font-size:48px;font-weight:700;line-height:1;
  color:var(--pink-soft);
}

/* gwiazdki ocen (Reviews → Star Style: Unicode) – czcionka systemowa, która na pewno ma znak ★ */
.kk-reviews .elementor-star-rating i::before{
  font-family:"Segoe UI Symbol","Noto Sans Symbols 2","Apple Symbols",Arial,sans-serif !important;
}

/* kropki: nieaktywne Pink – pale, aktywna rozciągnięta w pigułkę */
:is(.kk-reviews,.kk-carousel) .swiper-pagination-bullet{
  width:8px !important;height:8px !important;
  margin:0 4px !important;
  background:var(--pink-pale) !important;
  opacity:1 !important;
  transition:width .2s ease,background-color .2s ease;
}
:is(.kk-reviews,.kk-carousel) .swiper-pagination-bullet-active{
  width:24px !important;
  border-radius:20px;
  background:var(--pink-strong) !important;
}

/* telefon: bez strzałek – przewijanie palcem + kropki */
@media (max-width:767px){
  :is(.kk-reviews,.kk-carousel) .elementor-swiper-button{display:none !important}
}


/* =====================================================================
   15. PAKIETY – Loop Carousel (1 pakiet na slajd) + karta pakietu
   Loop Carousel → CSS Classes: kk-carousel kk-paket
   W szablonie karty: Featured Image → kk-pmedia · Post Info (tagi) → kk-save
                      Basic Gallery → kk-thumbs · Product Price → kk-pprice · Post Info (tagi) → kk-count
   Panel obok karuzeli → kk-paket-panel · dolny kontener panelu → kk-push-bottom
   ===================================================================== */

/* paski (kropki przerobione na paski) i strzałki NAD kartą
   paski są w normalnym układzie (nad karuzelą), więc zawsze zaczynają się równo z kartą */
.kk-paket,
.e-con > .elementor-widget.kk-paket{
  position:relative !important;
  display:flex !important;flex-direction:column !important;
  width:100% !important;max-width:100% !important;align-self:stretch !important;
}
.kk-paket .swiper,
.kk-paket .swiper-container{
  order:2;
  margin:38px 0 0 !important;
  width:100% !important;
  padding:1px !important;                   /* zapas, żeby nie ucinało ramki karty */
}
.kk-paket .swiper-pagination{
  order:1;
  position:static !important;
  inset:auto !important;
  transform:none !important;
  width:min(340px,calc(100% - 112px)) !important;
  margin:18px 0 0 !important;
  display:flex !important;gap:8px;
}
.kk-paket .swiper-pagination-bullet{
  flex:1;
  width:auto !important;height:4px !important;
  margin:0 !important;
  border-radius:4px !important;
}
.kk-paket .swiper-pagination-bullet-active{width:auto !important}
.kk-paket .elementor-swiper-button{
  top:0 !important;bottom:auto !important;
  transform:none !important;margin:0 !important;
}
.kk-paket .elementor-swiper-button-prev{left:auto !important;right:48px !important}
.kk-paket .elementor-swiper-button-next{right:0 !important}
@media (max-width:767px){
  .kk-paket .swiper,
  .kk-paket .swiper-container{margin-top:16px !important}
  .kk-paket .swiper-pagination{width:100% !important;margin-top:0 !important}
}

/* duże zdjęcie pakietu */
.kk-pmedia img{
  display:block;
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  aspect-ratio:16/9 !important;
  object-fit:cover;
  border-radius:12px;
  background:var(--cream-linen);
}
@media (max-width:767px){
  .kk-pmedia img{aspect-ratio:4/3 !important}
}

/* plakietka „Spara 10 %” – z tagów pokazuje tylko tagi zaczynające się od „spara” */
.kk-save .elementor-icon-list-items{margin:0;padding:0}
.kk-save .elementor-post-info__terms-list{font-size:0}
.kk-save .elementor-post-info__terms-list-item{display:none}
.kk-save a.elementor-post-info__terms-list-item[href*="spara"]{
  display:inline-block;
  padding:6px 12px;
  border-radius:999px;
  background:var(--green-pine);
  color:var(--white) !important;
  font-size:12px;font-weight:600;line-height:1.2;
  letter-spacing:.06em;text-transform:uppercase;
  pointer-events:none;
}

/* miniatury zawartości z plusami (Basic Gallery, maks. 4) */
.kk-thumbs .gallery{display:flex !important;flex-wrap:nowrap;align-items:center;margin:0 !important}
.kk-thumbs .gallery-item{
  display:flex !important;align-items:center;
  width:auto !important;max-width:none !important;
  margin:0 !important;padding:0 !important;
}
.kk-thumbs .gallery-item:nth-child(n+5){display:none !important}
.kk-thumbs .gallery-item + .gallery-item::before{
  content:"+";
  width:22px;
  text-align:center;
  font-size:18px;font-weight:500;
  color:var(--pink-soft);
}
.kk-thumbs .gallery-icon{line-height:0}
.kk-thumbs img{
  width:56px !important;height:56px !important;
  object-fit:cover;
  border-radius:12px;
  border:1px solid var(--sand-light-border) !important;
  background:var(--cream-linen);
}
@media (max-width:767px){
  .kk-thumbs img{width:46px !important;height:46px !important}
  .kk-thumbs .gallery-item + .gallery-item::before{width:18px;font-size:16px}
}

/* „Paket · 3 produkter” – Post Info (Product tags, Link: Yes) → CSS Classes: kk-count
   z tagów pokazuje tylko tag „X produkter” */
.kk-count .elementor-icon-list-items{margin:0;padding:0}
.kk-count .elementor-post-info__terms-list{font-size:0}
.kk-count .elementor-post-info__terms-list-item{display:none}
.kk-count a.elementor-post-info__terms-list-item[href*="produkter"]{
  display:inline;
  font-size:11px;font-weight:600;line-height:1.2;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--pink-strong) !important;
  pointer-events:none;
}
.kk-count a.elementor-post-info__terms-list-item[href*="produkter"]::before{content:"Paket · "}

/* cena pakietu – Product Price → CSS Classes: kk-pprice
   (panel nie przebija stylów WooCommerce dla <del>/<ins>) */
.kk-pprice .price{display:flex !important;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin:0}
.kk-pprice .price del,
.kk-pprice .price del *{
  font-size:15px !important;font-weight:400 !important;
  color:var(--taupe-muted-text) !important;opacity:1;
}
.kk-pprice .price ins,
.kk-pprice .price ins *{
  text-decoration:none !important;
  font-size:30px !important;font-weight:700 !important;line-height:1 !important;
  color:var(--pink-strong) !important;
}
@media (max-width:767px){
  .kk-pprice .price ins,
  .kk-pprice .price ins *{font-size:24px !important}
}

/* panel obok karuzeli – Container → CSS Classes: kk-paket-panel
   (białe kółka przy ptaszkach na jasnym, różowym tle) */
.kk-paket-panel .kk-checklist .elementor-icon-list-icon{background:var(--white)}


/* =====================================================================
   16. STOPKA – newsletter w jednej „pigułce” (Elementor Form)
   Form (newsletter) → Advanced → CSS Classes: kk-news
   (reszta stopki – kolory, linki, separatory – ustawiona w panelu)
   ===================================================================== */
.kk-news .elementor-form-fields-wrapper{
  display:flex !important;flex-wrap:nowrap !important;align-items:center;
  gap:6px;margin:0 !important;padding:6px;
  background:var(--white);border-radius:999px;
}
.kk-news .elementor-field-group{margin:0 !important;padding:0 !important}
.kk-news .elementor-field-type-email{flex:1 1 auto;min-width:0}
.kk-news .elementor-field-type-submit{flex:0 0 auto;width:auto !important}
.kk-news .elementor-field-textual{
  border:0 !important;background:transparent !important;box-shadow:none !important;
  padding:0 14px !important;min-height:44px;font-size:15px;color:var(--charcoal-body-text);
}
.kk-news .elementor-field-textual::placeholder{color:var(--taupe-placeholder);opacity:1}
.kk-news .elementor-field-textual:focus{outline:none}
.kk-news .elementor-form-fields-wrapper:focus-within{box-shadow:0 0 0 3px rgba(242,196,206,.45)}  /* Pink – pale */
.kk-news .elementor-message{margin-top:10px;font-size:13px;color:var(--white)}
@media (max-width:767px){
  .kk-news .elementor-form-fields-wrapper{flex-direction:column;align-items:stretch;border-radius:20px}
  .kk-news .elementor-field-type-submit,
  .kk-news .elementor-field-type-submit .elementor-button{width:100% !important}
  .kk-news .elementor-field-textual{font-size:16px;padding:12px 14px !important}   /* iOS: bez przybliżania */
}


/* =====================================================================
   17. HEADER NA TABLECIE I TELEFONIE – trzy jednakowe kółka 44 px
   kolejność: koszyk · konto · menu (hamburger zawsze przy prawej krawędzi)
   Ikona konta (widget Icon) → CSS Classes: kk-account
   Warunek: koszyk, konto i Menu leżą w JEDNYM kontenerze (Row, Gap 8)
   ===================================================================== */
@media (max-width:1024px){
  /* logo zabiera wolne miejsce, ale może się zwęzić – nic nie wypycha ikon za ekran */
  .elementor-location-header .elementor-widget-image{flex:1 1 auto !important;min-width:0 !important}

  .elementor-location-header .elementor-widget-woocommerce-menu-cart{order:1 !important}
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account){order:2 !important}
  .elementor-location-header .elementor-widget-n-menu{order:3 !important}

  .elementor-location-header .elementor-widget-woocommerce-menu-cart,
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account),
  .elementor-location-header .elementor-widget-n-menu{
    margin:0 !important;flex:0 0 auto !important;width:auto !important;max-width:none !important;
  }

  /* koszyk – takie samo tło jak pozostałe, bez ramki */
  .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button{
    background:var(--pink-mist) !important;
    border:0 !important;
  }

  /* hamburger i krzyżyk w kółku */
  .elementor-widget-n-menu .e-n-menu-toggle{
    width:44px !important;height:44px !important;
    padding:0 !important;margin:0 !important;
    display:grid !important;place-items:center;
    border-radius:50% !important;
    background:var(--pink-mist) !important;
  }
  /* menu na telefonie ma prawie zerową szerokość, a Elementor centruje w nim przycisk –
     kółko wystawało wtedy na boki; dajemy menu szerokość jednego kółka i przycisk do prawej */
  .elementor-location-header .elementor-widget-n-menu{min-width:44px !important}
  .elementor-location-header .elementor-widget-n-menu .e-n-menu{
    display:flex !important;justify-content:flex-end !important;min-width:44px !important;
  }
  .elementor-location-header .elementor-widget-n-menu .e-n-menu-toggle{
    --n-menu-toggle-align:flex-end;align-self:flex-end !important;
    margin-inline:0 !important;
  }
  .elementor-widget-n-menu .e-n-menu-toggle[aria-expanded="true"]{background:var(--pink-pale) !important}
  .elementor-widget-n-menu .e-n-menu-toggle svg{width:18px !important;height:18px !important}

  /* ikona konta (widget „WooCommerce Account” / dwaw-account) – kółko jest już w pliku SVG,
     więc tylko wyrównujemy rozmiar do 44 px i chowamy pusty podpis */
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account) .dwaw-widget,
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account) a{
    display:block !important;width:44px !important;height:44px !important;
    padding:0 !important;margin:0 !important;line-height:0 !important;
  }
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account) .dwaw-icon,
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account) svg{
    display:block !important;width:44px !important;height:44px !important;margin:0 !important;
  }
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account){width:44px !important;min-width:44px !important}
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account) path{fill:var(--green-forest)}
  .elementor-location-header :is(.kk-account,.elementor-widget-dwaw-account) .dwaw-label{display:none !important}
}


/* =====================================================================
   18. STRONA PRODUKTU (Single Product)
   Lewa kolumna (galeria + treści) → CSS Classes: kk-pdp-main
   Na telefonie kolumna „rozpuszcza się”, żeby box zakupowy mógł stanąć
   między galerią a treściami. Kolejność ustawiasz w panelu:
   Advanced → Order (Mobile): Galeria 1 · Box zakupowy 2 · Treści 3
   ===================================================================== */
@media (max-width:767px){
  .kk-pdp-main{display:contents}
}

/* 18.1 Breadcrumbs – hover linków (panel ma tylko kolor linku) */
.woocommerce-breadcrumb a:hover{color:var(--pink-strong)}

/* 18.2 Galeria (widget Product Images) – strzałki w kółkach + miniatury w 1 rzędzie
   Strzałki włącza filtr w functions.php (directionNav). Zaokrąglenia: panel widgetu. */
.woocommerce-product-gallery{position:relative;container-type:inline-size}
.woocommerce-product-gallery .flex-direction-nav{list-style:none;margin:0;padding:0}
.woocommerce-product-gallery .flex-direction-nav a{
  position:absolute;top:50cqw;transform:translateY(-50%);z-index:3;
  width:44px;height:44px;border-radius:50%;display:block;overflow:hidden;
  background:rgba(255,255,255,.92);box-shadow:0 4px 14px rgba(31,74,54,.12);
  font-size:0;line-height:0;color:transparent;text-indent:-9999px;transition:background .2s}
.woocommerce-product-gallery .flex-direction-nav a::before{
  content:"";position:absolute;top:50%;left:50%;text-indent:0;
  width:9px;height:9px;border:solid var(--green-forest);border-width:0 2px 2px 0}
.woocommerce-product-gallery .flex-direction-nav .flex-prev{left:14px}
.woocommerce-product-gallery .flex-direction-nav .flex-next{right:14px}
.woocommerce-product-gallery .flex-direction-nav .flex-prev::before{transform:translate(-35%,-50%) rotate(135deg)}
.woocommerce-product-gallery .flex-direction-nav .flex-next::before{transform:translate(-65%,-50%) rotate(-45deg)}
.woocommerce-product-gallery .flex-direction-nav a:hover{background:var(--pink-strong)}
.woocommerce-product-gallery .flex-direction-nav a:hover::before{border-color:var(--white)}
.woocommerce-product-gallery .flex-direction-nav .flex-disabled{opacity:0;pointer-events:none}
.woocommerce div.product div.images .flex-control-thumbs{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:10px 0 0;padding:0}
.woocommerce div.product div.images .flex-control-thumbs li{width:auto;float:none;margin:0}
.woocommerce div.product div.images .flex-control-thumbs li img{aspect-ratio:1/1;object-fit:cover;opacity:.7;border:2px solid transparent;transition:.2s}
.woocommerce div.product div.images .flex-control-thumbs li img:hover{opacity:1}
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active{opacity:1;border-color:var(--pink-strong)}
/* 18.2a Zdjęcie główne zawsze kwadratowe: dowolne proporcje kadrowane środkiem (center center).
   Pełne, nieprzycięte zdjęcie: lupa / kliknięcie → lightbox WooCommerce. */
.woocommerce div.product div.images .woocommerce-product-gallery__image{aspect-ratio:1/1;overflow:hidden;background:var(--cream-linen)}
.woocommerce div.product div.images .woocommerce-product-gallery__image > a{display:block;height:100%}
.woocommerce div.product div.images .woocommerce-product-gallery__image img.wp-post-image,
.woocommerce div.product div.images .woocommerce-product-gallery__image > a > img{
  width:100% !important;height:100% !important;object-fit:cover;object-position:center center}
.woocommerce div.product div.images .flex-viewport{height:auto !important}

/* 18.2b Desktop: miniatury pionowo po lewej (jak Nike) – mniejsze zdjęcie główne, cała galeria bliżej kwadratu */
@media (min-width:1025px){
  .woocommerce div.product div.images.woocommerce-product-gallery{
    display:grid;grid-template-columns:88px minmax(0,1fr);gap:12px;align-items:start}
  .woocommerce div.product div.images .flex-viewport{grid-column:2;grid-row:1}
  .woocommerce div.product div.images .flex-control-thumbs{
    grid-column:1;grid-row:1;grid-template-columns:1fr;gap:10px;margin:0}
  .woocommerce-product-gallery .flex-direction-nav a{top:calc((100cqw - 100px) / 2)}
  .woocommerce-product-gallery .flex-direction-nav .flex-prev{left:114px}
}
@media (max-width:767px){
  .woocommerce-product-gallery .flex-direction-nav{display:none}
  .woocommerce div.product div.images .flex-control-thumbs{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
}

/* 18.3 Box zakupowy – cena, wybór wariantu, ilość
   (panel nie ma ustawień dla dopisku „inkl. moms”, tła tabeli wariantów i opisu wariantu) */
.elementor-widget-woocommerce-product-price .woocommerce-price-suffix{
  font-size:var(--fs-caption,13px);font-weight:400;color:var(--taupe-muted-text);margin-left:4px}
.elementor-widget-woocommerce-product-add-to-cart table.variations{margin:0 0 4px;border:0}
.elementor-widget-woocommerce-product-add-to-cart table.variations tr{display:flex;flex-direction:column;gap:8px}
.elementor-widget-woocommerce-product-add-to-cart table.variations :is(th,td){
  display:block;padding:0;background:transparent !important;border:0;text-align:left;line-height:1.2}
.elementor-widget-woocommerce-product-add-to-cart table.variations select{width:100%}
/* panel daje kolor ramki i zaokrąglenie listy, ale nie jej grubość – dokładamy tylko grubość i odstęp */
.elementor-widget-woocommerce-product-add-to-cart table.variations select{border-style:solid !important;border-width:1px !important;padding:12px 40px 12px 14px;min-height:48px}
.elementor-widget-woocommerce-product-add-to-cart .reset_variations{display:none !important}
.elementor-widget-woocommerce-product-add-to-cart .woocommerce-variation{display:flex;flex-direction:column;gap:4px;margin:0 0 14px}
.elementor-widget-woocommerce-product-add-to-cart .woocommerce-variation-description p{
  margin:0;font-size:var(--fs-caption,13px);color:var(--taupe-muted-text)}
/* WooCommerce ma tu mocniejszy selektor (.woocommerce div.product .stock), stąd !important */
.elementor-widget-woocommerce-product-add-to-cart .woocommerce-variation-availability .stock{
  margin:0;font-size:var(--fs-body-small,14px);font-weight:500;color:var(--green-pine) !important}
.elementor-widget-woocommerce-product-add-to-cart .quantity .qty{min-width:64px;height:52px;padding:0 8px !important;text-align:center;color:var(--green-forest)}
/* ukryte natywne strzałki pola liczby – zajmowały miejsce i przesuwały cyfrę w lewo */
.elementor-widget-woocommerce-product-add-to-cart .quantity .qty{-moz-appearance:textfield;appearance:textfield}
.elementor-widget-woocommerce-product-add-to-cart .quantity .qty::-webkit-inner-spin-button,
.elementor-widget-woocommerce-product-add-to-cart .quantity .qty::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* 18.4 Treści – kotwice: wiersz z CSS ID nie chowa się pod przyklejonym headerem */
.elementor-location-single .e-con[id]{scroll-margin-top:110px}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* 18.5 Specifikationer – tabela atrybutów (widget Additional Information)
   Panel ma tylko jeden kolor i typografię dla całej tabeli; etykiety, paski
   i usunięcie kursywy / szarych pasków z motywu Hello robimy tu. */
.woocommerce table.shop_attributes{width:100%;margin:0;border:0;border-collapse:collapse}
.woocommerce table.shop_attributes tr{border-bottom:1px solid var(--sand-light-border)}
.woocommerce table.shop_attributes :is(th,td){
  padding:12px 14px !important;border:0 !important;background:transparent !important;
  text-align:left;vertical-align:top;font-style:normal;line-height:1.5}
.woocommerce table.shop_attributes tr:nth-child(odd) :is(th,td){background:var(--cream-warm-white) !important}
.woocommerce table.shop_attributes th{width:38%;font-weight:600;color:var(--green-forest)}
.woocommerce table.shop_attributes td p{margin:0;padding:0}

/* 18.6 Omdömen – lista recenzji WooCommerce (widget Post Comments)
   Nagłówek „Recensioner” ukryty, bo wiersz ma już nagłówek „Omdömen”. */
.woocommerce #reviews .woocommerce-Reviews-title{display:none}
.woocommerce #reviews :is(.woocommerce-noreviews,.woocommerce-verification-required){
  margin:0 0 6px;font-size:var(--fs-body-small,14px);color:var(--taupe-muted-text)}
.woocommerce #reviews .commentlist{margin:0;padding:0;list-style:none}
/* każda recenzja jako jasna karta; WooCommerce ma tu selektor z dwoma ID, stąd !important */
.woocommerce #reviews #comments ol.commentlist li{
  margin:0 0 10px !important;padding:16px 18px !important;
  background:var(--cream-warm-white);border:1px solid var(--sand-light-border) !important;border-radius:12px}
.woocommerce #reviews .commentlist .avatar{display:none}
.woocommerce #reviews .comment-text{margin:0 !important;padding:0 !important;border:0 !important;border-radius:0 !important}
.woocommerce #reviews .commentlist li .comment_container{display:block}
.woocommerce #reviews .star-rating{color:var(--pink-soft);font-size:13px}
.woocommerce #reviews .meta{margin:4px 0 8px;font-size:var(--fs-caption,13px);color:var(--taupe-muted-text)}
.woocommerce #reviews .meta strong{color:var(--green-forest);font-size:var(--fs-body-medium,15px)}
.woocommerce #reviews .woocommerce-review__verified{color:var(--green-pine);font-style:normal}
/* paginacja recenzji (Settings → Discussion → Break comments into pages) */
.woocommerce #reviews .woocommerce-pagination{margin:6px 0 14px;text-align:left}
.woocommerce #reviews .woocommerce-pagination :is(a,span){
  display:inline-grid;place-items:center;min-width:36px;height:36px;padding:0 10px;margin-right:6px;
  border:1px solid var(--sand-light-border);border-radius:999px;font-size:var(--fs-body-small,14px);color:var(--green-forest);text-decoration:none}
.woocommerce #reviews .woocommerce-pagination .current{background:var(--pink-strong);border-color:var(--pink-strong);color:var(--white)}
.woocommerce #reviews .woocommerce-pagination a:hover{border-color:var(--pink-strong);color:var(--pink-deep);background:var(--pink-mist)}
/* paginacja: usunięcie kwadratowych ramek listy z domyślnego CSS WooCommerce */
.woocommerce #reviews .woocommerce-pagination ul{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;border:0 !important;white-space:normal}
.woocommerce #reviews .woocommerce-pagination ul li{float:none;margin:0;padding:0;border:0 !important;overflow:visible}
.woocommerce #reviews .woocommerce-pagination ul li :is(a,span){margin:0}

/* 18.7 Ceny promocyjne – bez podkreślenia nowej ceny (motyw Hello podkreśla <ins>) */
.woocommerce :is(.price,.amount) ins,.woocommerce ins .amount,.price ins{text-decoration:none}


/* 18.5b Specyfikacja na telefonie: etykieta i wartość w jednym wierszu (motyw Hello układa je jedna pod drugą) */
@media (max-width:767px){
  .woocommerce table.shop_attributes{display:table !important;table-layout:fixed}
  .woocommerce table.shop_attributes tbody{display:table-row-group !important}
  .woocommerce table.shop_attributes tr{display:table-row !important}
  .woocommerce table.shop_attributes :is(th,td){display:table-cell !important;padding:10px 12px !important}
  .woocommerce table.shop_attributes th{width:42% !important}
}

/* 18.4b Kotwice na telefonie – przewijany rząd bez paska przewijania
   (Wrap: No Wrap i Overflow: Auto ustawione w panelu) → CSS Classes: kk-anchors */
.kk-anchors{scrollbar-width:none;-ms-overflow-style:none}
.kk-anchors::-webkit-scrollbar{display:none}

/* =====================================================================
   19. STRONA PRODUKTER / KATEGORIE (Products Archive)
   ===================================================================== */
/* 19.1 Icon List z białymi kółkami (np. USP w nagłówku kategorii) → CSS Classes: kk-checklist kk-checklist--white */
.kk-checklist--white .elementor-icon-list-icon{background:var(--white) !important}

/* 19.2 Chipy kategorii – widget WordPress Menu → CSS Classes: kk-chips
   W panelu: Typography (Body small 500), kolory tekstu Normal/Hover/Active, Padding 16/9, Space Between 8.
   Tu tylko to, czego panel nie ma: ramka, tło i zaokrąglenie każdej pozycji + przewijanie na telefonie. */
.kk-chips .elementor-nav-menu > li > a.elementor-item{
  border:1px solid var(--sand-light-border);border-radius:999px;background:var(--white);transition:background .2s,border-color .2s}
.kk-chips .elementor-nav-menu > li > a.elementor-item:hover{border-color:var(--pink-strong);background:var(--pink-mist)}
.kk-chips .elementor-nav-menu > li.current-menu-item > a.elementor-item,
.kk-chips .elementor-nav-menu > li > a.elementor-item-active{background:var(--green-forest);border-color:var(--green-forest)}
.kk-chips .elementor-menu-toggle,.kk-chips .elementor-nav-menu--dropdown{display:none !important}
@media (max-width:767px){
  .kk-chips .elementor-nav-menu--main{display:block !important}
  .kk-chips .elementor-nav-menu{flex-wrap:nowrap !important;overflow-x:auto;scrollbar-width:none}
  .kk-chips .elementor-nav-menu::-webkit-scrollbar{display:none}
  .kk-chips .elementor-nav-menu > li > a.elementor-item{white-space:nowrap}
}

/* 19.3 Licznik i sortowanie (shortcody [kk_result_count] i [kk_catalog_ordering] z functions.php) */
.kk-result-count{margin:0;font-size:var(--fs-body-small,14px);color:var(--taupe-muted-text)}
.woocommerce-ordering{margin:0}
.woocommerce-ordering select.orderby{
  font:inherit;font-size:var(--fs-body-small,14px);color:var(--charcoal-body-text);
  padding:10px 38px 10px 14px;border:1px solid var(--sand-light-border);border-radius:10px;
  background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%231F4A36' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") right 10px center/18px no-repeat;
  -webkit-appearance:none;appearance:none;cursor:pointer}
.woocommerce-ordering select.orderby:focus{outline:none;border-color:var(--pink-strong)}

/* 19.4 Paginacja Loop Grid – pigułki jak w recenzjach */
.elementor-pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:28px}
.elementor-pagination .page-numbers{
  display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 12px;margin:0 !important;
  border:1px solid var(--sand-light-border);border-radius:999px;font-size:var(--fs-body-small,14px);color:var(--green-forest)}
.elementor-pagination .page-numbers.current{background:var(--pink-strong);border-color:var(--pink-strong);color:var(--white)}
.elementor-pagination a.page-numbers:hover{border-color:var(--pink-strong);background:var(--pink-mist);color:var(--pink-deep)}
.elementor-pagination .page-numbers.dots{border:0}

/* 19.5 Poradnik pod produktami (ACF „guide”) → kontener: CSS Classes kk-guide · przycisk: kk-more
   Cały tekst jest w HTML (Google czyta całość) – CSS tylko przycina wysokość; skrypt przełącza klasę is-open. */
.kk-guide .elementor-widget-text-editor{max-width:72ch;position:relative;max-height:340px;overflow:hidden}
.kk-guide .elementor-widget-text-editor::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;
  background:linear-gradient(rgba(255,255,255,0),var(--white));pointer-events:none}
.kk-guide.is-open .elementor-widget-text-editor,.kk-guide.is-short .elementor-widget-text-editor{max-height:none}
.kk-guide.is-open .elementor-widget-text-editor::after,.kk-guide.is-short .elementor-widget-text-editor::after{display:none}
.kk-guide.is-short .kk-more{display:none}
.kk-guide .elementor-widget-text-editor h2{font-size:var(--fs-h3,22px);font-weight:600;line-height:1.25;color:var(--green-forest);margin:28px 0 10px}
.kk-guide .elementor-widget-text-editor h2:first-child{margin-top:0}
.kk-guide .elementor-widget-text-editor h3{font-size:var(--fs-h4,17px);font-weight:600;line-height:1.3;color:var(--green-forest);margin:20px 0 6px}
.kk-guide .elementor-widget-text-editor p{margin:0 0 12px;line-height:1.7}
.kk-guide .elementor-widget-text-editor a{color:var(--pink-strong);text-decoration:underline;text-underline-offset:3px}
.kk-guide .elementor-widget-text-editor ul{list-style:none;margin:6px 0 12px;padding:0;display:flex;flex-direction:column;gap:10px}
.kk-guide .elementor-widget-text-editor li{position:relative;padding-left:32px;line-height:1.5}
.kk-guide .elementor-widget-text-editor li::before{content:"";position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;
  background:var(--pink-mist) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23BF5070' d='M9.5 16.2 5.3 12l-1.4 1.4 5.6 5.6 11-11-1.4-1.4z'/%3E%3C/svg%3E") center/12px no-repeat}
.kk-guide .kk-more .elementor-button-icon{transition:transform .3s}
.kk-guide.is-open .kk-more .elementor-button-icon{transform:rotate(180deg)}
.elementor-editor-active .kk-guide .elementor-widget-text-editor{max-height:none}

/* =====================================================================
   20. KOSZYK (strona Varukorg – widget Cart Elementor Pro + [kk_ship_bar])
   ===================================================================== */
/* 20.1 Kroki zakupu (widget HTML: <ol class="kk-steps">…) */
.kk-steps{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;font-size:var(--fs-body-small,14px);font-weight:500;color:var(--taupe-muted-text)}
.kk-steps li{display:flex;align-items:center;gap:8px}
.kk-steps li+li::before{content:"";width:28px;height:1px;background:var(--sand-light-border);margin-right:4px}
.kk-steps span{flex:0 0 24px;width:24px;height:24px;box-sizing:border-box;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;padding:0 0 1px;border:1px solid var(--sand-light-border);font-size:12px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.kk-steps .on{color:var(--pink-deep)}
.kk-steps .on span{background:var(--pink-strong);border-color:var(--pink-strong);color:var(--white)}
.kk-steps .done{color:var(--green-pine)}
.kk-steps .done span{background:var(--green-sage);border-color:var(--green-sage);color:var(--green-pine)}
@media (max-width:767px){.kk-steps li+li::before{width:14px}}

/* 20.2 Pasek darmowej dostawy ([kk_ship_bar]) */
.kk-ship-bar{display:flex;flex-direction:column;gap:8px;padding:14px 18px;border-radius:12px;background:var(--pink-mist);font-size:var(--fs-body-small,14px);color:var(--green-forest)}
.kk-ship-bar[hidden]{display:none}
.kk-ship-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.kk-ship-top p{margin:0}
.kk-ship-num{font-size:var(--fs-caption,13px);color:var(--taupe-muted-text);font-variant-numeric:tabular-nums}
.kk-bar{height:6px;border-radius:999px;background:var(--white);overflow:hidden}
.kk-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--green-leaf),var(--green-pine));transition:width .4s}
.kk-nudge{display:flex;align-items:center;gap:12px;padding-top:4px}
.kk-nudge img{width:40px !important;height:40px !important;border-radius:8px;object-fit:cover;background:var(--white)}
.kk-nudge span{flex:1;min-width:0}
.kk-nudge-btn{flex:0 0 auto;display:inline-flex;align-items:center;height:34px;padding:0 14px;border:1px solid var(--pink-strong);border-radius:999px;background:var(--white);color:var(--pink-deep) !important;font-size:13px;font-weight:600;white-space:nowrap}
.kk-nudge-btn:hover{background:var(--pink-strong);color:var(--white) !important}
@media (max-width:767px){.kk-nudge{flex-wrap:wrap}.kk-nudge-btn{width:100%;justify-content:center}}

/* 20.3 Lista produktów: miniatura, pole ilości jako pigułka, placeholder kuponu */
/* Tabela produktów jako siatka: zdjęcie | nazwa | ilość | summa | kosz (kolumna PRIS ukryta – cena jednostkowa nie jest potrzebna, jest summa wiersza) */
.elementor-widget-woocommerce-cart table.shop_table.cart,
.elementor-widget-woocommerce-cart table.shop_table.cart :is(thead,tbody){display:block;width:100%}
.elementor-widget-woocommerce-cart table.shop_table.cart tr{display:block}
.elementor-widget-woocommerce-cart table.shop_table.cart :is(thead tr,tr.cart_item){display:grid;grid-template-columns:96px minmax(0,1fr) auto minmax(96px,auto) 44px;grid-template-areas:"img name qty sum del";align-items:center}
.elementor-widget-woocommerce-cart table.shop_table.cart thead th.product-price,
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-price{display:none !important}
.elementor-widget-woocommerce-cart table.shop_table.cart .product-thumbnail{grid-area:img}
.elementor-widget-woocommerce-cart table.shop_table.cart .product-name{grid-area:name}
.elementor-widget-woocommerce-cart table.shop_table.cart .product-quantity{grid-area:qty}
.elementor-widget-woocommerce-cart table.shop_table.cart .product-subtotal{grid-area:sum;text-align:right}
.elementor-widget-woocommerce-cart table.shop_table.cart .product-remove{grid-area:del;text-align:right}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td{align-self:stretch;display:flex !important;align-items:center;padding:20px 12px !important}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-thumbnail{padding-left:0 !important}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-subtotal{justify-content:flex-end}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-remove{justify-content:flex-end;padding-right:0 !important}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-name{flex-direction:column;align-items:flex-start;justify-content:center;gap:4px}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td::before{content:none !important;display:none !important}
.elementor-widget-woocommerce-cart table.shop_table.cart thead th.product-thumbnail{padding-left:0 !important}
.elementor-widget-woocommerce-cart .product-thumbnail img{width:96px !important;max-width:none !important;height:96px;object-fit:cover;border-radius:12px;background:var(--cream-linen)}
/* × → ikona kosza po prawej */
.elementor-widget-woocommerce-cart td.product-remove a.remove{display:inline-flex !important;align-items:center;justify-content:center;width:36px !important;height:36px !important;border-radius:50%;font-size:0 !important;line-height:0;color:transparent !important;background:none !important;transition:background .2s}
.elementor-widget-woocommerce-cart td.product-remove a.remove::before{content:"";width:18px;height:18px;background:var(--taupe-muted-text);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4.5A1.5 1.5 0 0 1 9.5 3h5A1.5 1.5 0 0 1 16 4.5V6M18.5 6l-.8 13.1A2 2 0 0 1 15.7 21H8.3a2 2 0 0 1-2-1.9L5.5 6M10 10.5v6M14 10.5v6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4.5A1.5 1.5 0 0 1 9.5 3h5A1.5 1.5 0 0 1 16 4.5V6M18.5 6l-.8 13.1A2 2 0 0 1 15.7 21H8.3a2 2 0 0 1-2-1.9L5.5 6M10 10.5v6M14 10.5v6'/%3E%3C/svg%3E") center/contain no-repeat;transition:background .2s}
.elementor-widget-woocommerce-cart td.product-remove a.remove:hover{background:var(--pink-mist) !important}
.elementor-widget-woocommerce-cart td.product-remove a.remove:hover::before{background:var(--pink-strong)}
/* Wariant (np. 0,5 l) pod nazwą produktu – nazwa bez wariantu daje filtr w functions.php.
   Etykieta atrybutu („Volym:”) ukryta, zostaje sama wartość. */
.elementor-widget-woocommerce-cart dl.variation{display:flex;flex-wrap:wrap;gap:0 10px;margin:2px 0 0;padding:0;border:0;font-size:var(--fs-body-small,14px);font-weight:400;color:var(--taupe-muted-text)}
.elementor-widget-woocommerce-cart dl.variation dt{display:none}
.elementor-widget-woocommerce-cart dl.variation :is(dd,dd p){margin:0;padding:0;white-space:nowrap}

/* mobile: [zdjęcie | nazwa, wariant, summa | kosz na całą wysokość], pod spodem ilość na całą szerokość */
@media (max-width:767px){
.elementor-widget-woocommerce-cart table.shop_table.cart thead{display:none !important}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item{grid-template-columns:84px minmax(0,1fr) 44px;grid-template-rows:auto auto auto;grid-template-areas:"img name del" "img sum del" "qty qty qty";column-gap:14px;row-gap:0;padding:18px 0}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td{padding:0 !important;border:0 !important;background:none !important;text-align:left !important}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-thumbnail{display:flex !important;align-self:start}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-name{align-self:end;justify-content:flex-end}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-subtotal{align-self:start;justify-content:flex-start;padding-top:6px !important;font-weight:600}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-quantity{padding-top:14px !important}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-quantity .kk-qty{width:100% !important;height:40px}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-quantity .kk-qty .kk-qty-btn{flex:0 0 52px;width:52px}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-quantity .kk-qty .qty{flex:1 1 auto !important;max-width:none !important}
/* kosz: przycisk na kolorowym tle, na całą wysokość zdjęcia i nazwy */
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-remove{align-self:stretch;padding:0 !important}
.elementor-widget-woocommerce-cart td.product-remove a.remove{width:44px !important;height:100% !important;min-height:84px;border-radius:12px;background:var(--pink-mist) !important}
.elementor-widget-woocommerce-cart td.product-remove a.remove::before{background:var(--pink-deep)}
.elementor-widget-woocommerce-cart td.product-remove a.remove:hover{background:var(--pink-blush) !important}
.elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item+tr{border-top:1px solid var(--sand-light-border)}
.elementor-widget-woocommerce-cart .product-thumbnail img{width:84px !important;height:84px}
}
/* pole ilości z przyciskami − / + (skrypt klarkalla-kassa.js dodaje klasę kk-qty) */
.kk-qty{display:inline-flex !important;align-items:center;height:42px;border:1px solid var(--sand-light-border);border-radius:999px;background:var(--white);overflow:hidden}
/* bez natywnych strzałek przeglądarki (Chrome/Safari/Firefox) – liczba na środku */
.kk-qty .qty{-moz-appearance:textfield !important;appearance:textfield !important;margin:0 !important;flex:0 0 36px}
.kk-qty .qty::-webkit-inner-spin-button,.kk-qty .qty::-webkit-outer-spin-button{-webkit-appearance:none !important;appearance:none !important;margin:0 !important;display:none}
.kk-qty .qty{width:36px !important;min-width:0 !important;height:100% !important;padding:0 !important;border:0 !important;border-radius:0 !important;background:none !important;box-shadow:none !important;text-align:center !important;text-indent:0 !important;font-weight:600;color:var(--green-forest)}
/* liczba dokładnie między − a + (Elementor/Hello dawały polu wyrównanie do lewej) */
.kk-qty .qty{flex:0 0 36px !important;max-width:36px !important}
/* motyw Hello nadaje każdemu <button> ramkę, zaokrąglenie i padding – zerujemy je tylko tutaj */
.kk-qty .kk-qty-btn{flex:0 0 36px;width:36px;height:100%;min-height:0;margin:0 !important;padding:0 !important;border:0 !important;border-radius:0 !important;background:none !important;box-shadow:none !important;font:inherit;font-size:18px;line-height:1;color:var(--green-forest) !important;cursor:pointer}
.kk-qty .kk-qty-btn:hover{color:var(--pink-strong) !important;background:var(--pink-mist) !important}
.elementor-widget-woocommerce-product-add-to-cart .kk-qty{height:52px}
.elementor-widget-woocommerce-cart input::placeholder{color:var(--taupe-placeholder);opacity:1}

/* 20.4 Podsumowanie: wyróżniony Totalt, neutralna nazwa wysyłki, bez komunikatu o adresie, przycisk na całą szerokość, kupon w podsumowaniu */
.elementor-widget-woocommerce-cart .order-total :is(th,td,strong,.amount,bdi){font-size:20px !important;font-weight:600 !important;color:var(--green-forest) !important}
.elementor-widget-woocommerce-cart .order-total :is(th,td){padding-top:14px !important}
.elementor-widget-woocommerce-cart .order-total :is(.includes_tax,small){display:block;margin-top:2px;white-space:nowrap}
.elementor-widget-woocommerce-cart .order-total :is(.includes_tax,small),
.elementor-widget-woocommerce-cart .order-total :is(.includes_tax,small) *{font-size:var(--fs-caption,13px) !important;font-weight:400 !important;color:var(--taupe-muted-text) !important}
.elementor-widget-woocommerce-cart .order-total :is(.includes_tax,small) *{display:inline}
.elementor-widget-woocommerce-cart :is(.woocommerce-shipping-methods,#shipping_method) label{color:var(--charcoal-body-text) !important}
.elementor-widget-woocommerce-cart .woocommerce-shipping-destination{display:none}
/* Wiersze podsumowania (Delsumma, Frakt, Rabatt…) – jeden układ: nazwa do lewej krawędzi, kwota do prawej, ta sama czcionka.
   Elementor układa wiersz Frakt inaczej niż resztę (etykieta z data-title) – tu wyrównujemy wszystkie tak samo. Linia nad Totalt zostaje z panelu. */
.elementor-widget-woocommerce-cart .cart_totals table.shop_table tr{display:flex !important;justify-content:space-between;align-items:baseline;gap:16px}
.elementor-widget-woocommerce-cart .cart_totals table.shop_table :is(th,td){display:block !important;width:auto !important;padding-left:0 !important;padding-right:0 !important;text-indent:0}
.elementor-widget-woocommerce-cart .cart_totals table.shop_table td{margin-left:auto;text-align:right !important}
.elementor-widget-woocommerce-cart .cart_totals table.shop_table td::before{content:none !important;display:none !important}
/* linia nad Totalt na całą szerokość boxu (komórki w układzie flex mają szerokość tekstu, więc linia idzie na wiersz, nie na komórki) */
.elementor-widget-woocommerce-cart .cart_totals table.shop_table :is(th,td){border:0 !important}
.elementor-widget-woocommerce-cart .cart_totals table.shop_table tr.order-total{border-top:1px solid var(--sand-light-border) !important;margin-top:6px}
.elementor-widget-woocommerce-cart .cart_totals tr:not(.order-total) :is(th,td,.amount,bdi,strong,label){font-weight:400 !important}
.elementor-widget-woocommerce-cart .cart_totals tr:not(.order-total) :is(th,td){font-size:inherit;color:var(--charcoal-body-text) !important}
.elementor-widget-woocommerce-cart #shipping_method{margin:0 !important;padding:0 !important;list-style:none}
.elementor-widget-woocommerce-cart #shipping_method li{margin:0 !important;padding:0 !important;text-align:right}
.elementor-widget-woocommerce-cart #shipping_method label{margin:0 !important}
/* kupon w podsumowaniu: „−50 kr [Ta bort]” w jednej linii */
.elementor-widget-woocommerce-cart .cart_totals tr.cart-discount td{display:flex !important;align-items:center;justify-content:flex-end;gap:8px}
.elementor-widget-woocommerce-cart .cart_totals a.woocommerce-remove-coupon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--pink-mist);color:var(--pink-deep) !important;font-size:16px;line-height:1;text-decoration:none !important;transition:background .2s,color .2s}
.elementor-widget-woocommerce-cart .cart_totals a.woocommerce-remove-coupon:hover{background:var(--pink-strong);color:var(--white) !important}
.elementor-widget-woocommerce-cart .wc-proceed-to-checkout{display:block !important;width:100% !important;padding-bottom:0}
.elementor-widget-woocommerce-cart a.checkout-button{display:flex !important;width:100% !important;max-width:none !important;justify-content:center;box-sizing:border-box}
.kk-coupon-in-totals{margin:16px 0 !important;padding:0 !important;border:0 !important;background:none !important;box-shadow:none !important}
.kk-coupon-in-totals :is(.coupon,form,.coupon-col){display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;align-items:stretch;gap:10px;width:100%;margin:0 !important;padding:0 !important}
.kk-coupon-in-totals .coupon-col-start{flex:1 1 auto !important;max-width:none !important;min-width:0;width:auto !important;padding:0 !important}
.kk-coupon-in-totals .coupon-col-end{flex:0 0 auto !important;max-width:none !important;margin:0 !important;width:auto !important;padding:0 !important}
.kk-coupon-in-totals input[name="coupon_code"]{display:block;width:100% !important;max-width:none !important;min-width:0;margin:0 !important}
.kk-coupon-in-totals button{flex:0 0 auto;width:auto !important;height:100%;margin:0 !important;white-space:nowrap}


/* =====================================================================
   21. KASA (strona Kassa – widget Checkout Elementor Pro)
   Boxy, pola, przyciski i kolory tekstów ustawione w panelu widgetu (Style).
   Tu tylko to, czego panel nie ma.
   ===================================================================== */
/* 21.1 Gwiazdka przy polach obowiązkowych – kolor marki zamiast czerwieni WooCommerce */
.elementor-widget-woocommerce-checkout-page .required{color:var(--pink-strong) !important;text-decoration:none;border:0}

/* 21.2 „Leverera till en annan adress” – własny box jak pozostałe (Sections nie obejmuje tej części).
   Margines boczny 12 px = Sections → Margin w panelu (desktop); na tablecie/telefonie 0. */
.elementor-widget-woocommerce-checkout-page .woocommerce-shipping-fields{background:var(--white);border:1px solid var(--sand-light-border);border-radius:24px;padding:18px 28px;margin:0 12px 20px}
.elementor-widget-woocommerce-checkout-page #ship-to-different-address{margin:0;padding:0;font-size:inherit;line-height:1.4}
.elementor-widget-woocommerce-checkout-page #ship-to-different-address :is(label,span){display:flex;align-items:center;gap:10px;margin:0;cursor:pointer;font-size:var(--fs-body,16px);font-weight:500;color:var(--charcoal-body-text) !important}
.elementor-widget-woocommerce-checkout-page #ship-to-different-address input{width:18px;height:18px;margin:0;accent-color:var(--pink-strong)}
/* pola adresu dostawy w tym samym boxie – bez drugiej ramki, którą dokłada ustawienie Sections */
.elementor-widget-woocommerce-checkout-page .woocommerce-shipping-fields .shipping_address{margin:0 !important;padding:18px 0 0 !important;border:0 !important;border-radius:0 !important;background:none !important;box-shadow:none !important}
@media (max-width:1024px){.elementor-widget-woocommerce-checkout-page .woocommerce-shipping-fields{margin:0 0 20px;padding:16px 20px}}

/* 21.3 Box „Meddelande” bez pustego pasa po ukrytym nagłówku */
.elementor-widget-woocommerce-checkout-page .woocommerce-additional-fields > h3:empty{display:none}

/* 21.4 Din beställning: Frakt jak Delsumma (bez różowej, pogrubionej etykiety) */
.elementor-widget-woocommerce-checkout-page #shipping_method{margin:0 !important;padding:0 !important;list-style:none}
.elementor-widget-woocommerce-checkout-page #shipping_method li{margin:0 !important;padding:0 !important}
.elementor-widget-woocommerce-checkout-page #shipping_method :is(label,.amount,bdi){margin:0;font:inherit !important;color:inherit !important}

/* 21.5 Totalt wyróżniony jak w koszyku, „inkl. moms” w linii pod kwotą */
.elementor-widget-woocommerce-checkout-page .order-total :is(th,td,strong,.amount,bdi){font-size:20px !important;font-weight:600 !important;color:var(--green-forest) !important}
.elementor-widget-woocommerce-checkout-page .order-total .includes_tax{display:block;margin-top:2px;white-space:nowrap}
.elementor-widget-woocommerce-checkout-page .order-total .includes_tax,
.elementor-widget-woocommerce-checkout-page .order-total .includes_tax *{font-size:var(--fs-caption,13px) !important;font-weight:400 !important;color:var(--taupe-muted-text) !important}
.elementor-widget-woocommerce-checkout-page .order-total .includes_tax *{display:inline}

/* 21.5b Nazwa produktu w Din beställning – normalna wysokość linii (na telefonie linie nachodziły na siebie) */
.elementor-widget-woocommerce-checkout-page .woocommerce-checkout-review-order-table td.product-name{line-height:1.45 !important}
.elementor-widget-woocommerce-checkout-page .woocommerce-checkout-review-order-table .product-quantity{font-weight:500;color:var(--taupe-muted-text)}

/* 21.6 Płatność: nazwa metody jak tytuł, bez różu */
.elementor-widget-woocommerce-checkout-page .wc_payment_method > label{font-weight:600;color:var(--green-forest) !important}

/* =====================================================================
   22. STRONA TACK (widget Purchase Summary)
   Karty, kolory i typografia w panelu widgetu; tu tylko wyróżniony Totalt.
   ===================================================================== */
.elementor-widget-woocommerce-purchase-summary tfoot tr:has(.includes_tax) th,
.elementor-widget-woocommerce-purchase-summary tfoot tr:has(.includes_tax) td > .amount,
.elementor-widget-woocommerce-purchase-summary tfoot tr:has(.includes_tax) td > .amount *{font-size:20px !important;font-weight:600 !important;color:var(--green-forest) !important}
.elementor-widget-woocommerce-purchase-summary tfoot .includes_tax{display:block;margin-top:2px}
.elementor-widget-woocommerce-purchase-summary tfoot .includes_tax,
.elementor-widget-woocommerce-purchase-summary tfoot .includes_tax *{font-size:var(--fs-caption,13px) !important;font-weight:400 !important;color:var(--taupe-muted-text) !important}


/* =====================================================================
   23. KOMUNIKATY WOOCOMMERCE
   Kolory, tło, ramka, zaokrąglenie, linki i przyciski: Site Settings → WooCommerce → Notices (panel).
   Tu tylko: ikony w stylu strony (zamiast fontu WooCommerce; kolor ikony z panelu) i przycisk pod tekstem na telefonie.
   ===================================================================== */
:is(.woocommerce-message,.woocommerce-info,.woocommerce-error)::before{
  content:"" !important;width:20px;height:20px;
  background-color:currentColor;-webkit-mask:var(--kk-n-mask) center/contain no-repeat;mask:var(--kk-n-mask) center/contain no-repeat}
.woocommerce-message{--kk-n-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m8 12.5 2.8 2.8L16.5 9.5'/%3E%3C/svg%3E")}
.woocommerce-info{--kk-n-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 11v6M12 7.5h.01'/%3E%3C/svg%3E")}
.woocommerce-error{--kk-n-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 7v6M12 16.5h.01'/%3E%3C/svg%3E")}
@media (max-width:767px){
  :is(.woocommerce-message,.woocommerce-info,.woocommerce-error) a.button{float:none;display:table;margin:10px 0 0 !important}
}

/* =====================================================================
   24. DODAWANIE DO KOSZYKA Z KARTY PRODUKTU (AJAX)
   Po dodaniu otwiera się wysuwany koszyk (Menu Cart → Side Cart, Automatically Open Cart),
   więc link „Visa varukorg” pod przyciskiem w karcie jest zbędny – karta nie zmienia wysokości.
   ===================================================================== */
a.added_to_cart.wc-forward{display:none !important}
/* czarna obwódka po kliknięciu tylko dla nawigacji klawiaturą */
:is(.add_to_cart_button,.elementor-button,.button):focus:not(:focus-visible){outline:0 !important;box-shadow:none !important}

/* 23b. Komunikaty poza widgetami (strona produktu, archiwum, inne szablony):
   WooCommerce wstawia je nad szablonem Elementora, bez kontenera – tu dostają tę samą szerokość i marginesy co treść.
   Komunikaty w koszyku, kasie i widgecie WooCommerce Notices zostają bez zmian (są już w kontenerze). */
.woocommerce-notices-wrapper:not(.elementor-widget *){max-width:1180px;margin:0 auto;padding:0 20px;box-sizing:border-box}
.woocommerce-notices-wrapper:not(.elementor-widget *):has(> *){padding-top:20px}
.woocommerce-notices-wrapper:not(.elementor-widget *) > :last-child{margin-bottom:0 !important}
@media (max-width:767px){.woocommerce-notices-wrapper:not(.elementor-widget *){padding:0 10px}.woocommerce-notices-wrapper:not(.elementor-widget *):has(> *){padding-top:12px}}

/* =====================================================================
   25. STRONY TEKSTOWE (szablon „Sida – text”: Köpvillkor, Leverans, FAQ…)
   Treść wpisywana w zwykłym edytorze WordPressa → Post Content z klasą kk-prose.
   Panel ustawia kolor i typografię akapitu; tu odstępy nagłówków, listy, linki i tabela.
   ===================================================================== */
.kk-prose{max-width:760px}
.kk-prose :is(h2,h3,h4){color:var(--green-forest);margin:1.6em 0 .5em;letter-spacing:0}
/* nagłówki w treści mniejsze niż tytuł strony (H1 = Heading 2): H2 jak Heading 3, H3 jak Heading 4 */
.kk-prose h2{font-size:22px !important;font-weight:600;line-height:1.3}
.kk-prose h3{font-size:17px !important;font-weight:600;line-height:1.35}
.kk-prose h4{font-size:15px !important;font-weight:600}
.kk-prose > :first-child,.kk-prose .elementor-widget-container > :first-child{margin-top:0}
.kk-prose p{margin:0 0 1em}
.kk-prose :is(ul,ol){margin:0 0 1.2em;padding-left:1.3em}
.kk-prose li{margin:0 0 .4em}
.kk-prose li::marker{color:var(--pink-strong)}
.kk-prose a{color:var(--green-forest);text-decoration:underline;text-underline-offset:2px}
.kk-prose a:hover{color:var(--pink-strong)}
.kk-prose table{width:100%;border-collapse:collapse;margin:0 0 1.2em;font-size:var(--fs-body-small,14px)}
.kk-prose :is(th,td){padding:10px 12px;border:1px solid var(--sand-light-border);text-align:left;vertical-align:top}
.kk-prose th{background:var(--cream-warm-white);color:var(--green-forest);font-weight:600}
.kk-prose blockquote{margin:0 0 1.2em;padding:16px 20px;border-left:3px solid var(--pink-soft);background:var(--pink-mist);border-radius:0 12px 12px 0}
/* breadcrumbs Rank Math */
.kk-crumbs .rank-math-breadcrumb p{margin:0;font-size:var(--fs-caption,13px);color:var(--taupe-muted-text)}
.kk-crumbs .rank-math-breadcrumb a{color:var(--taupe-muted-text)}
.kk-crumbs .rank-math-breadcrumb a:hover{color:var(--pink-strong)}

/* =====================================================================
   26. KONTAKTA OSS
   ===================================================================== */
/* mapa: zaokrąglone rogi działają też na iframe Google + delikatnie wyciszone kolory pod paletę */
.kk-map,.kk-map .elementor-widget-container{border-radius:24px;overflow:hidden}
.kk-map iframe{display:block;filter:saturate(.7) contrast(.95)}
/* lista wyboru tematu w formularzu – strzałka w kolorze marki */
.kk-form .elementor-select-wrapper::before{color:var(--pink-strong)}
.kk-form select.elementor-field-textual{padding-right:40px !important}
/* pole plików (Upload) w formularzu – przycisk „Välj filer” jako pigułka, cała ramka jak inne pola */
.kk-form .elementor-field-type-upload .elementor-upload-field{
  width:100%;padding:10px 12px !important;border:1px dashed var(--sand-light-border) !important;border-radius:10px;
  background:var(--cream-warm-white);font-size:var(--fs-body-small,14px);color:var(--taupe-muted-text);cursor:pointer}
.kk-form .elementor-field-type-upload .elementor-upload-field:hover{border-color:var(--pink-pale) !important}
.kk-form .elementor-upload-field::file-selector-button{
  margin-right:12px;padding:8px 16px;border:1px solid var(--pink-strong);border-radius:999px;
  background:var(--white);color:var(--pink-deep);font:inherit;font-weight:500;cursor:pointer;transition:background .2s}
.kk-form .elementor-upload-field::file-selector-button:hover{background:var(--pink-mist)}
.kk-form .elementor-field-type-upload::after{content:"Max 3 filer, 5 MB per fil (jpg, png, heic, pdf).";display:block;width:100%;margin-top:6px;font-size:var(--fs-caption,13px);color:var(--taupe-muted-text)}

/* =====================================================================
   27. FÖR FÖRETAG – kotwice (#handla, #aterforsaljare, #kontakt) nie chowają się pod przyklejonym headerem
   ===================================================================== */
:is(#handla,#aterforsaljare,#kontakt,#dokument){scroll-margin-top:110px}
/* strzałka listy wyboru (Elementor rysuje ją ikoną w .select-caret-down-wrapper) */
.kk-form .select-caret-down-wrapper{color:var(--pink-strong) !important;right:14px !important}
.kk-form .select-caret-down-wrapper svg{fill:var(--pink-strong) !important}

/* =====================================================================
   28. MITT KONTO (shortcode [woocommerce_my_account] na stronie z Elementora)
   ===================================================================== */
.woocommerce-account .woocommerce{font-size:var(--fs-body,16px);color:var(--charcoal-body-text)}
.kk-login-intro{max-width:640px;margin:0 0 24px;color:var(--taupe-muted-text)}
/* karty */
.woocommerce-account #customer_login{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:0}
.woocommerce-account #customer_login::before,.woocommerce-account #customer_login::after{display:none}
.woocommerce-account #customer_login > div{float:none !important;width:auto !important;padding:32px;background:var(--white);border:1px solid var(--sand-light-border);border-radius:24px}
.woocommerce-account #customer_login h2{margin:0 0 16px;font-size:22px;font-weight:600;color:var(--green-forest)}
.woocommerce-account form.login,.woocommerce-account form.register{margin:0 !important;padding:0 !important;border:0 !important;border-radius:0 !important}
/* pola */
.woocommerce-account .woocommerce form .form-row{margin:0 0 16px;padding:0}
.woocommerce-account .woocommerce form .form-row label{display:block;margin-bottom:6px;font-size:var(--fs-body-small,14px);font-weight:500;color:var(--charcoal-body-text)}
.woocommerce-account .woocommerce :is(input.input-text,select,textarea){width:100%;padding:12px 14px;border:1px solid var(--sand-light-border) !important;border-radius:10px !important;background:var(--white);font-size:var(--fs-body-small,14px);color:var(--charcoal-body-text);box-shadow:none;transition:border-color .2s,box-shadow .2s}
.woocommerce-account .woocommerce :is(input.input-text,select,textarea):focus{outline:none;border-color:var(--pink-strong) !important;box-shadow:0 0 0 3px rgba(191,80,112,.1)}
.woocommerce-account .woocommerce .required{color:var(--pink-strong);text-decoration:none;border:0}
.woocommerce-account .woocommerce input[type="checkbox"]{accent-color:var(--pink-strong);width:16px;height:16px;margin:0 6px 0 0;vertical-align:-2px}
.woocommerce-account .woocommerce-form-login__rememberme{display:inline-flex !important;align-items:center;margin:0 !important;font-weight:400 !important}
/* rząd: przycisk + Kom ihåg mig w jednej linii */
.woocommerce-account form.login .form-row:has(.woocommerce-form-login__submit){display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.woocommerce-account form.login .woocommerce-form-login__submit{order:1;float:none !important;margin:0 !important}
.woocommerce-account form.login .woocommerce-form-login__rememberme{order:2}
/* rejestracja: tekst o haśle i polityka */
.woocommerce-account form.register > p:not(.form-row):not(.woocommerce-form-row){font-size:var(--fs-body-small,14px);line-height:1.5;color:var(--taupe-muted-text);margin:0 0 12px}
.woocommerce-account .woocommerce-privacy-policy-text p{line-height:1.5;margin:0 0 20px}
.woocommerce-account .woocommerce .show-password-input{top:50%;transform:translateY(-50%);right:12px}
/* przyciski */
.woocommerce-account .woocommerce :is(.button,button.button){display:inline-flex;align-items:center;justify-content:center;padding:13px 26px !important;border:1px solid var(--pink-strong) !important;border-radius:999px !important;background:var(--pink-strong) !important;color:var(--white) !important;font-size:15px;font-weight:500;line-height:1.3;transition:background .25s,color .25s}
.woocommerce-account .woocommerce :is(.button,button.button):hover{background:var(--pink-mist) !important;color:var(--pink-deep) !important}
.woocommerce-account .woocommerce table .button{padding:8px 16px !important;font-size:var(--fs-caption,13px)}
/* linki */
.woocommerce-account .woocommerce-MyAccount-content a:not(.button):not(.kk-account-tile),
.woocommerce-account .lost_password a,.woocommerce-account .woocommerce-privacy-policy-text a{color:var(--green-forest);text-decoration:underline;text-underline-offset:2px}
.woocommerce-account .woocommerce :is(.woocommerce-MyAccount-content,.lost_password,.woocommerce-privacy-policy-text) a:not(.button):hover{color:var(--pink-strong)}
.woocommerce-account .lost_password{margin:8px 0 0}
.woocommerce-account .woocommerce-privacy-policy-text p{font-size:var(--fs-caption,13px);color:var(--taupe-muted-text)}

/* zalogowany: menu z lewej + treść w karcie */
.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation){display:grid;grid-template-columns:260px minmax(0,1fr);gap:32px;align-items:start}
.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation)::before,
.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation)::after{display:none !important;content:none !important}
/* komunikat w treści konta: tekst z lewej, przycisk z prawej */
.woocommerce-account .woocommerce-MyAccount-content :is(.woocommerce-info,.woocommerce-message){display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:0 0 20px}
.woocommerce-account .woocommerce-MyAccount-content :is(.woocommerce-info,.woocommerce-message) .button{order:2;margin:0 0 0 auto !important;float:none !important;padding:8px 18px !important;font-size:var(--fs-caption,13px);white-space:nowrap}
.woocommerce-account .woocommerce-MyAccount-navigation,.woocommerce-account .woocommerce-MyAccount-content{float:none !important;width:auto !important}
.woocommerce-account .woocommerce-MyAccount-navigation ul{margin:0;padding:10px;list-style:none;background:var(--white);border:1px solid var(--sand-light-border);border-radius:24px}
.woocommerce-account .woocommerce-MyAccount-navigation li{margin:0}
.woocommerce-account .woocommerce-MyAccount-navigation a{display:block;padding:12px 16px;border-radius:14px;color:var(--green-forest);font-weight:500;text-decoration:none;transition:background .2s,color .2s}
.woocommerce-account .woocommerce-MyAccount-navigation a:hover{background:var(--cream-warm-white);color:var(--pink-strong)}
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a{background:var(--pink-mist);color:var(--pink-deep)}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout{margin-top:6px !important;padding-top:6px !important;border-top:1px solid var(--sand-light-border)}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a{color:var(--taupe-muted-text)}
.woocommerce-account .woocommerce-MyAccount-content{padding:32px;background:var(--white);border:1px solid var(--sand-light-border);border-radius:24px}
.woocommerce-account .woocommerce-MyAccount-content > p:first-of-type{margin-top:0}
.woocommerce-account .woocommerce-MyAccount-content :is(h2,h3){margin:0 0 12px;font-size:20px;font-weight:600;color:var(--green-forest)}
/* kafelki na Översikt */
.kk-account-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}
.kk-account-tile{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border:1px solid var(--sand-light-border);border-radius:18px;background:var(--cream-warm-white);text-decoration:none !important;transition:border-color .2s,transform .2s}
.kk-account-tile strong{color:var(--green-forest);font-weight:600}
.kk-account-tile span{font-size:var(--fs-body-small,14px);color:var(--taupe-muted-text)}
.kk-account-tile:hover{border-color:var(--pink-pale);transform:translateY(-2px)}
/* tabela zamówień / szczegóły zamówienia */
.woocommerce-account table.shop_table{width:100%;border:1px solid var(--sand-light-border) !important;border-radius:18px !important;border-collapse:separate;border-spacing:0;overflow:hidden;margin:0 0 20px}
.woocommerce-account table.shop_table :is(th,td){padding:14px 16px !important;border-top:1px solid var(--sand-light-border) !important;font-size:var(--fs-body-small,14px);vertical-align:middle}
.woocommerce-account table.shop_table thead th{border-top:0 !important;background:var(--cream-warm-white);color:var(--green-forest);font-weight:600}
.woocommerce-account table.shop_table :is(th,td){border-left:0 !important;border-right:0 !important;border-bottom:0 !important}
.woocommerce-account table.shop_table tbody tr > :is(th,td),
.woocommerce-account table.shop_table tfoot tr > :is(th,td){background:transparent !important}
.woocommerce-account table.shop_table tbody tr:hover > :is(th,td){background:var(--cream-warm-white) !important}
.woocommerce-account table.my_account_orders td.woocommerce-orders-table__cell-order-actions{text-align:right}
/* opis pod polem (np. Visningsnamn) */
.woocommerce-account .woocommerce form .form-row em,
.woocommerce-account .woocommerce form .form-row .description{display:block;margin-top:6px;font-style:normal;font-size:var(--fs-caption,13px);color:var(--taupe-muted-text)}
.woocommerce-account .woocommerce-EditAccountForm > p:last-of-type,.woocommerce-account .woocommerce-address-fields > p:last-child{margin:24px 0 0}
.woocommerce-account mark{background:none;color:var(--green-forest);font-weight:600}
/* adresy */
.woocommerce-account .woocommerce-Addresses{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.woocommerce-account .woocommerce-Addresses::before,.woocommerce-account .woocommerce-Addresses::after{display:none}
.woocommerce-account .woocommerce-Address{float:none !important;width:auto !important;padding:20px;border:1px solid var(--sand-light-border);border-radius:18px}
.woocommerce-account .woocommerce-Address-title{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin:0 0 12px}
.woocommerce-account .woocommerce-Address-title::before,.woocommerce-account .woocommerce-Address-title::after{display:none !important}
.woocommerce-account .woocommerce-Address-title h2{font-size:17px;margin:0 !important;padding:0 !important;float:none !important}
.woocommerce-account .woocommerce-Address-title a.edit{float:none !important;font-size:var(--fs-body-small,14px)}
.woocommerce-account address{font-style:normal;line-height:1.6;margin-top:8px}
.woocommerce-account fieldset{margin:24px 0 0;padding:20px;border:1px solid var(--sand-light-border);border-radius:18px}
.woocommerce-account legend{padding:0 8px;font-weight:600;color:var(--green-forest)}

/* szczegóły zamówienia (Visa) */
.woocommerce-account mark.order-status{display:inline-block;padding:2px 10px;border-radius:999px;background:var(--pink-mist);color:var(--pink-deep);font-weight:600}
.woocommerce-account .woocommerce-order-details{margin:24px 0 0}
.woocommerce-account table.order_details :is(th,td):last-child{text-align:right}
.woocommerce-account table.order_details tfoot th{font-weight:500;color:var(--charcoal-body-text)}
.woocommerce-account table.order_details tfoot td{font-weight:600}
.woocommerce-account table.order_details tfoot tr:has(.includes_tax) :is(th,td){font-size:18px;font-weight:700;color:var(--green-forest)}
.woocommerce-account table.order_details .includes_tax{display:block;font-size:var(--fs-caption,13px);font-weight:400;color:var(--taupe-muted-text)}
.woocommerce-account table.order_details .product-quantity{font-weight:500;color:var(--taupe-muted-text);white-space:nowrap}
.woocommerce-account .woocommerce-customer-details{margin-top:24px}
.woocommerce-account .woocommerce-customer-details .woocommerce-columns--addresses{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.woocommerce-account .woocommerce-customer-details .woocommerce-columns--addresses::before,
.woocommerce-account .woocommerce-customer-details .woocommerce-columns--addresses::after{display:none !important}
.woocommerce-account .woocommerce-customer-details .woocommerce-column{float:none !important;width:auto !important;margin:0 !important}
.woocommerce-account .woocommerce-customer-details address{height:calc(100% - 40px);padding:20px !important;border:1px solid var(--sand-light-border) !important;border-radius:18px !important;border-bottom-width:1px !important;border-right-width:1px !important}
.woocommerce-account .woocommerce-customer-details address p{margin:8px 0 0}
.woocommerce-account .woocommerce-customer-details address p::before{color:var(--pink-strong)}
@media (max-width:767px){
  .woocommerce-account .woocommerce-customer-details .woocommerce-columns--addresses{grid-template-columns:1fr;gap:20px}
  .woocommerce-account .woocommerce-customer-details address{height:auto}
  .woocommerce-account table.order_details :is(th,td){padding:12px !important}
}

@media (max-width:1024px){
  .woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation){grid-template-columns:minmax(0,1fr);gap:20px}
  .woocommerce-account .woocommerce-MyAccount-navigation,.woocommerce-account .woocommerce-MyAccount-content{min-width:0}
  .woocommerce-account .woocommerce-MyAccount-navigation ul{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;border-radius:999px;padding:6px}
  .woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar{display:none}
  .woocommerce-account .woocommerce-MyAccount-navigation a{white-space:nowrap;border-radius:999px;padding:10px 16px}
  .woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout{margin:0 !important;padding:0 !important;border:0}
}
@media (max-width:767px){
  .woocommerce-account #customer_login,.woocommerce-account .woocommerce-Addresses,.kk-account-tiles{grid-template-columns:1fr}
  .woocommerce-account #customer_login > div,.woocommerce-account .woocommerce-MyAccount-content{padding:20px}
  .woocommerce-account .woocommerce :is(input.input-text,select,textarea){font-size:16px}
  /* zamówienia jako karty */
  .woocommerce-account table.shop_table_responsive thead{display:none}
  .woocommerce-account table.shop_table_responsive tbody tr{display:block;padding:12px 16px;border-top:1px solid var(--sand-light-border)}
  .woocommerce-account table.shop_table_responsive tbody tr:first-child{border-top:0}
  .woocommerce-account table.shop_table_responsive tbody tr > :is(th,td){display:block !important;padding:6px 0 !important;border:0 !important;text-align:right !important;line-height:1.5}
  .woocommerce-account table.shop_table_responsive tbody tr > :is(th,td)::before{content:attr(data-title) !important;float:left !important;margin-right:12px;font-weight:600;color:var(--green-forest);text-align:left}
  .woocommerce-account table.shop_table_responsive tbody tr > :is(th,td)::after{content:"";display:table;clear:both}
  .woocommerce-account table.shop_table_responsive td.woocommerce-orders-table__cell-order-actions::before{line-height:34px}
  .woocommerce-account table.shop_table_responsive tbody tr > :is(th,td):not([data-title])::before{display:none}
  .woocommerce-account table.shop_table_responsive tbody tr:hover > :is(th,td){background:transparent !important}
  .woocommerce-account .woocommerce-MyAccount-content :is(.woocommerce-info,.woocommerce-message) .button{margin:0 !important}
}

/* =====================================================================
   29. WYNIKI WYSZUKIWANIA – pusty wynik [kk_no_results]
   ===================================================================== */
.kk-no-results{max-width:640px;margin:8px auto 0;padding:40px 32px;text-align:center;background:var(--cream-warm-white);border:1px solid var(--sand-light-border);border-radius:24px}
.kk-no-results__title{margin:0 0 8px;font-size:22px;font-weight:600;color:var(--green-forest)}
.kk-no-results__text{margin:0 0 24px;color:var(--taupe-muted-text)}
.kk-no-results__text em{font-style:normal;color:var(--charcoal-body-text);font-weight:500}
.kk-no-results__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.kk-no-results__btn{display:inline-flex;align-items:center;padding:13px 26px;border:1px solid var(--pink-strong);border-radius:999px;background:var(--pink-strong);color:var(--white) !important;font-weight:500;text-decoration:none !important;transition:background .25s,color .25s}
.kk-no-results__btn:hover{background:var(--pink-mist);color:var(--pink-deep) !important}
.kk-no-results__btn--ghost{background:var(--white);color:var(--pink-deep) !important}
@media (max-width:767px){.kk-no-results{padding:28px 20px}}

/* =====================================================================
   30. WEBBPLATSKARTA – [rank_math_html_sitemap]
   ===================================================================== */
.rank-math-html-sitemap{display:grid;gap:20px;margin-top:8px}
.rank-math-html-sitemap__section{padding:24px 28px;background:var(--white);border:1px solid var(--sand-light-border);border-radius:24px}
.rank-math-html-sitemap .rank-math-html-sitemap__title{margin:0 0 12px !important;font-size:20px;font-weight:600;color:var(--green-forest)}
.rank-math-html-sitemap .rank-math-html-sitemap__list{margin:0 !important;padding:0 !important;list-style:none !important;columns:2;column-gap:32px}
.rank-math-html-sitemap .rank-math-html-sitemap__item{margin:0 !important;padding:6px 0 6px 18px !important;position:relative;break-inside:avoid}
.rank-math-html-sitemap .rank-math-html-sitemap__item::before{content:"" !important;position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--pink-strong)}
.rank-math-html-sitemap .rank-math-html-sitemap__link{color:var(--green-forest) !important;text-decoration:none !important;transition:color .2s}
.rank-math-html-sitemap .rank-math-html-sitemap__link:hover{color:var(--pink-strong) !important;text-decoration:underline !important}
@media (max-width:767px){
  .rank-math-html-sitemap__section{padding:20px}
  .rank-math-html-sitemap .rank-math-html-sitemap__list{columns:1}
}

/* =====================================================================
   31. BLOGG – lista wpisów, karta wpisu (Loop Item), pojedynczy wpis
   ===================================================================== */
/* nagłówek listy */
.kk-blog-hero{background:linear-gradient(120deg,var(--pink-mist) 0%,#fbeef1 55%,var(--green-sage-mist) 100%)}
.kk-blog-intro p{margin:0;max-width:640px;font-size:var(--fs-lead,17px);color:var(--charcoal-body-text)}
.kk-blog-intro p + p{margin-top:.6em}

/* pigułki kategorii [kk_blog_cats] – jak chipy w sklepie */
.kk-blog-cats{display:flex;flex-wrap:wrap;gap:8px}
.kk-blog-cats a{display:inline-flex;align-items:center;padding:9px 16px;border:1px solid var(--sand-light-border);border-radius:999px;background:var(--white);color:var(--green-forest);font-size:var(--fs-body-small,14px);font-weight:500;line-height:1.2;text-decoration:none;transition:background .2s,border-color .2s,color .2s}
.kk-blog-cats a:hover{border-color:var(--pink-strong);background:var(--pink-mist);color:var(--green-forest)}
.kk-blog-cats a.is-active{background:var(--green-forest);border-color:var(--green-forest);color:var(--white)}
@media (max-width:767px){
  .kk-blog-cats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-10px;padding-right:10px}
  .kk-blog-cats::-webkit-scrollbar{display:none}
  .kk-blog-cats a{white-space:nowrap}
}
/* lista kategorii w panelu bocznym [kk_blog_cats layout="list"] */
.kk-blog-catlist{display:flex;flex-direction:column}
.kk-blog-catlist a{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-top:1px solid var(--sand-light-border);color:var(--green-forest);font-size:var(--fs-body-small,14px);font-weight:500;text-decoration:none}
.kk-blog-catlist a:first-child{border-top:0}
.kk-blog-catlist a span{min-width:24px;padding:2px 8px;border-radius:999px;background:var(--cream-linen,#F4F1EC);color:var(--taupe-muted-text);font-size:12px;text-align:center}
.kk-blog-catlist a:hover,.kk-blog-catlist a.is-active{color:var(--pink-strong)}

/* meta [kk_post_meta]: kategoria · data · czas czytania */
.kk-post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;font-size:var(--fs-caption,13px);color:var(--taupe-muted-text);line-height:1.4}
.kk-post-meta > span + span::before{content:"·";margin:0 8px;color:var(--sand-light-border,#E7DFDA);color:#c9bfb9}
.kk-post-meta__cat{color:var(--pink-strong);font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:11px}

/* karta wpisu (Loop Item „Karta wpisu”, kontener z klasą kk-post-card) – cała karta klikalna */
.kk-post-card{position:relative;height:100%;transition:border-color .25s,box-shadow .25s,transform .25s}
.kk-post-card:hover{border-color:var(--pink-pale) !important;box-shadow:0 12px 28px -18px rgba(31,74,54,.35);transform:translateY(-2px)}
.kk-post-card .kk-post-card__img img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:18px;display:block}
.kk-post-card .kk-post-card__title a{color:inherit}
.kk-post-card .kk-post-card__title a::after{content:"";position:absolute;inset:0;z-index:1}
.kk-post-card:hover .kk-post-card__title a{color:var(--pink-strong)}
.kk-post-card .kk-post-card__more{margin-top:auto}
.kk-post-card .kk-post-card__more .elementor-heading-title::after{content:" →";transition:margin .2s}
.kk-post-card:hover .kk-post-card__more .elementor-heading-title::after{margin-left:4px}
.kk-post-card .elementor-widget-theme-post-excerpt p{margin:0}

/* pojedynczy wpis */
.kk-post-hero img{width:100%;aspect-ratio:16/8;object-fit:cover;border-radius:24px;display:block}
@media (max-width:767px){ .kk-post-hero img{aspect-ratio:4/3;border-radius:18px} }
.kk-post-cta .elementor-button{background:var(--pink-strong) !important;color:var(--white) !important}
.kk-post-cta .elementor-button:hover{background:var(--white) !important;color:var(--pink-deep) !important}
/* paginacja Loop Grid */
.elementor-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:32px}
.elementor-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--sand-light-border);border-radius:999px;color:var(--green-forest);font-size:var(--fs-body-small,14px);font-weight:500;text-decoration:none}
.elementor-pagination .page-numbers.current{background:var(--green-forest);border-color:var(--green-forest);color:var(--white)}
.elementor-pagination a.page-numbers:hover{border-color:var(--pink-strong);background:var(--pink-mist)}

/* 31.1 poprawki listy bloga */
.e-con.kk-blog-hero{background:linear-gradient(120deg,var(--pink-mist) 0%,#fbeef1 55%,var(--green-sage-mist) 100%) !important}
.kk-blog-title{margin:0;color:var(--green-forest);
  font-family:var(--e-global-typography-533681f-font-family),sans-serif;font-size:var(--e-global-typography-533681f-font-size,52px);
  font-weight:var(--e-global-typography-533681f-font-weight,600);line-height:var(--e-global-typography-533681f-line-height,1.1);letter-spacing:var(--e-global-typography-533681f-letter-spacing,normal)}
@media (max-width:767px){ .kk-blog-title{font-size:34px} }
/* CTA (zielony pas): tekst zajmuje miejsce, przycisk nie wychodzi poza pas */
.e-con:has(> .elementor-widget-button.kk-post-cta) > .e-con{flex:1 1 0 !important;min-width:0;width:auto !important}
.e-con:has(> .elementor-widget-button.kk-post-cta) > .kk-post-cta{flex:none}
.kk-post-cta .elementor-button{white-space:nowrap}

/* =====================================================================
   32. TREŚĆ WPISU – elementy z edytora (bloki) + spis treści Easy TOC
   Wszystko w kk-prose, więc działa też na stronach tekstowych.
   ===================================================================== */
.kk-prose > * , .kk-prose .elementor-widget-container > *{max-width:100%}
.kk-prose :is(h2,h3,.ez-toc-section){scroll-margin-top:110px}
/* obrazy */
.kk-prose figure{margin:0 0 1.4em}
.kk-prose img{max-width:100%;height:auto;border-radius:18px}
.kk-prose .wp-block-image.is-style-kk-rounded img{border-radius:24px}
.kk-prose figcaption,.kk-prose .wp-element-caption{margin-top:8px;font-size:var(--fs-caption,13px);color:var(--taupe-muted-text);text-align:center}
.kk-prose .wp-block-gallery{gap:10px}
.kk-prose .wp-block-gallery img{border-radius:14px}
.kk-prose .alignleft{float:left;margin:4px 24px 12px 0;max-width:45%}
.kk-prose .alignright{float:right;margin:4px 0 12px 24px;max-width:45%}
@media (max-width:767px){ .kk-prose :is(.alignleft,.alignright){float:none;margin:0 0 1.2em;max-width:100%} }
/* wideo / embed */
.kk-prose .wp-block-embed iframe,.kk-prose iframe[src*="youtube"],.kk-prose iframe[src*="vimeo"]{width:100%;height:auto;aspect-ratio:16/9;border-radius:18px;border:0}
/* tabele: przewijanie na telefonie */
.kk-prose .wp-block-table{overflow-x:auto;-webkit-overflow-scrolling:touch}
.kk-prose .wp-block-table table{min-width:480px}
.kk-prose .wp-block-table.is-style-kk-table table,.kk-prose .wp-block-table.is-style-stripes table{border-collapse:separate;border-spacing:0;border:1px solid var(--sand-light-border);border-radius:16px;overflow:hidden}
.kk-prose .wp-block-table.is-style-kk-table :is(th,td){border:0;border-top:1px solid var(--sand-light-border)}
.kk-prose .wp-block-table.is-style-kk-table thead th{border-top:0;background:var(--green-forest);color:var(--white)}
.kk-prose .wp-block-table.is-style-kk-table tbody tr:nth-child(even) td{background:var(--cream-warm-white)}
.kk-prose .wp-block-table thead{border-bottom:0}
/* cytat i cytat wyróżniony */
.kk-prose .wp-block-quote{margin:0 0 1.4em;padding:18px 22px;border-left:3px solid var(--pink-soft);background:var(--pink-mist);border-radius:0 14px 14px 0}
.kk-prose .wp-block-quote p:last-of-type{margin-bottom:0}
.kk-prose .wp-block-quote cite{display:block;margin-top:8px;font-size:var(--fs-caption,13px);font-style:normal;color:var(--taupe-muted-text)}
.kk-prose .wp-block-pullquote{margin:0 0 1.4em;padding:28px 24px;border:0;border-top:2px solid var(--pink-strong);border-bottom:2px solid var(--pink-strong);text-align:center}
.kk-prose .wp-block-pullquote blockquote{margin:0;padding:0;border:0;background:none}
.kk-prose .wp-block-pullquote p{font-size:20px;line-height:1.45;font-weight:500;color:var(--green-forest)}
/* separator, przyciski, kolumny, details (FAQ) */
.kk-prose .wp-block-separator{margin:2em 0;border:0;border-top:1px solid var(--sand-light-border);opacity:1}
.kk-prose .wp-block-buttons{margin:0 0 1.2em;gap:10px}
.kk-prose .wp-block-button__link{display:inline-flex;align-items:center;padding:12px 24px;border-radius:999px;background:var(--pink-strong);color:var(--white) !important;font-size:15px;font-weight:500;text-decoration:none !important;transition:background .25s,color .25s}
.kk-prose .wp-block-button__link:hover{background:var(--pink-mist);color:var(--pink-deep) !important}
.kk-prose .wp-block-button.is-style-outline .wp-block-button__link{background:transparent;border:1px solid var(--pink-strong);color:var(--pink-deep) !important}
.kk-prose .wp-block-columns{gap:24px;margin:0 0 1.2em}
.kk-prose .wp-block-details{margin:0 0 10px;padding:14px 18px;border:1px solid var(--sand-light-border);border-radius:14px;background:var(--cream-warm-white)}
.kk-prose .wp-block-details summary{cursor:pointer;font-weight:600;color:var(--green-forest)}
.kk-prose .wp-block-details[open] summary{margin-bottom:8px}
.kk-prose mark,.kk-prose .has-inline-color{border-radius:4px}
.kk-prose mark{background:var(--pink-blush);padding:0 .2em;color:inherit}
/* style Grupy: Tips / Viktigt / Steg / CTA */
.kk-prose .wp-block-group:is(.is-style-kk-tip,.is-style-kk-note,.is-style-kk-steps,.is-style-kk-cta){margin:0 0 1.6em;padding:20px 24px;border-radius:18px}
.kk-prose .wp-block-group > :last-child{margin-bottom:0}
.kk-prose .is-style-kk-tip{background:var(--green-sage-mist);border-left:4px solid var(--green-leaf)}
.kk-prose .is-style-kk-note{background:var(--pink-mist);border-left:4px solid var(--pink-strong)}
.kk-prose .is-style-kk-steps{background:var(--white);border:1px solid var(--sand-light-border)}
.kk-prose .is-style-kk-steps h3{margin-top:0}
.kk-prose .is-style-kk-steps ol{list-style:none;counter-reset:kk;padding-left:0}
.kk-prose .is-style-kk-steps ol li{counter-increment:kk;position:relative;padding-left:40px;margin-bottom:12px;min-height:28px}
.kk-prose .is-style-kk-steps ol li::before{content:counter(kk);position:absolute;left:0;top:-1px;width:28px;height:28px;border-radius:50%;background:var(--pink-mist);color:var(--pink-deep);font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:center}
.kk-prose .is-style-kk-cta{padding:28px 32px;background:var(--green-forest);color:var(--green-mint-grey)}
.kk-prose .is-style-kk-cta :is(h2,h3,h4){margin-top:0;color:var(--white)}
.kk-prose .is-style-kk-cta .kk-eyebrow{margin:0 0 4px;font-size:13px;font-weight:600;color:var(--pink-soft)}
.kk-prose .is-style-kk-cta a:not(.wp-block-button__link){color:var(--white)}
.kk-prose .is-style-kk-cta .wp-block-button__link:hover{background:var(--white);color:var(--pink-deep) !important}
@media (max-width:767px){ .kk-prose .is-style-kk-cta{padding:22px 20px} }

/* spis treści – Easy Table of Contents (motyw wtyczki: „None/Transparent”) */
.kk-prose #ez-toc-container,#ez-toc-container.ez-toc-v2_0{display:block;width:100% !important;max-width:100%;margin:0 0 2em;padding:20px 24px;background:var(--cream-warm-white) !important;border:1px solid var(--sand-light-border) !important;border-radius:18px;box-shadow:none !important}
#ez-toc-container .ez-toc-title-container{display:flex;align-items:center;justify-content:space-between;gap:12px}
#ez-toc-container .ez-toc-title{margin:0;font-size:var(--fs-body-small,14px) !important;font-weight:600 !important;letter-spacing:.06em;text-transform:uppercase;color:var(--green-forest) !important}
#ez-toc-container .ez-toc-title-toggle,#ez-toc-container .ez-toc-toggle{display:inline-flex}
#ez-toc-container .ez-toc-js-icon-con,#ez-toc-container .ez-toc-toggle .ez-toc-js-icon-con{border:1px solid var(--sand-light-border);border-radius:999px;padding:2px 6px;background:var(--white)}
#ez-toc-container nav{margin-top:12px}
#ez-toc-container ul.ez-toc-list{margin:0 !important;padding:0 !important;list-style:none !important;counter-reset:kktoc}
#ez-toc-container ul.ez-toc-list li{margin:0 !important;padding:0;list-style:none}
#ez-toc-container ul.ez-toc-list > li{counter-increment:kktoc}
#ez-toc-container ul.ez-toc-list li::marker{content:none}
#ez-toc-container ul.ez-toc-list > li{border-top:1px solid var(--sand-light-border)}
#ez-toc-container ul.ez-toc-list > li:first-child{border-top:0}
#ez-toc-container a.ez-toc-link{display:flex;gap:10px;padding:9px 0;color:var(--green-forest) !important;font-size:15px;font-weight:500;line-height:1.4;text-decoration:none !important}
#ez-toc-container ul.ez-toc-list > li > a.ez-toc-link::before{content:counter(kktoc,decimal-leading-zero);flex:none;min-width:22px;color:var(--pink-strong);font-weight:600;font-size:13px;line-height:1.6}
#ez-toc-container a.ez-toc-link:hover{color:var(--pink-strong) !important}
#ez-toc-container ul ul{margin:-2px 0 8px 32px !important;padding:0 !important;list-style:none !important}
#ez-toc-container ul ul li{position:relative;padding-left:14px !important}
#ez-toc-container ul ul li::before{content:"";position:absolute;left:0;top:13px;width:5px;height:5px;border-radius:50%;background:var(--pink-soft)}
#ez-toc-container ul ul a.ez-toc-link{padding:4px 0;font-size:14px;font-weight:400;color:var(--taupe-muted-text) !important}
#ez-toc-container .ez-toc-counter,#ez-toc-container span.ez-toc-counter{display:none}
@media (max-width:767px){
  .kk-prose #ez-toc-container,#ez-toc-container.ez-toc-v2_0{padding:16px 18px;border-radius:14px}
  #ez-toc-container a.ez-toc-link{font-size:14px;padding:8px 0}
}

/* 32.1 tabele – nasz wygląd dla każdej tabeli (też „Paski”/domyślnej), tytuł boxa */
.kk-prose .wp-block-table table{border-collapse:separate !important;border-spacing:0;border:1px solid var(--sand-light-border) !important;border-radius:16px;overflow:hidden}
.kk-prose .wp-block-table :is(th,td){border:0 !important;border-top:1px solid var(--sand-light-border) !important;padding:12px 14px}
.kk-prose .wp-block-table tr:first-child > :is(th,td){border-top:0 !important}
.kk-prose .wp-block-table thead th{background:var(--green-forest) !important;color:var(--white);font-weight:600}
.kk-prose .wp-block-table tbody tr:nth-child(odd) td{background:var(--white) !important}
.kk-prose .wp-block-table tbody tr:nth-child(even) td{background:var(--cream-warm-white) !important}
.kk-prose .wp-block-table figcaption{text-align:left}
/* tytuł w boxie (akapit z klasą kk-box-title albo nagłówek w boxie) */
.kk-prose .wp-block-group[class*="is-style-kk-"] :is(.kk-box-title,h2,h3,h4){margin:0 0 8px !important;font-size:18px !important;font-weight:600;line-height:1.35;color:var(--green-forest)}
.kk-prose .is-style-kk-cta :is(.kk-box-title,h2,h3,h4){color:var(--white) !important;font-size:20px !important}
.kk-prose .wp-block-group[class*="is-style-kk-"] .wp-block-buttons{margin:14px 0 0}

/* =====================================================================
   33. STRONA „SNART” (tymczasowa strona główna, szablon Canvas)
   ===================================================================== */
.kk-waitlist .elementor-form-fields-wrapper{border:1px solid var(--sand-light-border);box-shadow:0 10px 30px -20px rgba(31,74,54,.35)}
.kk-waitlist .elementor-message{color:var(--green-forest);font-weight:500}
.kk-waitlist .elementor-message.elementor-message-danger{color:var(--pink-deep)}
.kk-waitlist .elementor-field-type-submit .elementor-button{border-radius:999px;padding:12px 24px}
.kk-snart-img img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:28px;display:block}
@media (max-width:1024px){ .kk-snart-img img{aspect-ratio:16/10} }
.kk-snart-grid > .kk-snart-card{flex:1 1 calc(25% - 12px) !important;min-width:220px;border:1px solid var(--sand-light-border)}
@media (max-width:767px){ .kk-snart-grid > .kk-snart-card{flex-basis:100% !important;min-width:0} }
.kk-snart-foot p{margin:0}
.kk-snart-foot p + p{margin-top:4px}
.kk-snart-foot a{color:var(--green-forest);text-decoration:underline;text-underline-offset:2px}
#vantelista{scroll-margin-top:24px}

/* 33.1 Väntelista z polem zgody (Acceptance) – pigułka = pole e-mail z przyciskiem w środku, zgoda pod spodem */
.kk-waitlist .elementor-form-fields-wrapper{position:relative;flex-wrap:wrap !important;align-items:flex-start;gap:12px 0;padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.kk-waitlist .elementor-form-fields-wrapper:focus-within{box-shadow:none}
.kk-waitlist .elementor-field-type-email{flex:1 1 100% !important;width:100% !important;max-width:100% !important}
.kk-waitlist .elementor-field-type-email .elementor-field-textual{box-sizing:border-box;height:60px;min-height:60px;padding:0 170px 0 22px !important;background:var(--white) !important;border:1px solid var(--sand-light-border) !important;border-radius:999px !important;box-shadow:0 10px 30px -20px rgba(31,74,54,.35) !important;transition:box-shadow .2s,border-color .2s}
.kk-waitlist .elementor-field-type-email .elementor-field-textual:focus{border-color:var(--green-moss-grey) !important;box-shadow:0 0 0 3px rgba(78,138,99,.14) !important}
.kk-waitlist .elementor-field-type-submit{position:absolute;top:8px;right:8px;width:auto !important;margin:0 !important;padding:0 !important}
.kk-waitlist .elementor-field-type-submit .elementor-button{box-sizing:border-box;height:44px;min-height:0;padding:0 22px !important;line-height:1}
.kk-waitlist .elementor-field-type-acceptance{order:5;flex:1 1 100% !important;width:100% !important;max-width:100% !important}
.kk-waitlist .elementor-field-type-acceptance .elementor-field-subgroup,
.kk-waitlist .elementor-field-type-acceptance .elementor-field-option{display:flex;align-items:flex-start;gap:8px;margin:0}
.kk-waitlist .elementor-field-type-acceptance input[type="checkbox"]{flex:none;width:16px;height:16px;margin:2px 0 0;accent-color:var(--pink-strong)}
.kk-waitlist .elementor-field-type-acceptance label{font-size:var(--fs-caption,13px);line-height:1.5;color:var(--taupe-muted-text)}
.kk-waitlist .elementor-field-type-acceptance label a{color:var(--pink-strong);text-decoration:underline;text-underline-offset:2px}
.kk-waitlist .elementor-message{order:6;flex:1 1 100%}
@media (max-width:767px){
  .kk-waitlist .elementor-form-fields-wrapper{flex-direction:row !important;border-radius:0}
  .kk-waitlist .elementor-field-type-email .elementor-field-textual{padding:0 18px !important;height:52px;min-height:52px}
  .kk-waitlist .elementor-field-type-submit{position:static;order:4;flex:1 1 100% !important;width:100% !important}
  .kk-waitlist .elementor-field-type-submit .elementor-button{width:100% !important;height:48px}
}