/* =========================================================
   V78 - MODAL SINGLE SCROLL / MOBILE UX
   Chỉ điều chỉnh popup, không thay đổi nghiệp vụ
   ========================================================= */

/* Khi popup mở: khóa trang nền */
body.modalOpen67{
  overflow:hidden !important;
  overscroll-behavior:none !important;
}

/* Popup chiếm viewport và tự quản lý vùng cuộn */
#modal.on{
  position:fixed !important;
  inset:0 !important;
  overflow:hidden !important;
  overscroll-behavior:none !important;
}

/* Khung popup không được tự cuộn */
#modal.on > .sheet{
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}

/* Tiêu đề luôn nằm trên */
#modal.on > .sheet > .sheetHead{
  flex:0 0 auto !important;
  position:relative !important;
  z-index:500 !important;
  background:#fff !important;
}

/* Chỉ duy nhất nội dung này được cuộn */
#modal.on > .sheet > #modalBody{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior:contain !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-gutter:stable;
}

/* Thanh nút dưới cùng luôn dễ thao tác */
#modal.on .billDesigner74 > .settingActions{
  position:sticky !important;
  bottom:0 !important;
  z-index:600 !important;
  background:#fff !important;
  margin-top:10px !important;
  padding:9px 0 max(9px,env(safe-area-inset-bottom)) !important;
  border-top:1px solid #ead8cc !important;
  box-shadow:0 -8px 18px rgba(255,255,255,.98) !important;
}

/* Điện thoại */
@media(max-width:600px){
  #modal.on{
    padding:0 !important;
  }

  #modal.on > .sheet{
    width:100% !important;
    max-width:100vw !important;
    height:100dvh !important;
    max-height:100dvh !important;
    margin:0 !important;
    border-radius:0 !important;
    padding:8px 10px 0 !important;
  }

  #modal.on > .sheet > .sheetHead{
    min-height:48px !important;
    padding:0 2px 7px !important;
  }

  #modal.on > .sheet > #modalBody{
    padding-bottom:0 !important;
  }

  #modal.on .billDesigner74 > .settingActions{
    grid-template-columns:minmax(0,1fr) minmax(0,1.35fr) !important;
    gap:7px !important;
  }

  #modal.on .billDesigner74 > .settingActions button{
    min-height:44px !important;
    font-size:12px !important;
  }
}

/* Máy rất nhỏ */
@media(max-width:390px){
  #modal.on .billDesigner74 > .settingActions{
    grid-template-columns:1fr 1.25fr !important;
  }
}