:root{--bg:#f6f7fb;--text:#1f2733;--muted:#6b7280;--primary:#1f78d1;--primary-600:#1667b5;--primary-soft:rgba(31,120,209,.12);--accent:#2563eb;--secondary:#6c757d;--card:#fff;--border:#e5e7eb;--shadow:0 14px 34px rgba(15,23,42,.08);--radius:14px}
*{box-sizing:border-box}
html,body{height:100%}
body{font-family:Inter,system-ui,Segoe UI,Arial,Helvetica,sans-serif;margin:0;padding:0;background:var(--bg);color:var(--text);line-height:1.55;-webkit-font-smoothing:antialiased}

.site-header,.site-footer{background:var(--primary);color:#fff}
.site-header{border-bottom:1px solid rgba(255,255,255,.14);box-shadow:0 8px 20px rgba(15,23,42,.14);position:sticky;top:0;z-index:40}
.header-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 0;gap:16px;flex-wrap:wrap}
.header-brand{display:flex;align-items:center;gap:12px}
.logo{display:inline-flex;align-items:center;color:#fff;text-decoration:none;font-size:20px;font-weight:800;letter-spacing:.01em}
.nav-main{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.nav-main a{color:#eaf2ff;text-decoration:none;padding:8px 12px;border-radius:10px;font-weight:650;border:1px solid transparent;transition:background .15s,color .15s,border-color .15s}
.nav-main a:hover{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.2)}
.nav-main a.active{background:rgba(255,255,255,.24);color:#fff;border-color:rgba(255,255,255,.24)}
.user-link{opacity:.95}
.user-link.muted{opacity:.86}

.nav-toggle{display:none;background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:9px;min-height:0;box-shadow:none;gap:0}
.nav-toggle:hover{background:rgba(255,255,255,.2)}
.nav-toggle:focus-visible{box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.nav-toggle-bars{display:inline-flex;flex-direction:column;gap:5px}
.nav-toggle-bars span{display:block;width:20px;height:2px;background:currentColor;border-radius:999px;transition:transform .2s,opacity .2s}
.nav-toggle.is-active .nav-toggle-bars span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.is-active .nav-toggle-bars span:nth-child(2){opacity:0}
.nav-toggle.is-active .nav-toggle-bars span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.flash-container{padding-bottom:12px;display:flex;flex-direction:column;gap:8px}
.flash-container .alert{margin:0}

main{padding:20px 0 32px}
.container{max-width:1100px;margin:0 auto;padding:0 16px}

.card{background:var(--card);border:1px solid rgba(148,163,184,.22);border-radius:var(--radius);padding:20px;margin:0;box-shadow:var(--shadow);overflow:visible}
.card-muted{background:#fafafa;border-style:dashed}

.stack{display:flex;flex-direction:column;gap:16px}
.stack-sm{display:flex;flex-direction:column;gap:8px}
.stack-lg{display:flex;flex-direction:column;gap:28px}
.stack > *,
.stack-sm > *,
.stack-lg > *{min-width:0}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap}
.page-header > :first-child{max-width:min(100%,700px)}
.page-header h1{margin:0;font-size:28px;letter-spacing:-.01em}
.page-header h2{margin:0;font-size:22px;letter-spacing:-.01em}
.page-header p{margin:4px 0 0}
.page-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.page-actions form{margin:0;display:flex}
.filter-bar{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin:10px 0 0}
.filter-panel{padding:14px;border:1px solid rgba(148,163,184,.28);border-radius:12px;background:#f8fafc}
.filter-field{display:flex;flex-direction:column;gap:6px;min-width:160px;margin:0}
.filter-field.filter-grow{flex:1 1 320px;min-width:220px}
.filter-field > span{font-size:12px;font-weight:700;color:#475569;letter-spacing:.05em;text-transform:uppercase}
.filter-actions{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.button-group{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.form-inline{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.form-grid{display:grid;gap:16px}
.form-grid.two{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.form-grid .field{display:flex;flex-direction:column;gap:6px;margin:0}

input,select,textarea{padding:11px 14px;border:1px solid #d6dae0;border-radius:10px;width:100%;background:#fff;outline:none;transition:border-color .15s,box-shadow .15s,transform .1s}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(31,120,209,.18);transform:translateY(-1px)}
label{display:flex;flex-direction:column;gap:6px;margin:0}

button,.btn{background:var(--primary);color:#fff;border:none;border-radius:12px;padding:12px 20px;cursor:pointer;transition:background .15s,transform .05s,box-shadow .15s;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;font-weight:600;font-size:15px;line-height:1;min-height:44px;box-shadow:0 6px 16px rgba(31,120,209,.18)}
button:hover,.btn:hover{background:var(--primary-600);box-shadow:0 12px 22px rgba(22,103,181,.2)}
button:active,.btn:active{transform:translateY(1px)}
button:focus-visible,.btn:focus-visible{outline:2px solid rgba(255,255,255,0);box-shadow:0 0 0 3px rgba(31,120,209,.28)}
button[disabled],.btn[aria-disabled="true"],.btn.disabled{opacity:.6;cursor:not-allowed;box-shadow:none}
.btn.secondary{background:#f3f4f6;color:#1f2937;box-shadow:none}
.btn.secondary:hover{background:#e5e7eb;color:#111827}
.btn.secondary.ghost{background:transparent;color:#1f2937;border:1px solid rgba(17,24,39,.18)}
.btn.secondary.ghost:hover{background:#111827;color:#fff;border-color:#111827}
.btn.accent{background:var(--accent);box-shadow:0 10px 24px rgba(37,99,235,.2)}
.btn.accent:hover{background:#1d4ed8}
.btn.accent.small{min-height:40px;padding:9px 16px;font-weight:700;box-shadow:0 8px 16px rgba(37,99,235,.24)}
.btn.danger{background:#dc2626;box-shadow:0 10px 24px rgba(220,38,38,.18)}
.btn.danger:hover{background:#b91c1c}
.btn.small{min-height:36px;padding:8px 14px;font-size:14px;box-shadow:none}

.table{width:100%;border-collapse:separate;border-spacing:0;min-width:620px}
.table th,.table td{border-bottom:1px solid #edf0f3;padding:11px 12px;text-align:left;vertical-align:top;font-size:14px}
.table thead th{position:sticky;top:0;background:#f4f7fb;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:#4b5563;z-index:1}
.table tbody tr:nth-child(even){background:rgba(248,250,252,.75)}
.table tbody tr:hover{background:#eef6ff}
.table a{color:var(--primary);font-weight:600;text-decoration:none}
.table a:hover{text-decoration:underline}
.table td form{margin:0}
.auth-card{max-width:620px;margin:0 auto}

.row{display:flex;gap:12px;flex-wrap:wrap}
.row.align-center{align-items:center}
.col{flex:1 1 280px;min-width:220px}
.detail-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.detail-card{background:#f8fafc;border:1px solid rgba(148,163,184,.24);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:8px}
.detail-card h3{margin:0;font-size:16px}
.detail-card strong{font-size:15px}
/* Dashboard */
.dashboard-hero{display:flex;flex-direction:column;gap:18px;background:linear-gradient(135deg,#f0f6ff 0%,#fff 65%);border:1px solid rgba(148,163,184,.18)}
.dashboard-hero h1{margin:0}
.dashboard-hero .hero-header{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap}
.dashboard-hero .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.dashboard-hero .hero-meta{font-size:14px}
.dashboard-hero .dashboard-alert{margin:0}

.dashboard-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.stat-card{display:flex;flex-direction:column;gap:6px}
.stat-label{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.stat-value{font-size:28px;font-weight:700;display:flex;align-items:baseline;gap:8px;line-height:1}
.stat-value .stat-number{line-height:1}
.stat-unit{font-size:15px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.stat-foot{font-size:13px}

.dashboard-section .section-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.dashboard-section .section-title h2{margin:0}

.chart-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.chart-toggle{display:inline-flex;align-items:center;background:#eef2f7;border-radius:10px;padding:4px;gap:4px}
.chart-toggle-btn{appearance:none;border:0;background:transparent;color:#1f2937;padding:8px 12px;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;transition:background .15s,color .15s,box-shadow .15s;min-height:34px}
.chart-toggle-btn:hover{background:#dde6f3}
.chart-toggle-btn.is-active{background:#fff;color:#1f5db8;box-shadow:0 4px 10px rgba(15,23,42,.12)}
.chart-yoy{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.chart-yoy-label{font-size:13px;color:var(--muted);font-weight:600}
.trend-pill{display:inline-flex;align-items:flex-start;gap:8px;padding:6px 10px;border-radius:999px;font-size:13px;font-weight:600;border:1px solid transparent}
.trend-pill strong{line-height:1}
.trend-pill small{font-size:11px;color:inherit;opacity:.8;line-height:1.2}
.trend-up{background:#ecfdf5;color:#047857;border-color:rgba(4,120,87,.26)}
.trend-down{background:#fff1f2;color:#b91c1c;border-color:rgba(185,28,28,.22)}
.trend-flat{background:#f1f5f9;color:#334155;border-color:rgba(51,65,85,.2)}

.monthly-chart{display:grid;grid-template-columns:repeat(12,minmax(56px,1fr));gap:10px;align-items:end;padding:14px;border:1px solid rgba(148,163,184,.25);border-radius:12px;background:#f8fafc;min-height:240px;overflow-x:auto}
.monthly-col{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:56px}
.monthly-bar-wrap{width:100%;height:150px;display:flex;align-items:flex-end;padding:4px;border-radius:10px;background:#eef2f7}
.monthly-bar{width:100%;height:var(--h-amount,6%);min-height:6px;border-radius:8px;background:linear-gradient(180deg,#93c5fd 0%,#60a5fa 100%);opacity:.38;transition:opacity .15s ease,transform .15s ease,height .18s ease}
.monthly-bar.has-data{opacity:1}
.series-chart.mode-count .monthly-bar{height:var(--h-count,6%)}
.monthly-bar-wrap:hover .monthly-bar{transform:translateY(-1px)}
.monthly-col-label{font-size:12px;font-weight:600;color:#475569;text-transform:uppercase;letter-spacing:.04em}
.monthly-col-value{font-size:12px;color:#64748b}
.monthly-col-value .value-count{display:none}
.series-chart.mode-count .monthly-col-value .value-amount{display:none}
.series-chart.mode-count .monthly-col-value .value-count{display:inline}
.mode-note{display:inline}
.mode-count-note,.trend-count{display:none}
.series-chart.mode-count .mode-amount-note,
.series-chart.mode-count .trend-amount{display:none}
.series-chart.mode-count .mode-count-note{display:inline}
.series-chart.mode-count .trend-count{display:inline-flex}

.quick-links{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.quick-links a{display:inline-flex;align-items:center;gap:6px;padding:10px 14px;border-radius:10px;background:#eef2ff;color:var(--primary);text-decoration:none;font-weight:600;transition:background .15s,color .15s}
.quick-links a:hover{background:#dce6ff}

.dashboard-columns{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}

.stats-layout{gap:24px}
.stats-split{display:grid;grid-template-columns:1fr;gap:18px}
.stats-split > *{min-width:0}

.compare-chart{display:grid;grid-template-columns:repeat(12,minmax(50px,1fr));gap:10px;align-items:end;padding:14px;border:1px solid rgba(148,163,184,.25);border-radius:12px;background:#f8fafc;min-height:250px;overflow-x:auto}
.compare-col{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:50px}
.compare-bars{display:flex;gap:6px;align-items:flex-end;justify-content:center;width:100%;height:155px;padding:4px;border-radius:10px;background:#eef2f7}
.compare-bar{width:16px;min-height:6px;border-radius:7px;opacity:.38;transition:opacity .15s ease,transform .15s ease}
.compare-bar.prev{background:#7dd3fc}
.compare-bar.current{background:#2563eb}
.compare-bar.has-data{opacity:1}
.compare-bars:hover .compare-bar.has-data{transform:translateY(-1px)}
.compare-label{font-size:12px;font-weight:600;color:#475569;text-transform:uppercase;letter-spacing:.04em}

.chart-legend{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:10px}
.legend-item{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#334155;font-weight:600}
.legend-dot{display:inline-block;width:11px;height:11px;border-radius:50%;background:#94a3b8}
.legend-dot.prev{background:#7dd3fc}
.legend-dot.current{background:#2563eb}

.stats-chart-switch .chart-view{display:none}
.stats-chart-switch.view-line .chart-view-line{display:block}
.stats-chart-switch.view-bar .chart-view-bar{display:block}

.line-chart{padding:12px;border:1px solid rgba(148,163,184,.25);border-radius:12px;background:#f8fafc;overflow-x:auto;overflow-y:hidden}
.line-chart-inner{min-width:720px}
.line-chart-svg{display:block;width:100%;height:220px}
.line-grid{stroke:#d8e2ef;stroke-width:1}
.line-area{stroke:none}
.line-stroke{fill:none;stroke:#0f7db8;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.line-chart-amount .line-stroke{stroke:#2563eb}
.line-chart-average .line-stroke{stroke:#1d4ed8}
.line-marker{fill:#0f7db8;stroke:#fff;stroke-width:1.5}
.line-chart-amount .line-marker{fill:#2563eb}
.line-chart-average .line-marker{fill:#1d4ed8}
.line-chart-months,.line-chart-values{display:grid;grid-template-columns:repeat(12,minmax(50px,1fr));gap:8px}
.line-chart-months{margin-top:8px}
.line-chart-months span{font-size:12px;font-weight:600;color:#475569;text-transform:uppercase;letter-spacing:.04em;text-align:center}
.line-chart-values span{font-size:12px;color:#64748b;text-align:center}

.bar-chart{padding:12px;border:1px solid rgba(148,163,184,.25);border-radius:12px;background:#f8fafc;overflow-x:auto;overflow-y:hidden}
.bar-chart-grid{min-width:720px;display:grid;grid-template-columns:repeat(12,minmax(50px,1fr));gap:8px;align-items:end}
.bar-col{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:50px}
.bar-wrap{width:100%;height:170px;padding:4px;border-radius:10px;background:#eef2f7;display:flex;align-items:flex-end}
.bar-fill{width:100%;min-height:6px;border-radius:8px;opacity:.36;transition:opacity .15s ease,transform .15s ease}
.bar-fill.has-data{opacity:1}
.bar-wrap:hover .bar-fill.has-data{transform:translateY(-1px)}
.bar-label{font-size:12px;font-weight:600;color:#475569;text-transform:uppercase;letter-spacing:.04em;text-align:center}
.bar-value{font-size:12px;color:#64748b;text-align:center}

.bar-chart-amount .bar-fill{background:linear-gradient(180deg,#60a5fa 0%,#2563eb 100%)}
.bar-chart-cumulative .bar-fill{background:linear-gradient(180deg,#38bdf8 0%,#0284c7 100%)}
.bar-chart-average .bar-fill{background:linear-gradient(180deg,#60a5fa 0%,#1d4ed8 100%)}

.donut-layout{display:grid;grid-template-columns:minmax(180px,220px) 1fr;gap:16px;align-items:center}
.donut-chart{width:200px;height:200px;border-radius:50%;margin:0 auto;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px rgba(15,23,42,.08)}
.donut-hole{width:122px;height:122px;background:#fff;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 0 0 1px rgba(148,163,184,.25)}
.donut-hole strong{font-size:18px;line-height:1}
.donut-hole small{color:var(--muted);font-weight:600}
.donut-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.donut-legend li{display:grid;grid-template-columns:14px minmax(0,1fr);grid-template-areas:"dot name" "dot value";column-gap:8px;row-gap:2px;align-items:start;font-size:13px}
.donut-legend .legend-dot{grid-area:dot;margin-top:4px}
.donut-legend .legend-name{grid-area:name;font-weight:600;color:#1f2937;min-width:0}
.donut-legend .legend-value{grid-area:value;color:#475569;min-width:0}
.monthly-chart,
.compare-chart,
.line-chart,
.bar-chart{width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden}

.card-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.card-kpi{background:#eef2ff;color:var(--primary);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:6px;box-shadow:inset 0 0 0 1px rgba(31,120,209,.18)}
.card-kpi .label{font-size:13px;text-transform:uppercase;letter-spacing:.05em;opacity:.8}
.card-kpi .value{font-size:26px;font-weight:700}
.card-kpi .value .trend-pill{font-size:14px}
.card-kpi .note{font-size:14px;color:rgba(31,120,209,.8)}

.list{display:flex;flex-direction:column;gap:12px;margin:0;padding:0;list-style:none}
.list-item{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid rgba(148,163,184,.24);padding-bottom:12px}
.list-item:last-child{border-bottom:none;padding-bottom:0}
.list-title{font-weight:600}
.list-meta{font-size:14px}
.list-info{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right;min-width:120px}
.list-amount{font-weight:600}
.list-empty{padding:12px;border-radius:10px;background:#f3f4f6;border:1px solid #e5e7eb;font-size:14px}

.list.contacts .list-info{min-width:180px}
.list.contacts .list-info a{color:var(--primary);text-decoration:none}
.list.contacts .list-info a:hover{text-decoration:underline}

.status-badge{white-space:nowrap}
/* Items layout helpers */
.invoice-form > .form-grid + .form-grid{margin-top:2px}
.invoice-section-title{margin:6px 0 0}
.invoice-section-subtitle{margin:0 0 6px}
.contact-preview{padding:16px 18px}
.contact-preview h3{margin:0 0 6px}
.contact-preview strong{display:block}
.contact-preview span{display:block;line-height:1.45}

.items-head{display:flex;gap:12px;margin:2px 0 8px;color:var(--muted);font-size:13px;font-weight:600}
.items-head .left{flex:1 1 auto;min-width:220px}
.items-head .middle{flex:0 0 250px;max-width:250px}
.items-head .actions{flex:0 0 112px}

.invoice-items-list{display:flex;flex-direction:column;gap:10px}
.invoice-item-row{align-items:flex-end;gap:12px}
.invoice-item-row .col{min-width:0}
.invoice-item-row .col-desc{flex:1 1 auto;min-width:260px}
.invoice-item-row .col-qty{flex:1 1 120px;min-width:110px}
.invoice-item-row .col-price{flex:0 0 250px;min-width:180px;max-width:250px}
.invoice-item-row .col-vat{flex:1 1 110px;min-width:90px}
.invoice-item-row .col-line-total{flex:1 1 140px;min-width:120px;text-align:right;font-weight:700;padding-bottom:12px}
.invoice-item-row .col-item-actions{flex:0 0 112px}
.invoice-add-row{margin-top:4px}
.invoice-item-row .col-item-actions .btn.icon-btn{width:36px;min-height:36px;padding:0;font-size:24px;line-height:1}
.invoice-item-row .col-item-actions .btn.icon-btn span{display:inline-block;transform:translateY(-1px)}
.invoice-totals{max-width:360px;width:100%;margin:6px 0 0 auto}
.invoice-total-row{display:flex;justify-content:space-between;gap:12px}
.invoice-total-row.grand{font-size:18px}

.alert{padding:12px 14px;border-radius:8px;margin:10px 0;border:1px solid transparent}
.alert.error{background:#fff1f2;color:#991b1b;border-color:#fecaca}
.alert.success{background:#ecfdf5;color:#065f46;border-color:#a7f3d0}
.alert.info{background:#e0f2fe;color:#1d4ed8;border-color:#bfdbfe}
.muted,small.muted{color:var(--muted)}

.status-badge{display:inline-flex;align-items:center;font-weight:600;font-size:12px;padding:6px 12px;border-radius:999px;text-transform:uppercase;letter-spacing:.05em}
.status-unpaid{background:#f1f5f9;color:#1f2937;box-shadow:inset 0 0 0 1px rgba(15,23,42,.08)}
.status-paid{background:#ecfdf5;color:#047857;box-shadow:inset 0 0 0 1px rgba(4,120,87,.16)}
.status-overdue{background:#fef3c7;color:#92400e;box-shadow:inset 0 0 0 1px rgba(146,64,14,.16)}

.invoice-summary{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0}
.invoice-total{margin-right:12px;display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-weight:600}
.invoice-total strong{color:#0f4b8a}

.table-wrap{overflow:auto;border:1px solid rgba(148,163,184,.26);border-radius:12px;background:#fff}
.table-card{padding:0}
.table-card .card-head{padding:18px 18px 0}
.table-card .card-body{padding:0 18px 18px}
.table-card .table{margin:0}
.table-card .table tbody tr:last-child td{border-bottom:none}
.table-card .empty-state{margin:18px}

.empty-state{padding:22px;border-radius:14px;background:#f9fafb;border:1px dashed rgba(148,163,184,.5);text-align:center;color:var(--muted);font-size:15px}

.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:#eef2ff;color:var(--primary);font-weight:600}

/* Autocomplete dropdown */
.card.card-muted{overflow:visible}
.subject-search{position:relative}
.subject-search input[data-subject-search]{width:100%}
.autocomplete-list{position:absolute;top:calc(100% + 6px);left:0;right:0;display:none;background:#fff;border:1px solid rgba(148,163,184,.28);border-radius:12px;box-shadow:0 12px 22px rgba(15,30,55,.12);max-height:280px;overflow-y:auto;padding:6px;z-index:50}
.autocomplete-list.is-visible{display:block}
.autocomplete-item{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:10px 12px;border-radius:10px;cursor:pointer;border:none;width:100%;text-align:left;font:inherit;background:transparent;transition:background .15s ease, box-shadow .15s ease}
.autocomplete-item:hover{background:rgba(15,75,138,.08);box-shadow:0 4px 10px rgba(15,30,55,.08)}
.autocomplete-primary{flex:1 1 auto;min-width:0}
.autocomplete-name{font-weight:600;color:#1f2b46;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.autocomplete-address{margin-top:2px;color:#5b6a87;font-size:12px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.autocomplete-ico{flex:0 0 auto;font-size:12px;color:#5b6a87;font-weight:600;white-space:nowrap}
.autocomplete-empty{padding:12px 14px;color:#5b6a87;text-align:center;font-size:13px}
.spinner{display:inline-block;width:14px;height:14px;border:2px solid #cfe2ff;border-top-color:#0d6efd;border-radius:50%;margin-right:6px;vertical-align:middle;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.btn.secondary.active{background:#0d6efd;color:#fff}
.country-toggle{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.country-toggle .btn{flex:0 0 auto}

/* Footer */
.site-footer .container{padding:12px 16px}

/* Responsive */
@media (max-width: 768px){
  .container{padding:0 12px}
  .site-header > .container,
  .site-header .flash-container{padding-left:16px;padding-right:16px}
  .header-brand{width:100%;justify-content:space-between}
  .header-bar{align-items:center;padding:10px 0}
  .nav-toggle{display:inline-flex}
  .nav-main{display:none;width:100%;flex-direction:column;align-items:stretch;gap:6px;padding:10px 0 4px;border-top:1px solid rgba(255,255,255,.2)}
  .nav-main[data-expanded="true"]{display:flex}
  .nav-main a{width:100%;padding:10px 12px}
  .nav-main a:hover{background:rgba(255,255,255,.2)}
  .nav-main a.active{box-shadow:none}
  .filter-bar{gap:10px}
  .filter-field,
  .filter-field.filter-grow{flex:1 1 100%;min-width:100%}
  .filter-actions{width:100%}
  .chart-head-actions{width:100%}
  .chart-toggle{width:100%;justify-content:space-between}
  .chart-toggle-btn{flex:1 1 auto}
  .chart-yoy{align-items:flex-start}
  .stats-split{grid-template-columns:1fr}
  .donut-layout{grid-template-columns:1fr}
  .donut-chart{width:180px;height:180px}
  .donut-hole{width:112px;height:112px}
  .table{min-width:540px}
  .items-head{display:none}
  .invoice-item-row .col-desc,
  .invoice-item-row .col-price,
  .invoice-item-row .col-item-actions{flex:1 1 100%;max-width:none}
  .invoice-item-row .col-item-actions .btn.icon-btn{width:36px}
  .invoice-totals{max-width:none}
}