/* LUS property page, Airbnb-style (templates/property_page_templates/listing_page_5.php).
   Everything is scoped under .lus-pp so no other page is touched. */

.lus-pp {
  --lus-ink: #222;
  --lus-mute: #717171;
  --lus-line: #e6e6e6;
  --lus-soft: #f7f7f7;
  --lus-radius: 14px;
  color: var(--lus-ink);
}

/* ---- Header ---- */
.lus-pp-head {
  padding: 28px 0 14px;
}
.lus-pp-head h1.entry-title {
  margin: 0 0 8px;
  font-size: 30px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.lus-pp-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.lus-pp-head-info {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 15px;
  color: var(--lus-ink);
}
.lus-pp-head-info a,
.lus-pp-location a {
  color: var(--lus-ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.lus-pp-rating .property_ratings {
  margin: 0;
}
.lus-pp-head-actions {
  display: flex;
  gap: 6px;
}
.lus-pp-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--lus-ink);
  font-size: 14px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.lus-pp-action:hover {
  background: var(--lus-soft);
}
.lus-pp-action .lus-pp-ico {
  width: 18px;
  height: 18px;
}
.lus-pp-save.isfavorite .lus-pp-ico {
  fill: #e52737;
  stroke: #e52737;
}

/* ---- Photo grid ---- */
.lus-pp-gallery {
  position: relative;
  display: grid;
  gap: 8px;
  height: 440px;
  margin: 0 0 8px;
  border-radius: var(--lus-radius);
  overflow: hidden;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 1fr);
}
.lus-pp-tile {
  /* the theme sizes and floats .image_gallery boxes at tablet widths; the grid sizes ours */
  float: none;
  width: auto;
  height: auto;
  margin: 0;
  min-width: 0;
  background-size: cover;
  background-position: center;
  background-color: #eee;
  cursor: pointer;
  transition: filter 0.2s ease;
}
.lus-pp-gallery .lus-pp-tile {
  /* beats the theme's `.image_gallery { width: 33.3% !important; border-right }` */
  width: auto !important;
  float: none !important;
  border: 0 !important;
}
.lus-pp-tile:hover {
  filter: brightness(0.9);
}
.lus-pp-tile-1 {
  grid-column: 1 / 3;
  grid-row: 1 / 3;
}
/* fewer photos: let the layout fill the space instead of leaving holes */
.lus-pp-count-1 .lus-pp-tile-1 {
  grid-column: 1 / 5;
}
.lus-pp-count-2 .lus-pp-tile-1 {
  grid-column: 1 / 3;
}
.lus-pp-count-2 .lus-pp-tile-2 {
  grid-column: 3 / 5;
  grid-row: 1 / 3;
}
.lus-pp-count-3 .lus-pp-tile-2,
.lus-pp-count-3 .lus-pp-tile-3 {
  grid-column: 3 / 5;
  grid-row: auto;
}
.lus-pp-count-4 .lus-pp-tile-4 {
  grid-column: 3 / 5;
}
.lus-pp-gallery .property_status_wrapper {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 3;
}
.lus-pp-allphotos {
  position: absolute;
  right: 16px;
  bottom: 16px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid #222;
  border-radius: 8px;
  background: #fff;
  color: #222;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.lus-pp-allphotos:hover {
  background: var(--lus-soft);
}
.lus-pp-allphotos .lus-pp-ico {
  width: 16px;
  height: 16px;
}

/* ---- Body layout ---- */
.lus-pp-body {
  margin: 8px 0 0;
  /* equal-height columns: the side column must be as tall as the main one, or the
     sticky booking card has no room to travel */
  display: flex;
  flex-wrap: wrap;
}
.lus-pp-body::before,
.lus-pp-body::after {
  display: none; /* Bootstrap's row clearfix would become flex items */
}
.lus-pp-main {
  padding-right: 50px;
}
.lus-pp-section {
  display: flow-root; /* contain the theme's floated columns (price table, facts) */
  position: relative;
  padding: 32px 0;
  border-bottom: 1px solid var(--lus-line);
}
.lus-pp-section:last-child {
  border-bottom: 0;
}
.lus-pp-section h2,
.lus-pp .lus-pp-section h3.panel-title {
  margin: 0 0 18px;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--lus-ink);
}
.lus-pp .panel-wrapper {
  margin: 0;
  padding: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
}

/* Overview */
.lus-pp-overview {
  padding-right: 80px;
}
.lus-pp-overview h2 {
  margin-bottom: 6px;
}
.lus-pp-overview-line {
  margin: 0;
  font-size: 16px;
  color: var(--lus-mute);
}
.lus-pp-host-pic {
  position: absolute;
  top: 32px;
  right: 0;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  background-color: #eee;
}

/* Highlights */
.lus-pp-highlights {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.lus-pp-highlight {
  display: flex;
  gap: 18px;
  align-items: flex-start;
}
.lus-pp-highlight .lus-pp-ico {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  margin-top: 2px;
}
.lus-pp-highlight strong {
  display: block;
  font-size: 16px;
  font-weight: 600;
}
.lus-pp-highlight span {
  display: block;
  font-size: 14px;
  color: var(--lus-mute);
}

/* Description */
.lus-pp-clamp {
  font-size: 16px;
  line-height: 1.6;
  overflow: hidden;
}
.lus-pp-clamp.is-clamped {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
}
.lus-pp-clamp p {
  margin: 0 0 12px;
}
/* display:inline-block on the link would otherwise beat the hidden attribute, so "Show more" showed on short text too */
.lus-pp-link[hidden] {
  display: none;
}
.lus-pp-link {
  display: inline-block;
  margin-top: 10px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--lus-ink);
  font-size: 16px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.lus-pp-link:hover {
  color: #000;
}

/* Bedroom cards */
.lus-pp-cards {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.lus-pp-card {
  flex: 0 0 calc(50% - 8px);
  max-width: 240px;
  padding: 20px;
  border: 1px solid var(--lus-line);
  border-radius: var(--lus-radius);
}
.lus-pp-card .lus-pp-ico {
  display: block;
  width: 28px;
  height: 28px;
  margin-bottom: 14px;
}
.lus-pp-card strong {
  display: block;
  font-size: 16px;
  font-weight: 600;
}
.lus-pp-card span {
  display: block;
  margin-top: 2px;
  font-size: 14px;
  color: var(--lus-mute);
}

/* Amenities */
.lus-pp-amenity-grid,
.lus-pp-amenity-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 24px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}
.lus-pp-amenity-grid li,
.lus-pp-amenity-list li {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 10px 0;
  font-size: 16px;
}
.lus-pp-amenity-ico {
  flex: 0 0 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
}
.lus-pp-amenity-ico svg {
  width: 24px;
  height: 24px;
  max-width: 100%;
  max-height: 100%;
  fill: currentColor;
}
.lus-pp-amenity-ico .lus-pp-ico {
  fill: none;
}
.lus-pp-btn {
  display: inline-block;
  padding: 13px 23px;
  border: 1px solid #222;
  border-radius: 8px;
  background: #fff;
  color: #222;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
}
.lus-pp-btn:hover {
  background: var(--lus-soft);
  color: #222;
}

/* Amenity pop-up */
.lus-pp-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(0, 0, 0, 0.5);
}
.lus-pp-modal[hidden] {
  display: none;
}
.lus-pp-modal-box {
  position: relative;
  width: 100%;
  max-width: 640px;
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  padding: 32px;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}
.lus-pp-modal-box h2 {
  margin: 0 0 14px;
  font-size: 22px;
}
.lus-pp-modal-box .lus-pp-amenity-list {
  grid-template-columns: 1fr;
}
.lus-pp-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}
.lus-pp-modal-close:hover {
  background: var(--lus-soft);
}

/* Availability, reviews, map: the theme's own markup, restyled */
.lus-pp .property_page_container {
  padding: 0;
}
.lus-pp #on_the_map,
.lus-pp .lus-pp-map h3.panel-title {
  margin: 0 0 18px;
}
.lus-pp .lus-pp-map .panel-wrapper {
  overflow: visible;
}
.lus-pp #google_map_on_list {
  border-radius: var(--lus-radius);
  overflow: hidden;
}
/* Host: the Airbnb pairing, a profile card on the left, details and the contact button on the right */
.lus-pp-host-card {
  display: grid;
  grid-template-columns: minmax(280px, 360px) 1fr;
  gap: 24px 64px;
  align-items: start;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
.lus-pp-host-id {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
  padding: 32px 24px 28px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}
.lus-pp-host-avatar {
  width: 104px;
  height: 104px;
  margin-bottom: 8px;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  background-color: #ddd;
}
.lus-pp-host-id {
  min-width: 0;
}
.lus-pp-host-id strong {
  max-width: 100%;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.2;
  overflow-wrap: anywhere; /* names with no spaces (e.g. a company handle) wrap instead of overflowing */
}
.lus-pp-host-role {
  font-size: 14px;
  color: var(--lus-mute);
}
.lus-pp-verified {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--lus-ink);
}
.lus-pp-verified .lus-pp-ico {
  width: 14px;
  height: 14px;
}
.lus-pp-host-about h3 {
  margin: 4px 0 12px;
  font-size: 18px;
  font-weight: 600;
}
.lus-pp-host-about p {
  margin: 0 0 22px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--lus-ink);
}
.lus-pp-host-buttons {
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
}
.lus-pp .lus-pp-host-buttons .lus-pp-btn,
.lus-pp .lus-pp-host-buttons #contact_me_long.lus-pp-btn {
  display: inline-block;
  padding: 14px 26px;
  border: 0;
  border-radius: 12px;
  background: #222;
  color: #fff !important;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.15s ease, transform 0.1s ease;
}
.lus-pp .lus-pp-host-buttons .lus-pp-btn:hover,
.lus-pp .lus-pp-host-buttons #contact_me_long.lus-pp-btn:hover {
  background: #000;
  color: #fff !important;
}
.lus-pp .lus-pp-host-buttons .lus-pp-btn:active {
  transform: scale(0.98);
}
/* "See host profile": the quieter button beside "Contact host" */
.lus-pp .lus-pp-host-buttons .lus-pp-btn.lus-pp-btn--ghost {
  background: #fff;
  color: #222 !important;
  box-shadow: inset 0 0 0 1.5px #222;
}
.lus-pp .lus-pp-host-buttons .lus-pp-btn.lus-pp-btn--ghost:hover {
  background: #f3f0ec;
  color: #000 !important;
}
/* the host's name in the headline and the picture beside it lead to the profile */
.lus-pp-host-name-link {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}
a.lus-pp-host-pic {
  display: block;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
a.lus-pp-host-pic:hover {
  transform: scale(1.05);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

/* Things to know */
.lus-pp-know-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.lus-pp-know-col h3 {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 600;
}
.lus-pp-know-col ul {
  margin: 0 0 10px;
  padding: 0;
  list-style: none;
}
.lus-pp-know-col li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 6px 0;
  font-size: 15px;
}
.lus-pp-know-col li .lus-pp-ico {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin-top: 1px;
}
.lus-pp-know-col p {
  margin: 0 0 8px;
  font-size: 15px;
  line-height: 1.55;
  color: var(--lus-ink);
}

/* ---- Booking card (Airbnb-style) ----
   The card is .lus-pp-sticky; the theme's booking form keeps every id and class its
   scripts use and is only restyled. Desktop widths only (992px and up): below that the theme turns the
   form into its own full-screen booking sheet (opened by the bottom "Booking Request"
   bar), which stays exactly as the theme made it. */
@media only screen and (min-width: 992px) {
  .lus-pp-side {
    padding-left: 15px;
  }
  body.admin-bar .lus-pp-sticky {
    top: 212px; /* + the 32px admin bar */
  }
  .lus-pp-sticky {
    position: sticky;
    /* clears the site header (90px) and the tab bar under it (about 76px) */
    top: 180px;
    padding: 20px;
    border: 1px solid #dddddd;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
  }
  .lus-pp-price {
    margin: 0 0 14px;
  }
  .lus-pp-price .price_unit {
    position: static; /* the theme pins it to a card corner */
  }
  .lus-pp-price .listing_main_image_price {
    position: static;
    float: none;
    width: auto;
    margin: 0;
    padding: 0;
    text-align: left;
    color: var(--lus-ink);
  }
  /* Every rate line (night, weekend, mid-week, week, month) the same size and weight */
  .lus-pp-price .wprentals-price-line {
    display: block;
    margin: 0 0 2px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--lus-ink);
  }
  .lus-pp-price .wprentals-price-line .wprentals-price-unit {
    font-size: inherit;
    font-weight: 400;
    color: var(--lus-mute);
  }
  .lus-pp-price .wprentals-custom-pricing-link {
    display: inline-block !important;
    margin-top: 6px !important;
    color: var(--lus-ink) !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: underline !important;
    text-underline-offset: 3px;
  }
  .lus-pp-price .price_unit,
  .lus-pp-price .price_unit span {
    font-size: 15px;
    font-weight: 400;
    color: var(--lus-mute);
  }
  .lus-pp-price .price_unit > span:first-child {
    font-size: 24px;
    font-weight: 600;
    color: var(--lus-ink);
  }
  .lus-pp-price .pernight {
    margin-left: 4px;
  }

  .lus-pp-sticky #booking_form_request {
    float: none;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  .lus-pp-sticky #booking_form_request > h3 {
    display: none; /* the price line above is the card's heading */
  }
  /* !important: the theme's scripts (fade / slide effects) can leave an inline display:block on
     this form, which would stack check-in over check-out. */
  .lus-pp-sticky #booking_form_request {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
  }
  .lus-pp-sticky #booking_form_request > * {
    grid-column: 1 / -1;
  }

}

/* ---- The booking / contact form, shared by the laptop card and the phone sheet ----
   (the rules above this line style the card itself; these style the fields, so the sheet that
   opens from the "Booking Request" bar on a phone looks like the card.) ---- */
/* The theme's calendar / guest icons are ::after pseudo-elements */
.lus-pp #booking_form_request .has_calendar::after,
.lus-pp #booking_form_request .wpestate_guest_no_control_wraper::after {
  display: none;
}
.lus-pp #booking_form_request .space_extra_opt {
  margin: 0;
}

/* Dates and guests: one joined, rounded box with small labels */
.lus-pp #booking_form_request .has_calendar {
  position: relative;
  margin: 0;
  padding: 0;
  width: auto;
  float: none;
}
.lus-pp #booking_form_request > .lus-pp-date-start {
  grid-column: 1 !important;
}
.lus-pp #booking_form_request > .lus-pp-date-end {
  grid-column: 2 !important;
}
.lus-pp #booking_form_request .has_calendar::before {
  position: absolute;
  top: 10px;
  left: 14px;
  z-index: 4; /* above the focused box (z-index 3) */
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--lus-ink);
  pointer-events: none;
}
.lus-pp #booking_form_request .lus-pp-date-start::before {
  content: "Check-in";
}
.lus-pp #booking_form_request .lus-pp-date-end::before {
  content: "Check-out";
}
.lus-pp #booking_form_request .lus-pp-guests::before {
  content: "Guests";
}
.lus-pp #booking_form_request .has_calendar .form-control,
.lus-pp #booking_form_request .wpestate_guest_no_control_info {
  height: 56px;
  margin: 0;
  padding: 26px 14px 8px;
  border: 1px solid #b0b0b0;
  border-radius: 0;
  background-image: none;
  box-shadow: none;
  color: var(--lus-ink);
  font-size: 14px;
  line-height: 1.2;
}
.lus-pp #booking_form_request .has_calendar .form-control::placeholder {
  color: var(--lus-mute);
}
.lus-pp #booking_form_request .lus-pp-date-start .form-control {
  border-radius: 12px 0 0 0;
}
.lus-pp #booking_form_request .lus-pp-date-end .form-control {
  margin-left: -1px;
  width: calc(100% + 1px);
  border-radius: 0 12px 0 0;
}
.lus-pp #booking_form_request .lus-pp-guests .wpestate_guest_no_control_info {
  margin-top: -1px;
  border-radius: 0 0 12px 12px;
}
.lus-pp #booking_form_request .has_calendar .form-control:focus {
  position: relative;
  z-index: 3;
  border-color: #222;
  box-shadow: inset 0 0 0 1px #222;
}

/* Paid add-ons (car rental, crib, pick-up...) are not offered in the card. The rows stay
   in the page so the booking scripts keep working; none can be ticked, so none is added. */
.lus-pp #booking_form_request .wpestate_show_extra_options_booking {
  display: none !important;
}

/* Add-ons: a clean checklist instead of a bordered table */
.lus-pp #booking_form_request .cost_row_extra {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  padding: 14px 0;
  border: 0;
  border-top: 1px solid var(--lus-line);
  background: transparent;
  float: none;
  width: 100%;
}
.lus-pp #booking_form_request .cost_row_extra:first-of-type {
  margin-top: 18px;
}
.lus-pp #booking_form_request .cost_row_extra .cost_explanation,
.lus-pp #booking_form_request .cost_row_extra .cost_value {
  float: none;
  width: auto;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 14px;
  line-height: 1.35;
  color: var(--lus-ink);
}
.lus-pp #booking_form_request .cost_row_extra .cost_explanation {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 500;
}
.lus-pp #booking_form_request .cost_row_extra .cost_value {
  text-align: right;
  color: var(--lus-mute);
}
.lus-pp #booking_form_request .cost_row_extra .cost_value_show {
  font-weight: 600;
  color: var(--lus-ink);
}
.lus-pp #booking_form_request .cost_row_extra input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  border: 1px solid #b0b0b0;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
.lus-pp #booking_form_request .cost_row_extra input[type="checkbox"]:checked {
  border-color: #222;
  background: #222 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 14px no-repeat;
}
.lus-pp #booking_form_request .cost_row_extra input[type="checkbox"]::before,
.lus-pp #booking_form_request .cost_row_extra input[type="checkbox"]::after {
  display: none; /* the theme's own tick */
}
.lus-pp #booking_form_request .cost_row_extra input[type="checkbox"]:focus-visible {
  outline: 2px solid #222;
  outline-offset: 2px;
}

/* Price breakdown that appears once dates are chosen */
.lus-pp #booking_form_request #add_costs_here {
  margin: 0;
  padding: 0;
}
.lus-pp #booking_form_request .cost_row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  padding: 8px 0;
  border: 0;
  background: transparent;
  float: none;
  width: 100%;
  font-size: 15px;
  color: var(--lus-ink);
}
.lus-pp #booking_form_request .cost_row .cost_explanation,
.lus-pp #booking_form_request .cost_row .cost_value {
  float: none;
  width: auto;
  padding: 0;
  border: 0;
  background: transparent;
}
.lus-pp #booking_form_request .cost_row.cost_row_extra {
  padding: 14px 0;
}
.lus-pp #booking_form_request .show_cost_form {
  margin: 8px 0 0;
  padding: 12px 0 0;
  border-top: 1px solid var(--lus-line);
}
.lus-pp #booking_form_request .show_cost_form .cost_row {
  text-transform: none;
}
.lus-pp #booking_form_request .show_cost_form .cost_row:last-child {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--lus-line);
  font-weight: 600;
}
.lus-pp #booking_form_request .wpestate_guest_no_control_info {
  text-transform: none;
}

/* Reserve button */
.lus-pp #booking_form_request .submit_booking_front_wrapper {
  margin: 14px 0 0;
  padding: 0;
}
.lus-pp #booking_form_request #submit_booking_front {
  display: block;
  width: 100%;
  height: 48px;
  margin: 0;
  padding: 0 16px;
  border: 0;
  border-radius: 12px;
  background: #e52737;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  transition: background-color 0.15s ease, transform 0.1s ease;
}
.lus-pp #booking_form_request #submit_booking_front:hover {
  background: #cf1f2f;
}
.lus-pp #booking_form_request #submit_booking_front:active {
  transform: scale(0.98);
}

/* Secondary actions */
.lus-pp #booking_form_request .third-form-wrapper {
  display: block;
  margin: 12px 0 0;
  padding: 0;
  border: 0;
}
.lus-pp #booking_form_request .third-form-wrapper .reservation_buttons {
  float: none;
  width: 100%;
  margin: 0;
  padding: 0;
}
/* Save lives in the page header now; the theme's favourites button stays in the DOM
   because the header's Save button triggers it. */
.lus-pp #booking_form_request .third-form-wrapper .reservation_buttons:has(#add_favorites) {
  display: none;
}
.lus-pp #booking_form_request #contact_host {
  display: block;
  float: none;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 13px 16px;
  border: 1px solid #222;
  border-radius: 12px;
  background: #fff;
  color: #222;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}
.lus-pp #booking_form_request #contact_host:hover {
  background: var(--lus-soft);
}
.lus-pp #booking_form_request .prop_social {
  display: none; /* the page header already has Share; keeps the card short enough to fit */
}
.lus-pp #booking_form_request .prop_social_share {
  color: var(--lus-mute);
  font-size: 13px;
}

/* ---- The contact ("Booking Request") form: name, email, dates, guests, message ---- */
.lus-pp #booking_form_request #contact_for_reservation {
  display: none; /* the price line is the card's heading */
}
.lus-pp #booking_form_request #booking_form_request_mess_modal {
  margin: 0 0 8px;
  font-size: 14px;
}
.lus-pp #booking_form_request #contact_u_name,
.lus-pp #booking_form_request #contact_u_email,
.lus-pp #booking_form_request #booking_phone_no,
.lus-pp #booking_form_request #booking_guest_no,
.lus-pp #booking_form_request #booking_mes_mess {
  display: block;
  width: 100%;
  margin: 0 0 10px;
  border: 1px solid #b0b0b0;
  border-radius: 12px;
  background: #fff;
  box-shadow: none;
  color: var(--lus-ink);
  font-size: 14px;
}
.lus-pp #booking_form_request #contact_u_name,
.lus-pp #booking_form_request #contact_u_email,
.lus-pp #booking_form_request #booking_phone_no,
.lus-pp #booking_form_request #booking_guest_no {
  height: 46px;
  padding: 0 14px;
}
.lus-pp #booking_form_request #booking_mes_mess {
  min-height: 72px;
  height: 72px;
  padding: 12px 14px;
  line-height: 1.4;
  resize: vertical;
}
.lus-pp #booking_form_request #contact_u_name:focus,
.lus-pp #booking_form_request #contact_u_email:focus,
.lus-pp #booking_form_request #booking_phone_no:focus,
.lus-pp #booking_form_request #booking_guest_no:focus,
.lus-pp #booking_form_request #booking_mes_mess:focus {
  border-color: #222;
  box-shadow: inset 0 0 0 1px #222;
  outline: 0;
}
/* the joined dates + guests box needs air below it before the message field */
.lus-pp #booking_form_request .lus-pp-guests {
  margin-bottom: 10px;
}
.lus-pp #booking_form_request #submit_mess_front {
  display: block;
  width: 100%;
  height: 48px;
  margin: 0;
  padding: 0 16px;
  border: 0;
  border-radius: 12px;
  background: #e52737;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  transition: background-color 0.15s ease, transform 0.1s ease;
}
.lus-pp #booking_form_request #submit_mess_front:hover {
  background: #cf1f2f;
}
.lus-pp #booking_form_request #submit_mess_front:active {
  transform: scale(0.98);
}
/* Save lives in the page header; the theme's favourites button stays in the DOM for it */
.lus-pp #booking_form_request .favorite_in_contact {
  display: none;
}
.lus-pp #booking_form_request .prop_social {
  margin-top: 16px;
}


/* ---- Below laptop width the form is the page section "Booking Request" (under the host) ---- */
.lus-pp-request {
  display: none;
}
@media only screen and (max-width: 991px) {
  .lus-pp-request {
    /* flow-root, not block: the theme floats the moved booking form (col-md-4), and a plain block lets that float spill out
       over the sections below (the host's listings were squeezed to 0 width beside it) */
    display: flow-root;
  }
  /* the theme turns the form into a hidden, fixed overlay here: make it an ordinary block */
  .lus-pp-request #booking_form_request {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    position: static !important;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: visible;
    box-shadow: none;
    background: transparent;
  }
  .lus-pp-request #booking_form_request > * {
    grid-column: 1 / -1;
  }
  .lus-pp-request #booking_form_request > .lus-pp-date-start {
    grid-column: 1 !important;
  }
  .lus-pp-request #booking_form_request > .lus-pp-date-end {
    grid-column: 2 !important;
  }
  .lus-pp-request #booking_form_request > #booking_form_mobile_close,
  .lus-pp-request #booking_form_request > #contact_for_reservation {
    display: none;
  }
}

/* Below desktop width the card frame, price line and an empty frame (real phones put the
   form in the page body instead) must not show. */
@media only screen and (max-width: 991px) {
  .lus-pp-price {
    display: none;
  }
  .lus-pp-sticky:not(:has(#booking_form_request)) {
    display: none;
  }
}

/* ---- Facts blocks the theme prints (price details, address, property details) ---- */
.lus-pp-section .panel-wrapper > a.panel-title,
.lus-pp-section .panel-wrapper > .panel-title {
  display: none; /* the section has its own heading */
}
.lus-pp-section .panel-wrapper,
.lus-pp-section .panel-collapse,
.lus-pp-section .panel-body {
  float: none;
  width: 100%;
}
.lus-pp-section .panel-collapse {
  display: block;
  height: auto;
}
.lus-pp-section .panel-body,
.lus-pp-section .panel-body-border {
  padding: 0;
  border: 0;
  background: transparent;
}
.lus-pp-facts .panel-body,
.lus-pp-pricing .panel-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 40px;
}
.lus-pp-facts .panel-body::before,
.lus-pp-facts .panel-body::after,
.lus-pp-pricing .panel-body::before,
.lus-pp-pricing .panel-body::after {
  display: none; /* Bootstrap's clearfix would become an empty grid cell */
}
.lus-pp-section .listing_detail {
  float: none;
  width: auto;
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid var(--lus-line);
  font-size: 15px;
  line-height: 1.5;
  color: var(--lus-ink);
}
.lus-pp-section .listing_detail .item_head {
  display: block;
  margin-bottom: 2px;
  font-size: 13px;
  font-weight: 500;
  color: var(--lus-mute);
}
.lus-pp-section .listing_detail.lus-pp-wide,
.lus-pp-pricing .wprentals-seasonal-pricing-wrap,
.lus-pp-pricing .listing_detail.col-md-12 {
  grid-column: 1 / -1;
}
.lus-pp-address {
  margin-top: 22px;
}
.lus-pp-location .lus-pp-address .listing_detail {
  border-bottom-color: var(--lus-line);
}
.lus-pp-location #on_the_map,
.lus-pp-location h3.panel-title {
  display: block;
  margin: 0 0 18px;
}

/* the theme floats its columns without a clearfix */
.lus-pp-pricing .wprentals-seasonal-pricing-wrap,
.lus-pp-pricing .wprentals-custom-pricing-wrapper {
  display: flow-root;
}
.lus-pp-pricing .col-md-12,
.lus-pp-pricing .wprentals-custom-pricing-wrapper {
  float: none;
  width: 100%;
}
.lus-pp-pricing .panel-body {
  display: block;
}
.lus-pp-pricing .panel-body > .listing_detail {
  display: block;
}

/* seasonal rates table (the theme's markup): one bordered, rounded card in the page's own
   type; the notes under it line up with the page text instead of the theme's grid padding */
.lus-pp-pricing .wprentals-seasonal-pricing-wrap {
  display: flow-root;
}
.lus-pp-pricing .wprentals-custom-pricing-wrapper,
.lus-pp-pricing .wprentals-price-notes {
  float: none;
  width: auto;
  padding: 0;
  margin-left: 0;
  margin-right: 0;
}
.lus-pp-pricing .wprentals-custom-pricing-wrapper {
  margin-top: 4px !important;
}
@media (min-width: 1024px) {
  .lus-pp-pricing .wprentals-sp-display-table {
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--lus-line);
    border-radius: 14px;
    overflow: hidden;
    margin: 0;
    table-layout: fixed;
  }
  .lus-pp-pricing .wprentals-sp-display-table th,
  .lus-pp-pricing .wprentals-sp-display-table td {
    border: 0;
    border-top: 1px solid var(--lus-line);
    border-left: 1px solid var(--lus-line);
    padding: 14px 10px;
    font-size: 15px;
    line-height: 1.35;
    vertical-align: top;
    text-align: center;
  }
  .lus-pp-pricing .wprentals-sp-display-table tr > :first-child {
    border-left: 0;
    text-align: left;
    padding-left: 18px;
  }
  .lus-pp-pricing .wprentals-sp-display-table thead th {
    border-top: 0;
    background: var(--lus-soft);
    font-size: 13px;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--lus-mute);
    font-weight: 600;
    padding: 12px 10px;
  }
  .lus-pp-pricing .wprentals-sp-display-table th:first-child { width: 32%; }
  .lus-pp-pricing .wprentals-sp-display-table th { width: 17%; }
  .lus-pp-pricing .wprentals-sp-display-table td.sp-label-col {
    font-size: 16px;
    font-weight: 600;
  }
  .lus-pp-pricing .wprentals-sp-display-table td:not(.sp-label-col) {
    font-weight: 600;
  }
  .lus-pp-pricing .wprentals-sp-display-table td.sp-empty {
    color: var(--lus-mute);
    font-weight: 400;
  }
  .lus-pp-pricing .wprentals-sp-season-dates {
    font-size: 13px;
    font-weight: 400;
    color: var(--lus-mute);
    margin-top: 3px;
  }
  .lus-pp-pricing .wprentals-sp-season-desc {
    font-size: 13px;
    font-weight: 400;
    color: var(--lus-mute);
    margin-top: 8px;
    line-height: 1.5;
  }
  .lus-pp-pricing .wprentals-sp-meta {
    background: var(--lus-soft);
    color: var(--lus-ink);
    border-radius: 999px;
    padding: 3px 9px;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 500;
  }
}
/* phones use the theme's own season cards; just keep them off the page edge */
@media (max-width: 1023px) {
  .lus-pp-pricing .wprentals-sp-display-table { margin-top: 4px; }
}
.lus-pp-pricing .wprentals-price-notes {
  margin-top: 22px !important;
}
.lus-pp-pricing .wprentals-price-note {
  margin-bottom: 16px !important;
}
.lus-pp-pricing .wprentals-price-note strong {
  font-size: 15px;
  font-weight: 600 !important;
  color: var(--lus-ink) !important;
}
.lus-pp-pricing .wprentals-price-note p {
  margin: 4px 0 0 !important;
  font-size: 15px;
  line-height: 1.55;
  color: var(--lus-mute);
}

/* amenities pop-up groups */
.lus-pp-amenity-group {
  margin: 26px 0 4px;
  font-size: 16px;
  font-weight: 600;
}
.lus-pp-amenity-group:first-of-type {
  margin-top: 8px;
}
.lus-pp-amenity-list {
  margin-bottom: 4px;
}

/* rules: allowed vs not allowed */
.lus-pp-know-col li .lus-pp-ico--custom { display: grid; place-items: center; font-style: normal; }
.lus-pp-know-col li .lus-pp-ico--custom svg, .lus-pp-know-col li .lus-pp-ico--custom img { width: 20px; height: 20px; max-width: 100%; fill: currentColor; object-fit: contain; }
.lus-pp-know-col li.is-banned .lus-pp-ico {
  color: var(--lus-mute);
}

/* more listings from this host: drawn as Stays cards, styled by css/lus-similar.css */
.lus-pp-host-more .lus-similar.lus-stays { max-width: none; }

/* "Check availability" jump link in the overview */
.lus-pp-jump {
  display: inline-block;
  margin-top: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--lus-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---- Tablet / phone ---- */
@media only screen and (max-width: 991px) {
  /* .lus-pp-body is a flex row: without a width the columns shrink to their content, so a grid of cards inside would squeeze the column */
  .lus-pp-main,
  .lus-pp-side {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    /* the theme gives the sidebar min-height: 500px; stacked, the booking form has moved into the page, so it would be an empty gap above "Similar listings" */
    min-height: 0;
  }
  .lus-pp-main {
    padding-right: 15px;
  }
  .lus-pp-gallery {
    height: 320px;
  }
  .lus-pp-know-grid {
    grid-template-columns: 1fr;
  }
  .lus-pp-host-card {
    /* minmax(0, 1fr), not 1fr: a long one-word host name must not stretch the column past the screen */
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
  }
  /* stacked: the profile card spans the width and the details sit centred under it */
  .lus-pp-host-about {
    text-align: center;
  }
  .lus-pp-host-buttons {
    justify-content: center;
  }
}

@media only screen and (max-width: 480px) {
  .lus-pp-host-id {
    padding: 28px 16px 24px;
  }
  .lus-pp-host-id strong {
    font-size: 22px;
  }
  /* two buttons side by side only if they fit; otherwise stacked at full width */
  .lus-pp .lus-pp-host-buttons {
    gap: 12px;
  }
  .lus-pp .lus-pp-host-buttons .lus-pp-btn,
  .lus-pp .lus-pp-host-buttons #contact_me_long.lus-pp-btn {
    flex: 1 1 140px;
    min-width: 0;
    padding: 14px 16px;
    text-align: center;
  }
}

@media only screen and (max-width: 767px) {
  .lus-pp-head {
    padding-top: 18px;
  }
  .lus-pp-head h1.entry-title,
  .lus-pp-head-row {
    width: 100%;
  }
  .lus-pp-head h1.entry-title {
    font-size: 24px;
  }
  /* phone: one wide photo with a "show all" button, like the app */
  .lus-pp-gallery {
    display: block;
    height: 260px;
    margin: 0;
    border-radius: 0;
  }
  .lus-pp-gallery .lus-pp-tile {
    display: none;
  }
  .lus-pp-gallery .lus-pp-tile-1 {
    display: block;
    width: 100%;
    height: 100%;
  }
  .lus-pp-overview {
    padding-right: 72px;
  }
  .lus-pp-amenity-grid {
    grid-template-columns: 1fr;
  }
  .lus-pp-cards .lus-pp-card {
    flex: 1 1 calc(50% - 8px);
  }
}

/* Host: the theme styles #contact_me_long white-on-colour for its own card */
.lus-pp #contact_me_long.lus-pp-btn {
  width: auto;
  height: auto;
  padding: 13px 23px;
  border: 1px solid #222;
  background: #fff;
  color: #222 !important;
  line-height: 1.2;
  float: none;
}
.lus-pp #contact_me_long.lus-pp-btn:hover {
  background: var(--lus-soft);
}
.lus-pp-host-about p {
  color: var(--lus-ink);
}

/* Theme section titles inside our sections: same size as ours */
.lus-pp .lus-pp-section .panel-title,
.lus-pp .lus-pp-section h3.panel-title {
  display: block;
  margin: 0 0 18px;
  padding: 0;
  font-size: 22px !important;
  font-weight: 600;
  line-height: 1.25;
  color: var(--lus-ink);
}

/* ---- Tab bar that fades in under the header (templates/property_menu_hidden.php) ---- */
.property_menu_wrapper_hidden {
  background: #fff;
  border-bottom: 1px solid var(--lus-line, #e6e6e6);
  box-shadow: none;
}
.property_menu_wrapper_hidden .property_menu_item {
  padding: 16px 4px;
  margin: 0 14px;
  border-bottom: 2px solid transparent;
  color: #222;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
.property_menu_wrapper_hidden .property_menu_item:hover {
  border-bottom-color: #222;
  color: #222;
}
html {
  scroll-padding-top: 150px;
}


/* ---- Fixed header and tab bar: the theme fades them to 95% on scroll, which let the page text
   show through them. Solid on this page. ---- */
body.single-estate_property .header_wrapper,
body.single-estate_property .property_menu_wrapper_hidden {
  opacity: 1 !important;
}

/* ---- Map section: the theme wraps the map in white boxes that show as a patch behind the heading ---- */
#lus-pp-location .property_page_container,
#lus-pp-location div:has(.leaflet-container):not(.leaflet-container) {
  background: transparent;
}

/* ---- Map pop-up on phones: its "verified" chip sat on top of the price badge ---- */
@media only screen and (max-width: 480px) {
  .leaflet-popup-content .property_status_wrapper_infobox {
    display: none;
  }
}

/* The theme pads the page by the fixed mobile header's height up to 1199px wide, but the header
   is already clear of the page, which left a big empty band above the title. */
@media only screen and (max-width: 1199px) {
  .row.content-fixed-listing.listing_type_5.lus-pp {
    padding-top: 0;
  }
}

/* Map pop-up card: the Stays card (css/lus-stays.css, ".lus-popcard"). Its tokens and base rules are scoped to the Stays page, so they are repeated here for this map. */
.lus-pp .lus-popcard {
  --lus-ink: #1c1917; --lus-muted: #78716c; --lus-line: #e7e0d8; --lus-tint: #f4efe9; --lus-radius: 20px;
  --lus-dur: 200ms; --lus-ease: cubic-bezier(.2, .7, .2, 1);
}
.lus-pp .lus-popcard,
.lus-pp .lus-popcard *,
.lus-pp .lus-popcard *::before,
.lus-pp .lus-popcard *::after {
  box-sizing: border-box;
}
.lus-pp .lus-popcard p,
.lus-pp .lus-popcard h3 {
  margin: 0;
}
.lus-pp .lus-popcard h3 {
  color: var(--lus-ink);
}
.lus-pp .lus-popcard .lus-stay__title {
  font-family: inherit; font-weight: 600; font-size: 16px; line-height: 1.25; margin-top: 2px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.lus-pp .leaflet-popup-content {
  margin: 0 !important;
}
/* Room for the pop-up card (about 350px) above the pin; the theme's map is 400px. */
.lus-pp #google_map_on_list {
  height: 500px;
}
/* The theme's box around the map section (a faint purple glow and rounded corners) shows as a white panel behind the heading. */
.lus-pp #lus-pp-location .property_page_container {
  box-shadow: none;
  background: transparent;
  border-radius: 0;
}
.lus-pp-know-col li.is-allowed .lus-pp-ico { color: #1f7a45; }

/* Header rating: one line, "★ 5.0 · 1 review", jumps to the reviews */
.lus-pp-head-info a.lus-pp-rating {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  text-decoration: none;
}
.lus-pp-rating .fa-star { color: #f5b942; font-size: 13px; }
.lus-pp-rating strong { font-weight: 600; }
.lus-pp-rating span { color: var(--lus-mute); text-decoration: underline; text-underline-offset: 2px; }

/* Reviews: score + category bars, then the review cards */
.lus-pp-rev-count { color: var(--lus-mute); font-weight: 500; }
.lus-pp-rev-summary {
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  gap: 24px 56px;
  align-items: center;
  margin-bottom: 28px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--lus-line);
}
.lus-pp-rev-score { display: flex; flex-direction: column; gap: 6px; }
.lus-pp-rev-score strong { font-size: 56px; line-height: 1; font-weight: 700; letter-spacing: -0.02em; }
.lus-pp-rev-of { font-size: 14px; color: var(--lus-mute); }
.lus-pp-rev-stars { display: inline-flex; gap: 2px; font-size: 14px; }
.lus-pp-rev-stars .fa-star, .lus-pp-rev-stars .fa-star-half-alt { color: #f5b942; }
.lus-pp-rev-stars .far.fa-star { color: #d9d9d9; }
.lus-pp-rev-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 32px; margin: 0; }
.lus-pp-rev-fields > div { display: grid; grid-template-columns: 128px 1fr; align-items: center; gap: 12px; }
.lus-pp-rev-fields dt { margin: 0; font-size: 15px; font-weight: 400; color: var(--lus-ink); }
.lus-pp-rev-fields dd { display: flex; align-items: center; gap: 10px; margin: 0; }
.lus-pp-rev-fields b { min-width: 24px; font-size: 14px; font-weight: 600; text-align: right; }
.lus-pp-rev-bar { flex: 1; height: 5px; border-radius: 3px; background: #e9e9e9; overflow: hidden; }
.lus-pp-rev-bar i { display: block; height: 100%; border-radius: 3px; background: var(--lus-ink); }

.lus-pp-rev-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 56px; }
.lus-pp-rev header { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.lus-pp-rev-pic { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; background: #ddd center / cover no-repeat; }
.lus-pp-rev header strong { display: block; font-size: 16px; font-weight: 600; }
.lus-pp-rev-date { font-size: 14px; color: var(--lus-mute); }
.lus-pp-rev-rate { margin-bottom: 8px; }
.lus-pp-rev-rate .lus-pp-rev-stars { font-size: 12px; }
.lus-pp-rev-text { margin: 0; font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
.lus-pp-rev-reply { margin-top: 12px; padding: 12px 14px; border-radius: 12px; background: var(--lus-soft); font-size: 14px; }
.lus-pp-rev-reply strong { display: block; margin-bottom: 2px; font-size: 13px; }
.lus-pp-rev-reply p { margin: 0; line-height: 1.55; }
.lus-pp-reviews .pagination, .lus-pp-reviews ul.pagination { margin-top: 24px; }

@media (max-width: 900px) {
  .lus-pp-rev-summary { grid-template-columns: 1fr; gap: 20px; }
  .lus-pp-rev-list { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 560px) {
  .lus-pp-rev-fields { grid-template-columns: 1fr; }
  .lus-pp-rev-score strong { font-size: 44px; }
}
