/**
 * v3.53 — Room card booking box: two tidy rows.
 * Row 1: Check-in + Check-out
 * Row 2: Adults + Children
 * Then: child ages / notes, then the full-width Check Availability button.
 */

.hl-room-show__dates-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px 16px !important;
  align-items: end;
}

.hl-room-show__dates-grid > .hl-room-show__date-field {
  grid-column: auto !important;
  min-width: 0;
}

/* Guest selectors always start a fresh row under the dates. */
.hl-room-show__dates-grid > .hl-guests-field--adults {
  grid-column: 1 !important;
}
.hl-room-show__dates-grid > .hl-guests-field--children {
  grid-column: 2 !important;
}

.hl-room-show__dates-grid > .hl-guests-extra,
.hl-room-show__dates-grid > .hl-room-show__confirm-dates {
  grid-column: 1 / -1 !important;
  width: 100%;
}

.hl-room-show__dates-grid > .hl-room-show__confirm-dates {
  margin-top: 4px;
}

.hl-room-show__dates-grid input[type="date"],
.hl-room-show__dates-grid select {
  width: 100%;
  min-width: 0;
}

/* Labels stay on one line and equal height so both columns align. */
.hl-room-show__dates-grid > .hl-room-show__date-field > label {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 480px) {
  .hl-room-show__dates-grid {
    grid-template-columns: 1fr !important;
  }
  .hl-room-show__dates-grid > .hl-guests-field--adults,
  .hl-room-show__dates-grid > .hl-guests-field--children {
    grid-column: 1 !important;
  }
}

/* ── v3.53.3 · Full amenity list inside the "View Details" panel ─────────── */
.hl-room-show__amenities-all { margin: 1.25rem 0 1rem; }
.hl-room-show__amenities-title {
  font-size: .78rem; letter-spacing: .16em; text-transform: uppercase;
  margin: 0 0 .85rem; opacity: .85;
}
.hl-room-show__amenity-group + .hl-room-show__amenity-group { margin-top: .9rem; }
.hl-room-show__amenity-group-title {
  font-size: .72rem; letter-spacing: .12em; text-transform: uppercase;
  margin: 0 0 .4rem; opacity: .6;
}
.hl-room-show__amenity-list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: .35rem .9rem;
}
.hl-room-show__amenity-list li {
  display: flex; align-items: center; gap: .45rem;
  font-size: .84rem; line-height: 1.5;
}
.hl-room-show__amenity-list li i,
.hl-room-show__amenity-list li svg { width: 14px; height: 14px; flex: 0 0 auto; opacity: .8; }
@media (max-width: 640px) {
  .hl-room-show__amenity-list { grid-template-columns: 1fr 1fr; gap: .3rem .6rem; }
  .hl-room-show__amenity-list li { font-size: .8rem; }
}