/* ─────────────────────────────────────────────────────────────────────────
   Per-dojo page layout — /lokalizacje/{slug}/ (single-dojo.php)
   Was fully unstyled (no .mkkk-dojo-page* rules existed at all), so the
   header/address/map/schedule sprawled full-bleed flush to the viewport
   edge instead of sitting in the site's normal .mkkk-container column.
   Reuses the same design tokens as the theme's .mkkk-page-header/
   .mkkk-page-content (page.php) so a dojo page reads as the same site,
   not a bolted-on plugin screen.
   ───────────────────────────────────────────────────────────────────────── */

.mkkk-dojo-page {
	display: block;
	padding-block: clamp(1.5rem, 3vw, 2.5rem) clamp(3rem, 6vw, 5rem);
}

/* Width/centering come from the "mkkk-container" class added directly on
   .mkkk-dojo-page__inner in the template — the same primitive the header,
   footer and page.php content column already use, so this reads pixel-for-
   pixel consistent with the rest of the site rather than an approximation. */

.mkkk-dojo-page__header {
	padding-block-end: clamp(1.25rem, 2.5vw, 2rem);
	margin-block-end: clamp(1.5rem, 3vw, 2.5rem);
	border-bottom: 1px solid var(--line, rgba(255, 255, 255, .1));
}

.mkkk-dojo-page__title {
	font-family: var(--font-display, 'Archivo', sans-serif);
	font-size: var(--fs-h2, clamp(28px, 4vw, 44px));
	font-weight: 700;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--paper, #f2efe9);
	margin: 0 0 0.35em;
	display: inline-block;
	padding-block-end: 0.2em;
	border-bottom: 3px solid var(--accent, oklch(0.62 0.19 25));
}

.mkkk-dojo-page__address {
	font-style: normal;
	font-size: 15px;
	line-height: 1.6;
	color: var(--muted, #9a9aa8);
	margin: 0.75em 0 0;
}

.mkkk-dojo-page__actions {
	margin: 1em 0 0;
}

.mkkk-dojo-page__notes {
	color: var(--paper-dim, #cfcdd6);
	font-size: var(--fs-body, 15px);
	line-height: 1.7;
	max-width: 72ch;
	margin-block-end: clamp(1.5rem, 3vw, 2.5rem);
}

/* Map: contained to the same column as everything else (not full-bleed) —
   the safer, more consistent read next to a bordered header/table. */
.mkkk-dojo-page__map {
	margin-block-end: clamp(2rem, 4vw, 3rem);
	border: 1px solid var(--line, rgba(255, 255, 255, .1));
}

.mkkk-dojo-page__schedule h2 {
	font-family: var(--font-display, 'Archivo', sans-serif);
	font-size: var(--fs-h3, clamp(20px, 2.2vw, 26px));
	font-weight: 700;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--paper, #f2efe9);
	padding-block-end: 0.35em;
	margin: 0 0 1em;
	border-bottom: 2px solid var(--accent, oklch(0.62 0.19 25));
}

.mkkk-dojo-map {
	width: 100%;
	position: relative;
	border-radius:0;
	overflow: hidden;
	background: #f0efeb;
}

/* `hidden` to ATRYBUT, a nie klasa, i sam z siebie nie wygrywa z niczym.
   Reguła przeglądarki `[hidden] { display: none }` przegrywa z KAŻDĄ autorską
   regułą `display` na tym samym elemencie (origin autora bije origin UA), więc
   bez tej linii `display: flex` niżej zostawiłby zastępnik na ekranie także po
   kliknięciu „Pokaż mapę": mapa dorysowałaby się POD nim, poza przyciętą ramką
   300 px, a odwiedzający zapłaciłby adresem IP za kafelki, których nie widzi.
   Ten sam błąd siedzi w repozytorium od dawna przy `.day-filter` (timetable.css)
   i jest opisany w mkkk-trial/assets/css/trial-form.css. Zakres na całą sekcję,
   nie na jedną klasę, bo to samo dotyczy ramki chowanej bez JavaScriptu. */
.dojo-map-section [hidden] {
	display: none;
}

/* Komunikat awarii mapy. Zastapil zastepnik z przyciskiem "Pokaz mape"
   (usuniety 2026-08-12 na zyczenie wlasciciela: mapa ma sie rysowac od razu).
   Bez tego komunikatu awaria Leafletu dawalaby puste szare pudelko bez slowa
   wyjasnienia, bo nie ma juz przycisku, ktory by na ekranie zostal. */
.mkkk-map-error {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 1.25em;
	text-align: center;
	font-size: 13px;
	line-height: 1.5;
	background: #f0efeb;
	color: #5a5a5a;
}

/* Leaflet popup — match the site vibe rather than default blue */
.leaflet-popup-content {
	font: inherit;
	margin: 12px 16px;
	line-height: 1.4;
}

.leaflet-popup-content a {
	color: #9246a3;
	text-decoration: underline;
}
