/* Shared screen layout. Keep document and print layouts independent. */
@media screen {
  body.innvsn-responsive :is(main,.main,.container,.page-content,.prime-workspace-content,.panel,.card,.form-group,.field-group) { min-width:0; }
  body.innvsn-responsive :is(.table-wrap,.table-wrapper,.table-container,.table-scroll,.planner-table-scroll,.pc-history-scroll) { min-width:0; max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; }
  body.innvsn-responsive :is(input,select,textarea) { box-sizing:border-box; max-width:100%; }
  body.innvsn-responsive .flavor-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  body.innvsn-responsive .flavor-item { min-width:0; }
  body.innvsn-responsive :is(.profile-dropdown,.nav-dropdown-menu,.innvsn-menu) { max-width:calc(100vw - 24px); max-height:calc(100dvh - 100px); overflow-y:auto; }
  body.innvsn-responsive .profile-pill { max-width:100%; }
  body.innvsn-responsive #navName { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  body.innvsn-responsive :is(.modal-overlay,.modal-backdrop,.transfer-modal-overlay) { box-sizing:border-box; padding:16px; }
  body.innvsn-responsive :is(.modal,.modal-card,.delete-modal,.custom-confirm-box,.chat-confirm-box) { max-width:100%; max-height:calc(100dvh - 32px); overflow-y:auto; }
  body.innvsn-responsive .side-panel { width:min(620px,100vw); height:100dvh; visibility:hidden; }
  body.innvsn-responsive .side-panel.open { visibility:visible; }
  .chat-device-nav { display:none; }
  body.innvsn-responsive :is(.room-item,.user-item):focus-visible { outline:2px solid var(--app-accent,var(--accent)); outline-offset:-2px; }
}

@media screen and (max-width:1024px) {
  body.innvsn-responsive:has(.attendance-topbar-filters) { flex-direction:column; height:100dvh; }
  body.innvsn-responsive:has(.attendance-topbar-filters) > .sidebar { display:grid; grid-template-columns:minmax(0,1fr) auto; width:100%; min-height:0; border-right:0; border-bottom:1px solid var(--border2); }
  body.innvsn-responsive:has(.attendance-topbar-filters) .sidebar-logo { grid-column:1; grid-row:1; padding:8px 12px; border:0; }
  body.innvsn-responsive:has(.attendance-topbar-filters) .sidebar-footer { grid-column:2; grid-row:1; padding:8px 12px; border:0; }
  body.innvsn-responsive:has(.attendance-topbar-filters) .sidebar-nav { grid-column:1/-1; flex-direction:row; overflow-x:auto; min-width:0; padding:8px 12px; }
  body.innvsn-responsive:has(.attendance-topbar-filters) .sidebar-nav .nav-item { flex-shrink:0; min-height:44px; }
  body.innvsn-responsive:has(.attendance-topbar-filters) > .main { min-height:0; width:100%; }
  body.innvsn-responsive:has(.attendance-topbar-filters) .topbar { height:auto; min-height:72px; flex-wrap:wrap; padding:12px; gap:12px; }
  body.innvsn-responsive:has(.attendance-topbar-filters) .topbar-right { width:100%; }
  body.innvsn-responsive .attendance-topbar-filters { flex:1; min-width:0; }
  body.innvsn-responsive .summary-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.innvsn-responsive .payroll-lookup-card { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.innvsn-responsive :is(.payroll-panel-head,.payroll-head-actions,.payroll-review-actions) { min-width:0; flex-wrap:wrap; }
  body.innvsn-responsive .topbar:has(.brand-center,.brand) { grid-template-columns:minmax(0,1fr) auto; height:auto; min-height:68px; padding:12px 16px; gap:12px; }
  body.innvsn-responsive .topbar :is(.brand-center,.brand) { display:none; }
  body.innvsn-responsive .topbar .nav-links { min-width:0; flex-wrap:wrap; }
  body.innvsn-responsive .topbar .topbar-right { min-width:0; justify-content:flex-end; }
  body.innvsn-responsive .topbar .profile-wrapper { max-width:180px; }
  body.innvsn-responsive .workspace-switch { min-width:0; flex-wrap:wrap; }
  body.innvsn-responsive .workspace-switch button { flex:1 1 100px; min-width:0; }
  .prime-flat.innvsn-responsive .prime-workspace .transfer-layout,
  .prime-flat.innvsn-responsive .warehouse-inventory-layout { grid-template-columns:minmax(0,1fr); }
  .prime-flat.innvsn-responsive .warehouse-stock-panels { grid-template-columns:minmax(0,1fr); }
  body.innvsn-responsive:has(.chat-wrap) { height:100vh; height:100dvh; min-height:0; }
  body.innvsn-responsive .chat-wrap { grid-template-columns:minmax(0,1fr); height:auto; flex:1; }
  body.innvsn-responsive .chat-wrap > :is(.sidebar,.users-panel) { display:none; }
  body.innvsn-responsive .chat-wrap[data-device-panel="rooms"] > .sidebar,
  body.innvsn-responsive .chat-wrap[data-device-panel="people"] > .users-panel { display:flex; min-height:0; }
  body.innvsn-responsive .chat-wrap[data-device-panel="rooms"] > .chat-area,
  body.innvsn-responsive .chat-wrap[data-device-panel="people"] > .chat-area { display:none; }
  .chat-device-nav { display:flex; flex-shrink:0; gap:8px; padding:8px 12px; border-bottom:1px solid var(--app-border,var(--border)); background:var(--app-panel,var(--surface)); }
  .chat-device-nav button { flex:1; min-height:44px; border:1px solid var(--app-border,var(--border)); border-radius:6px; background:var(--app-panel,var(--surface)); color:var(--app-text,var(--text)); font:inherit; cursor:pointer; }
  .chat-device-nav button[aria-pressed="true"] { background:var(--app-accent,var(--accent)); color:#fff; }
  .chat-device-nav button:focus-visible { outline:2px solid var(--app-accent,var(--accent)); outline-offset:2px; }
  body.innvsn-responsive .chat-area { min-width:0; }
  body.innvsn-responsive .chat-header { flex-wrap:wrap; gap:8px; }
  body.innvsn-responsive .msg { max-width:92%; }
  body.innvsn-responsive .msg-actions { opacity:1; }
}

@media screen and (max-width:760px) {
  body.innvsn-responsive .payroll-lookup-card { grid-template-columns:minmax(0,1fr); }
  body.innvsn-responsive:has(.attendance-topbar-filters) .topbar { height:auto; min-height:72px; flex-wrap:wrap; padding:12px; gap:12px; }
  body.innvsn-responsive .attendance-topbar-filters { flex:0 0 100%; justify-content:flex-start; width:100%; }
  body.innvsn-responsive:has(.attendance-topbar-filters) .topbar-right { width:100%; justify-content:flex-start; }
  body.innvsn-responsive:has(.attendance-topbar-filters) .profile-dropdown { left:0; right:auto; }
  body.innvsn-responsive :is(.panel-head,.table-top,.table-head,.form-header,.payroll-head-actions) { flex-wrap:wrap; gap:12px; }
  body.innvsn-responsive :is(.inventory-date-filters,.inputs-head-actions,.purchase-status-controls,.header-actions,.toolbar-actions) { min-width:0; flex-wrap:wrap; }
  body.innvsn-responsive :is(.table-search,.search-wrap) { min-width:0; max-width:100%; }
  body.innvsn-responsive .inventory-date-filters label { flex:1 1 140px; min-width:0; }
  body.innvsn-responsive :is(.product-form,.user-form,.form-grid) { grid-template-columns:minmax(0,1fr); }
  body.innvsn-responsive .flavor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.innvsn-responsive :is(.product-form,.user-form,.form-grid,.flavor-grid) > * { min-width:0; }
  body.innvsn-responsive .form-grid .full { grid-column:1/-1; }
  body.innvsn-responsive .toast { min-width:0; max-width:calc(100vw - 32px); }
  body.innvsn-responsive :is(.modal-actions,.form-actions,.modal-footer) { flex-wrap:wrap; }
  /* Multiple frozen order columns would cover the entire phone viewport. */
  body.innvsn-responsive:has(#tableBody) .sticky-col { position:static; }
}

@media screen and (max-width:480px) {
  body.innvsn-responsive .summary-cards { grid-template-columns:minmax(0,1fr); }
  body.innvsn-responsive:has(.attendance-topbar-filters) .page { padding:16px 12px; }
  body.innvsn-responsive .topbar .profile-wrapper { max-width:140px; }
  body.innvsn-responsive :is(.main,.container) { padding-left:12px; padding-right:12px; }
  body.innvsn-responsive:has(.chat-wrap) :is(.messages,.chat-header,.chat-input-area) { padding:12px; }
  body.innvsn-responsive .input-row { gap:8px; }
}

@media screen and (pointer:coarse) {
  body.innvsn-responsive :is(.nav-link,.profile-pill,.innvsn-dropdown-toggle,.sidebar-logo-btn,.tab,.btn,.btn-gold,.history-tab,.room-item,.user-item,.attach-btn,.send-btn) { min-height:44px; }
  body.innvsn-responsive .msg-actions { opacity:1; }
  body.innvsn-responsive .msg-action-btn { min-height:44px; min-width:44px; }
  body.innvsn-responsive :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) { font-size:16px; }
}