/* Phase 3 is presentation-only. All rules are scoped to the authenticated application shell. */
.app-shell{--ui-border:#d9e3ef;--ui-border-strong:#c9d7e7;--ui-focus:0 0 0 3px rgba(44,107,237,.12);--ui-shadow:0 8px 26px rgba(18,49,85,.07)}
.app-shell .main{min-width:0;max-width:calc(100vw - var(--sidebar));overflow-x:clip;background:linear-gradient(180deg,#f4f7fb 0,#edf2f8 320px)}
.app-shell .content{width:100%;max-width:1560px;padding:24px 26px 34px}
.app-shell .card{border-color:var(--ui-border);box-shadow:var(--ui-shadow)}
.app-shell .page.active{min-width:0}

/* Navigation and header alignment */
.app-shell .topbar{gap:12px;min-height:78px;padding:12px 22px;border-color:var(--ui-border);box-shadow:0 4px 18px rgba(20,48,82,.04)}
.app-shell .page-heading{min-width:210px}
.app-shell .page-heading h1{color:#102d52;font-size:21px;line-height:1.15}
.app-shell .page-heading p:last-child{line-height:1.45}
.app-shell .filters{align-items:center}
.app-shell .filters input,.app-shell .filters select{min-width:145px;height:42px;border-color:var(--ui-border-strong);background:#fff}
.app-shell .filters .btn,.app-shell .icon-btn,.app-shell .menu-btn{height:42px}
.app-shell .nav button{min-height:41px;margin:2px 0;padding:10px 12px;border-radius:10px;line-height:1.25}
.app-shell .nav button:focus-visible{outline:2px solid rgba(151,196,255,.9);outline-offset:2px}
.app-shell .nav button.active{box-shadow:0 7px 18px rgba(0,0,0,.14)}

/* Consistent page and section rhythm */
.app-shell .toolbar,.app-shell .daily-page-heading,.app-shell .loan-page-heading,.app-shell .funds-page-heading,.app-shell .funds-v2-heading,.app-shell .finance-page-head{margin-bottom:18px}
.app-shell .toolbar h2,.app-shell .daily-page-heading h2,.app-shell .loan-page-heading h2,.app-shell .funds-page-heading h2,.app-shell .funds-v2-heading h2,.app-shell .finance-page-head h2{color:#102d52;line-height:1.15}
.app-shell .toolbar p:last-child,.app-shell .daily-page-heading p:last-child,.app-shell .loan-page-heading p:last-child,.app-shell .funds-page-heading p:last-child,.app-shell .funds-v2-heading p:last-child,.app-shell .finance-page-head>p:last-child{max-width:760px;line-height:1.55}
.app-shell .section-head,.app-shell .expense-card-head,.app-shell .loan-card-head{min-height:64px;padding:16px 18px}
.app-shell .section-head h3,.app-shell .expense-card-head h3,.app-shell .loan-card-head h3{color:#173454;line-height:1.25}
.app-shell .section-head p,.app-shell .expense-card-head p,.app-shell .loan-card-head span{line-height:1.45}
.app-shell .grid{gap:14px}

/* Buttons: one size and predictable focus without changing action semantics */
.app-shell .btn{min-height:40px;padding:0 14px;border-radius:10px;line-height:1.2;white-space:nowrap}
.app-shell .btn-primary{box-shadow:0 7px 17px rgba(44,107,237,.2)}
.app-shell .btn-soft{border-color:#cbdcf2;background:#f4f8ff}
.app-shell .btn-danger{border-color:#df4a58;background:#df4a58;color:#fff}
.app-shell button:focus-visible,.app-shell a:focus-visible,.app-shell summary:focus-visible{outline:2px solid #2c6bed;outline-offset:2px}
.app-shell button:disabled,.app-shell input:disabled,.app-shell select:disabled,.app-shell textarea:disabled{cursor:not-allowed;opacity:.62}
.app-shell .form-actions,.app-shell .loan-modal-actions,.app-shell .fund-modal-actions,.app-shell .expense-modal-foot,.app-shell .supplier-modal-foot{gap:10px}

/* Forms: consistent labels, controls, spacing and validation states */
.app-shell .form-grid{gap:14px;padding:18px}
.app-shell .form-grid label,.app-shell fieldset label{line-height:1.35}
.app-shell .form-grid input,.app-shell .form-grid select,.app-shell .form-grid textarea,
.app-shell .supplier-filter-card input,.app-shell .supplier-filter-card select,
.app-shell .expense-manage-toolbar input,.app-shell .expense-manage-toolbar select,
.app-shell .loan-register-tools input,.app-shell .loan-register-tools select,
.app-shell .cash-flow-filters input,.app-shell .cash-flow-filters select{min-height:42px;border-color:var(--ui-border-strong);background:#fff}
.app-shell .form-grid textarea{min-height:72px;line-height:1.5}
.app-shell input:hover,.app-shell select:hover,.app-shell textarea:hover{border-color:#afc2d9}
.app-shell input:focus,.app-shell select:focus,.app-shell textarea:focus{border-color:#6f9fee!important;box-shadow:var(--ui-focus)!important;outline:0}
.app-shell input:user-invalid,.app-shell select:user-invalid,.app-shell textarea:user-invalid{border-color:#df6672}
.app-shell input[readonly],.app-shell textarea[readonly]{background:#f3f6fa;color:#627188}
.app-shell label.check{min-height:42px;padding:10px 11px;border:1px solid var(--ui-border);border-radius:10px;background:#f8fafc}
.app-shell label.check input{accent-color:#2c6bed}
.app-shell .form-actions{padding:0 18px 18px}
.app-shell .note{border-radius:10px;line-height:1.55}

/* Tables: clean scanning, fixed headers and readable actions */
.app-shell .table-card,.app-shell .expense-register-card,.app-shell .supplier-list-card,.app-shell .loan-register-card,.app-shell .loan-history-card{border-color:var(--ui-border)}
.app-shell .table-wrap{max-width:100%;scrollbar-color:#b8c7d9 #f2f5f9;scrollbar-width:thin}
.app-shell .table-wrap::-webkit-scrollbar{width:9px;height:9px}.app-shell .table-wrap::-webkit-scrollbar-track{background:#f2f5f9}.app-shell .table-wrap::-webkit-scrollbar-thumb{border:2px solid #f2f5f9;border-radius:999px;background:#b8c7d9}
.app-shell .table-wrap>table>thead th{position:sticky;top:0;z-index:2;border-bottom-color:#d6e1ed;background:#f3f6fa;color:#53657d}
.app-shell table tbody tr:nth-child(even)>td{background:#fbfcfe}
.app-shell table tbody tr:hover>td{background:#f4f8fd}
.app-shell table td{height:44px;vertical-align:middle}
.app-shell table td.money,.app-shell table th.money{font-variant-numeric:tabular-nums}
.app-shell .table-sub,.app-shell .table-secondary,.app-shell .table-subline,.app-shell .supplier-row-meta{line-height:1.35}
.app-shell .table-wrap.has-sticky-actions tbody tr:nth-child(even)>td:last-child{background:#fbfcfe}
.app-shell .table-wrap.has-sticky-actions tbody tr:hover>td:last-child{background:#f4f8fd}
.app-shell .table-wrap.has-sticky-actions th:last-child{z-index:4;background:#eef3f8}
.app-shell .supplier-actions,.app-shell .expense-row-actions,.app-shell .daily-row-actions,.app-shell .loan-row-actions,.app-shell .fund-row-actions,.app-shell .fund-receipt-actions{align-items:center;gap:6px}
.app-shell .empty{line-height:1.55;white-space:normal}

/* Status and alert consistency */
.app-shell .status{align-items:center;justify-content:center;min-height:24px;padding:5px 9px;line-height:1.1;letter-spacing:.2px}
.app-shell .alert{position:relative;padding:13px 16px;border-radius:11px;box-shadow:0 5px 14px rgba(22,48,79,.04);font-size:10px}
.app-shell .alert strong{display:block}
.app-shell .alert ul{display:grid;gap:3px}

/* Dialogs: consistent viewport fit, headers and action bars */
.app-shell dialog{overscroll-behavior:contain}
.app-shell dialog::backdrop{background:rgba(7,24,47,.6)}
.app-shell .supplier-modal,.app-shell .expense-modal,.app-shell .loan-dialog,.app-shell .fund-premium-dialog,.app-shell .productivity-dialog,.app-shell .cash-adjust-dialog{max-height:calc(100dvh - 28px)}
.app-shell .supplier-modal-card,.app-shell .expense-modal-card,.app-shell .loan-dialog-form,.app-shell .fund-premium-form,.app-shell .cash-adjust-form{max-height:calc(100dvh - 28px)}
.app-shell .supplier-modal-head,.app-shell .expense-modal-head,.app-shell .loan-modal-head,.app-shell .fund-modal-head,.app-shell .productivity-dialog-head,.app-shell .cash-adjust-head{flex:0 0 auto}
.app-shell .supplier-modal-body,.app-shell .expense-modal-body,.app-shell .loan-modal-body,.app-shell .fund-modal-body,.app-shell .cash-adjust-body{scrollbar-color:#bac9da #f5f7fa;scrollbar-width:thin}
.app-shell .supplier-modal-foot,.app-shell .expense-modal-foot,.app-shell .loan-modal-actions,.app-shell .fund-modal-actions,.app-shell .cash-adjust-actions{flex:0 0 auto;min-height:66px}

/* Responsive cleanup without altering content or workflow */
@media(max-width:1450px){
  .app-shell .topbar{flex-wrap:wrap}.app-shell .page-heading{flex:1}.app-shell .live-payment-balances{order:3}.app-shell .filters{order:4;margin-left:auto}
  .app-shell .dashboard-quick-actions{flex-wrap:wrap}.app-shell .dashboard-quick-actions>div{width:100%;flex-basis:100%}
  .app-shell .content{padding:20px}.app-shell .toolbar{align-items:flex-start}.app-shell .report-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:980px){.app-shell .main{max-width:100vw}}
@media(max-width:820px){
  .app-shell .content{padding:16px}.app-shell .topbar{padding:10px 14px}.app-shell .page-heading p:last-child{display:none}
  .app-shell .filters{width:100%;margin:0}.app-shell .filters input,.app-shell .filters select{min-width:0;flex:1}.app-shell .filters .btn{flex:0 0 auto}
  .app-shell .toolbar,.app-shell .daily-page-heading,.app-shell .loan-page-heading,.app-shell .funds-page-heading,.app-shell .funds-v2-heading{align-items:flex-start;flex-direction:column}
  .app-shell .toolbar>div:last-child,.app-shell .daily-heading-actions,.app-shell .loan-heading-actions,.app-shell .funds-v2-heading-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}
  .app-shell .report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  .app-shell .content{padding:13px 11px 24px}.app-shell .topbar{gap:9px}.app-shell .page-heading{min-width:0}.app-shell .page-heading h1{font-size:17px}.app-shell .page-heading .eyebrow{font-size:8px}
  .app-shell .filters{grid-template-columns:1fr 1fr auto}.app-shell .filters input,.app-shell .filters select{width:100%}
  .app-shell .form-grid{grid-template-columns:1fr!important;padding:15px}.app-shell .form-grid .span-2{grid-column:auto!important}.app-shell .form-actions{display:grid;grid-template-columns:1fr;padding:0 15px 15px}.app-shell .form-actions .btn{width:100%}
  .app-shell .section-head,.app-shell .expense-card-head,.app-shell .loan-card-head{align-items:flex-start;flex-direction:column;min-height:0;padding:14px 15px}
  .app-shell .supplier-modal-foot,.app-shell .expense-modal-foot,.app-shell .loan-modal-actions,.app-shell .fund-modal-actions,.app-shell .cash-adjust-actions{align-items:stretch;flex-wrap:wrap;padding:13px 15px}.app-shell .supplier-modal-foot .btn,.app-shell .expense-modal-foot .btn,.app-shell .loan-modal-actions .btn,.app-shell .fund-modal-actions .btn,.app-shell .cash-adjust-actions .btn{flex:1;min-width:110px}
  .app-shell .report-grid{grid-template-columns:1fr}.app-shell table td{height:42px}.app-shell .global-search-trigger{min-width:42px;padding:8px}
}