/* Mobile-only refinement. Desktop layout remains unchanged. */
@media (max-width:900px){
  html,body.portal-integral{max-width:100%;overflow-x:hidden}
  body.portal-integral header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px!important}
  body.portal-integral header .brand{min-width:0}
  body.portal-integral header #logout{flex:0 0 auto;min-height:36px;padding:7px 11px}
  body.portal-integral main{width:100%;padding:0 12px 24px!important}
  body.portal-integral #workspace{min-width:0}
  body.portal-integral #identity{margin:8px 2px;text-align:left;font-size:10px;line-height:1.35;overflow-wrap:anywhere}

  body.portal-integral #menu{position:sticky!important;top:0;z-index:25;display:flex;flex-wrap:nowrap;gap:6px;width:calc(100% + 24px);margin:0 -12px 12px!important;padding:7px 12px!important;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:none;background:#14251f;border:0;border-block:1px solid color-mix(in srgb,var(--line) 72%,transparent);border-radius:0}
  body.portal-integral #menu::-webkit-scrollbar{display:none}
  body.portal-integral #menu .panel-menu-group{display:contents}
  body.portal-integral #menu .panel-menu-label{display:none}
  body.portal-integral #menu button{flex:0 0 auto!important;width:auto!important;min-width:0!important;min-height:36px;padding:7px 10px!important;gap:7px;border:1px solid transparent;border-radius:9px;scroll-snap-align:start;white-space:nowrap}
  body.portal-integral #menu button svg{width:16px;height:16px;flex:0 0 16px}
  body.portal-integral #menu button[aria-current=page]{border-color:color-mix(in srgb,var(--accent) 70%,transparent);box-shadow:none}

  /* Solo el administrador recibe navegación móvil por áreas. Panel permanece
     siempre visible; cada área descubre sus opciones al tocarla. */
  body.portal-integral #menu.mobile-admin-menu{display:grid;grid-template-columns:repeat(5,max-content);grid-template-rows:auto auto;align-items:center;gap:6px;overflow-x:auto}
  body.portal-integral #menu.mobile-admin-menu .panel-menu-group{display:contents}
  body.portal-integral #menu.mobile-admin-menu .panel-menu-label{display:flex;grid-row:1;align-items:center;min-height:36px;padding:7px 10px;border:1px solid transparent;border-radius:9px;color:#cbd7ce;font-size:11px;font-weight:700;white-space:nowrap;cursor:pointer;user-select:none}
  body.portal-integral #menu.mobile-admin-menu .panel-menu-label::after{content:'⌄';margin-left:6px;color:var(--muted);font-size:11px}
  body.portal-integral #menu.mobile-admin-menu .panel-menu-label[aria-expanded=true]{background:#293b32;color:#f0d596;border-color:#6d6345}
  body.portal-integral #menu.mobile-admin-menu .panel-menu-label[aria-expanded=true]::after{content:'⌃'}
  body.portal-integral #menu.mobile-admin-menu [data-panel-menu-group=start]>.panel-menu-label{display:none}
  body.portal-integral #menu.mobile-admin-menu [data-panel-menu-group=start]>button{display:flex;grid-row:1}
  body.portal-integral #menu.mobile-admin-menu .panel-menu-group:not([data-panel-menu-group=start])>button{display:none;grid-row:2}
  body.portal-integral #menu.mobile-admin-menu .panel-menu-group.is-open>button{display:flex}

  body.portal-integral .role-preview{margin:0 0 12px;padding:11px 12px;gap:8px;border-width:1px}
  body.portal-integral .panel-top{gap:10px;margin-bottom:14px;padding:14px;border-radius:11px}
  body.portal-integral .panel-top h1{font-size:22px;line-height:1.12}
  body.portal-integral .panel-top p{margin-top:4px;font-size:12px;line-height:1.45}
  body.portal-integral .panel-top>#dashboardNewOrder{position:static;align-self:flex-start;width:auto}
  body.portal-integral #content{min-width:0}

  body.portal-integral input,
  body.portal-integral select,
  body.portal-integral textarea{font-size:16px}
  body.portal-integral #content>.scroll,
  body.portal-integral #content details .scroll,
  body.portal-integral .operations-panel>.scroll{max-width:100%;max-height:none;overflow:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  body.portal-integral .scroll>table{min-width:620px}
  body.portal-integral .billing-document .scroll>table,
  body.portal-integral .invoice-layout .scroll>table{min-width:560px}

  body.portal-integral .dashboard-view-tabs,
  body.portal-integral .intermediary-view-tabs,
  body.portal-integral .order-quick-filters,
  body.portal-integral .invoice-quick-filters,
  body.portal-integral .client-quick-filters{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none}
  body.portal-integral .dashboard-view-tabs::-webkit-scrollbar,
  body.portal-integral .intermediary-view-tabs::-webkit-scrollbar,
  body.portal-integral .order-quick-filters::-webkit-scrollbar,
  body.portal-integral .invoice-quick-filters::-webkit-scrollbar,
  body.portal-integral .client-quick-filters::-webkit-scrollbar{display:none}

  body.portal-integral .dashboard-four .dashboard-chart{min-height:0;padding:14px}
  body.portal-integral .dashboard-four .dashboard-chart>svg{height:190px;margin-top:8px}
  body.portal-integral .power-chart-card{padding:13px;overflow:hidden}
  body.portal-integral .power-chart-heading{gap:8px;margin-bottom:10px}
  body.portal-integral .role-chart-metrics{max-width:100%;overflow-x:auto;scrollbar-width:none}
  body.portal-integral .role-chart-metrics::-webkit-scrollbar{display:none}

  body.portal-integral .store-shell{display:flex;flex-direction:column;gap:12px}
  body.portal-integral .store-catalog{order:1;min-width:0}
  body.portal-integral .store-cart{position:static!important;order:2!important;width:100%;margin:0}
  body.portal-integral .store-brands>div,
  body.portal-integral #intermediaryStore .is-brand-filter{display:flex;max-width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  body.portal-integral .store-brands>div::-webkit-scrollbar,
  body.portal-integral #intermediaryStore .is-brand-filter::-webkit-scrollbar{display:none}
  body.portal-integral .store-brands button,
  body.portal-integral #intermediaryStore .is-brand-filter button{flex:0 0 auto;white-space:nowrap}

  body.portal-integral .modal-backdrop,
  body.portal-integral .order-modal-backdrop{padding:7px}
  body.portal-integral .store-review,
  body.portal-integral .report-client-modal,
  body.portal-integral .replenishment-modal{width:100%;max-width:none;max-height:calc(100dvh - 14px);padding:14px;border-radius:13px;overflow:auto}
}

@media (max-width:560px){
  body.portal-integral main{padding-inline:10px!important}
  body.portal-integral #menu{width:calc(100% + 20px);margin-inline:-10px!important;padding-inline:10px!important}
  body.portal-integral .panel-top{padding:12px}
  body.portal-integral .panel-top h1{font-size:20px}

  body.portal-integral #content>form,
  body.portal-integral #orderForm,
  body.portal-integral #content>details,
  body.portal-integral .operations-panel,
  body.portal-integral .account-card{padding:12px;border-radius:11px}
  body.portal-integral .actions{display:grid;grid-template-columns:1fr;gap:8px}
  body.portal-integral .actions>button,
  body.portal-integral .actions>.button-link{width:100%;justify-content:center}

  body.portal-integral #content:has(.dashboard-overview)>#dashboardFilters{grid-template-columns:1fr}
  body.portal-integral #content:has(.dashboard-overview)>#dashboardFilters label,
  body.portal-integral #content:has(.dashboard-overview)>#dashboardFilters label:has(select[name=company]){grid-column:auto;min-width:0}
  body.portal-integral .compact-report-filters .report-period-fields{grid-template-columns:1fr}
  body.portal-integral .report-company-filter>div{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  body.portal-integral .report-company-filter>div::-webkit-scrollbar{display:none}
  body.portal-integral .report-company-filter button{flex:0 0 auto}

  body.portal-integral .store-toolbar{grid-template-columns:1fr}
  body.portal-integral .store-toolbar .store-search{grid-column:auto}
  body.portal-integral .store-products,
  body.portal-integral #intermediaryStore .store-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  body.portal-integral .store-product,
  body.portal-integral #intermediaryStore .store-product{min-width:0;min-height:0;padding:9px;gap:4px;border-radius:9px}
  body.portal-integral .store-product-head{min-height:22px;gap:4px}
  body.portal-integral .store-product-head .store-favorite{padding:4px}
  body.portal-integral .store-product-head .store-favorite span{display:none}
  body.portal-integral .store-product h3,
  body.portal-integral #intermediaryStore .store-product h3{margin:4px 0 1px;font-size:12px;line-height:1.3}
  body.portal-integral .store-product>p,
  body.portal-integral .store-product>p.store-product-meta,
  body.portal-integral #intermediaryStore .store-product small{font-size:9px;line-height:1.35}
  body.portal-integral .store-product-price{margin-top:4px}
  body.portal-integral .store-product-price strong{font-size:15px}
  body.portal-integral .store-stock-line{min-height:22px;gap:4px}
  body.portal-integral .store-buy{grid-template-columns:78px minmax(0,1fr);gap:5px;padding-top:5px}
  body.portal-integral .store-buy>button{min-width:0;min-height:34px;padding:6px 5px;font-size:9px;line-height:1.2}
  body.portal-integral #intermediaryStore .is-fields{grid-template-columns:56px minmax(0,1fr);gap:5px}
  body.portal-integral #intermediaryStore .is-fields label{font-size:9px}
  body.portal-integral #intermediaryStore .is-fields input{padding:6px 4px}
  body.portal-integral .store-import{display:grid;grid-template-columns:1fr;align-items:stretch}
  body.portal-integral .store-import button,
  body.portal-integral .store-import .button-link{width:100%;justify-content:center}
  body.portal-integral #intermediaryStore .is-client,
  body.portal-integral #intermediaryStore .is-filters{grid-template-columns:1fr;width:100%}
  body.portal-integral #intermediaryStore .is-client button{width:100%;justify-content:center}

  body.portal-integral .invoice-dialog-toolbar{padding:10px 12px}
  body.portal-integral .invoice-dialog-document{padding:12px}
  body.portal-integral .invoice-dialog-actions{height:auto;min-height:58px;padding:9px 12px;overflow-x:auto}
}

@media (max-width:380px){
  body.portal-integral .overview-kpis,
  body.portal-integral .stat-grid,
  body.portal-integral .purchase-chart-kpis{grid-template-columns:1fr}
}

@media (max-width:340px){
  body.portal-integral .store-products,
  body.portal-integral #intermediaryStore .store-products{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
  body.portal-integral #menu{scroll-behavior:auto}
}
