/*
 * Style WooCommerce na tokenach Phoenix – ładowane tylko przy aktywnym Woo (Shop\Integration).
 * Branding wyłącznie przez --phx-* / --wp--preset--* / --wp--custom--*.
 *
 * Arkusz ładuje się po arkuszach Woo (woocommerce-general, bloki Woo), więc przy tej samej specyficzności wygrywa
 * kolejnością; selektory powtarzają strukturę selektorów Woo tylko tam, gdzie Woo ma wyższą specyficzność.
 * Kolory z kontekstu tła sekcji (--phx-*): wewnątrz sekcji phx-* (sklep, produkt, koszyk, zamówienie) i nagłówka
 * obowiązuje kontekst sekcji; poza sekcjami (np. „Moje konto” w szablonie page) – domyślny kontekst jasny niżej.
 */

/* ---------- Domyślny kontekst jasny poza sekcjami phx-* ---------- */
/* :where(body) – specyficzność 0, każda sekcja (.phx-section, .phx-ctx-*) nadpisuje zmienne dla swojego wnętrza.
   Celowo powtórzone (podzbiór kontekstu jasnego z components.css, tylko zmienne używane niżej): components.css ładuje
   się tylko z ACF, a strony Woo poza sekcjami („Moje konto” w szablonie page, szuflada mini-koszyka, bloki Woo w treści)
   muszą mieć kolory także bez niego. Dopisanie :where(body) do selektora kontekstu w components.css nie wystarczy
   (brak ACF) i zmieniłoby kolor tekstu wszystkich stron, nie tylko sklepu. */
:where(body) {
  --phx-bg: var(--wp--preset--color--base);
  --phx-fg: var(--wp--preset--color--contrast);
  --phx-fg-muted: var(--wp--preset--color--muted);
  --phx-link: var(--wp--preset--color--brand-text);
  --phx-border: var(--wp--preset--color--border);
  --phx-btn-primary-bg: var(--wp--custom--derived--button--primary--light--bg);
  --phx-btn-primary-bg-image: var(--wp--custom--derived--button--primary--light--bg-image);
  --phx-btn-primary-fg: var(--wp--custom--derived--button--primary--light--fg);
  --phx-btn-primary-border: var(--wp--custom--derived--button--primary--light--border);
  --phx-btn-primary-bg-hover: var(--wp--custom--derived--button--primary--light--bg-hover);
  --phx-btn-primary-fg-hover: var(--wp--custom--derived--button--primary--light--fg-hover);
  --phx-btn-primary-border-hover: var(--wp--custom--derived--button--primary--light--border-hover);
  --phx-btn-secondary-bg: var(--wp--custom--derived--button--secondary--light--bg);
  --phx-btn-secondary-bg-image: var(--wp--custom--derived--button--secondary--light--bg-image);
  --phx-btn-secondary-fg: var(--wp--custom--derived--button--secondary--light--fg);
  --phx-btn-secondary-border: var(--wp--custom--derived--button--secondary--light--border);
  --phx-btn-secondary-bg-hover: var(--wp--custom--derived--button--secondary--light--bg-hover);
  --phx-btn-secondary-fg-hover: var(--wp--custom--derived--button--secondary--light--fg-hover);
  --phx-btn-secondary-border-hover: var(--wp--custom--derived--button--secondary--light--border-hover);
  --phx-card-bg: var(--wp--custom--derived--card--light--bg);
  --phx-card-border: var(--wp--custom--derived--card--light--border);
  --phx-card-shadow: var(--wp--custom--derived--card--light--shadow);
  --phx-field-bg: var(--wp--custom--derived--field--light--bg);
  --phx-field-border: var(--wp--custom--derived--field--light--border);
  --phx-field-border-focus: var(--wp--custom--derived--field--light--border-focus);
  --phx-field-error: var(--wp--custom--derived--field--light--error);
}

/* ---------- Przyciski ---------- */
/* wspólna forma (jak .phx-button): typografia, promień, obramowanie */
.wc-block-components-button:not(.is-link),
.wp-block-button.wc-block-components-product-button .wc-block-components-product-button__button,
.wp-block-woocommerce-mini-cart-contents .wp-block-button__link.wp-element-button,
.woocommerce :is(a, button, input).button,
.woocommerce :is(a, button, input).button.alt {
  box-sizing: border-box;
  min-height: 3.0625rem;
  padding-block: var(--wp--preset--spacing--10);
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--s);
  font-weight: var(--wp--custom--type--button--weight);
  letter-spacing: var(--wp--custom--type--button--letter-spacing);
  text-transform: var(--wp--custom--type--button--transform);
  line-height: 1.2;
  border: 2px solid transparent;
  border-radius: var(--wp--custom--derived--radius--button);
  background-origin: border-box; /* gradient bez pasków pod borderem – jak .phx-button */
  box-shadow: none;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  cursor: pointer;
}

/* główny: koszyk, płatność, dodanie do koszyka na stronie produktu, logowanie/rejestracja, przejście do kasy w mini-koszyku */
.wc-block-components-button:not(.is-link),
.wc-block-components-button:not(.is-link).wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-button.wc-block-components-button:not(.is-link),
.wc-block-mini-cart__footer-checkout.wc-block-components-button:not(.is-link),
.woocommerce :is(a, button, input).button,
.woocommerce :is(a, button, input).button.alt,
.woocommerce div.product form.cart button.single_add_to_cart_button,
.wp-block-woocommerce-add-to-cart-form .single_add_to_cart_button.button {
  padding-inline: var(--wp--custom--derived--button--primary--padding-inline);
  background-color: var(--phx-btn-primary-bg);
  background-image: var(--phx-btn-primary-bg-image);
  color: var(--phx-btn-primary-fg);
  border-color: var(--phx-btn-primary-border);
  text-decoration: var(--wp--custom--derived--button--primary--decoration);
  opacity: 1;
}
.wc-block-components-button:not(.is-link):hover:not(:disabled),
.wc-block-components-button:not(.is-link).wc-block-components-checkout-place-order-button:hover:not(:disabled),
.wc-block-cart__submit-button.wc-block-components-button:not(.is-link):hover,
.wc-block-mini-cart__footer-checkout.wc-block-components-button:not(.is-link):hover,
.woocommerce :is(a, button, input).button:hover:not(:disabled),
.woocommerce :is(a, button, input).button.alt:hover:not(:disabled),
.woocommerce div.product form.cart button.single_add_to_cart_button:hover:not(:disabled),
.wp-block-woocommerce-add-to-cart-form .single_add_to_cart_button.button:hover:not(:disabled) {
  background-color: var(--phx-btn-primary-bg-hover);
  background-image: none;
  color: var(--phx-btn-primary-fg-hover);
  border-color: var(--phx-btn-primary-border-hover);
  opacity: 1;
}

/* drugi: „Dodaj do koszyka” w siatce produktów (decyzja: główny przycisk karty to jej link), „Zobacz koszyk”
   w mini-koszyku, przyciski obrysowe Woo, działania w tabeli zamówień i przycisk w komunikacie */
.wp-block-button.wc-block-components-product-button .wc-block-components-product-button__button,
.wc-block-components-button:not(.is-link):is(.outlined, .is-style-outline),
.wc-block-mini-cart__footer-cart.wc-block-components-button:not(.is-link),
.wp-block-woocommerce-mini-cart-contents .wc-block-mini-cart__shopping-button .wp-block-button__link.wp-element-button,
.woocommerce .woocommerce-orders-table :is(a, button).button,
.woocommerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a, button).button {
  padding-inline: var(--wp--custom--derived--button--secondary--padding-inline);
  background-color: var(--phx-btn-secondary-bg);
  background-image: var(--phx-btn-secondary-bg-image);
  color: var(--phx-btn-secondary-fg);
  border-color: var(--phx-btn-secondary-border);
  text-decoration: var(--wp--custom--derived--button--secondary--decoration);
  box-shadow: none;
}
.wp-block-button.wc-block-components-product-button .wc-block-components-product-button__button:hover,
.wc-block-components-button:not(.is-link):is(.outlined, .is-style-outline):hover,
.wc-block-mini-cart__footer-cart.wc-block-components-button:not(.is-link):hover,
.wp-block-woocommerce-mini-cart-contents .wc-block-mini-cart__shopping-button .wp-block-button__link.wp-element-button:hover,
.woocommerce .woocommerce-orders-table :is(a, button).button:hover,
.woocommerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a, button).button:hover {
  background-color: var(--phx-btn-secondary-bg-hover);
  background-image: none;
  color: var(--phx-btn-secondary-fg-hover);
  border-color: var(--phx-btn-secondary-border-hover);
}
.wc-block-components-button:not(.is-link):disabled { cursor: not-allowed; }
/* „pokaż hasło” (logowanie, konto): Woo daje przycisk 22×22 bez paddingu – cel dotyku min. 24px (WCAG 2.5.8) */
.woocommerce form .show-password-input,
.woocommerce-page form .show-password-input { display: flex; align-items: center; justify-content: center; min-width: 24px; min-height: 24px; }

/* fokus: pierścień jak w sekcjach (Woo rysuje niebieski box-shadow) */
.wc-block-components-button:not(.is-link):focus { box-shadow: none; }
.wc-block-components-button:not(.is-link):focus-visible,
.wc-block-components-product-button__button:focus-visible,
.woocommerce .button:focus-visible {
  outline: 2px solid var(--phx-link);
  outline-offset: 2px;
}
/* przyciski-linki Woo (np. „Dodaj kupony”, usuń pozycję) */
.wc-block-components-button.is-link,
.wc-block-cart-item__remove-link { color: var(--phx-link); }

/* ---------- Szerokość stron konta, koszyka i checkoutu ---------- */
/* Woo (woocommerce-blocktheme) zwęża tytuł i treść tych stron do 1000px – szerokość wyznacza kontener motywu
   (.phx-main w szablonie page, .phx-container w sekcjach) */
.woocommerce-account .wp-block-post-title, .woocommerce-account main .woocommerce,
.woocommerce-cart .wp-block-post-title, .woocommerce-cart main .woocommerce,
.woocommerce-checkout .wp-block-post-title, .woocommerce-checkout main .woocommerce { max-width: var(--wp--custom--layout--wide-width); }

/* ---------- Pola formularzy ---------- */
.wc-block-components-form .wc-block-components-text-input :is(input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], input[type=url]),
.wc-block-components-text-input :is(input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], input[type=url]),
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-combobox .components-combobox-control input.components-combobox-control__input,
.wc-block-components-textarea,
.woocommerce form :is(.input-text, select),
.woocommerce form .form-row :is(.input-text, select),
.woocommerce .quantity .qty,
.wc-block-catalog-sorting .woocommerce-ordering select.orderby,
.wc-block-product-filter-price-slider .text input[type=text],
.wp-block-search:has(input[name=post_type][value=product]) .wp-block-search__input,
.wc-block-product-search .wc-block-product-search__field {
  color: var(--phx-fg);
  background-color: var(--phx-field-bg);
  border: 1px solid var(--phx-field-border);
  /* promień z tokenów, ale nie większy niż standard pól Woo (4px) – przy większym treść pola dochodzi do krawędzi */
  border-radius: var(--wp--custom--derived--radius--field);
  font-family: inherit;
}
.wc-block-components-form .wc-block-components-text-input :is(input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], input[type=url]):hover,
.wc-block-components-text-input :is(input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], input[type=url]):hover,
.wc-blocks-components-select .wc-blocks-components-select__select:hover,
.wc-block-components-combobox .components-combobox-control input.components-combobox-control__input:hover,
.wc-block-components-textarea:hover,
.woocommerce form :is(.input-text, select):hover,
.woocommerce form .form-row :is(.input-text, select):hover,
.woocommerce .quantity .qty:hover,
.wc-block-catalog-sorting .woocommerce-ordering select.orderby:hover,
.wc-block-product-filter-price-slider .text input[type=text]:hover,
.wp-block-search:has(input[name=post_type][value=product]) .wp-block-search__input:hover,
.wc-block-product-search .wc-block-product-search__field:hover {
  border-color: var(--phx-field-border-focus);
}
.wc-block-components-form .wc-block-components-text-input :is(input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], input[type=url]):focus,
.wc-block-components-text-input :is(input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], input[type=url]):focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus,
.wc-block-components-combobox .components-combobox-control input.components-combobox-control__input:focus,
.wc-block-components-textarea:focus,
.woocommerce form :is(.input-text, select):focus,
.woocommerce form .form-row :is(.input-text, select):focus,
.woocommerce .quantity .qty:focus,
.wc-block-catalog-sorting .woocommerce-ordering select.orderby:focus,
.wc-block-product-filter-price-slider .text input[type=text]:focus,
.wp-block-search:has(input[name=post_type][value=product]) .wp-block-search__input:focus,
.wc-block-product-search .wc-block-product-search__field:focus {
  /* Woo przy fokusie: tło #fff, kolor #2b2d2f, ramka 1.5px, w textarea box-shadow inset – zastąpione tokenami kontekstu;
     wskaźnik fokusu: ramka + obrys 1px w kolorze fokusu pól (razem 2px, bez zmiany rozmiaru pola) */
  color: var(--phx-fg);
  background-color: var(--phx-field-bg);
  border-width: 1px;
  border-style: solid;
  border-color: var(--phx-field-border-focus);
  box-shadow: none;
  outline: 1px solid var(--phx-field-border-focus);
  outline-offset: 0;
}
.woocommerce form :is(.input-text, select),
.woocommerce form .form-row :is(.input-text, select),
.woocommerce .quantity .qty,
.wc-block-catalog-sorting .woocommerce-ordering select.orderby {
  box-sizing: border-box;
  min-height: 2.75rem;
  padding-block: var(--wp--preset--spacing--10);
  padding-inline: var(--wp--preset--spacing--20);
}
/* select checkoutu: kontener pod polem ma własne białe tło (Woo) – widać je w rogach pola w ciemnym kontekście */
.wc-blocks-components-select .wc-blocks-components-select__container {
  color: var(--phx-fg);
  background: var(--phx-field-bg);
  border-radius: var(--wp--custom--derived--radius--field);
}
.wc-blocks-components-select .wc-blocks-components-select__expand { fill: currentColor; }
/* etykiety pływające i podpisy pól */
.wc-block-components-form .wc-block-components-text-input label,
.wc-block-components-text-input label,
.wc-blocks-components-select .wc-blocks-components-select__label { color: var(--phx-fg-muted); }
/* błędy walidacji */
.wc-block-components-text-input.has-error :is(input, textarea),
.wc-blocks-components-select.has-error .wc-blocks-components-select__select,
.woocommerce form .form-row.woocommerce-invalid :is(.input-text, select) { border-color: var(--phx-field-error); }
/* pole z błędem zostaje czerwone także przy fokusie (reguły :focus wyżej mają wyższą specyficzność) */
.wc-block-components-form .wc-block-components-text-input.has-error :is(input, textarea):focus,
.wc-block-components-text-input.has-error :is(input, textarea):focus,
.wc-blocks-components-select.has-error .wc-blocks-components-select__select:focus,
.woocommerce form .form-row.woocommerce-invalid :is(.input-text, select):focus {
  border-color: var(--phx-field-error);
  outline-color: var(--phx-field-error);
}
.wc-block-components-validation-error,
.wc-block-components-text-input.has-error label { color: var(--phx-field-error); }
/* pola wyboru i opcje radio */
.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox],
.wc-block-components-radio-control .wc-block-components-radio-control__input {
  background-color: var(--phx-field-bg);
  border-color: var(--phx-field-border);
}
.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked,
.wc-block-components-radio-control .wc-block-components-radio-control__input:checked { border-color: var(--phx-field-border-focus); }
.wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: var(--phx-fg); }
.wc-block-components-radio-control .wc-block-components-radio-control__input:checked::before { background: var(--phx-field-border-focus); }
/* ilość: pole + przyciski −/+ w koszyku i mini-koszyku */
.wc-block-components-quantity-selector {
  border-radius: var(--wp--custom--derived--radius--field);
}
.wc-block-components-quantity-selector::after {
  border-color: var(--phx-field-border);
  border-radius: var(--wp--custom--derived--radius--field);
}
.wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input { color: var(--phx-fg); background: transparent; }
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button { color: var(--phx-fg); }

/* ---------- Ceny, plakietki, oceny ---------- */
.wc-block-components-product-price,
.wp-block-woocommerce-product-price,
.woocommerce .price {
  font-family: var(--wp--preset--font-family--heading);
  color: var(--phx-fg);
}
.wc-block-components-product-price del,
.wc-block-components-product-price__regular,
.woocommerce .price del { color: var(--phx-fg-muted); }
.wc-block-components-product-price ins,
.woocommerce .price ins { color: var(--phx-fg); text-decoration: none; }

.wc-block-components-product-sale-badge,
.woocommerce span.onsale,
.wc-block-components-sale-badge {
  color: var(--wp--preset--color--on-accent);
  background: var(--wp--preset--color--accent);
  border: 0;
  border-radius: var(--wp--custom--derived--radius--small);
  font-family: var(--wp--preset--font-family--body);
}
.wc-block-components-product-sale-badge,
.woocommerce span.onsale {
  font-size: var(--wp--preset--font-size--xs);
  font-weight: var(--wp--custom--type--eyebrow--weight);
  letter-spacing: var(--wp--custom--type--eyebrow--letter-spacing);
  text-transform: var(--wp--custom--type--eyebrow--transform);
}
/* „Oszczędzasz …” w pozycji koszyka: wąska kolumna sumy – tekst może się łamać (Woo: nowrap → poziome przewijanie przy 390 px) */
.wc-block-components-sale-badge { white-space: normal; }
/* plakietka galerii produktu (klasyczny `span.onsale`): prostokąt w rogu zamiast koła Woo */
.woocommerce span.onsale {
  min-width: 0;
  min-height: 0;
  padding-block: var(--wp--preset--spacing--10);
  padding-inline: var(--wp--preset--spacing--20);
  line-height: 1.2;
  top: var(--wp--preset--spacing--20);
  left: var(--wp--preset--spacing--20);
}
.wc-block-components-product-rating__stars,
.wc-block-components-product-rating-stars__stars,
.woocommerce .star-rating,
.woocommerce p.stars a { color: var(--wp--preset--color--accent); }
.woocommerce .star-rating::before { color: var(--phx-border); }

/* ---------- Komunikaty ---------- */
/* tło = tło kontekstu (--phx-bg) z domieszką koloru stanu, tekst = --phx-fg kontekstu – czytelne także w sekcji
   ciemnej/brand; warianty nadpisują tło i ramkę Woo (.is-success{background-color:#f4fff7} itd., specyficzność 0,2,0) */
.wc-block-components-notice-banner,
.woocommerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) {
  --phx-notice: var(--phx-link);
  color: var(--phx-fg);
  background-color: color-mix(in srgb, var(--phx-notice) 8%, var(--phx-bg));
  border: 1px solid var(--phx-notice);
  border-radius: var(--wp--custom--derived--radius--element);
}
.wc-block-components-notice-banner.is-success,
.woocommerce .woocommerce-message { --phx-notice: var(--wp--preset--color--success); }
.wc-block-components-notice-banner.is-error,
.woocommerce .woocommerce-error { --phx-notice: var(--wp--preset--color--error); }
.wc-block-components-notice-banner:is(.is-success, .is-error, .is-info, .is-warning) {
  color: var(--phx-fg);
  background-color: color-mix(in srgb, var(--phx-notice) 8%, var(--phx-bg));
  border-color: var(--phx-notice);
}
.wc-block-components-notice-banner:is(.is-success, .is-error, .is-info, .is-warning) > svg { background-color: var(--phx-notice); fill: var(--phx-bg); }
/* !important: Woo wpisuje kolor linku „Zobacz koszyk” i przycisku zamknięcia z !important (#2f2f2f – nieczytelny na ciemnym tle) */
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward { color: var(--phx-fg) !important; opacity: 1; }
.wc-block-components-notice-banner > .wc-block-components-button { color: var(--phx-fg) !important; }
/* „Zobacz koszyk” w banerze to u Woo link tekstowy (float: right, padding 0), ale łapie go forma przycisku
   (.woocommerce .button): min-height 49px i font przycisku rozpychały baner w dół i rozjeżdżały linię tekstu */
.woocommerce .wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward {
  min-height: 0;
  font-size: inherit;
  line-height: inherit;
  letter-spacing: normal;
  text-transform: none;
  border: 0;
}
.woocommerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) { border-top-color: var(--phx-notice); }
.woocommerce :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before { color: var(--phx-notice); }

/* ---------- Karty produktów (siatki sekcji: ProductGrid) ---------- */
.phx-product-grid .wc-block-product {
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--10);
  box-sizing: border-box;
  min-width: 0;
  background: var(--phx-card-bg);
  border: 1px solid var(--phx-card-border);
  box-shadow: var(--phx-card-shadow);
  border-radius: var(--wp--custom--derived--radius--element);
  padding: var(--wp--custom--derived--space--card);
}
.phx-product-grid .wc-block-product > * { margin-block: 0; }
.phx-product-grid .wc-block-components-product-image { overflow: hidden; border-radius: var(--wp--custom--derived--radius--element); }
.phx-product-grid .wc-block-product .wp-block-post-title {
  font-size: var(--wp--preset--font-size--l);
  text-align: start;
}
.phx-product-grid .wc-block-product .wp-block-post-title a { color: var(--phx-fg); text-decoration: none; }
.phx-product-grid .wc-block-product .wp-block-post-title a:hover { color: var(--phx-link); text-decoration: underline; }
.phx-product-grid .wc-block-product .wc-block-components-product-price { text-align: start; }
/* przycisk na dole karty, wyrównany do początku (Woo centruje) */
.phx-product-grid .wc-block-product .wp-block-woocommerce-product-button {
  margin-top: auto;
  padding-top: var(--wp--preset--spacing--10);
  align-items: flex-start;
  justify-content: flex-start;
  text-align: start;
}
.phx-product-grid .wc-block-components-product-sale-badge { margin: var(--wp--preset--spacing--10); }

/* wąski ekran: dwie kolumny kart po ~150 px – mniejsze wypełnienie, tytuł i przycisk mieszczą się bez łamania słów */
@media (max-width: 599px) {
  .phx-product-grid .wc-block-product { padding: min(var(--wp--custom--derived--space--card), var(--wp--preset--spacing--20)); }
  .phx-product-grid .wc-block-product .wp-block-post-title { font-size: var(--wp--preset--font-size--m); hyphens: auto; }
  .phx-product-grid .wp-block-button.wc-block-components-product-button .wc-block-components-product-button__button {
    width: 100%;
    padding-inline: var(--wp--preset--spacing--10);
  }
}

/* ---------- Filtry produktów (Shop\Filters, wariant sidebar archiwum) ---------- */
/* Woo czyta kolory filtrów ze zmiennych --wc-product-filter-* (fallback: currentColor / #fff / #1e1e1e);
   kolory ustawione w bloku przez użytkownika (atrybut style na bloku) nadal wygrywają */
.wc-block-product-filters,
.wp-block-woocommerce-product-filters {
  --wc-product-filter-checkbox-list-option-element: var(--phx-field-bg);
  --wc-product-filter-checkbox-list-option-element-border: var(--phx-field-border);
  --wc-product-filter-checkbox-list-option-element-selected: var(--phx-field-border-focus);
  --wc-product-filter-checkbox-list-label-element: var(--phx-fg);
  --wc-product-filter-price-slider: var(--phx-link);
  --wc-product-filter-price-slider-handle: var(--phx-field-bg);
  --wc-product-filter-price-slider-handle-border: var(--phx-link);
  --wc-product-filter-removable-chips-text: var(--phx-fg);
  --wc-product-filter-removable-chips-background: var(--phx-field-bg);
  --wc-product-filter-removable-chips-border: var(--phx-border);
}
.wc-block-product-filters .wp-block-heading { font-family: var(--wp--preset--font-family--heading); }
.wc-block-product-filters h2.wp-block-heading { font-size: var(--wp--preset--font-size--l); }
.wc-block-product-filters h3.wp-block-heading { font-size: var(--wp--preset--font-size--m); }
/* pola wyboru */
/* promień małego elementu, ale najwyżej 25% (pole 1em – inaczej przy dużych promieniach wyszłoby kółko jak radio) */
input[type=checkbox].wc-block-product-filter-checkbox-list__input { border-radius: min(var(--wp--custom--derived--radius--small), 25%); }
input[type=checkbox].wc-block-product-filter-checkbox-list__input:checked { border-color: var(--phx-field-border-focus); }
input[type=checkbox].wc-block-product-filter-checkbox-list__input:focus-visible { outline: 2px solid var(--phx-field-border-focus); outline-offset: 2px; }
.wc-block-product-filter-checkbox-list__input-wrapper::before { border-radius: min(var(--wp--custom--derived--radius--small), 25%); }
.wc-block-product-filter-checkbox-list__show-more-button { color: var(--phx-link); }
/* suwak ceny: uchwyt przy najechaniu/fokusie – Woo wpisuje #1e1e1e/#fff na sztywno */
.wc-block-product-filter-price-slider__range input[type=range]:is(:hover, :focus)::-webkit-slider-thumb {
  background: var(--phx-link);
  border-color: var(--phx-field-bg);
}
.wc-block-product-filter-price-slider__range input[type=range]:is(:hover, :focus)::-moz-range-thumb {
  background: var(--phx-link);
  border-color: var(--phx-field-bg);
}
.wc-block-product-filter-price-slider__range input[type=range]::-webkit-slider-thumb:hover {
  background: var(--phx-link);
  border-color: var(--phx-field-bg);
}
.wc-block-product-filter-price-slider__range input[type=range]::-moz-range-thumb:hover {
  background: var(--phx-link);
  border-color: var(--phx-field-bg);
}
.wc-block-product-filter-price-slider__range input[type=range]:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--phx-field-border-focus); outline-offset: 2px; }
.wc-block-product-filter-price-slider .text input[type=text] { font-size: var(--wp--preset--font-size--s); }
/* aktywne filtry (usuwalne „chipsy”) */
.wc-block-product-filter-removable-chips__items .wc-block-product-filter-removable-chips__item {
  border-radius: var(--wp--custom--derived--radius--small);
  padding-block: var(--wp--preset--spacing--10);
  padding-inline: var(--wp--preset--spacing--20);
}
.wc-block-product-filter-removable-chips__items .wc-block-product-filter-removable-chips__item:hover { border-color: var(--phx-field-border-focus); }
/* „Wyczyść filtry”: przycisk drugi (rdzeń WP maluje wariant outline obramowaniem currentColor) */
.wp-block-button.wc-block-product-filter-clear-button > .wp-block-button__link.wp-element-button {
  box-sizing: border-box;
  padding-block: var(--wp--preset--spacing--10);
  padding-inline: var(--wp--custom--derived--button--secondary--padding-inline);
  font-size: var(--wp--preset--font-size--s);
  font-weight: var(--wp--custom--type--button--weight);
  letter-spacing: var(--wp--custom--type--button--letter-spacing);
  text-transform: var(--wp--custom--type--button--transform);
  color: var(--phx-btn-secondary-fg);
  background-color: var(--phx-btn-secondary-bg);
  background-image: var(--phx-btn-secondary-bg-image);
  border: 2px solid var(--phx-btn-secondary-border);
  border-radius: var(--wp--custom--derived--radius--button);
  background-origin: border-box;
  text-decoration: var(--wp--custom--derived--button--secondary--decoration);
}
.wp-block-button.wc-block-product-filter-clear-button > .wp-block-button__link.wp-element-button:hover {
  color: var(--phx-btn-secondary-fg-hover);
  background-color: var(--phx-btn-secondary-bg-hover);
  background-image: none;
  border-color: var(--phx-btn-secondary-border-hover);
}

/* ---------- Wyszukiwarka produktów ---------- */
/* rdzeniowy blok Szukaj z typem `product` (wariant Woo „Product Search”) i starszy `.wc-block-product-search`;
   pole – reguły pól wyżej, przycisk – główny */
.wp-block-search:has(input[name=post_type][value=product]) .wp-block-search__inside-wrapper,
.wc-block-product-search .wc-block-product-search__fields { gap: var(--wp--preset--spacing--10); }
.wp-block-search:has(input[name=post_type][value=product]) .wp-block-search__input,
.wc-block-product-search .wc-block-product-search__field {
  box-sizing: border-box;
  min-height: 2.75rem;
  padding-block: var(--wp--preset--spacing--10);
  padding-inline: var(--wp--preset--spacing--20);
}
.wp-block-search:has(input[name=post_type][value=product]) .wp-block-search__button.wp-element-button,
.wc-block-product-search .wc-block-product-search__button {
  margin: 0;
  padding-block: var(--wp--preset--spacing--10);
  padding-inline: var(--wp--preset--spacing--20);
  color: var(--phx-btn-primary-fg);
  background-color: var(--phx-btn-primary-bg);
  background-image: var(--phx-btn-primary-bg-image);
  border: 2px solid var(--phx-btn-primary-border);
  border-radius: var(--wp--custom--derived--radius--button);
  background-origin: border-box;
  font-size: var(--wp--preset--font-size--s);
  font-weight: var(--wp--custom--type--button--weight);
}
.wp-block-search:has(input[name=post_type][value=product]) .wp-block-search__button.wp-element-button:hover,
.wc-block-product-search .wc-block-product-search__button:hover {
  color: var(--phx-btn-primary-fg-hover);
  background-color: var(--phx-btn-primary-bg-hover);
  background-image: none;
  border-color: var(--phx-btn-primary-border-hover);
}
.wp-block-search:has(input[name=post_type][value=product]) .wp-block-search__label,
.wc-block-product-search .wc-block-product-search__label { color: var(--phx-fg); }

/* ---------- Paginacja, sortowanie, licznik ---------- */
.phx-product-grid .wp-block-query-pagination { margin-top: var(--wp--custom--derived--space--gap); gap: var(--wp--preset--spacing--10); }
.wp-block-query-pagination :is(a, .page-numbers),
.woocommerce nav.woocommerce-pagination ul li :is(a, span) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  min-height: 2.75rem;
  box-sizing: border-box;
  padding-inline: var(--wp--preset--spacing--10);
  color: var(--phx-link);
  border: 1px solid var(--phx-border);
  border-radius: var(--wp--custom--derived--radius--element);
  text-decoration: none;
}
.wp-block-query-pagination a:hover,
.woocommerce nav.woocommerce-pagination ul li a:hover { border-color: var(--phx-link); }
.wp-block-query-pagination .page-numbers.current,
.woocommerce nav.woocommerce-pagination ul li span.current {
  color: var(--phx-btn-primary-fg);
  background-color: var(--phx-btn-primary-bg);
  border-color: var(--phx-btn-primary-bg);
}
.woocommerce nav.woocommerce-pagination ul { border: 0; }
.woocommerce nav.woocommerce-pagination ul li { border: 0; }
.woocommerce-result-count,
.wc-block-product-results-count { color: var(--phx-fg-muted); font-size: var(--wp--preset--font-size--s); margin: 0; }
.wc-block-catalog-sorting .woocommerce-ordering { margin: 0; }
.wc-block-catalog-sorting .woocommerce-ordering select.orderby { font-size: var(--wp--preset--font-size--s); }

/* ---------- Okruszki ---------- */
.woocommerce-breadcrumb,
.wc-block-breadcrumbs .woocommerce-breadcrumb {
  color: var(--phx-fg-muted);
  font-size: var(--wp--preset--font-size--xs);
}
.woocommerce-breadcrumb a { color: var(--phx-link); }

/* ---------- Strona produktu: zakładki, meta ---------- */
.wp-block-woocommerce-product-details .woocommerce-tabs ul.wc-tabs,
.woocommerce div.product .woocommerce-tabs ul.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--30);
  margin: 0 0 var(--wp--preset--spacing--30);
  padding: 0;
  list-style: none;
  border-bottom: 1px solid var(--phx-border);
}
.wp-block-woocommerce-product-details .woocommerce-tabs ul.wc-tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { content: none; }
.wp-block-woocommerce-product-details .woocommerce-tabs ul.wc-tabs li,
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
.wp-block-woocommerce-product-details .wc-tabs li a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  display: block;
  padding-block: var(--wp--preset--spacing--10);
  padding-inline: 0;
  position: relative;
  top: 1px; /* podkreślenie aktywnej zakładki na linii listy */
  color: var(--phx-fg);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 2px solid transparent;
}
.wp-block-woocommerce-product-details .wc-tabs li a:hover,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: var(--phx-link); }
.wp-block-woocommerce-product-details .wc-tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--phx-link);
  border-bottom-color: var(--phx-link);
}
.wp-block-woocommerce-product-details .woocommerce-Tabs-panel > h2:first-child { font-size: var(--wp--preset--font-size--l); }
.wp-block-woocommerce-product-meta { color: var(--phx-fg-muted); font-size: var(--wp--preset--font-size--s); }
.wp-block-woocommerce-product-meta a { color: var(--phx-link); }
/* dodanie do koszyka: ilość + przycisk w jednym rzędzie */
.wp-block-woocommerce-add-to-cart-form form.cart { display: flex; flex-wrap: wrap; align-items: stretch; gap: var(--wp--preset--spacing--10); }
.woocommerce .wp-block-woocommerce-add-to-cart-form .quantity .qty { min-height: 3.0625rem; margin: 0; }

/* ---------- Koszyk i zamówienie (checkout) ---------- */
.wc-block-components-totals-wrapper,
.wc-block-components-panel,
.wc-block-cart-items,
.wc-block-cart-items td,
.wc-block-cart-items th,
.wc-block-cart .wc-block-cart-items .wc-block-cart-items__row,
.wc-block-components-checkout-order-summary__title,
.wc-block-checkout__terms.wc-block-checkout__terms--with-separator { border-color: var(--phx-border); }
.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-components-radio-control-accordion-option,
.wc-block-components-radio-control__option.wc-block-components-radio-control__option--checked-option-highlighted {
  border-color: var(--phx-border);
  border-radius: var(--wp--custom--derived--radius--element);
}
.wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted,
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted {
  box-shadow: none; /* Woo: obwódka inset currentColor – zastąpiona obrysem w kolorze fokusu pól */
  outline: 2px solid var(--phx-field-border-focus);
  outline-offset: -2px;
  border-radius: var(--wp--custom--derived--radius--element);
}
.wc-block-checkout__form .wc-block-components-checkout-step__heading .wc-block-components-checkout-step__title,
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title .wc-block-components-checkout-order-summary__title-text,
.wc-block-cart__totals-title,
.wc-block-cart__empty-cart__title,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
  font-family: var(--wp--preset--font-family--heading);
  font-weight: var(--wp--custom--type--heading--weight);
  color: var(--phx-fg);
}
.wc-block-checkout__form .wc-block-components-checkout-step__heading .wc-block-components-checkout-step__title { font-size: var(--wp--preset--font-size--m); }
.wc-block-cart-items__header,
.wc-block-cart__totals-title { color: var(--phx-fg-muted); }
.wc-block-components-product-name,
.wc-block-cart-item__product .wc-block-components-product-name { color: var(--phx-fg); }
.wc-block-components-product-metadata,
.wc-block-components-checkout-step__description,
.wc-block-components-totals-item__description,
.wc-block-checkout__guest-checkout-notice { color: var(--phx-fg-muted); }
.wc-block-components-product-badge { border-radius: var(--wp--custom--derived--radius--small); }
.wc-block-components-product-badge { color: var(--phx-fg); border-color: var(--phx-border); }
.wc-block-checkout__terms a,
.wc-block-components-checkout-step__heading-content a,
.wc-block-components-address-card__edit,
.wc-block-components-address-form__address_2-toggle { color: var(--phx-link); }
.wc-block-components-address-card { border-color: var(--phx-border); border-radius: var(--wp--custom--derived--radius--element); }

/* ---------- Potwierdzenie zamówienia ---------- */
.wc-block-order-confirmation-summary-list,
.wc-block-order-confirmation-totals__table,
.wc-block-order-confirmation-totals__table :is(th, td),
.wc-block-order-confirmation-address-wrapper address { border-color: var(--phx-border); }
.wc-block-order-confirmation-summary-list-item__key,
.wc-block-order-confirmation-totals__table th { color: var(--phx-fg-muted); }
.wc-block-order-confirmation-totals__table a { color: var(--phx-link); }
/* „Utwórz konto” (hooked block Woo): tło z kontekstu zamiast czarnej domieszki Woo (rgba(0,0,0,.04)) */
.wc-block-order-confirmation-create-account {
  color: var(--phx-fg);
  background: color-mix(in srgb, var(--phx-fg) 4%, var(--phx-bg));
  border-radius: var(--wp--custom--derived--radius--element);
}

/* ---------- Mini-koszyk (plakietka w nagłówku, szuflada) ---------- */
/* !important: Woo (Interactivity API, data-wp-style--*) wpisuje kolory plakietki w atrybut style */
.wc-block-mini-cart__badge {
  color: var(--phx-btn-primary-fg) !important;
  background-color: var(--phx-btn-primary-bg) !important;
}
.wc-block-mini-cart__drawer .components-modal__content,
.wc-block-components-drawer {
  color: var(--phx-fg);
  background: var(--wp--preset--color--base);
}
.wc-block-mini-cart__title { font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--m); }
.wc-block-mini-cart__footer { border-color: var(--phx-border); }
.wc-block-mini-cart__products-table .wc-block-components-product-name { color: var(--phx-link); }
.wc-block-components-drawer__close { color: var(--phx-fg); }
/* Zamknięta szuflada: Woo chowa ją tylko przez opacity, więc przyciski zostają w kolejności Tab (niewidoczne cele
   fokusu, axe aria-hidden-focus). visibility: hidden dopiero po animacji zamykania (0.3s jak u Woo); otwarcie – od razu. */
.wc-block-components-drawer__screen-overlay--is-hidden {
  visibility: hidden;
  transition: opacity 0.3s, visibility 0s linear 0.3s;
}

/* ---------- Moje konto ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li {
  padding: 0;
  border-bottom: 1px solid var(--phx-border);
}
.woocommerce-MyAccount-navigation a {
  display: block;
  padding-block: var(--wp--preset--spacing--10);
  color: var(--phx-link);
  text-decoration: none;
}
.woocommerce-MyAccount-navigation a:hover { text-decoration: underline; }
.woocommerce-MyAccount-navigation .is-active a { color: var(--phx-fg); font-weight: 700; }
.woocommerce table.woocommerce-orders-table,
.woocommerce table.shop_table {
  border: 1px solid var(--phx-border);
  border-radius: var(--wp--custom--derived--radius--element);
  border-collapse: separate;
}
.woocommerce table.shop_table :is(th, td) { border-color: var(--phx-border); }
.woocommerce table.woocommerce-orders-table a:not(.button) { color: var(--phx-link); }
.woocommerce .woocommerce-orders-table__cell-order-actions .button { min-height: 2.5rem; margin: 0 var(--wp--preset--spacing--10) var(--wp--preset--spacing--10) 0; }
.woocommerce form.login,
.woocommerce form.register,
.woocommerce form.checkout_coupon,
.woocommerce-page .woocommerce-customer-details address {
  border: 1px solid var(--phx-border);
  border-radius: var(--wp--custom--derived--radius--element);
}
/* logowanie bez rejestracji i reset hasła (sam formularz, bez kolumn #customer_login): na desktopie połowa szerokości */
@media (min-width: 782px) {
  .woocommerce-account main .woocommerce:has(> :is(form.login, form.lost_reset_password)) { max-width: 50%; }
}
.woocommerce form .form-row label,
.woocommerce-form-login label { color: var(--phx-fg); }
.woocommerce form .form-row .required { color: var(--wp--preset--color--error); }
.woocommerce-LostPassword a,
.woocommerce-account .woocommerce-MyAccount-content a:not(.button) { color: var(--phx-link); }

/* ---------- Szybkie zamówienie (phoenix-woo-features, shortcode phoenix_quick_order) ---------- */
/* karta formularza jak .phx-card.is-boxed; pola i przycisk z reguł Woo wyżej (kontener .woocommerce); kolory z kontekstu tła */
.phx-wf-quick-order {
  color: var(--phx-fg);
  background: var(--phx-card-bg);
  border: 1px solid var(--phx-card-border);
  box-shadow: var(--phx-card-shadow);
  border-radius: var(--wp--custom--derived--radius--element);
  padding: var(--wp--custom--derived--space--card);
}
@media (max-width: 599px) {
  .phx-wf-quick-order { padding: min(var(--wp--custom--derived--space--card), var(--wp--preset--spacing--30)); }
}
/* nagłówek sekcji z linią do końca wiersza */
.phx-wf-quick-order .phx-wf-qo__heading {
  display: flex;
  align-items: center;
  gap: var(--wp--preset--spacing--20);
  inline-size: 100%;
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--l);
  font-weight: var(--wp--custom--type--heading--weight);
  line-height: var(--wp--custom--type--heading--line-height);
  letter-spacing: var(--wp--custom--type--heading--letter-spacing);
  text-transform: var(--wp--custom--type--heading--transform);
  color: var(--phx-fg);
}
.phx-wf-quick-order .phx-wf-qo__heading::after {
  content: "";
  flex: 1 1 auto;
  border-top: 1px solid var(--phx-card-border);
}
.phx-wf-quick-order .phx-wf-qo__description { color: var(--phx-fg-muted); font-size: var(--wp--preset--font-size--s); }
/* warianty: wiersze jak pola, zaznaczony – obrys i tło w kolorze fokusu pól */
.phx-wf-quick-order .phx-wf-qo__variant {
  padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
  background: var(--phx-field-bg);
  border: 1px solid var(--phx-field-border);
  border-radius: var(--wp--custom--derived--radius--field);
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.phx-wf-quick-order .phx-wf-qo__variant:hover { border-color: var(--phx-field-border-focus); }
.phx-wf-quick-order .phx-wf-qo__variant:has(input:checked) {
  border-color: var(--phx-field-border-focus);
  background: color-mix(in srgb, var(--phx-field-border-focus) 10%, var(--phx-field-bg));
}
.phx-wf-quick-order .phx-wf-qo__variant:has(input:focus-visible) { outline: 2px solid var(--phx-field-border-focus); outline-offset: 2px; }
.phx-wf-quick-order .phx-wf-qo__variant input[type=radio] {
  appearance: none;
  inline-size: 1.25rem;
  block-size: 1.25rem;
  background: var(--phx-field-bg);
  border: 1px solid var(--phx-field-border);
  border-radius: 50%;
  display: grid;
  place-items: center;
}
.phx-wf-quick-order .phx-wf-qo__variant input[type=radio]:checked { border-color: var(--phx-field-border-focus); }
.phx-wf-quick-order .phx-wf-qo__variant input[type=radio]:checked::before {
  content: "";
  inline-size: 0.625rem;
  block-size: 0.625rem;
  border-radius: 50%;
  background: var(--phx-field-border-focus);
}
.phx-wf-quick-order .phx-wf-qo__variant-name {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--m);
  font-weight: var(--wp--custom--type--heading--weight);
  color: var(--phx-fg);
}
.phx-wf-quick-order .phx-wf-qo__variant-desc { color: var(--phx-fg-muted); font-size: var(--wp--preset--font-size--s); }
.phx-wf-quick-order .phx-wf-qo__variant-price {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--l);
  font-weight: var(--wp--custom--type--heading--weight);
  color: var(--phx-fg);
}
.phx-wf-quick-order .phx-wf-qo__variant-price del { color: var(--phx-fg-muted); font-size: var(--wp--preset--font-size--s); }
.phx-wf-quick-order .phx-wf-qo__variant-price ins { text-decoration: none; }
/* pola: opis zwykłym wyciszonym tekstem pod polem (Woo pokazuje go jako dymek fokusu checkoutu klasycznego), licznik
   wyciszony; numer pola jak znacznik w kolorze przycisku głównego */
.woocommerce .phx-wf-quick-order .form-row .description {
  display: block;
  position: static;
  margin: 0;
  padding: 0;
  background: none;
  color: var(--phx-fg-muted);
  font-size: var(--wp--preset--font-size--xs);
}
.woocommerce .phx-wf-quick-order .form-row .description::before { display: none; }
.phx-wf-quick-order .phx-wf-qo__counter { color: var(--phx-fg-muted); font-size: var(--wp--preset--font-size--xs); }
.phx-wf-quick-order .phx-wf-qo__fields--numbered .phx-wf-field::before {
  background-color: var(--phx-btn-primary-bg);
  background-image: var(--phx-btn-primary-bg-image);
  color: var(--phx-btn-primary-fg);
  border-radius: var(--wp--custom--derived--radius--button);
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--m);
  font-weight: var(--wp--custom--type--heading--weight);
}
.phx-wf-quick-order .phx-wf-qo__fields--numbered .phx-wf-field label { font-weight: var(--wp--custom--type--heading--weight); }
.phx-wf-quick-order .phx-wf-qo__submit { font-size: var(--wp--preset--font-size--m); }
.phx-wf-quick-order .phx-wf-qo__amount { font-weight: var(--wp--custom--type--heading--weight); }
.phx-wf-qo-notice { padding: var(--wp--preset--spacing--20); border: 1px dashed var(--phx-field-error); color: var(--phx-fg); }