/* V2.8.0 - Mobile full-screen popup / bottom sheet experience */
@media (max-width: 760px){
  body.kh-overlay-open,
  body.modal-lock{overflow:hidden!important;overscroll-behavior:none}

  body.kh-overlay-open .kh-mobile-bottom,
  body.modal-lock .kh-mobile-bottom{
    transform:translateY(calc(100% + env(safe-area-inset-bottom)))!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:transform .2s ease,opacity .18s ease,visibility .18s ease!important;
  }

  .kh-mobile-bottom{
    transition:transform .2s ease,opacity .18s ease,visibility .18s ease!important;
  }

  /* Quick service chooser: real mobile app sheet */
  .request-quick-modal{
    inset:0!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    padding:0!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    background:rgba(8,18,37,.48)!important;
    backdrop-filter:blur(5px)!important;
    overscroll-behavior:contain;
  }
  .request-quick-modal.open{display:flex!important}
  .request-quick-dialog{
    width:100%!important;
    max-width:none!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    background:#fff!important;
    animation:khFullSheetUp .22s ease-out!important;
  }
  .request-quick-head{
    position:relative!important;
    top:auto!important;
    z-index:3!important;
    padding:calc(18px + env(safe-area-inset-top)) 52px 12px 16px!important;
    background:#fff!important;
    border-bottom:1px solid #edf1f5!important;
    box-shadow:0 5px 18px rgba(15,35,65,.05)!important;
  }
  .request-quick-head .eyebrow{font-size:9px!important}
  .request-quick-head h2{font-size:21px!important;line-height:1.15!important;margin:3px 0 4px!important}
  .request-quick-head p{font-size:12px!important;line-height:1.4!important;margin:0!important;color:#64748b!important}
  .request-quick-head input{
    margin:10px 0 0!important;
    min-height:46px!important;
    padding:12px 14px!important;
    font-size:16px!important;
    border-radius:13px!important;
  }
  .request-quick-close{
    position:absolute!important;
    top:calc(12px + env(safe-area-inset-top))!important;
    right:12px!important;
    float:none!important;
    width:38px!important;
    height:38px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    background:#eef2f6!important;
    z-index:5!important;
  }
  .request-quick-grid{
    min-height:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    align-content:start!important;
    gap:7px!important;
    padding:12px 12px 14px!important;
  }
  .request-quick-grid a{
    min-height:58px!important;
    padding:9px 11px!important;
    border-radius:13px!important;
    background:#fff!important;
  }
  .request-quick-grid a>span{width:36px!important;height:36px!important;border-radius:11px!important}
  .request-quick-grid b{font-size:13px!important}
  .request-quick-grid small{font-size:10px!important;line-height:1.3!important}
  .request-quick-all{
    position:relative!important;
    z-index:4!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:54px!important;
    margin:0!important;
    padding:10px 16px calc(10px + env(safe-area-inset-bottom))!important;
    border-top:1px solid #e8edf3!important;
    background:#fff!important;
    color:var(--blue)!important;
    box-shadow:0 -8px 20px rgba(15,35,65,.06)!important;
  }

  /* Multi-step service wizard: full height with sticky header/footer */
  .wizard-modal{
    inset:0!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    padding:0!important;
    align-items:stretch!important;
    place-items:stretch!important;
    background:rgba(8,18,37,.48)!important;
    backdrop-filter:blur(5px)!important;
  }
  .wizard-modal.open{display:grid!important}
  .wizard-dialog{
    width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:0!important;
    margin:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    grid-template-rows:auto 4px auto minmax(0,1fr)!important;
    animation:khFullSheetUp .22s ease-out!important;
  }
  .wizard-dialog>header{
    min-height:60px!important;
    padding:calc(12px + env(safe-area-inset-top)) 54px 10px 16px!important;
    justify-content:flex-start!important;
    background:#fff!important;
    z-index:3!important;
  }
  .wizard-close{
    top:calc(8px + env(safe-area-inset-top))!important;
    right:12px!important;
    width:40px!important;
    height:40px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    background:#eef2f6!important;
    font-size:27px!important;
    line-height:1!important;
  }
  .wizard-progress{margin:0!important;border-radius:0!important}
  .wizard-price{padding:10px 16px!important;font-size:12px!important;background:#fbfcfe!important}
  .wizard-dialog form{min-height:0!important;overflow:hidden!important;display:grid!important;grid-template-rows:minmax(0,1fr) auto!important}
  .wizard-body{
    min-height:0!important;
    height:auto!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:16px 16px 18px!important;
  }
  .wizard-body h2{font-size:20px!important}
  .wizard-options label{min-height:48px!important;padding:8px 0!important}
  .wizard-dialog footer{
    position:relative!important;
    z-index:4!important;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    border-top:1px solid #e5eaf0!important;
    box-shadow:0 -8px 22px rgba(15,35,65,.07)!important;
  }
  .wizard-dialog footer .btn,.wizard-back{min-height:48px!important}

  /* Generic admin/customer modal also must not sit behind mobile nav */
  .modal.open{
    padding-bottom:env(safe-area-inset-bottom)!important;
  }

  @keyframes khFullSheetUp{
    from{transform:translateY(24px);opacity:.76}
    to{transform:translateY(0);opacity:1}
  }
}

@media (prefers-reduced-motion:reduce){
  .request-quick-dialog,.wizard-dialog{animation:none!important}
  .kh-mobile-bottom{transition:none!important}
}