/* =========================================================================
   Strona województwa (hub regionu) — zamow-kontener.pl
   Moduły F reużywają landing-lokalny.css (main ma klasy .zk-lp .zk-woj).
   Tokeny --zk-* z :root (site-header.css). Zasady jak w landing-lokalny.css:
   zieleń #84BF2A tylko jako akcent graficzny, tekst/ikony = --zk-green-dark,
   akcja = --zk-red, kontrolki 8px, karty 12px, pigułka tylko przyciski.
   ========================================================================= */

/* ------------------------------------------------------------------ Hero */
/* Siatka i grafika z landing-lokalny.css (.zk-lp__hero-grid / -media). */
.zk-woj__hero-grid--noimg { grid-template-columns: 1fr; }

/* ------------------------------------------------ Znajdź swoją miejscowość */
.zk-woj__search {
	display: flex; align-items: center; gap: .6rem;
	border: 2px solid var(--zk-line, #e6e8e1);
	border-radius: var(--zk-r-control, 8px);
	padding: .2rem .9rem;
	background: #fff;
}
.zk-woj__search:focus-within { border-color: var(--zk-green-dark, #487214); }
.zk-woj__search svg { width: 20px; height: 20px; color: var(--zk-muted, #5b6152); flex: none; }
.zk-woj__search input {
	flex: 1; min-width: 0;
	border: 0; outline: 0; background: transparent;
	font: inherit; font-size: 1.05rem;
	color: var(--zk-ink, #23291c);
}
/* Globalne style pól formularza (ramka, cień, focus, wysokość, padding)
   — tu ramkę ma label, a pole tylko wypełnia go i centruje tekst. */
.zk-woj .zk-woj__search input[type="search"],
.zk-woj .zk-woj__search input[type="search"]:focus {
	border: 0 !important;
	box-shadow: none !important;
	outline: 0 !important;
	background: transparent !important;
	border-radius: 0;
	height: 3rem;
	min-height: 0;
	margin: 0;
	padding: 0;
	line-height: 3rem;
	-webkit-appearance: none;
	appearance: none;
}
.zk-woj .zk-woj__count { margin: .75rem 0 1rem; font-size: .9rem; color: var(--zk-muted, #5b6152); }

.zk-woj__list {
	list-style: none; margin: 0; padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
	grid-auto-rows: 1fr; /* wszystkie kafelki tej samej wysokości */
	gap: .5rem;
	max-height: 560px;
	overflow-y: auto;
	padding-right: .25rem;
}
.zk-woj__list li[hidden] { display: none; }
.zk-woj__list li:not([hidden]) { display: flex; }
.zk-woj__list a {
	flex: 1;
	display: flex; flex-direction: column; justify-content: space-between; gap: .35rem;
	padding: .7rem .85rem;
	border: 1px solid var(--zk-line, #e6e8e1);
	border-radius: var(--zk-r-control, 8px);
	text-decoration: none;
	color: var(--zk-ink, #23291c);
	background: #fff;
	transition: border-color .15s, background .15s;
}
.zk-woj__list a:hover,
.zk-woj__list a:focus-visible,
.zk-woj__list li.is-active a {
	border-color: var(--zk-green, #84BF2A);
	background: var(--zk-bg-green-soft, #eef5e2);
}
.zk-woj__city { font-weight: 700; line-height: 1.25; }
.zk-woj__city-pre {
	display: block;
	font-size: .72rem; font-weight: 600;
	text-transform: uppercase; letter-spacing: .05em;
	color: var(--zk-muted, #5b6152);
}
.zk-woj__from { font-size: .85rem; color: var(--zk-green-dark, #487214); font-weight: 700; white-space: nowrap; }
.zk-woj__from--ask { color: var(--zk-muted, #5b6152); font-weight: 500; }
.zk-woj__empty {
	margin-top: 1rem;
	padding: .9rem 1rem;
	background: var(--zk-bg-soft, #f2f4ec);
	border-radius: var(--zk-r-card, 12px);
}

@media (max-width: 900px) {
	.zk-woj__list { max-height: 420px; }
}

/* ------------------------------------------------------- Ceny w regionie */
/* Tabela: style strony /cennik/ (cennik.css, .zk-cn__*). Cień tabeli
   definiuje tam wrapper strony cennika — tu podajemy go dla huba regionu. */
.zk-woj { --zkcn-soft-shadow: 0 2px 10px rgba(20, 32, 4, .06); }
.zk-woj__prices-lead { color: var(--zk-muted, #5b6152); max-width: 62ch; }

/* ------------------------------------------------------ Tekst o regionie */
.zk-woj__seo details { border-top: 1px solid var(--zk-line, #e6e8e1); padding-top: 1rem; }
.zk-woj__seo summary { cursor: pointer; font-weight: 700; color: var(--zk-green-dark, #487214); }
.zk-woj__seo-body { margin-top: 1rem; max-width: 72ch; color: var(--zk-graphite, #4c5346); }
