
/* Hotelier Depot Enterprise Suite v6.7.1
   Room Listing Templates - frontend presentation only.
   Booking logic, details, checkout and payment flows are untouched. */

/* Shared template transition */
.hdbe-ng-room-grid[data-hdos-template],
.hdbe-results-grid[data-hdos-template]{
  width:100%;
}
.hdbe-ng-room-grid[data-hdos-template] .hdbe-ng-room-card,
.hdbe-results-grid[data-hdos-template] .hdbe-ng-room-card{
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.hdbe-ng-room-grid[data-hdos-template] .hdbe-ng-room-card:hover,
.hdbe-results-grid[data-hdos-template] .hdbe-ng-room-card:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 44px rgba(8,43,73,.11);
}

/* TEMPLATE A - Classic Cards */
.hdbe-ng-room-grid[data-hdos-template="classic"],
.hdbe-results-grid[data-hdos-template="classic"]{
  display:grid!important;
  grid-template-columns:repeat(var(--hdos-listing-columns,3),minmax(0,1fr))!important;
  gap:18px!important;
}
.hdbe-ng-room-grid[data-hdos-template="classic"][data-hdos-columns="1"],
.hdbe-results-grid[data-hdos-template="classic"][data-hdos-columns="1"]{--hdos-listing-columns:1}
.hdbe-ng-room-grid[data-hdos-template="classic"][data-hdos-columns="2"],
.hdbe-results-grid[data-hdos-template="classic"][data-hdos-columns="2"]{--hdos-listing-columns:2}
.hdbe-ng-room-grid[data-hdos-template="classic"][data-hdos-columns="3"],
.hdbe-results-grid[data-hdos-template="classic"][data-hdos-columns="3"]{--hdos-listing-columns:3}
.hdbe-ng-room-grid[data-hdos-template="classic"][data-hdos-columns="4"],
.hdbe-results-grid[data-hdos-template="classic"][data-hdos-columns="4"]{--hdos-listing-columns:4}

/* TEMPLATE B - Horizontal List */
.hdbe-ng-room-grid[data-hdos-template="horizontal"],
.hdbe-results-grid[data-hdos-template="horizontal"]{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:16px!important;
}
.hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-card,
.hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-card{
  display:grid!important;
  grid-template-columns:minmax(300px,38%) minmax(0,1fr)!important;
  min-height:270px!important;
}
.hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-media,
.hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-media{
  min-height:100%!important;
  height:100%!important;
}
.hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-content,
.hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-content{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:22px 24px!important;
}
.hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-title-row h3,
.hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-title-row h3{
  font-size:24px!important;
}
.hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-content>p,
.hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-content>p{
  max-width:820px;
  margin:8px 0 10px!important;
}
.hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-footer,
.hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-footer{
  margin-top:auto!important;
}
.hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-footer>div:first-child,
.hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-footer>div:first-child{
  min-width:120px;
}

/* TEMPLATE C - Masonry Grid */
.hdbe-ng-room-grid[data-hdos-template="masonry"],
.hdbe-results-grid[data-hdos-template="masonry"]{
  display:block!important;
  column-count:var(--hdos-masonry-columns,3)!important;
  column-gap:18px!important;
}
.hdbe-ng-room-grid[data-hdos-template="masonry"][data-hdos-columns="2"],
.hdbe-results-grid[data-hdos-template="masonry"][data-hdos-columns="2"]{--hdos-masonry-columns:2}
.hdbe-ng-room-grid[data-hdos-template="masonry"][data-hdos-columns="3"],
.hdbe-results-grid[data-hdos-template="masonry"][data-hdos-columns="3"]{--hdos-masonry-columns:3}
.hdbe-ng-room-grid[data-hdos-template="masonry"][data-hdos-columns="4"],
.hdbe-results-grid[data-hdos-template="masonry"][data-hdos-columns="4"]{--hdos-masonry-columns:4}
.hdbe-ng-room-grid[data-hdos-template="masonry"] .hdbe-ng-room-card,
.hdbe-results-grid[data-hdos-template="masonry"] .hdbe-ng-room-card{
  display:inline-block!important;
  width:100%!important;
  margin:0 0 18px!important;
  break-inside:avoid!important;
  -webkit-column-break-inside:avoid!important;
  vertical-align:top!important;
}
.hdbe-ng-room-grid[data-hdos-template="masonry"] .hdbe-ng-room-media,
.hdbe-results-grid[data-hdos-template="masonry"] .hdbe-ng-room-media{
  min-height:220px!important;
  height:var(--hdos-card-image-height,280px)!important;
}
.hdbe-ng-room-grid[data-hdos-template="masonry"] .hdbe-ng-room-content>p,
.hdbe-results-grid[data-hdos-template="masonry"] .hdbe-ng-room-content>p{
  min-height:0!important;
}
body.hdos-room-template-masonry .hdbe-ng-room-card{min-height:0!important}

/* Button/rate alignment works across all three templates */
.hdbe-ng-room-grid[data-hdos-template] .hdbe-ng-room-actions,
.hdbe-results-grid[data-hdos-template] .hdbe-ng-room-actions{
  flex-wrap:wrap;
}
.hdbe-ng-room-grid[data-hdos-template] .hdbe-ng-details-button,
.hdbe-results-grid[data-hdos-template] .hdbe-ng-details-button{
  justify-content:center;
}

/* Tablet */
@media(max-width:1100px){
  .hdbe-ng-room-grid[data-hdos-template="classic"],
  .hdbe-results-grid[data-hdos-template="classic"]{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .hdbe-ng-room-grid[data-hdos-template="masonry"],
  .hdbe-results-grid[data-hdos-template="masonry"]{
    column-count:2!important;
  }
  .hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-card,
  .hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-card{
    grid-template-columns:minmax(250px,40%) minmax(0,1fr)!important;
  }
}

/* Mobile: every template collapses safely to one room per row */
@media(max-width:720px){
  .hdbe-ng-room-grid[data-hdos-template="classic"],
  .hdbe-results-grid[data-hdos-template="classic"]{
    grid-template-columns:1fr!important;
  }
  .hdbe-ng-room-grid[data-hdos-template="masonry"],
  .hdbe-results-grid[data-hdos-template="masonry"]{
    column-count:1!important;
  }
  .hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-card,
  .hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-card{
    display:block!important;
  }
  .hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-media,
  .hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-media{
    min-height:240px!important;
    height:240px!important;
  }
  .hdbe-ng-room-grid[data-hdos-template="horizontal"] .hdbe-ng-room-content,
  .hdbe-results-grid[data-hdos-template="horizontal"] .hdbe-ng-room-content{
    padding:18px!important;
  }
}
