/* ROADKIT Rezerwacje, tryb natywny. Kroje i kolor tekstu dziedziczą z motywu; marginesy, przyciski i listy
 * ustawiamy sami (z prefiksem .rk-native), żeby agresywne style motywu (np. YOOtheme/UIkit) nie rozjeżdżały układu. */
.rk-native {
	--rk-brand: #2563eb;
	--rk-line: rgba(128, 128, 128, 0.35);
	--rk-soft: rgba(128, 128, 128, 0.08);
	--rk-mute: rgba(110, 110, 110, 1);
	--rk-tint: rgba(128, 128, 128, 0.1);
	--rk-r: 12px;
	font: inherit;
	color: inherit;
	line-height: 1.55;
	text-align: left;
}
@supports (color: color-mix(in srgb, red, blue)) {
	.rk-native {
		--rk-line: color-mix(in srgb, currentColor 20%, transparent);
		--rk-soft: color-mix(in srgb, currentColor 6%, transparent);
		--rk-mute: color-mix(in srgb, currentColor 72%, transparent);
		--rk-tint: color-mix(in srgb, var(--rk-brand) 14%, transparent);
	}
}
.rk-native *,
.rk-native *::before,
.rk-native *::after { box-sizing: border-box; }
.rk-native img { max-width: 100%; height: auto; border: 0; box-shadow: none; }
.rk-native .rk-ic { flex: none; display: inline-block; vertical-align: middle; }
.rk-native .rk-muted { color: var(--rk-mute); }
.rk-native .rk-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: -1px; padding: 0; border: 0; }
.rk-native :focus-visible { outline: 2px solid var(--rk-brand); outline-offset: 2px; }
.rk-native [hidden] { display: none !important; }

/* Kroki: lista albo wybrany nocleg (stan ustawia native.js; rk-pre chowa listę przed wczytaniem skryptu). */
.rk-module.rk-pre .rk-list,
.rk-module[data-rk-view="detail"] .rk-list,
.rk-module[data-rk-view="list"] .rk-book,
.rk-module[data-rk-view="list"] .rk-detail-host { display: none !important; }
.rk-module .rk-detail-host:empty { display: none; }
/* Wejście prosto do kroku 2 (?domek=, jeden domek): miejsce na galerię i opis jeszcze przed native.js (mniej CLS). */
.rk-module.rk-pre .rk-detail-host:empty { display: block; height: 0; padding-bottom: calc(66.67% + 150px); }
@media (min-width: 800px) {
	.rk-module.rk-pre .rk-detail-host:empty { padding-bottom: calc(40% + 120px); }
}
.rk-native p.rk-dates-note { margin: 0 0 16px; padding: 10px 14px; border-radius: 10px; background: var(--rk-tint); border-left: 4px solid var(--rk-brand); }

/* Sekcje modułu */
.rk-native .rk-sec { margin: 0 0 32px; padding: 0; border: 0; }
.rk-native .rk-sec:last-child { margin-bottom: 0; }
.rk-native .rk-list-h { margin: 0 0 16px; padding: 0; }
.rk-module .rk-book { scroll-margin-top: 80px; }

/* Krok 1: kafelki. Siatka dopasowana do szerokości kontenera: 1, 2 albo 3 kolumny. */
.rk-native ul.rk-tiles {
	list-style: none; margin: 0; padding: 0; display: grid; gap: 20px;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
}
@supports (container-type: inline-size) {
	.rk-native .rk-list { container-type: inline-size; }
	.rk-native ul.rk-tiles { grid-template-columns: minmax(0, 1fr); }
	@container (min-width: 540px) {
		.rk-native ul.rk-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	}
	@container (min-width: 860px) {
		.rk-native ul.rk-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	}
}
.rk-native ul.rk-tiles > li.rk-tile {
	position: relative; margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; min-width: 0;
	border: 1px solid var(--rk-line); border-radius: var(--rk-r); overflow: hidden; background: transparent;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.rk-native ul.rk-tiles > li.rk-tile::before,
.rk-native ul.rk-tiles > li.rk-tile::marker { content: none; display: none; }
.rk-native .rk-tile:hover { border-color: var(--rk-brand); box-shadow: 0 6px 22px rgba(0, 0, 0, 0.1); }
.rk-native .rk-tile-img { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: var(--rk-soft); margin: 0; }
.rk-native .rk-tile-img img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; margin: 0; transition: transform 0.35s ease; }
.rk-native .rk-tile:hover .rk-tile-img img { transform: scale(1.03); }
.rk-native .rk-tile-noimg { display: grid; place-items: center; width: 100%; height: 100%; color: var(--rk-mute); }
.rk-native .rk-tile-body { display: flex; flex-direction: column; flex: 1; gap: 6px; padding: 14px 16px 16px; margin: 0; }
.rk-native h3.rk-tile-title { margin: 0; padding: 0; font-size: 1.15em; line-height: 1.3; text-transform: none; letter-spacing: normal; }
.rk-native a.rk-tile-link,
.rk-native a.rk-tile-link:hover,
.rk-native a.rk-tile-link:focus { color: inherit; text-decoration: none; border: 0; box-shadow: none; background: none; }
/* Cały kafelek jest celem kliknięcia (rozciągnięty odnośnik nazwy). */
.rk-native a.rk-tile-link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.rk-native .rk-tile:hover .rk-tile-name { text-decoration: underline; text-underline-offset: 3px; }
@supports selector(:has(a)) {
	.rk-native a.rk-tile-link:focus-visible { outline: none; }
	.rk-native .rk-tile:has(.rk-tile-link:focus-visible) { outline: 3px solid var(--rk-brand); outline-offset: 2px; border-color: var(--rk-brand); }
}
.rk-native p.rk-tile-meta { margin: 0; padding: 0; color: var(--rk-mute); font-size: 0.9em; }
.rk-native .rk-tile-desc {
	margin: 0; padding: 0; font-size: 0.95em; overflow: hidden;
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; max-height: 3.2em;
}
.rk-native .rk-tile-desc p { display: inline; margin: 0; padding: 0; }
.rk-native .rk-tile-desc p + p::before { content: " "; }
.rk-native ul.rk-tile-am { list-style: none; margin: 2px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 0.85em; }
.rk-native ul.rk-tile-am > li { list-style: none; margin: 0; padding: 0; display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
.rk-native ul.rk-tile-am > li::before { content: none; display: none; }
.rk-native ul.rk-tile-am .rk-ic { color: var(--rk-brand); }
.rk-native .rk-tile-foot { margin-top: auto; padding-top: 10px; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.rk-native .rk-tile-price strong { font-size: 1.15em; }
.rk-native .rk-tile-go {
	display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 18px; margin: 0 0 0 auto;
	border: 1px solid var(--rk-brand); border-radius: 10px; background: var(--rk-tint); color: inherit; font-weight: 600; white-space: nowrap;
}
.rk-native .rk-tile:hover .rk-tile-go { background: var(--rk-brand); color: var(--rk-on, #fff); }
/* Wąski kontener (telefon): kafelek poziomy, miniatura z lewej, bez opisu i ikon, żeby lista była krótka.
 * Po regułach bazowych kafelka, bo ma tę samą szczegółowość i musi je nadpisać. */
@supports (container-type: inline-size) {
	@container (max-width: 539px) {
		.rk-native ul.rk-tiles { gap: 12px; }
		.rk-native ul.rk-tiles > li.rk-tile { flex-direction: row; align-items: stretch; }
		.rk-native .rk-tile-img { flex: 0 0 38%; max-width: 160px; aspect-ratio: auto; min-height: 112px; align-self: stretch; }
		.rk-native .rk-tile-img img,
		.rk-native .rk-tile-noimg { position: absolute; inset: 0; width: 100%; height: 100%; }
		.rk-native .rk-tile-noimg .rk-ic { width: 32px; height: 32px; }
		.rk-native .rk-tile-body { flex: 1 1 0; min-width: 0; padding: 10px 12px; gap: 3px; justify-content: center; }
		.rk-native .rk-tile-desc,
		.rk-native ul.rk-tile-am { display: none; }
		.rk-native h3.rk-tile-title { font-size: 1.05em; line-height: 1.25; }
		.rk-native .rk-tile-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; }
		.rk-native p.rk-tile-meta { font-size: 0.85em; line-height: 1.35; }
		.rk-native .rk-tile-foot { margin-top: 2px; padding-top: 4px; gap: 4px 8px; }
		.rk-native .rk-tile-price { font-size: 0.92em; }
		.rk-native .rk-tile-go { min-height: 44px; padding: 0 14px; }
	}
}

/* Krok 2: wybrany nocleg */
.rk-native .rk-detail { margin: 0 0 28px; padding: 0; }
.rk-native .rk-detail-top { margin: 0 0 12px; padding: 0; }
.rk-native button.rk-back {
	display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin: 0; padding: 0 14px 0 10px;
	border: 1px solid var(--rk-line); border-radius: 10px; background: transparent; color: inherit;
	font: inherit; font-weight: 600; line-height: 1.2; text-transform: none; letter-spacing: normal; cursor: pointer; box-shadow: none;
}
.rk-native button.rk-back:hover { border-color: var(--rk-brand); background: var(--rk-tint); color: inherit; }
.rk-native button.rk-back .rk-ic { color: var(--rk-brand); }
.rk-module.is-reserved .rk-detail-top { display: none; }
.rk-native h2.rk-detail-title { margin: 0 0 4px; padding: 0; scroll-margin-top: 90px; }
.rk-native h2.rk-detail-title:focus { outline: none; }
.rk-native h2.rk-detail-title:focus-visible { outline: 2px solid var(--rk-brand); outline-offset: 4px; }
.rk-native p.rk-detail-meta { margin: 0 0 16px; padding: 0; color: var(--rk-mute); }
.rk-native .rk-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
@supports (container-type: inline-size) {
	.rk-native .rk-detail { container-type: inline-size; }
	@container (min-width: 760px) {
		.rk-native .rk-detail-grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 28px; align-items: start; }
	}
}
.rk-native .rk-detail-media,
.rk-native .rk-detail-info { min-width: 0; margin: 0; }
.rk-native .rk-detail-noimg { display: grid; place-items: center; aspect-ratio: 3 / 2; border-radius: var(--rk-r); background: var(--rk-soft); color: var(--rk-mute); }
.rk-native .rk-detail-desc { margin: 0 0 8px; }
.rk-native .rk-detail-desc p { margin: 0 0 10px; padding: 0; }
.rk-native .rk-detail-desc.rk-clamp { max-height: 9.4em; overflow: hidden; -webkit-mask-image: linear-gradient(#000 60%, transparent); mask-image: linear-gradient(#000 60%, transparent); }
.rk-native h3.rk-detail-sub { margin: 14px 0 8px; padding: 0; font-size: 1em; text-transform: none; letter-spacing: normal; }
.rk-native ul.rk-detail-am { list-style: none; margin: 0 0 12px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr)); gap: 6px 14px; font-size: 0.95em; }
.rk-native ul.rk-detail-am > li { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 8px; min-width: 0; }
.rk-native ul.rk-detail-am > li::before { content: none; display: none; }
.rk-native ul.rk-detail-am .rk-ic { color: var(--rk-brand); }
.rk-native p.rk-detail-price { margin: 4px 0 0; padding: 0; }
.rk-native p.rk-detail-price strong { font-size: 1.2em; }
.rk-native button.rk-more {
	display: inline-flex; align-items: center; min-height: 44px; margin: 0 0 4px; padding: 0;
	background: none; border: 0; box-shadow: none; color: inherit; font: inherit; font-weight: 600;
	text-transform: none; letter-spacing: normal; cursor: pointer; text-decoration: underline; text-decoration-color: var(--rk-brand); text-underline-offset: 3px;
}

/* Galeria (krok 2) */
.rk-native .rk-gal { position: relative; margin: 0; }
.rk-native .rk-gal-track {
	display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch;
	border-radius: var(--rk-r); background: var(--rk-soft); aspect-ratio: 3 / 2; max-height: 72vh; margin: 0; padding: 0;
}
.rk-native .rk-gal-track::-webkit-scrollbar { display: none; }
.rk-native figure.rk-gal-slide { flex: 0 0 100%; margin: 0; padding: 0; scroll-snap-align: center; cursor: zoom-in; }
.rk-native .rk-gal-slide img.rk-gal-img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; margin: 0; }
.rk-native button.rk-gal-btn {
	position: absolute; top: calc(50% - 22px); width: 44px; height: 44px; min-height: 0; margin: 0; border-radius: 50%;
	border: 0; background: rgba(0, 0, 0, 0.55); color: #fff; font-size: 28px; line-height: 1; box-shadow: none;
	display: grid; place-items: center; cursor: pointer; padding: 0 0 3px; text-transform: none;
}
.rk-native button.rk-gal-btn:hover { background: rgba(0, 0, 0, 0.75); color: #fff; }
.rk-native .rk-gal-prev { left: 10px; }
.rk-native .rk-gal-next { right: 10px; }
.rk-native .rk-gal-count {
	position: absolute; right: 10px; top: 10px; background: rgba(0, 0, 0, 0.6); color: #fff;
	border-radius: 999px; padding: 2px 10px; font-size: 0.85em;
}
.rk-lightbox { border: 0; padding: 0; background: rgba(0, 0, 0, 0.92); width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; color: #fff; }
.rk-lightbox::backdrop { background: rgba(0, 0, 0, 0.92); }
.rk-lightbox-in { position: relative; width: 100%; height: 100%; display: grid; place-items: center; }
.rk-lightbox img { max-width: 94vw; max-height: 88vh; object-fit: contain; touch-action: pan-y; }
.rk-lightbox button {
	position: absolute; border: 0; background: rgba(255, 255, 255, 0.18); color: #fff; width: 48px; height: 48px; margin: 0;
	border-radius: 50%; font-size: 28px; cursor: pointer; display: grid; place-items: center; padding: 0 0 3px; box-shadow: none;
}
.rk-lightbox button[hidden] { display: none; }
.rk-lightbox .rk-lb-prev { left: 12px; top: calc(50% - 24px); }
.rk-lightbox .rk-lb-next { right: 12px; top: calc(50% - 24px); }
.rk-lightbox .rk-lb-close { right: 12px; top: 12px; font-size: 24px; }

/* Panel rezerwacji */
.rk-native .rk-book roadkit-booking { margin-top: 4px; }
roadkit-booking:not(:defined) > a { display: inline-block; padding: 12px 18px; border-radius: 10px; background: var(--rk-brand, #2563eb); color: #fff; text-decoration: none; font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
	.rk-native ul.rk-tiles > li.rk-tile,
	.rk-native .rk-tile-img img { transition: none; }
	.rk-native .rk-tile:hover .rk-tile-img img { transform: none; }
	.rk-native .rk-gal-track { scroll-behavior: auto; }
}
.roadkit-rez-notice { padding: 10px 14px; margin: 0 0 16px; border-left: 4px solid #dba617; background: #fcf9e8; color: #1d2327; }
.roadkit-rez-notice.is-ok { border-left-color: #00a32a; background: #edfaef; }
.roadkit-rez-notice a.roadkit-rez-fix { display: inline-block; margin-left: 4px; padding: 6px 14px; border-radius: 6px; background: #1d2327; color: #fff !important; font-weight: 600; text-decoration: none; }
.roadkit-rez-notice .roadkit-rez-only { color: #50575e; font-size: 0.9em; }

/* Przyklejony pasek na telefonie (krok 2): nazwa, cena od, Rezerwuj. Poza modułem, w body. */
.rk-sbar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 99990; margin: 0;
	padding: 10px 16px; padding-bottom: max(10px, env(safe-area-inset-bottom));
	padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right));
	box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.16); border-top: 1px solid rgba(128, 128, 128, 0.3);
	font: inherit; line-height: 1.3; text-align: left;
}
.rk-sbar[hidden] { display: none !important; }
.rk-sbar .rk-sbar-in { display: flex; align-items: center; gap: 12px; max-width: 760px; margin: 0 auto; }
.rk-sbar p.rk-sbar-txt { flex: 1; min-width: 0; margin: 0; padding: 0; display: flex; flex-direction: column; }
.rk-sbar .rk-sbar-name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rk-sbar .rk-sbar-price { font-size: 0.9em; opacity: 0.85; }
.rk-sbar .rk-sbar-price:empty { display: none; }
.rk-sbar button.rk-sbar-btn {
	flex: none; min-height: 48px; min-width: 44px; margin: 0; padding: 0 22px; border: 0; border-radius: 12px;
	background: var(--rk-brand, #2563eb); color: var(--rk-on, #fff); font: inherit; font-weight: 600;
	text-transform: none; letter-spacing: normal; box-shadow: none; cursor: pointer; touch-action: manipulation;
}
.rk-sbar button.rk-sbar-btn:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; }
html.rk-sbar-on body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
@media (prefers-reduced-motion: no-preference) {
	.rk-sbar { animation: rk-sbar-in 0.18s ease-out; }
	@keyframes rk-sbar-in { from { transform: translateY(100%); } to { transform: none; } }
}
@media (min-width: 782px) {
	.rk-sbar { display: none !important; }
}