/* =========================
   CHECKOUT – ADRESY (PS8) – premium i spójnie
   ========================= */
:root{
  --sa-accent:#1e88e5;
  --sa-accent-dark:#1565c0;
  --sa-border:#d7dde6;
  --sa-border-strong:#c9d3e0;
  --sa-soft:#f6f8fb;
  --sa-text:#1c2430;
}

/* Karta formularza adresu */
#checkout #checkout-addresses-step .content,
#checkout #checkout-addresses-step .js-address-form{
  background:#fff;
  border:1px solid var(--sa-border);
  border-radius:14px;
  padding:18px;
}

/* Nagłówek */
#checkout #checkout-addresses-step .page-subheading,
#checkout #checkout-addresses-step .step-title{
  font-weight:650;
  color:var(--sa-text);
  margin-bottom:14px;
}

/* Labelki bardziej premium */
#checkout #checkout-addresses-step label{
  font-weight:550;
  color:var(--sa-text);
  margin-bottom:6px;
}

/* Inputy – grubsze ramki i ładny focus */
#checkout #checkout-addresses-step .form-control,
#checkout #checkout-addresses-step select.form-control{
  height:46px;
  border-radius:12px;
  border:2px solid var(--sa-border-strong);
  background:#fff;
  font-size:15px;
  box-shadow:none;
}

#checkout #checkout-addresses-step .form-control:focus{
  border-color: rgba(30,136,229,.95);
  box-shadow: 0 0 0 4px rgba(30,136,229,.12);
  outline:none;
}

/* Odstępy w formularzu */
#checkout #checkout-addresses-step .form-group{
  margin-bottom:14px;
}

/* Checkbox „Użyj tego adresu także do faktury” – naprawa i premium */
#checkout #checkout-addresses-step .custom-control{
  padding-left:0 !important;
  margin-top: 10px;
}
#checkout #checkout-addresses-step .custom-control-label{
  display:block !important;
  position:relative !important;
  padding: 12px 14px 12px 52px !important;
  background: var(--sa-soft);
  border: 1px solid var(--sa-border);
  border-radius: 14px;
  cursor:pointer;
  font-weight:600;
}
#checkout #checkout-addresses-step .custom-control-input{
  position:absolute !important;
  opacity:0 !important;
}

/* kwadrat */
#checkout #checkout-addresses-step .custom-control-label::before{
  content:"";
  position:absolute;
  left:16px; top:14px;
  width:20px; height:20px;
  border-radius:6px;
  border:2px solid #2b2f38;
  background:#fff;
}
#checkout #checkout-addresses-step .custom-control-input:checked + .custom-control-label::before{
  background: var(--sa-accent);
  border-color: var(--sa-accent);
}

/* ptaszek */
#checkout #checkout-addresses-step .custom-control-label::after{
  content:"";
  position:absolute;
  left:22px; top:20px;
  width:10px; height:6px;
  border-left:3px solid transparent;
  border-bottom:3px solid transparent;
  transform: rotate(-45deg);
}
#checkout #checkout-addresses-step .custom-control-input:checked + .custom-control-label::after{
  border-left-color:#fff;
  border-bottom-color:#fff;
}

/* Przyciski na dole – spójne */
#checkout #checkout-addresses-step .btn,
#checkout #checkout-addresses-step button{
  border-radius:14px;
  font-weight:650;
  padding:12px 18px;
}

#checkout #checkout-addresses-step .btn-primary{
  background: var(--sa-accent) !important;
  border-color: var(--sa-accent) !important;
  color:#fff !important;
  box-shadow: 0 14px 26px rgba(0,0,0,.14);
}
#checkout #checkout-addresses-step .btn-primary:hover{
  background: var(--sa-accent-dark) !important;
  border-color: var(--sa-accent-dark) !important;
}

/* „Anuluj” mniej agresywny */
#checkout #checkout-addresses-step .btn-link,
#checkout #checkout-addresses-step a.btn-link{
  color: var(--sa-accent-dark);
  font-weight:550;
  text-decoration:none;
}
#checkout #checkout-addresses-step .btn-link:hover{
  text-decoration: underline;
}


/* =========================
   CHECKOUT – LOGOWANIE / GOŚĆ (PS8) – premium, spójnie
   ========================= */

:root{
  --sa-accent:#1e88e5;
  --sa-accent-dark:#1565c0;
  --sa-border:#d7dde6;
  --sa-soft:#f6f8fb;
  --sa-text:#1c2430;
}

/* Karta logowania */
#checkout #checkout-personal-information-step .personal-form,
#checkout #checkout-personal-information-step .shadow-box{
  background:#fff;
  border:1px solid var(--sa-border);
  border-radius:14px;
  padding:18px;
}

/* Nagłówki */
#checkout #checkout-personal-information-step .page-subheading,
#checkout #checkout-personal-information-step .step-title{
  font-weight:650;
  color:var(--sa-text);
  margin-bottom:14px;
}

/* Inputy spójne */
#checkout #checkout-personal-information-step .form-control{
  height:46px;
  border-radius:12px;
  border:2px solid #c9d3e0;
  background:#fff;
  box-shadow: none;
  font-size:15px;
}
#checkout #checkout-personal-information-step .form-control:focus{
  border-color: rgba(30,136,229,.95);
  box-shadow: 0 0 0 4px rgba(30,136,229,.12);
  outline: none;
}

/* Przyciski – premium */
#checkout #checkout-personal-information-step button,
#checkout #checkout-personal-information-step .btn{
  border-radius:14px;
  font-weight:650;
  padding:12px 18px;
}

/* Główny CTA (Dalej / kontynuuj) */
#checkout #checkout-personal-information-step .btn-primary{
  background: var(--sa-accent) !important;
  border-color: var(--sa-accent) !important;
  color:#fff !important;
  box-shadow: 0 14px 26px rgba(0,0,0,.14);
}
#checkout #checkout-personal-information-step .btn-primary:hover{
  background: var(--sa-accent-dark) !important;
  border-color: var(--sa-accent-dark) !important;
}

/* „Zamówienie jako Gość” jako secondary */
#checkout #checkout-personal-information-step .btn-outline-primary,
#checkout #checkout-personal-information-step .btn-secondary{
  background:#fff !important;
  border:2px solid rgba(30,136,229,.55) !important;
  color: var(--sa-accent-dark) !important;
}
#checkout #checkout-personal-information-step .btn-outline-primary:hover,
#checkout #checkout-personal-information-step .btn-secondary:hover{
  border-color: rgba(30,136,229,.95) !important;
  box-shadow: 0 12px 22px rgba(0,0,0,.08);
}

/* Link „Nie pamiętasz hasła?” – zamiast czerwonego */
#checkout #checkout-personal-information-step .forgot-password a,
#checkout #checkout-personal-information-step a{
  color: var(--sa-accent-dark);
  text-decoration: none;
  font-weight:600;
}
#checkout #checkout-personal-information-step .forgot-password a:hover{
  text-decoration: underline;
}

/* Układ – trochę mniej pustych przestrzeni */
#checkout #checkout-personal-information-step .form-group{
  margin-bottom:14px;
}

/* Przycisk Google login – spójny i wyśrodkowany */
#checkout #checkout-personal-information-step .glogin,
#checkout #checkout-personal-information-step .google-login,
#checkout #checkout-personal-information-step .btn-google,
#checkout #checkout-personal-information-step .login.customBtnTop{
  display:flex;
  justify-content:center;
  margin-bottom:12px;
}

/* Jeśli w środku jest <a> jako przycisk */
#checkout #checkout-personal-information-step .login.customBtnTop a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:14px;
  border:2px solid #c9d3e0;
  background:#fff;
  font-weight:650;
  color:var(--sa-text);
  text-decoration:none;
}
#checkout #checkout-personal-information-step .login.customBtnTop a:hover{
  border-color: rgba(30,136,229,.75);
  box-shadow: 0 12px 22px rgba(0,0,0,.08);
}

/* Mobile – przyciski pełna szerokość */
@media (max-width: 768px){
  #checkout #checkout-personal-information-step .btn,
  #checkout #checkout-personal-information-step button{
    width:100%;
  }
}

ddd
/* =========================
   DOSTAWA – GRUBSZE RAMKI + PREMIUM LOOK (PS8)
   ========================= */

/* podstawowa karta dostawy */
#checkout-delivery-step .delivery-option,
#checkout-delivery-step .row.delivery-option.js-delivery-option {
  background: #fff;
  border: 2px solid #c9d3e0 !important;   /* GRUBSZA RAMKA */
  border-radius: 14px !important;
  padding: 14px 16px !important;
  margin-bottom: 12px;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
}

/* hover – wyraźnie klikalne */
#checkout-delivery-step .delivery-option:hover,
#checkout-delivery-step .row.delivery-option.js-delivery-option:hover {
  border-color: rgba(30,136,229,.75) !important;
  box-shadow: 0 14px 26px rgba(0,0,0,.10);
}

/* zaznaczona metoda dostawy */
#checkout-delivery-step .delivery-option.selected,
#checkout-delivery-step .row.delivery-option.js-delivery-option:has(input[type="radio"]:checked) {
  border: 3px solid rgba(30,136,229,.95) !important;
  background: rgba(30,136,229,.06) !important;
  box-shadow: 0 16px 30px rgba(30,136,229,.12);
}

/* radio dostawy – czytelniejsze */
#checkout-delivery-step input[type="radio"] {
  width: 18px;
  height: 18px;
  accent-color: #1e88e5;
}

/* wyrównanie treści w dostawie */
#checkout-delivery-step .delivery-option label,
#checkout-delivery-step .row.delivery-option.js-delivery-option label {
  cursor: pointer;
  font-weight: 600;
}

/* GRUBSZE RAMKI + PREMIUM look – płatności (PS8) */
#checkout #checkout-payment-step .payment-option,
#checkout #checkout-payment-step [id^="payment-option-"][id$="-container"]{
  border: 2px solid #c9d3e0 !important;   /* było 1px */
  border-radius: 14px !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
}

/* hover bardziej widoczny */
#checkout #checkout-payment-step .payment-option:hover,
#checkout #checkout-payment-step [id^="payment-option-"][id$="-container"]:hover{
  border-color: rgba(30,136,229,.75) !important;
  box-shadow: 0 14px 26px rgba(0,0,0,.10);
}

/* zaznaczona metoda – wyraźna */
#checkout #checkout-payment-step .payment-option:has(input[type="radio"]:checked),
#checkout #checkout-payment-step [id^="payment-option-"][id$="-container"]:has(input[type="radio"]:checked){
  border: 3px solid rgba(30,136,229,.95) !important;
  background: rgba(30,136,229,.06) !important;
  box-shadow: 0 16px 30px rgba(30,136,229,.12);
}

ss
/* =========================
   PATCH: usuwa "chmurki" i naprawia zgodę (PS8 checkout)
   Wklej NA SAM DÓŁ custom.css
   ========================= */

/* 1) Cofamy globalne stylowanie kroków (to robiło 3 "chmurki") */
#checkout .checkout-step{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* 2) Premium karta TYLKO dla bieżącego kroku płatności */
#checkout #checkout-payment-step .content{
  background: #fff;
  border: 1px solid #d7dde6;
  border-radius: 14px;
  padding: 18px;
}

/* 3) Karty metod płatności – tylko w kroku płatności */
#checkout #checkout-payment-step .payment-option,
#checkout #checkout-payment-step [id^="payment-option-"][id$="-container"]{
  background: #fff;
  border: 1px solid #d7dde6;
  border-radius: 12px;
  padding: 14px;
  margin: 10px 0;
}

/* 4) ZGODA – usuwamy konflikt flex i robimy checkbox "bootstrappowo" */
#checkout #checkout-payment-step #conditions-to-approve{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 14px 0 18px !important;
}

/* Kontener checkboxa */
#checkout #checkout-payment-step #conditions-to-approve .custom-control{
  padding-left: 0 !important;
}

/* Label jako karta */
#checkout #checkout-payment-step #conditions-to-approve .custom-control-label{
  display: block !important;
  position: relative !important;
  padding: 14px 16px 14px 52px !important;
  background: #f6f8fb;
  border: 1px solid #d7dde6;
  border-radius: 14px;
  line-height: 1.6;
  cursor: pointer;
}

/* Nadpisujemy bootstrapowe ::before/::after żeby nie "odlatywało" */
#checkout #checkout-payment-step #conditions-to-approve .custom-control-label::before{
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  top: 16px !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 6px !important;
  border: 2px solid #2b2f38 !important;
  background: #fff !important;
  box-shadow: none !important;
}

#checkout #checkout-payment-step #conditions-to-approve .custom-control-input:checked + .custom-control-label::before{
  background: #1e88e5 !important;
  border-color: #1e88e5 !important;
}

/* Ptaszek */
#checkout #checkout-payment-step #conditions-to-approve .custom-control-label::after{
  content: "" !important;
  position: absolute !important;
  left: 22px !important;
  top: 22px !important;
  width: 10px !important;
  height: 6px !important;
  border-left: 3px solid transparent !important;
  border-bottom: 3px solid transparent !important;
  transform: rotate(-45deg);
}

#checkout #checkout-payment-step #conditions-to-approve .custom-control-input:checked + .custom-control-label::after{
  border-left-color: #fff !important;
  border-bottom-color: #fff !important;
}

/* Link do regulaminu */
#checkout #checkout-payment-step #conditions-to-approve a{
  color: #1565c0;
  font-weight: 700;
  text-decoration: none;
}
#checkout #checkout-payment-step #conditions-to-approve a:hover{
  text-decoration: underline;
}

gggggg
/* Delikatnie grubszy tekst opisów */
.category-description p,
.product-description p,
.product-description li {
  font-weight: 700;
}

article.product-miniature .product-container{
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

article.product-miniature .product-description{
  margin-top: 10px !important;
  padding-top: 0 !important;
}

/* KARTA PRODUKTU: nie rozpychaj elementów na całą wysokość */
article.product-miniature .product-container{
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
}

/* ===============================
   MINIATURY – ODSUNIĘCIE STRZAŁEK
   =============================== */

/* górna strzałka */
.product-thumbs .slick-prev {
  top: -22px !important;        /* ODSUNIĘCIE W GÓRĘ */
}

/* dolna strzałka */
.product-thumbs .slick-next {
  bottom: -32px !important;     /* ODSUNIĘCIE W DÓŁ */
}

/* większy obszar klikalny (komfort) */
.product-thumbs .slick-prev,
.product-thumbs .slick-next {
  width: 38px !important;
  height: 38px !important;
  z-index: 15;
}


/* ===============================
/* ===============================
   STRZAŁKI GALERII – KLIKALNE
   =============================== */

.images-container .slick-prev,
.images-container .slick-next {
  position: absolute !important;      /* KLUCZ */
  z-index: 9999 !important;           /* KLUCZ */
  pointer-events: auto !important;    /* KLUCZ */

  width: 32px !important;
  height: 32px !important;
  background: rgba(25, 118, 210, 1) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* sama ikonka */
.images-container .slick-prev:before,
.images-container .slick-next:before {
  color: #fff !important;
  font-size: 28px !important;   /* dopasowane do 38px */
  opacity: 1 !important;
  line-height: 1 !important;
}

/* hover */
.images-container .slick-prev:hover,
.images-container .slick-next:hover {
  background: rgba(13, 71, 161, 1) !important;
}

ddddddd

/* VIDEO – koło robimy na a.video (pewne) */
.images-container .product-video {
  background: transparent !important; /* nic nie narzucamy na kontener */
}

/* a.video robi całą ikonę */
.images-container .product-video > a.video {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  /* KLUCZ: wymuszamy idealny kwadrat */
  width: 40px !important;
  height: 40px !important;

  border-radius: 50% !important;
  background: #000 !important;

  /* białe SVG (fill=currentColor) */
  color: #fff !important;

  box-shadow: 0 4px 12px rgba(0,0,0,0.25);
  text-decoration: none !important;
}

/* biały play */
.images-container .product-video > a.video svg,
.images-container .product-video > a.video svg * {
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* usuń ewentualne pseudo-ikony motywu */
.images-container .product-video::before,
.images-container .product-video::after,
.images-container .product-video > a.video::before,
.images-container .product-video > a.video::after {
  content: none !important;
}

/* ===============================
   IKONA 360° – OSOBNY STYL
   =============================== */

.images-container a.pro_360 {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #000 !important; /* czarne tło */
  box-shadow: 0 4px 12px rgba(0,0,0,0.35);
  display: flex !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #fff !important; /* kluczowe dla currentColor */
}

/* SVG 360 – fill + stroke */
.images-container a.pro_360 svg,
.images-container a.pro_360 svg * {
  fill: currentColor !important;
  stroke: currentColor !important;
  width: 34px !important;
  height: 34px !important;
}

/* hover */
.images-container a.pro_360:hover {
  background: #111 !important;
}


.images-container .product-extra-content {
  display: flex !important;
  flex-direction: row !important;
  gap: 10px;
}


/* === STABILNE MINIATURY (bez skakania) === */

/* ustaw wysokość listy na 5 miniaturek */
.images-container .product-thumbs.slick-vertical .slick-list {
  height: 600px !important; /* jak trzeba: 490-660, zależnie od motywu */
  overflow: hidden;
}

/* stała wysokość pojedynczej miniatury */
.images-container .product-thumbs.slick-vertical .slick-slide {
  height: 120px !important;   /* dostosuj pod wygląd */
  margin-bottom: 8px;
}

/* obrazek w miniaturze ma mieć stały rozmiar i nie zmieniać layoutu */
.images-container .product-thumbs.slick-vertical .slick-slide img {
  width: 100% !important;
  height: 120px !important;
  object-fit: cover;
  display: block;
}


/* KARTA DLA KAŻDEGO SPOSOBU DOSTAWY */
#checkout-delivery-step .delivery-option {
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  padding: 10px 16px;
  margin-bottom: 10px;
  background: #ffffff;
  display: flex;
  align-items: center;
  gap: 16px;
  transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}

/* podświetlenie po najechaniu */
#checkout-delivery-step .delivery-option:hover {
  border-color: #003767;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

/* zaznaczona metoda dostawy */
#checkout-delivery-step .delivery-option.selected {
  border-color: #ff2b2b;
  background: #fff7f7;
}

/* RADIO – trochę większe, bliżej logo */
#checkout-delivery-step .delivery-option input[type="radio"] {
  margin-right: 4px;
}

/* LOGO KURIERA */
#checkout-delivery-step .delivery-option img {
  max-width: 90px;
  height: auto;
  display: block;
}

/* kolumna tekstowa (nazwa + opis) */
#checkout-delivery-step .delivery-option .carrier-name,
#checkout-delivery-step .delivery-option .row > div:nth-child(2) {
  flex: 1 1 auto;
}

/* NAZWA METODY – pogrubiona */
#checkout-delivery-step .delivery-option .carrier-name,
#checkout-delivery-step .delivery-option .carrier-name span {
  font-size: 15px;
  font-weight: 600;
  color: #111111;
}

/* OPIS (np. Płatność przelewem) – mniejszy i jaśniejszy */
#checkout-delivery-step .delivery-option .carrier-delay,
#checkout-delivery-step .delivery-option .carrier-extra-content,
#checkout-delivery-step .delivery-option small {
  font-size: 12px;
  color: #777777;
}

/* CENA PO PRAWEJ – duża i wyraźna */
#checkout-delivery-step .delivery-option .carrier-price,
#checkout-delivery-step .delivery-option .delivery-option-price {
  margin-left: auto;
  font-size: 15px;
  font-weight: 700;
  color: #ff2b2b;
  white-space: nowrap;
}

/* PRZYCISK TYPU "Wybierz z mapy" – porządek i odstęp */
#checkout-delivery-step .delivery-option .btn,
#checkout-delivery-step .delivery-option button {
  margin-top: 6px;
  font-size: 12px;
  padding: 6px 10px;
}
}

sasasasassa
.sa-newsletter-form form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sa-newsletter-form input[type="email"] {
  padding: 12px;
  font-size: 15px;
  border-radius: 6px;
  border: 1px solid #ddd;
}

.sa-newsletter-submit {
  width: 100%;
  padding: 12px;
  font-size: 15px;
  border-radius: 6px;
  text-align: center;
  font-weight: 600;
}

.sa-newsletter-conditions {
  font-size: 11px;
  color: #777;
}


/* Formularz w popupie — ustawienie pionowe zamiast poziomego */
.tdnewsletter_form .form-group {
  display: flex;
  flex-direction: column !important; /* pionowo */
  align-items: stretch;
  gap: 10px;
}

/* Pole e-mail pełna szerokość */
.tdnewsletter_form .input-wrapper {
  width: 100% !important;
}

/* Przycisk SUBSCRIBE także pełna szerokość */
.tdnewsletter_form .btn-primary.tdnewsletter_send {
  width: 100% !important;
  text-align: center;
  padding: 12px;
  font-size: 15px;
  border-radius: 6px;
}

/* Żeby w środku ładnie wyglądało */
.tdnewsletter_form input.form-control {
  padding: 12px;
  font-size: 15px;
  border-radius: 6px;
}

/* Popup newslettera – ładniejszy layout */
.td-newsletter .d-flex {
  align-items: stretch;
}

/* Lewa kolumna – zdjęcie */
.td-newsletter .image-newsletter img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Prawa kolumna – pudełko z treścią */
.td-newsletter .box-newsletter {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 25px 30px;
  background: #ffffff;
}

.td-newsletter .innerbox-newsletter {
  width: 100%;
}

/* Tytuł */
.td-newsletter .newsletter-title {
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 10px;
  color: #e60023; /* możesz podmienić na swój czerwony */
}

/* Teksty */
.td-newsletter .newsletter-desc.text1 {
  font-size: 14px;
  color: #444;
  margin-bottom: 10px;
}

.td-newsletter .newsletter-desc.text2 {
  font-size: 13px;
  color: #666;
  margin-bottom: 15px;
}

/* Formularz */
.tdnewsletter_form .form-group {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
}

.tdnewsletter_form .input-wrapper {
  flex: 1 1 auto;
}

.tdnewsletter_form input.form-control.tdnl_email {
  width: 100%;
  padding: 10px 12px;
  border-radius: 4px;
  border: 1px solid #ddd;
  font-size: 14px;
}

.tdnewsletter_form .btn.btn-primary.tdnewsletter_send {
  flex: 0 0 auto;
  padding: 10px 18px;
  border-radius: 4px;
  background: #e60023;
  border: none;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
}

.tdnewsletter_form .btn.btn-primary.tdnewsletter_send:hover {
  opacity: 0.9;
}

/* Mała notka na dole popupa */
.td-newsletter-dont {
  display: block;
  margin-top: 10px;
  font-size: 11px;
  text-align: right;
}

/* Responsywność */
@media (max-width: 768px) {
  .td-newsletter {
    max-width: 90% !important;
    height: auto !important;
  }

  .td-newsletter .box-newsletter {
    padding: 20px;
  }

  .tdnewsletter_form .form-group {
    flex-direction: column;
  }

  .tdnewsletter_form .btn.btn-primary.tdnewsletter_send {
    width: 100%;
    text-align: center;
  }
}

d
/* Popup newslettera – poprawa wysokości i centrowanie */
.td-newsletter {
  height: auto !important;      /* zamiast sztywnej wysokości z inline */
  max-height: 90vh !important;  /* nigdy więcej niż 90% wysokości okna */
  overflow: hidden;             /* żeby nic nie wystawało */
}

/* Żeby zawartość ładnie wypełniała wysokość popupa */
.td-newsletter .d-flex {
  height: 100%;
}

/* Na małych ekranach niech popup się „składa” pionowo */
@media (max-width: 768px) {
  .td-newsletter {
    max-width: 95% !important;
  }
}

ssss
/* WYŚRODKOWANIE BLOKU Z LOGOWANIEM GOOGLE */
.glogin {
    text-align: center !important;
    width: 100%;
}

/* Zmiana tekstu przycisku */
.glogin .customGPlusSignIn .buttonText::after {
    content: "Zaloguj przez Google" !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.glogin .customGPlusSignIn .buttonText {
    font-size: 0 !important; /* ukrywa oryginalny tekst */
}



/* ==== ZMNIEJSZENIE ZDJĘĆ W LISTINGU PRODUKTÓW ==== */

/* każde zdjęcie produktu w listingach / kategoriach */
article.product-miniature .thumbnail-container img {
    max-width: 80% !important;     /* zmniejsz proporcjonalnie obrazek */
    max-height: 80% !important;  /* dodatkowe ograniczenie wysokości */
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
}
ssssssssss
/* Ogólny kontener podkategorii */
.subcategories-wrapper.row {
    justify-content: center;
    margin-top: 10px;
}

/* Pojedyncze pola podkategorii */
.subcategories-wrapper .col-6,
.subcategories-wrapper .col-sm-4,
.subcategories-wrapper .col-md-3,
.subcategories-wrapper .col-lg-3,
.subcategories-wrapper .col-xl-15 {
    padding: 5px 10px;
    text-align: center;
}

/* Tag podkategorii */
.subcategories-wrapper .subcategory-name {
    display: inline-block;
    padding: 6px 16px;
    border-radius: 999px;
    background: #f2f5ff;
    color: #232323;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
    transition: all 0.2s ease;
}

.subcategories-wrapper .subcategory-name:hover {
    background: #1e57d0;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}

.subcategories-wrapper .subcategory-name::before {
    margin-right: 4px;
}

/* MOBILE */
@media (max-width: 768px) {
    .subcategories-wrapper.row {
        justify-content: flex-start;
    }
    .subcategories-wrapper .col-6,
    .subcategories-wrapper .col-sm-4 {
        flex: 0 0 50%;
        max-width: 50%;
    }
    .subcategories-wrapper .subcategory-name {
        font-size: 14px;
        padding: 5px 10px;
        width: 100%;
    }
}
s
/* =========  BREADCRUMB – OGÓLNE  ========= */

/* Kontener na breadcrumb (nav) */
nav.breadcrumb,
nav.ps-breadcrumb {
    background: transparent;
    padding: 8px 0;
}

/* Lista okruszków wewnątrz nav */
nav.breadcrumb ol,
nav.ps-breadcrumb ol,
nav.breadcrumb .breadcrumb,
nav.ps-breadcrumb .breadcrumb {
    list-style: none;
    margin: 0;
    padding: 6px 14px;
    border-radius: 999px;                  /* pastylka */
    background: #f5f8ff;                   /* jasny niebieski */
    box-shadow: 0 2px 6px rgba(0,0,0,0.04);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2px;
}

/* Pojedyncze elementy breadcrumb */
nav.breadcrumb li,
nav.ps-breadcrumb li {
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    color: #666666;
}

/* Linki w breadcrumb */
nav.breadcrumb a,
nav.ps-breadcrumb a {
    color: #888888;
    text-decoration: none;
    transition: color 0.15s ease;
}

nav.breadcrumb a:hover,
nav.ps-breadcrumb a:hover {
    color: #1e57d0;                         /* Twój niebieski */
}

/* Separator między elementami (strzałka) */
nav.breadcrumb li + li::before,
nav.ps-breadcrumb li + li::before {
    content: "›";
    margin: 0 5px;
    color: #c3c7d5;
}

/* Ostatni element (aktualna strona) – pogrubiony */
nav.breadcrumb li:last-child,
nav.ps-breadcrumb li:last-child {
    color: #232323;
    font-weight: 600;
}

nav.breadcrumb li:last-child a,
nav.ps-breadcrumb li:last-child a {
    color: #232323;
    pointer-events: none;                   /* brak klikalności */
}

/* =========  HOME – IKONKA W KÓŁKU  ========= */

nav.breadcrumb li:first-child a,
nav.ps-breadcrumb li:first-child a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #1e57d0;
    color: #ffffff;
    font-size: 12px;
    margin-right: 4px;
}

/* Jeżeli przy Home jest ikonka <i> – wyrównanie */
nav.breadcrumb li:first-child i,
nav.ps-breadcrumb li:first-child i {
    font-size: 12px;
}

TOP
/* ====== OGÓLNE ====== */
header {
    font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    position: sticky;
    top: 0;
    z-index: 999;
    background: #ffffff;
}
/* ====== GÓRNY PASEK (DARMOWA DOSTAWA / TELEFON / AUTORYZOWANY SKLEP) ====== */
pasek
/* ===== GÓRNY NIEBIESKI PASEK – WERSJA PROSTA ===== */

/* =========================
   TOP BAR: 🎁 Darmowa dostawa / telefon / autoryzacja
   Sekcja: .elementor-5 .elementor-element.elementor-element-de7bd7d
   ========================= */

/* wysokość paska */
.elementor-5 .elementor-element.elementor-element-de7bd7d.elementor-section {
    padding: 4px 0 !important;     /* zmieniaj 3–7px jeśli chcesz wyżej/niżej */
}

/* ułożenie 3 kolumn w jednym rzędzie i wyrównanie w pionie */
.elementor-5 .elementor-element.elementor-element-de7bd7d
    > .elementor-container.elementor-column-gap-default {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;           /* środek w pionie */
    justify-content: space-between;
    gap: 16px;
}

/* wewnątrz każdej kolumny: tekst/ikona w jednej linii */
.elementor-5 .elementor-element.elementor-element-de7bd7d
    .elementor-column .elementor-widget-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* lewa kolumna do lewej, prawa do prawej */
.elementor-5 .elementor-element.elementor-element-de7bd7d
    .elementor-column:first-child .elementor-widget-wrap {
    justify-content: flex-start;
}
.elementor-5 .elementor-element.elementor-element-de7bd7d
    .elementor-column:last-child .elementor-widget-wrap {
    justify-content: flex-end;
}

/* sam tekst – bez dziwnych marginesów, lekko „zbity” */
.elementor-5 .elementor-element.elementor-element-de7bd7d p {
    margin: 0;
    line-height: 1.3;
}

/* ładny odstęp między emoji/ikonką a tekstem (jeśli używasz) */
.elementor-5 .elementor-element.elementor-element-de7bd7d p span,
.elementor-5 .elementor-element.elementor-element-de7bd7d p i,
.elementor-5 .elementor-element.elementor-element-de7bd7d p svg {
    margin-right: 6px;
}

/* =========================
   WERSJA MOBILNA
   ========================= */
@media (max-width: 768px) {
    .elementor-5 .elementor-element.elementor-element-de7bd7d
        > .elementor-container.elementor-column-gap-default {
        flex-direction: column;
        text-align: center;
        gap: 2px;
    }

    .elementor-5 .elementor-element.elementor-element-de7bd7d
        .elementor-column .elementor-widget-wrap {
        justify-content: center !important;
    }
}
/* =========================
   GŁÓWNY HEADER: LOGO + WYSZUKIWARKA + IKONY
   (druga sekcja w #elementor-header)
   ========================= */

/* cała sekcja */
#elementor-header .elementor-section-wrap > section:nth-of-type(2) {
    padding: 14px 0 18px !important;   /* góra / dół headera */
    border-bottom: 1px solid rgba(0,0,0,0.03); /* delikatna linia pod spodem */
}

/* kontener z 3 kolumnami */
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    > .elementor-container.elementor-column-gap-default {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;            /* wszystko równo w pionie */
    justify-content: space-between;
    column-gap: 32px;
}

/* ---------- LEWA KOLUMNA – LOGO ---------- */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:first-child .elementor-widget-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:first-child img {
    max-height: 120px;               /* regulujesz wielkość logo */
    height: auto;
    width: auto;
}

/* ---------- ŚRODKOWA KOLUMNA – WYSZUKIWARKA ---------- */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) .elementor-widget-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) input[type="search"],
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) input[type="text"] {
    height: 52px;                    /* wysokość pola */
    font-size: 15px;
    border-radius: 999px;            /* ładna „pigułka” */
    border-width: 1px;
    padding-left: 22px;
}

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) input[type="search"]:focus,
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) input[type="text"]:focus {
    box-shadow: 0 0 0 3px rgba(88,127,245,0.18);
    border-color: #587ff5;
    outline: none;
}

/* ---------- PRAWA KOLUMNA – MOJE KONTO / KOSZYK / SERDUSZKO ---------- */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:last-child .elementor-widget-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;                       /* odstęp między ikonami */
}

/* tekst „Moje konto” itp. */
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:last-child p {
    margin: 0;
    line-height: 1.2;
    font-size: 14px;
}

/* ikonki – żeby były równo w pionie z tekstem */
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:last-child svg,
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:last-child i {
    vertical-align: middle;
}
/* ===== MOBILE: logo + ikony w jednym rzędzie ===== */
@media (max-width: 768px) {

  /* kontener drugiej sekcji (logo + search + ikony) */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      > .elementor-container.elementor-column-gap-default {
      display: flex;
      flex-wrap: nowrap;              /* NIE zawija w kolejne linie */
      align-items: center;
      justify-content: space-between;
  }

  /* lewa kolumna (logo) i prawa (ikony) obok siebie */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:first-child,
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:last-child {
      flex: 0 0 auto;
      width: auto;
  }

  /* środkowa kolumna (wyszukiwarka) – na wszelki wypadek chowamy */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:nth-child(2) {
      display: none !important;
  }

  /* IKONY: w jednym rzędzie, z odstępem */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:last-child .elementor-widget-wrap {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-end;
      gap: 16px;                       /* odstęp między „Moje konto”, koszykiem, sercem */
  }

  /* żeby tekst „Moje konto” był blisko ikonki */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:last-child p {
      margin: 0;
      line-height: 1.2;
      font-size: 14px;
  }
}
/* ===== MOBILE: logo po lewej, ikony w jednym rzędzie po prawej ===== */
@media (max-width: 768px) {

  /* kontener sekcji z logo + search + ikonami (druga sekcja w headerze) */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      > .elementor-container.elementor-column-gap-default {
      display: flex;
      flex-wrap: nowrap;              /* NIE zawijamy w dół */
      align-items: center;
      justify-content: flex-start;
      column-gap: 10px;
  }

  /* wszystkie kolumny w tym rzędzie – niech będą „auto”, a nie 100% */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column {
      flex: 0 0 auto;
      width: auto !important;
      max-width: none !important;
  }

  /* ŚRODKOWA KOLUMNA (wyszukiwarka) – chowamy na mobile */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:nth-child(2) {
      display: none !important;
  }

  /* KOLUMNA Z „MOJE KONTO” – od niej zaczyna się prawa strona, więc odsuwamy ją w prawo */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:nth-child(3) {
      margin-left: auto;              /* logo po lewej, a konto+koszyk+serce jako grupa po prawej */
  }

  /* Wewnątrz każdej z kolumn (konto, koszyk, serce) – w jednym rzędzie */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column .elementor-widget-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
  }

  /* Ikony mogą być od siebie trochę odsunięte */
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:nth-child(3) .elementor-widget-wrap,
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:nth-child(4) .elementor-widget-wrap,
  #elementor-header .elementor-section-wrap > section:nth-of-type(2)
      .elementor-column:nth-child(5) .elementor-widget-wrap {
      margin-left: 10px;
  }
}
#elementor-header .elementor-section-wrap > section:nth-of-type(2) {
    padding: 4px 0 8px !important;
}
bbbbbbbbbbbb
/* ========== 1. OGÓLNY LOOK & FEEL HEADERA ========== */

#header {
    font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* delikatny cień pod całym headerem – efekt premium */
#elementor-header {
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    z-index: 50;
    position: relative;
}

/* ========== 2. TOP BAR – tylko drobny szlif ========== */
/* (Twoja sekcja z darmową dostawą / tel / autoryzacją – już jest OK, tylko minimalnie "zbita") */

.elementor-5 .elementor-element.elementor-element-de7bd7d.elementor-section {
    padding: 4px 0 !important;          /* niski, elegancki pasek */
}

/* ========== 3. GŁÓWNY HEADER (DESKTOP) ========== */
/* druga sekcja w headerze: logo + search + ikony */

#elementor-header .elementor-section-wrap > section:nth-of-type(2) {
    padding: 8px 0 10px !important;     /* mniej pustego miejsca, bardziej butikowo */
}

/* kontener 3 kolumn */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    > .elementor-container.elementor-column-gap-default {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: 32px;
}

/* logo */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:first-child img {
    max-height: 100px;                   /* jak chcesz większe: 82–86 */
    height: auto;
    width: auto;
}

/* wyszukiwarka (desktop) */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) .elementor-widget-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) input[type="search"],
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) input[type="text"] {
    height: 50px;
    max-width: 650px;                   /* nie dominuje nad logo */
    font-size: 15px;
    border-radius: 999px;
    padding-left: 22px;
}

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) input[type="search"]:focus,
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:nth-child(2) input[type="text"]:focus {
    border-color: #587ff5;
    box-shadow: 0 0 0 3px rgba(88,127,245,0.18);
    outline: none;
}

/* prawa kolumna – cały blok ikon */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:last-child .elementor-widget-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 28px;                          /* równy oddech między "Moje konto", koszykiem, sercem */
}

/* tekst przy ikonach */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:last-child p {
    margin: 0;
    line-height: 1.2;
    font-size: 14px;
}

/* ujednolicenie wielkości ikon */

#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:last-child svg,
#elementor-header .elementor-section-wrap > section:nth-of-type(2)
    .elementor-column:last-child i {
    width: 28px;
    height: 28px;
    vertical-align: middle;
}

/* ========== 4. MOBILE: LOGO + IKONY W JEDNYM RZĘDZIE, BEZ SEARCHA ========== */

@media (max-width: 768px) {

    /* kontener sekcji – logo + ikony w jednym rzędzie */

    #elementor-header .elementor-section-wrap > section:nth-of-type(2)
        > .elementor-container.elementor-column-gap-default {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-start;
        column-gap: 8px;
    }

    /* wszystkie kolumny w tym rzędzie jako auto */

    #elementor-header .elementor-section-wrap > section:nth-of-type(2)
        .elementor-column {
        flex: 0 0 auto;
        width: auto !important;
        max-width: none !important;
    }

    /* ŚRODKOWA KOLUMNA – wyszukiwarka schowana na pewno */

    #elementor-header .elementor-section-wrap > section:nth-of-type(2)
        .elementor-column:nth-child(2) {
        display: none !important;
    }

    /* kolumna z "Moje konto" odsunięta w prawo – tworzy grupę ikon */

    #elementor-header .elementor-section-wrap > section:nth-of-type(2)
        .elementor-column:nth-child(3) {
        margin-left: auto;
    }

    /* w środku kolumny z ikonami – wszystko obok siebie */

    #elementor-header .elementor-section-wrap > section:nth-of-type(2)
        .elementor-column:last-child .elementor-widget-wrap {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        gap: 12px;
    }

    #elementor-header .elementor-section-wrap > section:nth-of-type(2)
        .elementor-column:last-child p {
        font-size: 13px;
    }

    /* logo minimalnie mniejsze na mobile */

    #elementor-header .elementor-section-wrap > section:nth-of-type(2)
        .elementor-column:first-child img {
        max-height: 64px;
    }
}
bbbbbbbbbbbbbbcccccccc
/* ===== RESET ===== */
.elementor-categorylist .categorylist ul {
    list-style: none;
    margin: 8px 0 0;
    padding: 0;
}

.elementor-categorylist .categorylist li {
    margin-bottom: 8px;
}

.elementor-categorylist .categorylist li::before,
.elementor-categorylist .categorylist li a::before {
    content: none !important;
}


/* ===== NOWY STYL – bardzo czytelne prostokątne tagi ===== */

.elementor-categorylist .categorylist li a {
    display: flex;
    align-items: center;
    gap: 8px;                     /* odstęp między emoji a tekstem */
    
    background: #f7f8fa;          /* jasne tło → super czytelność */
    border: 1px solid #d7dbe3;    /* delikatna ramka */
    border-radius: 12px;          /* lekko zaokrąglone */
    
    padding: 10px 14px;
    width: 100%;

    font-size: 15px;
    font-weight: 600;
    color: #1e1e1e;
    text-decoration: none;

    transition: background 0.15s ease, border-color 0.15s ease;
}

/* hover – wyraźny, ale elegancki */
.elementor-categorylist .categorylist li a:hover {
    background: #e9edff;
    border-color: #7488ff;
}


/* emoji – lekko większe dla lepszej widoczności */
.elementor-categorylist .categorylist li a span,
.elementor-categorylist .categorylist li a i,
.elementor-categorylist .categorylist li a svg {
    font-size: 18px;
}
ffffffff
/* ===========================
   BLOK KATEGORII – KARTA PREMIUM
   =========================== */

/* Cały box po lewej – LEKKO premium, bez zmiany układu kolumny */
#left-column .block-categories {
    background: #ffffff;
    border-radius: 16px;
    padding: 16px 18px 12px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

/* Tytuł "Strona główna" */
#left-column .block-categories .title_block {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 10px 0;
    color: #111111;
}

/* link "Strona główna" w wersji mobilnej (jeśli jest jako <a>) */
#left-column .block-categories > a.h4 {
    display: none; /* na desktopie zwykle zbędne */
}

/* ===========================
   LISTA GŁÓWNYCH KATEGORII
   =========================== */

#category-top-menu.category-top-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* jeden wiersz głównej kategorii */
#category-top-menu > li {
    position: relative;
    display: flex;               /* tekst + strzałka w jednym rzędzie */
    align-items: center;
    padding: 8px 4px;
    border-bottom: 1px solid #edf0f5;
}

/* ostatni bez linii */
#category-top-menu > li:last-child {
    border-bottom: none;
}

/* link głównej kategorii */
#category-top-menu > li > a {
    flex: 1;
    font-size: 15px;
    font-weight: 500;
    color: #222222;
    text-decoration: none;
}

/* hover – delikatne tło + kolor brand */
#category-top-menu > li:hover {
    background: #f7f9ff;
    border-radius: 10px;
}

#category-top-menu > li:hover > a {
    color: #275df5;
}

/* wyraźna strzałka rozwijania (ikonka la-angle-down) */
#category-top-menu > li > i.icon-collapse {
    margin-left: 8px;
    font-size: 18px;
    color: #8a90a5;
    cursor: pointer;
}

/* przy otwartej kategorii (Bootstrap dodaje .show na .collapse)
   – jeśli chcesz, możesz dodać obrót strzałki */
#category-top-menu > li > i.icon-collapse[aria-expanded="true"],
#category-top-menu > li > i.icon-collapse.open {
    transform: rotate(180deg);
    color: #275df5;
    transition: transform 0.2s ease, color 0.2s ease;
}

/* ===========================
   PODKATEGORIE (SUBMENU)
   =========================== */

#category-top-menu .category-sub-menu {
    list-style: none;
    margin: 6px 0 4px;
    padding-left: 14px;               /* wcięcie */
    border-left: 2px solid #e5e8f1;   /* pionowa linia prowadząca */
}

/* pojedyncza podkategoria */
#category-top-menu .category-sub-menu li {
    padding: 3px 0;
    border: none;
}

/* link podkategorii */
#category-top-menu .category-sub-menu a {
    font-size: 14px;
    font-weight: 400;
    color: #444444;
    text-decoration: none;
}

/* hover podkategorii */
#category-top-menu .category-sub-menu a:hover {
    color: #275df5;
    text-decoration: underline;
}

/* usuń ewentualne pseudo-kropki z motywu */
#category-top-menu .category-sub-menu li::before {
    content: none !important;
}

/* ===========================
   RESPONSYWNOŚĆ – NA WSZELKI
   =========================== */

@media (max-width: 991px) {
    #left-column .block-categories {
        border-radius: 12px;
        box-shadow: 0 3px 10px rgba(15, 23, 42, 0.05);
        padding: 12px 14px 8px;
    }

    #category-top-menu > li {
        padding: 7px 2px;
    }

    #category-top-menu > li > a {
        font-size: 14.5px;
    }
}
/* SZERSZA STRONA KATEGORII – KONTENER NA CAŁĄ SZEROKOŚĆ */
body#category .container {
    max-width: 100% !important;  /* zamiast np. 1200px */
    padding-left: 20px;
    padding-right: 20px;
}
/* ===== mniejsze główne zdjęcie produktu – tylko desktop ===== */----------------------------------------------
/* Mniejsze główne zdjęcie produktu – tylko na desktopie, bez zmiany układu */
@media (min-width: 992px) {
  body#product .product-cover img,
  body#product .js-qv-product-cover {
      max-height: 780px;   /* tu regulujesz wielkość */
      width: auto;
      height: auto;
      display: block;
      margin: 0 auto;
      object-fit: contain;
  }
}

--
/* SZERSZY OPIS, WĘŻSZE ZDJĘCIA – TYLKO DESKTOP */
@media (min-width: 1200px) {

  /* LEWA KOLUMNA – ZDJĘCIA */
  body#product .product-container .product-images {
      flex: 0 0 50% !important;     /* zdjęcia 40% szerokości */
      max-width: 50% !important;
  }

  /* PRAWA KOLUMNA – OPIS */
  body#product .product-container .product-infos {
      flex: 0 0 50% !important;     /* opis 60% szerokości */
      max-width: 50% !important;
  }
}
/* SZERSZY OPIS, WĘŻSZE ZDJĘCIA – TYLKO STRONA PRODUKTU, DESKTOP */
@media (min-width: 992px) {

  /* LEWA KOLUMNA – ZDJĘCIA */
  body#product div.row.product-container.js-product-container > div.product-images {
      flex: 0 0 50% !important;
      max-width: 50% !important;
  }

  /* PRAWA KOLUMNA – OPIS */
  body#product div.row.product-container.js-product-container > div.product-infos {
      flex: 0 0 50% !important;
      max-width: 50% !important;
  }
}
body#product .product-reference,
body#product .product-reference span,
body#product .product-reference .label {
    display: none !important;
}
/* Ukrycie informacji o ilości w magazynie (np. "4 Przedmioty") */
body#product .product-quantities,
body#product .product-quantities * ,
body#product .product-quantity,
body#product .product-quantity * ,
body#product .product-availability span,
body#product [itemprop="inventoryLevel"] {
    display: none !important;
}
pppppppppppppppppppppppppppppppp

/* GLOBALNE ZAOKRĄGLENIE WSZYSTKICH PRZYCISKÓW */
button,
.btn,
.btn-primary,
.btn-secondary,
input[type="submit"],
input[type="button"],
input[type="reset"],
a.btn,
a.button,
.ps-shoppingcart a.button,
.product-add-to-cart button,
.quick-view a,
#wishlist_button,
.add-to-cart,
.button-container .btn,
.elementor-button,
.elementor-button-link,
button.btn-primary,
a.quick-view,
.products .button-container button,
.products .button-container a {
    border-radius: 12px !important; /* ← Zmień na 20px, 50px lub 999px jeśli chcesz „pigułki” */
}

/* Dodatkowe zaokrąglenie dla mini-przycisków */
.button-container .btn,
.button-container button,
.button-container a {
    border-radius: 12px !important;
}
ssssssssssssss
/* === POPRAWA CZYTELNOŚCI: odstępy, kontrast, rytm tekstu === */

/* Podstawowy opis */
#product .product-description .rte-content {
    max-width: 720px;
    margin: 0 auto;
    font-size: 14px !important;
    line-height: 1.7 !important;
    color: #000000;
}

/* Akapity + listy */
#product .product-description .rte-content p,
#product .product-description .rte-content li {
    font-size: 15px !important;
    line-height: 1.7 !important;
    margin-bottom: 0.9em; /* większy oddech między liniami */
}

/* Nagłówki desktop */
#product .product-description .rte-content h1,
#product .product-description .rte-content h2 {
    font-size: 22px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    margin: 1.2em 0 0.5em;
}

#product .product-description .rte-content h3 {
    font-size: 17px !important;
    font-weight: 600 !important;
    margin: 1em 0 0.5em;
}

/* Wyróżnienia */
#product .product-description .rte-content strong {
    color: #111;
    font-weight: 600;
}

/* ============================================= */
/* === MOBILE: zmniejszamy nagłówki i robimy lżejsze === */
/* ============================================= */

@media (max-width: 768px) {
    /* Główny tekst */
    #product .product-description .rte-content {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
        padding: 0 12px;
    }

    /* Akapity i listy */
    #product .product-description .rte-content p,
    #product .product-description .rte-content li {
        font-size: 13.5px !important;
        margin-bottom: 0.8em;
    }

    /* Nagłówki — dużo mniejsze, bardziej kompaktowe */
    #product .product-description .rte-content h1,
    #product .product-description .rte-content h2 {
        font-size: 18px !important;  /* było 22px → teraz idealne mobile */
        margin: 1em 0 0.4em;
    }

    #product .product-description .rte-content h3 {
        font-size: 15px !important;  /* było 17px */
        margin: 0.8em 0 0.35em;
    }
}


}
ssssssssssssssssssssssssss
/* === MOCNY STYL ZAKŁADEK PRODUKTU === */

.tabs.product-tabs.tab-tabs .nav-tabs {
    border-bottom: 2px solid #eeeeee !important;
    justify-content: center !important;
}

/* Wszystkie zakładki (nieaktywne) */
.tabs.product-tabs.tab-tabs .nav-tabs .nav-link {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #999999 !important;            /* szare, ale wyraźne */
    padding: 12px 25px !important;
    border: none !important;
    background: transparent !important;
    transition: all .25s ease !important;
}

/* Hover */
.tabs.product-tabs.tab-tabs .nav-tabs .nav-link:hover {
    color: #000000 !important;
}

/* Aktywna zakładka */
.tabs.product-tabs.tab-tabs .nav-tabs .nav-link.active,
.tabs.product-tabs.tab-tabs .nav-tabs .nav-link.js-product-nav-active {
    color: #000000 !important;
    font-weight: 600 !important;
    border-bottom: 3px solid #000000 !important; /* gruba linia pod aktywną */
}

/* Odstęp między zakładkami */
.tabs.product-tabs.tab-tabs .nav-tabs .nav-item {
    margin: 0 12px !important;
}
/* ============================================================
   ELEGANCKA TYPOGRAFIA OPISU PRODUKTU (DŁUGI + KRÓTKI)
   ============================================================ */


/* ------------------------------------------
   1) DŁUGI OPIS – główna sekcja (rte-content)
------------------------------------------- */

#product .product-description .rte-content {
    max-width: 740px;
    margin: 0 auto;
    font-size: 16px !important;
    line-height: 1.6 !important;
    letter-spacing: 0.3px !important;
    color: #000;
}

/* Akapity i listy */
#product .product-description .rte-content p,
#product .product-description .rte-content li {
    font-size: 16px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important; /* lekki, elegancki tekst */
    margin-bottom: 8px !important;
    letter-spacing: 0.3px !important;
}

/* Listy wypunktowane */
#product .product-description .rte-content ul {
    padding-left: 1.4em;
    margin-bottom: 1em;
}
#product .product-description .rte-content ul li {
    list-style: disc;
}

/* --- Nagłówki długiego opisu --- */
#product .product-description .rte-content h1 {  
font-size: 22px !important;
    line-height: 1.6 !important;
    font-weight: 500 !important;
    margin: 1.3em 0 0.5em !important;
    letter-spacing: 0.3px !important;
}
#product .product-description .rte-content h2 {
    font-size: 19px !important;
    line-height: 1.6 !important;
    font-weight: 500 !important;
    margin: 1.3em 0 0.5em !important;
    letter-spacing: 0.3px !important;
}

#product .product-description .rte-content h3 {
    font-size: 16.5px !important;
    line-height: 1.6 !important;
    font-weight: 500 !important;
    margin: 1em 0 0.5em !important;
    letter-spacing: 0.25px !important;
}


/* ------------------------------------------
   2) KRÓTKI OPIS (obok zdjęcia produktu)
------------------------------------------- */

/* === KRÓTKI OPIS – CZYTELNY, PRZEJRZYSTY === */

#product [id^="product-description-short"] {
    font-size: 16px !important;
    line-height: 1.45 !important;     /* DUŻO lepsza czytelność */
    letter-spacing: 0.2px !important;
    color: #000;
}

/* Akapity */
#product [id^="product-description-short"] p {
    font-size: 16px !important;
    line-height: 1.6 !important;     /* odstępy między zdaniami */
    font-weight: 400 !important;
    margin-bottom: 9px !important;  /* większy odstęp między akapitami */
    letter-spacing: 0.2px !important;
}

/* Listy */
#product [id^="product-description-short"] ul {
    padding-left: 1.4em;
}
#product [id^="product-description-short"] ul li {
    font-size: 16px !important;
    line-height: 1.45 !important;     /* odstępy między liniami w li */
    font-weight: 400 !important;      /* cieńszy, ładniejszy */
    letter-spacing: 0.2px !important;
    margin-bottom: 0.6em !important;
}

/* Nagłówki */
#product [id^="product-description-short"] h1,
#product [id^="product-description-short"] h2 {
    font-size: 18.5px !important;
    font-weight: 600 !important;
    line-height: 1.60 !important;
    margin: 0.8em 0 0.4em !important;
    letter-spacing: 0.2px !important;
}

#product [id^="product-description-short"] h3 {
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.60 !important;
    margin: 0.7em 0 0.4em !important;
    letter-spacing: 0.2px !important;
}

/* ------------------------------------------
   3) MOBILE – telefon, dopracowana czytelność
------------------------------------------- */

@media (max-width: 768px) {

    /* Długi opis */
    #product .product-description .rte-content {
        font-size: 14px !important;
        line-height: 1.4 !important;
        padding: 0 12px;
    }

    #product .product-description .rte-content p,
    #product .product-description .rte-content li {
        font-size: 14px !important;
        line-height: 1.4 !important;
        margin-bottom: 0.8em !important;
    }

    #product .product-description .rte-content h1,
    #product .product-description .rte-content h2 {
        font-size: 17px !important;
        margin: 1em 0 0.4em !important;
    }

    #product .product-description .rte-content h3 {
        font-size: 15px !important;
        margin: 0.9em 0 0.4em !important;
    }

    /* Krótki opis */
    #product [id^="product-description-short"] p {
        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    #product [id^="product-description-short"] h1,
    #product [id^="product-description-short"] h2 {
        font-size: 17px !important;
    }

    #product [id^="product-description-short"] h3 {
        font-size: 15px !important;
    }
}
ddddddddddddddddddddd
/* Licznik produktów w koszyku w dolnym menu (tylko mobile) */
@media (max-width: 767px) {

    #mobile-bottom-nav .elementor-icon-box-icon {
        position: relative; /* żeby badge miał punkt odniesienia */
    }

    #mobile-bottom-nav .cart-count-badge {
        position: absolute;
        top: -4px;
        right: -10px;
        background: #ff3b30;
        color: #fff;
        font-size: 11px;
        font-weight: 600;
        border-radius: 999px;
        padding: 2px 6px;
        min-width: 18px;
        text-align: center;
        line-height: 14px;
        box-shadow: 0 0 0 2px #ffffff; /* delikatna obwódka jak w aplikacjach */
        display: none; /* domyślnie ukryte gdy 0 */
    }
}
ggggggg
/* Kolor akcentowy marki – główny niebieski SuperAutka.pl */
:root {
  --primary-color: #007bff;  /* Uwaga: zastąp wartością koloru firmowego, jeśli jest inna */
}

/* Kontener sekcji podsumowania zamówienia */
.cart-summary {
  background-color: #fff;            /* białe tło dla przejrzystości */
  color: #000;                      /* czarny (lub ciemnoszary) tekst dla czytelności */
  border: 1px solid #e0e0e0;        /* subtelna ramka odcinająca sekcję od tła */
  border-radius: 4px;              /* niewielkie zaokrąglenie narożników dla nowoczesnego wyglądu */
  padding: 1rem;                   /* wewnętrzne odstępy zapewniające "oddech" wokół treści */
  margin-bottom: 1.5rem;           /* odstęp od następnych sekcji/elementów strony */
  font-size: 0.95rem;             /* bazowy rozmiar fontu w sekcji (dla mobile), zapewniający czytelność */
}

/* Lista produktów w podsumowaniu (jeśli występuje tabela z pozycjami) */
.cart-summary table {
  width: 100%;
  border-collapse: collapse;
}
.cart-summary th, 
.cart-summary td {
  padding: 0.5rem 0;
  text-align: left;
}
.cart-summary th {
  font-weight: 500;              /* nagłówki kolumn lekko pogrubione (medium) */
}
.cart-summary td {
  font-weight: 400;              /* zwykła waga tekstu dla danych produktów */
}
.cart-summary tbody tr:not(:last-child) {
  border-bottom: 1px solid #eee; /* delikatna linia oddzielająca produkty od siebie */
}

/* Podsumowanie kosztów (subtotal i total) */
.cart-summary .cart-summary-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0;              /* pionowe odstępy między wierszami podsumowania */
}
.cart-summary .cart-summary-line .label {
  font-weight: 500;              /* etykiety kosztów: nieco pogrubione (średnia waga) dla wyróżnienia */
}
.cart-summary .cart-summary-line .value {
  font-weight: 500;              /* wartości kwot: taka sama umiarkowana grubość jak etykiety */
}

/* Linia z sumą produktów, wysyłki itd. (subtotal) */
.cart-summary .cart-subtotals .cart-summary-line {
  border-bottom: 1px solid #eaeaea; /* cienka linia oddzielająca kolejne pozycje kosztów */
}

/* Linia z sumą całkowitą (Razem brutto) */
.cart-summary .cart-total, 
.cart-summary .cart-summary-line#cart-subtotal-total {  /* #cart-subtotal-total może być użyte w HTML dla całkowitej sumy */
  font-weight: 600;               /* wyróżnienie całkowitej sumy nieco mocniejszą czcionką */
  font-size: 1.05rem;            /* minimalnie większy tekst, aby przykuć uwagę do "Razem" */
  padding: 0.75rem 0 0.5rem;     /* dodatkowy odstęp powyżej sumy całkowitej */
  border-top: 1px solid #ccc;     /* linia oddzielająca sekcję sumy całkowitej od reszty */
}
.cart-summary .cart-total .label, 
.cart-summary .cart-summary-line#cart-subtotal-total .label {
  font-weight: 600;               /* etykieta "Razem (brutto)" w półboldzie (nie za grubo) */
}
.cart-summary .cart-total .value, 
.cart-summary .cart-summary-line#cart-subtotal-total .value {
  font-weight: 600;               /* kwota całkowita również w półboldzie dla czytelności */
}

/* Styl przycisku/linku "Wyświetl koszyk" */
.cart-summary .btn-view-cart, 
.cart-summary .btn.btn-secondary {
  display: inline-block;
  padding: 0.5rem 1rem;
  margin-top: 1rem;                     /* odstęp od góry (od reszty podsumowania) */
  border: 2px solid var(--primary-color); /* niebieska obwódka akcentująca */
  border-radius: 4px;
  background-color: transparent;       /* brak tła, przycisk "pusty" (outline) */
  color: var(--primary-color);
  text-decoration: none;
  font-weight: 500;                    /* średnia grubość tekstu, spójna z resztą sekcji */
  text-align: center;
  cursor: pointer;
}
.cart-summary .btn-view-cart:hover, 
.cart-summary .btn.btn-secondary:hover {
  background-color: var(--primary-color); /* po najechaniu – wypełnienie niebieskie */
  color: #fff;                            /* tekst biały na hover dla kontrastu */
}

/* Reakcja responsywna – style dla większych ekranów (desktop) */
@media (min-width: 768px) {
  .cart-summary {
    font-size: 1rem;              /* nieco większy bazowy rozmiar tekstu na desktopie */
    padding: 1.5rem;              /* zwiększone odstępy wewnętrzne, sekcja wygląda jak "karta" */
    max-width: 400px;             /* opcjonalnie: maksymalna szerokość panelu podsumowania, by nie rozciągał się zbytnio */
  }
  .cart-summary .cart-summary-line {
    padding: 0.75rem 0;           /* większe odstępy między wierszami na desktopie */
  }
  .cart-summary .btn-view-cart, 
  .cart-summary .btn.btn-secondary {
    margin-top: 0.5rem;
    /* Przy większym ekranie przycisk może być wyrównany do prawej lub lewej 
       w zależności od układu – można dopasować poprzez dodanie np. float albo text-align 
       w rodzicu, w razie potrzeby */
  }
}
/* === LŻEJSZE POGRUBIENIE ETYKIET W KRÓTKIM OPISIE === */
#product [id^="product-description-short"] strong {
    font-weight: 600 !important;
}
#easypack-map,
.easypack-map,
.inpost-map,
[id*="easypack"],
[class*="easypack"] {
  width: 100% !important;
  min-height: 260px !important;
}
sss
/* =========================
   FIX INPOST / PUNKT ODBIORU – PS8
   ========================= */

/* kontener opcji dostawy */
#checkout-delivery-step .delivery-options .row {
  display: block !important;
}

/* każda metoda jako pełny blok */
#checkout-delivery-step .row.delivery-option,
#checkout-delivery-step .delivery-option {
  display: block !important;
  width: 100% !important;
}

/* blok dodatkowy pod metodą dostawy */
#checkout-delivery-step .carrier-extra-content,
#checkout-delivery-step .js-carrier-extra-content {
  float: none !important;
  clear: both !important;
  width: 100% !important;
  margin-top: 10px !important;
}

/* domyślnie ukryj dodatkowe bloki punktów odbioru */
#checkout-delivery-step .carrier-extra-content,
#checkout-delivery-step .js-carrier-extra-content,
#checkout-delivery-step .inpost-shipping-container {
  display: none !important;
}

/* pokaż dodatkowy blok tylko przy zaznaczonej metodzie */
#checkout-delivery-step .delivery-option.selected + .carrier-extra-content,
#checkout-delivery-step .delivery-option.selected + .js-carrier-extra-content,
#checkout-delivery-step .row.delivery-option:has(input[type="radio"]:checked) + .carrier-extra-content,
#checkout-delivery-step .row.delivery-option:has(input[type="radio"]:checked) + .js-carrier-extra-content {
  display: block !important;
}

/* jeśli moduł wrzuca InPost do środka dodatkowego kontenera */
#checkout-delivery-step .carrier-extra-content .inpost-shipping-container,
#checkout-delivery-step .js-carrier-extra-content .inpost-shipping-container {
  display: block !important;
  width: 100% !important;
  margin-top: 0 !important;
  background: #f3f5f7 !important;
  border: 2px solid #e0e6ed !important;
  border-radius: 12px !important;
  padding: 16px !important;
  font-size: 14px !important;
}

/* fallback: jeśli inpost siedzi bezpośrednio w zaznaczonej metodzie */
#checkout-delivery-step .row.delivery-option:has(input[type="radio"]:checked) .inpost-shipping-container,
#checkout-delivery-step .delivery-option.selected .inpost-shipping-container {
  display: block !important;
  width: 100% !important;
  margin-top: 10px !important;
  background: #f3f5f7 !important;
  border: 2px solid #e0e6ed !important;
  border-radius: 12px !important;
  padding: 16px !important;
  font-size: 14px !important;
}

/* reset bootstrapowych kolumn w module InPost */
#checkout-delivery-step .inpost-shipping-container .row,
#checkout-delivery-step .inpost-shipping-container .col-12,
#checkout-delivery-step .inpost-shipping-container .col-sm-12,
#checkout-delivery-step .inpost-shipping-container .col-md-12,
#checkout-delivery-step .inpost-shipping-container [class*="col-"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  float: none !important;
}

/* przycisk InPost */
#checkout-delivery-step .inpost-shipping-container .btn,
#checkout-delivery-step .btn.inpost-shipping-button {
  display: inline-block !important;
  background: #ffc800 !important;
  border: none !important;
  color: #000 !important;
  font-weight: 600 !important;
  padding: 10px 14px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

/* odstępy w środku */
#checkout-delivery-step .inpost-shipping-container > * {
  margin-bottom: 8px;
}

/* najważniejszy fix układu */
#checkout-delivery-step .delivery-options-list .row.delivery-option {
  flex-direction: column !important;
}