
/* Landing-page integration only. Booking/payment logic remains canonical v5.8.36. */

/* No duplicated page hero or generic section titles: cards should arrive quickly. */
.bs-hero,
.bs-view-summary,
.bs-filter-note,
.bs-professionals-block > .bs-browse-head,
.bs-programmes-block > .bs-browse-head,
#bsSectionNavigator{
  display:none!important;
}

/* Keep the block compact and let the actual landing page own the surrounding background/header/footer. */
#bsSchedulingPage.bs-page{
  width:min(1280px,calc(100% - 24px))!important;
  margin:0 auto!important;
  padding:10px 0 18px!important;
  background:transparent!important;
}
#bsSchedulingPage.bs-page::before,
#bsSchedulingPage.bs-page::after{display:none!important}

/* Canonical three-card selector, centred. */
#bsSchedulingPage .bs-view-switch{
  width:min(100%,820px)!important;
  margin:8px auto 20px!important;
}

/* Use the available horizontal width for discovery filters. */
html[data-kinara-scheduling-mode="appointments"] #bsSchedulingPage .bs-filter-panel{
  width:100%!important;
  max-width:1180px!important;
  grid-template-columns:minmax(260px,1.7fr) repeat(4,minmax(135px,1fr))!important;
  align-items:end!important;
  justify-content:center!important;
  gap:14px!important;
  margin:0 auto 20px!important;
  padding:18px 20px!important;
}
html[data-kinara-scheduling-mode="appointments"] #bsSchedulingPage .bs-filter-panel .bs-search-field.full{
  grid-column:auto!important;
}
html[data-kinara-scheduling-mode="group"] #bsSchedulingPage .bs-filter-panel{
  width:100%!important;
  max-width:1180px!important;
  grid-template-columns:minmax(260px,1.7fr) repeat(3,minmax(145px,1fr))!important;
  align-items:end!important;
  justify-content:center!important;
  gap:14px!important;
  margin:0 auto 20px!important;
  padding:18px 20px!important;
}
html[data-kinara-scheduling-mode="group"] #bsSchedulingPage .bs-filter-panel .bs-search-field.full{
  grid-column:auto!important;
}
html[data-kinara-scheduling-mode="programmes"] #bsSchedulingPage .bs-filter-panel{
  width:100%!important;
  max-width:780px!important;
  grid-template-columns:1fr!important;
  margin:0 auto 20px!important;
  padding:18px 20px!important;
}
html[data-kinara-scheduling-mode="programmes"] #bsSchedulingPage .bs-filter-panel .bs-search-field.full{
  grid-column:1/-1!important;
}
#bsSchedulingPage .bs-filter-panel > label{min-width:0!important}
#bsSchedulingPage .bs-filter-panel select,
#bsSchedulingPage .bs-search-shell input{width:100%!important}
#bsSchedulingPage .bs-offer-filter{grid-column:1/-1!important}

/* Bring cards closer to the filters and centre the result set according to card count. */
#bsSchedulingPage .bs-browse-block{margin-top:18px!important}
#bsSchedulingPage .bs-speciality-group{width:100%!important}
#bsSchedulingPage .bs-professional-grid#bsProfessionalGrid{
  display:block!important;
  width:100%!important;
  overflow:visible!important;
  padding:0!important;
}
#bsSchedulingPage .bs-professional-grid-static{
  display:flex!important;
  flex-flow:row wrap!important;
  justify-content:center!important;
  align-items:stretch!important;
  gap:18px!important;
  width:100%!important;
  overflow:visible!important;
  padding:10px 0!important;
}
#bsSchedulingPage .bs-professional-grid-static > .bs-professional-card--rich{
  flex:0 1 340px!important;
  width:min(100%,340px)!important;
  max-width:340px!important;
  min-width:0!important;
}

/* One-on-One service/bundle cards centre as a set. Group/Programme retain their canonical wide-card layout. */
html[data-kinara-scheduling-mode="appointments"] #bsSchedulingPage .bs-offer-grid{
  display:flex!important;
  flex-flow:row wrap!important;
  justify-content:center!important;
  align-items:stretch!important;
  gap:18px!important;
  width:100%!important;
  max-width:1180px!important;
  margin:0 auto!important;
  overflow:visible!important;
  padding:0!important;
}
html[data-kinara-scheduling-mode="appointments"] #bsSchedulingPage .bs-offer-grid > .bs-provider-card{
  flex:0 1 360px!important;
  width:min(100%,360px)!important;
  max-width:360px!important;
  min-width:0!important;
}
html[data-kinara-scheduling-mode="group"] #bsSchedulingPage .bs-offer-grid,
html[data-kinara-scheduling-mode="programmes"] #bsSchedulingPage .bs-offer-grid{
  width:100%!important;
  max-width:1120px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Callback belongs after the service cards on a landing page. */
#bsSchedulingPage .bs-help-callback{
  width:min(100%,1120px)!important;
  margin:28px auto 0!important;
}

/* Loader stays inside this block instead of covering the full landing page. */
.kinara-v582-loader{
  position:relative!important;
  inset:auto!important;
  z-index:1!important;
  width:min(1180px,calc(100% - 24px))!important;
  min-height:116px!important;
  margin:0 auto!important;
  background:transparent!important;
  backdrop-filter:none!important;
}
.kinara-v582-loader-mark{width:64px!important;height:64px!important}
.kinara-v582-loader-fallback{width:48px!important;height:48px!important;font-size:1.3rem!important}

@media(max-width:900px){
  html[data-kinara-scheduling-mode] #bsSchedulingPage .bs-filter-panel{
    max-width:100%!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html[data-kinara-scheduling-mode] #bsSchedulingPage .bs-filter-panel .bs-search-field.full{
    grid-column:1/-1!important;
  }
}

@media(max-width:760px){
  #bsSchedulingPage.bs-page{width:min(100% - 18px,1280px)!important;padding-top:6px!important}
  #bsSchedulingPage .bs-view-switch{width:min(100%,560px)!important;margin:6px auto 16px!important}
  html[data-kinara-scheduling-mode] #bsSchedulingPage .bs-filter-panel{
    grid-template-columns:1fr!important;
    gap:12px!important;
    padding:16px!important;
  }
  html[data-kinara-scheduling-mode] #bsSchedulingPage .bs-filter-panel .bs-search-field.full{
    grid-column:1!important;
  }
  #bsSchedulingPage .bs-professional-grid-static,
  html[data-kinara-scheduling-mode="appointments"] #bsSchedulingPage .bs-offer-grid{
    flex-flow:row nowrap!important;
    justify-content:flex-start!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    gap:14px!important;
    scroll-snap-type:x mandatory;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    padding:8px 10px 14px!important;
  }
  #bsSchedulingPage .bs-professional-grid-static > .bs-professional-card--rich,
  html[data-kinara-scheduling-mode="appointments"] #bsSchedulingPage .bs-offer-grid > .bs-provider-card{
    flex:0 0 84vw!important;
    width:84vw!important;
    min-width:280px!important;
    max-width:340px!important;
    scroll-snap-align:center;
  }
  #bsSchedulingPage .bs-help-callback{margin-top:22px!important}
}
