/* Island Compass - Villas listing page.
   Loaded ONLY on page 326 (see ic-villas-list.php). Every selector is scoped
   to an .ic-vl* class on that page. No element-only or global selectors. */

.ic-vl-intro > .e-con-inner { gap: var(--space-3); max-width: var(--container-text); }
.ic-vl-h1 .elementor-heading-title {
  font-family: var(--font-display);
  font-size: var(--text-h1);
  font-weight: var(--weight-regular);
  line-height: var(--leading-heading);
  margin: 0;
}
.ic-vl-lede p {
  font-family: var(--font-sans);
  font-size: var(--text-body);
  line-height: var(--leading-body);
  color: var(--text-secondary);
  max-width: var(--measure-body);
  margin: 0;
}
/* Toolbar: search + filters */
.ic-vl-bar > .e-con-inner {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-4);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--border-hairline);
}
.ic-vl-search input[type="text"],
.ic-vl-search input[type="search"] {
  font-family: var(--font-sans);
  font-size: var(--text-body-sm);
  padding: 10px 14px;
  min-width: 260px;
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-control);
  color: var(--text-primary);
}
.ic-vl-filters .filter-title {
  font-family: var(--font-sans);
  font-size: var(--text-caption);
  text-transform: uppercase;
  letter-spacing: var(--tracking-eyebrow);
  color: var(--text-tertiary);
  margin: 0 0 var(--space-2);
}
.ic-vl-filters label {
  font-family: var(--font-sans);
  font-size: var(--text-body-sm);
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ic-vl-filters .reset-form {
  font-family: var(--font-sans);
  font-size: var(--text-caption);
  letter-spacing: var(--tracking-button);
  background: none;
  border: 0;
  border-bottom: 1px solid var(--border-default);
  color: var(--text-secondary);
  padding: 2px 0;
  cursor: pointer;
}
/* Villa cards */
.ic-vl-results .post-wrapper {
  display: flex;
  flex-direction: column;
  background: var(--surface-card);
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-card);
  overflow: hidden;
  transition: box-shadow var(--dur-base, 250ms) var(--ease-standard, ease);
}
.ic-vl-results .post-wrapper:hover { box-shadow: var(--shadow-md); }
.ic-vl-results .post-image { overflow: hidden; }
.ic-vl-results .post-image img {
  width: 100%;
  display: block;
  object-fit: cover;
  transition: transform var(--dur-image, 600ms) var(--ease-standard, ease);
}
.ic-vl-results .post-wrapper:hover .post-image img { transform: scale(1.04); }
.ic-vl-results .inner-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-5);
  flex: 1;
}
.ic-vl-results .elementor-repeater-item-c1 {
  font-family: var(--font-sans);
  font-size: var(--text-caption);
  text-transform: uppercase;
  letter-spacing: var(--tracking-eyebrow);
  color: var(--text-tertiary);
}
.ic-vl-results .post-title {
  font-family: var(--font-display);
  font-size: var(--text-h4);
  font-weight: var(--weight-regular);
  line-height: 1.25;
  margin: 0;
}
.ic-vl-results .post-title a { color: var(--text-primary); text-decoration: none; }
.ic-vl-results .post-taxonomy {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  list-style: none;
  margin: var(--space-2) 0 0;
  padding: 0;
}
.ic-vl-results .post-taxonomy li a {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: var(--text-caption);
  color: var(--text-secondary);
  text-decoration: none;
  background: var(--surface-subtle);
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-pill);
  padding: 4px 10px;
}
.ic-vl-results .post-read-more {
  margin-top: auto;
  align-self: flex-start;
  padding-top: var(--space-4);
  font-family: var(--font-sans);
  font-size: var(--text-body-sm);
  letter-spacing: var(--tracking-button);
  color: var(--text-primary);
  text-decoration: none;
}
.ic-vl-results .post-read-more:after {
  content: "";
  display: block;
  height: 1px;
  background: var(--text-primary);
  margin-top: 4px;
}
.ic-vl-results .nothing-found,
.ic-vl-results .no-post {
  font-family: var(--font-sans);
  font-size: var(--text-body);
  color: var(--text-secondary);
  padding: var(--space-6) 0;
  max-width: var(--measure-body);
}

@media (max-width: 767px) {
  .ic-vl-bar > .e-con-inner { flex-direction: column; align-items: stretch; gap: var(--space-3); }
  .ic-vl-search input[type="text"],
  .ic-vl-search input[type="search"] { min-width: 0; width: 100%; }
  .ic-vl-h1 .elementor-heading-title { font-size: var(--text-h2); }
  .ic-vl-results .inner-content { padding: var(--space-4); }
}
/* ==========================================================================
   FILTER BAR v2 - compact, designed, subordinate to the villas.
   Page-scoped: every selector carries .page-id-326.
   ========================================================================== */
body.page-id-326 .ic-vl-bar {
  padding: clamp(14px, 1.2vw, 18px) clamp(14px, 1.4vw, 20px);
  background: var(--surface-subtle);
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-card);
  margin-bottom: clamp(24px, 2.6vw, 40px);
}
body.page-id-326 .ic-vl-bar > .e-con-inner,
body.page-id-326 .ic-vl-bar {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: clamp(14px, 1.6vw, 26px);
  border-bottom: 0;
  padding-bottom: clamp(14px, 1.2vw, 18px);
}
body.page-id-326 .ic-vl-search { flex: 0 1 300px; }
body.page-id-326 .ic-vl-filters { flex: 1 1 460px; }
body.page-id-326 .ic-vl-filters form,
body.page-id-326 .ic-vl-filters .bpfwe-filter-container {
  background: transparent;
  border: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: clamp(14px, 1.6vw, 28px);
}
/* Each filter group reads as a labelled cluster */
body.page-id-326 .ic-vl-filters .filter-title,
body.page-id-326 .ic-vl-filters h4,
body.page-id-326 .ic-vl-filters legend {
  font-family: var(--font-sans);
  font-size: var(--text-caption);
  font-weight: var(--weight-medium, 500);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin: 0 0 8px;
}
body.page-id-326 .ic-vl-filters ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
body.page-id-326 .ic-vl-filters li { margin: 0; }
/* Checkboxes rendered as selectable pills */
body.page-id-326 .ic-vl-filters li label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-sans);
  font-size: .9375rem;
  line-height: 1.2;
  color: var(--text-secondary);
  background: var(--surface-card, #fff);
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-pill);
  padding: 7px 13px;
  cursor: pointer;
  transition: border-color 200ms var(--ease-standard, ease), color 200ms var(--ease-standard, ease);
}
body.page-id-326 .ic-vl-filters li label:hover { border-color: var(--border-default); color: var(--text-primary); }
body.page-id-326 .ic-vl-filters li input[type="checkbox"] { accent-color: var(--pink-700, #7f3961); margin: 0; }
/* Search field sits level with the filter clusters */
body.page-id-326 .ic-vl-search input[type="text"],
body.page-id-326 .ic-vl-search input[type="search"] {
  min-width: 0;
  width: 100%;
  padding: 11px 14px;
  font-size: .9375rem;
  background: var(--surface-card, #fff);
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-pill);
}
body.page-id-326 .ic-vl-search input:focus { border-color: var(--pink-700, #7f3961); outline: none; }

/* Reset: small, quiet, out of the way */
body.page-id-326 .ic-vl-filters .reset-form {
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text-tertiary);
  background: none;
  border: 0;
  border-bottom: 1px solid var(--border-hairline);
  padding: 2px 0;
  margin-top: 4px;
  align-self: flex-end;
  cursor: pointer;
  transition: color 200ms var(--ease-standard, ease);
}
body.page-id-326 .ic-vl-filters .reset-form:hover { color: var(--pink-700, #7f3961); border-bottom-color: var(--pink-700, #7f3961); }
/* No-results: concierge-led, not a plugin error */
body.page-id-326 .ic-vl-results .nothing-found,
body.page-id-326 .ic-vl-results .no-post,
body.page-id-326 .ic-vl-results .bpfwe-nothing-found {
  grid-column: 1 / -1;
  background: var(--surface-subtle);
  border: 1px solid var(--border-hairline);
  border-left: 2px solid var(--pink-700, #7f3961);
  border-radius: var(--radius-card);
  padding: clamp(24px, 2.6vw, 40px);
  margin: 0;
  font-family: var(--font-sans);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--text-secondary);
  max-width: 62ch;
}

/* "Looking for something specific?" - request chips, not filters */
body.page-id-326 .ic-vl-ask {
  margin-top: clamp(36px, 4vw, 64px);
  padding: clamp(26px, 2.8vw, 44px);
  background: var(--surface-subtle);
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-card);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}
body.page-id-326 .ic-vl-ask__h .elementor-heading-title {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.2vw, 2rem);
  font-weight: 400;
  line-height: 1.16;
  margin: 0;
}
body.page-id-326 .ic-vl-ask__p p { font-size: 1.0625rem; line-height: 1.6; color: var(--text-secondary); max-width: 62ch; margin: 0; }
body.page-id-326 .ic-vl-chips {
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body.page-id-326 .ic-vl-chips li { margin: 0; }
body.page-id-326 .ic-vl-chips a {
  display: inline-block;
  font-family: var(--font-sans);
  font-size: .9375rem;
  line-height: 1.2;
  color: var(--text-secondary);
  text-decoration: none;
  background: var(--surface-card, #fff);
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-pill);
  padding: 8px 15px;
  transition: border-color 200ms var(--ease-standard, ease), color 200ms var(--ease-standard, ease);
}
body.page-id-326 .ic-vl-chips a:hover { border-color: var(--pink-700, #7f3961); color: var(--pink-700, #7f3961); }
body.page-id-326 .ic-vl-ask__cta { margin-top: 6px; }

@media (max-width: 900px) {
  body.page-id-326 .ic-vl-bar { flex-direction: column; align-items: stretch; }
  body.page-id-326 .ic-vl-search, body.page-id-326 .ic-vl-filters { flex: 1 1 auto; width: 100%; }
}
@media (max-width: 767px) {
  body.page-id-326 .ic-vl-bar { padding: 14px; gap: 14px; }
  body.page-id-326 .ic-vl-filters form { gap: 16px; }
  body.page-id-326 .ic-vl-filters li label { font-size: .875rem; padding: 6px 11px; }
  body.page-id-326 .ic-vl-ask { padding: 22px; }
  body.page-id-326 .ic-vl-chips a { font-size: .875rem; padding: 7px 13px; }
}
/* ==========================================================================
   LISTING LAYOUT v2 - filter sidebar left, villa results right.
   Replaces the full-width filter bar above the grid. Page-scoped throughout.
   ========================================================================== */
body.page-id-326 .ic-vl-layout {
  display: grid;
  grid-template-columns: 268px minmax(0, 1fr);
  gap: clamp(24px, 2.6vw, 48px);
  align-items: start;
}
body.page-id-326 .ic-vl-side {
  position: sticky;
  top: 110px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: clamp(16px, 1.3vw, 22px);
  background: var(--surface-subtle);
  border: 1px solid var(--border-hairline);
  border-radius: var(--radius-card);
}
body.page-id-326 .ic-vl-side:before {
  content: "Filter villas";
  font-family: var(--font-sans);
  font-size: var(--text-caption);
  font-weight: var(--weight-medium, 500);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-tertiary);
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border-hairline);
}
body.page-id-326 .ic-vl-main { display: flex; flex-direction: column; gap: clamp(24px, 2.4vw, 40px); min-width: 0; }
/* Sidebar internals: stacked groups, no leftover row layout */
body.page-id-326 .ic-vl-side .ic-vl-search,
body.page-id-326 .ic-vl-side .ic-vl-filters { flex: 1 1 auto; width: 100%; }
body.page-id-326 .ic-vl-side .ic-vl-filters form,
body.page-id-326 .ic-vl-side .ic-vl-filters .bpfwe-filter-container {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 18px;
  background: transparent;
  border: 0;
  padding: 0;
}
body.page-id-326 .ic-vl-side .ic-vl-filters ul { gap: 5px; }
body.page-id-326 .ic-vl-side .ic-vl-filters li label {
  font-size: .875rem;
  padding: 6px 11px;
  gap: 6px;
}
body.page-id-326 .ic-vl-side .ic-vl-search input[type="text"],
body.page-id-326 .ic-vl-side .ic-vl-search input[type="search"] { padding: 10px 13px; font-size: .9375rem; }
body.page-id-326 .ic-vl-side .ic-vl-filters .reset-form { align-self: flex-start; margin-top: 2px; }

/* Two cards across in the narrower results column */
body.page-id-326 .ic-vl-main .ic-vl-results .elementor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(16px, 1.6vw, 26px);
}
@media (min-width: 1400px) {
  body.page-id-326 .ic-vl-main .ic-vl-results .elementor-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* Enquiry card: compact, sits inside the results column under the villas */
body.page-id-326 .ic-vl-main .ic-vl-ask {
  margin-top: 0;
  padding: clamp(20px, 2vw, 30px);
  background: var(--surface-subtle);
  border: 1px solid var(--border-hairline);
  border-left: 2px solid var(--pink-700, #7f3961);
  border-radius: var(--radius-card);
  gap: 10px;
}
body.page-id-326 .ic-vl-main .ic-vl-ask__h .elementor-heading-title { font-size: clamp(1.25rem, 1.7vw, 1.5rem); }
body.page-id-326 .ic-vl-main .ic-vl-ask__p p { font-size: 1rem; max-width: 52ch; }
body.page-id-326 .ic-vl-main .ic-vl-chips { margin-top: 2px; gap: 6px; }
body.page-id-326 .ic-vl-main .ic-vl-chips a { font-size: .875rem; padding: 6px 12px; }
body.page-id-326 .ic-vl-main .ic-vl-ask__cta { margin-top: 8px; }

/* The old full-width bar treatment is retired */
body.page-id-326 .ic-vl-bar { display: none; }
/* Tablet and mobile: no sidebar, filters stack compactly above the villas */
@media (max-width: 1024px) {
  body.page-id-326 .ic-vl-layout { grid-template-columns: 1fr; gap: 22px; }
  body.page-id-326 .ic-vl-side { position: static; top: auto; padding: 16px; gap: 14px; }
  body.page-id-326 .ic-vl-side .ic-vl-filters form,
  body.page-id-326 .ic-vl-side .ic-vl-filters .bpfwe-filter-container {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px 26px;
  }
  body.page-id-326 .ic-vl-main .ic-vl-results .elementor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  body.page-id-326 .ic-vl-layout { gap: 18px; }
  body.page-id-326 .ic-vl-side { padding: 14px; }
  body.page-id-326 .ic-vl-side .ic-vl-filters form,
  body.page-id-326 .ic-vl-side .ic-vl-filters .bpfwe-filter-container { flex-direction: column; gap: 14px; }
  body.page-id-326 .ic-vl-main .ic-vl-results .elementor-grid { grid-template-columns: 1fr; gap: 16px; }
  body.page-id-326 .ic-vl-main .ic-vl-ask { padding: 18px; }
  body.page-id-326 .ic-vl { overflow-x: hidden; }
}
/* ==========================================================================
   SIDEBAR v2 - villa brief panel.
   Two clearly separated zones: real filters above, private requests below.
   The CSS label that used to read "Filter villas" is replaced by real
   heading widgets, so the pseudo-element is retired.
   ========================================================================== */
body.page-id-326 .ic-vl-side:before { content: none; }
body.page-id-326 .ic-vl-side { gap: 14px; padding: clamp(18px, 1.4vw, 24px); }
body.page-id-326 .ic-vl-side__h .elementor-heading-title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: var(--weight-regular);
  line-height: 1.2;
  letter-spacing: -.012em;
  color: var(--text-primary);
  margin: 0;
}
body.page-id-326 .ic-vl-side__note p {
  font-family: var(--font-sans);
  font-size: .875rem;
  line-height: 1.5;
  color: var(--text-tertiary);
  margin: 0 0 4px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border-hairline);
}
/* Private requests: visually distinct from the working filters above */
body.page-id-326 .ic-vl-req {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-top: 4px;
  padding-top: 16px;
  border-top: 1px solid var(--border-hairline);
}
body.page-id-326 .ic-vl-req__h .elementor-heading-title {
  font-family: var(--font-sans);
  font-size: var(--text-caption);
  font-weight: var(--weight-medium, 500);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin: 0;
}
body.page-id-326 .ic-vl-req__p p {
  font-family: var(--font-sans);
  font-size: .8125rem;
  line-height: 1.5;
  color: var(--text-tertiary);
  margin: 0;
}
/* Request chips: outlined and dashed, so they never read as active filters */
body.page-id-326 .ic-vl-req .ic-vl-chips { margin: 4px 0 0; gap: 6px; }
body.page-id-326 .ic-vl-req .ic-vl-chips a {
  font-size: .8125rem;
  padding: 5px 11px;
  background: transparent;
  border: 1px dashed var(--border-default);
  color: var(--text-secondary);
}
body.page-id-326 .ic-vl-req .ic-vl-chips a:hover {
  border-style: solid;
  border-color: var(--pink-700, #7f3961);
  color: var(--pink-700, #7f3961);
}
body.page-id-326 .ic-vl-req__cta { margin-top: 8px; width: 100%; }
body.page-id-326 .ic-vl-req__cta .elementor-button { width: 100%; justify-content: center; font-size: .8125rem; min-height: 44px; }
/* Enquiry card under the results keeps the brief route visible at all times,
   including when a filter combination returns nothing. */
body.page-id-326 .ic-vl-main .ic-vl-ask { gap: 8px; }
body.page-id-326 .ic-vl-main .ic-vl-ask__cta .elementor-button { min-height: 48px; }

@media (max-width: 1024px) {
  body.page-id-326 .ic-vl-req { padding-top: 14px; }
  body.page-id-326 .ic-vl-req__cta { width: auto; }
  body.page-id-326 .ic-vl-req__cta .elementor-button { width: auto; padding: 0 26px; }
  body.page-id-326 .ic-vl-side__note p { padding-bottom: 12px; }
}
@media (max-width: 767px) {
  body.page-id-326 .ic-vl-side { padding: 16px; }
  body.page-id-326 .ic-vl-side__h .elementor-heading-title { font-size: 1.125rem; }
  body.page-id-326 .ic-vl-req .ic-vl-chips a { font-size: .78125rem; padding: 5px 10px; }
  body.page-id-326 .ic-vl-req__cta { width: 100%; }
  body.page-id-326 .ic-vl-req__cta .elementor-button { width: 100%; }
}
/* ==========================================================================
   BEDROOM RANGE + NO-RESULTS CTA
   The Bedrooms filter now lists a fixed 1-6+ range. Options with no current
   matches are not hidden or dimmed - they simply return the concierge state.
   ========================================================================== */
body.page-id-326 .ic-vl-side .flex-wrapper.villa_bedrooms ul {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
body.page-id-326 .ic-vl-side .flex-wrapper.villa_bedrooms li label {
  min-width: 42px;
  justify-content: center;
  padding: 6px 10px;
}

/* ==========================================================================
   VILLA CARD SPECS - bedrooms and bathrooms, number first then icon.
   Two distinct line icons drawn as inline SVG data URIs in a deeper pink
   (#C25E9B) so they stay visible on a white card; the light brand pink was
   too faint at 17px. No icon font or plugin involved.
   ========================================================================== */
body.page-id-326 .ic-vl-results .elementor-repeater-item-c4,
body.page-id-326 .ic-vl-results .elementor-repeater-item-c4b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-sans);
  font-size: 1rem;
  color: var(--text-primary);
}
body.page-id-326 .ic-vl-results .elementor-repeater-item-c4:after,
body.page-id-326 .ic-vl-results .elementor-repeater-item-c4b:after {
  content: "";
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
body.page-id-326 .ic-vl-results .elementor-repeater-item-c4:after { background-image: url('data:image/svg+xml;utf8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23C25E9B%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 18v-6a2 2 0 0 1 2-2h11a3 3 0 0 1 3 3v5%22/%3E%3Cpath d=%22M3 14h18%22/%3E%3Cpath d=%22M7 10V7h5v3%22/%3E%3Cpath d=%22M3 18v2%22/%3E%3Cpath d=%22M21 18v2%22/%3E%3C/svg%3E'); }
body.page-id-326 .ic-vl-results .elementor-repeater-item-c4b:after { background-image: url('data:image/svg+xml;utf8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23C25E9B%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 12h16v3a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4v-3z%22/%3E%3Cpath d=%22M6 12V6a2 2 0 0 1 3.5-1.3%22/%3E%3Cpath d=%22M8.5 5.5h2%22/%3E%3Cpath d=%22M7 19l-1 2%22/%3E%3Cpath d=%22M17 19l1 2%22/%3E%3C/svg%3E'); }

/* Bedrooms and bathrooms sit on one line with an even gap; no separator
   character, so nothing can orphan onto a second line. */
body.page-id-326 .ic-vl-results .elementor-repeater-item-c4 { margin-right: 16px; }