/* Style bazowe motywu Leczenie przepukliny.
   Wartosci pochodza z presetow theme.json, nie z przypadkowych pikseli. */

:root {
	--lp-przejscie: var(--wp--custom--przejscie, 180ms ease);
}

/* Brak poziomego przewijania na kazdym ekranie. */
html {
	-webkit-text-size-adjust: 100%;
}

body {
	overflow-x: clip;
	text-wrap: pretty;
}

/* Naglowki nie powinny lamac sie na pojedyncze sieroty. */
h1, h2, h3, h4 {
	text-wrap: balance;
}

/* Dlugosc wiersza w tekscie ciaglym: okolo 65 znakow. */
.wp-block-post-content > p,
.lp-tresc p {
	max-width: 65ch;
}

/* Widoczny focus w kolorze akcji. Nigdy outline: none bez alternatywy. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--turkus);
	outline-offset: 3px;
	border-radius: 4px;
}

/* Sticky header nie moze zaslaniac elementu, ktory wlasnie dostal fokus (WCAG 2.2). */
html {
	scroll-padding-top: 104px;
}

/* Link pomijania nawigacji. */
.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
}

.skip-link:focus {
	left: 16px;
	top: 16px;
	padding: 12px 20px;
	background: var(--wp--preset--color--granat);
	color: var(--wp--preset--color--biel);
	border-radius: var(--wp--custom--promien--przycisk);
	text-decoration: none;
	font-weight: 700;
}

/* Nawigacja zachowuje komfortowy obszar dotykowy.
   Przycisk ma wysokosc wynikajaca z paddingu zdefiniowanego w theme.json. */
.wp-block-navigation a {
	min-height: 44px;
}

.wp-block-button__link,
.wp-block-navigation a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--wp--preset--spacing--20);
	transition: background-color var(--lp-przejscie), color var(--lp-przejscie), border-color var(--lp-przejscie);
}

/* Obrazy nie wywracaja ukladu. */
img,
svg,
video {
	max-width: 100%;
	height: auto;
}

/* Ikony dziedzicza kolor tekstu, dzieki czemu nie duplikujemy palety. */
.lp-ikona svg {
	width: 100%;
	height: 100%;
	display: block;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Szanujemy ustawienie ograniczonego ruchu. */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Tekst widoczny wylacznie dla czytnikow ekranu. */
.lp-tylko-czytnik {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Globalny odstep miedzy blokami nie obowiazuje na najwyzszym poziomie dokumentu.
   WordPress wstawia tam margines rowny blockGap, przez co naglowek, tresc i stopka
   rozsuwaja sie o 32 px. Odstepy maja pochodzic z paddingu sekcji ustawianego
   w blokach, nie z marginesu miedzy czesciami szablonu.
   Regula rdzenia uzywa :where(), wiec zwykla klasa ma nad nia pierwszenstwo. */
.wp-site-blocks > * {
	margin-block-start: 0;
	margin-block-end: 0;
}