/* =====================================================================
   e-outlet - design v2 (McProdukt 2026-07-15)
   Kolorowo, nowoczesnie, zaokraglenia. Zielen marki + grafit + krem.
   ===================================================================== */
:root{
  --eo-green:#5cb82e;
  --eo-green-d:#489c22;
  --eo-green-xd:#38791b;
  --eo-green-l:#eaf7e1;
  --eo-lime:#8fd35f;
  --eo-dark:#241a17;
  --eo-dark-2:#332721;
  --eo-cream:#faf8f3;
  --eo-ink:#2b241e;
  --eo-blue:#3d4a55;
  --eo-orange:#f5a623;
  --eo-radius:16px;
}

/* KOLOROWE TLO - miekki gradient + bloby w roznych kolorach (fixed) */
body{
  color:var(--eo-ink);
  background:
    radial-gradient(620px 420px at 6% 4%,  rgba(92,184,46,.16),  transparent 62%),
    radial-gradient(700px 460px at 97% 12%, rgba(245,166,35,.15), transparent 62%),
    radial-gradient(760px 540px at 2% 74%,  rgba(80,140,210,.13), transparent 62%),
    radial-gradient(620px 460px at 94% 90%, rgba(143,211,95,.17), transparent 62%),
    radial-gradient(420px 320px at 55% 45%, rgba(255,112,67,.06), transparent 65%),
    linear-gradient(180deg,#fdfcf8,#f5f0e4);
  background-attachment:fixed;
}

/* skosny kolorowy pas za trescia + nieregularne bloby */
#wrapper{ position:relative; overflow-x:clip; }
#wrapper::before{
  content:""; position:absolute; top:90px; left:-8%; right:-8%; height:260px;
  background:linear-gradient(90deg,rgba(92,184,46,.10),rgba(245,166,35,.09) 45%,rgba(80,140,210,.09));
  transform:skewY(-3.5deg); border-radius:48px; z-index:0; pointer-events:none;
}
#wrapper::after{
  content:""; position:absolute; width:340px; height:340px; right:-110px; top:640px;
  background:radial-gradient(closest-side,rgba(92,184,46,.16),transparent);
  border-radius:58% 42% 38% 62%/55% 38% 62% 45%; z-index:0; pointer-events:none;
}
#wrapper>.container,#wrapper .container{ position:relative; z-index:1; }
#content-wrapper,#main{ position:relative; z-index:1; }
h1,h2,h3,.h1,.h2,.h3{ color:var(--eo-dark); font-weight:700; }
a{ color:var(--eo-green-d); }
a:hover,a:focus{ color:var(--eo-green); }

/* =====================================================================
   SZEROKI LAYOUT na duzych ekranach
   Poszerza .container (naglowek + tresc + stopka) -> logo bardziej w lewo,
   tresc wykorzystuje wiecej szerokosci. Male ekrany bez zmian.
   ===================================================================== */
@media (min-width:1200px){ .container{ width:auto!important; max-width:1560px!important; margin-left:auto; margin-right:auto; } }
@media (min-width:1600px){ .container{ max-width:1660px!important; } }
@media (min-width:1850px){ .container{ max-width:1760px!important; } }

/* karty produktow wypelniaja kolumne (wieksze na szerokich ekranach, bez luk;
   skaluja sie z szerokoscia ekranu, bo kolumna jest %-owa) */
@media (min-width:1200px){
  .product-miniature{ width:100%; }
  .product-miniature .thumbnail-container{ width:100%!important; height:auto!important; }
  .product-miniature .thumbnail-container .product-thumbnail,
  .product-miniature .thumbnail-container .product-thumbnail img,
  .product-miniature .thumbnail img,
  .product-miniature .thumbnail-container img{ width:100%!important; height:auto!important; }
}

/* =====================================================================
   NAGLOWEK v3 - uklad jak w sklepach: promo / info / szukajka / menu
   ===================================================================== */

/* --- PASEK PROMO (na samej gorze, jasna zielen marki) --- */
.eo-promobar{ background:linear-gradient(90deg,var(--eo-green),var(--eo-green-d)); color:#fff; }
.eo-promobar-in{ position:relative; display:flex; align-items:center; justify-content:center; gap:16px; padding:9px 44px; flex-wrap:wrap; text-align:center; }
.eo-promo-txt{ font-size:14.5px; letter-spacing:.01em; }
.eo-promo-txt b{ font-weight:800; }
.eo-promo-btn{ display:inline-block; background:#fff; color:var(--eo-green-xd)!important; font-weight:800; font-size:12.5px; text-transform:uppercase; letter-spacing:.03em; padding:6px 18px; border-radius:999px; transition:.2s; }
.eo-promo-btn:hover{ background:var(--eo-dark); color:#fff!important; transform:translateY(-1px); }
.eo-promo-x{ position:absolute; right:6px; top:50%; transform:translateY(-50%); background:transparent; border:0; color:#fff; font-size:22px; line-height:1; cursor:pointer; opacity:.85; padding:4px 8px; }
.eo-promo-x:hover{ opacity:1; }

/* --- PASEK INFO (grafit, odznaki + jezyk/waluta) --- */
#header .header-nav.eo-infobar{ background:var(--eo-dark); border-bottom:0; max-height:none; }
.eo-infobar-in{ display:flex; align-items:center; justify-content:space-between; min-height:42px; }
.eo-info-left{ display:flex; align-items:center; gap:28px; }
.eo-info-item{ display:inline-flex; align-items:center; gap:7px; color:#e7ddcd; font-size:13px; font-weight:600; }
.eo-info-item .material-icons{ font-size:18px; color:var(--eo-lime); }
.eo-info-right{ display:flex; align-items:center; gap:8px; }
#header .header-nav.eo-infobar a,#header .header-nav.eo-infobar span,#header .header-nav.eo-infobar .expand-more{ color:#e7ddcd!important; }
#header .header-nav.eo-infobar .dropdown-menu{ border-radius:12px; box-shadow:0 16px 40px rgba(0,0,0,.25); }
#header .header-nav.eo-infobar .dropdown-menu a,#header .header-nav.eo-infobar .dropdown-menu span{ color:var(--eo-ink)!important; }
#header .header-nav.eo-infobar .dropdown-menu a:hover{ color:var(--eo-green-d)!important; }

/* --- NAGLOWEK GLOWNY (bialy): logo | szukajka (srodek) | konto+koszyk --- */
#header{ background:#fff; box-shadow:0 4px 22px rgba(36,26,23,.08); }
#header .header-top.eo-mainhead{ padding:14px 0; }
.eo-mainhead-in{ display:flex; align-items:center; gap:30px; }
.eo-logo{ flex:0 0 auto; }
.eo-logo-h1{ margin:0; line-height:0; }
#header .logo{ max-height:none; height:100px; width:auto; }
.eo-search{ flex:1 1 auto; min-width:0; display:flex; justify-content:center; }
.eo-actions{ flex:0 0 auto; display:flex; align-items:center; gap:6px; }
@media(max-width:991px){ #header .logo{ height:66px; } .eo-mainhead-in{ gap:16px; } }

/* wyszukiwarka - duza pigulka wypelniajaca srodek */
.eo-search #search_widget{ width:100%; max-width:720px; min-width:0; }
/* checkout: motyw chowa wyszukiwarke - naglowek ma byc identyczny wszedzie */
.eo-search #search_widget{ display:block!important; }
.eo-search #search_widget .search-widgets,.eo-search #search_widget form{ width:100%; }
.eo-search #search_widget form{ position:relative; }
#search_widget input[type=text]{
  width:100%; background:var(--eo-cream); border:2px solid #e5dccb; border-radius:999px;
  padding:14px 58px 14px 22px; font-size:15px; transition:.25s;
}
#search_widget input[type=text]::placeholder{ color:#7a7266; }
#search_widget input[type=text]:focus{ border-color:var(--eo-green); background:#fff; box-shadow:0 0 0 4px rgba(92,184,46,.14); outline:0; }
/* lupa jako zielone kolko po prawej (motyw nie ma <button>, tylko <i.search>) */
#search_widget .material-icons.search{
  position:absolute; right:6px; top:50%; transform:translateY(-50%); left:auto; margin:0;
  width:42px; height:42px; border-radius:50%; z-index:2; cursor:pointer;
  background:linear-gradient(120deg,var(--eo-green),var(--eo-green-d)); color:#fff!important;
  display:flex; align-items:center; justify-content:center; font-size:22px; transition:.2s;
}
#search_widget .material-icons.search:hover{ background:linear-gradient(120deg,var(--eo-green-d),var(--eo-green-xd)); }
#search_widget .material-icons.clear,#search_widget i.clear{ display:none!important; }

/* KONTO + KOSZYK - ikona + podpis pod spodem */
.eo-actions .user-info a,
.eo-actions .blockcart .header{
  position:relative; display:flex; flex-direction:column; align-items:center; gap:2px;
  color:var(--eo-dark)!important; font-size:11.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:.02em; padding:6px 12px; border-radius:14px; cursor:pointer; transition:.2s; line-height:1.1; white-space:nowrap;
}
.eo-actions .user-info a:hover,.eo-actions .blockcart .header:hover{ background:var(--eo-green-l); color:var(--eo-green-xd)!important; }
.eo-actions .material-icons{ font-size:27px; color:var(--eo-green-d); margin:0; }
.eo-actions .blockcart,.eo-actions .blockcart.active{ background:transparent; padding:0; }
.eo-actions .blockcart .header .hidden-sm-down{ display:block; }
.eo-actions .cart-products-count{
  position:absolute; top:-1px; right:2px; background:var(--eo-orange); color:#fff;
  border-radius:999px; min-width:20px; height:20px; line-height:20px; text-align:center;
  font-size:11px; font-weight:800; padding:0 5px; box-shadow:0 2px 6px rgba(0,0,0,.2);
}

/* =====================================================================
   PASEK MENU - osobny rzad pod naglowkiem
   Czyste linki + animowany underline (szer. tekstu, wjazd od lewej),
   kolor per-kategoria z cyklicznej palety (nth-child); pasek akcentu = kolorowa krawedz
   na DOLE rozwijanego panelu (dropdown), w kolorze danej kategorii.
   ===================================================================== */
.eo-menubar{
  --c1:#5cb82e; /* green  */
  --c2:#f5a623; /* orange */
  --c3:#2f9be0; /* blue   */
  --c4:#14b8a6; /* teal   */
  --c5:#e5528b; /* pink   */
  --c6:#8b5cf6; /* purple */
  position:relative; background:#fff; border-top:1px solid #efe9dc;
  box-shadow:0 6px 18px rgba(36,26,23,.06); z-index:6;
}
.eo-menubar-in{ display:flex; justify-content:center; }
#_desktop_top_menu{ width:100%; }
#_desktop_top_menu .top-menu[data-depth="0"]{
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap:2px 8px; margin:0; padding:4px 0; list-style:none;
}
/* przypisanie koloru wg CYKLU nth-child (nie po id/label) */
#_desktop_top_menu .top-menu[data-depth="0"] > li{ --cat:var(--c1); }
#_desktop_top_menu .top-menu[data-depth="0"] > li:nth-child(6n+1){ --cat:var(--c1); }
#_desktop_top_menu .top-menu[data-depth="0"] > li:nth-child(6n+2){ --cat:var(--c2); }
#_desktop_top_menu .top-menu[data-depth="0"] > li:nth-child(6n+3){ --cat:var(--c3); }
#_desktop_top_menu .top-menu[data-depth="0"] > li:nth-child(6n+4){ --cat:var(--c4); }
#_desktop_top_menu .top-menu[data-depth="0"] > li:nth-child(6n+5){ --cat:var(--c5); }
#_desktop_top_menu .top-menu[data-depth="0"] > li:nth-child(6n+6){ --cat:var(--c6); }
/* linki top-level: wiekszy czysty tekst, box przylega do tekstu, ZERO pigulki */
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"],
#_desktop_top_menu .top-menu[data-depth="0"] > li > a.dropdown-item{
  position:relative; display:inline-block; width:auto; white-space:nowrap;
  font-weight:700; font-size:16px; letter-spacing:.02em; text-transform:uppercase;
  color:var(--eo-dark); padding:18px 20px;
  background:none; border:0; border-radius:0; box-shadow:none; text-decoration:none;
  transition:color .22s ease;
}
/* podkreslenie DOKLADNIE na szerokosc TEKSTU (inset = padding poziomy) + wjazd od LEWEJ */
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"]::after{
  content:""; position:absolute; left:20px; right:20px; bottom:10px;
  height:3px; border-radius:3px; background:var(--cat);
  transform:scaleX(0); transform-origin:left center;
  transition:transform .3s cubic-bezier(.22,1,.36,1); pointer-events:none;
}
/* twarda kasacja pigulki na hover/focus/current - tekst zostaje czysty */
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"]:hover,
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"]:focus,
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"]:focus-visible,
#_desktop_top_menu .top-menu[data-depth="0"] > li:focus-within > a[data-depth="0"],
#_desktop_top_menu .top-menu[data-depth="0"] > li.current > a[data-depth="0"],
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"].current{
  color:var(--eo-dark); background:none; box-shadow:none; border-radius:0;
}
/* underline IN: hover, focus-visible, focus-within oraz .current (trwaly) */
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"]:hover::after,
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"]:focus-visible::after,
#_desktop_top_menu .top-menu[data-depth="0"] > li:focus-within > a[data-depth="0"]::after,
#_desktop_top_menu .top-menu[data-depth="0"] > li.current > a[data-depth="0"]::after,
#_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"].current::after{
  transform:scaleX(1);
}
/* DROPDOWN: czysty; kolorowy PASEK AKCENTU na DOLE panelu (w kolorze kategorii) */
#_desktop_top_menu .top-menu .sub-menu{
  border:0; border-bottom:4px solid var(--cat);
  border-radius:0 0 12px 12px;
  box-shadow:0 20px 44px rgba(36,26,23,.16); background:#fff; padding:8px 0 6px;
}
#_desktop_top_menu .top-menu .sub-menu .top-menu[data-depth="1"]{ margin:0; padding:0; list-style:none; }
#_desktop_top_menu .top-menu .sub-menu a[data-depth="1"]{
  display:block; padding:9px 22px;
  font-size:14px; font-weight:600; letter-spacing:.02em; text-transform:uppercase;
  color:var(--eo-dark); border-radius:8px;
  transition:color .18s ease, background-color .18s ease;
}
#_desktop_top_menu .top-menu .sub-menu a[data-depth="1"]:hover{
  color:color-mix(in srgb, var(--cat) 78%, #000);
  background:color-mix(in srgb, var(--cat) 12%, transparent);
}
@media (prefers-reduced-motion: reduce){
  #_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"],
  #_desktop_top_menu .top-menu[data-depth="0"] > li > a[data-depth="0"]::after{ transition:none; }
}

/* =====================================================================
   PRZYCISKI - pill, soczyste
   ===================================================================== */
.btn{ border-radius:999px; font-weight:700; letter-spacing:.02em; }
.btn-primary,.btn-primary:visited{
  background:linear-gradient(120deg,var(--eo-green),var(--eo-green-d));
  border:0; color:#fff; padding:.65rem 1.6rem;
  box-shadow:none; transition:background .22s,transform .22s;
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active{
  background:linear-gradient(120deg,var(--eo-green-d),var(--eo-green-xd))!important;
  color:#fff!important; transform:translateY(-1px); box-shadow:none!important;
}
.btn-secondary,.btn-tertiary{ border-radius:999px; }
.btn-outline-primary{ color:var(--eo-green-d); border:2px solid var(--eo-green); }
.btn-outline-primary:hover{ background:var(--eo-green); border-color:var(--eo-green); color:#fff; }

/* =====================================================================
   PRODUKT: przycisk koszyka / pole ilosci / udostepnianie (bez blura)
   ===================================================================== */
.add-to-cart,.product-add-to-cart .btn-primary,.btn.add-to-cart{ box-shadow:none!important; }

/* ilosc + przycisk: wysrodkowane w pionie, przycisk odsuniety w prawo */
.product-quantity{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.product-quantity .qty,.product-quantity .add{ margin:0; }
.product-quantity .add .btn-primary,.product-quantity .add-to-cart{ border-radius:999px; padding:.72rem 1.7rem; }

/* pole ilosci - zaokraglone, spojne z przyciskiem */
.product-quantity .qty .input-group,
.product-quantity .bootstrap-touchspin,
.product-quantity .input-group.bootstrap-touchspin{
  border:1.5px solid #e5dccb; border-radius:14px; overflow:hidden; background:#fff;
}
.product-quantity #quantity_wanted{
  border:0; height:46px; min-width:52px; text-align:center; font-weight:700;
  color:var(--eo-dark); background:transparent; box-shadow:none;
}
.product-quantity .input-group-btn-vertical{ border-left:1.5px solid #efe7d6; }
.product-quantity .input-group-btn-vertical>.btn,
.product-quantity .btn-touchspin{
  background:#faf6ee; border:0; color:var(--eo-green-d); box-shadow:none;
}
.product-quantity .input-group-btn-vertical>.btn:hover,
.product-quantity .btn-touchspin:hover{ background:var(--eo-green); color:#fff; }

/* udostepnianie: Facebook + Email, czyste kolka bez poswiaty */
.social-sharing ul{ display:flex; gap:10px; align-items:center; margin:0; padding:0; list-style:none; }
.social-sharing ul li{ width:40px; height:40px; margin:0!important; padding:0; background:#f0eadf!important; border-radius:50%; list-style:none; transition:background .2s; }
.social-sharing ul li:hover{ background:var(--eo-green)!important; }
.social-sharing li a{
  display:block; width:40px; height:40px; font-size:0; color:transparent; text-indent:-9999px; overflow:hidden;
  background:#5b5148!important;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center; mask-position:center;
  -webkit-mask-size:18px 18px; mask-size:18px 18px;
}
.social-sharing li:hover a{ background:#fff!important; }
.social-sharing li.facebook a{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M80 299.3V512H196V299.3h86.5l18-97.8H196V166.9c0-51.7 20.3-71.5 72.7-71.5c16.3 0 29.4 .4 37 1.2V7.9C291.4 4 256.4 0 236.2 0C129.3 0 80 50.5 80 159.4v42.1H14v97.8H80z'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M80 299.3V512H196V299.3h86.5l18-97.8H196V166.9c0-51.7 20.3-71.5 72.7-71.5c16.3 0 29.4 .4 37 1.2V7.9C291.4 4 256.4 0 236.2 0C129.3 0 80 50.5 80 159.4v42.1H14v97.8H80z'/%3E%3C/svg%3E");
}
.social-sharing li.email a{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48H48zM0 176V384c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V176L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48H48zM0 176V384c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V176L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z'/%3E%3C/svg%3E");
}

/* =====================================================================
   CENY, ETYKIETY
   ===================================================================== */
.product-price,.price,.current-price .price,.product-miniature .price,
.product-prices .current-price span,.h5.product-price{ color:#2e7d32!important; font-weight:800; }
.regular-price{ color:#a79f93; font-weight:500; }
.product-flag{ border-radius:999px; padding:4px 12px; font-weight:700; letter-spacing:.03em; box-shadow:0 4px 10px rgba(0,0,0,.14); }
.product-flag.discount,.product-flag.on-sale{ background:linear-gradient(120deg,#e65100,#c05600)!important; }

/* =====================================================================
   KARTY PRODUKTOW
   ===================================================================== */
.product-miniature .thumbnail-container,.card.product-miniature{
  border:0; border-radius:var(--eo-radius); overflow:hidden; background:#fff;
  box-shadow:0 6px 20px rgba(36,26,23,.07); transition:transform .28s,box-shadow .28s;
}
.product-miniature:hover .thumbnail-container{ transform:translateY(-6px); box-shadow:0 20px 42px rgba(36,26,23,.16); }
.product-miniature .product-title a{ color:var(--eo-dark); font-weight:600; font-size:15px; }
.product-miniature .product-title a:hover{ color:var(--eo-green-d); }
.highlighted-informations{ box-shadow:none; }

/* dodaj do koszyka */
.add-to-cart,.product-add-to-cart .btn-primary{ border-radius:999px; }

/* =====================================================================
   SEKCJE, TYTULY
   ===================================================================== */
.featured-products{ padding:10px 0 26px; }
.products-section-title,.h2.products-section-title{
  font-weight:800; letter-spacing:.02em; font-size:28px; text-transform:none;
}
.products-section-title:after{
  content:""; display:block; width:76px; height:5px; border-radius:3px;
  background:linear-gradient(90deg,var(--eo-green),var(--eo-lime)); margin:14px auto 0;
}
.all-product-link{ color:var(--eo-green-d); font-weight:700; }
.all-product-link:hover{ color:var(--eo-green); }

/* =====================================================================
   SLIDER / BANERY - zaokraglone
   ===================================================================== */
#carousel,.carousel{ border-radius:var(--eo-radius); overflow:hidden; box-shadow:0 14px 36px rgba(36,26,23,.12); margin-top:18px; }
/* slider wypelnia szerszy kontener (demo obrazy; docelowo wlasne banery) */
#carousel .carousel-item figure,.carousel .carousel-item figure{ width:100%!important; display:block!important; margin:0; }
#carousel .carousel-item img,.carousel .carousel-item img,#carousel .carousel-inner img{ width:100%!important; height:auto; display:block; }
.carousel .direction .carousel-control .icon-prev,.carousel .direction .carousel-control .icon-next{ background:rgba(92,184,46,.9); border-radius:50%; }
#custom-text{ border-radius:var(--eo-radius); background:linear-gradient(120deg,#fff,var(--eo-green-l)); box-shadow:0 8px 24px rgba(36,26,23,.07); }

/* =====================================================================
   BREADCRUMB, ALERTY, FORMULARZE
   ===================================================================== */
.breadcrumb{ background:transparent; }
.breadcrumb li a{ color:var(--eo-green-d); }
.alert-success{ background:var(--eo-green-l); border-color:var(--eo-green); color:#2f5e18; border-radius:12px; }
.form-control{ border-radius:10px; }
.form-control:focus{ border-color:var(--eo-green); box-shadow:0 0 0 3px rgba(92,184,46,.15); }
.card,.page-content,.block-categories{ border-radius:var(--eo-radius); border:0; box-shadow:0 6px 20px rgba(36,26,23,.06); }
.thumbnail-container img,.product-cover img{ border-radius:12px; }

/* =====================================================================
   NEWSLETTER - wtopiony w stopke, na zielono
   ===================================================================== */
.block_newsletter{
  background:linear-gradient(120deg,#2f6b16,#3e8c1d);
  border-radius:var(--eo-radius); padding:26px 30px; margin-bottom:34px;
  box-shadow:0 14px 34px rgba(0,0,0,.25);
}
.block_newsletter,.block_newsletter p,.block_newsletter .col-md-5 p{ color:#fff; }
.block_newsletter p.h4,.block_newsletter .h4{ color:#fff; font-weight:800; }
.block_newsletter form input[type=email]{
  border-radius:999px; border:0; padding:13px 22px; background:#fff; color:var(--eo-ink);
}
.block_newsletter form input[type=email]:focus{ box-shadow:0 0 0 4px rgba(255,255,255,.3); outline:0; }
.block_newsletter form .btn-primary{
  border-radius:999px; background:var(--eo-dark); box-shadow:0 8px 18px rgba(0,0,0,.3);
}
.block_newsletter form .btn-primary:hover{ background:#000!important; }
#footer .block_newsletter p,.block_newsletter form p,.block_newsletter p,.block_newsletter small,
.block_newsletter .row p:last-child,.block_newsletter p.mt-1{ color:rgba(255,255,255,.9)!important; font-size:12.5px; }
.block_newsletter p.h4,.block_newsletter .h4{ font-size:22px; }

/* dolny pasek copyright - na ciemno, spojnie */
#footer .copyright,#footer .copyright a,body #footer div.copyright{ color:#a59a8a; background:transparent; }

/* =====================================================================
   STOPKA - ciemna, ale CZYTELNA
   ===================================================================== */
#footer{
  background:linear-gradient(160deg,var(--eo-dark) 60%,var(--eo-dark-2));
  color:#d9d0c3; margin-top:56px; padding-top:64px;
  clip-path:polygon(0 34px,100% 0,100% 100%,0 100%);
}
.footer-container{ background:transparent; box-shadow:none; margin-top:0; padding-top:0; overflow:hidden; }
/* WSZYSTKIE naglowki sekcji stopki - zielone, widoczne */
#footer .h3,#footer h3,#footer .title,#footer p.title,#footer .h4,
#footer .myaccount-title,#footer .myaccount-title a,
#footer .block-contact .title,#footer .links .title,
#footer .title span,#footer .navbar-toggler{
  color:var(--eo-lime)!important; font-weight:800; letter-spacing:.06em; text-transform:uppercase; font-size:14.5px;
}
#footer a,#footer li a{ color:#d9d0c3; font-size:14.5px; transition:.2s; }
#footer a:hover,#footer li a:hover{ color:#fff; padding-left:2px; }
#footer .block-contact{ color:#d9d0c3; }
#footer .block-contact a{ color:var(--eo-lime); }
#footer li{ margin-bottom:6px; }

/* social - zielone kolka, biala ikona (zawsze widoczna) */
.block-social{ text-align:left; }
.block-social ul{ display:flex; gap:10px; justify-content:flex-start; }
.block-social ul li{
  background:linear-gradient(135deg,var(--eo-green),var(--eo-green-d))!important;
  border-radius:50%; width:44px; height:44px;
  box-shadow:0 2px 6px rgba(36,26,23,.18); transition:.22s;
}
.block-social ul li:hover{ transform:translateY(-3px); box-shadow:0 5px 12px rgba(36,26,23,.28); }
.block-social ul li a{
  width:44px; height:44px; display:block; font-size:0; color:transparent;
  background-color:transparent!important;
  background-size:20px 20px!important; background-position:center!important; background-repeat:no-repeat!important;
}
/* wlasna biala ikona FB (motyw nie zawsze podpina swoja) */
.block-social li.facebook a,.block-social li a[href*="facebook"]{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23ffffff' d='M80 299.3V512H196V299.3h86.5l18-97.8H196V166.9c0-51.7 20.3-71.5 72.7-71.5c16.3 0 29.4 .4 37 1.2V7.9C291.4 4 256.4 0 236.2 0C129.3 0 80 50.5 80 159.4v42.1H14v97.8H80z'/%3E%3C/svg%3E")!important;
}

/* dolna linia stopki */
#footer .copyright,#footer a.copyright,.copyright{ color:#a59a8a; }
#footer .footer-bottom,#footer .copyright-row{ border-top:1px solid rgba(255,255,255,.08); }

/* kredyt McProdukt */
.eo-credit{ text-align:center; padding:10px 0 22px; font-size:13px; color:#a59a8a; }
.eo-credit a{ color:var(--eo-lime)!important; font-weight:600; }
.eo-credit a:hover{ color:#fff!important; }

/* =====================================================================
   BANER COOKIES
   ===================================================================== */
#eo-cookie{position:fixed;left:0;right:0;bottom:0;z-index:99998;transform:translateY(120%);transition:transform .45s cubic-bezier(.2,.8,.2,1);pointer-events:none;}
#eo-cookie.show{transform:none;pointer-events:auto;}
.eo-cookie-in{max-width:1120px;margin:0 auto 14px;background:var(--eo-dark);color:#e8dfce;border:1px solid var(--eo-green);border-radius:16px;box-shadow:0 20px 50px rgba(36,26,23,.4);padding:20px 26px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.eo-cookie-txt{flex:1;min-width:280px;}
.eo-cookie-txt b{color:#fff;font-size:17px;display:block;margin-bottom:4px;}
.eo-cookie-txt p{font-size:13.5px;line-height:1.6;margin:0;color:#cbc0b3;}
.eo-cookie-btns{display:flex;gap:12px;flex-shrink:0;}
.eo-cookie-btn{font-size:13.5px;letter-spacing:.03em;padding:12px 26px;border-radius:999px;cursor:pointer;border:1px solid transparent;transition:.25s;white-space:nowrap;font-weight:700;}
.eo-cookie-acc{background:linear-gradient(120deg,var(--eo-green),var(--eo-green-d));color:#fff;}
.eo-cookie-acc:hover{filter:brightness(1.08);}
.eo-cookie-rej{background:transparent;color:#e8dfce;border-color:rgba(232,223,206,.4);}
.eo-cookie-rej:hover{border-color:#fff;color:#fff;}
@media(max-width:640px){.eo-cookie-in{margin:0 10px 10px;padding:16px;gap:12px;}.eo-cookie-btns{width:100%;}.eo-cookie-btn{flex:1;padding:12px 8px;}}

/* =====================================================================
   POPRAWKI PO RECENZJI (kontrast/UX)
   ===================================================================== */
/* overflow poziomy */
html,body{ overflow-x:clip; }

/* strzalki karuzeli - pelne kolka wewnatrz banera */
.carousel .direction{ overflow:visible; z-index:5; }
.carousel .carousel-control{ opacity:1; width:70px; }
.carousel .carousel-control .icon-prev,.carousel .carousel-control .icon-next{
  background:var(--eo-green-d); border-radius:50%; width:48px; height:48px;
  box-shadow:0 6px 16px rgba(0,0,0,.3); margin:0;
}
.carousel .carousel-control.left .icon-prev{ margin-left:26px; }
.carousel .carousel-control.right .icon-next{ margin-right:26px; }
/* tekst na slajdach czytelniejszy */
.carousel .caption,.carousel .caption-description{ text-shadow:0 2px 12px rgba(0,0,0,.45); }

/* linki "Wszystkie produkty" jako wyrazne CTA */
.all-product-link{ color:#2e7d32!important; font-weight:800; font-size:15px; border-bottom:2px solid var(--eo-green); padding-bottom:2px; }
.all-product-link:hover{ color:var(--eo-green-xd)!important; border-color:var(--eo-green-xd); }

/* naprzemienne tinty sekcji - wiecej koloru */
#index .featured-products:nth-of-type(odd){ background:linear-gradient(120deg,#eef8e6,#f6fbef); border-radius:24px; padding:26px 22px 30px; }

/* tytuly kart - 2 linie zamiast uciecia */
.product-miniature .product-title{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.6em; }

/* social pod kolumnami, nie samotnie */
.block-social{ margin:4px 0 14px; }

/* ukryj copyright PrestaShop */
#footer a[href*="prestashop-project.org"],#footer a[href*="prestashop.com"]{ display:none!important; }
#footer div:has(> a[href*="prestashop-project.org"]){ display:none!important; }

/* dolna linia: (c) po lewej, kredyt po prawej */
.eo-credit{
  display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap;
  max-width:1140px; margin:0 auto; padding:16px 22px 24px;
  border-top:1px solid rgba(255,255,255,.09); font-size:13px; color:#b8ad9d; text-align:left;
}
.eo-credit a{ color:var(--eo-lime)!important; font-weight:700; }
.eo-credit a:hover{ color:#fff!important; }
@media(max-width:560px){ .eo-credit{ justify-content:center; text-align:center; } }

/* =====================================================================
   MC 2026-07-24: naglowek w kolorach ukosnego pasa + mocniejszy pas w tle
   ===================================================================== */
/* ukosny pas za trescia - mocniejsze kolory */
#wrapper::before{
  background:linear-gradient(90deg,rgba(92,184,46,.40),rgba(245,166,35,.36) 45%,rgba(80,140,210,.36));
}
/* pasek z logo/szukajka/kontem - to samo tlo co pas */
#header .header-top.eo-mainhead{
  background:linear-gradient(90deg,rgba(92,184,46,.40),rgba(245,166,35,.36) 45%,rgba(80,140,210,.36));
}
/* napis e-outlet pod logo */
.eo-logo{ display:flex; flex-direction:column; align-items:center; gap:4px; }
.eo-wordmark{ display:block; height:30px; width:auto; max-width:100%; }
@media(max-width:991px){ .eo-wordmark{ height:20px; } }

/* =====================================================================
   MC 2026-07-24 v2: INTENSYWNE kolory TYLKO w pasku naglowka
   (bialy napis e-outlet musi byc dobrze widoczny), pas w tle subtelny
   ===================================================================== */
/* pas w tle sklepu - tylko lekko wyrazniejszy niz oryginal */
#wrapper::before{
  background:linear-gradient(90deg,rgba(92,184,46,.22),rgba(245,166,35,.20) 45%,rgba(80,140,210,.20));
}
/* pasek z logo/szukajka/kontem - PELNE, nasycone kolory marki */
#header .header-top.eo-mainhead{
  background:linear-gradient(90deg,#54ad27 0%,#8cc63f 22%,#f0a01c 48%,#7fa8d8 76%,#4a86c8 100%);
}
/* napis e-outlet pod logo - wieksze i wysrodkowane */
.eo-logo{ display:flex; flex-direction:column; align-items:center; gap:2px; }
.eo-wordmark{ display:block; height:38px; width:auto; margin:0 auto; }
@media(max-width:991px){ .eo-wordmark{ height:26px; } }
/* na nasyconym tle napisy konta/koszyka i ikony na biel dla kontrastu */
.eo-actions .account span,.eo-actions #_desktop_cart span,
.eo-mainhead .eo-actions a{ color:#fff!important; }

/* =====================================================================
   MC 2026-07-24 v3: LIMONKA #CDFF00 (kolor z grafiki e-outlet) jako akcent
   Wszedzie z CIEMNYM tekstem - na limonce bialy tekst jest nieczytelny
   ===================================================================== */
:root{ --eo-lime:#CDFF00; --eo-lime-ink:#241a17; }

/* pasek promocyjny u gory */
.eo-promobar{ background:var(--eo-lime)!important; }
.eo-promobar .eo-promo-txt,.eo-promobar .eo-promo-txt b,.eo-promobar .eo-promo-x{ color:var(--eo-lime-ink)!important; }
.eo-promobar .eo-promo-btn{
  background:var(--eo-lime-ink)!important; color:var(--eo-lime)!important; border-color:var(--eo-lime-ink)!important;
}
.eo-promobar .eo-promo-btn:hover{ background:#000!important; color:var(--eo-lime)!important; }

/* przyciski akcji */
.btn-primary,.btn-primary:hover,.btn-primary:focus,.btn-primary:active,
.add-to-cart,.add-to-cart:hover,.add-to-cart:focus{
  background:var(--eo-lime)!important; border-color:var(--eo-lime)!important;
  color:var(--eo-lime-ink)!important; font-weight:700;
}
/* lupa w wyszukiwarce */
#search_widget .material-icons.search{ background:var(--eo-lime)!important; color:var(--eo-lime-ink)!important; }
/* strzalki karuzeli */
.carousel .carousel-control .icon-prev,.carousel .carousel-control .icon-next{
  background:var(--eo-lime)!important; color:var(--eo-lime-ink)!important;
}
/* licznik koszyka */
.eo-actions .cart-products-count{ background:var(--eo-lime)!important; color:var(--eo-lime-ink)!important; }

/* =====================================================================
   MC 2026-07-24 v4: pomaranczowy i niebieski OSLABIONE
   Zielen po lewej zostaje mocna (bialy napis e-outlet musi byc czytelny),
   srodek i prawa strona jasne -> wyszukiwarka, konto i koszyk dobrze widoczne
   ===================================================================== */
#header .header-top.eo-mainhead{
  background:linear-gradient(90deg,
    #54ad27 0%,
    #7cbf35 18%,
    #b9d98a 34%,
    #f3e0bd 50%,
    #e3ebf3 72%,
    #d5e4f4 100%)!important;
}
/* na jasnym tle napisy konta/koszyka MUSZA byc ciemne */
.eo-mainhead .eo-actions a,
.eo-actions .account span,.eo-actions #_desktop_cart span,
.eo-actions .account i,.eo-actions #_desktop_cart i{ color:var(--eo-lime-ink)!important; }

/* =====================================================================
   MC 2026-07-24 v5: ikony spolecznosciowe na limonce (ciemna ikona)
   ===================================================================== */
/* stopka - kolko limonkowe zamiast zielonego */
.block-social ul li{
  background:var(--eo-lime)!important;
  background-image:none!important;
}
.block-social ul li:hover{ background:#dcff3d!important; }
/* ikona FB w kolorze ciemnym (na limonce biala bylaby niewidoczna) */
.block-social li.facebook a,.block-social li a[href*="facebook"]{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23241a17' d='M80 299.3V512H196V299.3h86.5l18-97.8H196V166.9c0-51.7 20.3-71.5 72.7-71.5c16.3 0 29.4 .4 37 1.2V7.9C291.4 4 256.4 0 236.2 0C129.3 0 80 50.5 80 159.4v42.1H14v97.8H80z'/%3E%3C/svg%3E")!important;
}
/* przyciski udostepniania przy produkcie - hover na limonke, ikona ciemna */
.social-sharing ul li:hover{ background:var(--eo-lime)!important; }
.social-sharing li:hover a{ background:var(--eo-lime-ink)!important; }
/* dlugi adres e-mail nie moze sie lamac w polowie slowa */
.block-contact a[href^="mailto"],.block-contact li,.block-contact,
#footer .block-contact,#left-column .block-contact{
  overflow-wrap:anywhere; word-break:normal;
}

/* ============================================================
   KROK 3 CHECKOUTU: SPOSOB DOSTAWY  (2026-08-04, wersja 2)
   Rowne kafelki, wyrownanie do lewej, caly wiersz klikalny.
   Bez JS - szablon ma juz <label for>, wystarczy dac mu wypelnic
   wiersz. Kolko wyboru zostawiamy w rozmiarze motywu (18px),
   bo inaczej kropka w srodku ucieka z osi.
   ============================================================ */

.delivery-options-list .delivery-options {
  display: block;
}

/* UWAGA: motyw rysuje szara kreske `.delivery-options > .row { border-right }`.
   NIE kasowac jej regula na `> .row`, bo kafelek TEZ jest takim wierszem i taka
   regula (wyzsza waga) zdejmuje mu prawa krawedz. Wystarczy pelne `border`
   ponizej - nadpisuje kreske motywu i zostawia zamknieta ramke.              */

/* --- kafelek jednej opcji ---
   !important, bo motyw ustawia tlo, wysokosc i justify-content
   selektorami o tej samej lub wyzszej wadze                        */
.delivery-options-list .delivery-option {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-start !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  min-height: 0 !important;
  background: #fff !important;
  border: 2px solid #e8e8e8 !important;
  border-radius: 14px !important;
  cursor: pointer;
  transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}

.delivery-options-list .delivery-option:hover {
  border-color: #5cb82e !important;
  background: #fbfff8 !important;
}

.delivery-options-list .delivery-option:has(input[type="radio"]:checked) {
  border-color: #5cb82e !important;
  background: #f5fbf0 !important;
  box-shadow: 0 2px 12px rgba(92, 184, 46, .16);
}

/* --- kolumna z kolkiem wyboru: NIE ruszamy rozmiaru, tylko wyrownanie --- */
.delivery-options-list .delivery-option > .col-sm-1 {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0 0 16px !important;
}

.delivery-options-list .delivery-option .custom-radio {
  float: none !important;
  margin: 0;
}

/* kolko w kolorach sklepu */
.delivery-options-list .delivery-option .custom-radio input[type="radio"]:checked + span {
  background-color: #5cb82e;
}

.delivery-options-list .delivery-option:has(input[type="radio"]:checked) .custom-radio {
  border-color: #5cb82e;
}

/* --- etykieta wypelnia caly wiersz => klikniecie gdziekolwiek zaznacza --- */
.delivery-options-list .delivery-option > label {
  flex: 1 1 auto;
  width: auto;
  max-width: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  min-height: 64px;
  margin: 0;
  padding: 12px 18px 12px 10px !important;
  cursor: pointer;
}

/* wiersz z nazwa zajmuje cala szerokosc, panel wyboru punktu ladnie
   schodzi pod niego zamiast wciskac sie obok */
.delivery-options-list .delivery-option > label > .row {
  flex: 1 1 100%;
}

.delivery-options-list .delivery-option > label > .row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  margin: 0 !important;
  gap: 6px 16px;
}

/* bootstrapowe wciecia kolumn rozpychaly nazwe od kolka wyboru */
.delivery-options-list .delivery-option > label > .row > [class*="col-"],
.delivery-options-list .delivery-option .carrier,
.delivery-options-list .delivery-option .carrier > [class*="col-"] {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* --- kolumny: nazwa | termin | cena --- */
.delivery-options-list .delivery-option > label > .row > .col-sm-5 {
  flex: 0 0 200px !important;
  width: 200px !important;
  max-width: 200px !important;
}

.delivery-options-list .delivery-option > label > .row > .col-sm-4 {
  flex: 1 1 auto !important;
  max-width: none !important;
}

.delivery-options-list .delivery-option > label > .row > .col-sm-3 {
  flex: 0 0 auto;
  max-width: none;
  padding: 0;
  margin-left: auto;
  text-align: right;
}

/* pusta ramka na logo rozpychala nazwe */
.delivery-options-list .carrier:not(.carrier-hasLogo) .carrier-logo {
  display: none;
}

.delivery-options-list .carrier {
  display: flex;
  align-items: center;
  margin: 0;
  gap: 10px;
}

.delivery-options-list .carrier-logo {
  flex: 0 0 auto;
  max-width: 46px;
  padding: 0;
}

.delivery-options-list .carriere-name-container {
  flex: 1 1 auto;
  max-width: none;
  padding: 0;
}

/* --- typografia: jednakowa dla WSZYSTKICH pozycji --- */
.delivery-options-list .carrier-name,
.delivery-options-list span.h6.carrier-name {
  display: block;
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  color: #241a17;
  text-align: left;
  text-transform: none;
}

.delivery-options-list .carrier-delay {
  display: block;
  font-size: 13px;
  line-height: 1.4;
  color: #6f6f6f;
  text-align: left;
}

.delivery-options-list .carrier-price {
  display: block;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  color: #2e7d32;
  white-space: nowrap;
}

/* --- kontener rdzenia na tresc dodatkowa: bez wlasnej ramki --- */
.delivery-options-list .carrier-extra-content {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
}

/* pusty (sam bialy znak) nie ma zajmowac miejsca */
.delivery-options-list .carrier-extra-content:not(:has(*)) {
  display: none;
}

/* --- panel wyboru punktu (moduł Apaczki): WSZYSTKO W JEDNEJ LINII ---
   UWAGA: modul wstawia style="display:none" wprost w znaczniku i dopiero
   JS zmienia je na "block" przy zaznaczonym przewozniku. Dlatego uklad
   poziomy wymuszamy TYLKO wtedy, gdy panel jest faktycznie odslaniany -
   inaczej pokazalby sie przy kazdej opcji na liscie.                     */
.delivery-options-list .apaczka-additional-div[style*="block"] {
  display: flex !important;
}

.delivery-options-list .apaczka-additional-div {
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px 14px;
  width: auto !important;
  max-width: calc(100% - 60px);
  /* modul wstawia panel jako BEZPOSREDNIE dziecko kafelka, wiec sam z siebie
     zaczyna sie przed kolkiem wyboru. 44px = wciecie kolka + odstep etykiety,
     dzieki temu panel jest w jednej osi z nazwa przewoznika.               */
  margin: 0 16px 14px 44px;
  padding: 10px 16px;
  background: #fff;
  border: 1px solid #d9ecd0;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(36, 26, 23, .06);
  font-weight: 400 !important;
}

/* bootstrapowe w-100 na dzieciach lamalo uklad na dwie linie;
   flex: 0 1 auto - napis ma NIE rozpychac sie i nie odpychac przycisku */
.delivery-options-list .apaczka-additional-div > div,
.delivery-options-list .apaczka-additional-div .apaczka-no-point,
.delivery-options-list .apaczka-additional-div [id^="apaczka_delivery_point_label"] {
  width: auto !important;
  flex: 0 1 auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  color: #241a17;
  text-align: left;
  word-break: break-word;
}

/* pinezka i napis MUSZA byc w jednej linii: napis jest elementem blokowym,
   wiec sam kontener robimy flexem, a nie liczymy na uklad liniowy */
.delivery-options-list .apaczka-additional-div [id^="apaczka_delivery_point_label"] {
  display: flex;
  align-items: center;
  gap: 7px;
}

.delivery-options-list .apaczka-additional-div .apaczka-no-point {
  display: inline;
}

/* pinezka przed napisem - TYLKO na zewnetrznym kontenerze etykiety.
   .apaczka-no-point jest w nim zagniezdzone, wiec dodanie jej w obu
   miejscach dawalo dwie pinezki obok siebie.                        */
.delivery-options-list .apaczka-additional-div [id^="apaczka_delivery_point_label"]::before {
  content: "";
  flex: 0 0 auto;
  display: block;
  width: 15px;
  height: 15px;
  background: center / contain no-repeat
    url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235cb82e'%3E%3Cpath d='M12 2C8.1 2 5 5.1 5 9c0 5.2 7 13 7 13s7-7.8 7-13c0-3.9-3.1-7-7-7zm0 9.5a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E");
}

/* gdy punkt jest juz wybrany - adres wyrozniony */
.delivery-options-list .apaczka-additional-div [id^="apaczka_delivery_point_label"] {
  font-weight: 700;
}

.delivery-options-list .apaczka-additional-div .apaczka-open-map {
  flex: 0 0 auto;
  margin: 0;
  padding: 8px 20px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.2;
  white-space: nowrap;
  border: 0;
  border-radius: 999px;
  box-shadow: none;
  transition: transform .12s ease, filter .12s ease;
}

.delivery-options-list .apaczka-additional-div .apaczka-open-map:hover,
.delivery-options-list .apaczka-additional-div .apaczka-open-map:focus {
  transform: translateY(-1px);
  filter: brightness(.96);
}

/* ============================================================
   BANER PROMOCYJNY NA STRONIE GLOWNEJ (blok ps_customtext)
   Grafit + limonka, kontrast wobec jasnej reszty strony.
   ============================================================ */
#custom-text .eo-promo {
  display: flex;
  align-items: center;
  gap: 34px;
  margin: 0;
  padding: 34px 40px;
  background: linear-gradient(115deg, #241a17 0%, #2f2320 55%, #3a2b26 100%);
  border-radius: 18px;
  color: #fff;
  text-align: left;
  overflow: hidden;
  position: relative;
}

/* limonkowa poswiata w tle */
#custom-text .eo-promo::after {
  content: "";
  position: absolute;
  right: -90px;
  top: -70px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(205, 255, 0, .18) 0%, rgba(205, 255, 0, 0) 70%);
  pointer-events: none;
}

#custom-text .eo-promo__body {
  flex: 1 1 auto;
  min-width: 0;
  position: relative;
  z-index: 1;
}

#custom-text .eo-promo__badge {
  display: inline-block;
  margin: 0 0 12px;
  padding: 5px 14px;
  background: #CDFF00;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #241a17;
}

#custom-text .eo-promo__title {
  margin: 0 0 10px;
  font-size: 30px;
  line-height: 1.15;
  font-weight: 800;
  color: #fff;
  text-transform: none;
}

#custom-text .eo-promo__title em {
  font-style: normal;
  color: #CDFF00;
}

#custom-text .eo-promo__lead {
  margin: 0 0 16px;
  max-width: 640px;
  font-size: 15px;
  line-height: 1.55;
  color: rgba(255, 255, 255, .82);
}

#custom-text .eo-promo__points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 26px;
  margin: 0;
  padding: 0;
  list-style: none;
}

#custom-text .eo-promo__points li {
  position: relative;
  padding-left: 22px;
  font-size: 14px;
  color: rgba(255, 255, 255, .9);
}

#custom-text .eo-promo__points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  width: 12px;
  height: 7px;
  border-left: 2px solid #CDFF00;
  border-bottom: 2px solid #CDFF00;
  transform: rotate(-45deg);
}

#custom-text .eo-promo__cta-wrap {
  flex: 0 0 auto;
  position: relative;
  z-index: 1;
  text-align: center;
}

#custom-text .eo-promo__cta {
  display: inline-block;
  padding: 15px 30px;
  background: #CDFF00;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.2;
  color: #241a17;
  text-decoration: none;
  white-space: nowrap;
  transition: transform .14s ease, box-shadow .14s ease;
}

#custom-text .eo-promo__cta:hover,
#custom-text .eo-promo__cta:focus {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(205, 255, 0, .3);
  color: #241a17;
}

#custom-text .eo-promo__note {
  margin: 10px 0 0;
  font-size: 12px;
  color: rgba(255, 255, 255, .55);
}

@media (max-width: 991px) {
  #custom-text .eo-promo {
    flex-direction: column;
    align-items: flex-start;
    gap: 22px;
    padding: 26px 24px;
  }

  #custom-text .eo-promo__title {
    font-size: 24px;
  }

  #custom-text .eo-promo__cta-wrap {
    width: 100%;
  }

  #custom-text .eo-promo__cta {
    display: block;
    text-align: center;
  }
}

/* ============================================================
   STOPKA CHECKOUTU - wlasna nota zamiast informacji o PrestaShop
   ============================================================ */
.checkout-footer {
  padding: 20px 0 28px;
}

.checkout-footer-links {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.9;
}

.checkout-footer-links a {
  color: #241a17;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .15s ease, border-color .15s ease;
}

.checkout-footer-links a:hover,
.checkout-footer-links a:focus {
  color: #2e7d32;
  border-bottom-color: #2e7d32;
}

.checkout-footer-sep {
  display: inline-block;
  margin: 0 10px;
  color: #d5d5d5;
}

.checkout-footer-copy {
  margin: 0;
  font-size: 12.5px;
  color: #8a8a8a;
}

.checkout-footer-copy a {
  color: #8a8a8a;
  text-decoration: underline;
}

.checkout-footer-copy a:hover {
  color: #2e7d32;
}

/* --- pole komentarza do zamowienia --- */
.delivery-options-list .order-options {
  margin-top: 18px;
}

.delivery-options-list .order-options label {
  font-size: 14px;
  color: #6f6f6f;
}

.delivery-options-list .order-options textarea {
  border-radius: 12px;
  border: 2px solid #e8e8e8;
  padding: 12px 14px;
}

.delivery-options-list .order-options textarea:focus {
  border-color: #5cb82e;
  outline: none;
}

/* --- telefony --- */
@media (max-width: 767px) {
  .delivery-options-list .delivery-option > label {
    min-height: 0;
    padding: 13px 16px 13px 8px;
  }

  .delivery-options-list .delivery-option > label > .row {
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
  }

  .delivery-options-list .delivery-option > label > .row > .col-sm-5,
  .delivery-options-list .delivery-option > label > .row > .col-sm-4,
  .delivery-options-list .delivery-option > label > .row > .col-sm-3 {
    flex: 1 1 100%;
    max-width: 100%;
    margin-left: 0;
    text-align: left;
  }

  .delivery-options-list .carrier-price {
    margin-top: 2px;
    text-align: left;
  }

  .delivery-options-list .apaczka-additional-div {
    justify-content: flex-start;
  }

  .delivery-options-list .apaczka-additional-div .apaczka-open-map {
    width: 100%;
    text-align: center;
  }
}

/* === NAGLOWEK KATEGORII NARZEDZIA (27) - zdjecie w tle === */
.category-id-27 .block-category{ position:relative; background:url(/img/eo-cat-narzedzia.jpg) center 42%/cover no-repeat; min-height:230px; overflow:hidden; }
.category-id-27 .block-category::before{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(36,26,23,.82) 0%, rgba(36,26,23,.45) 48%, rgba(36,26,23,.10) 100%); }
.category-id-27 .block-category h1, .category-id-27 .block-category .h1{ position:relative; z-index:1; color:#fff; }
.category-id-27 .block-category .block-category-inner{ position:relative; z-index:1; color:#fff; }
.category-id-27 .block-category img{ display:none; }

/* === KAFELKI PODKATEGORII - pelna ikona bez przycinania === */
.subcategory-image{ height:190px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.subcategory-image a.img, .subcategory-image a{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.subcategory-image img{ max-width:78%; max-height:88%; width:auto !important; height:auto !important; object-fit:contain; }

/* ===== NAPIS POD ZNAKIEM SLOWNYM (2026-08-11) ===== */
.eo-tagline{ display:block; text-align:center; font-size:12px; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:#241a17; opacity:.75;
  margin-top:2px; white-space:nowrap; }
@media(max-width:991px){ .eo-tagline{ display:none; } } /* na telefonie napis wchodzil w pasek obok logo */

/* ===== 2026-08-18: gwiazdka przy polach wymaganych ===== */
/* PrestaShop dokleja klase .required do etykiety pola obowiazkowego,
   ale motyw classic nie rysuje zadnego oznaczenia. Dodajemy gwiazdke. */
.form-control-label.required::after,
label.required::after,
.form-group.required > label::after {
    content: " *";
    color: #c62828;
    font-weight: 700;
}
/* Checkboxy (regulamin, zgody) maja etykiete w innym miejscu - tam gwiazdka
   po tekscie wygladalaby dziwnie, wiec ja pomijamy. */
.custom-checkbox label.required::after,
.checkbox label.required::after {
    content: "";
}
/* Legenda pod formularzem */
.form-required-note {
    color: #6b7280;
    font-size: .875rem;
    margin: .5rem 0 1rem;
}
