/*
 * Style domyslnych szablonow WooCommerce w palecie PRODUKCJI edytaulc.pl.
 * Bez Woo Buildera i widgetow PRO Elements - czysty CSS na domyslnych
 * szablonach: klasycznych (produkt, moje konto) ORAZ WooCommerce Blocks
 * (koszyk i zamowienie - zweryfikowane 2026-09-24 przez private link,
 * body.woocommerce-cart / .woocommerce-account, markery wc-block-cart /
 * woocommerce-form-login w realnym DOM produkcji).
 *
 * WAZNE: ten plik ZYJE WE WTYCZCE (assets/woo.css), NIE w motywie -
 * enqueue warunkowy w weblix-edyta-ulc.php. Powod: nie dotykamy motywu
 * klientki na zywej stronie, styl przezyje aktualizacje motywu.
 *
 * Paleta odczytana ZE ZRODLA (aktywny kit Elementora, ID 9,
 * _elementor_page_settings->system_colors, 2026-09-24 - patrz raport
 * Zadania 20), NIE oszacowana:
 *   Glowny (system)      #C28FA3  rozowy
 *   Akcent (system)      #B13B90  magenta
 *   Tekst  (system)      #11192D  granat
 *   Drugorzedny (system) #54595F  szary
 *   Bialy  (system)      #FFFFFF
 *   custom_colors: #303030, #EA7592 (rozowy uzywany w gradiencie CTA landingu)
 *   system_typography: WSZYSTKIE cztery role (primary/secondary/text/accent)
 *   ustawione na "Times New Roman" - jeden font, bez podzialu naglowek/tekst
 *   (inaczej niz kopia: Cormorant Garamond + Manrope).
 *
 * Kontrast (WCAG, tekst bialy na tle):
 *   #B13B90 -> 5.39:1 (przechodzi AA dla tekstu)
 *   #C28FA3 -> 2.71:1 (NIE przechodzi AA - dlatego rozowy NIE jest tlem
 *   przycisku z bialym tekstem, tylko akcentem na jasnym tle)
 *
 * Zero !important w calym pliku - patrz komentarze przy kazdej regule
 * co do rachunku specyficznosci wzgledem rdzenia. Rdzen zweryfikowany
 * PRZEZ POBRANIE realnych plikow z produkcji 2026-09-24:
 *   woocommerce.css?ver=11.1.2, reset.css (hello-elementor)?ver=3.5.1,
 *   packages-style.css / cart.css / checkout.css?ver=wc-11.1.2.
 */

body.woocommerce-page {
  --wlx-text: #11192D;       /* Tekst (kit) - naglowki, tresc */
  --wlx-accent: #B13B90;     /* Akcent (kit) - CTA, ceny, linki akcentowe */
  --wlx-accent-dark: #8E2F73; /* Akcent przyciemniony 20% czarnym - hover przyciskow */
  --wlx-primary: #C28FA3;    /* Glowny (kit) - subtelne akcenty na jasnym tle */
  --wlx-border: #54595F;     /* Drugorzedny (kit) - obramowania pol/tabel */
  --wlx-surface: #FFFFFF;    /* Bialy (kit) - tlo pol formularzy */
  --wlx-bg-soft: #F8F2F4;    /* jasne tlo sekcji (mieszanka 12% Glownego na bieli) */
  --wlx-bg-soft-2: #F2E6EB;  /* tlo podsumowania zamowienia (22% Glownego na bieli) */
  --wlx-font: "Times New Roman", Georgia, serif;
}

/* ---------- Typografia ---------- */
/* Produkcja ma JEDEN font we wszystkich rolach typografii kitu (Times New
   Roman) - w odroznieniu od kopii (dwa fonty) stosujemy go jednolicie. */

body.woocommerce-page h1,
body.woocommerce-page h2,
body.woocommerce-page h3,
body.woocommerce-page .product_title,
body.woocommerce-page .wc-block-components-checkout-step__title,
body.woocommerce-page .wc-block-components-checkout-order-summary__title,
body.woocommerce-page .wc-block-cart__totals-title,
body.woocommerce-page .wc-block-components-product-name {
  font-family: var(--wlx-font);
  color: var(--wlx-text);
}

body.woocommerce-page,
body.woocommerce-page input,
body.woocommerce-page select,
body.woocommerce-page textarea,
body.woocommerce-page button {
  font-family: var(--wlx-font);
}

/* ---------- Ceny (produkt, koszyk, zamowienie) ---------- */

body.woocommerce-page .price,
body.woocommerce-page .woocommerce-Price-amount,
body.woocommerce-page .wc-block-components-product-price__value,
body.woocommerce-page .wc-block-components-totals-item__value,
body.woocommerce-page .wc-block-formatted-money-amount,
body.woocommerce-page .wc-block-components-formatted-money-amount {
  color: var(--wlx-accent);
}

/* ---------- Przyciski: szablony klasyczne (produkt, moje konto) ---------- */

/* Bez !important, specyficznosc: rdzen (woocommerce.css?ver=11.1.2,
   zweryfikowane bezposrednio w pliku 2026-09-24) ma
   ".woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles))
   a.button.alt" - po odjeciu :where() (zero specyficznosci) to 3 klasy
   (.woocommerce .button .alt) + 1 typ (a) = 0-3-1. Powielenie klasy
   docelowej podnosi WLASNY selektor do rowniez 3 klas bez zmiany
   dopasowania; przy remisie 3=3 decyduje kolejnosc w <head> - wlx-woo
   laduje sie PO woocommerce-general-css (enqueue z priority 20, po
   rdzeniu WC), wiec przy remisie wygrywa nasz, pozniejszy arkusz. */
body.woocommerce-page .button.button,
body.woocommerce-page button.button.button,
body.woocommerce-page input.button.button,
body.woocommerce-page a.button.button,
body.woocommerce-page .single_add_to_cart_button.single_add_to_cart_button,
body.woocommerce-page .woocommerce-form-login__submit.woocommerce-form-login__submit {
  background-color: var(--wlx-accent);
  color: #fff;
  border: none;
  border-radius: 3px;
  padding: 16px 28px;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .85rem;
  transition: background-color .2s ease;
}

body.woocommerce-page .button.button:hover,
body.woocommerce-page button.button.button:hover,
body.woocommerce-page input.button.button:hover,
body.woocommerce-page a.button.button:hover,
body.woocommerce-page .single_add_to_cart_button.single_add_to_cart_button:hover,
body.woocommerce-page .woocommerce-form-login__submit.woocommerce-form-login__submit:hover {
  background-color: var(--wlx-accent-dark);
  color: #fff;
}

/* Produkt WARIANTOWY przed wyborem terminu ma przycisk "Dodaj do koszyka"
   w stanie ".disabled" (klasa literalna dodawana przez JS rdzenia po
   zaladowaniu strony - potwierdzone w realnym DOM produktu testowego
   910: "single_add_to_cart_button button alt disabled
   wc-variation-selection-needed"). Rdzen ma na ten stan OSOBNA regule z
   WYZSZA specyficznoscia niz baza .alt: ".woocommerce:where(...)
   button.button.alt.disabled" = po odjeciu :where() 4 klasy
   (.woocommerce .button .alt .disabled) + 1 typ (button) = 0-4-1. Nasza
   baza wyzej ma tylko 0-3-1 (przegrywa niezaleznie od kolejnosci).
   Dopasowanie tego samego lancucha klas + dodatkowe powielenie daje
   0-5-1 - wygrywa BEZWARUNKOWO. */
body.woocommerce-page .single_add_to_cart_button.single_add_to_cart_button.single_add_to_cart_button.disabled,
body.woocommerce-page .button.button.button.disabled {
  background-color: var(--wlx-accent);
  color: #fff;
  opacity: .55;
  cursor: not-allowed;
}

/* ---------- Przyciski: WooCommerce Blocks (koszyk, zamowienie) ---------- */

/* Bez !important: jedyna konkurujaca regula w zywym DOM to
   "[type=button],[type=submit],button{color:#c36;border:1px solid
   #c36;background-color:transparent...}" z hello-elementor/reset.css -
   goly selektor typu (0 klas, 1 typ) - zweryfikowane bezposrednio w
   pobranym reset.css?ver=3.5.1 2026-09-24. Nasze selektory ponizej maja
   min. 1 klase + prefiks body.woocommerce-page, wiec biją to specyficznoscia
   bez potrzeby !important. */
body.woocommerce-page .wc-block-cart__submit-button,
body.woocommerce-page .wc-block-components-checkout-place-order-button,
body.woocommerce-page .wc-block-components-totals-coupon .wc-block-components-button {
  background-color: var(--wlx-accent);
  border-color: var(--wlx-accent);
  border-radius: 3px;
  color: #fff;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .8rem;
}

body.woocommerce-page .wc-block-cart__submit-button .wc-block-components-button__text,
body.woocommerce-page .wc-block-components-checkout-place-order-button .wc-block-components-checkout-place-order-button__text {
  color: #fff;
}

body.woocommerce-page .wc-block-cart__submit-button:hover,
body.woocommerce-page .wc-block-components-checkout-place-order-button:hover,
body.woocommerce-page .wc-block-components-totals-coupon .wc-block-components-button:hover {
  background-color: var(--wlx-accent-dark);
  border-color: var(--wlx-accent-dark);
  color: #fff;
}

/* ---------- Pola formularzy: szablony klasyczne ---------- */

/* Bez !important: rdzen ma ".woocommerce form .form-row .input-text,
   .woocommerce form .form-row select" (3 klasy + 1 typ = 0-3-1,
   zweryfikowane bezposrednio w woocommerce.css?ver=11.1.2). Powielenie
   klasy podnosi nasz selektor rowniez do 3 klas - przy remisie wygrywa
   pozniejszy w <head> arkusz (wlx-woo, priority 20). */
body.woocommerce-page .woocommerce-Input.woocommerce-Input,
body.woocommerce-page input.input-text.input-text,
body.woocommerce-page input.qty.qty,
body.woocommerce-page.woocommerce-page select {
  padding: 14px 16px;
  border: 1px solid var(--wlx-border);
  background: var(--wlx-surface);
  border-radius: 3px;
  color: var(--wlx-text);
}

/* Stan :focus pol klasycznych - rdzen (zweryfikowane w pliku): ".woocommerce
   form .form-row .input-text:focus, .woocommerce form .form-row
   select:focus{border-color:currentColor}" - USTAWIA border-color na
   currentColor, czyli na wartosc "color" elementu w tym momencie. Nasza
   baza wyzej ustawia color:var(--wlx-text), wiec bez wlasnej reguly
   :focus obramowanie i tak przeszloby na --wlx-text (ciemny granat) -
   ZGODNIE Z ZAMIERZENIEM (patrz uzasadnienie przy wersji blokowej
   nizej). Regula ponizej istnieje wylacznie zeby PRZYPIAC ten kolor
   jawnie (nie polegac cicho na przypadkowym dziedziczeniu currentColor),
   gdyby rdzen kiedys zmienil kolejnosc lub wartosc "color" w tej regule.
   Specyficznosc bazowej regule ":focus" w rdzeniu: ".form-row .input-text:focus"
   = 4 klasy (.woocommerce .form-row .input-text :focus) = 0-4-1 dla pol
   tekstowych, 0-3-2 dla select. Powielenie klasy podnosi nas ponad obie: */
body.woocommerce-page .woocommerce-Input.woocommerce-Input.woocommerce-Input:focus,
body.woocommerce-page input.input-text.input-text.input-text:focus,
body.woocommerce-page.woocommerce-page.woocommerce-page select:focus {
  border-color: var(--wlx-border);
}

/* ---------- Pola formularzy: WooCommerce Blocks (zamowienie) ---------- */

/* Bez !important: rdzen (packages-style.css?ver=wc-11.1.2, zweryfikowane
   bezposrednio) ma DWIE rownolegle regule bazowe o tej samej tresci:
   ".wc-block-components-form .wc-block-components-text-input
   input[type=email]" (3 klasy: form, text-input, [type=email] + 1 typ
   input = 0-3-1) ORAZ krotsza ".wc-block-components-text-input
   input[type=email]" (2 klasy + 1 typ = 0-2-1) - obie ustawiaja te same
   wlasciwosci wizualne, wygrywa ta z wyzsza specyficznoscia (pierwsza).
   Powielenie klasy ".wc-block-components-text-input" podnosi nas do 3
   klas i wygrywa liczba typow (input+body=2 > input=1). */
body.woocommerce-page .wc-block-components-text-input.wc-block-components-text-input input,
body.woocommerce-page .wc-blocks-components-select__select,
body.woocommerce-page .wc-block-components-quantity-selector {
  border-color: var(--wlx-border);
  background: var(--wlx-surface);
  border-radius: 3px;
}
/* Nie stylujemy oddzielnie .wc-block-components-quantity-selector__input -
   rdzen ustawia mu border-width:0 (border-style:none), wiec kolor
   obramowania i tak nigdy sie nie renderuje; widoczna ramka to ta na
   .wc-block-components-quantity-selector (wrapper), juz pokryta wyzej. */

/* Stan :focus - rdzen (zweryfikowane w packages-style.css) ustawia
   "border:1.5px solid" BEZ koloru w tej samej regule co "color:#2b2d2f" -
   czyli border-color przechodzi na currentColor = #2b2d2f (ciemnoszary
   rdzenia, nie nasz --wlx-border) I NADPISUJE nasza baze powyzej, bo ma
   wyzsza specyficznosc: ".wc-block-components-form .wc-block-components-
   text-input input[type=email]:focus" (4 klasy: form, text-input,
   [type=email], :focus) = 0-4-1, nasza baza wyzej ma tylko 0-3-2 (2 typy:
   body+input, 3 klasy) - PRZEGRYWA. Powielenie klasy jeszcze raz podnosi
   nas do 0-5-2 - wygrana bezwarunkowa. Kolor: zostaje --wlx-border (nie
   inny akcent) - stan focus jest juz sygnalizowany natywnym
   outline/box-shadow przegladarki (focus-visible w reset.css), wiec
   zmiana koloru ramki nie jest potrzebna do odroznienia stanu. */
body.woocommerce-page .wc-block-components-text-input.wc-block-components-text-input.wc-block-components-text-input input:focus {
  border-color: var(--wlx-border);
}

body.woocommerce-page .wc-block-components-text-input label,
body.woocommerce-page .wc-blocks-components-select__label {
  color: var(--wlx-text);
}

/* ---------- Koszyk (WooCommerce Blocks) ---------- */

/* Nie stylujemy obramowania .wc-block-cart-items__header / __row: rdzen
   (zweryfikowane w cart.css?ver=wc-11.1.2) ustawia je TYLKO na wierszach,
   ktore nie sa :last-child, z separatorem opartym o currentColor 20%
   (neutralny, dziedziczy z tekstu) i bardzo wysoka specyficznoscia
   (".wc-block-cart table.wc-block-cart-items:not(.wc-block-mini-cart-items)
   :not(:last-child) .wc-block-cart-items__row" = 5 klas + 1 typ = 0-5-1).
   Pobicie tego bez !important wymagaloby absurdalnego powielenia klas dla
   efektu czysto kosmetycznego (separator i tak jest neutralny wizualnie) -
   swiadomie NIE nadpisujemy, zeby nie zostawiac reguly ktora i tak
   przegrywa (cichy fail rowny temu, przed ktorym ostrzega brief). */

/* Bez !important: rdzen (zweryfikowane w cart.css) ma "color:inherit" na
   selektorze "table.wc-block-cart-items .wc-block-cart-items__row
   .wc-block-cart-item__quantity .wc-block-cart-item__remove-link" = 4 klasy
   + 1 typ (table) = 0-4-1 - WYZSZA niz nasza pierwotna proba (0-2-1,
   cicho przegrywala - zlapane pomiarem getComputedStyle, NIE grepem).
   UWAGA WAZNA (zlapana tym samym pomiarem): na stronie koszyka arkusze
   WooCommerce Blocks (wc-blocks.css, cart.css, packages-style.css)
   LADUJA SIE PO wlx-woo mimo enqueue z priority 20 - Woo Blocks
   wstrzykuje je w trakcie renderowania bloku, pozniej niz standardowy
   'wp_enqueue_scripts'. Zweryfikowane bezposrednio przez
   document.styleSheets w zywej przegladarce: wlx-woo na indeksie 10,
   cart.css/packages-style.css na indeksach 27-28. Przy remisie
   specyficznosci (0-4-1=0-4-1) WYGRYWA WIEC RDZEN, nie my - poczwórne
   powielenie klasy remove-link daje 0-5-1, wygrana BEZWARUNKOWA
   niezaleznie od kolejnosci w <head>. */
body.woocommerce-page .wc-block-cart-item__remove-link.wc-block-cart-item__remove-link.wc-block-cart-item__remove-link.wc-block-cart-item__remove-link {
  color: var(--wlx-accent);
}

body.woocommerce-page .wc-block-components-sidebar,
body.woocommerce-page .wc-block-cart__sidebar,
body.woocommerce-page .wc-block-checkout__sidebar {
  background: var(--wlx-bg-soft);
  border-radius: 3px;
}

body.woocommerce-page .wc-block-components-totals-item__label,
body.woocommerce-page .wc-block-components-totals-footer-item {
  color: var(--wlx-text);
}

/* ---------- Zamowienie (WooCommerce Blocks) ---------- */

body.woocommerce-page .wc-block-components-checkout-step__heading-content {
  border-bottom: 1px solid var(--wlx-border);
}

body.woocommerce-page .wc-block-components-checkout-order-summary__content,
body.woocommerce-page .wc-block-components-order-summary-item {
  background: var(--wlx-bg-soft-2);
}

body.woocommerce-page .wc-block-components-checkbox__mark {
  border-color: var(--wlx-border);
}

/* ---------- Komunikaty ---------- */

/* Rdzen (zweryfikowane w woocommerce.css?ver=11.1.2): ".woocommerce-error,
   .woocommerce-info,.woocommerce-message{...border-top:3px solid
   #720eec...}" - 1 klasa, 0 typow = 0-1-0. Nasz prefiks body.woocommerce-page
   podnosi do 0-2-1, wygrywa bez !important. */
body.woocommerce-page .woocommerce-message,
body.woocommerce-page .woocommerce-info {
  border-top: 3px solid var(--wlx-accent);
  background: var(--wlx-bg-soft);
  color: var(--wlx-text);
}

body.woocommerce-page .woocommerce-error {
  border-top: 3px solid #b02a2a;
  background: var(--wlx-bg-soft);
  color: var(--wlx-text);
}

body.woocommerce-page .woocommerce-message::before,
body.woocommerce-page .woocommerce-info::before {
  color: var(--wlx-accent);
}

body.woocommerce-page .wc-block-components-notice-banner {
  background: var(--wlx-bg-soft);
  border-color: var(--wlx-border);
  color: var(--wlx-text);
}

/* ---------- Produkt: okruszki, meta, podobne produkty ---------- */

body.woocommerce-page .woocommerce-breadcrumb {
  color: var(--wlx-text);
}

body.woocommerce-page .woocommerce-breadcrumb a {
  color: var(--wlx-accent);
}

body.woocommerce-page .product_meta {
  color: var(--wlx-text);
  border-top: 1px solid var(--wlx-border);
  padding-top: 12px;
}

body.woocommerce-page .related.products .woocommerce-loop-product__title {
  font-family: var(--wlx-font);
  color: var(--wlx-text);
}

/* ---------- Moje konto: logowanie ---------- */

body.woocommerce-page .woocommerce-form-login {
  background: var(--wlx-surface);
  border: 1px solid var(--wlx-border);
  border-radius: 3px;
  padding: 24px;
}

/* ---------- Moje konto: tabele klasyczne (zamowienia, metody platnosci) ----------
   templates/myaccount/orders.php i payment-methods.php renderuja klasyczna
   <table class="... shop_table ...">, NIE blok - zweryfikowane w realnym
   DOM produkcji z zamowieniem testowym (Zadanie 20). */

/* Bez !important: rdzen (zweryfikowane bezposrednio w woocommerce.css)
   ma ".woocommerce table.shop_table{border:1px solid color-mix(in srgb,
   currentColor 20%,transparent);...border-radius:5px}" - 2 klasy
   (.woocommerce .shop_table) + 1 typ (table) = 0-2-1. Powielenie klasy
   ".shop_table" podnosi nas do 3 klas - wygrywamy niezaleznie od
   kolejnosci w <head> (3 klasy > 2 klasy, bez potrzeby patrzec na typy). */
body.woocommerce-page table.shop_table.shop_table {
  border: 1px solid var(--wlx-border);
  border-collapse: collapse;
  width: 100%;
}

body.woocommerce-page table.shop_table.shop_table th,
body.woocommerce-page table.shop_table.shop_table td {
  border: 1px solid var(--wlx-border);
  padding: 12px 16px;
}

body.woocommerce-page table.shop_table.shop_table th {
  background: var(--wlx-bg-soft);
  color: var(--wlx-text);
  font-family: var(--wlx-font);
  font-weight: 600;
}

/* Gorna krawedz pierwszego wiersza naglowka ma w reset.css osobna, bardzo
   specyficzna regule: "table thead:first-child tr:first-child
   th{border-block-start:1px solid hsla(0,0%,50%,.502)}" (specyficznosc
   0-2-4: dwa :first-child + 4 typy table/thead/tr/th, zweryfikowane
   bezposrednio w reset.css?ver=3.5.1). Dopasowanie tego samego lancucha
   selektorow (thead th zamiast samego th) podnosi nasza regule do tej
   samej specyficznosci - przy remisie wygrywa pozniej zaladowany
   wlx-woo (reset.css motywu laduje sie przed WooCommerce i przed
   wtyczka). */
body.woocommerce-page table.shop_table.shop_table thead th {
  border-top-color: var(--wlx-border);
}

/* ---------- Responsywnosc mobilna ---------- */

@media (max-width: 767px) {
  body.woocommerce-page .button,
  body.woocommerce-page a.button,
  body.woocommerce-page .single_add_to_cart_button {
    width: 100%;
    text-align: center;
  }
}