/* v569U — Phase 5 mobile/tablet responsive + floating widget overlap cleanup.
   Scope: customer-facing mobile/tablet visual safety only.
   This file does not change order/payment logic, JS behavior, pricing, upload, chatbot API, or admin tools. */

:root{
  --vge-mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
  --vge-floating-dock-height: 112px;
  --vge-floating-dock-gap: 14px;
}

html,body{max-width:100%;}
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]){overflow-x:hidden;}

/* General tablet/mobile containment: prevent old fixed-width cards/grids from forcing horizontal scroll. */
@media (max-width:980px){
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) main,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .container,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .section,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .page-hero,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .hero,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .card,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .panel,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .order-shell,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .payment-shell,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .tracking-shell,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .status-shell{
    min-width:0!important;
    max-width:100%!important;
  }

  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .container{
    width:100%!important;
    padding-left:clamp(16px,4.5vw,26px)!important;
    padding-right:clamp(16px,4.5vw,26px)!important;
  }

  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) img,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) svg,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) canvas,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) video,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) iframe{
    max-width:100%!important;
  }

  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) input,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) select,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) textarea{
    min-width:0!important;
    max-width:100%!important;
    font-size:16px!important;
  }

  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .btn,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) button,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) [role="button"]{
    touch-action:manipulation;
  }
}

/* Customer order/payment mobile: keep review, total, confirmation and payment cards readable and not hidden by floating controls. */
@media (max-width:980px){
  body:has(#orderForm){
    padding-bottom:calc(156px + var(--vge-mobile-safe-bottom))!important;
  }
  body:has(#orderForm) .order-layout,
  body:has(#orderForm) .order-main,
  body:has(#orderForm) .form-card,
  body:has(#orderForm) .review-mobile,
  body:has(#orderForm) .inline-payment-panel,
  body:has(#orderForm) .inline-payment-grid,
  body:has(#orderForm) .inline-payment-card{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  body:has(#orderForm) .review-mobile,
  body:has(#orderForm) .inline-payment-panel{
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body:has(#orderForm) .summary-total-card,
  body:has(#orderForm) .summary-total-fixed-v561U,
  body:has(#orderForm) .order-total-visible-v561U{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
  }
  body:has(#orderForm) .confirmation-box.single-confirm-v562U{
    width:100%!important;
    max-width:100%!important;
    padding:16px!important;
  }
  body:has(#orderForm) .confirmation-box.single-confirm-v562U .confirm-check{
    display:grid!important;
    grid-template-columns:24px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:start!important;
  }
  body:has(#orderForm) .confirmation-box.single-confirm-v562U input[type="checkbox"]{
    width:20px!important;
    height:20px!important;
    margin-top:2px!important;
  }
}

@media (max-width:760px){
  body:has(#orderForm) .order-shell{padding-top:14px!important;}
  body:has(#orderForm) .order-progress{overflow-x:auto!important;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  body:has(#orderForm) .order-progress::-webkit-scrollbar{display:none;}
  body:has(#orderForm) .form-grid,
  body:has(#orderForm) .traveler-grid,
  body:has(#orderForm) .contact-grid,
  body:has(#orderForm) .addon-grid,
  body:has(#orderForm) .fast-track-grid-v499G{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  body:has(#orderForm) #fastTrackFields .date-combo{
    grid-template-columns:minmax(0,1fr) 52px!important;
    gap:8px!important;
  }
  body:has(#orderForm) #fastTrackFields .date-combo .date-button,
  body:has(#orderForm) #fastTrackFields .date-combo .native-date-picker{
    width:52px!important;
    height:52px!important;
    min-height:52px!important;
  }
  body:has(#orderForm) .payment-action-card-v563U #inlinePaymentBox .actions,
  body:has(#orderForm) .form-actions,
  body:has(#orderForm) .summary-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  body:has(#orderForm) .payment-action-card-v563U #inlinePaymentBox .actions .btn,
  body:has(#orderForm) .form-actions .btn,
  body:has(#orderForm) .summary-actions .btn{
    width:100%!important;
    min-width:0!important;
  }
}

/* Landing pages: sticky CTA and floating contacts should not sit on top of each other on phones. */
@media (max-width:760px){
  body.lp-page{
    padding-bottom:calc(154px + var(--vge-mobile-safe-bottom))!important;
  }
  body.lp-page .lp-sticky{
    z-index:760!important;
    padding-bottom:calc(8px + var(--vge-mobile-safe-bottom))!important;
  }
  body.lp-page .lp-sticky .container,
  body.lp-page .lp-actions{
    min-width:0!important;
  }
  body.lp-page .lp-sticky .lp-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  body.lp-page .whatsapp-float,
  body.lp-page .messenger-float,
  body.lp-page .telegram-float{
    bottom:calc(92px + var(--vge-mobile-safe-bottom))!important;
    z-index:790!important;
  }
}

/* Floating contact dock: one stable bottom layer; chatbot launcher above it; full chatbot panel above both. */
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-quick-contact-dock-v419G{z-index:780!important;}
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .whatsapp-float,
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .messenger-float,
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .telegram-float{z-index:780!important;}
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-root{z-index:830!important;}
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-root.is-open{z-index:1320!important;}
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .modal,
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .popup,
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) [role="dialog"],
body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .addon-booking-modal-v303G{z-index:1400!important;}

@media (max-width:640px){
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]):not(.lp-page){
    padding-bottom:calc(136px + var(--vge-mobile-safe-bottom))!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-quick-contact-dock-v419G{
    right:8px!important;
    left:auto!important;
    bottom:calc(8px + var(--vge-mobile-safe-bottom))!important;
    max-width:calc(100vw - 16px)!important;
    gap:7px!important;
    justify-content:flex-end!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-quick-contact-item-v419G{
    min-width:46px!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-quick-contact-label-v419G{
    max-width:64px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-root:not(.is-open){
    right:10px!important;
    bottom:calc(124px + var(--vge-mobile-safe-bottom))!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-root.is-open{
    right:0!important;
    left:0!important;
    bottom:0!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-root.is-open .vge-chatbot-panel{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    top:auto!important;
    bottom:calc(10px + var(--vge-mobile-safe-bottom))!important;
    width:auto!important;
    height:min(640px,calc(100dvh - 22px - var(--vge-mobile-safe-bottom)))!important;
    max-height:calc(100dvh - 22px - var(--vge-mobile-safe-bottom))!important;
    border-radius:20px!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-root.is-open ~ .whatsapp-float,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-root.is-open ~ .messenger-float,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-root.is-open ~ .telegram-float{
    display:none!important;
  }
}

@media (max-width:420px){
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-quick-contact-dock-v419G{gap:5px!important;}
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-quick-contact-item-v419G{min-width:42px!important;}
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-quick-contact-label-v419G{font-size:9.5px!important;padding:3px 5px!important;max-width:58px!important;}
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-launcher{width:52px!important;min-width:52px!important;max-width:52px!important;padding:0!important;justify-content:center!important;}
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .vge-chatbot-launcher span:not(.vge-chatbot-launcher-icon){display:none!important;}
}

/* Date/popup/table safety: dialogs stay inside viewport; wide tables scroll instead of breaking mobile layout. */
@media (max-width:760px){
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .date-picker,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .datepicker,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .calendar-popover,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .picker-popover{
    max-width:calc(100vw - 24px)!important;
    z-index:1420!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) table{
    max-width:100%!important;
  }
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .table-wrap,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .pricing-table-wrap,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .fee-table-wrap,
  body:not(.vge-admin-page):not(.admin-body):not([class*="admin"]) .responsive-table{
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
}