.bl-stab{width:100%;box-sizing:border-box}
.bl-stab *{box-sizing:border-box}
.bl-stab--cards{width:100%}
.bl-stab--cards .bl-stab__items{display:grid;grid-gap:24px}

/* Sort bar aligns to the right */
.bl-stab__bar{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin:0 0 16px 0}
.bl-stab__bar label{font-size:14px;opacity:.8}
.bl-stab--cards.bl-cols-1 .bl-stab__items{grid-template-columns:1fr}
.bl-stab--cards.bl-cols-2 .bl-stab__items{grid-template-columns:repeat(2,minmax(0,1fr))}
.bl-stab--cards.bl-cols-3 .bl-stab__items{grid-template-columns:repeat(3,minmax(0,1fr))}
.bl-stab--cards.bl-cols-4 .bl-stab__items{grid-template-columns:repeat(4,minmax(0,1fr))}
/* Responsive columns: apply to the element that actually *is* the grid (.bl-stab__items) */
@media (max-width:1024px){
  .bl-stab--cards.bl-cols-3 .bl-stab__items,
  .bl-stab--cards.bl-cols-4 .bl-stab__items{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:640px){
  .bl-stab--cards .bl-stab__items{
    grid-template-columns:1fr !important;
    grid-gap:16px;
  }
}

.bl-stab--list{display:flex;flex-direction:column;gap:10px}
.bl-stab--list .bl-card{margin-bottom:10px}
.bl-stab--list .bl-card:last-child{margin-bottom:0}

.bl-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:14px;overflow:hidden;box-shadow:0 8px 18px rgba(0,0,0,.04)}
.bl-stab--list .bl-card{display:flex;align-items:stretch}

.bl-card__media{position:relative;aspect-ratio:16/10;overflow:hidden;border-top-left-radius:16px;border-top-right-radius:16px}
/* List mode: make the image panel larger and let it stretch with the card height */
.bl-stab--list .bl-card__media{width:320px;min-width:320px;aspect-ratio:auto;min-height:200px;height:auto;display:flex;align-self:stretch;border-top-right-radius:0;border-bottom-left-radius:16px}

.bl-card__img{display:block;position:relative;width:100%;height:100%;background-size:cover;background-position:center center}
.bl-card__media img{display:block;width:100%;height:100%;object-fit:cover}

/* List mode: keep image compact */
.bl-stab--list .bl-card__img{width:100%;height:100%}
@media (max-width:640px){
  .bl-stab--list .bl-card{flex-direction:column}
  .bl-stab--list .bl-card__media{width:100%;min-width:0;height:auto;aspect-ratio:16/10;border-bottom-left-radius:0;border-top-right-radius:16px}
}

.bl-card__img--empty{background:linear-gradient(135deg,#f0f0f0,#fafafa)}

.bl-card__body{padding:16px 16px 14px}
.bl-card__title{margin:0 0 8px;font-size:22px;line-height:1.1;font-weight:600}
.bl-card__excerpt{margin:0 0 14px;color:rgba(0,0,0,.65);font-size:14.5px;line-height:1.45}

.bl-card__cta{display:flex;align-items:stretch;gap:12px;border-top:1px solid rgba(0,0,0,.06);padding-top:14px}
.bl-card__cta-left{min-width:78px;display:flex;align-items:center;justify-content:center;font-weight:700;color:#696a4b;font-size:18px}
.bl-card__cta-right{flex:1;display:flex;flex-direction:column;align-items:flex-end;gap:6px}

.bl-btn{display:inline-flex;align-items:center;justify-content:center;padding:9px 14px;border-radius:10px;background:#696a4b;color:#fff;text-decoration:none;font-weight:700;font-size:14px;line-height:1}
.bl-btn:hover{filter:brightness(1.05)}
.bl-btn--disabled{opacity:.45;pointer-events:none}

.bl-card__dates{font-size:13px;color:rgba(0,0,0,.65)}

.bl-stab-empty{padding:12px 14px;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:12px}


/* Sort bar */
.bl-stab__bar{display:flex;justify-content:flex-end;align-items:center;margin:0 0 12px 0}
.bl-stab__bar-right{display:flex;gap:8px;align-items:center}
.bl-stab__sort-label{font-size:14px;opacity:.85}
.bl-stab__sort{font-size:14px;padding:6px 10px;border:1px solid rgba(0,0,0,.15);border-radius:8px;background:#fff}
.bl-stab__items{width:100%}


/* UI enhancements v3.3.0 */
.bl-stab__bar{display:flex;justify-content:flex-end;align-items:center;margin:0 0 14px;flex-wrap:wrap;gap:10px}
.bl-stab__bar-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.bl-stab__sort{padding:6px 10px;border:1px solid rgba(0,0,0,.15);border-radius:8px;background:#fff}
.bl-stab__sleeps-label{font-size:14px;opacity:.85;white-space:nowrap}
.bl-stab__sleeps-label [data-bl-sleeps-out]{font-weight:600;opacity:1;display:inline-block;min-width:2ch}
.bl-stab__sleeps{width:140px;accent-color:currentColor;cursor:pointer}
@media (max-width: 640px){
  .bl-stab__bar{justify-content:flex-start}
  .bl-stab__sleeps{width:100%;min-width:160px}
}
.bl-stab__summary{margin:0 0 12px;padding:10px 12px;border:1px solid rgba(0,0,0,.08);border-radius:10px;background:rgba(0,0,0,.02);font-size:14px}
.bl-card{position:relative;overflow:hidden;border-radius:16px;box-shadow:0 6px 18px rgba(0,0,0,.08)}
.bl-car__btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.45);color:#fff;border:0;border-radius:999px;width:34px;height:34px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.bl-car__prev{left:10px}
.bl-car__next{right:10px}
.bl-car__dots{position:absolute;left:0;right:0;bottom:10px;display:flex;gap:6px;justify-content:center}
.bl-car__dot{width:8px;height:8px;border-radius:999px;border:0;background:rgba(255,255,255,.55);cursor:pointer}
.bl-car__dot.is-active{background:#fff}
.bl-card__badges{position:absolute;top:10px;left:10px;display:flex;gap:8px;z-index:3}
.bl-badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:12px;line-height:1;background:rgba(255,255,255,.9);border:1px solid rgba(0,0,0,.08)}


/* --- v3.3.3 UI tweaks (list spacing + CTA layout) --- */
.bl-stab--list .bl-card{gap:18px;padding:0;margin:0 0 18px 0}
.bl-stab--list{gap:18px}
.bl-stab--list .bl-card__body{display:flex;flex-direction:column;padding:18px 18px 16px}
.bl-stab--list .bl-card__cta{margin-top:auto}
.bl-stab--list .bl-card__cta-right{align-items:flex-start}
.bl-stab--list .bl-card__dates{text-align:left}

/* Make CTA stack under text (both grid + list) */
.bl-card__cta{flex-direction:column;align-items:flex-start}
.bl-card__cta-left{justify-content:flex-start;min-width:0}
.bl-card__cta-right{align-items:flex-start;width:100%}
.bl-card__cta-right .bl-btn{width:auto}
.bl-card__cta-right .bl-card__dates{opacity:.85}

/* Reduce "gap" feel under image by tightening body spacing on cards */
.bl-stab--cards .bl-card__body{padding-top:14px}
.bl-stab--cards .bl-card__excerpt{margin-bottom:12px}

.bl-stab--list .bl-card__media{aspect-ratio:auto !important;height:150px !important;}


/* ===== Visual polish v3.3.4 ===== */
.bl-card__body{display:flex;flex-direction:column;min-height:0}
.bl-card__title{font-size:20px;font-weight:650;margin-bottom:6px}
.bl-card__excerpt{margin:0 0 10px;color:rgba(0,0,0,.62)}
/* CTA: price left, button right; keep compact */
.bl-card__cta{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:0;padding-top:10px}
.bl-card__cta-left{min-width:auto;justify-content:flex-start}
.bl-card__cta-right{flex:0 0 auto;align-items:flex-end}
.bl-btn{border-radius:10px;padding:10px 16px}
/* Dates tucked under button */
.bl-card__dates{margin-top:6px;text-align:right}

/* Grid: remove awkward whitespace under media */
.bl-stab--cards .bl-card__body{padding:14px 14px 12px}
.bl-stab--cards .bl-card__excerpt{min-height:38px}

/* List: larger image, nicer rhythm */
.bl-stab--list{gap:18px}
.bl-stab--list .bl-card{align-items:stretch}
.bl-stab--list .bl-card__media{width:320px;min-width:320px;height:200px;border-bottom-left-radius:14px}
.bl-stab--list .bl-card__body{flex:1;padding:18px 18px 16px}
.bl-stab--list .bl-card__title{font-size:22px}
.bl-stab--list .bl-card__excerpt{font-size:15px;line-height:1.5}
.bl-stab--list .bl-card__cta{padding-top:8px}
@media (max-width:820px){
  .bl-stab--list .bl-card__media{width:100%;min-width:0;height:auto;aspect-ratio:16/9;border-bottom-left-radius:0;border-top-right-radius:14px}
  .bl-stab--list .bl-card{flex-direction:column}
  .bl-card__dates{text-align:left}
  .bl-card__cta{align-items:flex-start}
}

/* ===== Layout fix v3.3.5 (price left, button right, dates centered/bold; list tidy) ===== */

/* Use CSS grid for the CTA row so price/button are aligned, with dates on a second centered line */
.bl-card__cta{display:grid;grid-template-columns:1fr auto;grid-template-areas:"price btn" "dates dates";align-items:center;row-gap:8px;column-gap:14px;margin-top:auto;border-top:0;padding-top:10px}
.bl-card__cta-left{grid-area:price;display:block;justify-self:start;align-self:center;font-weight:800;color:#696a4b;font-size:18px}
/* let the right container disappear so its children can sit in the grid */
.bl-card__cta-right{display:contents !important}
.bl-card__cta-right .bl-btn{grid-area:btn;justify-self:end;align-self:center}
.bl-card__cta-right .bl-card__dates{grid-area:dates;justify-self:center;text-align:center;font-weight:800;color:rgba(0,0,0,.68);margin-top:0}

/* Grid cards: tighten the vertical rhythm under the media */
.bl-stab--cards .bl-card__body{padding:14px 14px 14px}
.bl-stab--cards .bl-card__excerpt{margin-bottom:10px;min-height:44px}

/* List view: remove “dead” whitespace, make image larger and rows spaced nicely */
.bl-stab--list{gap:20px}
.bl-stab--list .bl-card{gap:0;margin:0;padding:0}
.bl-stab--list .bl-card__media{width:360px;min-width:360px;min-height:210px;height:auto;display:flex;align-self:stretch;aspect-ratio:auto !important}
.bl-stab--list .bl-card__body{padding:18px 22px 18px;display:flex;flex-direction:column}
.bl-stab--list .bl-card__excerpt{margin-bottom:12px}

@media (max-width:1024px){
  .bl-stab--list .bl-card__media{width:320px;min-width:320px;min-height:200px;height:auto}
}
@media (max-width:820px){
  .bl-stab--list .bl-card{flex-direction:column}
  .bl-stab--list .bl-card__media{width:100%;min-width:0;height:auto;aspect-ratio:16/10 !important}
}


/* === List view spacing + tidy (hotfix v3.3.9) === */
.bl-stab.bl-stab--list .bl-stab__items{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
}

/* Ensure no theme styles collapse spacing */
.bl-stab.bl-stab--list .bl-card{
  margin:0 !important;
}

/* Keep list media from creating extra white space */
.bl-stab.bl-stab--list .bl-card__media{
  height:170px;
  overflow:hidden;
  background:#0000;
}
.bl-stab.bl-stab--list .bl-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}


/* ===== Sleeps pill (next to price in cta-left) ===== */
.bl-card__sleeps {
  display: inline-block;
  font-size: 0.85em;
  color: #555;
  font-weight: 400;
  margin-left: 4px;
  white-space: nowrap;
}
.bl-card__sleeps-sep {
  display: inline-block;
  margin: 0 4px 0 0;
  color: #999;
}

/* ===== Book Now button: force readable text colour =====
   The plugin colours the button background but inherits text colour from
   the surrounding theme/Elementor. On some pages that colour resolves to
   the same green as the background, making "Book Now" invisible.
   Setting it explicitly here removes the dependency on theme link colour. */
a.bl-btn,
a.bl-btn:link,
a.bl-btn:visited,
a.bl-btn:hover,
a.bl-btn:focus,
a.bl-btn:active,
.elementor a.bl-btn,
.elementor a.bl-btn:link,
.elementor a.bl-btn:visited,
.elementor a.bl-btn:hover,
.elementor a.bl-btn:focus {
  color: #ffffff;
  text-decoration: none;
}
