/* I-Materac: karta produktu, dopelnienie regul wycietych z Favou (css/favou-karta.css). Pisane recznie. */

/* Powiazane produkty: rzad przewijany palcem zamiast karuzeli slick (4 w rzedzie, 2 na telefonie) */
.im-karta .products-list.grid.im-rzad { display: flex; flex-wrap: nowrap; gap: 30px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.im-rzad::-webkit-scrollbar { display: none; }
.im-karta .products-list.grid.im-rzad > .products-entry { flex: 0 0 calc((100% - 90px) / 4); min-width: 0; margin-bottom: 0; scroll-snap-align: start; }
.im-rzad-ze-strzalkami { position: relative; }
.im-rzad__btn { position: absolute; top: calc(50% - 45px); z-index: 2; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, .12); color: #121212; cursor: pointer; }
.im-rzad__btn::before { content: ""; display: block; width: 8px; height: 8px; margin: 0 auto; border: solid currentColor; border-width: 0 0 1.5px 1.5px; transform: translateX(2px) rotate(45deg); }
.im-rzad__btn--wstecz { left: -15px; }
.im-rzad__btn--dalej { right: -15px; }
.im-rzad__btn--dalej::before { transform: translateX(-2px) rotate(-135deg); }
.im-rzad__btn:hover { background: #db9b2e; color: #fff; }
.im-rzad__btn:disabled { opacity: 0; pointer-events: none; }
@media (max-width: 991px) {
	.im-karta .products-list.grid.im-rzad { gap: 20px; }
	.im-karta .products-list.grid.im-rzad > .products-entry { flex-basis: calc((100% - 20px) / 2); }
	.im-rzad__btn { display: none; }
}

/* Odstep miedzy okruszkami a trescia (w Favou dawal go pasek tytulu) i pod powiazanymi */
.im-karta .contents-detail { padding-top: 24px; }
.im-karta .related { padding-bottom: 50px; }
@media (max-width: 991px) { .im-karta .contents-detail { padding-top: 14px; } }

/* Warianty: aktualny szablon WooCommerce ma etykiete w <th class="label">, stary szablon Favou mial <td>.
 * Te same wartosci co w regule Favou dla td. */
.single-product .product-type-variable .variations_form.cart table tr th { display: block; width: 100%; margin-bottom: 20px !important; padding: 0; border: 0; background: none; font-size: 14px; text-align: left; }

/* Przelacznik wariantow: przyciski rozmiarow zostaja tej samej szerokosci co w siatce wtyczki (5 w rzedzie, 3 na telefonie),
   a dluzsze nazwy ("Pianka, kokos, gryka") poszerzaja swoj przycisk zamiast lamac sie na trzy linie. */
body .product-variants-switcher .variants-grid { display: flex; flex-wrap: wrap; gap: 12px; }
body .product-variants-switcher .variants-grid .variant-button { flex: 0 0 auto; min-width: calc((100% - 48px) / 5); max-width: 100%; white-space: nowrap; }
@media (max-width: 767px) {
	body .product-variants-switcher .variants-grid .variant-button { min-width: calc((100% - 24px) / 3); padding: 6px 10px; }
}

/* Warianty WooCommerce jako przyciski w okienku przelacznika (js/karta.js, Hybrid 17-10-2026): lista rozwijana i drugi wiersz ceny
   pod nia schowane, cene wariantu pokazuje ramka ceny. Przycisk <button> dostaje krój i kolor jak link przelacznika. */
.single-product form.variations_form.im-warianty table.variations,
.single-product form.variations_form.im-warianty .woocommerce-variation-price { display: none !important; }
body .product-variants-switcher button.variant-button { font-family: inherit; cursor: pointer; } /* rozmiar, grubosc i kolor napisu z reguly wtyczki dla .variant-button */
body .product-variants-switcher button.variant-button.current { cursor: default; }
body .product-variants-switcher button.variant-button:disabled:not(.current) { opacity: .45; cursor: not-allowed; }

/* Raty i platnosci odroczone w ramce ceny (inc/karta.php imaterac_raty_karta, js/karta.js). Od 02-11-2026 ponizej 500 zl zdanie
   "Kup teraz, zapłać za 30 dni z [PayPo] lub 3 x Y z [Klarna] (jak to działa?).", od 500 zl trzy rowne kafle PayPo / Klarna / raty 0%.
   Okna "Kup teraz, zapłać później" i "oblicz ratę" (Santander, kalkulator css/kalkulator.css). Reguly .im-raty-linia__santander /
   __klarna: stary wiersz z 21-10-2026 w kopiach kart z cache NitroPacka (do usuniecia ok. 2 tyg. po wgraniu). */
.im-raty-linia { margin: 6px 0 2px; font-size: 15.5px; line-height: 1.7; color: #222; }
.im-raty-linia strong { font-weight: inherit; color: inherit; } /* kwoty bez pogrubienia (Konrad 21-10-2026: za bardzo odciagaly uwage) */
.im-raty-linia .amount { font-weight: inherit; }
.im-raty-linia [hidden] { display: none !important; }
.im-raty-linia__nawias { white-space: nowrap; }
.im-raty-linia__link { margin: 0; padding: 0; border: 0; background: none; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.im-raty-linia__link:hover { color: var(--im-zloto-ciemne, #a8741c); }
.im-klarna__logo { display: inline-block; padding: 0 6px; border-radius: 4px; background: #ffb3c7; color: #0b051d; font-size: 11.5px; font-weight: 800; line-height: 19px; letter-spacing: -.01em; vertical-align: 1px; }
.im-raty-linia { flex: 1 1 100%; min-width: 0; } /* rodzic .wcpb-klarna-row to flex w wierszu: bez tego kafle sciska do tresci */
.im-raty-linia__kwota { white-space: nowrap; }
.im-raty-logo { display: inline-block; width: auto; height: 16px; vertical-align: -2px; }
.im-raty-kafle__tytul { margin: 0 0 6px; }
.im-raty-kafle__rzad { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 8px; }
.im-raty-linia .im-raty-kafel { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; height: auto; margin: 0; padding: 9px 11px 8px; border: 1px solid #e3dfd8; border-radius: 10px; background: #fff; box-shadow: none; font: inherit; font-size: 14px; line-height: 1.35; letter-spacing: normal; text-transform: none; text-align: left; color: #222; cursor: pointer; transition: border-color .15s; }
.im-raty-linia .im-raty-kafel:hover, .im-raty-linia .im-raty-kafel:focus-visible { border-color: var(--im-zloto, #db9b2e); background: #fff; color: #222; }
.im-raty-kafel__logo { display: flex; align-items: center; height: 26px; margin-bottom: 4px; }
.im-raty-kafel__img { display: block; width: auto; height: 18px; }
.im-raty-kafel__img--santander { height: 26px; }
.im-raty-kafel__logo .im-klarna__logo { padding: 0 8px; font-size: 13px; line-height: 22px; } /* na wysokosc logo PayPo i Santandera obok */
.im-raty-kafel__tekst { white-space: nowrap; }
.im-raty-kafel__drobne { font-size: 12.5px; color: #666; }
.im-klarna-okno__opcje li[hidden] { display: none; }
.im-pozniej-okno__img { display: block; flex: none; width: auto; height: 18px; margin-top: 2px; }
.im-pozniej-okno__img--santander { height: 26px; margin-top: -2px; }
.im-klarna-okno__opcje .im-raty-linia__link { font-size: inherit; color: #444; }
/* stary wiersz Klarny w kopiach kart z cache NitroPacka sprzed 21-10-2026 (do usuniecia po 04-11-2026) */
.im-klarna { margin: 2px 0 2px; font-size: 13.5px; line-height: 1.7; color: #333; }
.im-klarna .amount { font-weight: 400; }
.im-klarna__plany { margin: 0 0 0 4px; padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: #1a1a1a; text-decoration: underline dotted; text-underline-offset: 3px; cursor: pointer; }
.im-klarna-okno.im-santander-okno { width: min(880px, calc(100% - 24px)); overflow-y: auto; } /* dwie klasy: wygrywa z szerokoscia okna Klarny nizej */
.im-santander-okno__tytul { display: flex; align-items: center; gap: 16px; min-width: 0; }
.im-santander-okno__tytul img { display: block; flex: none; width: auto; height: 34px; padding-right: 16px; border-right: 1px solid #e9e6e1; }
.im-santander-okno .im-i-kalk { box-shadow: none; }
.im-santander-okno .im-i-kalk p { margin: 0; }
@media (max-width: 767px) {
	.im-raty-linia { font-size: 14px; line-height: 1.6; } /* jak "Oszczędzasz" i dostepnosc obok (Konrad 21-10-2026: na telefonie za duze) */
	.im-raty-linia__santander:not([hidden]) + .im-raty-linia__klarna { display: block; }
	.im-raty-kafle__rzad { gap: 6px; }
	.im-raty-linia .im-raty-kafel { padding: 8px 8px 7px; font-size: 13px; }
	.im-raty-kafel__drobne { font-size: 12px; }
	.im-raty-kafel__img { height: 16px; }
	.im-raty-kafel__img--santander { height: 24px; }
	.im-santander-okno__tytul img { height: 26px; padding-right: 12px; }
	.im-santander-okno .im-klarna-okno__srodek { padding: 18px 14px; }
}
.im-klarna-okno { width: min(560px, calc(100% - 24px)); max-width: none; max-height: calc(100% - 24px); padding: 0; border: 0; border-radius: 18px; background: #fff; color: #1a1a1a; box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
.im-klarna-okno::backdrop { background: rgba(20, 16, 12, .55); }
.im-klarna-okno__srodek { padding: 24px; font-size: 14.5px; line-height: 1.55; }
.im-klarna-okno__glowa { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.im-klarna-okno h2 { margin: 0; font-size: 20px; line-height: 1.3; font-weight: 600; color: #1a1a1a; }
.im-klarna-okno__zamknij { display: flex; flex: none; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0; border: 1px solid #ddd; border-radius: 8px; background: #fff; color: #1a1a1a; cursor: pointer; }
.im-klarna-okno p { margin: 0 0 14px; }
.im-klarna-okno__cena { font-size: 13px; font-weight: 600; color: #555; }
.im-klarna-okno__opcje { margin: 0 0 14px; padding: 0; list-style: none; }
.im-klarna-okno__opcje li { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 0 0 8px; padding: 13px 14px; border-radius: 10px; background: #f6f5f3; }
.im-klarna-okno__opcje li::before { display: none; }
.im-klarna-okno__opcje strong { display: block; font-weight: 600; }
.im-klarna-okno__opcje small { display: block; margin-top: 6px; font-size: 12.5px; color: #666; }
.im-klarna-okno__opcje .amount { font-weight: inherit; }
.im-klarna-okno__uwaga { margin-bottom: 0 !important; padding: 10px 14px; border-radius: 10px; background: #f6f5f3; font-size: 12.5px; color: #666; }
.im-klarna-okno__uwaga a { color: #444; text-decoration: underline; }

/* Ocena bez licznika "osób kupiło" (licznik schowany przy braku sprzedazy, inc/karta.php): bez kreski oddzielajacej (regula wtyczki wc-price-box) */
.pcb-subheader .woocommerce-product-rating:last-child { border-right: 0; padding-right: 0; }