/* HayOrder v1.1.44 – mobile popup viewport + three-row top cards */

/* Only end devices: keep the complete popup inside the visible viewport. */
@media(max-width:760px){
  body.ho59-detail-open{overflow:hidden!important;}
  body .ho59-order-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:99990!important;
  }
  body #orders-ajax-root.ho-orders-144.ho59-modal-ready .ho54-detail.ho124-detail:not([hidden]){
    position:fixed!important;
    top:max(4px,env(safe-area-inset-top))!important;
    right:4px!important;
    bottom:max(4px,env(safe-area-inset-bottom))!important;
    left:4px!important;
    inset:max(4px,env(safe-area-inset-top)) 4px max(4px,env(safe-area-inset-bottom)) 4px!important;
    transform:none!important;
    z-index:99999!important;
    display:flex!important;
    flex-direction:column!important;
    width:auto!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    margin:0!important;
    overflow:hidden!important;
    border-radius:18px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho54-detail-header{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    padding:15px 16px 13px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho68-detail-scroll{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    padding-bottom:14px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho68-modal-footer{
    position:relative!important;
    bottom:auto!important;
    flex:0 0 auto!important;
    z-index:4!important;
  }

  /* Top information area: exactly one card per row on phones. */
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main{
    padding:12px 12px 0!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main .ho54-detail-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-auto-flow:row!important;
    gap:10px!important;
    align-items:start!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main .ho54-contact,
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main .ho128-order-summary,
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main .ho54-products{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    align-self:start!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main .ho54-detail-card{
    height:auto!important;
    min-height:0!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho54-facts-column.ho128-order-summary{
    display:block!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho128-summary-card{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho128-summary-row{
    min-height:72px!important;
    padding:13px 10px!important;
    grid-template-columns:minmax(92px,.72fr) minmax(0,1.28fr)!important;
    gap:14px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho128-summary-row>span{
    align-self:center!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho128-summary-row>div{
    align-self:center!important;
    min-width:0!important;
  }

  /* Keep mobile footer exactly inside the popup width. */
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho68-footer-buttons{
    width:100%!important;
    max-width:none!important;
  }
}

/* Very small phones: reduce shell spacing but keep cards readable. */
@media(max-width:480px){
  body #orders-ajax-root.ho-orders-144.ho59-modal-ready .ho54-detail.ho124-detail:not([hidden]){
    top:2px!important;
    right:2px!important;
    bottom:2px!important;
    left:2px!important;
    inset:2px!important;
    border-radius:16px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho54-detail-header{
    padding:13px 13px 11px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main{
    padding:10px 10px 0!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main .ho54-detail-grid{
    gap:9px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho55-main .ho54-detail-card{
    padding:14px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho128-summary-row{
    min-height:68px!important;
    padding:12px 8px!important;
    grid-template-columns:minmax(88px,.68fr) minmax(0,1.32fr)!important;
    gap:10px!important;
  }
  body #orders-ajax-root.ho-orders-144 .ho124-detail .ho68-modal-footer{
    padding:10px 10px max(10px,env(safe-area-inset-bottom))!important;
  }
}
