/*
 * Kiosk: style uzupełniające theme.json.
 * Kolory wyłącznie z presetów (--wp--preset--color--*), więc każda wariacja kolorów działa bez zmian tutaj.
 */

:root {
	--kiosk-gap: clamp(1.75rem, 1rem + 2.5vw, 3rem);
	--kiosk-ease: cubic-bezier(.2, .7, .2, 1);
	--kiosk-sticky-top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--wp--custom--header--height) + 1.25rem);
}

/* Płynne przejścia między podstronami (View Transitions), bez JS. */
@view-transition { navigation: auto; }
@media (prefers-reduced-motion: reduce) {
	@view-transition { navigation: none; }
}

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
p, li { text-wrap: pretty; }
h1, h2, h3, h4, .wp-block-post-title { text-wrap: balance; }
::selection { background: var(--wp--preset--color--tint); color: var(--wp--preset--color--contrast); }
:where(.wp-site-blocks) :focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 3px; border-radius: 2px; }

.kiosk-sr-only {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ---------- Nagłówek ---------- */
.wp-site-blocks > .kiosk-site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 50;
	background: color-mix(in srgb, var(--wp--preset--color--base) 84%, transparent);
	-webkit-backdrop-filter: saturate(1.6) blur(14px);
	backdrop-filter: saturate(1.6) blur(14px);
	border-bottom: 1px solid var(--wp--preset--color--line);
}
@media (max-width: 600px) {
	.admin-bar .wp-site-blocks > .kiosk-site-header { top: 0; }
}
.kiosk-header__inner { min-height: var(--wp--custom--header--height); gap: 1rem 1.5rem; }
.kiosk-header .wp-block-site-logo img { border-radius: var(--wp--custom--radius--sm); }
.kiosk-header .wp-block-navigation-item__content { padding-block: .35rem; position: relative; }
.kiosk-header .wp-block-navigation-item__content::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
	background: var(--wp--preset--color--accent);
	transform: scaleX(0); transform-origin: left; transition: transform .25s var(--kiosk-ease);
}
.kiosk-header .wp-block-navigation-item__content:hover::after,
.kiosk-header .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
.kiosk-header .wp-block-search__button {
	border-radius: var(--wp--custom--radius--pill); background: transparent; color: var(--wp--preset--color--contrast);
	border: 1px solid var(--wp--preset--color--line);
}
.kiosk-header .wp-block-search__input { border-radius: var(--wp--custom--radius--pill); border-color: var(--wp--preset--color--line); }

.wp-site-blocks > .kiosk-site-header + * { margin-block-start: 0; }
.kiosk-main { padding-block: clamp(1.5rem, 1rem + 2vw, 2.75rem) clamp(3rem, 2rem + 4vw, 5rem); }

/* Pasek postępu czytania: animacja sterowana przewijaniem, zero JS. */
.kiosk-progress { display: none; }
@supports (animation-timeline: scroll()) {
	.kiosk-progress {
		display: block; position: fixed; z-index: 60; left: 0; right: 0;
		top: var(--wp-admin--admin-bar--height, 0px); height: 3px; margin: 0 !important;
		background: var(--wp--preset--color--accent);
		transform-origin: 0 50%; transform: scaleX(0);
		animation: kiosk-progress linear both; animation-timeline: scroll(root);
	}
	@keyframes kiosk-progress { to { transform: scaleX(1); } }
}

/* ---------- Układ z prawym sidebarem ---------- */
.kiosk-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--kiosk-gap);
	align-items: start;
}
.kiosk-layout > * { margin-block: 0; min-width: 0; }
@media (min-width: 1000px) {
	.kiosk-layout { grid-template-columns: minmax(0, 1fr) var(--wp--custom--sidebar--width); }
	.kiosk-layout > .kiosk-sidebar { align-self: stretch; }
}
.kiosk-layout__main { display: flex; flex-direction: column; gap: var(--kiosk-gap); }
.kiosk-layout__main > * { margin-block: 0; }

.kiosk-sidebar { display: flex; flex-direction: column; gap: 2.25rem; }
.kiosk-sidebar > * { margin-block: 0; }
@media (min-width: 1000px) {
	.kiosk-sidebar { padding-left: var(--kiosk-gap); border-left: 1px solid var(--wp--preset--color--line); }
}
.kiosk-sidebar .is-style-sticky,
.kiosk-sidebar .kiosk-ad--sticky { position: sticky; top: var(--kiosk-sticky-top); }

/* ---------- Typografia pomocnicza ---------- */
.is-style-kicker {
	font-size: var(--wp--preset--font-size--x-small) !important;
	font-weight: 700; letter-spacing: .11em; text-transform: uppercase; line-height: 1.2;
}
.is-style-kicker a { color: var(--wp--preset--color--accent); text-decoration: none; }
.is-style-kicker a:first-of-type::before {
	content: ""; display: inline-block; width: .55em; height: .55em; margin-right: .55em;
	border-radius: 50%; background: currentColor; vertical-align: .06em;
}
.is-style-kicker .wp-block-post-terms__separator,
.is-style-kicker a:not(:first-of-type) { display: none; }

.is-style-pills { display: flex; flex-wrap: wrap; gap: .5rem; }
.is-style-pills .wp-block-post-terms__separator { display: none; }
.is-style-pills a {
	display: inline-block; padding: .4em .9em; border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--tint); color: var(--wp--preset--color--contrast);
	font-weight: 600; text-decoration: none; transition: background-color .2s;
}
.is-style-pills a:hover { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent-contrast); }

.wp-block-heading.is-style-section {
	font-size: var(--wp--preset--font-size--large);
	display: flex; align-items: center; gap: .9rem;
}
.wp-block-heading.is-style-section::after {
	content: ""; flex: 1; height: 1px; background: var(--wp--preset--color--line);
}
.wp-block-heading.is-style-eyebrow {
	font-family: inherit; font-size: var(--wp--preset--font-size--x-small); font-weight: 700;
	letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--muted);
}
.is-style-lead { font-size: var(--wp--preset--font-size--large); line-height: 1.5; color: var(--wp--preset--color--muted); }
.is-style-checks { list-style: none; padding-left: 0; }
.is-style-checks li { position: relative; padding-left: 1.75em; }
.is-style-checks li::before {
	content: ""; position: absolute; left: .15em; top: .45em; width: .9em; height: .5em;
	border-left: 2px solid var(--wp--preset--color--accent); border-bottom: 2px solid var(--wp--preset--color--accent);
	transform: rotate(-45deg);
}

.kiosk-meta { gap: .35rem .9rem; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.kiosk-meta > * { margin: 0; }
.kiosk-meta > * + *::before { content: "·"; margin-right: .9rem; color: var(--wp--preset--color--line); font-weight: 700; }
.kiosk-meta .wp-block-avatar + *::before { content: none; }
.kiosk-meta .wp-block-avatar img { border-radius: 50%; display: block; }

/* ---------- Karty i zdjęcia ---------- */
.wp-block-post-featured-image { overflow: hidden; border-radius: var(--wp--custom--radius--md); margin-bottom: 0; }
.wp-block-post-featured-image img { border-radius: inherit; }
.kiosk-card .wp-block-post-featured-image img { transition: transform .6s var(--kiosk-ease); }
.kiosk-card:hover .wp-block-post-featured-image img { transform: scale(1.035); }
.kiosk-card .wp-block-post-title a {
	text-decoration: underline; text-decoration-color: transparent;
	text-decoration-thickness: .06em; text-underline-offset: .14em;
	transition: text-decoration-color .2s, color .2s;
}
.kiosk-card:hover .wp-block-post-title a { text-decoration-color: currentColor; }
@media (prefers-reduced-motion: reduce) {
	.kiosk-card .wp-block-post-featured-image img { transition: none; }
	.kiosk-card:hover .wp-block-post-featured-image img { transform: none; }
}

.is-style-kiosk-card {
	background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--lg); padding: clamp(1.25rem, 1rem + 1vw, 1.75rem);
}
.is-style-kiosk-tint {
	background: var(--wp--preset--color--tint); border-radius: var(--wp--custom--radius--lg);
	padding: clamp(1.25rem, 1rem + 1vw, 1.75rem);
}

/* Czołówka (temat dnia) */
.kiosk-lead .wp-block-post-template { margin: 0; }
.kiosk-lead__item { display: grid; gap: 1.25rem 2.75rem; align-items: center; }
.kiosk-lead__item > * { margin: 0 !important; }
@media (min-width: 782px) {
	.kiosk-lead__item { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); }
}
.kiosk-lead__text { display: flex; flex-direction: column; gap: 1rem; }
.kiosk-lead__text > * { margin: 0; }
.kiosk-lead__title { font-size: var(--wp--preset--font-size--xx-large); line-height: 1.06; letter-spacing: -.02em; }
.kiosk-lead__dek { font-size: var(--wp--preset--font-size--large); line-height: 1.45; }
.kiosk-lead__dek p { margin: 0; }
.kiosk-lead { padding-bottom: var(--kiosk-gap); border-bottom: 1px solid var(--wp--preset--color--line); }

/* Rząd trzech kart */
.kiosk-row .wp-block-post-template { gap: 1.75rem; margin: 0; }
.kiosk-row .kiosk-card { display: flex; flex-direction: column; gap: .75rem; }
.kiosk-row .kiosk-card > * { margin: 0; }
.kiosk-row .wp-block-post-title { font-size: var(--wp--preset--font-size--large); line-height: 1.2; }
@media (max-width: 781px) {
	.kiosk-row .wp-block-post-template.is-layout-grid { grid-template-columns: minmax(0, 1fr); }
	.kiosk-row .kiosk-card { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); column-gap: 1rem; row-gap: .4rem; align-content: start; }
	.kiosk-row .kiosk-card .wp-block-post-featured-image { grid-row: 1 / span 3; }
	.kiosk-row .kiosk-card .wp-block-post-featured-image img { aspect-ratio: 1 !important; }
}

/* Lista wpisów: tekst + miniatura */
.kiosk-list .wp-block-post-template { margin: 0; }
.kiosk-list .wp-block-post-template > li { border-bottom: 1px solid var(--wp--preset--color--line); }
.kiosk-list .wp-block-post-template > li + li { margin-top: 0; }
.kiosk-list-item {
	display: grid; grid-template-columns: minmax(0, 1fr) clamp(6.5rem, 4rem + 9vw, 11rem);
	gap: 1.25rem 1.75rem; align-items: center; padding-block: 1.4rem;
}
.kiosk-list-item > * { margin: 0 !important; }
.kiosk-list-item__text { display: flex; flex-direction: column; gap: .55rem; }
.kiosk-list-item__text > * { margin: 0; }
.kiosk-list-item .wp-block-post-title { font-size: var(--wp--preset--font-size--large); line-height: 1.22; }
.kiosk-list-item .wp-block-post-excerpt { font-size: var(--wp--preset--font-size--small); }
.kiosk-list-item .wp-block-post-excerpt p { margin: 0; }
@media (max-width: 600px) {
	.kiosk-list-item .wp-block-post-excerpt { display: none; }
}
.kiosk-list-item:not(:has(.wp-block-post-featured-image)) { grid-template-columns: minmax(0, 1fr); }

.wp-block-query-pagination { margin-top: 2rem; gap: .5rem; }
.wp-block-query-pagination-numbers .page-numbers {
	display: inline-grid; place-items: center; min-width: 2.4rem; height: 2.4rem; padding-inline: .5rem;
	border-radius: var(--wp--custom--radius--pill); text-decoration: none; color: var(--wp--preset--color--contrast);
}
.wp-block-query-pagination-numbers .page-numbers.current { background: var(--wp--preset--color--contrast); color: var(--wp--preset--color--base); }
.wp-block-query-pagination a { text-decoration: none; }

/* Ranking z numerami (np. „Polecane” w sidebarze) */
.wp-block-post-template.is-style-ranked { counter-reset: kiosk-rank; margin: 0; }
.wp-block-post-template.is-style-ranked > li {
	counter-increment: kiosk-rank; display: grid; grid-template-columns: 2.4rem minmax(0, 1fr);
	align-items: baseline; padding-block: .85rem; border-bottom: 1px solid var(--wp--preset--color--line); margin: 0;
}
.wp-block-post-template.is-style-ranked > li::before {
	content: counter(kiosk-rank); font-size: 1.6rem; font-weight: 800; line-height: 1;
	color: var(--wp--preset--color--accent); font-variant-numeric: tabular-nums;
}
.wp-block-post-template.is-style-ranked .wp-block-post-title { font-size: 1.0625rem; line-height: 1.3; margin: 0; }
.wp-block-post-template.is-style-divided { margin: 0; }
.wp-block-post-template.is-style-divided > li { padding-block: .9rem; border-bottom: 1px solid var(--wp--preset--color--line); margin: 0; }

/* Mała pozycja z miniaturą (sidebar artykułu) */
.kiosk-mini { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: .9rem; align-items: center; }
.kiosk-mini > * { margin: 0 !important; }
.kiosk-mini .wp-block-post-featured-image { border-radius: var(--wp--custom--radius--sm); }
.kiosk-mini .wp-block-post-title { font-size: 1rem; line-height: 1.3; }

/* ---------- Artykuł ---------- */
.kiosk-article-header { display: flex; flex-direction: column; gap: 1.1rem; }
.kiosk-article-header > * { margin: 0; max-width: 54rem; }
.kiosk-article-header .wp-block-post-title { font-size: var(--wp--preset--font-size--display); }
.kiosk-dek { font-size: var(--wp--preset--font-size--large); line-height: 1.5; max-width: 44rem; }
.kiosk-dek p { margin: 0; }
.kiosk-article-image { margin-block: clamp(1.5rem, 1rem + 2vw, 2.5rem) var(--kiosk-gap) !important; }
.kiosk-article-image figcaption, .wp-block-post-featured-image figcaption { margin-top: .6rem; }

.kiosk-entry .wp-block-post-content { font-size: 1.125rem; line-height: 1.7; }
.kiosk-entry .wp-block-post-content > :first-child { margin-top: 0; }
.kiosk-entry .wp-block-post-content :where(h2) { font-size: var(--wp--preset--font-size--x-large); margin-top: 2.4em; }
.kiosk-entry .wp-block-post-content :where(h3) { font-size: var(--wp--preset--font-size--large); margin-top: 2em; }
.kiosk-entry .wp-block-post-content :where(p, li) a { text-decoration-thickness: .07em; text-underline-offset: .18em; }
.kiosk-entry .wp-block-post-content :where(figure.wp-block-table) { overflow-x: auto; }
.kiosk-entry .wp-block-post-content :where(table) { border-collapse: collapse; width: 100%; }
.kiosk-entry .wp-block-post-content :where(th, td) { border-bottom: 1px solid var(--wp--preset--color--line); padding: .6em .8em; text-align: left; }
.kiosk-entry .wp-block-post-content :where(thead th) { border-bottom: 2px solid var(--wp--preset--color--contrast); }
.kiosk-entry__after { display: flex; flex-direction: column; gap: 2.5rem; margin-top: 3rem; }
.kiosk-entry__after > * { margin: 0; }

/* Okruszki */
.kiosk-breadcrumbs { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.kiosk-breadcrumbs a { color: var(--wp--preset--color--muted); text-decoration: none; }
.kiosk-breadcrumbs a:hover { color: var(--wp--preset--color--accent); }
.kiosk-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem .5rem; }
.kiosk-breadcrumbs li + li::before { content: "/"; margin-right: .5rem; color: var(--wp--preset--color--line); }
.kiosk-breadcrumbs [aria-current] { color: var(--wp--preset--color--contrast); }
.kiosk-breadcrumbs .breadcrumb_last { color: var(--wp--preset--color--contrast); }

/* Ramka autora */
.kiosk-author {
	display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.25rem; align-items: start;
	padding: clamp(1.25rem, 1rem + 1vw, 1.75rem); border-radius: var(--wp--custom--radius--lg);
	background: var(--wp--preset--color--tint);
}
.kiosk-author__avatar img { border-radius: 50%; display: block; }
.kiosk-author__label { font-size: var(--wp--preset--font-size--x-small); font-weight: 700; letter-spacing: .11em; text-transform: uppercase; color: var(--wp--preset--color--muted); margin: 0; }
.kiosk-author__name { font-size: var(--wp--preset--font-size--large); margin: .2rem 0 .5rem; }
.kiosk-author__name a { color: inherit; text-decoration: none; }
.kiosk-author__bio { font-size: var(--wp--preset--font-size--small); }
.kiosk-author__bio p { margin: 0 0 .6em; }
.kiosk-author__links { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: var(--wp--preset--font-size--small); font-weight: 600; margin-top: .4rem; }
.kiosk-author--archive { background: transparent; padding: 0; align-items: center; }
.kiosk-author--archive .kiosk-author__name { font-size: var(--wp--preset--font-size--xx-large); }
.kiosk-author--archive .kiosk-author__bio { font-size: var(--wp--preset--font-size--medium); max-width: 44rem; }

/* Nasi eksperci */
.kiosk-experts ul { list-style: none; margin: 0; padding: 0; }
.kiosk-experts li {
	display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: .85rem; align-items: center;
	padding-block: .8rem; border-bottom: 1px solid var(--wp--preset--color--line);
}
.kiosk-experts img { border-radius: 50%; display: block; }
.kiosk-experts a { display: block; font-weight: 700; color: var(--wp--preset--color--contrast); text-decoration: none; line-height: 1.25; }
.kiosk-experts a:hover { color: var(--wp--preset--color--accent); }
.kiosk-experts span { display: block; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); line-height: 1.35; }

/* Czytaj także */
.kiosk-related__title { margin: 0 0 1.25rem; }
.kiosk-related__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: 1.5rem; list-style: none; padding: 0; margin: 0; }
.kiosk-related__grid .kiosk-card { display: flex; flex-direction: column; gap: .6rem; }
.kiosk-related__img { display: block; overflow: hidden; border-radius: var(--wp--custom--radius--md); aspect-ratio: 3 / 2; background: var(--wp--preset--color--tint); }
.kiosk-related__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s var(--kiosk-ease); }
.kiosk-card:hover .kiosk-related__img img { transform: scale(1.035); }
.kiosk-related .wp-block-post-title { font-size: 1.125rem; line-height: 1.25; margin: 0; }
.kiosk-related .wp-block-post-title a { color: var(--wp--preset--color--contrast); }

/* ---------- Slot reklamowy ---------- */
.kiosk-ad { display: flex; flex-direction: column; align-items: center; gap: .4rem; }
.kiosk-ad__label {
	font-size: .6875rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}
.kiosk-ad__slot {
	width: 100%; max-width: var(--kiosk-ad-w, 100%); aspect-ratio: var(--kiosk-ad-ratio, auto);
	min-height: var(--kiosk-ad-min, 0); display: flex; justify-content: center; align-items: center; overflow: hidden;
}
.kiosk-ad__slot > * { max-width: 100%; }
@media (max-width: 781px) { .kiosk-hide-mobile { display: none !important; } }
@media (min-width: 782px) { .kiosk-hide-desktop { display: none !important; } }

/* Edytor: podgląd slotu */
.kiosk-ad--editor {
	border: 1.5px dashed var(--wp--preset--color--muted); border-radius: var(--wp--custom--radius--md);
	padding: 1rem; align-items: stretch;
	background: repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in srgb, var(--wp--preset--color--line) 50%, transparent) 10px 11px);
}
.kiosk-ad--editor .kiosk-ad__label { align-self: flex-start; }
.kiosk-ad--editor textarea.kiosk-ad__code {
	width: 100%; min-height: 7rem; font: 13px/1.5 ui-monospace, Consolas, monospace;
	background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--sm); padding: .6rem;
}
.kiosk-placeholder {
	border: 1.5px dashed var(--wp--preset--color--line); border-radius: var(--wp--custom--radius--md);
	padding: 1rem; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small);
}

/* ---------- Komentarze ---------- */
.kiosk-comments { margin-top: 1rem; }
.kiosk-comment { padding-block: 1.25rem; border-bottom: 1px solid var(--wp--preset--color--line); }
.kiosk-comment .wp-block-avatar img { border-radius: 50%; }
.kiosk-comment .wp-block-comment-date { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.wp-block-post-comments-form input:not([type=submit]):not([type=checkbox]),
.wp-block-post-comments-form textarea {
	border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--contrast); padding: .7em .9em; font: inherit;
}

/* ---------- Stopka ---------- */
.wp-site-blocks > .kiosk-site-footer {
	margin-block-start: 0; border-top: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--surface); content-visibility: auto; contain-intrinsic-size: auto 320px;
}
.kiosk-footer { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.kiosk-footer a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.kiosk-footer a:hover { color: var(--wp--preset--color--accent); }

/* ---------- Wyszukiwarka i 404 ---------- */
.wp-block-search__input {
	border-radius: var(--wp--custom--radius--pill); border: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--contrast); padding-inline: 1.1em;
}
.kiosk-hero-404 .wp-block-heading { font-size: var(--wp--preset--font-size--display); }
