/*
 * SeaSky Villas — theme.css
 *
 * Intentionally minimal. All visual design is handled in Elementor.
 *
 * IMPORTANT (Elementor v4 / Atomic CSS): do NOT add broad resets here.
 * Avoid selectors like *, html, body, div, section, ul, li, a, button or
 * form elements, and never use `all: reset` or global box-sizing overrides.
 * Such rules conflict with Elementor's scoped, atomic CSS output and with the
 * JetPlugins suite. Keep any rules narrowly scoped to this theme's own
 * classes (e.g. .site-main, .df-credit) only.
 *
 * Performance note: this file must stay tiny — it loads on every page. Any
 * substantial styling belongs in Elementor (which generates per-page CSS),
 * not here.
 *
 * The only rules below are a scoped accessibility utility for the
 * skip-to-content link (visually hidden, but visible on keyboard focus).
 * These target theme-owned classes only — never Elementor or global elements.
 */

/* Visually hidden, but available to screen readers and keyboard users. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	position: absolute !important;
	word-wrap: normal !important;
}

/* Reveal the skip link when it receives keyboard focus. */
.skip-link.screen-reader-text:focus {
	clip: auto;
	clip-path: none;
	height: auto;
	width: auto;
	margin: 0;
	padding: 16px 24px;
	position: fixed !important;
	top: 8px;
	left: 8px;
	z-index: 100000;
	display: block;
	background: #fff;
	color: #111;
	font-size: 14px;
	line-height: 1;
	text-decoration: underline;
}

/* ------------------------------------------------------------------
 * Guesty property pages (plugin-rendered — no Elementor hero behind
 * the transparent header, and no Elementor typography on the title).
 * Scoped strictly to Guesty body classes; nothing here leaks into
 * Elementor-built pages.
 * ------------------------------------------------------------------ */

/* Brand font baseline for EVERY Guesty plugin component, on any page it
   renders (property pages, checkout, maps, grids). Specific rules below
   (Lora titles, Inter amenity labels) override where the design says so. */
.gps-single,
.gps-archive,
.gps-card,
.gps-grid,
.gps-booking-widget,
.gps-booking-widget__error,
.gps-checkout,
.gps-calendar,
.gps-quote__row,
.gps-quote__plan-label,
.gps-amenities,
.gps-map-popup,
.gps-cta,
.gps-view-toggle,
.gps-view-switcher,
.gps-empty,
.gps-pagination,
.gps-single__facts {
	font-family: Mulish, sans-serif;
}

/* Buttons and form controls don't inherit fonts by default — force it for
   plugin controls so nothing falls back to the browser serif/system UI. */
.gps-button,
.gps-field__control,
.gps-booking-widget__clear,
.gps-calendar__nav-button {
	font-family: inherit;
}

/* The site header is transparent (designed to sit over the teal hero).
   Guesty pages have no hero, so give the header the brand teal. */
body.single-guesty_property .elementor-location-header,
body.post-type-archive-guesty_property .elementor-location-header,
body.tax-gps_city .elementor-location-header,
body.tax-gps_property_type .elementor-location-header,
body.page-id-8 .elementor-location-header,
body.tax-gps_amenity .elementor-location-header {
	background: var(--Aqua-Turquoise, #26A5B8);
	/* Bottom = 40px visual + 24px the content card overlaps so its rounded
	   top corners read against the teal. Top spacing lives on the nav row
	   below (the announcement bar stays flush with the viewport top). */
	padding: 0 0 64px;
}

/* The announcement bar carries 40px bottom padding as overlap allowance for
   Elementor hero cards; nothing overlaps it on Guesty pages, so trim it to
   match its 20px top padding (slim bar, like the rest of the site). */
body.single-guesty_property .elementor-location-header .elementor-element-d1582bb,
body.post-type-archive-guesty_property .elementor-location-header .elementor-element-d1582bb,
body.tax-gps_city .elementor-location-header .elementor-element-d1582bb,
body.tax-gps_property_type .elementor-location-header .elementor-element-d1582bb,
body.page-id-8 .elementor-location-header .elementor-element-d1582bb,
body.tax-gps_amenity .elementor-location-header .elementor-element-d1582bb {
	padding-block-end: 20px;
}

/* 40px breathing room above the logo/nav row (header container db61b9b). */
body.single-guesty_property .elementor-location-header .elementor-element-db61b9b,
body.post-type-archive-guesty_property .elementor-location-header .elementor-element-db61b9b,
body.tax-gps_city .elementor-location-header .elementor-element-db61b9b,
body.tax-gps_property_type .elementor-location-header .elementor-element-db61b9b,
body.page-id-8 .elementor-location-header .elementor-element-db61b9b,
body.tax-gps_amenity .elementor-location-header .elementor-element-db61b9b {
	padding-top: 40px;
}

/* The white content surface: rounded top corners tucked below the nav,
   full-bleed card with the content itself still constrained to 1200px. */
body.single-guesty_property .gps-single {
	max-width: none;
	background: #FFF;
	border-radius: 24px 24px 0 0;
	margin-top: -24px;
	position: relative;
	padding: 40px max(var(--gps-gap, 1.25rem), calc((100% - 1200px) / 2)) var(--gps-gap, 1.25rem);
}

/* Property title, per the SeaSky type spec. */
body.single-guesty_property .gps-single__title {
	color: var(--Aqua-Turquoise, #26A5B8);
	font-family: Lora, Georgia, serif;
	font-size: 72px;
	font-style: normal;
	font-weight: 400;
	line-height: 65px; /* 90.278% */
	letter-spacing: -3px;
}

/* Keep the display size sane on smaller screens. */
@media (max-width: 900px) {
	body.single-guesty_property .gps-single__title {
		font-size: 44px;
		line-height: 42px;
		letter-spacing: -1.5px;
	}
}

@media (max-width: 480px) {
	body.single-guesty_property .gps-single__title {
		font-size: 34px;
		line-height: 34px;
		letter-spacing: -1px;
	}
}

/* "Back to all properties" — teal pill, per the SeaSky spec. */
body.single-guesty_property .gps-single__back {
	display: inline-flex;
	padding: 10px 12px;
	justify-content: center;
	align-items: center;
	gap: 12px;
	border-radius: 1440px;
	background: var(--Aqua-Turquoise, #26A5B8);
	color: #FFF;
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: 700;
	line-height: 15.96px; /* 133% */
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
	margin-bottom: 1.25rem;
}

body.single-guesty_property .gps-single__back:hover {
	background: #1e8a9a;
	text-decoration: none;
}

/* Facts (bedrooms / bathrooms / sleeps) — light-teal pills with icons. */
body.single-guesty_property .gps-single__facts {
	gap: 0.75rem;
}

body.single-guesty_property .gps-single__fact {
	display: flex;
	padding: 4px 10px 4px 6px;
	align-items: center;
	gap: 4px;
	border-radius: 1000px;
	background: #E2F7F9;
	color: var(--Blue-Black, #021432);
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 12px; /* 100% */
	letter-spacing: -0.3px;
}

body.single-guesty_property .gps-single__fact::before {
	content: "";
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	background-color: var(--Aqua-Turquoise, #26A5B8);
	-webkit-mask: var(--ssv-fact-icon) no-repeat center / contain;
	mask: var(--ssv-fact-icon) no-repeat center / contain;
}

/* Bed / bath / person icons (template renders facts in this order). */
body.single-guesty_property .gps-single__fact:nth-child(1) {
	--ssv-fact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M3 18v-6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v6M3 18h18M3 18v2M21 18v2M5 10V7a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v3M8 10c0-1 .8-1.6 2-1.6s2 .6 2 1.6M12 10c0-1 .8-1.6 2-1.6s2 .6 2 1.6'/%3E%3C/svg%3E");
}

body.single-guesty_property .gps-single__fact:nth-child(2) {
	--ssv-fact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M4 12h16v2a5 5 0 0 1-5 5H9a5 5 0 0 1-5-5v-2zM7 19l-1 2M17 19l1 2M6 12V5.5A2.5 2.5 0 0 1 8.5 3c1.2 0 2.1.8 2.4 1.9M9 6.5c.8-1 2.3-1 3 0'/%3E%3C/svg%3E");
}

body.single-guesty_property .gps-single__fact:nth-child(3) {
	--ssv-fact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='7.5' r='3.5'/%3E%3Cpath d='M5.5 20c.8-3.5 3.4-5.5 6.5-5.5s5.7 2 6.5 5.5'/%3E%3C/svg%3E");
}

/* Property description body copy. */
body.single-guesty_property .gps-single__description,
body.single-guesty_property .gps-single__description p {
	color: var(--Blue-Black, #021432);
	font-family: Mulish, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 25.92px; /* 162% */
	letter-spacing: -0.3px;
}

/* Section headings (Amenities, Availability, House rules). */
body.single-guesty_property .gps-single__content h2 {
	color: var(--Aqua-Turquoise, #26A5B8);
	font-family: Mulish, sans-serif;
	font-size: 24px;
	font-style: normal;
	font-weight: 600;
	line-height: 28px; /* 116.667% */
	letter-spacing: 0.14px;
	text-transform: uppercase;
}

/* Amenity item labels. */
body.single-guesty_property .gps-amenities__item {
	color: #000;
	font-family: Inter, Mulish, sans-serif;
	font-size: 14.1px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

/* Booking widget panel, per the SeaSky spec (21px padding, 14.4px gaps). */
body.single-guesty_property .gps-booking-widget {
	border-radius: 10px;
	border: 1px solid #E2F7F9;
	background: #FFF;
	box-shadow: 0 0 47.9px 0 rgba(0, 0, 0, 0.09), 0 1px 3px 0 rgba(0, 0, 0, 0.08);
	padding: 21px;
	gap: 14.4px;
}

/* Field labels (Dates / Guests). */
body.single-guesty_property .gps-booking-widget .gps-field__label {
	color: var(--Cerulean-Teal-Blue, #00657F);
	font-family: Mulish, sans-serif;
	font-size: 11.8px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	letter-spacing: -0.3px;
}

/* Form fields — 40px pills. */
body.single-guesty_property .gps-booking-widget .gps-field__control {
	display: flex;
	height: 40px;
	padding: 0 12px;
	justify-content: space-between;
	align-items: center;
	align-self: stretch;
	border-radius: 100px;
	border: 1px solid #E8EAED;
	background: #FFF;
	font-family: Mulish, sans-serif;
	color: var(--Blue-Black, #021432);
}

/* Price block: "From" / amount / "night" hierarchy. */
body.single-guesty_property .gps-booking-widget__price {
	color: var(--Cerulean-Teal-Blue, #00657F);
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
	line-height: 12px; /* 100% */
	letter-spacing: -0.3px;
	margin: 0;
}

body.single-guesty_property .gps-booking-widget__price-from {
	display: block;
	margin-bottom: 2px;
}

body.single-guesty_property .gps-booking-widget__price-amount {
	font-size: 24px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.3px;
}

body.single-guesty_property .gps-booking-widget__price-per {
	line-height: 24px;
}

/* CTA button — 39px teal pill, per the SeaSky spec. */
body.single-guesty_property .gps-booking-widget__submit {
	display: flex;
	height: 39px;
	padding: 0 40px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 12px;
	align-self: stretch;
	width: 100%;
	border-radius: 100px;
	background: #26A5B8;
	border: none;
	color: #FFF;
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}

/* Calendars (booking widget + Availability section): match the page. */
body.single-guesty_property .gps-booking-widget,
body.single-guesty_property .gps-calendar {
	/* Selected days + accents use the brand teal; blocked days use the
	   light teal instead of the default pink. */
	--gps-color-primary: #26A5B8;
	--gps-color-unavailable: #E2F7F9;
}

body.single-guesty_property .gps-calendar__month {
	border: 1px solid #E8EAED;
	border-radius: 16px;
	font-family: Mulish, sans-serif;
}

body.single-guesty_property .gps-calendar__month-title {
	font-family: Mulish, sans-serif;
	font-size: 14px;
	font-weight: 700;
	color: var(--Blue-Black, #021432);
}

body.single-guesty_property .gps-calendar__weekday {
	font-family: Mulish, sans-serif;
	font-size: 11px;
	font-weight: 600;
	color: var(--Cerulean-Teal-Blue, #00657F);
}

body.single-guesty_property .gps-calendar__day {
	font-family: Mulish, sans-serif;
	font-size: 12px;
	color: var(--Blue-Black, #021432);
	border-radius: 8px;
}

body.single-guesty_property .gps-calendar__day--unavailable {
	color: rgba(8, 28, 43, 0.4);
}

body.single-guesty_property .gps-calendar__day-price {
	font-family: Mulish, sans-serif;
	font-size: 9px;
	letter-spacing: -0.2px;
}

body.single-guesty_property .gps-calendar__nav-button {
	border: 1px solid #E8EAED;
	border-radius: 999px;
	width: 28px;
	height: 28px;
	color: var(--Aqua-Turquoise, #26A5B8);
	background: #FFF;
}

/* Teal chevrons, right-aligned, on both field pills. */
body.single-guesty_property .gps-booking-widget select.gps-field__control,
body.single-guesty_property .gps-booking-widget .gps-booking-widget__dates {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2326A5B8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 16px;
	cursor: pointer;
}

/* Quote breakdown rows (Accommodation / fees / taxes / Total). */
body.single-guesty_property .gps-quote__row,
body.single-guesty_property .gps-quote__plan-label {
	font-family: Mulish, sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: var(--Blue-Black, #021432);
	letter-spacing: -0.3px;
}

body.single-guesty_property .gps-quote__row--total {
	font-size: 16px;
	font-weight: 700;
	color: var(--Cerulean-Teal-Blue, #00657F);
}

/* Placeholder text inside fields ("Select dates", guest count). */
body.single-guesty_property .gps-booking-widget__dates [data-gps-dates-label],
body.single-guesty_property .gps-booking-widget select.gps-field__control {
	color: rgba(8, 28, 43, 0.48);
	font-family: Mulish, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 14px; /* 100% */
}

body.single-guesty_property .gps-booking-widget__submit:hover:not(:disabled) {
	background: #1e8a9a;
}

/* Location line — coral pill, per the SeaSky spec. */
body.single-guesty_property .gps-single__location {
	display: inline-flex;
	padding: 6px 12px;
	align-items: center;
	gap: 6px;
	border-radius: 1440px;
	background: #F2705D;
	backdrop-filter: blur(8px);
	color: #FFF;
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 15.96px;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-top: 0.5rem;
}

body.single-guesty_property .gps-single__location::before {
	content: "";
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	background-color: #FFF;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Checkout page: same teal nav treatment, but no content card overlaps the
   strip, so the bottom padding is the plain 40px. */
body.page-id-8 .elementor-location-header {
	padding-bottom: 40px;
}

/* Checkout: breathing room at the bottom of the page. */
body.page-id-8 .gps-checkout {
	padding-bottom: 64px;
}

/* Checkout submit — SeaSky coral pill (the plugin default teal is not a
   brand colour). */
.gps-checkout__submit,
.gps-checkout .gps-button--primary {
	border-radius: 100px;
	background: #F2705D;
	border: none;
	color: #FFF;
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 14px 40px;
}

.gps-checkout__submit:hover:not(:disabled),
.gps-checkout .gps-button--primary:hover:not(:disabled) {
	background: #E05A46;
	opacity: 1;
}

/* Grid/Map switcher bar (on custom pages like /properties/): right-aligned
   with breathing room below, active pill in SeaSky teal. */
.gps-browser__bar {
	display: flex;
	justify-content: flex-end;
	padding-bottom: 24px;
}

.gps-view-toggle__option--active {
	background: var(--Aqua-Turquoise, #26A5B8);
	color: #FFF;
}

/* Checkout "Back" control - teal pill, matching the property-page back link. */
.gps-checkout__back {
	display: inline-flex;
	align-self: flex-start;
	padding: 10px 12px;
	align-items: center;
	gap: 12px;
	border-radius: 1440px;
	background: var(--Aqua-Turquoise, #26A5B8);
	color: #FFF;
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 15.96px;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-decoration: none;
}

.gps-checkout__back:hover {
	background: #1e8a9a;
	color: #FFF;
	text-decoration: none;
}

/* Property card titles (grid / map cards), per the SeaSky spec. */
.gps-card__title,
.gps-card__title a {
	color: var(--Aqua-Turquoise, #26A5B8);
	font-family: Mulish, sans-serif;
	font-size: 24px;
	font-style: normal;
	font-weight: 600;
	line-height: 28px; /* 116.667% */
	letter-spacing: 0.14px;
	text-transform: uppercase;
}

/* Card location — same coral pill (with pin) as the single property page. */
.gps-card__location {
	display: inline-flex;
	padding: 6px 12px;
	align-items: center;
	gap: 6px;
	border-radius: 1440px;
	background: #F2705D;
	backdrop-filter: blur(8px);
	color: #FFF;
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 15.96px;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin: 0;
	align-self: flex-start;
}

.gps-card__location::before {
	content: "";
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	background-color: #FFF;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Card facts — same light-teal pills with icons as the single page. */
.gps-card__facts {
	gap: 0.75rem;
}

.gps-card__fact {
	display: flex;
	padding: 4px 10px 4px 6px;
	align-items: center;
	gap: 4px;
	border-radius: 1000px;
	background: #E2F7F9;
	color: var(--Blue-Black, #021432);
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 12px;
	letter-spacing: -0.3px;
}

.gps-card__fact::before {
	content: "";
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	background-color: var(--Aqua-Turquoise, #26A5B8);
	-webkit-mask: var(--ssv-fact-icon) no-repeat center / contain;
	mask: var(--ssv-fact-icon) no-repeat center / contain;
}

.gps-card__fact:nth-child(1) { --ssv-fact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M3 18v-6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v6M3 18h18M3 18v2M21 18v2M5 10V7a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v3M8 10c0-1 .8-1.6 2-1.6s2 .6 2 1.6M12 10c0-1 .8-1.6 2-1.6s2 .6 2 1.6'/%3E%3C/svg%3E"); }
.gps-card__fact:nth-child(2) { --ssv-fact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M4 12h16v2a5 5 0 0 1-5 5H9a5 5 0 0 1-5-5v-2zM7 19l-1 2M17 19l1 2M6 12V5.5A2.5 2.5 0 0 1 8.5 3c1.2 0 2.1.8 2.4 1.9M9 6.5c.8-1 2.3-1 3 0'/%3E%3C/svg%3E"); }
.gps-card__fact:nth-child(3) { --ssv-fact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='7.5' r='3.5'/%3E%3Cpath d='M5.5 20c.8-3.5 3.4-5.5 6.5-5.5s5.7 2 6.5 5.5'/%3E%3C/svg%3E"); }

/* Card price - same From / amount / night hierarchy as the booking widget. */
.gps-card__price {
	color: var(--Cerulean-Teal-Blue, #00657F);
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-weight: 600;
	line-height: 12px;
	letter-spacing: -0.3px;
}

.gps-card__price-from {
	display: block;
	margin-bottom: 2px;
}

.gps-card__price-amount {
	font-size: 24px;
	font-weight: 600;
	line-height: 24px;
	letter-spacing: -0.3px;
}

.gps-card__price-per {
	line-height: 24px;
}

/* Card "View property" button - teal pill, per the SeaSky spec. */
.gps-card__cta,
.gps-card__cta.gps-button--ghost {
	border-radius: 100px;
	background: #26A5B8;
	border: none;
	color: #FFF;
	font-family: Mulish, sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 15.96px; /* 133% */
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 10px 20px;
}

.gps-card__cta:hover {
	background: #1e8a9a;
	color: #FFF;
	opacity: 1;
}

/* Checkout: breathing room above the form/summary. */
body.page-id-8 .gps-checkout {
	padding-top: 40px;
}

/* Pill text must stay white regardless of Elementor kit typography. */
.gps-card .gps-card__location,
.gps-single .gps-single__location {
	color: #FFF !important;
}

/* View switcher: brand colour + type, with enough specificity to beat the
   plugin's neutral defaults (plugin CSS loads after the theme's). */
.gps-view-switcher .gps-view-switcher__label {
	font-family: Mulish, sans-serif;
	font-size: 14px;
	font-weight: 600;
}

.gps-view-toggle .gps-view-toggle__option {
	font-family: Mulish, sans-serif;
	font-size: 13px;
	font-weight: 700;
}

.gps-view-toggle .gps-view-toggle__option--active {
	background: #26A7BA;
	color: #FFF;
}

/* ---------------------------------------------------------------------------
 * Property card images — uniform Figma ratio (430 x 254.25).
 * Photos come from Guesty in mixed orientations; lock every card image to the
 * same aspect ratio with cover-cropping so grid rows are even.
 * ------------------------------------------------------------------------- */
.gps-card__media {
	aspect-ratio: 430 / 254.25 !important;
	overflow: hidden;
}

.gps-card__media .gps-card__image {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

/* ---------------------------------------------------------------------------
 * Map split view — two cards per row, price + View Property on one line.
 * The page wrapper's 80px side padding shrinks to 24px in map view (scoped
 * via :has so grid view keeps its framing), the footer never wraps, and the
 * price/button compact slightly as cards narrow. Below 1200px two columns
 * can't physically fit a one-line footer, so the list goes single-column.
 * ------------------------------------------------------------------------- */
.elementor-element-props-shortcode-wrap:has(.gps-map-split) {
	padding-left: 24px !important;
	padding-right: 24px !important;
}

.gps-card__footer {
	flex-wrap: nowrap;
}

.gps-card__price {
	white-space: nowrap;
}

.gps-card__cta {
	white-space: nowrap;
	flex-shrink: 0;
}

.gps-map-split .gps-card__footer {
	gap: 8px;
}

.gps-map-split .gps-card__price-amount {
	font-size: 18px;
	line-height: 20px;
}

.gps-map-split .gps-card__cta,
.gps-map-split .gps-card__cta.gps-button--ghost {
	padding: 10px 14px;
	font-size: 11px;
	letter-spacing: 1px;
}

@media (min-width: 1200px) {
	.gps-map-split .gps-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (min-width: 960px) and (max-width: 1199px) {
	.gps-map-split .gps-grid {
		grid-template-columns: 1fr !important;
	}
}

@media (min-width: 1200px) and (max-width: 1439px) {
	.gps-map-split .gps-card__body {
		padding: 16px;
	}

	.gps-map-split .gps-card__price-amount {
		font-size: 16px;
		line-height: 18px;
	}

	.gps-map-split .gps-card__cta,
	.gps-map-split .gps-card__cta.gps-button--ghost {
		padding: 9px 12px;
		font-size: 10.5px;
		letter-spacing: 0.5px;
	}
}

/* ---------------------------------------------------------------------------
 * Card content alignment — location pill and facts start at the same height
 * on every card. Titles get a reserved two-line box (no clamping: long villa
 * names still show in full; map view uses a smaller title so they fit).
 * ------------------------------------------------------------------------- */
.gps-card__title {
	font-size: 24px !important;
	line-height: 28px !important;
	min-height: 56px;
}

.gps-card__title a {
	font-size: inherit !important;
	line-height: inherit !important;
}

.gps-map-split .gps-card__title {
	font-size: 20px !important;
	line-height: 24px !important;
	min-height: 48px;
}

/* ---------------------------------------------------------------------------
 * Map split view — beds/baths/sleeps pills on ONE line. Compact pills fit
 * the narrower split cards; an extra notch for the 1200-1365px band.
 * (Below 1200px the split is single-column, so pills have room anyway.)
 * ------------------------------------------------------------------------- */
.gps-map-split .gps-card__body {
	padding: 14px;
}

.gps-map-split .gps-card__facts {
	gap: 6px;
	flex-wrap: nowrap;
}

.gps-map-split .gps-card__fact {
	font-size: 11px;
	padding: 3px 8px 3px 5px;
	gap: 3px;
	white-space: nowrap;
}

.gps-map-split .gps-card__fact::before {
	width: 16px;
	height: 16px;
}

@media (min-width: 1200px) and (max-width: 1365px) {
	.gps-map-split .gps-card__facts {
		gap: 4px;
	}

	.gps-map-split .gps-card__fact {
		font-size: 10px;
		padding: 2px 6px 2px 4px;
		gap: 2px;
	}

	.gps-map-split .gps-card__fact::before {
		width: 14px;
		height: 14px;
	}
}

/* ---------------------------------------------------------------------------
 * Map — SeaSky skin: pins, popup cards, expand button, modal close.
 * ------------------------------------------------------------------------- */

/* Price pins: Mulish, cerulean text on white; teal when hovered/active. */
.gps-map .gps-map__pin {
	font-family: "Mulish", sans-serif !important;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.2px;
	color: var(--Cerulean-Teal-Blue, #00657F);
	border: 1px solid #E2F7F9;
}

.gps-map .gps-map__pin--hover,
.gps-map .gps-map__pin--active {
	background: var(--Aqua-Turquoise, #26A5B8) !important;
	color: #fff !important;
	border-color: var(--Aqua-Turquoise, #26A5B8);
}

/* Popup card */
.gps-map__popup-container,
.gps-map__popup-container * {
	font-family: "Mulish", sans-serif;
}

.gps-map-popup__title {
	color: var(--Aqua-Turquoise, #26A5B8) !important;
	font-size: 15px;
	font-weight: 600;
	line-height: 19px;
	letter-spacing: 0.4px;
	text-transform: uppercase;
}

.gps-map-popup__facts {
	color: var(--Blue-Black, #021432) !important;
	font-size: 12px;
	letter-spacing: -0.2px;
}

.gps-map-popup__price {
	color: var(--Cerulean-Teal-Blue, #00657F) !important;
	font-size: 12px;
}

.gps-map-popup__price strong {
	font-size: 18px;
	font-weight: 600;
	letter-spacing: -0.3px;
}

.gps-map-popup__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-top: 4px;
	padding: 9px 18px;
	border-radius: 100px;
	background: var(--Aqua-Turquoise, #26A5B8);
	color: #fff !important;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	transition: background 0.2s ease;
}

.gps-map-popup__link:hover,
.gps-map-popup__link:focus {
	background: var(--Cerulean-Teal-Blue, #00657F);
	color: #fff !important;
}

/* Popup close: teal circle over the photo. */
.gps-map__popup-container .maplibregl-popup-close-button,
.gps-map__popup-container .leaflet-popup-close-button {
	top: 8px !important;
	right: 8px !important;
	width: 26px !important;
	height: 26px !important;
	border-radius: 50%;
	background: var(--Aqua-Turquoise, #26A5B8) !important;
	color: #fff !important;
	font-size: 14px !important;
	line-height: 26px !important;
	text-align: center;
	text-shadow: none;
	opacity: 0.95;
}

/* Expand button + modal close: brand pills. */
.gps-map__expand {
	border-radius: 100px;
	border-color: #E2F7F9;
	color: var(--Cerulean-Teal-Blue, #00657F);
	transition: background 0.2s ease, color 0.2s ease;
}

.gps-map__expand:hover {
	background: var(--Aqua-Turquoise, #26A5B8);
	border-color: var(--Aqua-Turquoise, #26A5B8);
	color: #fff;
}

.gps-map-modal__close {
	background: var(--Aqua-Turquoise, #26A5B8);
	color: #fff;
	transition: background 0.2s ease;
}

.gps-map-modal__close:hover {
	background: var(--Cerulean-Teal-Blue, #00657F);
	color: #fff;
}

/* Cooperative-gesture hint + attribution in brand type. */
.gps-map .maplibregl-cooperative-gesture-screen,
.gps-map .maplibregl-ctrl-attrib {
	font-family: "Mulish", sans-serif;
}
