/* Koszyk, zamowienie i podziekowanie w palecie salonu.
   Plik generowany przez _generator/build_wp.py, recznie nie edytujemy.
   Tokeny te same co w assets/styles.css, zeby sklep nie odjechal od reszty strony. */

.sklep-wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 64px 24px 96px;
}
.sklep-naglowek { margin-bottom: 40px; }
.sklep-naglowek .sklep-eyebrow {
  display: block;
  font-size: .78rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--indigo);
  margin-bottom: 12px;
  font-weight: 700;
}
.sklep-naglowek h1 {
  font-size: clamp(1.9rem, 3.4vw, 2.8rem);
  line-height: 1.1;
  margin: 0;
  color: var(--ink);
}
.sklep-naglowek p { color: #555; margin: 12px 0 0; max-width: 60ch; }
/* podziekowanie niesie wlasny naglowek, wiec kontener nie dokłada gornego oddechu drugi raz */
.sklep-wrap-czysty { padding-top: 40px; }

.woocommerce table.shop_table {
  border: 1px solid var(--grey);
  border-radius: 14px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  background: #fff;
}
.woocommerce table.shop_table th {
  background: var(--lav);
  color: var(--ink);
  font-size: .8rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 16px;
}
.woocommerce table.shop_table td { padding: 20px 16px; border-top: 1px solid var(--grey); }
.woocommerce table.shop_table img { width: 72px; border-radius: 10px; }

/* dane vouchera przy pozycji, to one niosa cala tresc prezentu */
.woocommerce .variation,
.woocommerce dl.variation {
  margin: 10px 0 0;
  padding: 12px 14px;
  background: var(--lav);
  border-radius: 10px;
  font-size: .86rem;
  line-height: 1.5;
}
.woocommerce dl.variation dt { font-weight: 700; color: var(--indigo); }
.woocommerce dl.variation dd { margin: 0 0 6px; color: #333; }
.woocommerce dl.variation dd p { margin: 0; }

.woocommerce .cart_totals h2,
.woocommerce-checkout h3 {
  font-size: 1.15rem;
  letter-spacing: .02em;
  color: var(--ink);
}
.woocommerce .cart_totals table { background: #fff; }
.woocommerce .order-total .amount { color: var(--indigo); font-size: 1.25rem; }

.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
.woocommerce #place_order {
  background: var(--indigo);
  color: #fff;
  border-radius: 999px;
  padding: 15px 30px;
  font-weight: 700;
  letter-spacing: .02em;
  border: 0;
  transition: background .2s ease, transform .2s ease;
}
.woocommerce .button:hover,
.woocommerce #place_order:hover { background: var(--indigo-hover); transform: translateY(-1px); }
/* Woo ma wlasny kolor na przyciskach alt, wiec podbijamy specyficznosc zamiast walczyc !important */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce .wc-proceed-to-checkout a.checkout-button {
  background: var(--indigo);
  color: #fff;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover { background: var(--indigo-hover); }
.woocommerce .checkout-button { display: block; text-align: center; }
.woocommerce a.button.alt.wc-forward { width: 100%; }

/* WYBOR WYSYLKI W PODSUMOWANIU ZAMOWIENIA.
   Domyslnie Woo wsadza etykiete "Wysylka" w lewa komorke, a liste metod w prawa.
   W kolumnie podsumowania (okolo 450 px) zostaje na liste jakies 210 px, wiec
   przy siedmiu metodach kazda nazwa lamala sie na dwie, trzy linie razem z cena
   i wiersz rozciagal sie na pol ekranu. Rozbijamy ten wiersz na blok: etykieta
   nad lista, lista na calej szerokosci tabeli. */
/* PODSUMOWANIE ZAMOWIENIA NIE JEST TABELA, tylko lista pozycji, i tak je uklada my.
   Proba zostawienia modelu tabeli i przelaczenia samego wiersza wysylki na blok
   nie dziala: przegladarka trzyma taki wiersz w tabeli i dalej liczy mu szerokosc
   kolumny, wiec lista siedmiu metod dostawala 192 px z 291 dostepnych i kazda
   nazwa lamala sie na dwie linie. Dopiero zdjecie `display: table` z calej tabeli
   uwalnia szerokosc. Wiersze ukladamy flexem: etykieta z lewej, kwota z prawej. */
.woocommerce-checkout #order_review table.shop_table,
.woocommerce-checkout #order_review table.shop_table thead,
.woocommerce-checkout #order_review table.shop_table tbody,
.woocommerce-checkout #order_review table.shop_table tfoot { display: block; width: 100%; }
.woocommerce-checkout #order_review table.shop_table thead tr,
.woocommerce-checkout #order_review table.shop_table tbody tr {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 0 16px;
}
.woocommerce-checkout #order_review table.shop_table tbody tr { border-top: 1px solid var(--grey); }
.woocommerce-checkout #order_review table.shop_table thead tr > th,
.woocommerce-checkout #order_review table.shop_table tbody tr > td {
  display: block;
  border-top: 0;
  padding-left: 0;
  padding-right: 0;
}
.woocommerce-checkout #order_review table.shop_table thead tr { background: var(--lav); }
.woocommerce-checkout #order_review table.shop_table thead tr > th { background: none; }
.woocommerce-checkout #order_review table.shop_table tbody tr > td.product-name { flex: 1 1 auto; }
.woocommerce-checkout #order_review table.shop_table tbody tr > td.product-total { flex: 0 0 auto; white-space: nowrap; }
.woocommerce-checkout #order_review table.shop_table tfoot tr {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 0 16px;
  border-top: 1px solid var(--grey);
}
.woocommerce-checkout #order_review table.shop_table tfoot tr > th,
.woocommerce-checkout #order_review table.shop_table tfoot tr > td {
  display: block;
  border-top: 0;
  background: none;
  text-align: right;
}
.woocommerce-checkout #order_review table.shop_table tfoot tr > th { text-align: left; }
.woocommerce-checkout #order_review table.shop_table tfoot tr.woocommerce-shipping-totals {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}
.woocommerce-checkout #order_review table.shop_table tfoot tr.woocommerce-shipping-totals > th {
  padding-bottom: 0;
}
.woocommerce-checkout #order_review table.shop_table tfoot tr.woocommerce-shipping-totals > td {
  text-align: left;
  padding-top: 8px;
}
.woocommerce ul#shipping_method {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 2px;
}
.woocommerce ul#shipping_method li {
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
/* Radio wyrownane do tekstu, nie do gornej krawedzi wielolinijkowej etykiety. */
.woocommerce ul#shipping_method li input.shipping_method {
  margin: 0;
  flex: 0 0 auto;
  accent-color: var(--ink);
}
.woocommerce ul#shipping_method li label {
  margin: 0;
  padding: 8px 0;
  font-weight: 500;
  cursor: pointer;
  flex: 1 1 auto;
  display: flex;
  align-items: baseline;
  gap: 10px;
}
/* Nazwa bierze reszte wiersza, cena stoi przy prawej krawedzi. Bez tego
   najdluzsza pozycja ("Kurier InPost, za pobraniem") spychala cene do drugiej linii. */
.woocommerce ul#shipping_method li label .ikh-metoda-nazwa { flex: 1 1 auto; }
.woocommerce ul#shipping_method li label .ikh-metoda-cena {
  flex: 0 0 auto;
  font-weight: 600;
  white-space: nowrap;
}
/* Logo przewoznika wtyczka dokleja jako rodzenstwo etykiety, tylko przy paczkomacie.
   Znika z dwoch powodow. Po pierwsze rozpychalo swoj wiersz i wypychalo cene w lewo,
   wiec kolumna kwot przestawala byc rowna i nie dalo sie porownac stawek wzrokiem
   w pionie. Po drugie jedno kolorowe logo w srodku czarno-bialej listy ciagnie wzrok
   na metode, ktora nie jest ani najtansza, ani domyslna. Nazwa niesie te sama
   informacje, wiec nic nie tracimy. */
.woocommerce ul#shipping_method li > img,
.woocommerce ul#shipping_method li > span:not([class*="ikh-"]) img { display: none; }

/* Na telefonie tabela ma okolo 305 px i logo przewoznika zabiera te kilkanascie
   pikseli, przez ktore nazwa metody lamie sie na druga linie. Nazwa niesie tresc,
   logo nie, wiec to logo wypada. */
@media (max-width: 600px) {
  /* Zmierzone na 375 px: nazwa dostaje 131 px, a "Paczkomat InPost" potrzebuje 145.
     Brakuje kilkunastu pikseli, wiec schodzimy z 16 na 14,4 px i wszystkie siedem
     metod miesci sie w jednej linii. */
  .woocommerce ul#shipping_method li label { gap: 8px; font-size: .9rem; }
  .woocommerce ul#shipping_method li label .ikh-metoda-cena { font-size: .9rem; }
}

/* Widget wyboru paczkomatu siedzi w osobnym wierszu tabeli i jest w markowym
   zoltym InPostu. Sprowadzamy go do szerokosci tresci, zeby nie krzyczal. */
.woocommerce-checkout table.shop_table tr.easypack-parcel-machine > td { text-align: left; }
.woocommerce-checkout .easypack-widget-button,
.woocommerce-checkout tr.easypack-parcel-machine button { max-width: 260px; }

/* kolumny koszyka: usuwanie i miniatura maja byc waskie, tresc dostaje reszte */
.woocommerce table.shop_table td.product-remove { width: 56px; text-align: center; }
.woocommerce table.shop_table td.product-thumbnail,
.woocommerce table.shop_table th.product-thumbnail { width: 96px; }
.woocommerce table.shop_table td.product-name { width: auto; }
.woocommerce table.shop_table .quantity input.qty {
  width: 64px;
  padding: 8px;
  border: 1px solid var(--grey);
  border-radius: 8px;
}

/* Pola formularzy i przyciski brały czcionkę systemową, przez co koszyk i zamówienie
   czytały się jak inna strona niż reszta serwisu. Wszystko dziedziczy Montserrat. */
.woocommerce input,
.woocommerce select,
.woocommerce textarea,
.woocommerce button,
.woocommerce .button,
.woocommerce table,
.woocommerce label,
.select2-container,
.select2-container .select2-selection__rendered,
.select2-container .select2-results,
.woocommerce-checkout #payment label,
.woocommerce-checkout #payment .payment_box {
  font-family: 'Montserrat', system-ui, sans-serif;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
  border: 1px solid var(--grey);
  border-radius: 10px;
  padding: 13px 14px;
  font-size: .95rem;
  background: #fff;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus { outline: 2px solid var(--indigo); outline-offset: 1px; }
.woocommerce form .form-row label { font-weight: 600; font-size: .88rem; color: #333; }

.woocommerce #payment,
.woocommerce-checkout-review-order {
  background: var(--lav);
  border-radius: 14px;
  padding: 8px 20px 20px;
}
.woocommerce #payment ul.payment_methods { border-bottom: 1px solid var(--grey); }
.woocommerce #payment div.form-row { padding: 18px 0 0; }

/* Koszyk na dwie kolumny: pozycje po lewej, podsumowanie po prawej i jedzie za scrollem.
   Domyslny uklad Woo wrzuca podsumowanie pod tabele, przez co strona wyglada na urwana. */
@media (min-width: 981px) {
  .woocommerce-cart .woocommerce {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, .9fr);
    gap: 32px;
    align-items: start;
  }
  .woocommerce-cart .woocommerce-cart-form { grid-column: 1; margin: 0; }
  .woocommerce-cart .cart-collaterals { grid-column: 2; width: 100%; margin: 0; float: none; }
  .woocommerce-cart .cart-collaterals .cart_totals {
    width: 100%;
    float: none;
    position: sticky;
    top: 24px;
  }
  /* tabela pozycji ma oddychac: nazwa produktu dostaje reszte szerokosci */
  .woocommerce-cart table.shop_table { table-layout: fixed; width: 100%; }
  .woocommerce-cart table.shop_table td.product-name { width: auto; word-break: normal; }
  .woocommerce-cart table.shop_table td.product-price,
  .woocommerce-cart table.shop_table th.product-price { width: 110px; }
  .woocommerce-cart table.shop_table td.product-quantity,
  .woocommerce-cart table.shop_table th.product-quantity { width: 96px; }
  .woocommerce-cart table.shop_table td.product-subtotal,
  .woocommerce-cart table.shop_table th.product-subtotal { width: 110px; }
  .woocommerce-cart .woocommerce-notices-wrapper { grid-column: 1 / -1; }
}
.woocommerce-cart .cart-collaterals .cross-sells { display: none; }
.woocommerce-cart .cart_totals > h2 { margin-top: 0; }

/* naglowek kolumny usuwania jest pusty, wiec nie zajmuje szerokosci */
.woocommerce table.shop_table th.product-remove { width: 56px; padding: 0; }
.woocommerce table.shop_table td.product-remove a.remove {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: var(--lav);
  color: var(--indigo) !important;
  font-size: 16px;
  line-height: 1;
  text-decoration: none;
}
.woocommerce table.shop_table td.product-remove a.remove:hover { background: var(--indigo); color: #fff !important; }

/* wiersz z kuponem i aktualizacja koszyka */
.woocommerce .actions .coupon { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.woocommerce .actions .coupon input#coupon_code {
  border: 1px solid var(--grey);
  border-radius: 999px;
  padding: 13px 18px;
  min-width: 190px;
}
.woocommerce .actions .button { white-space: nowrap; }
.woocommerce .actions .button[name="update_cart"] {
  background: #fff;
  color: var(--indigo);
  border: 1px solid var(--grey);
}
.woocommerce .actions .button[name="update_cart"]:disabled { opacity: .45; }
.woocommerce .actions .button[name="update_cart"]:hover:not(:disabled) { border-color: var(--indigo); background: var(--lav); }

/* ---------------------------------------------------------- zamowienie
   Domyslny checkout Woo jest jedna kolumna z podsumowaniem na dole. Skladamy go
   na dwie kolumny: dane po lewej, podsumowanie po prawej i jedzie za scrollem. */
@media (min-width: 981px) {
  .woocommerce-checkout form.checkout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .95fr);
    column-gap: 36px;
    align-items: start;
  }
  .woocommerce-checkout form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 3; }
  .woocommerce-checkout form.checkout #order_review_heading { grid-column: 2; grid-row: 1; margin-top: 0; }
  .woocommerce-checkout form.checkout #order_review { grid-column: 2; grid-row: 2; position: sticky; top: 24px; }
  /* w wezszej kolumnie dane rozliczeniowe i uwagi ida jedne pod drugimi */
  .woocommerce-checkout .col2-set .col-1,
  .woocommerce-checkout .col2-set .col-2 { float: none; width: 100%; }
  .woocommerce-checkout .col2-set .col-2 { margin-top: 28px; }
}

.woocommerce-checkout form.checkout h3 {
  font-size: 1.15rem;
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--grey);
  color: var(--ink);
}
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review {
  background: #fff;
  border: 1px solid var(--grey);
  border-radius: 14px;
  padding: 28px;
}
.woocommerce-checkout #order_review_heading {
  font-size: 1.15rem;
  margin: 0 0 14px;
  color: var(--ink);
}
.woocommerce-checkout #order_review table.shop_table { border: 0; border-radius: 0; }
.woocommerce-checkout #order_review table.shop_table th { background: transparent; padding: 12px 0; }
.woocommerce-checkout #order_review table.shop_table td { padding: 14px 0; }
.woocommerce-checkout #order_review .order-total td { font-size: 1.15rem; }

/* platnosci jako karta, nie szara plama */
.woocommerce-checkout #payment {
  background: var(--lav);
  border-radius: 12px;
  padding: 6px 20px 20px;
  margin-top: 20px;
}
.woocommerce-checkout #payment ul.payment_methods { padding: 14px 0; border-bottom: 1px solid var(--grey); }
.woocommerce-checkout #payment ul.payment_methods li { margin-bottom: 8px; }
.woocommerce-checkout #payment div.payment_box {
  background: #fff;
  border-radius: 10px;
  color: #444;
  font-size: .88rem;
  line-height: 1.6;
}
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: #fff; }
.woocommerce-checkout #place_order { width: 100%; margin-top: 8px; font-size: 1rem; }
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { font-size: .88rem; line-height: 1.6; }
.woocommerce-checkout .woocommerce-privacy-policy-text p { font-size: .84rem; color: #666; }

/* pasek kuponu: zamiast niebieskiej belki Woo, spokojna linia w palecie */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce .woocommerce-info {
  background: var(--lav);
  border-top: 0;
  border-left: 4px solid var(--indigo);
  border-radius: 10px;
  color: var(--ink);
  padding: 14px 18px;
}
.woocommerce .woocommerce-info::before { display: none; }
.woocommerce .woocommerce-info a { color: var(--indigo); font-weight: 700; }

/* powrot do koszyka na stronie zamowienia */
.sklep-powrot {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 28px;
  padding: 12px 20px;
  border: 1px solid var(--grey);
  border-radius: 999px;
  color: var(--indigo);
  font-weight: 700;
  font-size: .92rem;
  text-decoration: none;
  background: #fff;
  transition: border-color .2s ease, background .2s ease;
}
.sklep-powrot:hover { border-color: var(--indigo); background: var(--lav); }
.sklep-powrot svg { width: 18px; height: 18px; }
.sklep-powrot span { font-weight: 400; color: #777; font-size: .84rem; }

@media (max-width: 640px) {
  .sklep-powrot span { display: none; }
}

/* podziekowanie */
.podz-hero {
  background: var(--indigo);
  color: #fff;
  border-radius: 18px;
  padding: 48px 40px;
  margin-bottom: 40px;
}
.podz-hero .podz-ptak {
  width: 54px; height: 54px;
  display: grid; place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  margin-bottom: 20px;
}
.podz-hero .podz-ptak svg { width: 28px; height: 28px; stroke: #fff; }
.podz-hero h1 { font-size: clamp(1.8rem, 3.2vw, 2.6rem); margin: 0 0 12px; line-height: 1.12; }
.podz-hero p { margin: 0; opacity: .82; max-width: 58ch; line-height: 1.6; }
.podz-nr {
  display: inline-block;
  margin-top: 22px;
  padding: 9px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  font-size: .88rem;
  letter-spacing: .04em;
}
.podz-kroki { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-bottom: 44px; }
.podz-krok {
  border: 1px solid var(--grey);
  border-radius: 14px;
  padding: 24px;
  background: #fff;
}
.podz-krok b { display: block; color: var(--indigo); margin-bottom: 8px; font-size: 1rem; }
.podz-krok span { color: #555; font-size: .92rem; line-height: 1.6; }
.podz-siatka { display: grid; gap: 32px; grid-template-columns: 1.4fr 1fr; align-items: start; }
.podz-karta { border: 1px solid var(--grey); border-radius: 14px; padding: 28px; background: #fff; }
.podz-karta h2 { font-size: 1.1rem; margin: 0 0 18px; color: var(--ink); }
.podz-karta table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.podz-karta td, .podz-karta th { padding: 10px 0; border-bottom: 1px solid var(--grey); text-align: left; }
.podz-karta tfoot td { border-bottom: 0; font-weight: 700; color: var(--indigo); }
.podz-kontakt { background: var(--lav); border-radius: 14px; padding: 28px; }
.podz-kontakt a { color: var(--indigo); font-weight: 600; }

@media (max-width: 900px) {
  .sklep-wrap { padding: 40px 18px 72px; }
  .podz-siatka { grid-template-columns: 1fr; }
  .podz-hero { padding: 32px 24px; }
}

/* zgody w kasie 02.11.2026 */
.woocommerce form.checkout .woocommerce-terms-and-conditions-wrapper .form-row label,.woocommerce form.checkout .ikh-zgody-mkt .form-row label,.woocommerce form.checkout .ikh-reg-wiersz label{font-weight:400;font-size:14px;line-height:1.5}
.woocommerce form.checkout .woocommerce-terms-and-conditions-wrapper a,.woocommerce form.checkout .ikh-zgody-mkt a,.woocommerce form.checkout .ikh-reg-wiersz a,.woocommerce form.checkout .woocommerce-privacy-policy-text a{color:#200066;text-decoration:underline;text-underline-offset:2px}
.woocommerce form.checkout .woocommerce-terms-and-conditions-wrapper .required{color:#b00020}