/* =============================================================================
   Retrodajnia — warstwa zgodnosci dla starych silnikow przegladarek
   -----------------------------------------------------------------------------
   Powod: klientka zglosila (08.2026) rozjechany uklad w starej Operze. Silnik
   sprzed Chromium 84 ignoruje `gap` we flexboksie (menu sklejalo sie w jeden
   ciag), a sprzed Chromium 87 ignoruje skrot `inset` (slajdy hero traca
   pozycjonowanie i sekcja robi sie pusta).

   Zasady tego pliku:
   1. Nic tutaj nie zmienia wygladu w nowoczesnej przegladarce. Kazdy blok jest
      albo zapasem dla wlasciwosci, ktora stary silnik i tak odrzuca (longhandy
      zamiast `inset`, wartosc stala zamiast `clamp()`), albo siedzi w `@supports`,
      ktorego nowoczesny silnik nie spelnia.
   2. Bramka `@supports not (inset: 0px)` = Chromium < 87 / Firefox < 66 /
      Safari < 14.1. To najblizszy dostepny odpowiednik braku `gap` we flexie
      (Chromium 84). Rozjazd dotyczy wylacznie Chromium 84-86 i Firefoksa 63-65,
      ktore dostana odstepy dwukrotne zamiast pojedynczych — kosmetyka, nic sie
      nie rozpada.
   3. Plik celuje takze w klasy wnoszone przez wtyczke retrodajnia-strony
      (`.slide`, `.gal`, `.opt-list` …) — tak samo jak blok `body .drawer*`
      w theme.css. Zapas dla calej strony ma byc w jednym miejscu i dac sie
      usunac jednym ruchem, gdy przestanie byc potrzebny.
   4. Kolejnosc arkuszy nie ma tu znaczenia: stary silnik odrzuca oryginalna
      deklaracje (`inset`, `clamp()`, `min()`), wiec nie ma z czym kolidowac.

   Retrodajnia 1.14.0
   ============================================================================= */


/* -----------------------------------------------------------------------------
   1. `inset` -> longhandy (Chromium 87 / Firefox 66 / Safari 14.1)
   Bez bramki: w nowoczesnej przegladarce te cztery wartosci sa dokladnie tym,
   co i tak ustawia `inset: 0`.
   -------------------------------------------------------------------------- */
.slide,
.drawer,
.drawer__bg,
body .drawer,
body .drawer__bg,
body .drawer__panel,
.gal .galcell img {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}


/* -----------------------------------------------------------------------------
   2. `clamp()` i `min()` (Chromium 79 / Firefox 75 / Safari 13.1)
   Stary silnik odrzuca cala deklaracje, wiec bez zapasu hero traci wysokosc,
   a naglowki spadaja do rozmiaru bazowego.
   -------------------------------------------------------------------------- */
@supports not (width: min(1px, 2px)) {

	.slides { height: 520px; }

	.drawer__panel { width: 86%; max-width: 340px; }

	h1 { font-size: 40px; }
	h2 { font-size: 36px; }

	.slide__txt h1 { font-size: 46px; }
	.rtd-page h1 { font-size: 40px; }
	.rtd-search h1 { font-size: 40px; }
	.rtd-dok h1 { font-size: 40px; }
	.woocommerce-account .site-main > h1 { font-size: 34px; }
}


/* -----------------------------------------------------------------------------
   3. `gap` we flexboksie (Chromium 84 / Firefox 63 / Safari 14.1)
   `gap` w gridzie dziala od Chromium 66, wiec siatki zostawiamy w spokoju —
   zapas dotyczy wylacznie kontenerow flex.
   -------------------------------------------------------------------------- */
@supports not (inset: 0px) {

	/* --- naglowek --- */
	.nav > * + * { margin-left: 18px; }
	.menu > li + li { margin-left: 30px; }
	.tools > * + * { margin-left: 14px; }
	.burger > * + * { margin-top: 5px; }

	/* --- przyciski i pigulki --- */
	.btn > * + * { margin-left: 8px; }
	.pill > * + * { margin-left: 8px; }

	/* --- hero --- */
	.slide__cta > * + * { margin-left: 12px; }
	.dots > * + * { margin-left: 10px; }

	/* --- sekcje strony glownej --- */
	.usp__item > * + * { margin-left: 13px; }
	.stats > * + * { margin-left: 30px; }
	.head-row > * + * { margin-left: 20px; }
	.confcta__visual > * + * { margin-left: 10px; }
	.opt-row > * + * { margin-left: 34px; }
	.opt-list > * { margin: 0 10px 10px 0; }

	/* --- karty, listy, formularze --- */
	.ph > * + * { margin-top: 8px; }
	.card__body > * + * { margin-top: 6px; }
	.form > * + * { margin-top: 14px; }
	.kline > * + * { margin-left: 12px; }
	.qa button > * + * { margin-left: 16px; }
	.filters > * { margin: 0 10px 10px 0; }
	.subfilters > * { margin: 0 9px 9px 0; }
	.gcard__meta > * { margin: 0 10px 10px 0; }

	/* --- sklep, produkt, wyszukiwarka --- */
	.single-product .summary form.cart > * + * { margin-left: 12px; }
	.single-product .summary .rtd-trust__item > * + * { margin-left: 14px; }
	.single-product .flex-control-thumbs > * + * { margin-left: 10px; }
	.rtd-search__form > * + * { margin-left: 12px; }
	.rtd-scard__body > * + * { margin-top: 8px; }
	.rtd-search__pager .page-numbers > * { margin: 0 6px 6px 0; }
	.rtd-search__empty-cta > * + * { margin-left: 12px; }

	/* --- stopka --- */
	.footer ul > li + li { margin-top: 11px; }
	.socials > * + * { margin-left: 12px; }
	.pays > * { margin: 0 8px 8px 0; }
	.foot-bottom > * + * { margin-left: 16px; }

	/* --- menu mobilne (pelnoekranowe) --- */
	body .drawer__top > * + * { margin-left: 16px; }
	body .drawer__action > * + * { margin-top: 7px; }
}


/* -----------------------------------------------------------------------------
   4. `aspect-ratio` (Chromium 88 / Firefox 89 / Safari 15)
   Wiekszosc miejsc degraduje sie lagodnie (obrazek pokazuje sie w proporcji
   naturalnej). Wyjatkiem jest galeria realizacji, gdzie zdjecia sa pozycjonowane
   absolutnie — bez proporcji komorka ma zerowa wysokosc i galeria znika.
   -------------------------------------------------------------------------- */
@supports not (aspect-ratio: 1 / 1) {

	.gal .galcell { height: 0; padding-bottom: 133.333%; }
	.gal .big { height: auto; padding-bottom: 0; min-height: 320px; }
}