/* Shared ERP-style layout. All assets and charts remain local. */
html[data-theme]{--ui-accent:#008f70;--ui-accent-dark:#007158;--ui-ink:#273342;--ui-muted:#6c7887;--ui-border:#dde4e9;--ui-soft:#f6f8fa;--ui-side:#f8fafb;--ui-active:#e4f3ed;--ui-active-ink:#087455;--chart-bar:#009b7a;--chart-bar-light:#bde7d9;--chart-line:#e59628;--collection-color:#009b7a;--collection-track:#e8edf1}
html[data-theme] body{color:var(--ui-ink);background:#fff}
.app-shell .sidebar{width:218px;background:var(--ui-side);border-left:1px solid var(--ui-border);padding:20px 14px;color:var(--ui-ink);box-shadow:none}
.app-shell .sidebar-heading{min-height:48px;margin-bottom:23px;padding:0 6px;flex-shrink:0}
.app-shell .sidebar-heading .brand{gap:10px;color:var(--ui-ink);min-width:0}
.app-shell .sidebar .company-name{font-size:18px;font-weight:700;line-height:1.6}
.app-shell .sidebar .brand-mark,.app-shell .mobile-brand .brand-mark{background:var(--ui-accent);border:0;border-radius:10px;color:#fff;width:34px;height:34px;font-size:20px;flex-shrink:0}
.app-shell .sidebar .nav{padding:0 1px 10px;scrollbar-color:#b8c5c0 transparent}
.app-shell .sidebar .nav a{position:relative;display:flex;align-items:center;gap:11px;border:0;margin:4px 0;min-height:41px;padding:10px 12px;border-radius:7px;font-size:13px;color:var(--ui-muted);transition:background .18s ease,color .18s ease}
.app-shell .sidebar .nav a i{display:grid;place-items:center;flex:0 0 20px;width:20px;color:inherit;font-style:normal}
.app-shell .sidebar .nav a.active,.app-shell .sidebar .nav a:hover{background:var(--ui-active);color:var(--ui-active-ink);box-shadow:none;border:0}
.app-shell .sidebar .nav a.active{font-weight:700}
.app-shell .sidebar .nav a.active i{color:inherit}
.app-shell .sidebar .nav a.active:after{content:'';position:absolute;right:0;top:11px;bottom:11px;width:3px;border-radius:3px;background:var(--ui-accent)}
.app-shell .main{margin-right:218px;min-width:0;background:#fff}
.app-shell .topbar{height:66px;padding:0 28px;border-bottom:1px solid var(--ui-border);background:#fff;gap:16px}
.app-shell .topbar-date{display:flex;align-items:center;gap:9px;color:var(--ui-muted)}
.app-shell .topbar-date svg{width:17px;height:17px;color:var(--ui-accent)}
.app-shell .topbar-date p{font-size:11px;color:var(--ui-muted)}
.app-shell .account-bar{border:0;background:transparent;padding:0;gap:10px;box-shadow:none;border-radius:0}
.app-shell .account-bar>.profile-avatar{width:34px;height:34px;flex-basis:34px;border:1px solid var(--ui-border)}
.app-shell .account-bar>.profile-avatar img{width:100%;height:100%}
.app-shell .account-details b{font-size:12px;line-height:1.5}
.app-shell .account-details small{font-size:10px;color:var(--ui-muted);margin-top:2px}
.app-shell .account-logout{border:1px solid var(--ui-border);border-radius:7px;background:#fff;color:var(--ui-muted);width:34px;height:34px;padding:7px;margin-right:8px}
.app-shell .account-logout span{display:none}
.app-shell .account-logout:hover{color:#b44a4a;border-color:#d8a6a6;background:#fff7f7}
.app-shell .content{padding:24px 28px 12px;max-width:1600px;margin:0 auto}
.app-shell .heading{margin-bottom:18px;gap:14px;align-items:center}
.app-shell .heading h1{font-size:21px;font-weight:700;margin:0 0 5px;line-height:1.7;letter-spacing:0}
.app-shell .heading>.muted,.app-shell .heading .muted{font-size:11px;color:var(--ui-muted)}
.app-shell .primary{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:36px;min-height:36px;padding:7px 13px;background:var(--ui-accent);border:1px solid var(--ui-accent);border-radius:7px;color:#fff;font-size:12px;font-weight:600;line-height:1.5;box-shadow:0 2px 4px #14241b09;white-space:nowrap;transition:background .18s ease,box-shadow .18s ease}
.app-shell .primary:hover{background:var(--ui-accent-dark);border-color:var(--ui-accent-dark);box-shadow:0 3px 8px #14241b15}
.app-shell .secondary{border-radius:7px;border-color:var(--ui-border);background:#fff;color:var(--ui-muted)}
.app-shell button:focus-visible,.app-shell a:focus-visible{outline:2px solid var(--ui-accent);outline-offset:3px}
.app-shell .panel{border:1px solid var(--ui-border);border-radius:10px;box-shadow:0 2px 7px #23344604;background:#fff;margin-bottom:18px;overflow:hidden;min-width:0}
.app-shell .panel-head{padding:15px 18px;min-height:54px;background:#fff;border-bottom:1px solid var(--ui-border);gap:12px;align-items:center}
.app-shell .panel-head h2{font-size:14px;font-weight:700;color:var(--ui-ink);margin:0;line-height:1.7}
.app-shell .panel-head .muted{display:block;margin-top:2px;font-size:10px;color:var(--ui-muted)}
.app-shell .panel-body{padding:18px;background:#fff}
.app-shell .filter-panel{box-shadow:none;border-radius:8px;margin-bottom:18px;background:var(--ui-soft)}
.app-shell .filter-panel .filters{padding:10px 14px;background:var(--ui-soft);gap:12px}
.app-shell .filters label{font-size:10px;color:var(--ui-muted)}
.app-shell .filters input,.app-shell .filters .search-select-input{height:33px;border-radius:6px;font-size:12px;background:#fff}
.app-shell .global-reset-icon{width:33px;height:33px;min-height:33px;padding:6px;background:#fff;color:var(--ui-muted)}
.app-shell input,.app-shell select,.app-shell textarea{border-radius:7px;border-color:var(--ui-border);box-shadow:none}
.app-shell input:focus,.app-shell select:focus,.app-shell textarea:focus{border-color:var(--ui-accent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--ui-accent) 10%,transparent);outline:0}
.app-shell .stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 14px}
.app-shell .stat{--card-color:#e56d1a;--card-tint:#fff2e9;position:relative;padding:18px 14px 14px;min-height:156px;border:1px solid var(--ui-border);border-radius:9px;background:linear-gradient(150deg,var(--card-tint) 0%,#fff 65%);box-shadow:0 2px 5px #23344604;text-align:center;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.app-shell .stat:nth-child(2){--card-color:#8135b8;--card-tint:#f3eafa}
.app-shell .stat:nth-child(3){--card-color:#008c68;--card-tint:#e8f5ef}
.app-shell .stat:nth-child(4){--card-color:#c17b0c;--card-tint:#fff5e4}
.app-shell .stat:nth-child(5){--card-color:#c02ba0;--card-tint:#fbeaf5}
.app-shell .stat:nth-child(6){--card-color:#317db5;--card-tint:#eaf3fb}






.app-shell .stat:before{position:absolute;right:16px;left:16px;bottom:0;top:auto;width:auto;height:3px;border-radius:3px 3px 0 0;background:var(--card-color);opacity:.65;transform:none}
.app-shell .stat .icon{display:grid;place-items:center;width:34px;height:34px;margin:0 auto 8px;border-radius:50%;background:var(--card-color);color:#fff;box-shadow:0 3px 8px color-mix(in srgb,var(--card-color) 16%,transparent);transition:transform .2s ease}
.app-shell .stat .icon svg{width:19px;height:19px}
.app-shell .stat .muted{font-size:11px;font-weight:500;line-height:1.7;color:var(--ui-muted)}
.app-shell .stat b{color:var(--ui-ink);font-size:clamp(16px,calc(31px - var(--stat-digits,8)*.55px),25px);font-weight:750;line-height:1.6;min-height:36px;margin:5px 0}
.app-shell .stat small{font-size:10px;color:var(--ui-muted);line-height:1.7}
@media(hover:hover){.app-shell .stat:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--card-color) 45%,#fff);box-shadow:0 8px 20px #2334460b}.app-shell .stat:hover .icon{transform:scale(1.08)}}
.app-shell .dashboard-analysis{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(290px,1fr);gap:18px;align-items:start}
.app-shell .dashboard-analysis>.panel{margin-bottom:0}
.app-shell .dashboard-analysis.advisor-dashboard{grid-template-columns:1fr}
.app-shell .panel-count,.app-shell .chart-unit{font-size:10px;color:var(--ui-muted);background:var(--ui-soft);border:1px solid var(--ui-border);padding:4px 8px;border-radius:5px;white-space:nowrap}
.app-shell .trend-panel .panel-body{padding:14px 18px 12px}
.app-shell .chart-legend{display:flex;gap:20px;align-items:center;font-size:10px;color:var(--ui-muted);margin:0 0 12px;flex-wrap:wrap}
.app-shell .chart-legend>span{display:flex;align-items:center;gap:6px}
.app-shell .chart-legend i{display:block;width:8px;height:8px;border-radius:3px}
.app-shell .legend-sales{background:var(--chart-bar)}
.app-shell .legend-received{background:var(--chart-line);border-radius:50%!important}
.app-shell .sales-trend-chart{width:100%;height:auto;display:block;overflow:visible;direction:ltr;aspect-ratio:720/260}
.app-shell .bar-gradient-top{stop-color:var(--chart-bar)}
.app-shell .bar-gradient-bottom{stop-color:var(--chart-bar-light)}
.app-shell .chart-grid-line{stroke:var(--ui-border);stroke-width:1;stroke-dasharray:3 5}
.app-shell .chart-axis-label{fill:var(--ui-muted);font-size:12px;font-family:inherit}
.app-shell .chart-receipt-line{stroke:var(--chart-line);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.app-shell .chart-receipt-dot{fill:#fff;stroke:var(--chart-line);stroke-width:2;pointer-events:none}
.app-shell .chart-data-point{outline:none}
.app-shell .chart-data-point:hover .chart-bar,.app-shell .chart-data-point:focus .chart-bar{fill:var(--chart-bar);filter:drop-shadow(0 2px 3px #23344618)}
.app-shell .trend-period{display:flex;justify-content:space-between;margin-right:11%;padding:4px 0 0;font-size:10px;color:var(--ui-muted)}
.app-shell .chart-empty{min-height:240px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:var(--ui-muted);text-align:center}
.app-shell .chart-empty>svg{width:42px;height:42px;color:var(--ui-accent)}
.app-shell .chart-empty b{font-size:13px}.app-shell .chart-empty span{font-size:11px}
.app-shell .performance-panel .panel-body{padding:6px 16px;max-height:342px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--ui-border) transparent}
.app-shell .performance-panel .bar-row{display:grid;grid-template-columns:minmax(90px,1.25fr) minmax(32px,.75fr) minmax(65px,auto);gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--ui-border);margin:0}
.app-shell .performance-panel .bar-row:last-child{border-bottom:0}
.app-shell .performance-advisor{gap:7px;min-width:0}
.app-shell .performance-advisor .profile-avatar{width:29px;height:29px;flex:0 0 29px}
.app-shell .performance-advisor-name{font-size:11px;color:var(--ui-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app-shell .bar-track{height:6px;border-radius:5px;background:var(--collection-track);overflow:hidden}
.app-shell .bar-fill{height:100%;background:var(--ui-accent);border-radius:5px}
.app-shell .bar-row:nth-child(3n+2) .bar-fill{background:#8a5ab7}.app-shell .bar-row:nth-child(3n+3) .bar-fill{background:#e18c36}

.app-shell .performance-panel .bar-row>small{font-size:10px;color:var(--ui-ink);font-variant-numeric:tabular-nums;text-align:left;white-space:nowrap}
.app-shell .collection-panel{grid-column:1/-1}
.app-shell .collection-body{display:flex;gap:32px;align-items:center;padding:20px 24px}
.app-shell .collection-ring{width:120px;height:120px;flex:0 0 120px;border-radius:50%;background:conic-gradient(var(--collection-color) var(--collection-percent),var(--collection-track) 0);display:grid;place-items:center;transform:rotate(0deg)}
.app-shell .collection-ring>div{width:94px;height:94px;border-radius:50%;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.app-shell .collection-ring b{font-size:25px;line-height:1.5;color:var(--ui-ink)}.app-shell .collection-ring span{font-size:10px;color:var(--ui-muted)}
.app-shell .collection-summary{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;min-width:0}
.app-shell .collection-summary .summary-line{display:flex;flex-direction:column;gap:8px;align-items:flex-start;justify-content:center;border:0;padding:0 16px;border-right:1px solid var(--ui-border);min-width:0}
.app-shell .summary-line>span{display:flex;align-items:center;gap:6px;color:var(--ui-muted);font-size:11px}
.app-shell .summary-line>b{font-size:clamp(14px,1.35vw,22px);color:var(--ui-ink);line-height:1.8;overflow-wrap:anywhere}
.app-shell .summary-line small{font-size:10px;font-weight:400;color:var(--ui-muted)}
.app-shell .summary-dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex:0 0 7px}
.app-shell .received-dot{background:var(--collection-color)}.app-shell .balance-dot{background:#e59628}.app-shell .students-dot{background:#8755b8}
.app-shell .table-controls{background:var(--ui-soft);border-color:var(--ui-border);padding:10px 16px}
.app-shell .table-wrap table th{background:var(--ui-soft);color:var(--ui-muted);font-weight:600;border-color:var(--ui-border);padding:10px 12px;font-size:11px;vertical-align:middle}
.app-shell .table-wrap table td{padding:8px 12px;border-color:var(--ui-border);font-size:12px;color:var(--ui-ink);text-align:center!important}
.app-shell .table-wrap table tbody tr:nth-child(odd){background:#fff}.app-shell .table-wrap table tbody tr:nth-child(even){background:rgb(242,242,242)}
.app-shell .table-wrap table tbody tr:hover{background:var(--ui-active)}
.app-shell .column-button{color:var(--ui-muted)}.app-shell .column-button.is-filtered{color:var(--ui-accent)}
.app-shell .column-button span{color:var(--ui-muted)}
.app-shell .table-pagination{background:#fff;border-color:var(--ui-border);padding:12px 16px}
.app-shell .page-button{border-color:var(--ui-border);background:#fff;color:var(--ui-muted);border-radius:5px}
.app-shell .page-button.current{background:var(--ui-accent);border-color:var(--ui-accent);color:#fff}
.app-shell .page-button:hover:not(.current):not(.disabled){background:var(--ui-active);color:var(--ui-active-ink)}
.app-shell .edit,.app-shell .eye-button{background:var(--ui-active);color:var(--ui-accent);border:1px solid color-mix(in srgb,var(--ui-accent) 22%,#fff);border-radius:6px;font-size:11px;padding:5px 8px}
.app-shell .pill{font-size:10px;padding:3px 8px;border-radius:5px;line-height:1.7}
.app-shell .pill.paid{background:#e5f5eb;color:#168350;border:1px solid #c2e7d1}
.app-shell .pill.followup{background:#fff3dc;color:#9b6a0a;border:1px solid #f1dbac}
.app-shell .modal{border:1px solid var(--ui-border);border-radius:12px;box-shadow:0 18px 65px #1f293732;background:#fff}
.app-shell .modal-header{background:var(--ui-soft);border-color:var(--ui-border);padding:16px 20px}
.app-shell .modal-header h2{font-size:16px}.app-shell .modal form{padding:20px}
.app-shell .modal .primary{width:auto;min-width:130px;margin-top:18px}
.app-shell .close{background:#fff;border:1px solid var(--ui-border);color:var(--ui-muted);border-radius:6px}
.app-shell .column-menu{border-color:var(--ui-border);border-radius:9px;box-shadow:0 10px 35px #2334461a}
.app-shell .column-icon{background:var(--ui-soft);border-color:var(--ui-border);color:var(--ui-muted)}
.app-shell .column-icon:hover,.app-shell .column-icon[aria-pressed=true]{background:var(--ui-active);color:var(--ui-accent);border-color:var(--ui-accent)}
.app-shell .column-options input{accent-color:var(--ui-accent)}
.app-shell .theme-choice{border-color:var(--ui-border);border-radius:8px}.app-shell .theme-name{color:var(--ui-muted)}
.app-shell .company-preview{background:var(--ui-soft);border-color:var(--ui-border)}
.app-shell .font-preview{background:var(--ui-soft);border-color:var(--ui-border)}
.app-shell .footer{margin-top:22px;font-size:10px;color:var(--ui-muted);padding-top:12px;border-top:1px solid var(--ui-border)}
html[data-theme] .login-card{border-color:var(--ui-border);border-radius:14px;box-shadow:0 12px 40px #2433440c}
html[data-theme] .login-card .primary,html[data-theme] .login-card .brand-mark{background:var(--ui-accent)}
html[data-theme] .login-card input:focus{border-color:var(--ui-accent)!important}
@media(min-width:1440px){.app-shell .stats{grid-template-columns:repeat(6,minmax(0,1fr))}.app-shell .stat{padding:16px 10px 13px;min-height:165px}.app-shell .stat .muted{font-size:10px}}
@media(max-width:1100px){.app-shell .sidebar{width:198px;padding:18px 11px}.app-shell .main{margin-right:198px}.app-shell .content{padding:20px}.app-shell .topbar{padding:0 20px}.app-shell .dashboard-analysis{grid-template-columns:1fr}.app-shell .collection-panel{grid-column:auto}.app-shell .performance-panel .panel-body{max-height:300px}.app-shell .collection-body{gap:20px}.app-shell .collection-summary{gap:10px}.app-shell .collection-summary .summary-line{padding:0 10px}}
@media(max-width:760px){.app-shell .sidebar{width:min(288px,86vw);padding:20px 14px;background:var(--ui-side)}.app-shell .main{margin:0}.app-shell .mobile-menu-bar{background:#fff;color:var(--ui-ink);border-color:var(--ui-border);height:58px;padding:10px 14px}.app-shell #menu-toggle,.app-shell .menu-close{border-color:var(--ui-border);background:var(--ui-soft);color:var(--ui-ink)}.app-shell .sidebar .nav a{min-height:45px;font-size:13px;padding:11px 13px}.app-shell .topbar{height:58px;padding:0 14px;gap:8px}.app-shell .topbar-date{gap:5px}.app-shell .topbar-date p{font-size:9px}.app-shell .topbar-date svg{display:none}.app-shell .account-bar{gap:7px}.app-shell .account-bar>.profile-avatar{width:29px;height:29px;flex-basis:29px}.app-shell .account-details b{font-size:10px}.app-shell .account-details small{font-size:9px}.app-shell .account-logout{width:29px;height:29px;margin-right:2px;padding:5px}.app-shell .content{padding:18px 12px 10px}.app-shell .heading{gap:10px;margin-bottom:14px}.app-shell .heading h1{font-size:18px}.app-shell .heading .muted{font-size:10px}.app-shell .heading .primary{font-size:11px;height:35px;padding:6px 10px}.app-shell .panel-head{padding:13px 14px}.app-shell .panel-body{padding:14px}.app-shell .filter-panel .filters{gap:8px;padding:10px}.app-shell .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.app-shell .stat{padding:14px 9px 12px;min-height:150px}.app-shell .stat b{font-size:clamp(14px,calc(28px - var(--stat-digits,8)*.7px),22px)}.app-shell .stat .muted{font-size:10px}.app-shell .stat small{font-size:9px}.app-shell .dashboard-analysis{gap:14px}.app-shell .trend-panel .panel-body{padding:12px 8px}.app-shell .chart-legend{gap:12px;font-size:9px;padding:0 5px}.app-shell .chart-axis-label{font-size:20px}.app-shell .chart-date-label{font-size:18px}.app-shell .chart-data-point:nth-of-type(even) .chart-date-label{display:none}.app-shell .chart-receipt-line{stroke-width:3}.app-shell .trend-period{font-size:9px;padding-left:12px}.app-shell .collection-body{gap:16px;align-items:center;padding:16px 14px}.app-shell .collection-ring{width:92px;height:92px;flex-basis:92px}.app-shell .collection-ring>div{width:72px;height:72px}.app-shell .collection-ring b{font-size:20px}.app-shell .collection-summary{grid-template-columns:1fr;gap:10px}.app-shell .collection-summary .summary-line{gap:2px;padding-right:12px}.app-shell .summary-line>span{font-size:10px}.app-shell .summary-line>b{font-size:14px}.app-shell .collection-ring span{font-size:9px}.app-shell .table-wrap table td{padding:8px 10px;font-size:11px}.app-shell .table-wrap table th{padding:9px 10px;font-size:10px}.app-shell .performance-panel .bar-row{grid-template-columns:minmax(100px,1.2fr) minmax(40px,.8fr) minmax(75px,auto)}.app-shell .footer{font-size:9px;gap:10px}.app-shell .modal{max-width:calc(100vw - 24px)}.app-shell .modal form{padding:16px}}
@media(prefers-reduced-motion:reduce){.app-shell .stat,.app-shell .stat .icon,.app-shell .primary,.app-shell .sidebar .nav a{transition:none}.app-shell .stat:hover{transform:none}}
@media print{.app-shell .main{margin:0}.app-shell .content{max-width:none;padding:0}.app-shell .panel{box-shadow:none}.app-shell .table-wrap table th,.app-shell .table-wrap table tbody tr:hover{background:#fff}.app-shell .invoice-paper{box-shadow:none;border:0}}

html[data-theme] .persian-calendar{border-color:var(--ui-border);border-radius:9px;box-shadow:0 10px 30px #23344618}
html[data-theme] .calendar-header button,html[data-theme] .calendar-footer button{background:var(--ui-active);color:var(--ui-accent)}
html[data-theme] .calendar-grid button:hover{background:var(--ui-active)}
html[data-theme] .calendar-grid button.today{box-shadow:inset 0 0 0 1px var(--ui-accent)}
html[data-theme] .calendar-grid button.selected{background:var(--ui-accent);color:#fff}
html[data-theme] .search-select-options{background:#fff;color:var(--ui-ink);border-color:var(--ui-border);box-shadow:0 8px 24px #23344614}
html[data-theme] .search-select-options [role=option]:hover,html[data-theme] .search-select-options .highlighted{background:var(--ui-active)}
html[data-theme] .search-select-options [aria-selected=true]{color:var(--ui-accent)}
html[data-theme] .filter-dot{background:var(--ui-active);color:var(--ui-active-ink)}
html[data-theme] .file-picker-button{background:var(--ui-soft);border-color:var(--ui-border);color:var(--ui-ink)}

/* Navy and white appearance uses the existing second-theme preference. */
html[data-theme=blush] .app-shell .sidebar{background:linear-gradient(180deg,#172c49,#102139);border-color:#304b70;color:#fff}
html[data-theme=blush] .app-shell .sidebar-heading .brand{color:#fff}
html[data-theme=blush] .app-shell .sidebar .brand-mark{background:#fff;color:#172c49}
html[data-theme=blush] .app-shell .sidebar .nav a{color:#c9d5e6}
html[data-theme=blush] .app-shell .sidebar .nav a.active,html[data-theme=blush] .app-shell .sidebar .nav a:hover{background:#2b466b;color:#fff}
html[data-theme=blush] .app-shell .sidebar .nav a.active:after{background:#fff}
html[data-theme=blush] .app-shell .sidebar .nav{scrollbar-color:#5a7598 transparent}
html[data-theme=blush] .app-shell .menu-close{background:#2b466b;border-color:#5a7598;color:#fff}
/* Fixed square dimensions prevent avatar distortion and preserve the original image. */
.app-shell .performance-panel .performance-advisor{width:100%;max-width:none;min-width:0;flex-basis:auto;gap:9px}
.app-shell .performance-panel .performance-advisor .profile-avatar{display:inline-flex;width:36px;height:36px;min-width:36px;max-width:36px;min-height:36px;max-height:36px;flex:0 0 36px;aspect-ratio:1;border-radius:50%;overflow:hidden;box-sizing:border-box;border:1px solid var(--ui-border);padding:0;opacity:1;filter:none;transform:none}
.app-shell .performance-panel .performance-advisor .profile-avatar img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;border-radius:50%;padding:0;opacity:1;filter:none;transform:none;image-rendering:auto}
.app-shell .performance-panel .performance-advisor .profile-avatar svg{width:24px;height:24px;flex:none}
/* Both dashboard panels share a fixed height; advisor rows scroll within their panel. */
.app-shell .dashboard-analysis{align-items:stretch}
.app-shell .dashboard-analysis>.trend-panel,.app-shell .dashboard-analysis>.performance-panel{height:390px;display:flex;flex-direction:column}
.app-shell .trend-panel .panel-head,.app-shell .performance-panel .panel-head{flex:none;min-height:72px}
.app-shell .trend-panel .panel-body{flex:1;min-height:0;display:flex;flex-direction:column}
.app-shell .trend-panel .sales-trend-chart{flex:1;min-height:0;max-height:260px}
.app-shell .performance-panel .panel-body{flex:1;min-height:0;max-height:none;overflow-y:auto}
.app-shell .trend-panel .chart-empty{flex:1;min-height:0}
.app-shell .chart-month-label{font-size:12px}
@media(max-width:760px){.app-shell .dashboard-analysis>.trend-panel,.app-shell .dashboard-analysis>.performance-panel{height:350px}.app-shell .chart-month-label{font-size:19px}.app-shell .chart-data-point:nth-of-type(even) .chart-date-label{display:block}.app-shell .performance-panel .bar-row{grid-template-columns:minmax(130px,1.6fr) minmax(25px,.5fr) minmax(70px,auto);gap:7px}}
@media print{html[data-theme=blush] .app-shell .sidebar{display:none!important}}

.app-shell .trend-chart-view[hidden]{display:none!important}
.app-shell .trend-mode-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:31px;padding:5px 9px;font-size:10px;white-space:nowrap;cursor:pointer}
.app-shell .trend-mode-toggle:hover{background:var(--ui-active);color:var(--ui-accent)}
.app-shell .trend-chart-view .chart-legend{justify-content:space-between;margin-bottom:7px}
.app-shell .trend-basis-note{font-size:9px;color:var(--ui-muted);margin:6px 0 0;text-align:center}
.app-shell .chart-day-label{font-size:12px}
@media(max-width:760px){.app-shell .trend-panel .panel-head{padding:12px 10px;gap:7px}.app-shell .trend-panel .panel-head h2{font-size:12px}.app-shell .trend-panel .panel-head .muted{font-size:8px}.app-shell .trend-mode-toggle{padding:5px 7px;font-size:9px}.app-shell .chart-day-label{font-size:19px}.app-shell [data-chart-view=daily] .chart-data-point:nth-of-type(even) .chart-day-label{display:none}}

/* Navy variation is limited to navigation, table headings and hover states. */
html[data-theme=blush] .app-shell .table-wrap table th{background:#172c49;color:#fff;border-color:#304b70}
html[data-theme=blush] .app-shell .table-wrap table th .column-button,html[data-theme=blush] .app-shell .table-wrap table th .column-button span{color:#fff}
html[data-theme=blush] .app-shell .table-wrap table th .column-button.is-filtered{color:#b6eedb}
html[data-theme=blush] .app-shell .table-wrap table tbody tr:hover{background:#e4ecf6}
html[data-theme=blush] .app-shell .primary:hover{background:#254d7d;border-color:#254d7d;color:#fff}
html[data-theme=blush] .app-shell .secondary:hover,html[data-theme=blush] .app-shell .edit:hover,html[data-theme=blush] .app-shell .eye-button:hover,html[data-theme=blush] .app-shell .column-icon:hover,html[data-theme=blush] .app-shell .page-button:hover:not(.disabled):not(.current){background:#e4ecf6;color:#254d7d;border-color:#8fa8c5}
html[data-theme=blush] .search-select-options [role=option]:hover,html[data-theme=blush] .search-select-options .highlighted,html[data-theme=blush] .calendar-grid button:hover{background:#e4ecf6;color:#254d7d}
@media print{html[data-theme=blush] .app-shell .table-wrap table th,html[data-theme=blush] .app-shell .table-wrap table th .column-button,html[data-theme=blush] .app-shell .table-wrap table th .column-button span{background:#fff;color:#111;border-color:#aaa}}

/* Consistent compact icon actions in all record and document tables. */
.app-shell .table-wrap .table-action-icon{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;width:30px;height:30px;min-width:30px;min-height:30px;padding:5px;line-height:1;border-radius:6px;flex:none;cursor:pointer}
.app-shell .table-action-icon svg{display:block;width:18px;height:18px;flex:none;pointer-events:none}
.app-shell .table-action-icon.delete-button{border:1px solid #e8bfc3;background:#fff0f0;color:#b84956}
.app-shell .table-action-icon.delete-button:hover:not(:disabled){background:#ffe2e5;border-color:#c96b75;color:#9e3240}
.app-shell .table-action-icon:disabled{cursor:default;opacity:.4}
html[data-theme=default] .app-shell .table-wrap table th{background:#087654;color:#fff;border-color:#146447}
html[data-theme=default] .app-shell .table-wrap table th .column-button,html[data-theme=default] .app-shell .table-wrap table th .column-button span{color:#fff}
html[data-theme=default] .app-shell .table-wrap table th .column-button.is-filtered{color:#fff0b4}
@media print{html[data-theme=default] .app-shell .table-wrap table th,html[data-theme=default] .app-shell .table-wrap table th .column-button,html[data-theme=default] .app-shell .table-wrap table th .column-button span{background:#fff;color:#111;border-color:#aaa}}

/* Shared Odoo-purple action buttons, independent of navigation themes. */
html[data-theme] {--button-accent:#714b67;--button-hover:#5b3c53;--button-soft:#f2ecf0}
html[data-theme] .app-shell .primary,html[data-theme] .login-card .primary{background:var(--button-accent);border-color:var(--button-accent);color:#fff}
html[data-theme] .app-shell .primary:hover,html[data-theme] .login-card .primary:hover{background:var(--button-hover);border-color:var(--button-hover)}
html[data-theme] .app-shell .edit,html[data-theme] .app-shell .eye-button,html[data-theme] .app-shell .column-icon[aria-pressed=true]{background:var(--button-soft);color:var(--button-accent);border-color:#d4bfce}
html[data-theme] .app-shell .secondary:hover,html[data-theme] .app-shell .edit:hover,html[data-theme] .app-shell .eye-button:hover,html[data-theme] .app-shell .column-icon:hover,html[data-theme] .app-shell .page-button:hover:not(.disabled):not(.current){background:var(--button-soft);color:var(--button-hover);border-color:var(--button-accent)}
.app-shell .receipt-form-heading .delete-button svg{width:16px;height:16px;vertical-align:middle}

/* Full-width sales timeline and a second row for advisor analysis. */
.app-shell .dashboard-analysis{grid-template-columns:repeat(2,minmax(0,1fr))}
.app-shell .dashboard-analysis>.trend-panel{grid-column:1/-1;height:430px}
.app-shell .trend-panel .sales-trend-chart{width:100%;max-height:310px}
.app-shell .dashboard-analysis>.advisor-pie-panel,.app-shell .dashboard-analysis>.performance-panel{height:430px}
.app-shell .advisor-pie-panel{display:flex;flex-direction:column}
.app-shell .advisor-pie-body{display:flex;align-items:center;gap:18px;flex:1;min-height:0}
.app-shell .advisor-pie{width:55%;max-height:320px;flex-shrink:0;overflow:visible}
.app-shell .advisor-pie circle{transition:filter .2s;cursor:pointer}
.app-shell .advisor-pie circle:hover,.app-shell .advisor-pie circle:focus{filter:brightness(1.15);outline:none}
.app-shell .pie-legend{flex:1;max-height:310px;overflow:auto;font-size:11px}
.app-shell .pie-legend>div{display:flex;align-items:center;gap:7px;padding:7px 0;border-bottom:1px solid var(--ui-border)}
.app-shell .pie-legend i{width:9px;height:9px;border-radius:3px;flex:none}
.app-shell .pie-legend b{margin-right:auto;white-space:nowrap}
html[data-theme] .app-shell .trend-mode-toggle{background:var(--button-accent);color:white;border:1px solid var(--button-accent);font-size:12px;padding:7px 12px;cursor:pointer}
html[data-theme] .app-shell .trend-mode-toggle:hover{background:var(--button-hover)}
.app-shell .chart-day-label{font-size:10px}
@media(max-width:1100px){.app-shell .dashboard-analysis{grid-template-columns:1fr}.app-shell .advisor-pie{max-width:320px}.app-shell .advisor-pie-body{justify-content:center}}
@media(max-width:760px){.app-shell .dashboard-analysis>.trend-panel{height:350px}.app-shell .trend-panel .sales-trend-chart{min-width:720px}.app-shell .trend-chart-view{overflow-x:auto}.app-shell .chart-day-label{font-size:11px}.app-shell [data-chart-view=daily] .chart-data-point:nth-of-type(even) .chart-day-label{display:block}.app-shell .chart-month-label{font-size:13px}.app-shell .chart-axis-label{font-size:12px}.app-shell .advisor-pie-body{gap:8px;padding:10px}.app-shell .pie-legend{font-size:10px}.app-shell .dashboard-analysis>.advisor-pie-panel,.app-shell .dashboard-analysis>.performance-panel{height:390px}}

/* Larger plot area and directly connected pie labels. */
.app-shell .dashboard-analysis>.trend-panel{height:520px}
.app-shell .trend-panel .panel-body{padding:12px 14px}
.app-shell .trend-panel .sales-trend-chart{display:block;width:100%;height:100%;max-height:none;flex:1}
.app-shell .trend-panel .chart-legend{margin-bottom:0}
.app-shell .trend-panel .trend-period{display:none}
.app-shell .advisor-pie-body{display:block;overflow:auto;padding:8px}
.app-shell .advisor-pie{display:block;width:100%;min-width:520px;max-width:none;height:100%;min-height:320px;max-height:none;margin:auto;overflow:visible}
.app-shell .pie-name{font-size:15px;fill:var(--ui-ink);font-weight:500}
.app-shell .pie-percent{font-size:15px;font-weight:700}
.app-shell .advisor-pie .pie-slice{transition:filter .2s}
.app-shell .advisor-pie .pie-callout{pointer-events:none}
@media(max-width:760px){.app-shell .dashboard-analysis>.trend-panel{height:420px}.app-shell .trend-panel .sales-trend-chart{min-width:850px}.app-shell .advisor-pie{height:100%;min-width:520px}.app-shell .trend-panel .panel-body{padding:10px 8px}}

/* Compact advisor bars start directly after each name, flowing right to left. */
.app-shell .performance-panel .bar-row{display:flex;gap:7px;direction:rtl}
.app-shell .performance-panel .bar-row .performance-advisor{width:auto;max-width:48%;flex:0 1 auto;gap:7px}
.app-shell .performance-panel .bar-track{flex:1;min-width:20px;height:9px;background:transparent;direction:rtl}
.app-shell .performance-panel .bar-row .bar-fill{margin-right:0;margin-left:auto;background:color-mix(in srgb,#714b67 var(--advisor-tone,80%),#eee5ed);border-radius:5px}
.app-shell .performance-panel .bar-row>small{flex:none;font-size:10px}
.app-shell .mobile-sales-chart{display:none}
@media(max-width:760px){
.app-shell .trend-panel .sales-trend-chart{display:none;min-width:0}
.app-shell .dashboard-analysis>.trend-panel{height:auto;max-height:none}
.app-shell .trend-panel .trend-chart-view{overflow:visible;min-width:0}
.app-shell .mobile-sales-chart{display:block;width:100%;min-width:0}
.app-shell .mobile-sales-row{padding:9px 0;border-bottom:1px solid var(--ui-border)}
.app-shell .mobile-sales-caption{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;margin-bottom:6px}
.app-shell .mobile-sales-caption b{font-size:11px;white-space:nowrap}
.app-shell .mobile-sales-caption small{font-size:9px;font-weight:400;color:var(--ui-muted)}
.app-shell .mobile-sales-track{height:15px;width:100%;direction:rtl}
.app-shell .mobile-sales-bar{height:100%;margin-left:auto;border-radius:4px;background:linear-gradient(to left,#009b7a,#7bd9bd)}
.app-shell .trend-panel .panel-head{flex-wrap:wrap}
.app-shell .performance-panel .bar-row .performance-advisor{max-width:47%}
}

/* Denser guide lines without crowding the rounded axis labels. */
.app-shell .chart-grid-line{stroke:#c6cfd7;stroke-width:1;stroke-dasharray:3 5}
@media(max-width:760px){
.app-shell .dashboard-analysis>.advisor-pie-panel{height:auto;min-width:0}
.app-shell .advisor-pie-panel .advisor-pie-body{overflow:visible;min-width:0;padding:12px 4px}
.app-shell .advisor-pie-panel .advisor-pie{width:100%;max-width:100%;min-width:0;height:auto;min-height:0;max-height:none;overflow:visible}
.app-shell .advisor-pie .pie-name{font-size:20px}
.app-shell .advisor-pie .pie-percent{font-size:20px}
}

/* Shared intrinsic name column aligns every bar after the longest advisor name. */
.app-shell .performance-panel .panel-body{display:grid;grid-template-columns:fit-content(48%) minmax(20px,1fr) max-content;column-gap:7px;align-content:start}
.app-shell .performance-panel .bar-row{display:grid;grid-column:1/-1;grid-template-columns:subgrid;column-gap:7px;align-items:center}
.app-shell .performance-panel .bar-row .performance-advisor{width:auto;max-width:none;min-width:0;gap:7px}
.app-shell .performance-panel .bar-row .performance-advisor-name{width:auto;min-width:0}
.app-shell .performance-panel .bar-track{width:100%;background:transparent}
.app-shell .performance-panel .bar-row .bar-fill{background:linear-gradient(to left,#714b67 0%,#a77caa 55%,#d8b9df 100%)}
.app-shell .performance-panel .panel-body>.empty{grid-column:1/-1}

.app-shell .performance-panel .bar-row>small{font-size:13px;font-weight:600;line-height:1.8}
@media(max-width:760px){.app-shell .performance-panel .bar-row>small{font-size:12px}}

html[data-theme] .app-shell .trend-mode-toggle:hover,html[data-theme] .app-shell .trend-mode-toggle:focus-visible{background:#5b3c53;color:#fff;border-color:#5b3c53}
@media(max-width:760px){
.app-shell .trend-panel .mobile-sales-chart{display:none}
.app-shell .trend-panel .sales-trend-chart{display:block;width:100%;min-width:0;max-width:100%;height:auto;flex:none;aspect-ratio:1000/600}
.app-shell .dashboard-analysis>.trend-panel{height:auto}
.app-shell .trend-panel .trend-chart-view{overflow:visible;min-width:0}
.app-shell .trend-panel .chart-axis-label{font-size:22px}
.app-shell .trend-panel .chart-day-label{font-size:20px}
.app-shell .trend-panel .chart-month-label{font-size:20px}
.app-shell [data-chart-view=daily] .chart-data-point .chart-day-label{display:none}
.app-shell [data-chart-view=daily] .chart-data-point:nth-of-type(5n+1) .chart-day-label,.app-shell [data-chart-view=daily] .chart-data-point:last-of-type .chart-day-label{display:block}
}

.app-shell .dashboard-year-selector{display:flex;align-items:center;gap:8px;align-self:flex-end;height:34px;white-space:nowrap}
.app-shell .dashboard-year-selector span{font-size:12px;min-width:65px;text-align:center}
.app-shell .dashboard-year-selector .secondary{width:29px;height:30px;padding:0;font-size:23px;line-height:1;cursor:pointer}
.app-shell .dashboard-year-selector button:disabled{opacity:.35;cursor:default}
@media(max-width:760px){.app-shell .dashboard-year-selector{flex-basis:100%;justify-content:center;margin-bottom:4px}}

/* Soft lilac chart headings shared by both themes. */
.app-shell .trend-panel>.panel-head,.app-shell .advisor-pie-panel>.panel-head,.app-shell .performance-panel>.panel-head,.app-shell .collection-panel>.panel-head{background:linear-gradient(110deg,#f6f3fa,#eee8f4);border-bottom:1px solid #e2d9ec}

/* Advisor hover emphasis without changing the shared grid dimensions. */
.app-shell .performance-panel .bar-row .profile-avatar,.app-shell .performance-panel .bar-row .performance-advisor-name,.app-shell .performance-panel .bar-row>small{transition:transform .18s ease,color .18s ease}
.app-shell .performance-panel .bar-row .performance-advisor-name{transform-origin:right center}
.app-shell .performance-panel .bar-row>small{transform-origin:left center}
@media(hover:hover) and (pointer:fine){
.app-shell .performance-panel .bar-row:hover .profile-avatar{transform:scale(1.14)}
.app-shell .performance-panel .bar-row:hover .performance-advisor-name{transform:scale(1.06);color:#714b67}
.app-shell .performance-panel .bar-row:hover>small{transform:scale(1.08);color:#714b67}
}
@media(prefers-reduced-motion:reduce){.app-shell .performance-panel .bar-row .profile-avatar,.app-shell .performance-panel .bar-row .performance-advisor-name,.app-shell .performance-panel .bar-row>small{transition:none}}

.app-shell .filter-panel,.app-shell .filter-panel .filters{background:linear-gradient(110deg,#f6f3fa,#eee8f4)}
.app-shell .dashboard-year-selector{height:38px;padding:3px 5px;border:1px solid #d9cce2;border-radius:9px;background:#ffffffc9;box-sizing:border-box;gap:5px}
.app-shell .dashboard-year-selector .secondary{border-color:transparent;background:transparent;color:#714b67}
.app-shell .dashboard-month-selector span{min-width:85px}
@media(max-width:760px){.app-shell .dashboard-year-selector{flex-basis:auto;margin-bottom:0}.app-shell .dashboard-month-selector{flex:1;justify-content:space-between}}

/* Unified dashboard filter controls and searchable month picker. */
.app-shell[data-page=dashboard] .filters{align-items:flex-end}
.app-shell[data-page=dashboard] .filters input:not([type=hidden]),.app-shell[data-page=dashboard] .filters select,.app-shell[data-page=dashboard] .filters .search-select-input{height:38px;min-height:38px;box-sizing:border-box}
.app-shell[data-page=dashboard] .filters>.global-reset-icon{height:38px;min-height:38px;width:38px;order:10;margin-right:auto}
.app-shell[data-page=dashboard] .filters .date-toggle{top:7px}
.app-shell .dashboard-month-selector{flex:none;width:190px}
.app-shell .dashboard-month-selector .search-select{flex:1;min-width:0;margin:0}
.app-shell[data-page=dashboard] .dashboard-month-selector .search-select-input{height:30px;min-height:30px;margin:0;padding:3px 8px 3px 26px;border:0;background:transparent;text-align:center}
.app-shell .dashboard-month-selector .secondary{flex:none;width:24px}
@media(max-width:760px){
.app-shell[data-page=dashboard] .filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 38px;gap:8px}
.app-shell[data-page=dashboard] .dashboard-year-selector{grid-column:1;grid-row:1;width:auto;margin:0;justify-content:space-between}
.app-shell[data-page=dashboard] .dashboard-month-selector{grid-column:2/4;grid-row:1;width:auto}
.app-shell[data-page=dashboard] .filters label:has(input[name=from]){grid-column:1;grid-row:2}
.app-shell[data-page=dashboard] .filters label:has(input[name=to]){grid-column:2/4;grid-row:2}
.app-shell[data-page=dashboard] .filters label:has(select[name=advisor]){grid-column:1/3;grid-row:3;width:100%}
.app-shell[data-page=dashboard] .filters>.global-reset-icon{grid-column:3;grid-row:3;margin:0}
}

.app-shell .search-select-toggle{display:flex;align-items:center;justify-content:center}
.app-shell .search-select-toggle svg{display:block;flex:none;pointer-events:none;transition:transform .16s ease}
.app-shell .search-select-input[aria-expanded=true]+.search-select-toggle svg{transform:rotate(180deg)}
.app-shell[data-page=dashboard] .filters .search-select-toggle{background:transparent;border:0;color:#806d8b;width:30px;height:30px;top:4px;left:4px;padding:6px;border-radius:6px}
.app-shell[data-page=dashboard] .filters .search-select-toggle:hover{background:#eee8f4;color:#714b67}
.app-shell .dashboard-month-selector{width:150px;padding:0 5px;background:#ffffffc9;border-color:#d9cce2}
.app-shell[data-page=dashboard] .dashboard-month-selector .search-select-input{height:36px;min-height:36px;font-size:12px;font-weight:600;padding-right:28px;padding-left:28px}
.app-shell[data-page=dashboard] .dashboard-month-selector .search-select-toggle{top:3px;left:0}
@media(max-width:760px){.app-shell[data-page=dashboard] .dashboard-month-selector{width:auto}}
@media(prefers-reduced-motion:reduce){.app-shell .search-select-toggle svg{transition:none}}

/* Month selection is a single native, non-searchable control. */
.app-shell[data-page=dashboard] .dashboard-month-selector{padding:0;border:0;background:transparent;box-shadow:none}
.app-shell[data-page=dashboard] .dashboard-month-selector select{display:block;width:100%;height:38px;min-height:38px;margin:0;border:1px solid var(--ui-border);border-radius:6px;background-color:#fff;color:var(--ui-ink);font:inherit;font-size:12px;font-weight:400;text-align:center;padding:6px 30px;appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23806d8b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:16px;background-position:left 10px center}
.app-shell[data-page=dashboard] .dashboard-month-selector select:focus{outline:2px solid #d9cce2;outline-offset:1px;border-color:#a78caf}

/* Keep the sidebar scrollbar on its left edge in every layout. */
.app-shell .sidebar,.app-shell .sidebar .nav{direction:rtl}
.app-shell .sidebar .nav{overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable}

.app-shell .payment-form-error{padding:10px 12px;margin-bottom:14px;color:#a33645;background:#fff0f1;border:1px solid #edc2c8;border-radius:7px;font-size:12px}

/* Keep dashboard filters available while scrolling on desktop only. */
@media(min-width:761px){
.app-shell[data-page=dashboard] .filter-panel{position:sticky;top:0;z-index:100;box-shadow:0 4px 12px #43314f12}
}

.app-shell .settings-columns{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.4fr);gap:18px;align-items:start}
.app-shell .settings-columns .company-preview{padding:12px;gap:10px;margin-bottom:14px}
.app-shell .settings-columns .company-settings-panel input:not([type=checkbox]):not([type=file]){height:36px}
.app-shell .settings-columns .appearance-panel{margin-top:0}
.app-shell .settings-columns .theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:850px){.app-shell .settings-columns{grid-template-columns:1fr}}

/* Equal-width year, month and date controls on the mobile dashboard. */
@media(max-width:760px){
.app-shell[data-page=dashboard] .filters{grid-template-columns:repeat(2,minmax(0,1fr))}
.app-shell[data-page=dashboard] .filters .dashboard-year-selector{grid-column:1;grid-row:1;width:100%;min-width:0}
.app-shell[data-page=dashboard] .filters .dashboard-month-selector{grid-column:2;grid-row:1;width:100%;min-width:0}
.app-shell[data-page=dashboard] .filters label:has(input[name=from]){grid-column:1;grid-row:2;width:100%;min-width:0}
.app-shell[data-page=dashboard] .filters label:has(input[name=to]){grid-column:2;grid-row:2;width:100%;min-width:0}
.app-shell[data-page=dashboard] .filters label:has(select[name=advisor]){grid-column:1;grid-row:3;width:100%;min-width:0}
.app-shell[data-page=dashboard] .filters>.global-reset-icon{grid-column:2;grid-row:3;justify-self:end}
.app-shell[data-page=dashboard] .filters .date-input,.app-shell[data-page=dashboard] .filters .date-input input{width:100%;min-width:0}
}

/* Error notifications appear at the upper-left edge. */
.toast-stack:has(.toast-error){right:auto;left:max(16px,env(safe-area-inset-left))}
.toast-stack:has(.toast-error) .toast-leaving{transform:translateX(-20px)}

.toast-stack{right:auto;left:max(16px,env(safe-area-inset-left))}
.toast-stack .toast-leaving{transform:translateX(-20px)}

/* Lapis blue navigation with white surfaces and shared purple action buttons. */
html[data-theme=blue]{--ui-accent:#2868c7;--ui-accent-dark:#1d51a0;--ui-side:#f1f6ff;--ui-active:#e4eeff;--ui-active-ink:#2058ac}
html[data-theme=blue] .app-shell .sidebar{background:linear-gradient(180deg,#2868c7,#204e9b);border-color:#326cc0}
html[data-theme=blue] .app-shell .sidebar .brand{color:#fff}
html[data-theme=blue] .app-shell .sidebar .brand-mark{background:#fff;color:#235bb5}
html[data-theme=blue] .app-shell .sidebar .nav a{color:#e0ecff}
html[data-theme=blue] .app-shell .sidebar .nav a.active,html[data-theme=blue] .app-shell .sidebar .nav a:hover{background:#ffffff26;color:#fff}
html[data-theme=blue] .app-shell .sidebar .nav a.active:after{background:#fff}
html[data-theme=blue] .app-shell .sidebar .nav{scrollbar-color:#a4c6fa transparent}
html[data-theme=blue] .app-shell .table-wrap table th{background:#2868c7;color:#fff;border-color:#427ed7}
html[data-theme=blue] .app-shell .table-wrap table th .column-button,html[data-theme=blue] .app-shell .table-wrap table th .column-button span{color:#fff}
html[data-theme=blue] .app-shell .table-wrap table th .column-button.is-filtered{color:#fff0ac}
html[data-theme=blue] .app-shell .table-wrap table tbody tr:hover{background:#e8f1ff}
@media print{html[data-theme=blue] .app-shell .table-wrap table th,html[data-theme=blue] .app-shell .table-wrap table th .column-button,html[data-theme=blue] .app-shell .table-wrap table th .column-button span{background:#fff;color:#111;border-color:#aaa}}

.app-shell .theme-grid,.app-shell .settings-columns .theme-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}

html[data-theme=default] .app-shell .sidebar{background:linear-gradient(180deg,#087f68,#076351);border-color:#087f68}
html[data-theme=default] .app-shell .sidebar .brand{color:#fff}
html[data-theme=default] .app-shell .sidebar .brand-mark{background:#fff;color:#087f68}
html[data-theme=default] .app-shell .sidebar .nav a{color:#ffffffd9}
html[data-theme=default] .app-shell .sidebar .nav a.active,html[data-theme=default] .app-shell .sidebar .nav a:hover{background:#ffffff24;color:#fff}
html[data-theme=default] .app-shell .sidebar .nav a.active:after{background:#fff}
html[data-theme=default] .app-shell .sidebar .nav{scrollbar-color:#ffffff70 transparent}
html[data-theme=default] .app-shell .menu-close{background:#ffffff20;color:#fff;border-color:#ffffff50}
html[data-theme=default] .app-shell .table-wrap table th{background:#087f68;border-color:#076351;color:#fff}
html[data-theme=default] .app-shell .table-wrap table th .column-button,html[data-theme=default] .app-shell .table-wrap table th .column-button span{color:#fff}
html[data-theme=default] .app-shell .table-wrap table th .column-button.is-filtered{color:#fff0ac}
html[data-theme=default] .app-shell .table-wrap table tbody tr:hover{background:#e6f4ee}
@media print{html[data-theme=default] .app-shell .table-wrap table th,html[data-theme=default] .app-shell .table-wrap table th .column-button,html[data-theme=default] .app-shell .table-wrap table th .column-button span{background:#fff;color:#111;border-color:#aaa}}

html[data-theme=red] .app-shell .sidebar{background:linear-gradient(180deg,#bd3b50,#983044);border-color:#bd3b50}
html[data-theme=red] .app-shell .sidebar .brand{color:#fff}
html[data-theme=red] .app-shell .sidebar .brand-mark{background:#fff;color:#bd3b50}
html[data-theme=red] .app-shell .sidebar .nav a{color:#ffffffd9}
html[data-theme=red] .app-shell .sidebar .nav a.active,html[data-theme=red] .app-shell .sidebar .nav a:hover{background:#ffffff24;color:#fff}
html[data-theme=red] .app-shell .sidebar .nav a.active:after{background:#fff}
html[data-theme=red] .app-shell .sidebar .nav{scrollbar-color:#ffffff70 transparent}
html[data-theme=red] .app-shell .menu-close{background:#ffffff20;color:#fff;border-color:#ffffff50}
html[data-theme=red] .app-shell .table-wrap table th{background:#bd3b50;border-color:#983044;color:#fff}
html[data-theme=red] .app-shell .table-wrap table th .column-button,html[data-theme=red] .app-shell .table-wrap table th .column-button span{color:#fff}
html[data-theme=red] .app-shell .table-wrap table th .column-button.is-filtered{color:#fff0ac}
html[data-theme=red] .app-shell .table-wrap table tbody tr:hover{background:#fcecef}
@media print{html[data-theme=red] .app-shell .table-wrap table th,html[data-theme=red] .app-shell .table-wrap table th .column-button,html[data-theme=red] .app-shell .table-wrap table th .column-button span{background:#fff;color:#111;border-color:#aaa}}

html[data-theme=black] .app-shell .sidebar{background:linear-gradient(180deg,#252932,#171b22);border-color:#252932}
html[data-theme=black] .app-shell .sidebar .brand{color:#fff}
html[data-theme=black] .app-shell .sidebar .brand-mark{background:#fff;color:#252932}
html[data-theme=black] .app-shell .sidebar .nav a{color:#ffffffd9}
html[data-theme=black] .app-shell .sidebar .nav a.active,html[data-theme=black] .app-shell .sidebar .nav a:hover{background:#ffffff24;color:#fff}
html[data-theme=black] .app-shell .sidebar .nav a.active:after{background:#fff}
html[data-theme=black] .app-shell .sidebar .nav{scrollbar-color:#ffffff70 transparent}
html[data-theme=black] .app-shell .menu-close{background:#ffffff20;color:#fff;border-color:#ffffff50}
html[data-theme=black] .app-shell .table-wrap table th{background:#252932;border-color:#171b22;color:#fff}
html[data-theme=black] .app-shell .table-wrap table th .column-button,html[data-theme=black] .app-shell .table-wrap table th .column-button span{color:#fff}
html[data-theme=black] .app-shell .table-wrap table th .column-button.is-filtered{color:#fff0ac}
html[data-theme=black] .app-shell .table-wrap table tbody tr:hover{background:#edf0f4}
@media print{html[data-theme=black] .app-shell .table-wrap table th,html[data-theme=black] .app-shell .table-wrap table th .column-button,html[data-theme=black] .app-shell .table-wrap table th .column-button span{background:#fff;color:#111;border-color:#aaa}}

@media(max-width:420px){.app-shell .theme-choice{padding:5px;gap:5px}.app-shell .theme-miniature{height:58px}.app-shell .theme-name{font-size:10px}}

/* Dashboard headings and filters follow the selected theme palette. */
html[data-theme=default]{--section-ink:#08634f;--section-soft:#e5f3ed;--section-pale:#f4faf7;--section-border:#c7e2d6}
html[data-theme=blue]{--section-ink:#2455a0;--section-soft:#e7f0fd;--section-pale:#f4f8ff;--section-border:#cadcf5}
html[data-theme=blush]{--section-ink:#263e60;--section-soft:#e8edf4;--section-pale:#f5f7fa;--section-border:#cdd7e4}
html[data-theme=red]{--section-ink:#9e3447;--section-soft:#fae9ed;--section-pale:#fff6f7;--section-border:#efcdd5}
html[data-theme=black]{--section-ink:#343a46;--section-soft:#e9ebef;--section-pale:#f6f7f9;--section-border:#d3d7df}

.app-shell .trend-panel>.panel-head,.app-shell .advisor-pie-panel>.panel-head,.app-shell .performance-panel>.panel-head,.app-shell .collection-panel>.panel-head{background:linear-gradient(110deg,var(--section-pale),var(--section-soft));border-bottom-color:var(--section-border);color:var(--section-ink)}
.app-shell .trend-panel>.panel-head h2,.app-shell .advisor-pie-panel>.panel-head h2,.app-shell .performance-panel>.panel-head h2,.app-shell .collection-panel>.panel-head h2{color:var(--section-ink)}
.app-shell .filter-panel,.app-shell .filter-panel .filters{background:linear-gradient(110deg,var(--section-pale),var(--section-soft));border-color:var(--section-border)}
.app-shell .filter-panel .filters>label,.app-shell .dashboard-year-selector{color:var(--section-ink)}
.app-shell .dashboard-year-selector{border-color:var(--section-border)}
.app-shell .dashboard-year-selector .secondary{color:var(--section-ink)}
.app-shell[data-page=dashboard] .filters .search-select-toggle{color:var(--section-ink)}
.app-shell[data-page=dashboard] .filters .search-select-toggle:hover{background:var(--section-soft);color:var(--section-ink)}
.app-shell[data-page=dashboard] .dashboard-month-selector select:focus{outline-color:var(--section-border);border-color:var(--section-ink)}

/* Action buttons inherit the active theme palette. */
html[data-theme=default]{--button-accent:#087f68;--button-hover:#076351;--button-soft:#e5f3ed;--button-border:#b8dbce}
html[data-theme=blue]{--button-accent:#2868c7;--button-hover:#2054a2;--button-soft:#e7f0fd;--button-border:#bdd3f2}
html[data-theme=blush]{--button-accent:#254d7d;--button-hover:#193958;--button-soft:#e8edf4;--button-border:#becddd}
html[data-theme=red]{--button-accent:#bd3b50;--button-hover:#9e3043;--button-soft:#fae9ed;--button-border:#ebbec8}
html[data-theme=black]{--button-accent:#343a46;--button-hover:#20252e;--button-soft:#e9ebef;--button-border:#c8cdd6}

html[data-theme] .app-shell .edit,html[data-theme] .app-shell .eye-button,html[data-theme] .app-shell .column-icon[aria-pressed=true]{border-color:var(--button-border)}
html[data-theme] .app-shell .trend-mode-toggle:hover,html[data-theme] .app-shell .trend-mode-toggle:focus-visible{background:var(--button-hover);border-color:var(--button-hover);color:#fff}

/* Teal navigation for the green-and-white theme. */
html[data-theme=default] .app-shell .sidebar{background:linear-gradient(180deg,#0f858a,#0c676f);border-color:#0c737b}
html[data-theme=default] .app-shell .sidebar .brand-mark{color:#0f858a}

/* One color relationship for navigation, table headings and actions in every theme. */
html[data-theme=default]{--theme-base:#0f858a}
html[data-theme=blue]{--theme-base:#2868c7}
html[data-theme=blush]{--theme-base:#254566}
html[data-theme=red]{--theme-base:#bd3b50}
html[data-theme=black]{--theme-base:#343a46}

html[data-theme]{--button-accent:var(--theme-base);--button-hover:color-mix(in srgb,var(--theme-base) 82%,#000);--button-soft:color-mix(in srgb,var(--theme-base) 10%,#fff);--button-border:color-mix(in srgb,var(--theme-base) 27%,#fff);--section-ink:color-mix(in srgb,var(--theme-base) 82%,#000);--section-soft:color-mix(in srgb,var(--theme-base) 11%,#fff);--section-pale:color-mix(in srgb,var(--theme-base) 4%,#fff);--section-border:color-mix(in srgb,var(--theme-base) 22%,#fff)}
html[data-theme] .app-shell .sidebar{background:linear-gradient(180deg,var(--theme-base),color-mix(in srgb,var(--theme-base) 78%,#000));border-color:color-mix(in srgb,var(--theme-base) 85%,#000)}
html[data-theme] .app-shell .sidebar .brand-mark{background:#fff;color:var(--theme-base)}
html[data-theme] .app-shell .sidebar .nav a{color:#ffffffd9}
html[data-theme] .app-shell .sidebar .nav a.active,html[data-theme] .app-shell .sidebar .nav a:hover{background:#ffffff24;color:#fff}
html[data-theme] .app-shell .sidebar .nav a.active:after{background:#fff}
html[data-theme] .app-shell .sidebar .nav{scrollbar-color:#ffffff70 transparent}
html[data-theme] .app-shell .table-wrap table th{background:var(--theme-base);border-color:color-mix(in srgb,var(--theme-base) 82%,#000);color:#fff}
html[data-theme] .app-shell .table-wrap table tbody tr:hover{background:color-mix(in srgb,var(--theme-base) 10%,#fff)}
@media print{html[data-theme] .app-shell .table-wrap table th{background:#fff;color:#111;border-color:#aaa}}

.app-shell .resizable-table th{position:relative}
.app-shell .column-resize-handle{position:absolute;left:-4px;top:0;bottom:0;width:9px;cursor:col-resize;z-index:3;touch-action:none}
.app-shell .column-resize-handle:hover,.app-shell .column-resize-handle:focus-visible{background:#ffffff55;outline:none}
.resizing-column,.resizing-column *{cursor:col-resize!important;user-select:none!important}
@media(min-width:761px){.app-shell .table-wrap table.resizable-table{table-layout:fixed;width:var(--resized-table-width);min-width:0}.app-shell .resizable-table td,.app-shell .resizable-table th{overflow-wrap:anywhere;white-space:normal}.app-shell .resizable-table .column-button{max-width:100%;white-space:normal}}
@media(max-width:760px){.app-shell .column-resize-handle{display:none}.app-shell .resizable-table col{width:auto!important}}
@media print{.column-resize-handle{display:none!important}.app-shell .table-wrap table.resizable-table{width:100%;table-layout:auto}}


@media(min-width:761px){.app-shell .resizable-table th.compact-number-column{padding-left:4px;padding-right:4px}.app-shell .resizable-table th.compact-number-column .column-button{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px;padding:0;line-height:1.5;font-size:10px}}