/* Shared screen-only responsive layer. Important declarations are limited to
   overriding legacy desktop !important sizing; physical print styles are untouched. */
.mobile-navigation-trigger,.mobile-navigation-close,.mobile-navigation-backdrop{display:none}
.responsive-table-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
.responsive-table-scroll:focus-visible{outline:2px solid #6d28d9;outline-offset:2px}
@media screen and (max-width:1024px){
  .app-shell,.workspace{min-width:0!important;width:100%}
  body .sidebar,body.sidebar-collapsed .sidebar{position:fixed!important;inset:0 0 0 auto!important;width:min(320px,88vw)!important;min-width:0!important;max-width:88vw;flex-basis:auto!important;height:100dvh!important;z-index:200!important;transform:translateX(105%);transition:transform .18s ease;overflow-y:auto!important;visibility:hidden}
  body.mobile-navigation-open .sidebar{transform:none;visibility:visible}
  body .sidebar .nav-label,body.sidebar-collapsed .sidebar .nav-label{display:block!important;opacity:1!important;width:auto!important}
  body .sidebar .nav-item{justify-content:flex-start!important;font-size:16px!important;min-height:48px}
  body .sidebar-toggle{display:none!important}
  .mobile-navigation-trigger,.mobile-navigation-close{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:1px solid #e2e8f0;border-radius:10px;background:white;color:#172344;cursor:pointer}
  .mobile-navigation-close{align-self:flex-end;flex-shrink:0;font-size:28px;margin:8px}
  .mobile-navigation-open .mobile-navigation-backdrop{display:block;position:fixed;inset:0;z-index:199;background:#0f172a88;border:0}
  body.mobile-navigation-open{overflow:hidden}
  body .workspace{margin:0!important}
  body .topbar{height:auto!important;min-height:80px;padding:12px 16px!important;gap:12px;flex-wrap:wrap}
  body .user-tools{gap:10px!important;min-width:0;flex-wrap:wrap}
  .welcome{max-width:240px}
  .content{padding:20px!important;min-width:0}
  .kpi-grid,.employee-stats,.payroll-kpis,.approval-kpis,.execution-kpis,.exec-kpis,.closing-kpis,.custody-kpis,.asset-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .page-head,.page-header,.asset-profile>header{gap:14px;flex-wrap:wrap}
  .page-actions,.top-actions,.asset-profile-actions{flex-wrap:wrap;gap:10px}
  .responsive-table-scroll{width:100%}
  .notification-panel{max-height:calc(100dvh - 120px)!important;overflow-y:auto!important}
}
@media screen and (max-width:700px){
  /* Browser QA: expense / explanation overlays left the background scrollable. */
  body:has(.liquidity-dialog,.financial-explanation-dialog){overflow:hidden}
  /* Browser QA: pagination controls exceeded the 360px employee footer. */
  .table-footer{height:auto!important;min-height:80px;flex-wrap:wrap;gap:12px;padding:14px!important}
  .pagination{flex-wrap:wrap;max-width:100%}
  /* Browser QA: approval tabs forced 435px document width on phones. */
  .approval-tabs{display:flex;max-width:100%;width:100%!important;min-width:0;overflow-x:auto;flex-wrap:nowrap;overscroll-behavior-inline:contain}
  .approval-tabs button{flex:1 0 auto;min-height:44px;white-space:nowrap}
  /* Narrow approval cards: decorative absolute icons overlapped labels/amounts. */
  .approval-kpis article i{position:static!important;margin:0 auto 8px!important;flex-shrink:0}
  .approval-kpis article strong{max-width:100%;white-space:normal!important;overflow-wrap:anywhere}
  .page-size{flex-wrap:wrap;gap:10px!important;max-width:100%}
  /* Browser QA: standalone selection checkboxes had only a 13px hit area. */
  .responsive-table-scroll input[type=checkbox]{width:32px;height:32px;margin:6px;cursor:pointer}
  body:has(.asset-modal-layer:not([hidden]),.asset-modal-overlay,.quick-drawer:not([hidden]),.movement-drawer:not([hidden]),.close-review-backdrop,.app-dialog-overlay){overflow:hidden}
  .login-form-wrap form,.login-form-wrap label,.login-input{min-width:0!important;max-width:100%!important}
  .login-input input{width:0;min-width:0;flex:1}
  .exec-batch,.exec-batch>div,.direct-expenses-header{flex-wrap:wrap}
  .liquidity-dialog-card{width:100%!important;min-width:0!important;max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important;overflow:auto!important;box-sizing:border-box;padding:16px!important}
  .asset-modal-layer{overscroll-behavior:contain}
  .login-form-wrap{width:100%!important;min-width:0!important;max-width:100%!important}
  .responsive-operational-table,.responsive-operational-table tbody,.responsive-operational-table tr{display:block!important;width:100%!important;min-width:0!important;box-sizing:border-box}
  .employee-table-card table.responsive-operational-table,.asset-table-wrap table.responsive-operational-table{width:100%!important;min-width:0!important;max-width:100%!important;table-layout:auto!important}
  .responsive-operational-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .responsive-operational-table tbody tr{padding:12px;border-bottom:1px solid #e2e8f0}
  .responsive-operational-table tbody td{display:flex!important;justify-content:space-between;align-items:center;gap:12px;width:auto!important;min-width:0!important;max-width:100%!important;text-align:start!important;white-space:normal!important;padding:9px 0!important;overflow-wrap:anywhere}
  .responsive-operational-table tbody td::before{content:attr(data-column-label);color:#64748b;font-size:12px;flex:0 0 90px;text-align:start}
  .responsive-operational-table tbody td>*{min-width:0;max-width:100%}
  .employee-table-card table.responsive-operational-table tbody td,.asset-table-wrap table.responsive-operational-table tbody td{height:auto!important;min-height:44px;font-size:14px!important;direction:rtl!important}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body .topbar{position:relative!important;padding:10px 12px!important}
  body .user-tools{width:100%;justify-content:space-between!important;gap:6px!important}
  body .welcome{display:none!important}
  body .month-picker{order:10;width:100%!important;min-width:0!important;height:48px!important;margin:0!important;justify-content:space-between!important}
  body .content{padding:16px 12px!important}
  .workspace>*{min-width:0}
  .page-head,.page-header,.profile-page-head,.asset-profile>header{align-items:flex-start;flex-direction:column}
  .page-head h1,.page-header h1,.asset-profile h1{font-size:26px!important;overflow-wrap:anywhere}
  .page-actions,.top-actions,.asset-profile-actions{width:100%;display:flex;flex-wrap:wrap}
  .page-actions>*,.top-actions>*{max-width:100%}
  .form-grid,.form-grid.three,.form-grid.two,.personal-card,.payment-fields,.employee-profile-grid,.employee-profile-hero,.employee-record-grid,.profile-advances,.profile-documents,.profile-history,
  .panels,.three,.closing-grid,.reports-grid,.reports-summary,.settings-grid,.settings-manager-grid,.permission-grid,.user-form-grid,.user-permissions,.user-permission-groups,.custody-category-grid,
  .asset-profile-grid,.asset-utilities-grid,.asset-modal form,.asset-category-form,.asset-summary-grid,.asset-active-groups,.liquidity-layout,.exec-liquidity-grid,.exec-projected-cash-grid,.month-comparison-grid,
  .movement-two-fields,.movement-calculation-fields,.liquidity-dialog-fields,.app-dialog-fields{grid-template-columns:minmax(0,1fr)!important}
  .form-grid>*,.personal-card>*,.asset-modal form>*{grid-column:auto!important;min-width:0}
  .employee-filters,.payroll-toolbar,.approval-toolbar,.asset-toolbar,.users-filters,.custody-toolbar,.custody-main-filters,.custody-filter-panel,.asset-filter-bar{display:flex!important;flex-direction:column;align-items:stretch!important;gap:10px}
  .employee-filters>*,.payroll-toolbar>*,.approval-toolbar>*,.asset-toolbar>*,.users-filters>*,.custody-toolbar>*{width:100%!important;min-width:0!important;max-width:100%!important}
  input:not([type=checkbox]):not([type=radio]),select,textarea{max-width:100%;min-width:0;box-sizing:border-box;font-size:16px!important}
  button,.btn,.row-actions a,.asset-row-actions a{min-height:44px}
  .row-actions button,.asset-row-actions button,.copy-value-button,.drawer-close{min-width:44px!important;min-height:44px!important}
  .row-actions,.asset-row-actions,.settings-inline-actions,.user-row-actions{gap:8px!important;flex-wrap:wrap}
  .tabs,.exec-tabs,.employee-tabs,.profile-tabs,.settings-tabs{max-width:100%;overflow-x:auto;flex-wrap:nowrap!important;justify-content:flex-start!important}
  .tabs>*,.exec-tabs>*,.employee-tabs>*,.profile-tabs>*{flex-shrink:0;white-space:nowrap}
  .quick-drawer,.movement-drawer,.custody-drawer,.funding-drawer,.asset-drawer{width:100%!important;max-width:100vw!important;min-width:0!important;inset-inline:0!important;box-sizing:border-box;max-height:100dvh!important;overflow-y:auto!important;overscroll-behavior:contain}
  .asset-modal-overlay,.app-dialog-overlay,.approval-modal-overlay,.employee-advance-overlay,.asset-access-overlay,.close-review-backdrop,.funding-overlay{padding:10px!important;box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain}
  .asset-modal,.app-dialog,.return-modal,.employee-advance-dialog,.employee-offboarding-dialog,.close-review,.direct-expense-dialog,.liquidity-dialog,.global-employee-search-dialog,.payroll-comparison-dialog{width:100%!important;min-width:0!important;max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important;overflow-y:auto!important;box-sizing:border-box;padding:16px!important}
  .financial-explanation-dialog{width:calc(100vw - 20px)!important;min-width:0!important;max-height:calc(100dvh - 20px)!important;overflow:auto!important;box-sizing:border-box}
  .drawer-actions,.movement-action-bar,.close-review__actions,.app-dialog footer{flex-wrap:wrap;gap:10px;padding-bottom:max(12px,env(safe-area-inset-bottom))}
  .exec-progress,.execution-progress,.custody-budget{display:flex!important;flex-direction:column;align-items:stretch;gap:20px}
  .exec-progress>*{min-width:0!important;width:auto!important}
  .execution-kpis strong,.exec-kpis strong,.kpi-grid strong{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere}
  .asset-profile-actions button{flex:1 1 140px}
  .asset-history-list article,.movement-history-row{flex-wrap:wrap;overflow-wrap:anywhere}
  .copy-value{max-width:100%;overflow-wrap:anywhere}
  /* The loading panel also needs geometry before its async inline styles arrive.
     Auto width between physical edges avoids RTL scrollbar + vw overflow. */
  body .notification-panel{position:fixed!important;z-index:120!important;left:10px!important;right:10px!important;inset-inline:10px!important;top:72px!important;width:auto!important;max-width:none!important;max-height:calc(100dvh - 92px)!important;overflow-y:auto!important;box-sizing:border-box;background:#fff;border-radius:16px}
  .notification-panel__head{flex-wrap:wrap;gap:8px}
  .login-shell{display:block!important;min-height:100dvh}
  .login-form-side{width:100%!important;min-width:0!important;padding:24px 18px!important;box-sizing:border-box}
  .login-brand-side{display:none!important}
  .login-shell form{max-width:100%;width:100%}
}
@media screen and (max-width:390px){
  .kpis{grid-template-columns:minmax(0,1fr)!important}
  .kpi-grid,.employee-stats,.payroll-kpis,.approval-kpis,.execution-kpis,.exec-kpis,.closing-kpis,.custody-kpis,.asset-kpis,.close-review__metrics{grid-template-columns:minmax(0,1fr)!important}
}
@media(prefers-reduced-motion:reduce){.sidebar{transition:none!important}}
/* Never make permission-controlled or inactive UI visible through layout rules. */
[hidden]{display:none!important}