/* ========================================================================
   P-UI07 — Final Public UX Consistency + Mobile/Desktop Sync
   Loaded absolutely last from <x-header>.
   Goal: one 1280px desktop axis, one mobile gutter, one global chrome,
   no page-local fixed CTA collision, consistent overflow/card/button rhythm.
   ======================================================================== */
:root{
  --mbr-public-width:1280px;
  --mbr-public-gutter:16px;
  --mbr-public-mobile-gutter:12px;
  --mbr-public-radius:16px;
  --mbr-public-border:#e5e7eb;
  --mbr-public-bg:#f7f8fb;
}
html,body{max-width:100%;overflow-x:clip}
body.w11-pro-site *,body.w11-pro-site *::before,body.w11-pro-site *::after{box-sizing:border-box}
body.w11-pro-site img,body.w11-pro-site video,body.w11-pro-site iframe{max-width:100%}

/* FINAL desktop axis. Keep full-bleed hero/header/footer backgrounds intact; align content wrappers only. */
@media (min-width:992px){
  body.w11-pro-site :is(
    .w11-pro-container,.ua-shell,.w2-container,.w2-commerce-container,
    .mbr-ui-container,.mbr-page-shell,.lm-wrap,.lh-wrap,.lidx,.mbr-wrap,
    .svc-wrap,.veh-wrap,.prop-wrap,.dt-news-wrap,.dt-news-container,
    .news-container,.news-page-container,.search-page-shell,.market-search-page,
    .ct5-container,.wt-container,.wt2-container,.wt-market-container,
    .wt-detail-container,.wt-page-container,.wt-shop-container,
    .site-container,.page-container,.front-container,.listing-page-container,
    .shop-page-container,.user-page-container,.alogiare-container,
    .alogiare-footer-container,.p16-taxonomy-shell
  ){
    width:calc(100% - 32px)!important;
    max-width:var(--mbr-public-width)!important;
    margin-left:auto!important;margin-right:auto!important;
  }
  /* Old theme controllers used 1240px via variable. Lock it here, last. */
  body.w11-pro-site{--w11-container:1280px!important;--site-container:1280px!important;--alogiare-container:1280px!important}
}

/* Canonical mobile/tablet gutter. No page is allowed to become narrower via legacy 1180/1200 rules. */
@media (max-width:991.98px){
  body.w11-pro-site :is(
    .w11-pro-container,.ua-shell,.w2-container,.w2-commerce-container,
    .mbr-ui-container,.mbr-page-shell,.lm-wrap,.lh-wrap,.lidx,.mbr-wrap,
    .svc-wrap,.veh-wrap,.prop-wrap,.dt-news-wrap,.dt-news-container,
    .news-container,.news-page-container,.search-page-shell,.market-search-page,
    .ct5-container,.wt-container,.wt2-container,.wt-market-container,
    .wt-detail-container,.wt-page-container,.wt-shop-container,
    .site-container,.page-container,.front-container,.listing-page-container,
    .shop-page-container,.user-page-container,.alogiare-container,
    .alogiare-footer-container,.p16-taxonomy-shell
  ){
    width:100%!important;max-width:100%!important;
    margin-left:auto!important;margin-right:auto!important;
    padding-left:var(--mbr-public-mobile-gutter)!important;
    padding-right:var(--mbr-public-mobile-gutter)!important;
  }
}

/* One global mobile contact system: layout/app already renders x-mobile-bottom-menu. */
body.w11-pro-site .mbr-mobile-bar,
body.w11-pro-site .w11-mobile-cta-bar{display:none!important}
@media (max-width:767.98px){
  body.w11-pro-site .w11-pro-main{padding-bottom:max(76px,env(safe-area-inset-bottom))}
  body.w11-pro-site .alo-floating-contact{display:none!important}
}
@media (min-width:768px){
  /* Desktop owns the vertical floating contact; mobile bottom menu stays mobile-only. */
  body.w11-pro-site .alo-floating-contact{display:block}
}

/* Responsive grid hardening: prevent cards from pushing viewport horizontally. */
body.w11-pro-site :is(
  .mbr-page-grid,.lm-grid,.lh-grid,.svc-grid,.veh-grid,.prop-grid,
  .w2-commerce-listing-grid,.w2-commerce-category-grid,.p3-listing-grid
)>*{min-width:0}
body.w11-pro-site :is(.mbr-page-card,.mbr-ui-card,.svc-card,.veh-card,.prop-card){overflow-wrap:anywhere}

/* Shared controls stay tappable and visually aligned. */
body.w11-pro-site :is(button,.btn,.mbr-ui-btn,input,select,textarea){max-width:100%}
@media (max-width:767.98px){
  body.w11-pro-site :is(button,.btn,.mbr-ui-btn,a[role="button"]){min-height:42px}
  body.w11-pro-site :is(input:not([type="checkbox"]):not([type="radio"]),select){min-height:44px}
  body.w11-pro-site h1{overflow-wrap:anywhere}
}

/* Tables/long content scroll inside their block, never the full page. */
body.w11-pro-site :is(.table-responsive,.mbr-table-scroll,.svc-table-wrap,.veh-table-wrap,.prop-table-wrap){max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
body.w11-pro-site :is(table){max-width:100%}

/* Keep page rhythm consistent without flattening industry identity. */
body.w11-pro-site main.w11-pro-main{min-width:0;background:var(--mbr-page-bg,var(--mbr-public-bg))}
body.w11-pro-site :is(.mbr-page-section,.mbr-ui-card,.svc-card,.veh-card,.prop-card){border-color:var(--mbr-public-border)}
