/* =====================================================================
   ALOE LOLA — redesign sklepu (nakładka na Flatsome / WooCommerce)
   Ładowane TYLKO na /sklep/ i archiwach kategorii. Nie zmienia funkcji:
   koszyk, sortowanie, paginacja, produkty pozostają realne (WooCommerce).
   Styl spójny z makietą sklepu (Playfair + Poppins, czerń/biel/złoto).
   ===================================================================== */
:root{
  --al-ink:#0E0E0E; --al-tile:#F4F2EC; --al-line:#e9e5da; --al-muted:#8f8b81;
  --al-gold:#AD974F; --al-gold-dk:#8E793E;
  --al-serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --al-sans:"Poppins",-apple-system,"Segoe UI",sans-serif;
}

/* ---------- PEŁNA SZEROKOŚĆ: zdejmij lewy sidebar sklepu ---------- */
.row:has(> .col.large-9 > .shop-container) > .col.large-3{ display:none !important; }
.col.large-9:has(> .shop-container){ flex-basis:100% !important; max-width:100% !important; width:100% !important; }
.category-filtering.category-filter-row{ display:none !important; }   /* toggle „Filtruj" off-canvas */

/* ---------- SZEROKOŚĆ SKLEPU = MAKIETA (treść 1216px, kafle ~383px) ---------- */
/* Motyw capuje stronę na 1080px (kafel 327px); makieta ma 1216px treści (kafel 383px). */
/* TYLKO DESKTOP (≥1001px, siatka 3-kol). Mobile ≤1000px (2-kol) = domyślny motyw, NIE ruszany. */
/* Checkout/koszyk/produkt/strona główna = inne klasy body → NIETKNIĘTE. */
@media(min-width:1001px){
  body.post-type-archive-product .container,
  body.tax-product_cat .container,
  body.tax-product_tag .container{ max-width:1216px !important; }
  body.post-type-archive-product .category-page-row,
  body.tax-product_cat .category-page-row,
  body.tax-product_tag .category-page-row{ max-width:1216px !important; }
  body.post-type-archive-product .category-page-row > .col.large-9,
  body.tax-product_cat .category-page-row > .col.large-9,
  body.tax-product_tag .category-page-row > .col.large-9{ padding-left:0 !important; padding-right:0 !important; }
}

/* ---------- NAGŁÓWEK SKLEPU: jak makieta ---------- */
.shop-page-title{ display:none !important; }   /* własny nagłówek renderuje hook */
.al-shophead{ margin:clamp(30px,4vw,56px) 0 clamp(22px,3vw,38px); }
.al-sh-top{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px 30px; flex-wrap:wrap; }
.al-sh-title h1{ font-family:var(--al-serif); font-weight:500; font-size:clamp(30px,4.4vw,50px); line-height:1; letter-spacing:.005em; color:var(--al-ink); margin:0; text-transform:none; }
.al-sh-title .al-sub{ font-family:var(--al-sans); font-size:13px; color:var(--al-muted); margin:12px 0 0; max-width:420px; }
.al-sh-tools{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.al-search{ position:relative; display:flex; align-items:center; }
.al-search form{ margin:0 !important; display:flex; width:100%; }   /* bez marginesu = na równo z sortem */
.al-search svg{ display:none; }   /* lupka jako tło inputa (zawsze wypionowana) */
.al-search input{ border:1px solid var(--al-line); background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%238f8b81' stroke-width='1.9'><circle cx='11' cy='11' r='7'/><path d='M21 21l-4-4'/></svg>") no-repeat 15px center; padding:12px 16px 12px 42px !important; font-family:var(--al-sans); font-size:13px; color:var(--al-ink); min-width:262px; border-radius:0; box-sizing:border-box; }
.al-search input::placeholder{ color:var(--al-muted); }
.al-search input:focus{ outline:none; border-color:var(--al-gold); }
.al-search input::-webkit-search-cancel-button{ display:none; }
.al-sort{ display:flex; align-items:center; }
.al-sort .woocommerce-ordering{ margin:0 !important; padding:0 !important; line-height:0; }
.al-sort .woocommerce-ordering::before, .al-sort .woocommerce-ordering::after{ content:none !important; display:none !important; }
.al-sort select.orderby{ appearance:none; -webkit-appearance:none; height:auto !important; line-height:1.3; background:var(--al-ink); color:#fff; border:1px solid var(--al-ink); border-radius:0; padding:13px 42px 13px 18px; font-family:var(--al-sans); font-size:12px; letter-spacing:.08em; text-transform:uppercase; cursor:pointer; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>"); background-repeat:no-repeat; background-position:right 16px center; }
.al-sort select.orderby option{ background:#fff; color:#222; text-transform:none; }
/* wyszukiwarka i sort tej samej wysokości (na równo, jak makieta) */
.al-search input, .al-sort select.orderby{ height:46px !important; box-sizing:border-box !important; margin:0 !important; }
/* dropdown podpowiedzi pod polem wyszukiwania */
.al-sdrop{ position:absolute; top:calc(100% + 8px); left:0; right:0; background:#fff; border:1px solid var(--al-line); box-shadow:0 22px 44px -24px rgba(0,0,0,.32); padding:6px; z-index:80; max-height:min(70vh,440px); overflow-y:auto; opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .22s ease,transform .22s ease,visibility .22s; }
.al-search.open .al-sdrop{ opacity:1; visibility:visible; transform:none; }
.al-sdrop .sd-head{ font:600 9.5px/1 var(--al-sans); letter-spacing:.2em; text-transform:uppercase; color:var(--al-gold-dk); padding:8px 8px 10px; }
.al-sdrop .sd-item{ display:flex; align-items:center; gap:11px; padding:7px 8px; text-decoration:none; transition:background .2s; }
.al-sdrop .sd-item:hover{ background:var(--al-tile); }
.al-sdrop .sd-item img, .al-sdrop .sd-noimg{ width:38px; height:38px; object-fit:cover; background:var(--al-tile); flex:none; }
.al-sdrop .sd-n{ flex:1; font-family:var(--al-sans); font-size:12.5px; line-height:1.3; color:var(--al-ink); }
.al-sdrop .sd-p{ font-family:var(--al-sans); font-size:12.5px; color:var(--al-muted); white-space:nowrap; }
.al-sdrop .sd-empty{ padding:14px 10px; font-family:var(--al-sans); font-size:13px; color:var(--al-muted); }
.al-catrow{ display:flex; align-items:baseline; justify-content:space-between; gap:14px 44px; flex-wrap:wrap; margin-top:clamp(26px,3.4vw,44px); padding:clamp(16px,2vw,24px) 0; border-top:1px solid var(--al-line); border-bottom:1px solid var(--al-line); }
.al-catlabel{ font-family:var(--al-serif); font-weight:500; font-size:clamp(19px,2.3vw,28px); line-height:1; color:var(--al-ink); }
.al-catbar{ display:flex; flex-wrap:wrap; align-items:baseline; gap:2px .12em; }
.al-catbar .al-cat{ font-family:var(--al-serif); font-weight:400; font-size:clamp(17px,1.9vw,23px); line-height:1.3; color:var(--al-muted); text-decoration:none; transition:color .25s ease; }
.al-catbar .al-cat:not(:last-child)::after{ content:","; color:var(--al-muted); margin-right:.32em; }
.al-catbar .al-cat:hover{ color:var(--al-ink); }
.al-catbar .al-cat.on{ color:var(--al-ink); font-weight:400; }   /* aktywna czarna, BEZ pogrubienia */
@media(max-width:850px){
  .al-sh-tools{ width:100%; flex-direction:column; align-items:stretch; gap:12px; }
  .al-search input{ width:100%; min-width:0; }
  .al-sort select.orderby{ width:100%; }
  .al-catlabel{ display:none; }   /* na tel bez „Wybierz ulubione" */
  .al-catrow{ justify-content:flex-start; }
}

/* ---------- KARTA PRODUKTU ---------- */
/* siatka jak makieta: 3 kolumny (2 na mobile ≤1000px), równe odstępy */
.products.row.row-small{ display:grid !important; grid-template-columns:repeat(3,1fr); gap:clamp(34px,3.4vw,58px) clamp(20px,2.4vw,34px); margin:0 !important; max-width:none !important; width:100% !important; }
.products.row.row-small > .product-small.col{ width:auto !important; max-width:none !important; flex:none !important; padding:0 !important; margin:0 !important; }
@media(max-width:1000px){
  .products.row.row-small{ grid-template-columns:repeat(2,1fr); gap:clamp(26px,5vw,40px) 14px; }
}
.product-small.box{ background:transparent; box-shadow:none; }
.product-small .box-image{ background:var(--al-tile); border-radius:0; overflow:hidden; }
.product-small .box-image img{ width:100%; height:100%; object-fit:cover; aspect-ratio:1/1; border-radius:0; }

.product-small .box-text{ padding:16px 2px 0 !important; text-align:left !important; }
.product-small .box-text .category, .product-small .box-text .show-on-hover .category{ display:none; } /* bez kategorii nad tytułem */
.product-small .box-text .product-title{ margin:0; text-transform:none; }
.product-small .box-text .product-title a{
  font-family:var(--al-sans); font-weight:500; font-size:15px; line-height:1.35;
  letter-spacing:0; text-transform:none; color:var(--al-ink);
}
.product-small .price-wrapper{ margin-top:6px; }
.product-small .price, .product-small .price ins{ font-family:var(--al-sans); font-weight:500; font-size:15px; color:var(--al-ink); }
.product-small .price del{ color:var(--al-muted); font-weight:400; }
.product-small .star-rating{ margin:8px 0 0; }

/* przycisk „Dodaj do koszyka" / „Wybierz opcje" -> czarny, pełna szerokość, zawsze widoczny */
.product-small .box-text .button,
.product-small .box-text a.button.add_to_cart_button,
.product-small .box-text a.button.product_type_variable,
.product-small .box-text a.button.product_type_simple{
  display:block !important; width:100%; margin:14px 0 0; float:none; opacity:1 !important;
  background:var(--al-ink); color:#fff; border:0; border-radius:0; box-shadow:none;
  padding:15px 14px; font-family:var(--al-sans); font-weight:500; font-size:11px;
  letter-spacing:.16em; line-height:1; text-transform:uppercase; transition:background .35s ease;
}
.product-small .box-text .button,
.product-small .box-text .button span{ color:#fff !important; }
.product-small .box-text .button:hover{ background:var(--al-gold-dk); color:#fff !important; }
.product-small .box-text .added_to_cart{ display:none; } /* ukryj „Zobacz koszyk" link pod przyciskiem */

/* badge (Bestseller/Promocja) -> lewy górny róg zdjęcia */
.product-small .col-inner > .badge-container.absolute{ top:10px !important; left:10px !important; right:auto !important; bottom:auto !important; }
.product-small .col-inner > .badge-container.absolute .badge{ float:left; }

/* ---------- NAGŁÓWEK SKLEPU ---------- */
.shop-page-title h1.page-title, .shop-page-title .page-title-inner h1{
  font-family:var(--al-serif) !important; font-weight:500; letter-spacing:.01em; text-transform:none;
}

/* ---------- PASEK NARZĘDZI (sort) ---------- */
.woocommerce-ordering select.orderby{ font-family:var(--al-sans); border-radius:0; }
.woocommerce-result-count{ font-family:var(--al-sans); color:var(--al-muted); }

/* ---------- NAGŁÓWEK SKLEPU: czysto (bez złotego pasa) ---------- */
.shop-page-title.featured-title{ background-color:#fff !important; }
.shop-page-title.featured-title .title-overlay,
.shop-page-title.featured-title .overlay{ background:transparent !important; opacity:1 !important; }
.shop-page-title.featured-title .page-title-inner{ color:var(--al-ink); }
.shop-page-title.featured-title h1,
.shop-page-title.featured-title h1.page-title{ color:var(--al-ink) !important; }
.shop-page-title.featured-title .breadcrumbs,
.shop-page-title.featured-title .breadcrumbs *{ color:var(--al-muted) !important; }

/* ---------- czystsze karty: bez serduszka wishlist ---------- */
.product-small .wishlist-button,
.product-small a.wishlist-button,
.product-small .yith-wcwl-add-to-wishlist{ display:none !important; }

/* ---------- PAGINACJA ---------- */
.woocommerce-pagination .page-numbers{ border-radius:0 !important; }
.woocommerce-pagination .page-numbers.current, .woocommerce-pagination a.page-numbers:hover{
  background:var(--al-ink) !important; border-color:var(--al-ink) !important; color:#fff !important;
}
