/* Stay n Play – single accommodation */

.spa {
	--spa-accent: #7b1c1c;
	--spa-accent-ink: #fff;
	--spa-text: #1f2430;
	--spa-muted: #6b7280;
	--spa-border: #e6e8ec;
	--spa-soft: #f6f7f9;
	--spa-radius: 8px;
	--spa-sticky-top: 100px;
	color: var(--spa-text);
	font-size: 15px;
	line-height: 1.6;
}
.spa *, .spa *::before, .spa *::after { box-sizing: border-box; }
.spa img { max-width: 100%; height: auto; display: block; }
.spa h1, .spa h2, .spa h3 { color: var(--spa-text); margin: 0; line-height: 1.25; }

/* Undo the theme's page wrappers (Rebar: .page_content_wrap > .content_wrap > .content) so the hero is full-bleed. */
body.spa-page .page_content_wrap { padding: 0; }
body.spa-page .page_content_wrap .content_wrap,
body.spa-page .page_content_wrap .content_wrap > .content { width: 100%; max-width: none; margin: 0; padding: 0; float: none; }

/* Match the theme's page width (Rebar exposes --theme-var-page). */
.spa-container { width: 100%; max-width: calc(var(--theme-var-page, 1290px) + 32px); margin: 0 auto; padding: 0 16px; }

.spa-svg { width: 1em; height: 1em; flex: none; }
.spa-icon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 22px; height: 22px; font-size: 20px; color: var(--spa-accent); }
.spa-icon .spa-svg { width: 20px; height: 20px; }
.spa-icon.dashicons { width: 20px; height: 20px; font-size: 20px; }
.spa-icon--img { width: 22px; height: 22px; object-fit: contain; }

/* ---------- Hero slider ---------- */
.spa-hero { position: relative; background: var(--spa-soft); }
.spa-hero__track {
	display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
	scrollbar-width: none;
}
.spa-hero__track::-webkit-scrollbar { display: none; }
.spa-hero__slide { flex: 0 0 33.3334%; scroll-snap-align: start; height: 440px; border-right: 2px solid #fff; }
.spa-hero__slide img { width: 100%; height: 100%; object-fit: cover; }
.spa-hero__slide:only-child { flex-basis: 100%; }
.spa-hero__nav {
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer;
	display: flex; align-items: center; justify-content: center; padding: 0;
	background: rgba(255,255,255,.92); color: var(--spa-text); box-shadow: 0 2px 10px rgba(0,0,0,.2);
}
.spa-hero__nav .spa-svg { width: 20px; height: 20px; }
.spa-hero__nav--prev { left: 16px; }
.spa-hero__nav--next { right: 16px; }
.spa-hero__nav:hover { background: var(--spa-accent); color: var(--spa-accent-ink); }

/* ---------- Layout ---------- */
.spa-layout {
	display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 40px;
	align-items: start; padding-top: 32px; padding-bottom: 48px;
}
.spa-main > * + * { margin-top: 32px; }

.spa-sidebar { position: sticky; top: var(--spa-sticky-top); z-index: 2; }
.spa-hero + .spa-layout .spa-sidebar { margin-top: -64px; }
.spa-booking { background: #fff; border: 1px solid var(--spa-border); border-radius: var(--spa-radius); box-shadow: 0 10px 30px rgba(15,20,30,.08); overflow: hidden; }
.spa-booking__title { background: var(--spa-text); color: #fff !important; font-size: 16px; font-weight: 600; padding: 16px 20px; }
.spa-booking__form { padding: 20px; }
.spa-booking__form input:not([type=submit]):not([type=checkbox]):not([type=radio]),
.spa-booking__form select,
.spa-booking__form textarea {
	width: 100%; border: 1px solid var(--spa-border); border-radius: 6px; padding: 10px 12px;
	font-size: 14px; background: #fff; color: var(--spa-text);
}
.spa-booking__form textarea { min-height: 110px; }
.spa-booking__form input[type=submit],
.spa-booking__form button[type=submit],
.spa-booking__form .elementor-button {
	width: 100%; background: var(--spa-accent); color: var(--spa-accent-ink); border: 0; border-radius: 6px;
	padding: 12px 16px; font-weight: 600; cursor: pointer;
}
.spa-booking__form input[type=submit]:hover,
.spa-booking__form button[type=submit]:hover { filter: brightness(1.1); }
.spa-note { font-size: 13px; color: var(--spa-muted); background: var(--spa-soft); padding: 12px; border-radius: 6px; margin: 0; }

/* ---------- Header + highlights ---------- */
.spa-title { font-size: 30px; font-weight: 700; }
.spa-location { display: flex; align-items: center; gap: 6px; margin: 8px 0 0; color: var(--spa-muted); font-size: 14px; }
.spa-location .spa-svg { color: var(--spa-accent); }

.spa-highlights {
	display: grid; grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--spa-border); border-bottom: 1px solid var(--spa-border);
}
.spa-highlight { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 20px 10px; }
.spa-highlight + .spa-highlight { border-left: 1px solid var(--spa-border); }
.spa-highlight .spa-icon { width: 34px; height: 34px; font-size: 30px; margin-bottom: 4px; color: var(--spa-muted); }
.spa-highlight .spa-icon .spa-svg, .spa-highlight .spa-icon--img { width: 30px; height: 30px; }
.spa-highlight .spa-icon.dashicons { width: 30px; height: 30px; font-size: 30px; }
.spa-highlight__label { font-size: 13px; color: var(--spa-muted); }
.spa-highlight__value { font-size: 14px; }

/* ---------- About ---------- */
.spa-block__title { font-size: 20px; font-weight: 700; margin-bottom: 12px !important; }
.spa-about__body { position: relative; }
.spa-about__body.is-clamped { max-height: 260px; overflow: hidden; }
.spa-about__body.is-clamped::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 80px;
	background: linear-gradient(to bottom, rgba(255,255,255,0), #fff);
}
.spa-about__body p { margin: 0 0 12px; }
.spa-readmore { background: none; border: 0; padding: 0; margin-top: 8px; color: var(--spa-accent); font-weight: 600; cursor: pointer; }

/* ---------- Map ---------- */
.spa-map__frame { position: relative; aspect-ratio: 16 / 9; border-radius: var(--spa-radius); overflow: hidden; background: var(--spa-soft); }
.spa-map__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- Label-left sections ---------- */
.spa-section {
	display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 24px;
	padding-top: 28px; border-top: 1px solid var(--spa-border);
}
.spa-section--full { grid-template-columns: minmax(0, 1fr); }
.spa-section__title { font-size: 16px; font-weight: 700; }
.spa-section__subtitle { font-size: 15px; font-weight: 700; margin-bottom: 10px !important; }

.spa-rows { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px; }
.spa-row { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.spa-row__value { font-weight: 600; }

/* ---------- Mini gallery ---------- */
.spa-mini-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.spa-mini-gallery a { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 4px; }
.spa-mini-gallery a:first-child { grid-column: span 2; grid-row: span 2; aspect-ratio: auto; }
.spa-mini-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.spa-mini-gallery a:hover img { transform: scale(1.04); }

/* ---------- Terms ---------- */
.spa-terms { list-style: none; margin: 0 0 20px; padding: 0; }
.spa-terms li { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px dashed var(--spa-border); font-size: 14px; }
.spa-terms__label { flex: 1; }
.spa-terms__notes { font-size: 14px; color: var(--spa-muted); }
.spa-terms__notes p { margin: 0 0 10px; }

/* ---------- Similar listings ---------- */
.spa-similar { background: var(--spa-soft); padding: 48px 0 56px; }
.spa-similar__title { font-size: 22px; font-weight: 700; margin-bottom: 24px !important; }
.spa-cards { display: grid; grid-template-columns: repeat(var(--spa-cols, 3), minmax(0, 1fr)); gap: 24px; }
.spa-card { background: #fff; border-radius: var(--spa-radius); overflow: hidden; box-shadow: 0 2px 12px rgba(15,20,30,.06); display: flex; flex-direction: column; }
.spa-card__media { position: relative; display: block; aspect-ratio: 4 / 3; background: var(--spa-border); overflow: hidden; }
.spa-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.spa-card:hover .spa-card__media img { transform: scale(1.04); }
.spa-card__price {
	position: absolute; left: 12px; bottom: 12px; background: var(--spa-accent); color: var(--spa-accent-ink);
	padding: 6px 10px; border-radius: 4px; font-size: 12px;
}
.spa-card__price strong { font-size: 16px; }
.spa-card__body { padding: 16px 18px 18px; display: flex; flex-direction: column; flex: 1; }
.spa-card__title { font-size: 17px; font-weight: 700; }
.spa-card__title a { color: inherit; text-decoration: none; }
.spa-card__addr { color: var(--spa-muted); font-size: 13px; margin: 4px 0 10px; }
.spa-card__meta { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; }
.spa-card__meta li { display: flex; align-items: center; gap: 5px; }
.spa-card__meta .spa-svg { color: var(--spa-muted); width: 16px; height: 16px; }
.spa-card__foot { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-top: 12px; border-top: 1px solid var(--spa-border); font-size: 13px; }
.spa-card__type { color: var(--spa-muted); }
.spa-card__link { color: var(--spa-accent); font-weight: 600; text-decoration: none; white-space: nowrap; }

.spa-mobile-book { display: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
	.spa-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; }
	.spa-hero__slide { flex-basis: 50%; height: 380px; }
	.spa-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
	.spa-layout { grid-template-columns: minmax(0, 1fr); }
	.spa-sidebar { position: static; margin-top: 0; scroll-margin-top: var(--spa-sticky-top); }
	.spa-mobile-book {
		display: block; position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 50;
		background: var(--spa-accent); color: var(--spa-accent-ink); text-align: center; text-decoration: none;
		padding: 14px; border-radius: 8px; font-weight: 600; box-shadow: 0 6px 20px rgba(0,0,0,.25);
	}
	.spa-mobile-book.is-hidden { display: none; }
}
@media (max-width: 640px) {
	.spa-hero__slide { flex-basis: 88%; height: 280px; }
	.spa-title { font-size: 24px; }
	.spa-highlights { grid-template-columns: repeat(2, 1fr); }
	.spa-highlight:nth-child(3) { border-left: 0; }
	.spa-highlight:nth-child(n+3) { border-top: 1px solid var(--spa-border); }
	.spa-section { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.spa-rows { grid-template-columns: minmax(0, 1fr); }
	.spa-mini-gallery { grid-template-columns: repeat(2, 1fr); }
	.spa-cards { grid-template-columns: minmax(0, 1fr); }
}