/*
 * Aktywnie w Terenie — tylko to, czego bloki WP 7.1 nie robią natywnie.
 * Reszta (kolory, typografia, odstępy, layout) jest w theme.json.
 */

/* Kotwice pod sticky header */
html { scroll-behavior: smooth; }
:target { scroll-margin-top: 90px; }

/* Długie słowa / adresy nie rozpychają layoutu */
h1, h2, h3, h4, p, li, figcaption, .wp-block-navigation-item__label { overflow-wrap: break-word; }

/* --- Sticky header: blur + półprzezroczyste tło ---
 * ponytail: backdrop-filter nie jest opcją bloku w WP 7.1. Sticky musi siedzieć
 * na elemencie <header> (template part), nie na grupie w środku — inaczej
 * przykleja się tylko na wysokość własnego boksu. Pasek pełnej szerokości,
 * treść w kontenerze robi grupa .site-header > .alignwide.
 * UWAGA: backdrop-filter/blur NIE może być na samym <header> — element z
 * backdrop-filter staje się blokiem zawierającym dla position:fixed potomków,
 * co uwięziłoby pełnoekranowy overlay menu w pasku (menu "nie otwierało się").
 * Dlatego tło + blur są na ::before (pseudo bez potomków), a <header> zostaje
 * czysty. */
header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
	border-bottom: 1px solid var(--wp--preset--color--hairline);
}
header.wp-block-template-part::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--wp--preset--color--header-bg);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	pointer-events: none;
}

/* Aktywna zakładka w menu — WP nie stylizuje current-menu-item z theme.json */
.wp-block-navigation .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--accent);
	background: rgba(199, 214, 79, 0.14);
	border: 1px solid rgba(199, 214, 79, 0.4);
	border-radius: 2px;
}
.wp-block-navigation .wp-block-navigation-item__content {
	padding: 9px 14px;
	border: 1px solid transparent;
	border-radius: 2px;
}
.wp-block-navigation .wp-block-navigation-item__content:hover {
	border-color: var(--wp--preset--color--hairline-strong);
}

/* --- Menu mobilne: pełnoekranowy overlay (jak szalunki.stojeden.pl) ---
 * ponytail: nie walczymy z core/navigation — tło i kolor tekstu overlaya idą
 * z atrybutów bloku w parts/header.html (overlayBackgroundColor:"base" /
 * overlayTextColor:"contrast" → klasy .has-*-color z !important biją domyślne
 * białe tło rdzenia). core (Interactivity API) daje otwórz/zamknij/Esc/
 * focus-trap i blokadę scrolla (html.has-modal-open). Tu zostaje sam układ:
 * logo (wp:site-title .awt-menu-logo, pierwszy element menu #59) na górze,
 * pod nim wyśrodkowane pozycje menu. */

/* logo widoczne tylko w otwartym overlayu — poza nim pasek ma własny wordmark */
.wp-block-navigation__container > li:has(.awt-menu-logo) { display: none; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li:has(.awt-menu-logo) {
	display: block;
	margin-bottom: 6px;
}
.wp-block-navigation__responsive-container.is-menu-open .awt-menu-logo {
	font-size: 20px;
	text-align: center;
}
.wp-block-navigation__responsive-container.is-menu-open .awt-menu-logo a {
	color: var(--wp--preset--color--contrast);
}

/* zawartość overlaya: pion, wyśrodkowana (core domyślnie wyrównuje do prawej —
   dziedziczy justyfikację desktopowego menu) */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	width: 100%;
	min-height: 72vh;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: center;
	gap: 4px;
	width: 100%;
	text-align: center;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: auto;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 22px;
	padding: 10px 16px;
	border: 1px solid transparent;
	border-radius: 2px;
}

/* przycisk zamknięcia (X) — odsunięty od krawędzi, w kolorze tekstu */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: clamp(14px, 4vw, 22px);
	right: clamp(14px, 4vw, 22px);
	padding: 4px;
	color: var(--wp--preset--color--contrast);
}

/* --- Karta: hover rozjaśnia krawędź (theme.json :hover działa tylko dla button/link) --- */
.wp-block-group.is-style-card {
	background: var(--wp--preset--color--card);
	border: 1px solid var(--wp--preset--color--hairline);
	border-radius: 3px;
	transition: border-color 0.15s ease;
}
.wp-block-group.is-style-card:hover,
a:hover > .wp-block-group.is-style-card,
.wp-block-post:hover .wp-block-group.is-style-card {
	border-color: rgba(199, 214, 79, 0.45);
}

/* --- Pasek faktów: pionowe kreski między kolumnami --- */
.wp-block-columns.is-style-fakty { gap: 0; }
.wp-block-columns.is-style-fakty > .wp-block-column {
	padding: 26px clamp(16px, 3vw, 34px);
}
.wp-block-columns.is-style-fakty > .wp-block-column + .wp-block-column {
	border-left: 1px solid rgba(199, 214, 79, 0.12);
}
@media (max-width: 781px) {
	.wp-block-columns.is-style-fakty > .wp-block-column + .wp-block-column {
		border-left: 0;
		border-top: 1px solid rgba(199, 214, 79, 0.12);
	}
}

/* --- Galeria: siatka auto-fit + podpis w gradiencie ---
 * ponytail: core/gallery nie robi kadru 4/5 z podpisem na zdjęciu.
 * Group(grid) + Image(kadr) + ten CSS na figcaption. */
.wp-block-group.is-style-galeria {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
	gap: 8px;
}
.wp-block-group.is-style-galeria .wp-block-image {
	position: relative;
	margin: 0;
	border-radius: 2px;
	overflow: hidden;
}
.wp-block-group.is-style-galeria .wp-block-image img {
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}
.wp-block-group.is-style-galeria figcaption {
	position: absolute;
	inset: auto 0 0 0;
	margin: 0;
	padding: 24px 14px 12px;
	background: linear-gradient(to top, rgba(10, 16, 9, 0.88), transparent);
	font-family: var(--wp--preset--font-family--heading);
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--contrast);
}

/* --- Blog: miniatura kompaktowego wpisu 74×74 --- */
.awt-blog-compact .wp-block-post-featured-image {
	flex: none;
	width: 74px;
}
.awt-blog-compact .wp-block-post-featured-image img {
	width: 74px;
	height: 74px;
	object-fit: cover;
	border-radius: 2px;
}
/* kolumna tekstu musi móc się zwężać, inaczej robi overflow w flex:nowrap */
.awt-blog-compact > .wp-block-group { min-width: 0; }
.awt-blog-compact .wp-block-post-title,
.awt-blog-compact .wp-block-post-excerpt { overflow-wrap: anywhere; }

/* --- Contact Form 7: styl z tokenów theme.json --- */
.wpcf7-form { max-width: 100%; }
.wpcf7-form input,
.wpcf7-form textarea,
.wpcf7-form select {
	box-sizing: border-box;
	max-width: 100%;
	min-width: 0;
}
/* fieldset z ukrytymi polami ma domyślnie min-width:min-content — psuje flex/grid */
.wpcf7-form fieldset {
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}
.wpcf7-form .hidden-fields-container { display: contents; }
.wpcf7-form p { margin: 0 0 14px; }
.wpcf7-form label {
	display: flex;
	flex-direction: column;
	gap: 7px;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--faint);
}
.wpcf7-form .wpcf7-form-control-wrap { display: block; }
.wpcf7-form input:not([type="submit"]),
.wpcf7-form textarea {
	width: 100%;
	padding: 13px 14px;
	background: var(--wp--preset--color--base);
	border: 1px solid rgba(232, 236, 228, 0.18);
	border-radius: 2px;
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--body);
	font-size: 15px;
}
.wpcf7-form textarea { resize: vertical; }
.wpcf7-form input:focus-visible,
.wpcf7-form textarea:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 1px;
}
.wpcf7-form input[type="submit"] {
	margin-top: 4px;
	padding: 15px 26px;
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	border: 0;
	border-radius: 2px;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 14px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	cursor: pointer;
}
.wpcf7-form input[type="submit"]:hover {
	background: var(--wp--preset--color--accent-hover);
}
.wpcf7 .wpcf7-response-output {
	margin: 12px 0 0;
	padding: 10px 14px;
	border-radius: 2px;
	font-size: 14px;
}

/* Newsletter — input + przycisk w jednej linii (CF7 daje jeden <p> z <br>) */
.awt-newsletter .wpcf7-form > p {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
}
.awt-newsletter .wpcf7-form br { display: none; }
.awt-newsletter .wpcf7-form .wpcf7-form-control-wrap {
	flex: 1 1 220px;
	min-width: 0;
}
.awt-newsletter .wpcf7-form input[type="submit"] {
	flex: 0 0 auto;
	margin-top: 0;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--accent);
}
.awt-newsletter .wpcf7-form input[type="submit"]:hover {
	background: var(--wp--preset--color--surface);
}
.awt-newsletter .wpcf7-response-output { flex-basis: 100%; }

/* --- Komponenty, których blok nie wyraża jednym atrybutem
 * (kolor kreski = preset, ale krawędź per-strona / pigułka / panel to CSS) --- */
.awt-fakty-band {
	border-top: 1px solid var(--wp--preset--color--hairline);
	border-bottom: 1px solid var(--wp--preset--color--hairline);
}
.awt-tag {
	border: 1px solid var(--wp--preset--color--hairline-strong);
	border-radius: 999px;
	padding: 8px 14px;
}
.awt-contact-box {
	padding: clamp(22px, 3vw, 34px);
	border: 1px solid var(--wp--preset--color--hairline);
	border-radius: 3px;
	background: var(--wp--preset--color--panel);
}

/* --- O nas: obraz w Media & Text bez imageFill (klasy imageFill są niestabilne).
 * object-fit na potomku to jedyne, czego blok nie zrobi z panelu. --- */
.awt-onas .wp-block-media-text__media img {
	width: 100%;
	height: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
}
@media (max-width: 781px) {
	.awt-onas .wp-block-media-text__media img { aspect-ratio: 16 / 10; }
}