/* BeautyOnline24 mobile layout — loaded after the theme stylesheet. */
@media (max-width:900px) {
  /* The public shell is a vertical flex container. Without this, its
     .content-area is allowed to shrink to one viewport while the long
     listing overflows underneath Elementor's footer. Keep the complete
     listing in document flow before the shared footer. */
  body.single-hp_listing > .content-area {
    flex:0 0 auto !important;
    height:auto !important;
  }
  body.single-hp_listing > .bo-shared-footer {
    margin-top:0 !important;
  }

  /* The HivePress listing row is the page itself. Keep every sidebar block
     in normal flow so the footer begins only after the map and provider. */
  body.single-hp_listing .hp-listing--view-page::after {
    content:"";
    display:block;
    clear:both;
  }
  
  body.single-hp_listing .hp-listing--view-page {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
  }
  body.single-hp_listing .hp-listing--view-page > .hp-page__content,
  body.single-hp_listing .hp-listing--view-page > .hp-page__sidebar {
    float:none !important;
    flex:0 0 auto !important;
    width:100% !important;
    max-width:100% !important;
  }
  body.single-hp_listing .hp-page__sidebar[data-component="sticky"] {
    position:static !important;
    top:auto !important;
    transform:none !important;
  }
  /* HivePress creates this wrapper after load; it carries inline fixed styles. */
  body.single-hp_listing .hp-page__sidebar > .inner-wrapper-sticky {
    position:static !important;
    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;
    width:auto !important;
    height:auto !important;
    min-height:0 !important;
    transform:none !important;
  }
  body.single-hp_listing .hp-page__sidebar {
    clear:both !important;
    margin:24px 0 0 !important;
  }
  /* Mapbox uses an absolute canvas: give its parent physical height. */
  body.single-hp_listing .hp-listing__map {
    position:relative !important;
    display:block !important;
    height:300px !important;
    min-height:300px !important;
    margin:24px 0 !important;
    overflow:hidden !important;
    border-radius:16px !important;
  }
  body.single-hp_listing .hp-listing__map .mapboxgl-map,
  body.single-hp_listing .hp-listing__map .mapboxgl-canvas-container,
  body.single-hp_listing .hp-listing__map .mapboxgl-canvas {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
  }
}

/* Shared responsive foundation: every public workflow stays in normal document
   flow on a phone. This is deliberately outside Elementor's generated CSS. */
@media (max-width:900px) {
  html, body {
    width:100%;
    max-width:100%;
    overflow-x:clip;
  }
  body:not(.home) {
    display:block !important;
    min-height:0 !important;
  }
  body:not(.home) > .content-area,
  body:not(.home) > .bo-shared-footer {
    width:100%;
    min-width:0;
    height:auto !important;
    margin-top:0 !important;
  }
  .content-area, .hp-page, .hp-row, .hp-page__content, .hp-page__sidebar,
  .hp-form, .hp-table, .hp-calendar {
    min-width:0;
    max-width:100%;
  }
  .hp-table {
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  /* The account workspace has no useful two-column state on a phone. */
  body.hp-template--page-sidebar-left .hp-page > .hp-row {
    display:flex !important;
    flex-direction:column !important;
  }
  body.hp-template--page-sidebar-left .hp-page__sidebar,
  body.hp-template--page-sidebar-left .hp-page__content {
    float:none !important;
    width:100% !important;
    max-width:100% !important;
  }
}


/* Mobile landing UX: one discovery action, an explained location request,
   compact category choices and a map that remains a clear next step. */
@media (max-width:900px) {
  .bo-home__geo[hidden] { display:none !important; }
  .bo-home__geo { display:flex; max-width:590px; align-items:center; justify-content:space-between; gap:16px; margin:12px 0 0; padding:13px 15px; border:1px solid #e5d3cd; border-radius:14px; background:#fffaf7; box-shadow:0 12px 28px rgba(67,31,39,.08); }
  .bo-home__geo-copy { display:grid; gap:3px; min-width:0; color:#6e555c; font-size:12px; line-height:1.4; }
  .bo-home__geo-copy b { color:#2b1620; font-size:13px; }
  .bo-home__geo-actions[hidden] { display:none !important; }
  .bo-home__geo-actions { display:flex; flex:0 0 auto; align-items:center; gap:9px; }
  .bo-home__geo button { min-height:37px; border:0; border-radius:999px; padding:8px 13px; font:800 12px/1 Manrope,Arial,sans-serif; cursor:pointer; }
  .bo-home__geo-allow { background:#8c3b4a; color:#fff; }
  .bo-home__geo-allow:disabled { opacity:.68; cursor:wait; }
  .bo-home__geo-later { background:transparent; color:#795962; }
  .bo-home__map-badge { color:#2b1620; text-decoration:none; }
  .bo-home__map-badge b { display:inline-block; margin-left:5px; color:#8c3b4a; }
}

@media (max-width:600px) {
  .bo-home__hero { padding:27px 0 38px; }
  .bo-home__hero h1 { margin:15px 0 14px; font-size:38px; line-height:1.04; }
  .bo-home__hero-copy > p { margin-bottom:20px; font-size:14px; line-height:1.52; }
  .bo-home__search { padding:6px; border-radius:16px; }
  .bo-home__search .hp-form__field { padding:4px 12px; }
  .bo-home__search .hp-form__footer { margin-top:6px; }
  .bo-home__search .hp-form__footer .hp-form__button { min-height:46px; }
  .bo-home__geo { align-items:flex-start; flex-direction:column; gap:10px; margin-top:10px; padding:12px 13px; }
  .bo-home__geo-actions { width:100%; justify-content:space-between; }
  .bo-home__geo-allow { min-width:116px; }
  .bo-home__trust { margin-top:18px; }
  .bo-home__hero-art--photo { min-height:248px; margin-top:4px; border-radius:20px; }
  .bo-home__hero-note { padding:9px 11px; border-radius:11px; }
  .bo-home__section#bo-home-categories { padding:40px 0 46px; }
  .bo-home__section#bo-home-masters { padding:48px 0; }
  .bo-home__section-head { margin-bottom:20px; gap:8px; }
  .bo-home__section-head h2, .bo-home__specialists h2 { font-size:30px; }
  .bo-home__section-head p { font-size:13px; line-height:1.5; }
  .bo-home__categories { gap:9px; }
  .bo-home__category, .bo-home__category[class*="bo-home__category--"] { min-height:40px; padding:9px 13px; font-size:12px; }
  .bo-home__category--all { border-color:#cda9ae !important; background:#fff7f2 !important; }
  .bo-home__category small { margin-left:4px; color:#8c3b4a; font-size:14px; }
  .bo-home__discovery .bo-home__masters { gap:12px; }
  .bo-home__discovery .bo-home__master-card { grid-template-columns:104px minmax(0,1fr); min-height:112px; border-radius:15px; }
  .bo-home__discovery .bo-home__master-image { min-height:112px; }
  .bo-home__discovery .bo-home__master-body { padding:14px 14px 13px; }
  .bo-home__discovery .bo-home__master-body h3 { font-size:17px; }
  .bo-home__discovery .bo-home__master-body p { min-height:19px; margin-bottom:9px; font-size:11px; }
  .bo-home__discovery .bo-home__master-body strong { font-size:15px; }
  .bo-home__discovery-map, .bo-home__discovery-map .bo-home__map, .bo-home__discovery-map .bo-home__map .hp-map { min-height:260px; height:260px !important; }
  .bo-home__discovery-map { margin-top:4px; border-radius:16px; }
  .bo-home__map-badge { right:12px; bottom:12px; max-width:205px; padding:10px 12px; font-size:11px; }
  .bo-home__steps { gap:12px; }
  .bo-home__steps article { padding:20px 18px; border-radius:15px; }
  .bo-home__steps span { margin-bottom:8px; font-size:30px; }
  .bo-home__steps h3 { margin-bottom:5px; font-size:19px; }
  .bo-home__steps p { font-size:13px; line-height:1.48; }
}


/* Mobile order is intentional: choose a service, see the map, then browse cards. */
@media (max-width:900px) {
  .bo-home__discovery { display:flex !important; flex-direction:column; gap:14px; }
  .bo-home__discovery-map { order:1; }
  .bo-home__discovery > .bo-home__geo { order:2; }
  .bo-home__discovery > .bo-home__masters { order:3; }
  .bo-home__popular-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .bo-home__popular-grid a { min-height:96px; padding:14px; border-radius:15px; }
  .bo-home__popular-grid span { font-size:16px; }
  .bo-home__popular-grid b { font-size:11px; }
}


/* Mobile home: the hero is search-only; the decorative photo and its trust
   strip are deliberately removed so categories and map remain the journey. */
@media (max-width:900px) {
  .bo-home__hero-art--photo,
  .bo-home__trust { display:none !important; }
  .bo-home__hero { padding-bottom:28px; }
  .bo-home__promoted-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .bo-home__promoted-card { border-radius:15px; }
  .bo-home__promoted-image { height:112px; }
  .bo-home__promoted-body { gap:5px; padding:12px; }
  .bo-home__promoted-body h3 { font-size:17px; }
  .bo-home__promoted-body small { font-size:11px; }
  .bo-home__promoted-body .bo-home__text-link { font-size:11px; }
}


/* A week timetable is not legible at phone width. The script above switches
   FullCalendar to one day; these rules make that schedule calm and touchable. */
@media (max-width:600px) {
  body.bo-vendor-calendar .hp-calendar { overflow:hidden; }
  body.bo-vendor-calendar .fc .fc-toolbar {
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:10px;
  }
  body.bo-vendor-calendar .fc .fc-toolbar-chunk:nth-child(2) { text-align:right; }
  body.bo-vendor-calendar .fc .fc-toolbar-title { font-size:19px; line-height:1.2; }
  body.bo-vendor-calendar .fc .fc-button { min-width:42px; min-height:42px; }
  body.bo-vendor-calendar .fc .fc-timegrid-slot { height:44px; }
  body.bo-vendor-calendar .fc .fc-timegrid-axis-cushion,
  body.bo-vendor-calendar .fc .fc-col-header-cell-cushion { font-size:12px; }
}