/* v570 Customer mobile/tablet chrome integrity
   Presentation-only repair loaded after v569.
   Goals:
   - never let the operating-status surface cover customer content on phones/tablets;
   - keep the header/status/hero in normal document flow below 1280 CSS px;
   - make the status surface compact and fully contained instead of a tall fixed overlay;
   - keep the hero concise on phones and remove redundant promo chrome;
   - keep install affordance branded and clear of purchase navigation.
   Layout is based only on available CSS viewport dimensions. */

body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"]{
  --customer-chrome-gutter-v570:clamp(10px,2.4vw,24px);
}

/* Phone/tablet invariant: status information is part of the page, not a viewport-covering overlay. */
@media(max-width:1279px){
  body.shop-page.has-store-status-v290[data-staff-table-order="false"][data-staff-quick-order="false"]{
    padding-top:0!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .shop-header{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    z-index:20!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-v290{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    z-index:12!important;
    width:min(1240px,calc(100% - (2 * var(--customer-chrome-gutter-v570))))!important;
    margin:10px auto 12px!important;
    padding:0!important;
    transform:none!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-inner-v290{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    box-shadow:0 10px 28px color-mix(in srgb,var(--customer-text-v568,#111827) 8%,transparent)!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] #menu{
    scroll-margin-top:12px!important;
  }
}

/* Phones: compact header + compact availability card + concise hero. */
@media(max-width:767px){
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .shop-header{
    width:100%!important;
    margin:0!important;
    padding:9px 12px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:"brand nav" "mode mode"!important;
    gap:8px 10px!important;
    align-items:center!important;
    border-radius:0 0 18px 18px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .brand-lockup{
    grid-area:brand!important;
    width:auto!important;
    min-width:0!important;
    gap:9px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .brand-lockup img,
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .logo-mark{
    width:42px!important;
    height:42px!important;
    flex:0 0 42px!important;
    border-radius:12px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .brand-lockup strong{
    font-size:18px!important;
    line-height:1.06!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .brand-lockup span{
    font-size:11px!important;
    line-height:1.15!important;
    margin-top:2px!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:1!important;
    overflow:hidden!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .customer-nav-v306{
    grid-area:nav!important;
    display:flex!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    justify-content:flex-end!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .reserve-link-v306{
    width:auto!important;
    min-width:78px!important;
    min-height:40px!important;
    padding:8px 11px!important;
    border-radius:12px!important;
    font-size:14px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .mode-switch{
    grid-area:mode!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:4px!important;
    gap:4px!important;
    border-radius:14px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .mode-btn{
    min-height:40px!important;
    padding:8px 7px!important;
    font-size:14px!important;
    border-radius:10px!important;
  }

  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-v290{
    width:calc(100% - 20px)!important;
    margin:8px 10px 10px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-inner-v290{
    padding:9px 10px!important;
    gap:7px!important;
    border-radius:18px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-main-v290{
    grid-template-columns:1fr!important;
    gap:7px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-lead-v290{
    min-width:0!important;
    padding:0 2px!important;
    gap:9px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-dot-v290{
    width:10px!important;
    height:10px!important;
    box-shadow:0 0 0 4px rgba(220,38,38,.11)!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-copy-v290 strong{
    font-size:15px!important;
    line-height:1.08!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-copy-v290 span{
    font-size:12px!important;
    line-height:1.18!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-services-v290{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
    overflow:visible!important;
    padding:0!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-chip-v290{
    min-width:0!important;
    max-width:none!important;
    width:100%!important;
    padding:6px 5px!important;
    display:grid!important;
    place-items:center!important;
    align-content:center!important;
    gap:3px!important;
    border-radius:12px!important;
    white-space:normal!important;
    text-align:center!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-chip-v290 b{
    font-size:12px!important;
    line-height:1.05!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-chip-v290 em{
    width:100%!important;
    min-width:0!important;
    font-size:10px!important;
    line-height:1.1!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-happy-v290{
    padding:7px 8px!important;
    gap:5px 7px!important;
    border-radius:13px!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    align-items:start!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-happy-v290 b{
    grid-column:2!important;
    font-size:11px!important;
    line-height:1.15!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-happy-v290 em{
    grid-column:2!important;
    font-size:10px!important;
    line-height:1.2!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    overflow:hidden!important;
  }

  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .premium-hero{
    width:calc(100% - 20px)!important;
    max-width:none!important;
    margin:0 10px 12px!important;
    padding:20px 16px!important;
    min-height:0!important;
    border-radius:22px!important;
    display:block!important;
    overflow:hidden!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-copy{
    padding:0!important;
    max-width:none!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-badge{
    padding:7px 10px!important;
    font-size:11px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-copy h1{
    max-width:12ch!important;
    margin:12px 0 10px!important;
    font-size:clamp(32px,9.5vw,42px)!important;
    line-height:.98!important;
    overflow:visible!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-copy p{
    margin:0!important;
    font-size:15px!important;
    line-height:1.38!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-location-v306{
    width:100%!important;
    max-width:none!important;
    margin:12px 0 0!important;
    padding:10px!important;
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr)!important;
    gap:8px 10px!important;
    border-radius:17px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-location-v306__pin{
    width:40px!important;
    height:40px!important;
    border-radius:13px!important;
    font-size:19px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-location-v306__text span{
    font-size:9px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-location-v306__text strong{
    font-size:14px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-location-v306__text small{
    font-size:11px!important;
    line-height:1.25!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-location-v306__map{
    grid-column:1/-1!important;
    width:100%!important;
    min-height:40px!important;
    padding:8px 10px!important;
    border-radius:12px!important;
    font-size:13px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-top:12px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-actions a{
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:9px 8px!important;
    border-radius:13px!important;
    font-size:14px!important;
    line-height:1.1!important;
  }
  /* Redundant on a phone: the same fulfillment information is already in the hero copy/status surface. */
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .hero-card{
    display:none!important;
  }

  /* Keep install visible, branded, and outside the content path. */
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .pwa-v321-btn{
    background:var(--customer-brand-v568,var(--customer-theme-color,var(--brand,#f97316)))!important;
    color:var(--customer-brand-contrast-v568,#fff)!important;
    border:1px solid color-mix(in srgb,var(--customer-brand-v568,var(--brand,#f97316)) 72%,#111827)!important;
    min-height:42px!important;
    padding:9px 13px!important;
    font-size:13px!important;
    box-shadow:0 10px 24px rgba(15,23,42,.18)!important;
  }
}

/* Tiny widths: preserve three service summaries without horizontal clipping. */
@media(max-width:350px){
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-services-v290{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-chip-v290:last-child{
    grid-column:1/-1!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .shop-header{
    grid-template-columns:minmax(0,1fr) auto!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .reserve-link-v306{
    min-width:70px!important;
    padding-inline:8px!important;
  }
}

/* Tablet/split view: status remains in flow and services wrap instead of clipping horizontally. */
@media(min-width:768px) and (max-width:1279px){
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-inner-v290{
    padding:9px 11px!important;
    border-radius:18px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-main-v290{
    grid-template-columns:minmax(190px,.65fr) minmax(0,1.35fr)!important;
    gap:10px!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-services-v290{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    overflow:visible!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-chip-v290{
    min-width:0!important;
    width:100%!important;
    white-space:normal!important;
  }
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] .store-status-chip-v290 em{
    white-space:normal!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.shop-page[data-staff-table-order="false"][data-staff-quick-order="false"] *{
    scroll-behavior:auto!important;
  }
}