/* Wyjazdowo — mapy (Leaflet). Kolory z motywu (theme.json) z wartościami zapasowymi. */
.wym {
	--wy-m-akcent: var(--wp--preset--color--teal-dark, #0f766e);
	--wy-m-akcent-2: var(--wp--preset--color--teal, #0d9488);
	--wy-m-tlo: var(--wp--preset--color--white, #fff);
	--wy-m-tekst: var(--wp--preset--color--charcoal, #0f172a);
	--wy-m-szary: var(--wp--preset--color--slate, #64748b);
	--wy-m-ramka: var(--wp--preset--color--border, #e2e8f0);
	--wy-m-promien: var(--wp--custom--radius--md, 1rem);
	position: relative;
	line-height: var(--wp--custom--line-height--body, 1.5);
	/* Szerokość wyłącznie z rodzica: przewijana lista kart nie może rozpychać kolumny układu strony (grid .wy-uklad). */
	contain: inline-size;
	width: 100%;
	min-width: 0;
}
.wy-mapa-wyprawy { min-width: 0; }
/* Ten sam błąd Chromium, który blocks.css obchodzi dla .wy-uklad__sidebar: jedyne dziecko siatki bez
   jawnej szerokości dostaje szerokość „intrinsic” zamiast całej kolumny. Mapa nie ma własnej szerokości
   (contain: inline-size), więc kolumna zwijała się do szerokości listy (~340px). */
.wy-uklad > .wy-uklad__glowna { width: 100%; }
.wym__plotno {
	position: relative;
	height: var(--wym-h, 600px);
	min-height: 180px;
	border-radius: var(--wy-m-promien);
	overflow: hidden;
	background: var(--wp--preset--color--mist, #f1f5f9);
	border: 1px solid var(--wy-m-ramka);
	z-index: 0; /* panele Leaflet (z-index 400+) nie wychodzą ponad menu motywu */
}
.wym__plotno:focus-visible { outline: 2px solid var(--wy-m-akcent); outline-offset: 2px; }
.wym__ladowanie { position: absolute; inset: 0; display: grid; place-items: center; color: var(--wy-m-szary); font-size: .9rem; }
.wym__dane { display: none; }
.wym .leaflet-container { font: inherit; font-size: .875rem; background: var(--wp--preset--color--mist, #f1f5f9); }

/* Mapa w rzędzie nagłówka wpisu: wysokość z rodzica (flex stretch / 220px na mobile). */
.wy-mapa-osadzona .wym, .wy-mapa-osadzona .wym__plotno { height: 100%; }
.wy-mapa-osadzona .wym__plotno { border: 0; border-radius: 0; min-height: 0; }
.wy-mapa-osadzona:not(.wy-hero-mapa) .wym__plotno { height: var(--wym-h, 220px); }
.wy-mapa-osadzona .wym { line-height: 1.4; }
.wy-mapa-osadzona.wy-hero-mapa { position: relative; }

/* Kontrolki w kolorach motywu (jak wcześniej przyciski Progress Map). */
.wym .leaflet-bar { border: 0; box-shadow: 0 1px 4px rgba(15, 23, 42, .25); border-radius: .5rem; overflow: hidden; }
.wym .leaflet-bar a { background: var(--wy-m-akcent); color: #fff; border-bottom-color: rgba(255, 255, 255, .25); width: 2rem; height: 2rem; line-height: 2rem; }
.wym .leaflet-bar a:hover, .wym .leaflet-bar a:focus { background: var(--wy-m-tekst); color: #fff; }
.wym .leaflet-bar a.leaflet-disabled { background: #94a3b8; color: #e2e8f0; }
.wym .leaflet-control-layers { border: 0; border-radius: .5rem; box-shadow: 0 1px 4px rgba(15, 23, 42, .25); }
.wym .leaflet-control-layers-expanded { padding: .5rem .75rem; }
.wym .leaflet-control-attribution { font-size: .6875rem; background: rgba(255, 255, 255, .8); }
.wym--mini .leaflet-control-attribution { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Pinezki i klastry */
/* Uwaga: Leaflet pozycjonuje ikonę przez transform na samym elemencie — skalujemy tylko dzieci. */
.wy-pin { color: var(--wy-m-akcent); filter: drop-shadow(0 1px 1.5px rgba(15, 23, 42, .45)); }
.wy-pin svg, .wy-pin span { display: block; width: 100%; height: 100%; transition: transform .15s ease; transform-origin: 50% 100%; }
.wy-pin svg { fill: currentColor; stroke: #fff; stroke-width: 12; paint-order: stroke; }
.wy-pin:hover, .wy-pin:focus, .wy-pin.is-aktywny { color: var(--wp--preset--color--terracotta, #e06d53); z-index: 1000 !important; }
.wy-pin:hover > *, .wy-pin:focus > *, .wy-pin.is-aktywny > * { transform: scale(1.25); }
.wy-pin--dodatkowy span { border-radius: 50%; background: currentColor; border: 2px solid #fff; box-sizing: border-box; transform-origin: 50% 50%; }
.wy-klaster span { display: grid; place-items: center; width: 100%; height: 100%; border-radius: 50%; background: var(--wy-m-akcent); color: #fff; font: 700 .8125rem/1 var(--wp--preset--font-family--heading, system-ui); box-shadow: 0 0 0 5px rgba(13, 148, 136, .28), 0 1px 4px rgba(15, 23, 42, .3); transition: transform .15s ease, background .15s ease; }
.wy-klaster:hover span, .wy-klaster.is-aktywny span { background: var(--wp--preset--color--terracotta, #e06d53); box-shadow: 0 0 0 6px rgba(224, 109, 83, .3), 0 1px 4px rgba(15, 23, 42, .3); transform: scale(1.1); }
.wy-klaster.is-aktywny { z-index: 1000 !important; }
.wy-trasa { stroke: var(--wp--preset--color--terracotta, #e06d53); stroke-opacity: .9; fill: none; }
.wy-trasa--samolot { stroke: #e06d53; }
.wy-trasa--samochod { stroke: #0f766e; }
.wy-trasa--pociag { stroke: #7c3aed; }
.wy-trasa--autobus { stroke: #d97706; }
.wy-trasa--prom { stroke: #0284c7; }
.wy-trasa--pieszo { stroke: #475569; }
.wy-trasa--rower { stroke: #16a34a; }
.wy-trasa-ikona span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(15, 23, 42, .35); font-size: 12px; line-height: 1; }
.wym--bez-ikon-trasy .wy-trasa-ikona { display: none; }
.wy-trasa-legenda { display: flex; flex-wrap: wrap; gap: .25rem .75rem; max-width: 60%; padding: .35rem .6rem; border-radius: .5rem; background: rgba(255, 255, 255, .92); box-shadow: 0 1px 4px rgba(15, 23, 42, .25); font-size: .75rem; line-height: 1.3; color: var(--wy-m-tekst); }
.wy-trasa-legenda__poz { display: inline-flex; align-items: center; gap: .3rem; white-space: nowrap; }
.wy-kraj { fill: var(--wy-m-akcent-2, #0d9488); stroke: var(--wy-m-akcent, #0f766e); }

/* Dymek */
.wy-popup .leaflet-popup-content-wrapper { border-radius: .75rem; padding: 0; overflow: hidden; box-shadow: 0 8px 24px rgba(15, 23, 42, .22); }
.wy-popup .leaflet-popup-content { margin: 0; width: 260px !important; line-height: 1.35; }
.wy-popup a.leaflet-popup-close-button { color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); top: 4px; right: 4px; }
.wy-dymek { display: block; color: var(--wy-m-tekst) !important; text-decoration: none !important; }
.wy-dymek__foto { display: block; width: 100%; height: 140px; object-fit: cover; background: var(--wp--preset--color--mist, #f1f5f9); }
.wy-dymek__tresc { display: grid; gap: .2rem; padding: .7rem .9rem .85rem; }
.wy-dymek__meta { font-size: .72rem; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; color: var(--wy-m-akcent); }
.wy-dymek__tytul { font: 700 .95rem/1.3 var(--wp--preset--font-family--heading, system-ui); }
.wy-dymek:hover .wy-dymek__tytul { color: var(--wy-m-akcent); text-decoration: underline; }
.wy-dymek__adres { font-size: .78rem; color: var(--wy-m-szary); }

/* Lista miejsc */
.wym__lista { list-style: none; margin: .75rem 0 0; padding: 0 0 .5rem; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 260px); gap: .75rem; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; }
.wym__pozycja { scroll-snap-align: start; margin: 0; }
.wym__karta { display: flex; gap: .65rem; align-items: center; height: 100%; box-sizing: border-box; padding: .5rem; border: 1px solid var(--wy-m-ramka); border-radius: .75rem; background: var(--wy-m-tlo); color: var(--wy-m-tekst) !important; text-decoration: none !important; transition: border-color .15s ease, box-shadow .15s ease; }
.wym__karta:hover, .wym__karta:focus-visible, .wym__pozycja.is-wybrany .wym__karta { border-color: var(--wy-m-akcent-2); box-shadow: 0 4px 14px rgba(15, 23, 42, .1); }
.wym__foto { flex: none; width: 72px; height: 56px; object-fit: cover; border-radius: .5rem; background: var(--wp--preset--color--mist, #f1f5f9); }
.wym__opis { display: grid; gap: .15rem; min-width: 0; }
.wym__meta { font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; color: var(--wy-m-akcent); }
.wym__tytul { font: 600 .85rem/1.3 var(--wp--preset--font-family--heading, system-ui); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

@media (min-width: 1024px) {
	.wym--bok { display: grid; grid-template-columns: minmax(260px, 320px) 1fr; gap: 1rem; align-items: start; }
	.wym--bok .wym__plotno { grid-column: 2; grid-row: 1; }
	.wym--bok .wym__lista { grid-column: 1; grid-row: 1; margin: 0; grid-auto-flow: row; grid-auto-columns: auto; overflow: hidden auto; max-height: var(--wym-h, 600px); padding: 0 .35rem 0 0; scroll-snap-type: y proximity; }
}
@media (max-width: 600px) {
	.wym__plotno { height: min(var(--wym-h, 600px), 70vh); }
	.wy-mapa-osadzona .wym__plotno { height: 100%; }
	.wym__lista { grid-auto-columns: 78%; }
}

/* Edytor: podgląd bloku i panel „Lokalizacja” */
.wy-mapa-podglad { padding: 1rem 1.25rem; border: 1px dashed #94a3b8; border-radius: .75rem; background: #f8fafc; font-size: .9rem; line-height: 1.5; }
.wy-mapa-podglad span { color: #64748b; }
.wy-lokalizacja-panel__mapa { height: 200px; border-radius: 6px; overflow: hidden; border: 1px solid #ddd; margin: 8px 0; z-index: 0; position: relative; }
.wy-lokalizacja-panel__wiersz { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.wy-lokalizacja-panel__wyniki { margin: 4px 0 8px; padding: 0; list-style: none; border: 1px solid #ddd; border-radius: 4px; max-height: 180px; overflow: auto; }
.wy-lokalizacja-panel__wyniki button { display: block; width: 100%; text-align: left; padding: 6px 8px; border: 0; border-bottom: 1px solid #eee; background: #fff; cursor: pointer; font-size: 12px; line-height: 1.35; }
.wy-lokalizacja-panel__wyniki button:hover { background: #f0f6fc; }
.wy-lokalizacja-panel__dodatkowe li { display: flex; justify-content: space-between; align-items: center; gap: 6px; font: 12px/1.4 monospace; margin: 2px 0; }
.wy-lokalizacja-panel__pomoc { font-size: 12px; color: #757575; margin: 4px 0 8px; }

/* Edytor: pasek i podgląd bloku „Mapa wyprawy”, lista odcinków trasy w panelu bocznym */
.wy-mapa-edytor__pasek { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem 1rem; padding: .5rem .75rem; margin-bottom: .5rem; border: 1px dashed #94a3b8; border-radius: .5rem; background: #f8fafc; font-size: 13px; line-height: 1.4; }
.wy-mapa-edytor__pasek span { color: #64748b; }
.wy-mapa-edytor__podglad { display: block; width: 100%; border: 0; border-radius: .75rem; background: #f1f5f9; }
.wy-trasa-edytor { margin: 12px 0 0; padding: 0; list-style: none; counter-reset: odc; }
.wy-trasa-edytor li { counter-increment: odc; padding: 8px 0; border-top: 1px solid #eee; }
.wy-trasa-edytor__opis { display: grid; gap: 2px; margin-bottom: 4px; font-size: 12px; line-height: 1.35; }
.wy-trasa-edytor__opis strong::before { content: counter(odc) ". "; color: #757575; font-weight: 400; }
.wy-trasa-edytor__opis span { color: #757575; }
