/* Mobile UI responsive layer — loaded last. */
@media (max-width:760px){
  :root{--mobile-nav-h:72px;--mobile-gap:10px}
  html{scroll-padding-bottom:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom));}
  body.warehouse-app{padding:7px 7px calc(var(--mobile-nav-h) + 18px + env(safe-area-inset-bottom));overflow-x:hidden;}
  .warehouse-app .erp-container{width:100%;max-width:100%;overflow:visible;}
  .warehouse-app .ui-icon{display:block;flex:0 0 auto;min-width:16px;min-height:16px;overflow:visible;stroke:currentColor;stroke-width:1.8;}
  .warehouse-app [data-ui-icon]{min-width:0;}
  .warehouse-app [data-ui-icon]>.ui-icon[data-generated-ui-icon]{flex:0 0 auto;visibility:visible;opacity:1;}

  /* Mobile app header */
  .warehouse-app .erp-header{display:grid;grid-template-columns:1fr;align-items:stretch;gap:10px;margin:0 0 10px;padding:12px;border-radius:18px;overflow:visible;box-shadow:0 18px 42px -32px rgba(60,15,43,.85);}
  .warehouse-app .erp-header::after{width:180px;height:180px;top:-110px;inset-inline-end:-70px;}
  .warehouse-app .brand-lockup{width:100%;display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;align-items:center;}
  .warehouse-app .brand-logo-shell{width:46px;height:46px;border-radius:14px;padding:3px;}
  .warehouse-app .brand-copy{min-width:0;}
  .warehouse-app .brand-company-kicker{font-size:7px;letter-spacing:1.2px;}
  .warehouse-app .erp-header h1{font-size:16px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .warehouse-app .brand-subtitle{display:none;}
  .warehouse-app .warehouse-name-display{display:inline-flex;max-width:100%;margin-top:4px;padding:3px 8px;border-radius:999px;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

  .warehouse-app .header-actions{display:flex;grid-template-columns:none;width:100%;gap:7px;margin:0;padding:1px 0 3px;overflow-x:auto;overflow-y:visible;scroll-snap-type:x proximity;overscroll-behavior-inline:contain;scrollbar-width:none;}
  .warehouse-app .header-actions::-webkit-scrollbar{display:none;}
  .warehouse-app .header-actions>*{scroll-snap-align:start;flex:0 0 auto;}
  .warehouse-app .header-actions .btn,.warehouse-app .header-select-with-icon,.warehouse-app .current-user-pill,.warehouse-app .active-site-selector,.warehouse-app .offline-queue-pill{min-height:44px;height:auto;border-radius:12px;}
  .warehouse-app .header-actions .btn{display:inline-flex;width:auto;min-width:48px;padding:8px 10px;gap:6px;font-size:9px;justify-content:center;}
  .warehouse-app .header-actions .btn span:not(#notifBadge):not(.current-user-copy){font-size:9px;line-height:1.2;}
  .warehouse-app .header-actions .btn .ui-icon{width:19px;height:19px;margin:0;}
  .warehouse-app .notification-count-badge{position:static;min-width:18px;height:18px;padding:0 5px;font-size:8px;}
  .warehouse-app .header-select-with-icon{position:relative;display:flex;align-items:center;gap:5px;min-width:96px;padding:0 8px;overflow:hidden;}
  .warehouse-app .header-select-with-icon>.ui-icon{width:18px;height:18px;flex:0 0 18px;}
  .warehouse-app .header-select-with-icon select{display:block;width:68px;min-width:68px;height:40px;padding:0 2px;background:transparent;border:0;box-shadow:none;font-size:9px;color:#fff;}
  .warehouse-app .active-site-selector{display:flex;align-items:center;gap:6px;min-width:172px;padding:6px 8px;}
  .warehouse-app .active-site-selector>span{display:none;}
  .warehouse-app .active-site-selector select{display:block;min-width:145px;width:145px;min-height:34px;height:34px;padding:0 7px;font-size:9px;color:#fff;background:rgba(255,255,255,.08);}
  .warehouse-app .current-user-pill{display:flex;grid-column:auto;min-width:130px;padding:6px 9px;justify-content:flex-start;gap:7px;}
  .warehouse-app .current-user-pill .ui-icon{width:18px;height:18px;}
  .warehouse-app .current-user-copy{display:grid;min-width:0;}
  .warehouse-app .current-user-copy strong{max-width:96px;font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .warehouse-app .current-user-copy small{font-size:7px;}
  .warehouse-app .offline-queue-pill{width:auto;min-width:54px;padding:8px 10px;font-size:8px;}

  /* Bottom app navigation — keeps every section icon visible on phones. */
  .warehouse-app .nav-tabs{position:fixed;z-index:1200;inset-inline:0;bottom:0;top:auto;display:flex;align-items:stretch;gap:4px;width:100%;height:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom));margin:0;padding:6px 7px calc(6px + env(safe-area-inset-bottom));overflow-x:auto;overflow-y:hidden;border:1px solid var(--border);border-width:1px 0 0;border-radius:0;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 -12px 34px -24px rgba(31,23,29,.55);backdrop-filter:blur(18px);scrollbar-width:none;}
  .warehouse-app .nav-tabs::-webkit-scrollbar{display:none;}
  .warehouse-app .tab-btn{flex:0 0 72px;min-width:72px;min-height:58px;padding:5px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:12px;font-size:8px;line-height:1.15;text-align:center;white-space:normal;}
  .warehouse-app .tab-btn[data-ui-icon]>.ui-icon{width:20px;height:20px;min-width:20px;min-height:20px;}
  .warehouse-app .tab-btn>span:not(#masterCountBadge){display:block;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8px;}
  .warehouse-app #masterCountBadge{display:inline-grid;place-items:center;min-width:16px;height:16px;padding:0 4px;margin-inline-start:2px;border-radius:999px;font-size:7px;background:var(--brand-soft);color:var(--brand-deep);}
  .warehouse-app .tab-btn.active #masterCountBadge{background:rgba(255,255,255,.18);color:#fff;}

  /* Scanner / toolbars */
  .warehouse-app .barcode-scanner-bar{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:10px;padding:13px 12px;border-radius:16px;overflow:visible;}
  .warehouse-app .scanner-input-group{display:grid;grid-template-columns:1fr;gap:7px;width:100%;max-width:none;}
  .warehouse-app .scanner-label{font-size:10px;white-space:normal;}
  .warehouse-app .scanner-input-group input{width:100%;min-width:0;min-height:46px;font-size:13px;}
  .warehouse-app .scanner-actions,.warehouse-app .scanner-mode-wrap{width:100%;}
  .warehouse-app .inventory-toolbar,.warehouse-app .master-toolbar,.warehouse-app .reports-toolbar,.warehouse-app .audit-toolbar{grid-template-columns:1fr;gap:9px;}
  .warehouse-app .toolbar-panel{padding:12px;border-radius:15px;overflow:visible;}
  .warehouse-app .toolbar-actions-grid,.warehouse-app .toolbar-import-actions,.warehouse-app .toolbar-filters-grid{grid-template-columns:1fr;gap:8px;}
  .warehouse-app .toolbar-panel .btn{width:100%;justify-content:center;min-height:44px;}

  /* Cards / KPI */
  .warehouse-app .erp-metrics,.warehouse-app .dashboard-kpi-grid,.warehouse-app .reports-kpi-grid,.warehouse-app .audit-kpi-grid{grid-template-columns:1fr 1fr;gap:8px;}
  .warehouse-app .metric-card,.warehouse-app .kpi-card{min-height:96px;padding:12px;grid-template-columns:38px minmax(0,1fr);gap:9px;border-radius:15px;}
  .warehouse-app .metric-icon,.warehouse-app .kpi-icon{width:38px;height:38px;flex-basis:38px;border-radius:12px;}
  .warehouse-app .metric-icon .ui-icon,.warehouse-app .kpi-icon .ui-icon{width:20px;height:20px;}
  .warehouse-app .metric-info h2,.warehouse-app .kpi-value{font-size:22px;}
  .warehouse-app .metric-info>span,.warehouse-app .kpi-label{font-size:9px;}
  .warehouse-app .metric-sub,.warehouse-app .kpi-note{display:none;}
  .warehouse-app .dashboard-topbar,.warehouse-app .dashboard-meta,.warehouse-app .dashboard-hero-pro,.warehouse-app .reports-hero,.warehouse-app .audit-hero{min-width:0;}
  .warehouse-app .dashboard-hero-pro{grid-template-columns:1fr;padding:15px;}
  .warehouse-app .dashboard-health-ring{margin:auto;}

  /* Table sections and card-based rows */
  .warehouse-app .erp-table-container,.warehouse-app .table-card,.warehouse-app .audit-table-card{overflow:visible;border-radius:16px;}
  .warehouse-app .table-section-header{position:static;display:flex;align-items:center;gap:9px;padding:12px;border-radius:16px 16px 0 0;}
  .warehouse-app .table-section-title{min-width:0;}
  .warehouse-app .table-section-title strong,.warehouse-app .table-section-title span{font-size:11px;}
  .warehouse-app .table-section-subtitle{display:none;}
  .warehouse-app .table-section-icon{width:36px;height:36px;flex:0 0 36px;border-radius:11px;}
  .warehouse-app .table-section-icon .ui-icon{width:18px;height:18px;}
  .warehouse-app .table-scroll{overflow-x:visible;overflow-y:visible;max-height:none;}
  .warehouse-app .inventory-table,.warehouse-app .master-table,.warehouse-app .audit-table{display:block;width:100%;min-width:0;border:0;}
  .warehouse-app .inventory-table thead,.warehouse-app .master-table thead,.warehouse-app .audit-table thead{display:none;}
  .warehouse-app .inventory-table tbody,.warehouse-app .master-table tbody,.warehouse-app .audit-table tbody{display:grid;gap:9px;padding:9px;background:var(--surface-soft);}
  .warehouse-app .inventory-table tbody tr,.warehouse-app .master-table tbody tr,.warehouse-app .audit-table tbody tr{display:grid;width:100%;min-width:0;margin:0;padding:11px;border:1px solid var(--border);border-radius:15px;background:var(--surface);box-shadow:0 10px 24px -25px rgba(40,24,35,.5);overflow:hidden;}
  .warehouse-app .inventory-table tbody tr{grid-template-columns:minmax(0,1fr) auto;gap:7px 10px;}
  .warehouse-app .inventory-table td,.warehouse-app .master-table td,.warehouse-app .audit-table td{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-width:0;padding:6px 0;border:0;text-align:start;overflow:visible;}
  .warehouse-app .inventory-table td::before,.warehouse-app .master-table td::before,.warehouse-app .audit-table td::before{content:attr(data-mobile-label);flex:0 0 86px;color:var(--text-muted);font-size:8px;font-weight:800;line-height:1.45;}
  .warehouse-app .inventory-table td:nth-child(1){grid-column:1/2;grid-row:1;justify-content:flex-start;}
  .warehouse-app .inventory-table td:nth-child(1)::before{display:none;}
  .warehouse-app .inventory-table td:nth-child(2){grid-column:1/-1;grid-row:2;}
  .warehouse-app .inventory-table td:nth-child(3){grid-column:1/-1;grid-row:3;align-items:flex-start;}
  .warehouse-app .inventory-table td:nth-child(n+4){grid-column:1/-1;}
  .warehouse-app .inventory-table td:last-child{padding-top:9px;border-top:1px dashed var(--border);}
  .warehouse-app .item-name-link{font-size:11px;line-height:1.5;white-space:normal;text-align:start;overflow-wrap:anywhere;}
  .warehouse-app .code-chip{max-width:100%;font-size:10px;overflow-wrap:anywhere;}
  .warehouse-app .row-actions{display:flex;gap:8px;justify-content:flex-end;}
  .warehouse-app .table-action-btn{width:44px;height:44px;min-width:44px;border-radius:12px;display:grid;place-items:center;}
  .warehouse-app .table-action-btn .ui-icon{width:18px;height:18px;}
  .warehouse-app .category-badge,.warehouse-app .location-tag,.warehouse-app .qty-pill,.warehouse-app .status-badge{max-width:calc(100% - 96px);white-space:normal;overflow-wrap:anywhere;}
  .warehouse-app .expiry-cell{align-items:center;}
  .warehouse-app .expiry-cell>div,.warehouse-app .expiry-cell>small{text-align:end;}

  .warehouse-app .master-table tbody tr{grid-template-columns:1fr;}
  .warehouse-app .master-table td:first-child{display:none;}
  .warehouse-app .master-name-wrap{min-width:0;}
  .warehouse-app .master-item-name{font-size:11px;white-space:normal;overflow-wrap:anywhere;}
  .warehouse-app .master-item-caption{display:none;}
  .warehouse-app .master-barcode-chips{justify-content:flex-end;flex-wrap:wrap;}
  .warehouse-app .master-row-actions{width:100%;justify-content:flex-end;}

  .warehouse-app .audit-table tbody tr{grid-template-columns:1fr;}
  .warehouse-app .audit-details-cell{white-space:normal;overflow-wrap:anywhere;line-height:1.55;}
  .warehouse-app .audit-type-badge{max-width:100%;}

  /* Existing movement/transfer mobile rows: add visible labels and keep action icons. */
  .warehouse-app .warehouse-balance-table thead,.warehouse-app .movement-table thead,.warehouse-app .transfer-table thead{display:none;}
  .warehouse-app .warehouse-balance-table,.warehouse-app .warehouse-balance-table tbody,.warehouse-app .warehouse-balance-table tr,.warehouse-app .warehouse-balance-table td{display:block;width:100%;}
  .warehouse-app .warehouse-balance-table tr,.warehouse-app .movement-table tr,.warehouse-app .transfer-table tr{margin:9px 0;padding:9px;border:1px solid var(--border);border-radius:14px;background:var(--surface);}
  .warehouse-app .warehouse-balance-table td,.warehouse-app .movement-table td,.warehouse-app .transfer-table td{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 4px;border:0;min-width:0;}
  .warehouse-app .warehouse-balance-table td::before,.warehouse-app .movement-table td::before,.warehouse-app .transfer-table td::before{content:attr(data-mobile-label);flex:0 0 82px;color:var(--text-muted);font-size:8px;font-weight:800;}
  .warehouse-app .transfer-table td:last-child .btn{width:100%;justify-content:center;min-height:40px;}

  /* Settings / integrity */
  .warehouse-app .settings-grid{grid-template-columns:1fr;gap:9px;}
  .warehouse-app .settings-card{padding:14px;border-radius:16px;overflow:visible;}
  .warehouse-app .settings-card-head{align-items:flex-start;gap:9px;}
  .warehouse-app .settings-card-icon{width:38px;height:38px;flex:0 0 38px;border-radius:12px;}
  .warehouse-app .data-integrity-summary-grid{grid-template-columns:1fr 1fr;gap:7px;}
  .warehouse-app .data-integrity-table-wrap{max-height:none;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .warehouse-app .data-integrity-table{min-width:760px;}

  /* Modals become usable bottom sheets; headers/footer never disappear. */
  .warehouse-app .modal-overlay,.warehouse-app .confirm-modal-overlay{align-items:flex-end;padding:0;}
  .warehouse-app .modal-card,.warehouse-app .modal-box,.warehouse-app .confirm-modal-card{width:100%;max-width:none;max-height:94dvh;margin:0;border-radius:22px 22px 0 0;overflow:hidden;padding:0;}
  .warehouse-app .modal-card>.item-modal-head,.warehouse-app .modal-card>.modal-header,.warehouse-app .modal-box>.modal-header{position:sticky;top:0;z-index:5;margin:0;padding:14px 14px;border-bottom:1px solid var(--border);background:var(--surface);}
  .warehouse-app .modal-body,.warehouse-app .settings-modal-body{padding:14px;overflow-y:auto;}
  .warehouse-app .confirm-modal-card{padding:16px 14px calc(14px + env(safe-area-inset-bottom));overflow-y:auto;}
  .warehouse-app .confirm-modal-actions,.warehouse-app .cloud-account-actions,.warehouse-app .erp-document-actions,.warehouse-app .erp-workspace-actions{position:sticky;bottom:0;z-index:6;width:100%;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--surface) 95%,transparent);backdrop-filter:blur(14px);}
  .warehouse-app #cloudAccountModal .cloud-account-workspace{width:100%;max-width:none;max-height:96dvh;border-radius:22px 22px 0 0;}
  .warehouse-app #cloudAccountModal .cloud-account-flow{padding:14px;gap:10px;}
  .warehouse-app #cloudAccountModal .cloud-account-section{padding:13px;border-radius:15px;}
  .warehouse-app #cloudAccountModal .cloud-permission-groups,.warehouse-app #cloudAccountModal .cloud-site-scope-grid{grid-template-columns:1fr;}
  .warehouse-app #cloudAccountModal .permission-option.cloud-permission-option{grid-template-columns:34px 38px minmax(0,1fr);gap:8px;}

  /* Notification drawer and floating UI */
  .warehouse-app .notification-drawer{width:min(94vw,420px);max-width:94vw;}
  .warehouse-app #toast-container{inset-inline:8px;top:8px;max-width:none;}
  .warehouse-app .toast{width:100%;}
}

@media (max-width:430px){
  .warehouse-app .header-actions .btn span:not(#notifBadge):not(.current-user-copy){display:none;}
  .warehouse-app .header-actions .btn{min-width:46px;padding:8px;}
  .warehouse-app .header-select-with-icon{min-width:54px;width:54px;padding:0 9px;}
  .warehouse-app .header-select-with-icon select{position:absolute;inset:0;width:100%;height:100%;opacity:.01;cursor:pointer;}
  .warehouse-app .active-site-selector{min-width:150px;}
  .warehouse-app .active-site-selector select{min-width:132px;width:132px;}
  .warehouse-app .erp-metrics,.warehouse-app .dashboard-kpi-grid,.warehouse-app .reports-kpi-grid,.warehouse-app .audit-kpi-grid{grid-template-columns:1fr;}
  .warehouse-app .metric-card,.warehouse-app .kpi-card{min-height:82px;}
  .warehouse-app .data-integrity-summary-grid{grid-template-columns:1fr;}
  .warehouse-app .inventory-table td::before,.warehouse-app .master-table td::before,.warehouse-app .audit-table td::before,.warehouse-app .warehouse-balance-table td::before,.warehouse-app .movement-table td::before,.warehouse-app .transfer-table td::before{flex-basis:74px;}
}

/* Report share actions stay visible and tappable on phones. */
@media (max-width:760px){
  .warehouse-app .reports-hero-actions{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:8px;}
  .warehouse-app .reports-hero-actions .btn{width:100%;min-width:0;min-height:44px;justify-content:center;}
}
@media (max-width:430px){
  .warehouse-app .reports-hero-actions{grid-template-columns:1fr;}
}


/* WhatsApp direct-send mobile layout */
@media (max-width:720px){
  #whatsappReportModal{padding:0;align-items:flex-end}
  #whatsappReportModal .whatsapp-report-modal-card{width:100%;max-width:none;height:94dvh;max-height:94dvh;border-radius:24px 24px 0 0;margin:0;min-height:0}
  #whatsappReportModal .whatsapp-report-body{padding:16px 14px 18px;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;touch-action:pan-y}
  #whatsappReportModal .whatsapp-gateway-bar{align-items:flex-start;flex-direction:column}#whatsappReportModal .whatsapp-gateway-actions{width:100%;justify-content:space-between}
  #whatsappReportModal .whatsapp-report-layout{grid-template-columns:1fr;gap:12px}
  #whatsappReportModal .whatsapp-send-panel,#whatsappReportModal .whatsapp-preview-panel{padding:14px;border-radius:17px}
  #whatsappReportModal .whatsapp-phone-grid{grid-template-columns:104px minmax(0,1fr);gap:8px}
  #whatsappReportModal .whatsapp-report-actions{display:grid;grid-template-columns:1fr 1fr;padding:12px 14px calc(12px + env(safe-area-inset-bottom))}
  #whatsappReportModal .whatsapp-report-actions .whatsapp-direct-send-btn{grid-column:1/-1;grid-row:1;min-height:48px;width:100%}
  #whatsappReportModal .whatsapp-report-actions .btn-neutral{width:100%;min-height:44px}
  #whatsappReportModal .whatsapp-report-preview-card{grid-template-columns:auto minmax(0,1fr)}
  #whatsappReportModal .whatsapp-row-count{grid-column:2;justify-self:start}
}
