/* ArexBilling Global Responsive Layer v1.8.0
   Keeps the billing UI fluid across browser zoom and viewport sizes. */
:root{
  --arex-sidebar-fluid:clamp(220px,15vw,285px);
  --arex-page-gutter:clamp(10px,1.15vw,22px);
}
html,body{max-width:100%;overflow-x:hidden}
*{box-sizing:border-box}
img,video,svg{max-width:100%}
.ap-shell,.ap-workspace,.ap-content,.ap-content>*{min-width:0}

@media (min-width:901px){
  body .ap-shell{
    display:grid!important;
    grid-template-columns:var(--arex-sidebar-fluid) minmax(0,1fr)!important;
    width:100%!important;
    max-width:100vw!important;
    min-width:0!important;
  }
  body .ap-sidebar{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
  }
  body .ap-workspace{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin-left:0!important;
    padding-left:0!important;
  }
  body .ap-content{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding-left:var(--arex-page-gutter)!important;
    padding-right:var(--arex-page-gutter)!important;
  }
}

/* Common ArexHost screens: never let a fixed-width child force horizontal overflow. */
:where(
 .ap-dashboard,.ap-dashboard-page,.ap-services-page,.ap-checkout-page,
 .ax17-checkout,.ac160-page,.ac161-page,.ap-account-page,.ap-invoices-page,
 .ap-tickets-page,.ap-home-page,.ap-cart-page
){width:100%!important;max-width:none!important;min-width:0!important}

:where(
 .ap-checkout-grid,.ap-dashboard-grid,.ap-services-grid,.ax17-layout,
 .ac160-grid,.ac160-catalog,.ac161-grid
)>*{min-width:0!important}

:where(.ap-card,.ap-panel,.ax17-section,.ax17-summary,.ac160-card,.ac161-card){
  max-width:100%;
}

@media (max-width:1180px) and (min-width:901px){
  :root{--arex-sidebar-fluid:clamp(210px,18vw,235px);--arex-page-gutter:10px}
}
@media (max-width:900px){
  body .ap-shell{display:block!important;width:100%!important}
  body .ap-workspace,body .ap-content{width:100%!important;min-width:0!important;margin:0!important}
  body .ap-content{padding-left:10px!important;padding-right:10px!important}
}
@media (max-width:560px){
  body .ap-content{padding-left:7px!important;padding-right:7px!important}
}