/**
 * Podkład pod treść tam, gdzie nie ma układu Elementora.
 *
 * Zestaw stylów Elementora (kit 10531) ustawia na `body` wartości, które mają
 * sens tylko wtedy, gdy każdy widget i tak nadpisuje je swoimi:
 *
 *     font-size: 15px;  line-height: 15px
 *     a  { font-size: 14px; text-transform: uppercase }
 *     h1 { font-size: 10px }
 *
 * Interlinia równa wielkości pisma skleja wiersze, nagłówek pierwszego stopnia
 * ma dziesięć pikseli, a wszystkie linki lecą wersalikami. Strony budowane
 * Elementorem tego nie pokazują. Wpisy blogowe bez Elementora (273 na produkcji),
 * archiwa kategorii i tagów oraz strona 404 dziedziczą to wprost.
 *
 * Zakres ograniczamy klasą, którą Elementor dokłada do `body` na dokumentach
 * z własnym układem: `elementor-page-<ID>`. Jej BRAK znaczy „ten widok nie ma
 * layoutu" i tylko tam ten arkusz działa. Klasa `hello-elementor-default` do
 * tego NIE służy — siedzi także na `/sklep/`, `/produkt/…` i `/moje-konto/`,
 * czyli tam, gdzie layout jest.
 *
 * Strony WooCommerce (koszyk, zamówienie, moje konto) są z tego wyłączone
 * klasą `.woocommerce-page`: mają własny, szeroki układ z `baba-koszyk`,
 * a kolumna 760 px ścisnęłaby je do połowy. Biel tła zostaje im dana, bo
 * nie szkodzi nigdzie.
 *
 * Tło zerujemy mimo że kit ma już biel — to pas bezpieczeństwa. Gdyby ktoś
 * kiedyś przywrócił w kicie zielony gradient, te widoki nie mają własnych
 * sekcji, żeby go zakryć, i tekst znów stałby się nieczytelny.
 */

/* ====== ZAKRES I TOKENY ====== */

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) {
	--pod-ink: #142427;
	--pod-mute: #5a6a6d;
	--pod-rule: #e3e7e8;
	--pod-link: #4F1964;
	--pod-kolumna: 760px;
	--pod-fs: 17px;
	--pod-lh: 1.65;
}

/* ====== TŁO ====== */

/* Kit maluje na `body` nie tylko kolor, ale i `background-image` z jednolitym
   gradientem — obraz leży NAD kolorem, więc sama biel pod spodem nic nie daje.
   Stąd oba wiersze; ten sam wzorzec co w `baba-koszyk.css`. */
body:not( [class*="elementor-page-"] ) {
	background-color: #fff;
	background-image: none;
}

/* ====== TREŚĆ ====== */

/* Kit celuje w `.elementor-kit-10531` (jedna klasa). `body:not( [class*=…] )`
   to element plus atrybut, czyli o stopień wyżej — wygrywamy bez `!important`. */
body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) {
	font-size: var(--pod-fs);
	line-height: var(--pod-lh);
	color: var(--pod-ink);
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) {
	max-width: var(--pod-kolumna);
	margin-inline: auto;
	padding-inline: 20px;
	font-size: var(--pod-fs);
	line-height: var(--pod-lh);
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) p {
	margin: 0 0 1.15em;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) :is( ul, ol ) {
	margin: 0 0 1.15em;
	padding-left: 1.4em;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) li {
	margin-bottom: 0.4em;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) blockquote {
	margin: 1.6em 0;
	padding: 0.2em 0 0.2em 1.1em;
	border-left: 3px solid var(--pod-rule);
	color: var(--pod-mute);
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) img {
	max-width: 100%;
	height: auto;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1.4em;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) :is( th, td ) {
	padding: 8px 10px;
	border: 1px solid var(--pod-rule);
	text-align: left;
}

/* ====== NAGŁÓWKI ====== */

/* Kit daje `h1 { font-size: 10px }`, więc bez tego tytuł wpisu jest mniejszy
   od tekstu pod nim. Selektor z `body` bije kit o jeden stopień. */
body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-header, .page-content, .entry-content, .post-content ) h1 {
	font-size: 34px;
	line-height: 1.25;
	margin: 0 0 0.5em;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) h2 {
	font-size: 26px;
	line-height: 1.3;
	margin: 1.8em 0 0.5em;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) h3 {
	font-size: 21px;
	line-height: 1.35;
	margin: 1.5em 0 0.45em;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) h4 {
	font-size: 18px;
	line-height: 1.4;
	margin: 1.3em 0 0.4em;
}

/* ====== LINKI ====== */

/* Kit celuje w `.elementor-kit-10531 a` — jedna klasa i element. Dokładamy
   kontener treści, żeby mieć dwa stopnie przewagi i nie sięgać po `!important`. */
body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) a {
	font-size: inherit;
	text-transform: none;
	color: var(--pod-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* ====== NAGŁÓWEK WIDOKU I ARCHIWA ====== */

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) .page-header {
	max-width: var(--pod-kolumna);
	margin: 32px auto 24px;
	padding-inline: 20px;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ).archive .page-content > article,
body:not( [class*="elementor-page-"] ):not( .woocommerce-page ).search .page-content > article {
	padding-bottom: 22px;
	margin-bottom: 22px;
	border-bottom: 1px solid var(--pod-rule);
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ).archive .page-content > article:last-child,
body:not( [class*="elementor-page-"] ):not( .woocommerce-page ).search .page-content > article:last-child {
	border-bottom: 0;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) .page-content > article .entry-title {
	font-size: 22px;
	line-height: 1.3;
	margin: 0 0 0.35em;
}

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) .page-content > article .entry-title a {
	text-transform: none;
	text-decoration: none;
	font-size: inherit;
}

/* Nawigacja stronicowania — motyw nie daje jej żadnych odstępów. */
body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .pagination, .nav-links, .navigation ) {
	max-width: var(--pod-kolumna);
	margin: 28px auto 48px;
	padding-inline: 20px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* ====== 404 ====== */

body:not( [class*="elementor-page-"] ):not( .woocommerce-page ).error404 .page-content {
	min-height: 40vh;
	padding-block: 40px 60px;
}

/* ====== RESPONSYWNOŚĆ ====== */

@media (max-width:767px) {
	body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) {
		--pod-fs: 16px;
	}

	body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-header, .page-content, .entry-content, .post-content ) h1 {
		font-size: 27px;
	}

	body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) h2 {
		font-size: 22px;
	}

	body:not( [class*="elementor-page-"] ):not( .woocommerce-page ) :is( .page-content, .entry-content, .post-content ) h3 {
		font-size: 19px;
	}
}