:root{
  --bg: #ffffff;
  --text: #111111;
  --muted: #6b7280;
  --line: #e5e7eb;
  --panel: #ffffff;
  --panel-alt: #f9fafb;
  --accent: #006aff;
  --accent-600:#0284c7;
  --success:#16a34a;
  --danger:#dc2626;
  --warn:#d97706;
  --radius: 14px;
  --shadow: 0 1px 2px rgba(0,0,0,.05), 0 8px 24px rgba(0,0,0,.06);
  --shadow-sm: 0 4px 16px rgba(15,23,42,0.08);
  --spacing: 16px;
  --sidebar-w: 260px;
  --white:#ffffff;
  --black:#000000;
  --border:#e5e7eb;
  --red:#ef4444;
  --green:#16a34a;
  --card:#ffffff;
  --focus:#2563eb;
  --surface:#ffffff;
  --accent-soft:#e0eaff;

  --btn-blue: #006aff;
  --btn-blue-hover: #0057d6;
  --btn-blue-active: #0047b1;
  --btn-blue-ghost: rgba(0, 106, 255, 0.12);

  --btn-text-on-blue: #ffffff;
  --btn-text-primary: #0b1220;
  --btn-border: rgba(11, 18, 32, 0.12);

  --btn-radius: 10px;
  --btn-font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  --btn-weight: 600;

  --btn-focus: 0 0 0 3px rgba(0, 106, 255, 0.35);
  --btn-shadow: 0 1px 2px rgba(0,0,0,0.06), 0 1px 1px rgba(0,0,0,0.04);
  --btn-shadow-press: inset 0 1px 2px rgba(0,0,0,0.2);
}

*{box-sizing:border-box}
html,body{height:100%}
html.quotes-page-root,
body.quotes-page-root{
  overflow-x:hidden;
}
.d-none{display:none !important;}
[hidden]{display:none !important;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font: 14px/1.5 system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
}

body.modal-open{ overflow:hidden; }

.app-shell{
  display:grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  grid-template-rows: 56px 1fr;
  grid-template-areas:
    "sidebar topbar"
    "sidebar main";
  min-height:100vh;
}
.sidebar{ grid-area: sidebar; border-right:1px solid var(--line); background:#fff; position:sticky; top:0; height:100vh; padding:0 16px 16px; display:flex; flex-direction:column; gap:16px; }
.topbar{ grid-area: topbar; border-bottom:1px solid var(--line); background:#fff; display:flex; align-items:center; gap:12px; padding:0 16px; position:sticky; top:0; z-index:10;}
.main{ grid-area: main; padding:clamp(16px, 2vw, 24px); background:var(--panel-alt); width:100%; max-width:none; }
.main--quotes{
  display:flex;
  flex-direction:column;
  min-height:100%;
  overflow:visible;
}

/* Page shell (matches quotes/invoices layout) */
.page-shell{
  flex:1;
  display:flex;
  flex-direction:column;
  min-height:0;
}
.page{
  flex:1;
  display:flex;
  flex-direction:column;
  min-height:0;
  width:100%;
}
.page__inner{
  max-width:100%;
  margin:0 auto;
  padding:0;
}
.page.px{ padding:0rem; }
.content{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:0;
}

.page-shell .card{
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.page-shell .table{ width:100%; border-collapse:separate; border-spacing:0; font-size:14px; min-width:100%; }
.page-shell .table thead th{
  position:sticky;
  top:0;
  z-index:2;
  text-align:left;
  color:#6b7280;
  font-weight:500;
  padding:12px;
  background:var(--surface, var(--panel, #fff));
  box-shadow:inset 0 -1px 0 var(--border), 0 1px 0 rgba(15,23,42,0.04);
  background-clip:padding-box;
}
.page-shell .table tbody td{ padding:14px 12px; border-bottom:1px solid var(--border); }
.page-shell .text-right{ text-align:right; }
.page-shell .w-32{ width:32px; }
.page-shell .ml{ margin-left:6px; }
.page-shell .kebab{ cursor:pointer; padding:4px 8px; border-radius:8px; }
.page-shell .kebab:hover{ background:#f3f4f6; }
.page-shell .badge{ padding:4px 8px; border-radius:999px; font-size:12px; font-weight:600; }
.page-shell .badge.green{ color:#065f46; background:#d1fae5; }
.page-shell .badge.red{ color:#991b1b; background:#fee2e2; }
.page-shell .badge.gray{ color:#374151; background:#e5e7eb; }
.page-shell .badge.blue{ color:#1d4ed8; background:#dbeafe; }
.page-shell .badge.orange{ color:#9a3412; background:#ffedd5; }
.page-shell .empty{ text-align:center; color:#9ca3af; padding:28px 0; }
.page-shell .pager{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:12px;
}
.page-shell .pager-summary{ color:#6b7280; font-size:13px; }
.page-shell .pager-nav{ display:flex; align-items:center; gap:12px; margin-left:auto; }
.page-shell .pager-list{ display:flex; align-items:center; gap:6px; list-style:none; margin:0; padding:0; }
.page-shell .pager-link{ display:inline-flex; align-items:center; justify-content:center; min-width:32px; height:32px; padding:0 12px; border-radius:999px; border:1px solid var(--border); font-size:13px; color:var(--text); text-decoration:none; transition:all .15s ease; }
.page-shell .pager-link:hover{ border-color:var(--accent); color:var(--accent); }
.page-shell .pager-link.is-active{ background:var(--black); color:#fff; border-color:var(--black); cursor:default; }
.page-shell .pager-link.is-disabled{ pointer-events:none; opacity:.4; }
.page-shell .pager-ellipsis{ color:#9ca3af; font-size:14px; padding:0 4px; }

.content > .quotes-table,
.content > .invoices-table,
.content > .payments-table,
.content > .receipts-table{ flex:1; }

.brand{ display:flex; align-items:center; gap:10px; padding:16px 0 8px; margin:0; }
.brand .logo{ width:28px; height:28px; border-radius:8px; background:#111; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-weight:700; }
.brand .name{ font-weight:700; letter-spacing:.3px; font-size:18px; }

/* Company card link in sidebar */
.org-link{ display:flex; align-items:center; justify-content:flex-start; gap:12px; width:100%;
  text-decoration:none; color:var(--text); border:1px solid var(--line); border-radius:14px; padding:10px 14px; background:#fff; min-height:56px; box-shadow: var(--shadow); margin-top:8px; }
.org-link:hover{ background:#f8fafc; }
.org-left{ display:flex; align-items:center; gap:12px; }
.org-avatar{ width:36px; height:36px; border-radius:50%; object-fit:cover; background:#f3f4f6; display:inline-flex; align-items:center; justify-content:center; }
.org-avatar--icon i{ color:#111; font-size:18px; }
.org-name{ font-weight:700; font-size:16px; }

.nav{ display:flex; flex-direction:column; gap:4px; padding:8px 0; }
.nav a{ text-decoration:none; color:var(--text);
  padding:10px 12px; border-radius:10px; display:flex; align-items:center; gap:10px;
  font-size:15px; }
.nav a:hover{ background:var(--panel-alt); }
.nav a.active{ background:#eef7ff; color:#0b70b8; }

.topbar-title{ font-size:18px; font-weight:600; margin:0; }
.topbar-subtle{ color:var(--muted); font-size:13px; }
.topbar .actions{ margin-left:auto; display:flex; align-items:center; gap:12px;}
.select{ border:1px solid var(--line); border-radius:10px; padding:6px 10px; background:#fff; color:var(--text); }

.dashboard-view{ display:flex; flex-direction:column; gap:20px; min-height:100%; }
.dashboard-header{ display:flex; align-items:center; justify-content:space-between; padding:8px 0; }
.dashboard-header--action{ flex-direction:column; align-items:flex-start; gap:6px; }
.dashboard-header__business{ margin:0; font-size:13px; color:var(--muted); letter-spacing:.2px; text-transform:uppercase; }
.dashboard-header__title{ margin:0; font-size:22px; font-weight:700; }
.dashboard-header__subtitle{ margin:0; color:var(--muted); font-size:14px; }
.dashboard-metrics{ margin:0; }
.dashboard-main{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:20px; align-items:stretch; }
.dashboard-main > .card{ height:100%; width:100%; }
.dashboard-panels{ flex:1; min-height:0; }
.panel{ display:flex; flex-direction:column; min-height:0; }
.panel--stacked{ padding:0; overflow:hidden; }
.panel__section{ padding:16px; }
.panel__section + .panel__section{ border-top:1px solid var(--line); }
.panel__footer{ margin-top:12px; display:flex; justify-content:flex-end; }
.panel__link{ color:var(--accent-600); text-decoration:none; font-weight:600; font-size:13px; }
.panel__link:hover{ text-decoration:underline; }
.panel__body{ min-height:0; flex:1; }

.card{ background:var(--panel); border:1px solid rgba(148, 163, 184, 0.35); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:16px; }
.card h3{ margin:0 0 8px 0; font-size:16px; }
.grid{ display:grid; gap:16px; }
.grid.cols-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
@media (max-width: 1024px){ .grid.cols-3{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px){ .grid.cols-3{ grid-template-columns: 1fr; } }

.kpi{ position:relative; padding:20px 18px; display:flex; flex-direction:column; gap:10px; }
.kpi--primary{ border-color:rgba(37, 99, 235, 0.25); background:linear-gradient(180deg, rgba(224, 234, 255, 0.5), rgba(255, 255, 255, 0.9)); }
.kpi__trend{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.kpi__badge{ display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; font-size:12px; font-weight:600; background:#fee2e2; color:#991b1b; border:1px solid rgba(220, 38, 38, 0.3); }
.kpi__trend--alert{ color:var(--danger); font-weight:600; }
.kpi__trend--neutral{ color:var(--muted); }
.kpi__link{ font-size:12px; color:var(--accent-600); text-decoration:none; font-weight:600; }
.kpi__link:hover{ text-decoration:underline; }
.kpi__label{ margin:0; color:var(--muted); font-size:13px; font-weight:500; }
.kpi__value{ margin:0; font-size:26px; font-weight:700; }
.kpi__trend{ margin:0; color:var(--muted); font-size:13px; }
.kpi--neutral .kpi__trend{ color:var(--muted); }
.kpi--up .kpi__trend{ color:var(--success); }
.kpi--alert .kpi__trend{ color:var(--warn); }
.kpi--down .kpi__trend{ color:var(--danger); }

.panels{ display:grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }
@media (max-width: 1200px){ .panels{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
@media (max-width: 800px){ .panels{ grid-template-columns: minmax(0,1fr); } }

.panel__header{ margin-bottom:10px; }
.panel__title{ margin:0; font-size:17px; font-weight:600; }
.panel__subtitle{ margin:4px 0 0; color:var(--muted); font-size:13px; }

.dashboard-main .panel__body{ display:flex; flex-direction:column; gap:16px; }
.dashboard-empty{ padding:12px; border-radius:12px; background:var(--panel-alt); border:1px dashed rgba(148, 163, 184, 0.6); }
.dashboard-empty__title{ margin:0 0 4px; font-weight:600; }
.dashboard-empty__subtitle{ margin:0 0 12px; color:var(--muted); font-size:13px; }
.dashboard-empty__actions{ display:flex; flex-wrap:wrap; gap:8px; }

.action-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.action-list__item{ display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:12px; border:1px solid rgba(148, 163, 184, 0.35); background:#fff; text-decoration:none; color:inherit; font-weight:600; }
.action-list__item:hover{ border-color:rgba(59, 130, 246, 0.4); background:#f8fafc; }
.action-list__icon{ font-size:18px; }
.action-list__empty{ color:var(--muted); font-size:13px; }

.attention-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.attention-list__item{ display:flex; flex-direction:column; gap:4px; padding:10px 12px; border-radius:12px; border:1px solid rgba(148, 163, 184, 0.35); background:#fff; text-decoration:none; color:inherit; }
.attention-list__item:hover{ border-color:rgba(59, 130, 246, 0.4); background:#f8fafc; }
.attention-list__title{ font-weight:600; }
.attention-list__meta{ color:var(--muted); font-size:12px; }
.attention-list__line{ font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }
.attention-list__empty{ color:var(--muted); font-size:13px; }
.attention-list--muted .attention-list__item{ border-style:dashed; }

@media (max-width: 900px){
  .dashboard-main{
    grid-template-columns: 1fr;
  }
}

.shortcuts{ display:grid; gap:8px; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.shortcut{ display:flex; align-items:flex-start; gap:12px; padding:12px; border:1px solid var(--line); border-radius:12px; text-decoration:none; color:inherit; transition:background .2s ease, border-color .2s ease; background:#fff; }
.shortcut:hover{ background:#f8fafc; border-color:#cbd5f5; }
.shortcut__icon{ font-size:20px; }
.shortcut__title{ display:block; font-weight:600; font-size:15px; }
.shortcut__description{ display:block; color:var(--muted); font-size:13px; }

.activity{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.activity__item{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.activity__title{ margin:0; font-weight:600; }
.activity__timestamp{ margin:4px 0 0; color:var(--muted); font-size:13px; }
.activity__line{ font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }
.activity__status{ width:10px; height:10px; border-radius:50%; background:var(--muted); }
.activity__item--success .activity__status{ background:var(--success); }
.activity__item--info .activity__status{ background:var(--accent); }
.activity__item--neutral .activity__status{ background:var(--line); }
.activity__item--alert .activity__status{ background:var(--warn); }
.dashboard-main .action-list,
.dashboard-main .attention-list,
.dashboard-main .activity{ gap:0; }
.dashboard-main .action-list__item,
.dashboard-main .attention-list__item,
.dashboard-main .activity__item{
  background:transparent;
  border:0;
  border-radius:0;
  padding:10px 0;
}
.dashboard-main .action-list__item:hover,
.dashboard-main .attention-list__item:hover,
.dashboard-main .activity__item:hover{ background:transparent; }
.dashboard-main .action-list li:not(:last-child) .action-list__item,
.dashboard-main .attention-list li:not(:last-child) .attention-list__item,
.dashboard-main .activity li:not(:last-child) .activity__item,
.dashboard-main .activity li:not(:last-child).activity__item{
  border-bottom:1px solid var(--line);
}

.tasks{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.tasks__item{ display:flex; align-items:center; justify-content:space-between; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.tasks__title{ font-weight:600; }
.tasks__due{ color:var(--muted); font-size:13px; }
.tasks__item--alert .tasks__due{ color:var(--warn); }

.badge{ padding:2px 8px; border-radius:999px; border:1px solid var(--line); font-size:12px; color:var(--muted); background:#fff; }
.badge--dropdown{ position:relative; display:inline-block; padding:0; border:0; background:transparent; }
.badge--dropdown > summary{ list-style:none; display:inline-flex; align-items:center; gap:6px; padding:2px 8px; border-radius:999px; border:1px solid var(--line); font-size:12px; color:var(--muted); background:#fff; cursor:pointer; }
.badge--dropdown > summary::-webkit-details-marker{ display:none; }
.badge--dropdown[open] > summary{ border-color:var(--accent); color:var(--text); }
.badge-dropdown-menu{ position:absolute; top:calc(100% + 8px); left:0; min-width:220px; padding:8px; border-radius:12px; border:1px solid var(--line); background:#fff; box-shadow:var(--shadow); z-index:80; }
.badge-dropdown-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.badge-dropdown-item{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 8px; border-radius:8px; text-decoration:none; color:var(--text); font-size:13px; }
.badge-dropdown-item:hover{ background:var(--panel-alt); }
.badge-dropdown-item.is-active{ background:var(--btn-blue-ghost); color:var(--btn-blue); font-weight:600; }
.badge-dropdown-empty{ padding:6px 8px; font-size:12px; color:var(--muted); }
.badge-dropdown-footer{ margin-top:8px; padding-top:8px; border-top:1px solid var(--line); }
.badge-dropdown-action{ display:block; text-decoration:none; font-size:13px; color:var(--btn-blue); font-weight:600; }
.badge-dropdown-action:hover{ text-decoration:underline; }
.subtle{ color: var(--muted); }
.flex-between{ display:flex; align-items:center; justify-content:space-between; gap: var(--spacing); }
.flex-end{ display:flex; align-items:center; justify-content:flex-end; }
.push-right{ margin-left:auto; }

.filters-inline{ display:flex; flex-wrap:wrap; gap:12px; align-items:end; margin-bottom:8px; }
.filters-inline .field{ flex: 0 0 220px; }
.filters-inline .field--wide{ flex-basis: 280px; }

.filters-inline .actions{ flex: 0 0 auto; align-self:end; }

.toolbar{ display:flex; align-items:end; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:8px; }
.toolbar__right{ display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.select--sm{ padding:6px 10px; min-height:36px; }


.chipbar{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.chip{ position:relative; }
.chip > summary{ list-style:none; }
.chip > summary::-webkit-details-marker{ display:none; }
.chip > summary{ cursor:pointer; }
.chip > summary.btn{ background:#f3f4f6; color:var(--btn-text-primary); border-color:#e5e7eb; box-shadow:none; }
.chip[open] > summary.btn{ border-color:#6b7280; }
.chip__trigger{ justify-content:flex-start; align-items:center; gap:12px; padding:10px 14px; min-height:0; min-width:0; }
.chip__meta{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; }
.chip__title{ font-size:12px; color:var(--muted); font-weight:500; text-transform:none; }
.chip__value{ font-size:14px; font-weight:600; color:var(--btn-text-primary); }
.chip__caret{ font-size:12px; color:var(--muted); margin-left:auto; }
.chip__panel{ position:absolute; top: calc(100% + 6px); left:0; z-index:60; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); padding:12px; min-width: 280px; }
.chip__panel .presets{ display:flex; flex-direction:column; gap:6px; }
.chip__panel .row{ display:flex; gap:8px; }
.chip__panel .row .field{ flex:1; }
.chip__options{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.chip__option{ width:100%; text-align:left; background:transparent; border:0; border-radius:8px; padding:8px 12px; font-size:13px; color:var(--btn-text-primary); cursor:pointer; transition:background .15s ease, color .15s ease; }
.chip__option:hover{ background:#f3f4f6; }
.chip__option.is-active{ background:var(--btn-blue-ghost); color:var(--btn-blue); font-weight:600; }
.chip__footer{ display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }
.chip__footer .btn{ min-height:38px; padding:0.5rem 1rem; }
@media (max-width: 640px){ .chip__panel{ position:fixed; left:12px; right:12px; top:auto; bottom:12px; min-width:auto; } }

/* ===== Invoice A4 layout matching the screenshot ===== */
.quote.A4 {
  --accent: #111;                   
  --ink: #111;
  --muted: #6b7280;
  --line: #e5e7eb;
  --radius: 10px;
  --thin: 0.8px;
  width: 210mm;
  height: 297mm; /* Standard A4 height */
  padding: 8mm 16mm 16mm;
  color: var(--ink);
  font: 12px/1.5 Inter, "Segoe UI", system-ui, Arial, sans-serif;
  background: #fff;
  margin: 0 auto;
  box-sizing: border-box;
  overflow: hidden; /* Prevent scroll */
  page-break-after: always; /* Force page break after */
  @media print {
    size: A4 portrait; /* Set print size */
    margin: 0;
  }
}

/* Header: brand left, company info right */
.quote-header {
  display: grid;
  grid-template-columns: 220px 1fr 280px; /* Adjusted right column width */
  grid-template-rows: auto;
  gap: 8px 16mm; /* Using mm units for A4 consistency */
  align-items: start;
  padding-top: -20px; /* Adjusted to move logo higher */
  margin-bottom: 16mm; /* Standard A4 margin */
}
.brand{ align-self:start; justify-self:start; }
.brand-details{ grid-column: 1 / 2; }
/* Ensure the customer card sits in the far right column */
.quote-header > .card{ grid-column: 3 / 4; justify-self: end; }
.brand .logo { height: 38px; width: auto; margin-bottom: 4mm; display:block; }
.brand .logo-placeholder{ font-weight:700; line-height:1.2; color:#111; }
.brand h1 { font-size: 24px; margin: 3mm 0 6mm; letter-spacing: .2px; }
.brand .meta { display: grid; grid-auto-rows: min-content; gap: 2mm; font-size: 11px; }
.brand .meta > div strong { min-width: 90px; display: inline-block; color: var(--muted); }

/* Company block (top-right box) */
address.company {
  border: var(--thin) solid var(--line);
  border-radius: var(--radius);
  padding: 10px 12px;
  font-style: normal;
  line-height: 1.35;
}
address.company strong {
  display: block; font-weight: 700; margin-bottom: 4px;
}
address.company span, address.company a { color: var(--accent); text-decoration: none; }

/* Section cards (Recipient / Client ID) */
.panel.duo {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 2mm; margin-bottom: 10mm;
}
.card {
  border: 0.1px solid rgba(11, 18, 32, 0.03);
  border-radius: var(--radius);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.995);
  box-shadow: none;
}
.card-title {
  background: #f7f7f8;
  font-weight: 700;
  padding: 8px 10px;
  border-bottom: var(--thin) solid var(--line);
}
.card-body { padding: 4px 6px; }
.card-body.cols-2 { 
  display: grid; grid-template-columns: 1fr 1fr; gap: 3px 8px;
}
.card-body.cols-2 > div span:first-child { color: var(--muted); display: inline-block; min-width: 120px; }

/* Optional extra recipients panel */
.panel { margin-bottom: 8mm; }

/* Line items table like screenshot */
table.lines { width: 100%; border-collapse: collapse; margin: 0 0 14mm; }
table.lines thead th {
  background: #f7f7f8; color: #111; font-weight: 700; padding: 8px 10px; border: var(--thin) solid var(--line);
}
table.lines tbody td {
  padding: 8px 10px; vertical-align: top; border-left: var(--thin) solid var(--line); border-right: var(--thin) solid var(--line);
}
table.lines tbody tr { border-bottom: var(--thin) solid var(--line); }
.t-right { text-align: right; }

/* Totals block (right) and VAT detail (left) like the image */
.totals { display: grid; grid-template-columns: 1fr 280px; gap: 18px; align-items: start; }
.summary {
  width: 100%;
  border-collapse: collapse;
  border: var(--thin) solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.summary td {
  padding: 7px 10px;
  border-bottom: var(--thin) solid var(--line);
}
.summary tr:last-child td { border-bottom: none; }
.summary tr td:first-child { font-weight: 500; }
.summary tr:last-child td { font-weight: 700; }
.summary strong { font-weight: 800; }

/* VAT detail mini-table (right) */
.vat-detail {
  width: 100%;
  max-width: 360px;
  border-collapse: collapse;
  margin-top: -7mm;
  justify-self: end;
  align-self: start;
}
.vat-detail th,
.vat-detail td {
  padding: 6px 10px;
  border: var(--thin) solid var(--line);
}
.vat-detail th {
  background: #f7f7f8;
  font-weight: 700;
}

/* Place VAT table and summary in the right column and align right */
.totals .vat-detail,
.totals .summary {
  grid-column: 2 / 3;
  justify-self: end;
  align-self: start;
}

/* Stack on small screens */
@media (max-width: 800px) {
  .totals .vat-detail,
  .totals .summary {
    grid-column: 1 / -1;
    justify-self: stretch;
  }
}

/* Amount in words & note */
.amount-words { margin: 10mm 0 6mm; font-style: italic; }

/* Legal footer */
footer.legal {
  color: var(--muted); font-size: 10.5px; margin-top: 10mm;
}
.footer-strip {
  margin-top: 16mm; padding-top: 6mm; border-top: var(--thin) solid var(--line);
  font-size: 10.5px; color: var(--accent); text-align: center;
}

/* Print tweaks */
@media print {
  .quote.A4 { box-shadow: none; }
}


/* Fullscreen modal preview */
.modal-fullscreen {
  position:fixed; inset:0; background:rgba(255,255,255,0.97);
  z-index:9999; padding:20px; overflow:auto; display:none;
}
.modal-fullscreen.is-open { display:block; }
.modal-fullscreen .modal-content { position:relative; height:100%; }
.preview-iframe {
  width:100%; height:calc(100vh - 80px); border:none; background:#fff;
  box-shadow:0 0 10px rgba(0,0,0,0.1);
}
.close-preview {
  position:absolute; top:16px; right:64px; font-size:24px;
  border:none; background:transparent; cursor:pointer;
}
.close-preview i { pointer-events:none; }
.download-btn {
  position:absolute; top:16px; right:16px;
}

.datepanel{ display:flex; gap:12px; align-items:flex-start; flex-wrap:wrap; }
.datepanel__cal{ width: 280px; max-width: 100%; border-right:1px solid var(--line); padding-right:12px; }
.datecal__header{ display:flex; align-items:center; justify-content:space-between; padding:8px; background:#f3f4f6; border-radius:8px; font-weight:600; }
.datecal__nav{ display:flex; align-items:center; gap:8px; }
.datecal__btn{ border:0; background:transparent; cursor:pointer; padding:4px 8px; font-size:16px; color:var(--muted); border-radius:8px; }
.datecal__btn:hover{ background:#f3f4f6; }
.datecal__grid{ display:grid; grid-template-columns: repeat(7, 1fr); gap:4px; padding:8px 0; }
.datecal__dow{ text-align:center; color:var(--muted); font-size:12px; }
.datecal__day{ text-align:center; padding:8px 0; border-radius:10px; cursor:pointer; }
.datecal__day:hover{ background:#f3f4f6; }
.datecal__day.out{ color:#cbd5e1; cursor:default; }
.datecal__day.sel{ outline:2px solid var(--btn-blue); outline-offset:-2px; }
.datecal__day.inrange{ background: var(--btn-blue-ghost); }
.datepanel__inputs{ display:flex; gap:8px; align-items:center; }
.datepanel__inputs .field{ flex:1; }
.datepanel__presets{ min-width: 160px; padding-left:12px; }
.datepanel__presets .btn{ width:100%; justify-content:flex-start; background:#f3f4f6; border-color:#e5e7eb; }
.datepanel__presets .btn:hover{ background:#e5e7eb; }

.field-label{ display:block; margin-bottom:6px; font-size:12px; color:var(--muted); font-weight:500; }
.chip__panel input[type="date"]{ width:100%; border:1px solid var(--line); border-radius:10px; padding:8px 10px; font-size:13px; color:var(--text); }
.chip__panel input[type="date"]:focus{ outline:none; border-color:var(--btn-blue); box-shadow:var(--btn-focus); }

.disclosure{ display:block; }
.disclosure > summary{ list-style:none; }
.disclosure > summary::-webkit-details-marker{ display:none; }

.kpi-menu-btn{ border:0; background:transparent; font-size:18px; line-height:1; cursor:pointer; color:var(--muted); padding:4px 6px; border-radius:8px; }
.kpi-menu-btn:hover{ background:var(--panel-alt); }
.kpi-menu{ position:absolute; margin-top:6px; right:12px; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow); display:none; min-width:140px; z-index:40; }
.kpi-has-menu{ position:relative; }
.kpi-menu.open{ display:block; }
.kpi-menu a{ display:block; padding:8px 10px; text-decoration:none; color:var(--text); }
.kpi-menu a:hover{ background:var(--panel-alt); }

.modal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.5); padding:16px; z-index:100; }
.modal.open{ display:flex; }
.modal-content{ background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:16px; width: min(94vw, 720px); max-height: 90vh; overflow: auto; }
.modal-lg{ width: min(95vw, 960px); }

.sidebar-toggle{ display:none; }
@media (max-width: 1024px){
  .app-shell{ grid-template-columns: 1fr; grid-template-areas:
    "topbar" "main"; }
  .sidebar{ position:fixed; left:-280px; top:0; width:var(--sidebar-w); transition:left .2s ease; z-index:20; height:100vh; }
  .sidebar.open{ left:0; }
  .sidebar-toggle{ display:inline-flex; }
}

.hide-sm{ display:inline; }
@media (max-width: 640px){ .hide-sm{ display:none; } }

.auth{ display:flex; align-items:center; justify-content:center; min-height: 100vh; }
.auth-card{ width:100%; max-width:420px; padding:28px; }
.auth-header{ text-align:center; margin-bottom:16px; }
.auth-header .logo{ width:40px; height:40px; border-radius:10px; background:#000; display:inline-block; }
.auth-title{ margin:8px 0 0 0; font-size:22px; font-weight:700; }
.auth-sub{ margin:0; color:var(--muted); }
.auth-actions{ display:flex; align-items:center; justify-content:space-between; margin-top:8px; }
.auth-footer{ margin-top:14px; text-align:center; color:var(--muted); }

.auth-page{ background: var(--panel-alt); }
.auth-page .main{ padding:0; background: var(--panel-alt); }
.multi-list{ display:flex; flex-direction:column; gap:6px; max-height:220px; overflow:auto; padding:4px; margin-top:6px; }
.multi-list label{ display:flex; align-items:center; gap:10px; padding:6px 8px; border-radius:8px; cursor:pointer; }
.multi-list label:hover{ background:#f8fafc; }
.multi-list input[type="checkbox"]{ width:16px; height:16px; }

.btn{ -webkit-font-smoothing: antialiased; font-family: var(--btn-font); font-weight: var(--btn-weight); line-height: 1; display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding: 0.875rem 1.125rem; min-height: 44px; min-width: 44px; border-radius: var(--btn-radius); border: 1px solid var(--btn-border); background:#fff; color: var(--btn-text-primary); box-shadow: var(--btn-shadow); cursor:pointer; user-select:none; text-decoration:none; transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .02s ease, box-shadow .15s ease; }
.btn:hover{ background:#f8fafc; }

.btn--primary, .btn.primary{ background: var(--btn-blue); border-color: var(--btn-blue); color: var(--btn-text-on-blue); }
.btn--primary:hover, .btn.primary:hover{ background: var(--btn-blue-hover); border-color: var(--btn-blue-hover); }
.btn--primary:active, .btn.primary:active{ background: var(--btn-blue-active); border-color: var(--btn-blue-active); box-shadow: var(--btn-shadow-press); }
.btn--black{ background:var(--black); border-color:var(--black); color:var(--white); }
.btn--black:hover{ background:#1f2933; border-color:#1f2933; }
.btn--black:active{ background:#111827; border-color:#111827; box-shadow:var(--btn-shadow-press); }

.btn--secondary, .btn.secondary{ background:#fff; color: var(--btn-blue); border-color: var(--btn-blue); }
.btn--secondary:hover, .btn.secondary:hover{ background: var(--btn-blue-ghost); }
.btn--secondary:active, .btn.secondary:active{ background: rgba(0,106,255,0.18); box-shadow: var(--btn-shadow-press); }

.btn--tertiary, .btn.ghost{ background: transparent; color: var(--btn-blue); border-color: transparent; box-shadow:none; }
.btn--tertiary:hover, .btn.ghost:hover{ background: var(--btn-blue-ghost); }
.btn--tertiary:active, .btn.ghost:active{ background: rgba(0,106,255,0.18); box-shadow: var(--btn-shadow-press); }

.btn--destructive{ --btn-blue: #e11900; --btn-blue-hover: #c31200; --btn-blue-active: #990f00; --btn-blue-ghost: rgba(225, 25, 0, 0.12); }

.btn.black{ background:#000; border-color:#000; color:#fff; }
.btn.black:hover{ background:#333; border-color:#333; }

.btn--sm{ padding: 0.625rem .875rem; min-height: 36px; font-size: 0.9375rem; }
.btn--lg{ padding: 1rem 1.25rem; min-height: 48px; font-size: 1.0625rem; }

.btn > .icon{ width: 1.1em; height: 1.1em; display:inline-block; flex:0 0 auto; }

.btn:disabled, .btn[aria-disabled="true"]{ opacity:.45; cursor:not-allowed; box-shadow:none; }

.btn:focus-visible{ outline:none; box-shadow: var(--btn-focus); }

@media (forced-colors: active){
  .btn{ border:1px solid ButtonText; }
  .btn--primary, .btn.primary{ background: ButtonFace; color: ButtonText; }
}

.flash{ position: fixed; right:16px; bottom:16px; display:grid; gap:8px; z-index: 300; }
.flash-message{ padding:12px 16px; border-radius:12px; font-size:14px; font-weight:500; background:var(--panel-alt); color:var(--text); box-shadow:var(--shadow); }
.flash-message--success{ background:#ecfdf5; color:#047857; }
.flash-message--error{ background:#fee2e2; color:#b91c1c; }
.flash-message--danger{ background:#fee2e2; color:#b91c1c; }
.flash-message--info{ background:var(--panel-alt); color:var(--text); }
.flash-message--warning{ background:#fef3c7; color:#b45309; }
.alert{ padding:10px 12px; border-radius:10px; border:1px solid var(--line); background:#fff; box-shadow: var(--shadow); }
.alert-success{ border-color:#bbf7d0; background:#f0fdf4; }
.alert-error{ border-color:#fecaca; background:#fef2f2; }

label{ display:block; margin:8px 0 4px; color:#111; font-weight:600; }
input, select, textarea{ width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
input:focus, select:focus, textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(14,165,233,.15); }



/* ====================
   Business pages
==================== */
.card-lite{ background:#fff; border:1px solid #f0f1f3; border-radius:12px; padding:16px 18px; }
.card-elevated{
  background:var(--surface);
  border:1px solid rgba(255,255,255,0.4);
  border-radius:20px;
  padding:28px;
  box-shadow:0 24px 40px rgba(15,23,42,0.08);
}
.biz-create-page{ background:linear-gradient(160deg,#f4f8ff 0%,#fdfdfd 45%,#f7f9fc 100%); }
.biz-create-hero{ margin-bottom:32px; }
.biz-create-hero__content{ display:flex; justify-content:space-between; align-items:flex-start; gap:24px; }
.biz-create-cta{ display:flex; gap:12px; align-items:center; }
.biz-create-title{ font-size:2rem; font-weight:700; margin-bottom:8px; }
.biz-create-subtitle{ color:var(--muted); max-width:520px; margin-bottom:0; }
.eyebrow{ text-transform:uppercase; letter-spacing:0.18em; font-size:0.75rem; color:var(--accent); font-weight:700; margin-bottom:12px; }
.biz-create-progress{ display:flex; gap:18px; list-style:none; padding:24px 0 0; margin:24px 0 0; border-top:1px solid rgba(37,99,235,0.15); }
.biz-create-progress li{ display:flex; align-items:center; gap:10px; color:var(--muted); font-weight:600; }
.biz-create-progress li.active{ color:var(--black); }
.step-index{ width:34px; height:34px; border-radius:12px; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; font-weight:700; }
.biz-form{ display:flex; flex-direction:column; gap:24px; }
.biz-form-grid{ display:grid; gap:24px; }
.card-section{ background:var(--surface); border:1px solid rgba(229,231,235,0.8); border-radius:18px; padding:24px 28px; box-shadow:0 18px 32px rgba(15,23,42,0.04); }
.card-section__header{ display:flex; justify-content:space-between; gap:16px; align-items:flex-start; }
.card-section__title{ font-size:1.1rem; font-weight:700; margin-bottom:6px; }
.card-section__subtitle{ color:var(--muted); margin-bottom:0; }
.badge-pill{ background:rgba(37,99,235,0.12); color:var(--accent); border-radius:999px; font-size:0.75rem; font-weight:700; padding:6px 12px; align-self:flex-start; }
.card-section .form-grid{ margin-top:20px; }
.form-grid{ display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.form-actions{ display:flex; justify-content:flex-end; padding-top:8px; }
.biz-header{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.biz-header .actions{ display:flex; gap:12px; flex-shrink:0; }
.biz-list{ display:flex; flex-direction:column; gap:12px; }
.biz-picker{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.biz-search .input-with-icon{ position:relative; }
.biz-search .input-with-icon i{ position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--muted); font-size:14px; }
.biz-search .input-with-icon .form-control{ padding-left:36px; }
.biz-count{ font-weight:600; letter-spacing:.01em; }
.biz-footer a{ color:var(--btn-blue); text-decoration:none; font-weight:600; }
.biz-footer a:hover{ text-decoration:underline; }
.biz-row{
  border:1px solid var(--black);
  border-radius:12px;
  padding:14px 16px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  background:#fff;
}
.biz-row:hover{ box-shadow:0 4px 22px rgba(0,0,0,.06); }
.biz-row .info .name{ font-weight:700; }
.biz-row .info .meta{ color:var(--muted); font-size:.9rem; margin-top:2px; }
.biz-card{
  border:1px solid #e7ebf0;
  border-radius:14px;
  padding:16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:#fff;
  box-shadow:0 6px 18px rgba(15,23,42,0.06);
  cursor:pointer;
  transition: box-shadow .15s ease, background-color .15s ease, border-color .15s ease;
}
.biz-card:hover{ box-shadow:0 10px 26px rgba(15,23,42,0.08); border-color:#d9e1ee; background:#f8faff; }
.biz-card:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(0,106,255,0.2); border-color:var(--btn-blue); }
.biz-card.is-loading{ background:#f8fafc; }
.biz-card__heading{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.biz-card__title{ font-weight:700; font-size:1rem; color:var(--text); }
.biz-card__meta{ color:var(--muted); font-size:.9rem; margin-top:4px; }
.biz-card__cta .btn{ min-width:120px; justify-content:center; }
.badge-muted{ background:#f3f4f6; color:#6b7280; border-radius:999px; font-size:0.75rem; font-weight:600; padding:4px 10px; }
.select-spinner{
  display:none;
  width:14px;
  height:14px;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  animation: spin .6s linear infinite;
}
.biz-card.is-loading [data-select-label]{ display:none; }
.biz-card.is-loading .select-spinner{ display:inline-block; }
.biz-card.is-loading .btn{ pointer-events:none; }
.badge-dark{ background:var(--black); color:#fff; border-radius:12px; padding:8px 12px; font-weight:700; display:inline-block; }

@media (max-width: 640px){
  .biz-create-hero__content{ flex-direction:column; }
  .biz-create-progress{ flex-wrap:wrap; }
  .biz-create-cta{ width:100%; }
  .biz-create-cta .btn{ width:100%; justify-content:center; }
  .card-section{ padding:20px; }
  .form-actions{ justify-content:stretch; }
  .form-actions .btn{ width:100%; }
  .biz-header{ flex-direction:column; align-items:flex-start; }
  .biz-header .actions{ width:100%; }
  .biz-header .actions .btn{ width:100%; text-align:center; }
  .biz-row{ flex-direction:column; align-items:flex-start; }
  .biz-row .cta{ width:100%; }
  .biz-card{ flex-direction:column; align-items:flex-start; }
  .biz-card__cta{ width:100%; }
  .biz-card__cta .btn{ width:100%; }
  .btn-dark-outline, .badge-dark, .btn-dark{ width:100%; text-align:center; }
}

@keyframes spin{
  to{ transform:rotate(360deg); }
}

/* ====================
   Business onboarding form
==================== */
.form-card,
.wizard-shell{ background:#fff; border:1px solid #d7dbe4; border-radius:28px; box-shadow:0 24px 45px rgba(15,23,42,.12); }
.wizard-shell{ max-width:920px; margin:0 auto; display:grid; grid-template-columns:280px minmax(0,1fr); overflow:hidden; }
.wizard-shell__sidebar{ background:#f3f4f8; border-right:1px solid #e2e8f0; padding:0; display:flex; flex-direction:column; }
.wizard-shell__sidebar-header{ padding:26px 24px 16px; border-bottom:1px solid #e2e8f0; }
.wizard-sidebar-step{ margin:0; font-weight:700; color:#374151; font-size:1.95rem; }
.wizard-stepper{ display:flex; flex-direction:column; }
.wizard-stepper__item{ position:relative; width:100%; border:0; border-left:3px solid transparent; border-radius:0; padding:18px 20px 18px 24px; background:transparent; display:flex; align-items:flex-start; gap:12px; text-align:left; color:inherit; transition:all .25s ease; }
.wizard-stepper__item:not(:last-child)::after{ content:""; position:absolute; left:38px; top:46px; height:34px; width:2px; background:#d1d5db; }
.wizard-stepper__icon{ width:32px; height:32px; border-radius:50%; border:2px solid #d1d5db; background:#f8fafc; color:#6b7280; display:inline-flex; align-items:center; justify-content:center; font-size:.92rem; font-weight:700; flex:0 0 32px; }
.wizard-stepper__text{ min-width:0; display:flex; flex-direction:column; gap:3px; flex:1; }
.wizard-stepper__title{ font-weight:700; font-size:1rem; color:#1f2937; }
.wizard-stepper__helper{ color:#6b7280; font-size:.86rem; }
.wizard-stepper__item.is-current{ border-left-color:#2563eb; background:#eaf2ff; }
.wizard-stepper__item.is-current .wizard-stepper__icon{ background:#2563eb; color:#fff; border-color:#2563eb; }
.wizard-stepper__item.is-complete .wizard-stepper__icon{ background:#f8fafc; color:#6b7280; border-color:#cfd5df; }
.wizard-stepper__item:disabled{ cursor:not-allowed; }
.wizard-shell__panel{ padding:26px 34px 16px; background:#fff; min-height:620px; display:flex; flex-direction:column; }
.wizard-mobile-stepper{ display:none; }
.wizard-progress-track{ width:100%; height:10px; border-radius:999px; overflow:hidden; background:#e5e7eb; margin-bottom:16px; }
.wizard-progress-track__bar{ height:100%; background:#2563eb; transition:width .28s ease; }
.wizard-panel-header{ margin-bottom:14px; }
.wizard-panel-header__meta{ margin:0; color:#374151; font-size:2rem; font-weight:700; }
.wizard-panel-header__title{ margin:8px 0 0; font-size:2.6rem; letter-spacing:-0.02em; }
.wizard-panel-header__subtitle{ margin:6px 0 0; color:#6b7280; font-size:1.45rem; }
.wizard-panel-body{ animation:wizardFade .24s ease; }
.section{ padding:12px 0 18px; border-top:1px solid var(--border); }
.section:first-of-type{ border-top:none; }
.section-title{ font-weight:600; margin-bottom:10px; }
.grid.one{ grid-template-columns: 1fr; }
.grid.two{ grid-template-columns: 1fr 1fr; }
.grid.three{ grid-template-columns: 1fr 1fr 1fr; }
@media (max-width: 900px){
  .grid.two,
  .grid.three{ grid-template-columns:1fr; }
}
.field .label{ display:block; font-size:.9rem; margin-bottom:6px; color:#111; }
.input{ width:100%; border:1px solid var(--border); background:#fff; border-radius:8px; padding:10px 12px; outline:none; }
.input:focus{ border-color:#111; box-shadow:0 0 0 2px rgba(0,0,0,.05); }
.err{ color:#b91c1c; font-size:.85rem; margin-top:4px; }
.form-actions{ padding-top:12px; border-top:1px solid var(--border); }
.wizard-actions{ position:sticky; bottom:0; background:#fff; padding:14px 0 0; margin-top:12px; display:flex; justify-content:space-between; align-items:center; gap:10px; }
.wizard-actions__right{ margin-left:auto; display:flex; gap:10px; }
.btn-continue{ background:var(--black); color:#fff; border:1px solid var(--black); padding:12px 22px; border-radius:12px; font-weight:700; }
.wizard-actions .btn{ border-radius:12px; min-width:116px; justify-content:center; }
.btn-continue:hover{ opacity:.92; }
@media (max-width: 960px){
  .wizard-shell{ grid-template-columns:1fr; }
  .wizard-shell__sidebar{ border-right:none; border-bottom:1px solid var(--border); }
  .wizard-sidebar-step{ font-size:1.1rem; }
  .wizard-stepper{ flex-direction:row; overflow:auto; padding-bottom:2px; }
  .wizard-stepper__item{ min-width:220px; border-left:0; border-bottom:3px solid transparent; border-radius:0; }
  .wizard-stepper__item.is-current{ border-bottom-color:#2563eb; }
  .wizard-stepper__item:not(:last-child)::after{ display:none; }
  .wizard-shell__panel{ padding:20px; }
  .wizard-panel-header__title{ font-size:1.8rem; }
  .wizard-panel-header__subtitle{ font-size:1rem; }
}
@media (max-width: 640px){
  .wizard-shell__sidebar{ display:none; }
  .wizard-shell__panel{ padding:16px; min-height:auto; }
  .wizard-mobile-stepper{ display:flex; justify-content:space-between; gap:8px; margin-bottom:10px; }
  .wizard-mobile-stepper__counter{ font-size:.78rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
  .wizard-mobile-stepper__title{ font-weight:700; font-size:.9rem; }
  .wizard-actions{ flex-direction:column-reverse; align-items:stretch; }
  .wizard-actions__right{ width:100%; display:grid; grid-template-columns:1fr; margin-left:0; }
  .wizard-panel-header__meta{ font-size:1.05rem; }
  .wizard-panel-header__title{ font-size:1.55rem; }
  .wizard-panel-header__subtitle{ font-size:.95rem; }
}
@keyframes wizardFade{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:translateY(0);} }

/* ====================
   Settings
==================== */
.settings-page{ display:flex; flex-direction:column; gap:28px; }
.settings-page__header{ display:flex; align-items:flex-start; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.settings-page__title{ margin:0; font-size:28px; font-weight:700; letter-spacing:-0.02em; }
.settings-page__subtitle{ margin:6px 0 0; color:var(--muted); max-width:520px; }
.settings-page__tabs{ display:flex; flex-wrap:wrap; gap:12px; }
.settings-page__content{ display:flex; flex-direction:column; gap:28px; }
.settings-page .tabs .btn{ background:#f3f4f6; color: var(--btn-text-primary); border-color:#e5e7eb; box-shadow:none; }
.settings-page .tabs .btn:hover{ background:#e5e7eb; }
.settings-page .tabs .btn.primary,
.settings-page .tabs .btn.btn--primary{ background:#111827; color:#fff; border-color:#111827; }
.settings-page .tabs .btn.primary:hover,
.settings-page .tabs .btn.btn--primary:hover{ background:#1f2937; }
.settings-page .tabs .btn.primary:active,
.settings-page .tabs .btn.btn--primary:active{ background:#0f172a; }

.settings-stack{ display:flex; flex-direction:column; gap:24px; }
.settings-card{ background:var(--surface); border:1px solid rgba(15,23,42,0.08); border-radius:24px; padding:26px 30px; box-shadow:0 18px 32px rgba(15,23,42,0.04); }
.settings-card__header{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; }
.settings-card__title{ margin:0; font-size:18px; font-weight:600; letter-spacing:-0.01em; }
.settings-card__subtitle{ margin:4px 0 0; color:var(--muted); font-size:14px; max-width:540px; }
.settings-card__actions{ display:flex; gap:8px; flex-wrap:wrap; }
.settings-card__body{ margin-top:22px; display:flex; flex-direction:column; gap:20px; }
.settings-layout{ display:flex; flex-direction:column; gap:24px; }
.settings-layout__main{ display:flex; flex-direction:column; gap:20px; }
.settings-layout__aside{ background:var(--panel-alt); border:1px solid rgba(15,23,42,0.08); border-radius:18px; padding:20px 22px; display:flex; }
.settings-hint{ display:flex; flex-direction:column; gap:12px; }
.settings-hint__title{ margin:0; font-size:15px; font-weight:600; letter-spacing:-0.01em; }
.settings-hint__subtitle{ margin:0; color:var(--muted); font-size:13px; }
.settings-hint__list{ margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.settings-hint__item{ display:flex; align-items:flex-start; gap:12px; }
.settings-hint__token{ margin:0; font-family:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; font-size:12px; font-weight:600; color:#0f172a; background:var(--accent-soft); border-radius:8px; padding:4px 8px; white-space:nowrap; }
.settings-hint__description{ margin:0; color:var(--muted); font-size:13px; }
.settings-hint__bullets{ margin:0; padding-left:18px; display:flex; flex-direction:column; gap:10px; color:var(--muted); font-size:13px; }
.settings-hint__bullets li{ margin:0; }
@media (min-width: 960px){
  .settings-layout{ flex-direction:row; align-items:flex-start; }
  .settings-layout__main{ flex:1; }
  .settings-layout__aside{ flex:0 0 320px; }
}

.settings-form-actions{ display:flex; justify-content:flex-end; }

.settings-formset{ display:flex; flex-direction:column; gap:16px; }
.registration-row{ border:1px dashed rgba(15,23,42,0.15); border-radius:18px; padding:18px; background:var(--panel); }
.settings-formset__grid{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); align-items:end; }
.settings-formset__grid .btn{ align-self:center; }

.settings-table{ border:1px solid rgba(148,163,184,0.35); border-radius:18px; overflow:hidden; background:#fff; --settings-table-columns: minmax(0,2fr) repeat(3,minmax(0,1fr)); }
.settings-table__header{ display:grid; grid-template-columns: var(--settings-table-columns); gap:12px; padding:14px 20px; background:var(--panel-alt); text-transform:uppercase; font-size:12px; letter-spacing:0.08em; color:var(--muted); font-weight:600; }
.settings-table__row{ display:grid; grid-template-columns: var(--settings-table-columns); gap:12px; padding:16px 20px; border-top:1px solid rgba(226,232,240,0.7); align-items:center; }
.settings-table--two{ --settings-table-columns: minmax(0,2fr) minmax(0,1fr); }
.settings-table__primary{ font-weight:600; }
.settings-table__row span:last-child{ justify-self:flex-start; }

@media (max-width: 768px){
  .settings-table__header,
  .settings-table__row{ grid-template-columns:minmax(0,1fr); }
  .settings-table__header span:not(:first-child),
  .settings-table__row span:not(:first-child){ display:flex; align-items:center; gap:8px; }
}

.status-pill{ display:inline-flex; align-items:center; gap:6px; padding:0.3rem 0.75rem; border-radius:999px; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:0.08em; }
.status-pill--success{ background:#dcfce7; color:#166534; }
.status-pill--muted{ background:#e2e8f0; color:#475569; }

.settings-empty{ border:1px dashed rgba(148,163,184,0.45); border-radius:18px; padding:28px; text-align:center; background:rgba(241,245,249,0.4); display:flex; flex-direction:column; gap:8px; align-items:center; }
.settings-empty__title{ margin:0; font-size:18px; font-weight:600; }
.settings-empty__subtitle{ margin:0; color:var(--muted); max-width:360px; }
.empty-state{ border:1px dashed var(--line); border-radius:16px; padding:32px 24px; text-align:center; background:var(--panel-alt); display:flex; flex-direction:column; gap:8px; align-items:center; }
.empty-state__icon{ font-size:32px; color:var(--muted); }
.empty-state__title{ margin:0; font-size:18px; font-weight:600; }
.empty-state__subtitle{ margin:0; color:var(--muted); max-width:360px; }
.empty-state__action{ margin-top:8px; }
.empty-state--compact{ border:0; background:transparent; padding:0; gap:4px; }
.empty-state--compact .empty-state__title{ font-size:14px; font-weight:500; }
.empty-state--compact .empty-state__subtitle{ font-size:13px; }

.settings-summary{ display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); margin:0; }
.settings-summary__item{ padding:18px; border:1px solid rgba(226,232,240,0.8); border-radius:16px; background:var(--panel); display:flex; flex-direction:column; gap:6px; }
.settings-summary__label{ margin:0; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); }
.settings-summary__value{ margin:0; font-size:16px; font-weight:600; color:var(--text); }

/* ====================
   Invoice list — mirror of Quotes
   (keeps class names prefixed with invoices- but styles are identical)
===================== */

/* Layout */
.invoices-main{
  flex:1; display:flex; flex-direction:column; min-height:0;
}
.invoices-main .page{
  flex:1; display:flex; flex-direction:column; min-height:0;
}
.invoices-main .page.px{ padding:0rem; }
.invoices-main .content{
  flex:1; display:flex; flex-direction:column; gap:12px; min-height:0;
}
.invoices-main .card{
  background: var(--white); border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.03);
}

/* Header (mirror quotes-header*) */
.invoices-header{
  display:flex; flex-direction:column; gap:12px; padding:8px 0 8px;
}
.invoices-header__title{ margin:0; font-size:26px; font-weight:600; text-align:left; }
.invoices-header__subtitle{ margin:0; color:var(--muted); }
.invoices-header__top{ display:flex; align-items:center; gap:16px; }
.invoices-header__actions{ margin-left:auto; display:flex; align-items:center; gap:10px; }

/* Breadcrumb (mirror quotes-breadcrumb*) */
.invoices-breadcrumb{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); }
.invoices-breadcrumb a{ color:inherit; text-decoration:none; font-weight:500; }
.invoices-breadcrumb a:hover{ color:var(--text); }
.invoices-breadcrumb__divider{ color:var(--border); }
.invoices-breadcrumb__current{ font-weight:600; color:var(--text); }

/* Toolbar (mirror quotes-toolbar*) */
.invoices-toolbar{ margin-bottom:0; padding:16px; overflow:visible; }
.invoices-toolbar__form{
  width:100%; display:flex; flex-wrap:wrap; align-items:center; gap:12px;
}
.invoices-toolbar__search{ flex:1 1 280px; min-width:220px; }
.invoices-toolbar__state{ display:none; }
.invoices-toolbar__filters{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; }

.invoices-toolbar .pill-dropdown{ position:relative; display:inline-block; }
.invoices-toolbar .pill-dropdown > summary{ list-style:none; cursor:pointer; }
.invoices-toolbar .pill-dropdown > summary::-webkit-details-marker{ display:none; }
.invoices-toolbar .pill-dropdown-label{
  display:inline-flex; align-items:center; gap:8px; border:1px solid var(--border); border-radius:999px; background:#fff; padding:8px 14px; font-size:13px; color:var(--text);
}
.invoices-toolbar .pill-dropdown[open] > summary .pill-dropdown-label{
  border-color:var(--accent); box-shadow:0 0 0 3px var(--btn-blue-ghost);
}
.invoices-toolbar .pill-dropdown-title{ color:var(--muted); font-weight:500; }
.invoices-toolbar .pill-dropdown-value{ font-weight:600; }
.invoices-toolbar .pill-dropdown-caret{ font-size:10px; line-height:1; color:var(--muted); }
.invoices-toolbar .pill-dropdown-menu{
  position:absolute; top:calc(100% + 8px); left:0; min-width:200px; background:#fff; border:1px solid var(--border); border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,0.08); padding:8px 0; z-index:50;
}
.invoices-toolbar .pill-dropdown-list{
  list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px;
}
.invoices-toolbar .pill-dropdown-item{
  width:100%; text-align:left; background:none; border:0; padding:8px 16px; font-size:13px; color:var(--text); cursor:pointer; border-radius:8px;
}
.invoices-toolbar .pill-dropdown-item:hover{ background:var(--panel-alt); }
.invoices-toolbar .pill-dropdown-item.is-active{
  background:var(--btn-blue-ghost); color:var(--btn-blue); font-weight:600;
}

/* Buttons (match quotes buttons) */
.invoices-main .btn{ border-radius:12px; padding:9px 16px; font-weight:500; border:1px solid var(--black); }
.invoices-main .btn.ghost{ background:#fff; color:#111; border-color:var(--border); }
.invoices-main .btn.ghost.sm{ padding:6px 10px; font-size:12px; }
.invoices-main .btn.primary, .invoices-main .btn.btn--black{ background:var(--black); color:#fff; border-color:var(--black); }

/* Analytics (quotes analytics are global .analytics-*, so we only ensure spacing) */
.invoices-analytics{ margin-top:0; }
/* Optional: reuse existing global .analytics-* rules; nothing else needed */

/* Table (mirror quotes-table*) */
.invoices-table,
.payments-table,
.receipts-table{ margin-top:0; padding:20px; display:flex; flex-direction:column; gap:18px; }
.invoices-table-wrap,
.payments-table-wrap,
.receipts-table-wrap{ display:flex; flex-direction:column; gap:12px; }
.invoices-table-container,
.payments-table-container,
.receipts-table-container{
  border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--white);
}
.invoices-table__table,
.payments-table .table,
.receipts-table .table{ width:100%; border-collapse:collapse; font-size:14px; }
.invoices-table__table thead th,
.payments-table .table thead th,
.receipts-table .table thead th{
  text-align:left; padding:14px 16px; color:var(--muted); font-weight:500; background:#f9fafb;
}
.invoices-table__table thead a,
.payments-table .table thead a,
.receipts-table .table thead a{
  color:inherit; text-decoration:none; display:inline-flex; align-items:center; gap:6px;
}
.invoices-table__table thead a:hover,
.payments-table .table thead a:hover,
.receipts-table .table thead a:hover{ color:var(--text); }
.invoices-table__table tbody td,
.payments-table .table tbody td,
.receipts-table .table tbody td{
  padding:16px; border-top:1px solid var(--line); vertical-align:middle;
}
.invoices-table__table tbody tr,
.payments-table .table tbody tr,
.receipts-table .table tbody tr{ transition:background .15s ease; }
.invoices-table__table tbody tr:hover,
.payments-table .table tbody tr:hover,
.receipts-table .table tbody tr:hover{ background:#f8fafc; }
.invoices-table__checkbox,
.quotes-table__checkbox,
.payments-table__checkbox,
.receipts-table__checkbox,
.table__checkbox,
.payments-table .table .invoices-table__checkbox,
.receipts-table .table .invoices-table__checkbox{ width:36px; text-align:center; }
.invoices-table__checkbox input[type="checkbox"],
.quotes-table__checkbox input[type="checkbox"],
.payments-table__checkbox input[type="checkbox"],
.receipts-table__checkbox input[type="checkbox"],
.table__checkbox input[type="checkbox"]{ width:16px; height:16px; accent-color:var(--btn-blue); display:inline-block; }

/* Amount display (mirror quotes-amount helpers) */
.invoices-amount{ font-weight:600; display:block; color:var(--text); }
.invoices-amount__hint{ color:var(--muted); margin-top:2px; }
.invoices-amount--missing{ color:var(--muted); }

/* Badges (mirror quotes badges) */
.invoices-main .badge{ padding:4px 8px; border-radius:999px; font-size:12px; font-weight:600; }
.invoices-main .badge.green{ color:#065f46; background:#d1fae5; }
.invoices-main .badge.red{ color:#991b1b; background:#fee2e2; }
.invoices-main .badge.gray{ color:#374151; background:#e5e7eb; }
.invoices-main .badge.blue{ color:#1d4ed8; background:#dbeafe; }

/* Empty state */
.invoices-main .empty,
.payments-table .empty,
.receipts-table .empty{ text-align:center; color:#9ca3af; padding:28px 0; }

/* Pager (mirror quotes pager) */
.invoices-main .pager{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px;
  padding:12px 16px; border-top:1px solid var(--border); background:var(--surface, var(--panel, #fff));
}
.invoices-main .pager-summary{ color:#6b7280; font-size:13px; }
.invoices-main .pager-nav{ display:flex; align-items:center; gap:12px; margin-left:auto; }
.invoices-main .pager-list{ display:flex; align-items:center; gap:6px; list-style:none; margin:0; padding:0; }
.invoices-main .pager-link{
  display:inline-flex; align-items:center; justify-content:center; min-width:32px; height:32px; padding:0 12px; border-radius:999px; border:1px solid var(--border); font-size:13px; color:var(--text); text-decoration:none; transition:all .15s ease;
}
.invoices-main .pager-link:hover{ border-color:var(--accent); color:var(--accent); }
.invoices-main .pager-link.is-active{ background:var(--black); color:#fff; border-color:var(--black); cursor:default; }
.invoices-main .pager-link.is-disabled{ pointer-events:none; opacity:.4; }
.invoices-main .pager-ellipsis{ color:#9ca3af; font-size:14px; padding:0 4px; }

/* Misc (mirror quotes helpers) */
.invoices-main .text-right{ text-align:right; }
.invoices-main .w-32{ width:32px; }
.invoices-main .ml{ margin-left:6px; }
.invoices-main .kebab{ cursor:pointer; padding:4px 8px; border-radius:8px; }
.invoices-main .kebab:hover{ background:#f3f4f6; }

/* Responsive mirrors */
@media (max-width: 768px){
  .invoices-header__title{ font-size:24px; }
  .invoices-header__top{ flex-direction:column; align-items:flex-start; gap:8px; }
  .invoices-header__actions{ margin-left:0; width:100%; justify-content:flex-start; }
}
@media (max-width: 640px){
  .invoices-toolbar__search{ flex:1 1 100%; }
}

/* Invoice create layout */
.invoice-create{padding:0rem; display:flex; flex-direction:column; gap:1.5rem;}
.invoice-create__topbar{display:flex; justify-content:space-between; align-items:center; gap:1rem;}
.invoice-create__breadcrumbs{display:flex; align-items:center; gap:.5rem; font-size:14px; color:var(--muted);}
.invoice-create__back{color:var(--btn-blue); text-decoration:none; font-weight:600;}
.invoice-create__chevron{color:var(--muted); font-size:12px;}
.invoice-create__current{color:var(--text); font-weight:600;}
.invoice-create__actions{display:flex; gap:.75rem;}
.invoice-create__actions .btn{ padding:.5rem 1.25rem; font-size:14px;}
.invoice-create__layout{display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:1.5rem; align-items:start;}
.invoice-create__main{display:flex; flex-direction:column; gap:1rem;}
.invoice-create__sidebar{display:flex; flex-direction:column; gap:1rem;}

.invoice-card{background:var(--white); border:1px solid var(--border); border-radius:16px; box-shadow:0 1px 2px rgba(15,23,42,0.04);}
.invoice-card__header{display:flex; justify-content:space-between; align-items:center; padding:1.25rem 1.5rem 0;}
.invoice-card__hint{margin-left:auto; font-size:13px; color:var(--muted);}
.invoice-card__header h2{font-size:16px; font-weight:600; margin:0;}
.invoice-card__body{padding:1rem 1.5rem 1.5rem; display:flex; flex-direction:column; gap:1rem;}
.invoice-card .link{background:none; border:0; color:var(--btn-blue); font-weight:500; cursor:pointer; padding:0;}
.invoice-card .link:hover{text-decoration:underline;}

.invoice-card__attachments{display:grid; grid-template-columns:minmax(0,1fr); gap:1rem 1.25rem;}
.invoice-card__attachment{display:flex; flex-direction:column; gap:.5rem;}

.invoice-line-items{gap:1.25rem;}
.invoice-line-items__table{border:1px solid var(--border); border-radius:12px; overflow:hidden;}
.invoice-line-items__header{display:grid; grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,1fr)) auto; background:var(--panel-alt); padding:.75rem 1rem; font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.05em;}
.invoice-line-items__row{display:grid; grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,1fr)) auto; gap:.5rem; padding:1rem; font-size:14px; align-items:center; background:var(--white);}
.invoice-line-items__row + .invoice-line-items__row{border-top:1px solid var(--border);}
.invoice-line-items__name{font-weight:600; color:var(--text); display:block;}
.invoice-line-items__note{color:var(--muted); font-size:12px; margin-top:2px;}
.invoice-line-items__row--editor{gap:1rem;}
.invoice-line-items__item{position:relative; display:flex; flex-direction:column; gap:.25rem;}
.invoice-line-items__input-group{display:flex; align-items:center;}
.invoice-line-items__input{width:100%; border:1px solid var(--border); border-radius:12px; padding:.65rem .85rem; font-size:14px; background:var(--panel);}
.invoice-line-items__input:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-line-items__discount{display:flex; align-items:center;}
.invoice-line-items__discount-trigger{width:100%; border:1px solid var(--border); border-radius:12px; padding:.65rem .85rem; font-size:14px; font-weight:600; background:var(--panel); color:var(--text); display:flex; align-items:center; justify-content:center; gap:.5rem; cursor:pointer; transition:background-color .2s ease, border-color .2s ease, box-shadow .2s ease;}
.invoice-line-items__discount-trigger:hover{background:var(--panel-alt);}
.invoice-line-items__discount-trigger:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-line-items__discount-trigger span{pointer-events:none;}
.invoice-line-items__note--discount{color:var(--muted); font-size:12px;}
.invoice-line-items__total{text-align:right; font-weight:600; display:flex; flex-direction:column; gap:.25rem; align-items:flex-end;}
.invoice-line-items__actions{display:flex; justify-content:flex-end;}
.invoice-line-items__remove{border:0; background:none; color:var(--muted); padding:.25rem; border-radius:8px; cursor:pointer;}
.invoice-line-items__remove:hover{color:var(--red); background:var(--panel-alt);}
.invoice-line-items__add{display:inline-flex; align-items:center; gap:.5rem; border:1px dashed var(--border); color:var(--btn-blue); background:var(--white); border-radius:12px; padding:.75rem 1rem; font-weight:600; cursor:pointer;}
.invoice-line-items__add:hover{background:var(--panel-alt);}
.invoice-create[data-invoice-read-only="true"] .line-items-picker{display:none;}
.invoice-create[data-invoice-read-only="true"] .invoice-line-items__remove{display:none;}
.invoice-create[data-invoice-read-only="true"] .quote-line-items__remove{display:none;}
.invoice-dropdown{position:relative; width:100%;}
.invoice-dropdown .selector{width:100%; gap:.75rem; text-align:left;}
.invoice-dropdown .dropdown__menu{left:0; right:0; min-width:100%;}
.invoice-line-items__body{display:flex; flex-direction:column;}
.line-items-picker{display:flex; flex-direction:column; gap:.75rem; position:relative;}
.line-items-picker__control{display:flex; align-items:center; gap:.75rem; border:1px dashed var(--border); border-radius:12px; padding:.75rem 1rem; background:var(--panel);}
.line-items-picker__icon{display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:var(--white); color:var(--btn-blue); font-size:14px;}
.line-items-picker__input{flex:1; border:0; background:transparent; font-size:14px; color:var(--text); outline:none;}
.line-items-picker__input::placeholder{color:var(--muted);}
.line-items-picker__info{border:0; background:none; color:var(--muted); cursor:pointer; padding:0; font-size:18px; display:inline-flex; align-items:center;}
.line-items-picker__info:hover{color:var(--btn-blue);}
.line-items-dropdown{position:absolute; top:calc(100% + 8px); left:0; right:0; background:var(--white); border:1px solid var(--border); border-radius:12px; box-shadow:0 12px 32px rgba(15,23,42,0.12); padding:.5rem 0; z-index:60; max-height:360px; overflow:auto; display:flex; flex-direction:column; gap:.25rem;}
.line-items-dropdown__option{display:flex; flex-direction:column; align-items:flex-start; text-align:left; background:none; border:0; padding:.75rem 1rem; width:100%; gap:.25rem; cursor:pointer; color:var(--text);}
.line-items-dropdown__option:hover{background:var(--panel-alt);}
.line-items-dropdown__option--active,.line-items-dropdown__option--active:hover{background:var(--btn-blue-ghost); color:var(--btn-blue);}
.line-items-dropdown__option--ghost{color:var(--btn-blue); font-weight:600;}
.line-items-dropdown__title{font-weight:600; font-size:14px;}
.line-items-dropdown__meta{font-size:12px; color:var(--muted);}
.line-items-dropdown__price{margin-top:.25rem; font-size:13px; color:var(--muted); align-self:flex-end;}
.invoice-dropdown__menu{max-height:320px; overflow:auto;}
.invoice-dropdown__search{padding:12px 16px; border-bottom:1px solid var(--line);}
.invoice-dropdown__search input{width:100%; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.invoice-dropdown__search input:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-dropdown__section{display:flex; flex-direction:column; gap:4px; padding:8px 0;}
.invoice-dropdown__section + .invoice-dropdown__section{border-top:1px solid var(--line);}
.invoice-dropdown__empty{padding:12px 16px; font-size:13px; color:var(--muted); margin:0;}
.invoice-dropdown__item-note{display:block; font-size:12px; color:var(--muted); margin-top:2px;}
.invoice-dropdown__create{font-weight:600;}
.invoice-attachments__body{display:flex; flex-direction:column; gap:.75rem;}
.invoice-attachments__dropzone{display:flex; align-items:flex-start; gap:.75rem; padding:1rem 1.25rem; border:1px dashed var(--border); border-radius:12px; background:var(--panel);}
.invoice-attachments__icon{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:var(--white); color:var(--btn-blue); font-size:16px; flex-shrink:0;}
.invoice-attachments__content{display:flex; flex-direction:column; gap:.5rem;}
.invoice-attachments__button{min-width:0;}
.invoice-attachments__hint{font-size:12px; color:var(--muted); margin:0;}
.invoice-attachments__list{list-style:none; display:flex; flex-direction:column; gap:.5rem; margin:0; padding:0;}
.invoice-attachments__item{display:flex; align-items:center; gap:.5rem; font-size:13px; color:var(--muted);}
.invoice-attachments__item i{color:var(--btn-blue);}
.invoice-service-date{display:flex; align-items:center; gap:.75rem;}
.invoice-service-date input[type="date"]{flex:1; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.invoice-service-date input[type="date"]:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-summary__row--action .link{display:inline-flex; align-items:center; gap:.5rem; font-weight:600;}
.invoice-summary__row--action .link i{font-size:16px;}
.invoice-summary__empty{font-size:13px; color:var(--muted); margin:4px 0 0;}
.invoice-communication__date{width:100%; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.invoice-communication__date:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-communication__send-options{display:flex; gap:.75rem; margin-bottom:.5rem; flex-wrap:wrap;}
.invoice-communication__send-option{display:flex; align-items:center; gap:.4rem;}
.invoice-communication__send-schedule{display:flex; flex-direction:column; gap:.5rem;}
.invoice-communication__schedule-inputs{display:flex; gap:.5rem;}
.invoice-communication__schedule-inputs .invoice-communication__date{flex:1 1 0;}
.invoice-activity-log{margin:0;}
.invoice-activity-log__card{border:1px solid var(--border);border-radius:12px;padding:1rem;background:var(--panel);display:flex;flex-direction:column;gap:.65rem;}
.invoice-activity-log__card--scrollable{max-height:22rem;overflow:auto;scrollbar-width:thin;scrollbar-gutter:stable;}
.invoice-activity-log__card--scrollable:focus{outline:none;box-shadow:0 0 0 3px rgba(37,99,235,.18);border-color:var(--focus);}
.invoice-activity-log__card--scrollable::-webkit-scrollbar{width:8px;height:8px;}
.invoice-activity-log__card--scrollable::-webkit-scrollbar-track{background:transparent;}
.invoice-activity-log__card--scrollable::-webkit-scrollbar-thumb{background-color:rgba(148,163,184,.5);border-radius:999px;}
.invoice-activity-log__card--empty{border-style:dashed;color:var(--muted);background:transparent;text-align:center;}
.invoice-activity-log__entry{display:flex;flex-direction:column;gap:.2rem;font-size:14px;color:var(--text);}
.invoice-activity-log__entry+.invoice-activity-log__entry{padding-top:.65rem;border-top:1px solid var(--border);}
.invoice-activity-log__line{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;}
.invoice-activity-log__title{font-weight:600;color:var(--text);}
.invoice-activity-log__meta{display:flex;align-items:center;gap:.35rem;font-size:12px;color:var(--muted);}
.invoice-activity-log__actor{font-weight:600;color:var(--text);}
.invoice-activity-log__extra a{font-size:12px;color:var(--primary);text-decoration:none;}
.invoice-activity-log__extra a:hover{text-decoration:underline;}
.invoice-actions{position:relative;display:inline-flex;}
.invoice-actions__toggle{background:var(--panel);border:1px solid var(--border);border-radius:999px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;font-size:18px;line-height:1;cursor:pointer;color:var(--text);}
.invoice-actions__toggle:hover{border-color:var(--focus);}
.invoice-actions__menu{position:absolute;top:calc(100% + 4px);right:0;background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 24px rgba(15,23,42,0.12);padding:.25rem 0;min-width:200px;z-index:20;list-style:none;margin:0;}
.invoice-actions__menu.is-floating{position:fixed;right:auto;}
.invoice-actions__menu[hidden]{display:none;}
.invoice-actions__item{display:block;width:100%;text-align:left;background:none;border:0;padding:.5rem 1rem;font-size:14px;color:var(--text);cursor:pointer;}
.invoice-actions__item:hover:not([disabled]){background:var(--surface);}
.invoice-actions__item[disabled]{opacity:.55;cursor:not-allowed;}
.invoice-actions__item[aria-disabled="true"]{opacity:.55;cursor:not-allowed;}
.invoice-tax-list{display:flex; flex-direction:column; gap:8px; margin:0; padding:0; border:0;}
.invoice-tax-list__title{font-size:14px; font-weight:600; margin:0 0 4px;}
.invoice-tax-list__option{display:flex; align-items:center; gap:12px; padding:8px 0; font-size:14px; border-bottom:1px solid var(--line);}
.invoice-tax-list__option:last-of-type{border-bottom:0;}
.invoice-tax-list__option input{width:16px; height:16px;}
.invoice-tax-list__option span{display:flex; flex-direction:column; gap:2px;}
.invoice-tax-list__option small{font-size:12px; color:var(--muted);}

.invoice-summary__body{gap:1rem;}
.link--icon{display:inline-flex; align-items:center; gap:.4rem; font-weight:600;}
.invoice-summary__list{margin:0; padding:0; display:flex; flex-direction:column; gap:.65rem;}
.invoice-summary__list--muted .invoice-summary__row{color:var(--muted);}
.invoice-summary__list--muted .invoice-summary__row dd{color:var(--muted);}
.invoice-summary__row{display:flex; justify-content:space-between; font-size:14px; color:var(--text);}
.invoice-summary__row--muted{color:var(--muted);}
.invoice-summary__row--muted dd{color:var(--muted);}
.invoice-summary__row dt{font-weight:500;}
.invoice-summary__row dd{margin:0; font-weight:600;}
.invoice-summary__total{display:flex; justify-content:space-between; align-items:center; font-size:18px; font-weight:600;}
.invoice-summary .btn.full{width:100%; border-radius:12px;}
.invoice-save-draft__intro{font-size:14px; color:var(--muted); margin:0;}
.invoice-save-draft__success{display:flex; flex-direction:column; gap:1rem;}
.invoice-save-draft__title{margin:0; font-size:18px; font-weight:600;}
.invoice-save-draft__note{margin:0; font-size:14px; color:var(--muted);}
.invoice-preview{display:flex; flex-direction:column; gap:1.25rem;}
.invoice-preview__details{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem 1.25rem;}
.invoice-preview__field{display:flex; flex-direction:column; gap:.35rem; font-size:14px;}
.invoice-preview__field--wide{grid-column:1 / -1;}
.invoice-preview__label{font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);}
.invoice-preview__value{color:var(--text);}
.invoice-preview__message{white-space:pre-wrap;}
.invoice-preview__recipient-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.35rem;}
.invoice-preview__summary{display:flex; flex-direction:column; gap:1rem;}
.invoice-preview__document .invoice-summary__empty{margin-top:1rem;}

.invoice-communication__share{display:flex; flex-direction:column; gap:.75rem; padding:0; margin:0; border:0;}
.invoice-communication__share legend{font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:.5rem;}
.radio-option{display:flex; align-items:center; gap:.6rem; font-size:14px;}
.radio-option input{accent-color:var(--btn-blue);}
.invoice-communication__schedule{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem;}

@media (max-width: 1200px){
  .invoice-create__layout{grid-template-columns: minmax(0,1fr);}
  .invoice-create__sidebar{flex-direction:column;}
}

@media (max-width: 768px){
  .invoice-create{padding:1rem;}
  .invoice-create__topbar{flex-direction:column; align-items:flex-start;}
  .invoice-create__actions{width:100%; justify-content:flex-start; flex-wrap:wrap;}
  .invoice-create__actions .btn{width:auto;}
  .form-grid{grid-template-columns:minmax(0,1fr);}
  .invoice-card__attachments{grid-template-columns:minmax(0,1fr);}
  .invoice-communication__schedule{grid-template-columns:minmax(0,1fr);}
}




/* ====================
   Quote list (mirrors invoice list styles)
==================== */
.quotes-main{
  flex:1;
  display:flex;
  flex-direction:column;
  min-height:0;
}
.quotes-main .page{
  flex:1;
  display:flex;
  flex-direction:column;
  min-height:0;
}
.quotes-main .page.px{ padding:0rem; }
.quotes-main .content{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:0;
}
.quotes-main .card{ background: var(--white); border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.quotes-main .kpi{ padding: 16px 18px; margin-bottom: 16px; }
.quotes-main .kpi-top{ display:flex; justify-content:space-between; align-items:center; }
.quotes-main .kpi-label{ color: var(--muted); font-size: 12px; }
.quotes-main .kpi-value{ font-size: 28px; font-weight: 600; }
.quotes-main .kpi-overdue{ margin-top: 12px; }
.quotes-main .kpi-overdue-line{ display:flex; align-items:center; gap:8px; color: var(--muted); font-size: 13px; margin-bottom: 6px; }
.analytics-grid{ display:grid; gap:24px; margin:24px 0; grid-template-columns:repeat(4,minmax(0,1fr)); }
.analytics-card{ padding:18px; display:flex; flex-direction:column; gap:12px; position:relative; }
.analytics-card__header{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
.analytics-card__header--row{ flex-wrap:wrap; }
.analytics-card__title{ font-size:14px; font-weight:600; color:var(--text); text-decoration:none; }
.analytics-card__title:hover{ text-decoration:underline; }
.analytics-card__tooltip{ border:0; background:transparent; color:var(--muted); cursor:help; font-size:14px; padding:0; }
.analytics-card__primary{ display:flex; align-items:baseline; gap:6px; }
.analytics-card__metric{ font-size:30px; font-weight:700; color:var(--text); }
.analytics-card__metric-suffix{ color:var(--muted); font-size:13px; text-transform:uppercase; letter-spacing:.08em; }
.analytics-card__helper{ margin:4px 0 0; font-size:12px; color:var(--muted); }
.analytics-card__details{ display:flex; flex-direction:column; gap:6px; margin:0; }
.analytics-card__detail-row{ display:flex; justify-content:space-between; gap:8px; font-size:13px; color:var(--muted); }
.analytics-card__statuses{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; font-size:12px; color:var(--muted); }
.analytics-card__status-item{ display:flex; justify-content:space-between; gap:6px; }
.analytics-card__status-value{ font-weight:600; color:var(--text); }
.analytics-card__subheading{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.analytics-card__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.analytics-card__list-item a{ color:var(--text); text-decoration:none; font-size:13px; display:inline-flex; gap:6px; }
.analytics-card__list-item a:hover{ text-decoration:underline; }
.analytics-card__list-item[data-empty]{ color:var(--muted); font-style:italic; }
.analytics-toggle{ display:inline-flex; gap:6px; background:var(--panel-alt); border-radius:999px; padding:4px; }
.analytics-toggle__btn{ border:0; background:transparent; padding:4px 10px; border-radius:999px; font-size:12px; cursor:pointer; color:var(--muted); }
.analytics-toggle__btn.is-active{ background:#fff; color:var(--text); box-shadow:var(--shadow-sm); }
.analytics-pipeline{ display:flex; align-items:center; gap:12px; }
.analytics-pipeline__chart{ width:72px; height:72px; border-radius:50%; background:var(--panel-alt); position:relative; }
.analytics-pipeline__chart::after{ content:""; position:absolute; inset:18px; background:#fff; border-radius:50%; }
.analytics-pipeline__legend{ margin:0; display:flex; flex-direction:column; gap:8px; font-size:13px; color:var(--muted); }
.analytics-pipeline__legend div{ display:flex; justify-content:space-between; gap:8px; }
.analytics-pipeline__legend dd{ margin:0; color:var(--text); }
.analytics-grid .analytics-card{ background:var(--panel); }
.analytics-card__title:focus-visible,
.analytics-toggle__btn:focus-visible,
.analytics-card__list-item a:focus-visible{ outline:2px solid var(--primary); outline-offset:2px; }
.analytics-grid{ --analytics-draft:#b4c6fc; --analytics-sent:#90cdf4; --analytics-accepted:#9ae6b4; }
.analytics-card__tooltip{ font-weight:600; }
.quotes-main .analytics-grid{
  margin:0;
  gap:16px;
}
@media (max-width: 1024px){
  .analytics-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 768px){
  .analytics-grid{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width: 640px){
  .analytics-pipeline{ flex-direction:column; align-items:flex-start; }
  .analytics-card__statuses{ grid-template-columns:repeat(1,minmax(0,1fr)); }
}
.quotes-main .dot{ width:8px; height:8px; border-radius:50%; display:inline-block; }
.quotes-main .dot-green{ background:#22c55e; }
.quotes-main .dot-red{ background: var(--red); }
.quotes-main .bar{ height: 8px; background:#f1f2f4; border-radius: 999px; }
.quotes-main .bar-green{ height: 8px; background:#22c55e; border-radius: 999px; }
.quotes-main .controls{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.quotes-main .search{ position:relative; }
.quotes-main .search .icon{ position:absolute; left:10px; top:8px; color:#9ca3af; }
.quotes-main .search input{ padding:8px 12px 8px 32px; border:1px solid var(--border); border-radius:999px; min-width:260px; outline:none; }
.quotes-main .pill,
.invoices-main .pill{ border:1px solid var(--border); border-radius:999px; background:#fff; padding:8px 14px; font-size:13px; }
.quotes-main .pill.light,
.invoices-main .pill.light{ background:#f3f4f6; }
.quotes-main .pill-dropdown,
.invoices-main .pill-dropdown{ position:relative; display:inline-block; }
.quotes-main .pill-dropdown > summary,
.invoices-main .pill-dropdown > summary{ list-style:none; cursor:pointer; }
.quotes-main .pill-dropdown > summary::-webkit-details-marker,
.invoices-main .pill-dropdown > summary::-webkit-details-marker{ display:none; }
.quotes-main .pill-dropdown-label,
.invoices-main .pill-dropdown-label{ display:inline-flex; align-items:center; gap:8px; border:1px solid var(--border); border-radius:999px; background:#fff; padding:8px 14px; font-size:13px; color:var(--text); }
.quotes-main .pill-dropdown[open] > summary .pill-dropdown-label,
.invoices-main .pill-dropdown[open] > summary .pill-dropdown-label{ border-color:var(--accent); box-shadow:0 0 0 3px var(--btn-blue-ghost); }
.quotes-main .pill-dropdown-title,
.invoices-main .pill-dropdown-title{ color:var(--muted); font-weight:500; }
.quotes-main .pill-dropdown-value,
.invoices-main .pill-dropdown-value{ font-weight:600; }
.quotes-main .pill-dropdown-caret,
.invoices-main .pill-dropdown-caret{ font-size:10px; line-height:1; color:var(--muted); }
.quotes-main .pill-dropdown-menu,
.invoices-main .pill-dropdown-menu{ position:absolute; top:calc(100% + 8px); left:0; min-width:200px; background:#fff; border:1px solid var(--border); border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,0.08); padding:8px 0; z-index:50; }
.quotes-main .pill-dropdown-list,
.invoices-main .pill-dropdown-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.quotes-main .pill-dropdown-item,
.invoices-main .pill-dropdown-item{ width:100%; text-align:left; background:none; border:0; padding:8px 16px; font-size:13px; color:var(--text); cursor:pointer; border-radius:8px; }
.quotes-main .pill-dropdown-item:hover,
.invoices-main .pill-dropdown-item:hover{ background:var(--panel-alt); }
.quotes-main .pill-dropdown-item.is-active,
.invoices-main .pill-dropdown-item.is-active{ background:var(--btn-blue-ghost); color:var(--btn-blue); font-weight:600; }
.quotes-main .flex-spacer{ flex:1; }
.quotes-main .btn{ border-radius:12px; padding:9px 16px; font-weight:500; border:1px solid var(--black); }
.quotes-main .btn.ghost{ background:#fff; color:#111; border-color:var(--border); }
.quotes-main .btn.ghost.sm{ padding:6px 10px; font-size:12px; }
.quotes-main .btn.primary{ background:var(--black); color:#fff; border-color:var(--black); }
.quotes-main .dropdown{ position:relative; }
.quotes-main .dropdown .menu{ display:none; position:absolute; right:0; top:110%; background:#fff; border:1px solid var(--border); border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.08); min-width:200px; padding:6px 0; }
.quotes-main .dropdown:hover .menu{ display:block; }
.quotes-main .dropdown .menu a{ display:block; padding:10px 14px; color:#111; text-decoration:none; }
.quotes-main .dropdown .menu a:hover{ background:#f8fafc; }
.quotes-main .content > .quotes-table{
  flex:1;
}
.quotes-table{ padding:0; }
.quotes-main .quotes-table{
  display:flex;
  flex-direction:column;
  min-height:0;
  gap:0;
}
.quotes-main .table-wrapper{
  flex:1;
  overflow:auto;
  min-height:0;
  padding:0 16px 16px;
  background:var(--panel, #fff);
}
.quotes-main .table{ width:100%; border-collapse:separate; border-spacing:0; font-size:14px; min-width:100%; }
.quotes-main .table thead th{
  position:sticky;
  top:0;
  z-index:2;
  text-align:left;
  color:#6b7280;
  font-weight:500;
  padding:12px;
  background:var(--surface, var(--panel, #fff));
  box-shadow:inset 0 -1px 0 var(--border), 0 1px 0 rgba(15,23,42,0.04);
  background-clip:padding-box;
}
.quotes-main .table tbody td{ padding:14px 12px; border-bottom:1px solid var(--border); }
.quotes-main .text-right{ text-align:right; }
.quotes-main .w-32{ width:32px; }
.quotes-main .ml{ margin-left:6px; }
.quotes-main .kebab{ cursor:pointer; padding:4px 8px; border-radius:8px; }
.quotes-main .kebab:hover{ background:#f3f4f6; }
.quotes-main .badge{ padding:4px 8px; border-radius:999px; font-size:12px; font-weight:600; }
.quotes-main .badge.green{ color:#065f46; background:#d1fae5; }
.quotes-main .badge.red{ color:#991b1b; background:#fee2e2; }
.quotes-main .badge.gray{ color:#374151; background:#e5e7eb; }
.quotes-main .badge.blue{ color:#1d4ed8; background:#dbeafe; }
.quotes-main .empty{ text-align:center; color:#9ca3af; padding:28px 0; }
.quotes-main .pager{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:12px 16px;
  border-top:1px solid var(--border);
  background:var(--surface, var(--panel, #fff));
}
.quotes-main .pager-summary{ color:#6b7280; font-size:13px; }
.quotes-main .pager-nav{ display:flex; align-items:center; gap:12px; margin-left:auto; }
.quotes-main .pager-list{ display:flex; align-items:center; gap:6px; list-style:none; margin:0; padding:0; }
.quotes-main .pager-link{ display:inline-flex; align-items:center; justify-content:center; min-width:32px; height:32px; padding:0 12px; border-radius:999px; border:1px solid var(--border); font-size:13px; color:var(--text); text-decoration:none; transition:all .15s ease; }
.quotes-main .pager-link:hover{ border-color:var(--accent); color:var(--accent); }
.quotes-main .pager-link.is-active{ background:var(--black); color:#fff; border-color:var(--black); cursor:default; }
.quotes-main .pager-link.is-disabled{ pointer-events:none; opacity:.4; }
.quotes-main .pager-ellipsis{ color:#9ca3af; font-size:14px; padding:0 4px; }
.quotes-header{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:8px 0 8px;
}
.quotes-header__title{ margin:0; font-size:26px; font-weight:600; text-align:left; }
.quotes-header__subtitle{ margin:0; color:var(--muted); }
.quotes-header__top{
  display:flex;
  align-items:center;
  gap:16px;
}
.quotes-header__actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:10px;
}
.quotes-breadcrumb{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); }
.quotes-breadcrumb a{ color:inherit; text-decoration:none; font-weight:500; }
.quotes-breadcrumb a:hover{ color:var(--text); }
.quotes-breadcrumb__divider{ color:var(--border); }
.quotes-breadcrumb__current{ font-weight:600; color:var(--text); }
.quotes-toolbar{
  margin-bottom:0;
  padding:16px;
  overflow:visible;
}
.quotes-toolbar__form{
  width:100%;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.quotes-toolbar__search{
  flex:1 1 280px;
  min-width:220px;
}
.quotes-toolbar__state{ display:none; }
.quotes-toolbar__filters{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.quotes-toolbar .pill-dropdown,
.invoices-toolbar .pill-dropdown{ position:relative; display:inline-block; }
.quotes-toolbar .pill-dropdown > summary,
.invoices-toolbar .pill-dropdown > summary{ list-style:none; cursor:pointer; }
.quotes-toolbar .pill-dropdown > summary::-webkit-details-marker,
.invoices-toolbar .pill-dropdown > summary::-webkit-details-marker{ display:none; }
.quotes-toolbar .pill-dropdown-label,
.invoices-toolbar .pill-dropdown-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fff;
  padding:8px 14px;
  font-size:13px;
  color:var(--text);
}
.quotes-toolbar .pill-dropdown[open] > summary .pill-dropdown-label,
.invoices-toolbar .pill-dropdown[open] > summary .pill-dropdown-label{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--btn-blue-ghost);
}
.quotes-toolbar .pill-dropdown-title,
.invoices-toolbar .pill-dropdown-title{ color:var(--muted); font-weight:500; }
.quotes-toolbar .pill-dropdown-value,
.invoices-toolbar .pill-dropdown-value{ font-weight:600; }
.quotes-toolbar .pill-dropdown-caret,
.invoices-toolbar .pill-dropdown-caret{ font-size:10px; line-height:1; color:var(--muted); }
.quotes-toolbar .pill-dropdown-menu,
.invoices-toolbar .pill-dropdown-menu{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  min-width:200px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  padding:8px 0;
  z-index:50;
}
.quotes-toolbar .pill-dropdown-list,
.invoices-toolbar .pill-dropdown-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.quotes-toolbar .pill-dropdown-item,
.invoices-toolbar .pill-dropdown-item{
  width:100%;
  text-align:left;
  background:none;
  border:0;
  padding:8px 16px;
  font-size:13px;
  color:var(--text);
  cursor:pointer;
  border-radius:8px;
}
.quotes-toolbar .pill-dropdown-item:hover,
.invoices-toolbar .pill-dropdown-item:hover{ background:var(--panel-alt); }
.quotes-toolbar .pill-dropdown-item.is-active,
.invoices-toolbar .pill-dropdown-item.is-active{
  background:var(--btn-blue-ghost);
  color:var(--btn-blue);
  font-weight:600;
}
.payments-toolbar .pill-dropdown-custom{
  padding:10px 16px 12px;
  display:flex;
  flex-direction:column;
  gap:8px;
  border-top:1px solid var(--border);
}
.payments-toolbar .pill-dropdown-custom__inputs{
  display:flex;
  gap:8px;
}
.payments-toolbar .pill-dropdown-custom__inputs .input{
  flex:1 1 140px;
  padding:8px 10px;
  background:#fff;
}
.payments-table .table-sort,
.receipts-table .table-sort{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:inherit;
  text-decoration:none;
}
.payments-table .table-sort .bi,
.receipts-table .table-sort .bi{ font-size:.85em; opacity:.6; }
.payments-table .table-sort.is-active .bi,
.receipts-table .table-sort.is-active .bi{ opacity:1; }
.payments-table .table-sort:hover,
.receipts-table .table-sort:hover{ color:var(--text); }
.payments-table .table-sort--right,
.receipts-table .table-sort--right{ justify-content:flex-end; width:100%; }
.quotes-analytics{ margin-top:0; }
.quotes-table{ margin-top:0; padding:20px; display:flex; flex-direction:column; gap:18px; }
.quotes-table-wrap{ display:flex; flex-direction:column; gap:12px; }
.quotes-table-container{ border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--white); }
.quotes-table__table{ width:100%; border-collapse:collapse; font-size:14px; }
.quotes-table__table thead th{ text-align:left; padding:14px 16px; color:var(--muted); font-weight:500; background:#f9fafb; }
.quotes-table__table thead a{
  color:inherit;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.quotes-table__table thead a:hover{ color:var(--text); }
.quotes-table__table tbody td{ padding:16px; border-top:1px solid var(--line); vertical-align:middle; }
.quotes-table__table tbody tr{ transition:background .15s ease; }
.quotes-table__table tbody tr:hover{ background:#f8fafc; }
.quotes-table__checkbox{ width:36px; text-align:center; }
.quotes-table__table .quotes-amount{ font-weight:600; display:block; color:var(--text); }
.quotes-table__table .quotes-amount__hint{ color:var(--muted); margin-top:2px; }
.quotes-table__table .quotes-amount--missing{ color:var(--muted); }
.quotes-table__table .quotes-amount__resolve{ margin-top:4px; }
.quotes-summary{ margin-top:0; padding:16px 20px; }
.quotes-summary p{ margin:0; font-weight:500; font-size:14px; text-align:center; }
@media (max-width: 768px){
  .quotes-header__title{ font-size:24px; }
  .quotes-header__top{ flex-direction:column; align-items:flex-start; gap:8px; }
  .quotes-header__actions{ margin-left:0; width:100%; justify-content:flex-start; }
}
@media (max-width: 640px){
  .quotes-toolbar__search{ flex:1 1 100%; }
}
.catalog-main{ display:flex; flex-direction:column; gap:20px; }
.catalog-main .page{ display:flex; flex-direction:column; gap:16px; }
.catalog-main .search{ position:relative; }
.catalog-main .search .icon{ position:absolute; left:12px; top:10px; color:#9ca3af; }
.catalog-main .search input{ padding:10px 16px 10px 40px; border:1px solid var(--border); border-radius:999px; min-width:260px; outline:none; background:var(--white); }
.catalog-main .pill-dropdown{ position:relative; display:inline-block; }
.catalog-main .pill-dropdown > summary{ list-style:none; cursor:pointer; }
.catalog-main .pill-dropdown > summary::-webkit-details-marker{ display:none; }
.catalog-main .pill-dropdown-label{ display:inline-flex; align-items:center; gap:8px; border:1px solid var(--border); border-radius:999px; background:#fff; padding:8px 14px; font-size:13px; color:var(--text); }
.catalog-main .pill-dropdown[open] > summary .pill-dropdown-label{ border-color:var(--accent); box-shadow:0 0 0 3px var(--btn-blue-ghost); }
.catalog-main .pill-dropdown-title{ color:var(--muted); font-weight:500; }
.catalog-main .pill-dropdown-value{ font-weight:600; }
.catalog-topbar{ gap:12px; }
.catalog-topbar__back{ display:inline-flex; align-items:center; gap:8px; color:var(--muted); text-decoration:none; font-size:14px; }
.catalog-topbar__back:hover{ color:var(--text); }
.catalog-topbar__subtitle{ margin:4px 0 0; color:var(--muted); font-size:14px; }
.catalog-topbar__actions{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.catalog-topbar__actions form{ margin:0; }
.catalog-topbar__actions .btn{ white-space:nowrap; }
.catalog-main .pill-dropdown-caret{ font-size:10px; line-height:1; color:var(--muted); }
.catalog-main .pill-dropdown-menu{ position:absolute; top:calc(100% + 8px); left:0; min-width:200px; background:#fff; border:1px solid var(--border); border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,0.08); padding:8px 0; z-index:50; }
.catalog-main .pill-dropdown-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.catalog-main .pill-dropdown-item{ width:100%; text-align:left; background:none; border:0; padding:8px 16px; font-size:13px; color:var(--text); cursor:pointer; border-radius:8px; }
.catalog-main .pill-dropdown-item:hover{ background:var(--panel-alt); }
.catalog-main .pill-dropdown-item.is-active{ background:var(--btn-blue-ghost); color:var(--btn-blue); font-weight:600; }
.catalog-kpi__meta{ display:flex; gap:18px; align-items:center; }
.catalog-kpi__stat{ display:flex; flex-direction:column; gap:4px; text-align:right; }
.catalog-kpi__stat-value{ font-size:22px; font-weight:600; color:var(--text); }
.catalog-kpi__stat-label{ color:var(--muted); font-size:13px; text-transform:uppercase; letter-spacing:.08em; }
.catalog-kpi__divider{ width:1px; height:32px; background:var(--line); display:block; }
.catalog-metrics{ display:flex; align-items:center; gap:24px; padding:24px; }
.catalog-metrics__item{ display:flex; flex-direction:column; gap:6px; }
.catalog-metrics__label{ margin:0; color:var(--muted); font-size:13px; text-transform:uppercase; letter-spacing:.08em; }
.catalog-metrics__value{ margin:0; font-size:22px; font-weight:600; color:var(--text); }
.catalog-metrics__divider{ width:1px; height:32px; background:var(--line); }
.catalog-toolbar{ padding:16px; overflow:visible; display:flex; }
.catalog-toolbar__form{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; width:100%; }
.catalog-toolbar__search{ flex:1 1 260px; min-width:240px; display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:12px; padding:0 14px; background:#f8fafc; min-height:48px; position:relative; }
.catalog-toolbar__search i{ color:var(--muted); font-size:16px; }
.catalog-toolbar__search input{ border:0; background:transparent; font-size:15px; padding:0; flex:1 1 auto; min-width:0; }
.catalog-toolbar__search input:focus{ outline:none; }
.catalog-toolbar__filters{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.catalog-toolbar__actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-left:auto; justify-content:flex-end; }
.catalog-toolbar .btn{ min-height:42px; padding:0.75rem 1.1rem; }
.catalog-table{ margin-top:0; padding:20px; display:flex; flex-direction:column; gap:18px; }
.catalog-table__wrap{ display:flex; flex-direction:column; gap:12px; }
.catalog-table__container{ border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--white); }
.catalog-table__table{ width:100%; border-collapse:collapse; font-size:14px; }
.catalog-table__table thead th{ text-align:left; padding:14px 16px; color:var(--muted); font-weight:500; background:#f9fafb; }
.catalog-table__table tbody td{ padding:16px; border-top:1px solid var(--line); vertical-align:middle; }
.catalog-table__table tbody tr{ transition:background .15s ease; }
.catalog-table__table tbody tr:hover{ background:#f8fafc; }
.catalog-main .text-right{ text-align:right; }
.catalog-main .w-32{ width:32px; }
.catalog-main .empty{ text-align:center; color:#9ca3af; padding:28px 0; }
.catalog-main .pager{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; padding:12px 16px; border-top:1px solid var(--border); background:var(--surface, var(--panel, #fff)); }
.catalog-main .pager .muted{ color:#6b7280; font-size:13px; }
.catalog-name{ display:flex; flex-direction:column; gap:4px; }
.catalog-name__title{ font-weight:600; color:var(--text); }
.catalog-name__description{ font-size:12px; color:var(--muted); }
.catalog-sku{ font-family:var(--font-mono, 'JetBrains Mono', monospace); font-size:12px; color:var(--muted); }
.copy-ref{ display:flex; flex-direction:column; gap:4px; }
.copy-ref__row{ display:inline-flex; align-items:center; gap:8px; }
.copy-ref__label{ font-weight:600; }
.copy-ref__value{ font-size:12px; color:var(--text); }
.copy-ref__value--mono{ font-family:var(--font-mono, 'JetBrains Mono', monospace); }
.copy-ref__button{ padding:4px 6px; min-height:0; line-height:1; }
.copy-ref__button i{ font-size:14px; }
.catalog-muted{ color:var(--muted); font-size:12px; }
.catalog-badge{ display:inline-flex; align-items:center; padding:6px 10px; border-radius:999px; background:#f3f4f6; font-size:12px; font-weight:600; color:#374151; text-transform:uppercase; letter-spacing:.06em; }
.catalog-availability{ display:flex; flex-wrap:wrap; gap:6px; }
.catalog-pill{ display:inline-flex; align-items:center; gap:4px; padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; }
.catalog-pill--sale{ background:#eef2ff; color:#3730a3; }
.catalog-pill--purchase{ background:#ecfdf5; color:#047857; }
.catalog-status{ display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; }
.catalog-status--active{ background:#ecfdf5; color:#047857; }
.catalog-status--inactive{ background:#f3f4f6; color:#4b5563; }
.catalog-table .kebab{ cursor:pointer; font-size:18px; }

@media (max-width: 960px){
  .catalog-kpi__meta{ flex-wrap:wrap; justify-content:flex-start; }
  .catalog-kpi__stat{ text-align:left; }
  .catalog-kpi__divider{ display:none; }
}

@media (max-width: 720px){
  .catalog-metrics{ flex-direction:column; align-items:flex-start; }
  .catalog-metrics__divider{ display:none; }
  .catalog-toolbar{ padding:14px; }
  .catalog-toolbar__form{ flex-direction:column; align-items:stretch; gap:14px; }
  .catalog-toolbar__search{ width:100%; }
  .catalog-toolbar__filters{ width:100%; }
  .catalog-toolbar__actions{ width:100%; justify-content:flex-start; }
  .catalog-toolbar .btn{ width:100%; justify-content:center; }
  .catalog-availability{ flex-direction:column; align-items:flex-start; }
}

.catalog-create .btn{ border-radius:999px; padding:10px 18px; font-weight:500; border:1px solid var(--black); }
.catalog-create .btn.ghost{ background:#fff; color:#111; border-color:var(--border); }
.catalog-create__header{ display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:20px; }
.catalog-create__eyebrow{ text-transform:uppercase; letter-spacing:.16em; font-size:12px; color:var(--muted); margin:0 0 6px; }
.catalog-create__title{ margin:0; font-size:28px; font-weight:700; letter-spacing:-0.02em; }
.catalog-create__subtitle{ margin:6px 0 0; color:var(--muted); max-width:420px; }
.catalog-form{ padding:28px 32px; display:flex; flex-direction:column; gap:24px; }
.catalog-form__section{ display:flex; flex-direction:column; gap:16px; padding:20px 0; border-top:1px solid var(--border); }
.catalog-form__section:first-of-type{ padding-top:0; border-top:none; }
.catalog-form__section-header{ display:flex; flex-direction:column; gap:4px; }
.catalog-form__section-title{ margin:0; font-size:18px; font-weight:600; color:var(--text); }
.catalog-form__section-description{ margin:0; color:var(--muted); font-size:14px; max-width:420px; }
.catalog-form__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px 24px; }
.catalog-form__grid--identifiers{ grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); }
.catalog-form__availability{ display:flex; flex-direction:column; gap:12px; }
.catalog-form__toggles{ display:flex; gap:18px; flex-wrap:wrap; }
.catalog-form__hint{ margin-top:6px; color:var(--muted); font-size:12px; }
.catalog-toggle{ display:inline-flex; align-items:center; gap:10px; padding:10px 16px; border:1px solid var(--border); border-radius:12px; background:#fff; cursor:pointer; font-weight:600; }
.catalog-toggle input{ width:auto; }
.catalog-form__actions{ display:flex; justify-content:flex-end; gap:12px; align-items:center; }
.catalog-tax-picker{ display:flex; flex-direction:column; gap:16px; }
.catalog-tax-picker__clear{ align-self:flex-start; background:none; border:none; color:var(--btn-blue); font-weight:600; cursor:pointer; padding:0; }
.catalog-tax-picker__options{ display:flex; flex-direction:column; gap:10px; max-height:260px; overflow-y:auto; }
.catalog-tax-picker__empty{ color:var(--muted); font-size:14px; }
.catalog-tax-option{ display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--border); border-radius:12px; background:#fff; cursor:pointer; }
.catalog-tax-option input{ width:auto; }
.catalog-tax-option strong{ display:block; font-weight:600; color:var(--text); }
.catalog-tax-option small{ display:block; color:var(--muted); }

@media (max-width: 720px){
  .catalog-create__header{ flex-direction:column; align-items:flex-start; }
  .catalog-form{ padding:24px; }
  .catalog-form__section{ padding:16px 0; }
  .catalog-form__section-title{ font-size:16px; }
  .catalog-form__actions{ flex-direction:column; align-items:stretch; }
  .catalog-form__actions .btn{ width:100%; justify-content:center; }
}
/* ====================
   Auth (login & register)
==================== */
body.page{
  margin:0;
  --bg: #f7f9fc;
  --card: #ffffff;
  --text: #0a0a0a;
  --muted: #667085;
  --border: #e6e7eb;
  --focus: #2563eb;
  background: var(--bg);
  color: var(--text);
  font: 16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Inter, sans-serif;
}
body.page .topbar{ height: 56px; display:flex; align-items:center; justify-content:space-between; padding:0 16px; }
body.page .brand{ display:flex; gap:8px; align-items:center; font-weight:700; }
body.page .brand .logo{ font-size:16px; }
body.page .brand .name{ font-size:16px; }
body.page .toplinks{ display:flex; align-items:center; gap:16px; }
body.page .muted{ color: var(--muted); text-decoration:none; }
body.page .muted:hover{ text-decoration:underline; }
body.page .lang .dot{ width:6px; height:6px; display:inline-block; border-radius:50%; background:#000; }
body.page .center{ display:grid; place-items:center; min-height: calc(100vh - 56px); padding:24px; }
body.page .card{ width:100%; max-width:480px; background: var(--card); border:1px solid var(--border); border-radius:10px; padding:28px 28px 16px; box-shadow: 0 8px 20px rgba(0,0,0,0.05); }
body.page .app-title{ text-align:center; margin:0 0 6px; font-size:28px; }
body.page .app-icon{ text-align:center; margin-bottom:6px; font-size:18px; color:#111; }
body.page .card-title{ text-align:center; margin:0 0 18px; font-weight:600; }
body.page .alert{ background:#fff4f4; border:1px solid #ffd6d6; color:#b42318; padding:10px 12px; border-radius:8px; margin-bottom:12px; }
body.page .field-label{ display:block; margin:8px 0 6px; font-size:13px; color: var(--muted); }
body.page .input{ width:100%; padding:12px 12px; border:1px solid var(--border); border-radius:8px; background:#f3f6fb; }
body.page .input:focus{ outline:none; border-color: var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.1); }
body.page .row{ display:flex; gap:12px; align-items:center; margin:12px 0 16px; }
body.page .row.between{ justify-content:space-between; }
body.page .checkbox{ display:flex; gap:8px; align-items:center; color: var(--muted); font-size:14px; }
body.page .btn{ width:100%; padding:12px; border-radius:8px; border:1px solid #000; cursor:pointer; font-weight:600; }
body.page .btn.primary{ background:#000; color:#fff; }
body.page .btn.primary:hover{ filter: brightness(0.92); }
body.page .link{ color:#2563eb; text-decoration:none; font-size:14px; }
body.page .link:hover{ text-decoration:underline; }
body.page .small{ font-size:13px; }
body.page .center-text{ text-align:center; }
body.page .badge{ position:fixed; right:14px; bottom:14px; font-size:12px; color:#111; text-decoration:none; padding:6px 8px; border:1px solid var(--border); border-radius:6px; background:#fff; }

@media (prefers-color-scheme: dark){
  :root{ --btn-text-primary: #e6e7ea; --btn-border: rgba(230, 231, 234, 0.14); --panel:#0b1220; --panel-alt:#05070c; --bg:#05070c; --text:#f4f5f7; --line:rgba(148, 163, 184, 0.18); }
  .sidebar{ background:var(--panel); }
  .topbar{ background:var(--panel); }
  .main{ background:var(--panel-alt); }
  .org-link, .card, .shortcut, .activity__item, .tasks__item{ background:var(--panel); }
}

/* Quote create layout */
.quote-create{padding:0rem; display:flex; flex-direction:column; gap:1.5rem;}
.quote-create__topbar{display:flex; justify-content:space-between; align-items:center; gap:1rem;}
.quote-create__breadcrumbs{display:flex; align-items:center; gap:.5rem; font-size:14px; color:var(--muted);}
.quote-create__back{color:var(--btn-blue); text-decoration:none; font-weight:600;}
.quote-create__chevron{color:var(--muted); font-size:12px;}
.quote-create__current{color:var(--text); font-weight:600;}
.quote-create__actions{display:flex; gap:.75rem;}
.quote-create__actions .btn{ padding:.5rem 1.25rem; font-size:14px;}
.quote-create__layout{display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:1.5rem; align-items:start;}
.quote-create__main{display:flex; flex-direction:column; gap:1rem;}
.quote-create__sidebar{display:flex; flex-direction:column; gap:1rem;}

/* Invoice create layout: mirror quote styles */
.invoice-create{padding:0rem; display:flex; flex-direction:column; gap:1.5rem;}
.invoice-create__topbar{display:flex; justify-content:space-between; align-items:center; gap:1rem;}
.invoice-create__breadcrumbs{display:flex; align-items:center; gap:.5rem; font-size:14px; color:var(--muted);}
.invoice-create__back{color:var(--btn-blue); text-decoration:none; font-weight:600;}
.invoice-create__chevron{color:var(--muted); font-size:12px;}
.invoice-create__current{color:var(--text); font-weight:600;}
.invoice-create__actions{display:flex; gap:.75rem;}
.invoice-create__actions .btn{ padding:.5rem 1.25rem; font-size:14px;}
.invoice-create__layout{display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:1.5rem; align-items:start;}
.invoice-create__main{display:flex; flex-direction:column; gap:1rem;}
.invoice-create__sidebar{display:flex; flex-direction:column; gap:1rem;}

.quote-card{background:var(--white); border:1px solid var(--border); border-radius:16px; box-shadow:0 1px 2px rgba(15,23,42,0.04);}
.quote-card__header{display:flex; justify-content:space-between; align-items:center; padding:1.25rem 1.5rem 0;}
.quote-card__hint{margin-left:auto; font-size:13px; color:var(--muted);}
.quote-card__header h2{font-size:16px; font-weight:600; margin:0;}
.quote-card__body{padding:1rem 1.5rem 1.5rem; display:flex; flex-direction:column; gap:1rem;}
.quote-card .link{background:none; border:0; color:var(--btn-blue); font-weight:500; cursor:pointer; padding:0;}
.quote-card .link:hover{text-decoration:underline;}

/* Quote acceptance box */
.acceptance-box{margin-top:1.5rem;}
.acceptance-box__header{display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:1rem;}
.acceptance-box__subtitle{margin:0; color:var(--muted); font-size:13px;}
.acceptance-box__status{background:#d1fae5; color:#065f46; font-size:12px; font-weight:600; padding:4px 10px; border-radius:999px;}
.acceptance-box__form{display:flex; flex-direction:column; gap:1rem;}
.acceptance-box__actions{display:flex; justify-content:flex-start;}
.acceptance-box__summary{display:flex; flex-direction:column; gap:.75rem;}
.acceptance-box__meta{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:.75rem;}
.acceptance-box__label{display:block; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted);}
.acceptance-box__value{display:block; font-size:14px; font-weight:600; color:var(--text);}
.signature-preview{height:60px; max-width:100%; object-fit:contain;}
.acceptance-box__comment p{margin:0; color:var(--text);}
.acceptance-box__checksum{font-size:12px; color:var(--muted); margin:0;}

/* Invoice cards styled like quote cards */
.invoice-card{background:var(--white); border:1px solid var(--border); border-radius:16px; box-shadow:0 1px 2px rgba(15,23,42,0.04);}
.invoice-card__header{display:flex; justify-content:space-between; align-items:center; padding:1.25rem 1.5rem 0;}
.invoice-card__hint{margin-left:auto; font-size:13px; color:var(--muted);}
.invoice-card__header h2{font-size:16px; font-weight:600; margin:0;}
.invoice-card__body{padding:1rem 1.5rem 1.5rem; display:flex; flex-direction:column; gap:1rem;}
.invoice-card .link{background:none; border:0; color:var(--btn-blue); font-weight:500; cursor:pointer; padding:0;}
.invoice-card .link:hover{text-decoration:underline;}

.form-grid{display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:1rem 1.25rem;}
.form-grid--single{grid-template-columns: minmax(0,1fr);}
.form-grid--three{grid-template-columns: repeat(3, minmax(0,1fr));}
.form-field{display:flex; flex-direction:column; gap:.375rem; font-size:14px;}
.form-field input,
.form-field select,
.form-field textarea{border:1px solid var(--border); border-radius:12px; padding:.75rem 1rem; font-size:14px; background:var(--panel); color:var(--text);}
.form-field input[type="file"]{ padding:.5rem; background:#fff; }
.form-field .field-readonly{border:1px solid var(--border); border-radius:12px; padding:.75rem 1rem; font-size:14px; background:var(--panel); color:var(--text); min-height:44px; display:flex; align-items:center;}
.form-field .field-readonly--compact{min-height:auto; padding:.5rem .75rem;}
.form-field .field-readonly--multiline{align-items:flex-start; white-space:pre-wrap;}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{ outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12); }
.form-field textarea{resize:vertical;}
.form-field--checkbox{ flex-direction:row; align-items:center; gap:12px; }
.form-field--checkbox input{ width:auto; min-width:0; }
.form-error{ color:#b91c1c; font-size:13px; font-weight:500; margin-top:4px; display:block; }
.form-field__label{font-size:13px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.06em;}
.form-field__hint{margin-top:4px; font-size:12px; color:var(--muted);}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
.selector{display:flex; justify-content:space-between; align-items:center; border:1px solid var(--border); border-radius:12px; padding:.75rem 1rem; background:var(--panel); color:var(--text); font-size:14px; cursor:pointer;}

.quote-card__attachments{display:grid; grid-template-columns:minmax(0,1fr); gap:1rem 1.25rem;}
.quote-card__attachment{display:flex; flex-direction:column; gap:.5rem;}

.quote-line-items{gap:1.25rem;}
.quote-line-items__table{border:1px solid var(--border); border-radius:12px; overflow:hidden;}
.quote-line-items__header{display:grid; grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,1fr)) auto; background:var(--panel-alt); padding:.75rem 1rem; font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.05em;}
.quote-line-items__row{display:grid; grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,1fr)) auto; gap:.5rem; padding:1rem; font-size:14px; align-items:center; background:var(--white);}
.quote-line-items__row + .quote-line-items__row{border-top:1px solid var(--border);}
.quote-line-items__name{font-weight:600; color:var(--text); display:block;}
.quote-line-items__note{color:var(--muted); font-size:12px; margin-top:2px;}
.quote-line-items__row--editor{gap:1rem;}
.quote-line-items__item{position:relative; display:flex; flex-direction:column; gap:.25rem;}
.quote-line-items__input-group{display:flex; align-items:center;}

/* Invoice line items use identical grid and visuals */
.invoice-line-items{gap:1.25rem;}
.invoice-line-items__table{border:1px solid var(--border); border-radius:12px; overflow:hidden;}
.invoice-line-items__header{display:grid; grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,1fr)) auto; background:var(--panel-alt); padding:.75rem 1rem; font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.05em;}
.invoice-line-items__row{display:grid; grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,1fr)) auto; gap:.5rem; padding:1rem; font-size:14px; align-items:center; background:var(--white);}
.invoice-line-items__row + .invoice-line-items__row{border-top:1px solid var(--border);}
.invoice-line-items__name{font-weight:600; color:var(--text); display:block;}
.invoice-line-items__note{color:var(--muted); font-size:12px; margin-top:2px;}
.invoice-line-items__row--editor{gap:1rem;}
.invoice-line-items__item{position:relative; display:flex; flex-direction:column; gap:.25rem;}
.invoice-line-items__input-group{display:flex; align-items:center;}
.invoice-line-items__input{width:100%; border:1px solid var(--border); border-radius:12px; padding:.65rem .85rem; font-size:14px; background:var(--panel);}
.invoice-line-items__input:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-line-items__discount{display:flex; align-items:center;}
.invoice-line-items__discount-trigger{width:100%; border:1px solid var(--border); border-radius:12px; padding:.65rem .85rem; font-size:14px; font-weight:600; background:var(--panel); color:var(--text); display:flex; align-items:center; justify-content:center; gap:.5rem; cursor:pointer; transition:background-color .2s ease, border-color .2s ease, box-shadow .2s ease;}
.invoice-line-items__discount-trigger:hover{background:var(--panel-alt);}
.invoice-line-items__discount-trigger:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-line-items__discount-trigger span{pointer-events:none;}
.invoice-line-items__note--discount{color:var(--muted); font-size:12px;}
.invoice-line-items__total{text-align:right; font-weight:600; display:flex; flex-direction:column; gap:.25rem; align-items:flex-end;}
.invoice-line-items__actions{display:flex; justify-content:flex-end;}
.invoice-line-items__remove{border:0; background:none; color:var(--muted); padding:.25rem; border-radius:8px; cursor:pointer;}
.invoice-line-items__remove:hover{color:var(--red); background:var(--panel-alt);}
.invoice-line-items__add{display:inline-flex; align-items:center; gap:.5rem; border:1px dashed var(--border); color:var(--btn-blue); background:var(--white); border-radius:12px; padding:.75rem 1rem; font-weight:600; cursor:pointer;}
.invoice-line-items__add:hover{background:var(--panel-alt);}
.quote-line-items__input{width:100%; border:1px solid var(--border); border-radius:12px; padding:.65rem .85rem; font-size:14px; background:var(--panel);}
.quote-line-items__input:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.quote-line-items__discount{display:flex; align-items:center;}
.quote-line-items__discount-trigger{width:100%; border:1px solid var(--border); border-radius:12px; padding:.65rem .85rem; font-size:14px; font-weight:600; background:var(--panel); color:var(--text); display:flex; align-items:center; justify-content:center; gap:.5rem; cursor:pointer; transition:background-color .2s ease, border-color .2s ease, box-shadow .2s ease;}
.quote-line-items__discount-trigger:hover{background:var(--panel-alt);}
.quote-line-items__discount-trigger:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.quote-line-items__discount-trigger span{pointer-events:none;}
.quote-line-items__note--discount{color:var(--muted); font-size:12px;}
.quote-line-items__total{text-align:right; font-weight:600; display:flex; flex-direction:column; gap:.25rem; align-items:flex-end;}
.quote-line-items__actions{display:flex; justify-content:flex-end;}
.quote-line-items__remove{border:0; background:none; color:var(--muted); padding:.25rem; border-radius:8px; cursor:pointer;}
.quote-line-items__remove:hover{color:var(--red); background:var(--panel-alt);}
.quote-line-items__add{display:inline-flex; align-items:center; gap:.5rem; border:1px dashed var(--border); color:var(--btn-blue); background:var(--white); border-radius:12px; padding:.75rem 1rem; font-weight:600; cursor:pointer;}
.quote-line-items__add:hover{background:var(--panel-alt);}
.quote-dropdown{position:relative; width:100%;}
.quote-dropdown .selector{width:100%; gap:.75rem; text-align:left;}
.quote-dropdown .dropdown__menu{left:0; right:0; min-width:100%;}
.quote-line-items__body{display:flex; flex-direction:column;}
.line-items-picker{display:flex; flex-direction:column; gap:.75rem; position:relative;}
.line-items-picker__control{display:flex; align-items:center; gap:.75rem; border:1px dashed var(--border); border-radius:12px; padding:.75rem 1rem; background:var(--panel);}
.line-items-picker__icon{display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:var(--white); color:var(--btn-blue); font-size:14px;}
.line-items-picker__input{flex:1; border:0; background:transparent; font-size:14px; color:var(--text); outline:none;}
.line-items-picker__input::placeholder{color:var(--muted);}
.line-items-picker__info{border:0; background:none; color:var(--muted); cursor:pointer; padding:0; font-size:18px; display:inline-flex; align-items:center;}
.line-items-picker__info:hover{color:var(--btn-blue);}
.line-items-dropdown{position:absolute; top:calc(100% + 8px); left:0; right:0; background:var(--white); border:1px solid var(--border); border-radius:12px; box-shadow:0 12px 32px rgba(15,23,42,0.12); padding:.5rem 0; z-index:60; max-height:360px; overflow:auto; display:flex; flex-direction:column; gap:.25rem;}
.line-items-dropdown__option{display:flex; flex-direction:column; align-items:flex-start; text-align:left; background:none; border:0; padding:.75rem 1rem; width:100%; gap:.25rem; cursor:pointer; color:var(--text);}
.line-items-dropdown__option:hover{background:var(--panel-alt);}
.line-items-dropdown__option--active,.line-items-dropdown__option--active:hover{background:var(--btn-blue-ghost); color:var(--btn-blue);}
.line-items-dropdown__option--ghost{color:var(--btn-blue); font-weight:600;}
.line-items-dropdown__title{font-weight:600; font-size:14px;}
.line-items-dropdown__meta{font-size:12px; color:var(--muted);}
.line-items-dropdown__price{margin-top:.25rem; font-size:13px; color:var(--muted); align-self:flex-end;}
.quote-dropdown__menu{max-height:320px; overflow:auto;}
.quote-dropdown__search{padding:12px 16px; border-bottom:1px solid var(--line);}
.quote-dropdown__search input{width:100%; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.quote-dropdown__search input:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.quote-dropdown__section{display:flex; flex-direction:column; gap:4px; padding:8px 0;}
.quote-dropdown__section + .quote-dropdown__section{border-top:1px solid var(--line);}
.quote-dropdown__empty{padding:12px 16px; font-size:13px; color:var(--muted); margin:0;}
.quote-dropdown__item-note{display:block; font-size:12px; color:var(--muted); margin-top:2px;}
.quote-dropdown__create{font-weight:600;}
.quote-attachments__body{display:flex; flex-direction:column; gap:.75rem;}
.quote-attachments__dropzone{display:flex; align-items:flex-start; gap:.75rem; padding:1rem 1.25rem; border:1px dashed var(--border); border-radius:12px; background:var(--panel);}
.quote-attachments__icon{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:var(--white); color:var(--btn-blue); font-size:16px; flex-shrink:0;}
.quote-attachments__content{display:flex; flex-direction:column; gap:.5rem;}
.quote-attachments__button{min-width:0;}
.quote-attachments__hint{font-size:12px; color:var(--muted); margin:0;}
.quote-attachments__list{list-style:none; display:flex; flex-direction:column; gap:.5rem; margin:0; padding:0;}
.quote-attachments__item{display:flex; align-items:center; gap:.5rem; font-size:13px; color:var(--muted);}
.quote-attachments__item i{color:var(--btn-blue);}
.quote-service-date{display:flex; align-items:center; gap:.75rem;}
.quote-service-date input[type="date"]{flex:1; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.quote-service-date input[type="date"]:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.quote-summary__row--action .link{display:inline-flex; align-items:center; gap:.5rem; font-weight:600;}
.quote-summary__row--action .link i{font-size:16px;}
.quote-summary__empty{font-size:13px; color:var(--muted); margin:4px 0 0;}
.quote-communication__date{width:100%; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.quote-communication__date:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.quote-communication__send-options{display:flex; gap:.75rem; margin-bottom:.5rem; flex-wrap:wrap;}
.quote-communication__send-option{display:flex; align-items:center; gap:.4rem;}
.quote-communication__send-schedule{display:flex; flex-direction:column; gap:.5rem;}
.quote-communication__schedule-inputs{display:flex; gap:.5rem;}
.quote-communication__schedule-inputs .quote-communication__date{flex:1 1 0;}
.quote-activity-log{margin:0;}
.quote-activity-log__card{border:1px solid var(--border);border-radius:12px;padding:1rem;background:var(--panel);display:flex;flex-direction:column;gap:.65rem;}
.quote-activity-log__card--scrollable{max-height:22rem;overflow:auto;scrollbar-width:thin;scrollbar-gutter:stable;}
.quote-activity-log__card--scrollable:focus{outline:none;box-shadow:0 0 0 3px rgba(37,99,235,.18);border-color:var(--focus);}
.quote-activity-log__card--scrollable::-webkit-scrollbar{width:8px;height:8px;}
.quote-activity-log__card--scrollable::-webkit-scrollbar-track{background:transparent;}
.quote-activity-log__card--scrollable::-webkit-scrollbar-thumb{background-color:rgba(148,163,184,.5);border-radius:999px;}
.quote-activity-log__card--empty{border-style:dashed;color:var(--muted);background:transparent;text-align:center;}
.quote-activity-log__entry{display:flex;flex-direction:column;gap:.2rem;font-size:14px;color:var(--text);}
.quote-activity-log__entry+.quote-activity-log__entry{padding-top:.65rem;border-top:1px solid var(--border);}
.quote-activity-log__line{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;}
.quote-activity-log__title{font-weight:600;color:var(--text);}
.quote-activity-log__meta{display:flex;align-items:center;gap:.35rem;font-size:12px;color:var(--muted);}
.quote-activity-log__actor{font-weight:600;color:var(--text);}
.quote-activity-log__extra a{font-size:12px;color:var(--primary);text-decoration:none;}
.quote-activity-log__extra a:hover{text-decoration:underline;}
.quote-actions{position:relative;display:inline-flex;}
.quote-actions__toggle{background:var(--panel);border:1px solid var(--border);border-radius:999px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;font-size:18px;line-height:1;cursor:pointer;color:var(--text);}
.quote-actions__toggle:hover{border-color:var(--focus);}
.quote-actions__menu{position:absolute;top:calc(100% + 4px);right:0;background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 24px rgba(15,23,42,0.12);padding:.25rem 0;min-width:200px;z-index:20;list-style:none;margin:0;}
.quote-actions__menu.is-floating{position:fixed;right:auto;}
.quote-actions__menu[hidden]{display:none;}
.quote-actions__item{display:block;width:100%;text-align:left;background:none;border:0;padding:.5rem 1rem;font-size:14px;color:var(--text);cursor:pointer;}
.quote-actions__item:hover:not([disabled]){background:var(--surface);}
.quote-actions__item[disabled]{opacity:.55;cursor:not-allowed;}
.quote-actions__item[aria-disabled="true"]{opacity:.55;cursor:not-allowed;}
.quote-tax-list{display:flex; flex-direction:column; gap:8px; margin:0; padding:0; border:0;}
.quote-tax-list__title{font-size:14px; font-weight:600; margin:0 0 4px;}
.quote-tax-list__option{display:flex; align-items:center; gap:12px; padding:8px 0; font-size:14px; border-bottom:1px solid var(--line);}
.quote-tax-list__option:last-of-type{border-bottom:0;}
.quote-tax-list__option input{width:16px; height:16px;}
.quote-tax-list__option span{display:flex; flex-direction:column; gap:2px;}
.quote-tax-list__option small{font-size:12px; color:var(--muted);}

.quote-summary__body{gap:1rem;}
.link--icon{display:inline-flex; align-items:center; gap:.4rem; font-weight:600;}
.quote-summary__list{margin:0; padding:0; display:flex; flex-direction:column; gap:.65rem;}
.quote-summary__list--muted .quote-summary__row{color:var(--muted);}
.quote-summary__list--muted .quote-summary__row dd{color:var(--muted);}
.quote-summary__row{display:flex; justify-content:space-between; font-size:14px; color:var(--text);}
.quote-summary__row--muted{color:var(--muted);}
.quote-summary__row--muted dd{color:var(--muted);}
.quote-summary__row dt{font-weight:500;}
.quote-summary__row dd{margin:0; font-weight:600;}
.quote-summary__total{display:flex; justify-content:space-between; align-items:center; font-size:18px; font-weight:600;}
.quote-summary .btn.full{width:100%; border-radius:12px;}
.quote-save-draft__intro{font-size:14px; color:var(--muted); margin:0;}
.quote-save-draft__success{display:flex; flex-direction:column; gap:1rem;}
.quote-save-draft__title{margin:0; font-size:18px; font-weight:600;}
.quote-save-draft__note{margin:0; font-size:14px; color:var(--muted);}
.quote-preview{display:flex; flex-direction:column; gap:1.25rem;}
.quote-preview__details{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem 1.25rem;}
.quote-preview__field{display:flex; flex-direction:column; gap:.35rem; font-size:14px;}
.quote-preview__field--wide{grid-column:1 / -1;}
.quote-preview__label{font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);}
.quote-preview__value{color:var(--text);}
.quote-preview__message{white-space:pre-wrap;}
.quote-preview__recipient-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.35rem;}
.quote-preview__summary{display:flex; flex-direction:column; gap:1rem;}
.quote-preview__document .quote-summary__empty{margin-top:1rem;}

.quote-communication__share{display:flex; flex-direction:column; gap:.75rem; padding:0; margin:0; border:0;}
.quote-communication__share legend{font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:.5rem;}
.radio-option{display:flex; align-items:center; gap:.6rem; font-size:14px;}
.radio-option input{accent-color:var(--btn-blue);}
.quote-communication__schedule{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem;}

@media (max-width: 1200px){
  .quote-create__layout{grid-template-columns: minmax(0,1fr);}
  .quote-create__sidebar{flex-direction:column;}
}

@media (max-width: 768px){
  .quote-create{padding:1rem;}
  .quote-create__topbar{flex-direction:column; align-items:flex-start;}
  .quote-create__actions{width:100%; justify-content:flex-start; flex-wrap:wrap;}
  .quote-create__actions .btn{width:auto;}
  .form-grid{grid-template-columns:minmax(0,1fr);}
  .quote-card__attachments{grid-template-columns:minmax(0,1fr);}
  .quote-communication__schedule{grid-template-columns:minmax(0,1fr);}
}

/* ====================
   Contacts
==================== */
.contacts-main{ display:flex; flex-direction:column; gap:12px; }
.contacts-topbar__meta{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.contacts-topbar__total{ font-weight:500; color:var(--muted); }
.contacts-topbar__subtitle{ margin:4px 0 0; color:var(--muted); font-size:14px; }
.contacts-toolbar{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; position:relative; z-index:120; overflow:visible; }
.contacts-toolbar__search{ flex:1 1 260px; display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:12px; padding:0 14px; background:#f8fafc; min-height:48px; position:relative; }
.contacts-toolbar__search i{ color:var(--muted); font-size:16px; }
.contacts-toolbar__search input{ border:0; background:transparent; font-size:15px; padding:0; flex:1 1 auto; min-width:0; }
.contacts-toolbar__search input:focus{ outline:none; }
.contacts-toolbar__clear{ display:none; border:0; background:transparent; color:var(--muted); cursor:pointer; padding:2px; font-size:16px; }
.contacts-toolbar__clear.is-visible{ display:inline-flex; }
.contacts-toolbar__spacer{ flex:1 1 auto; }
.contacts-toolbar__actions{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.contacts-toolbar .btn{ min-height:42px; padding:0.75rem 1.1rem; }

.dropdown{ position:relative; }
.dropdown__menu{ position:absolute; top:calc(100% + 8px); right:0; background:var(--white); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); padding:8px 0; min-width:220px; display:flex; flex-direction:column; gap:4px; z-index:40; }
.dropdown__menu[hidden]{ display:none; }
.dropdown__item{ display:flex; align-items:center; gap:10px; padding:10px 16px; background:transparent; border:0; width:100%; text-align:left; font-size:14px; color:inherit; text-decoration:none; cursor:pointer; }
.dropdown__item.is-hidden{ display:none; }
.dropdown__item i{ font-size:16px; color:var(--muted); }
.dropdown__item:hover{ background:var(--panel-alt); }
.dropdown__chevron{ font-size:14px; margin-left:6px; }
.row-actions{ display:inline-flex; align-items:center; justify-content:flex-end; gap:8px; }
.row-actions__form{ margin:0; }

.contacts-name{ display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; }
.contacts-name:hover .contacts-name__primary{ text-decoration:underline; }

.contacts-card{ display:flex; flex-direction:column; gap:18px; padding:20px; }
.contacts-card__header{ display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:16px; }
.contacts-card__title{ margin:0; font-size:18px; font-weight:600; }
.contacts-card__subtitle{ margin:4px 0 0; color:var(--muted); font-size:14px; }
.contacts-card__filters{ display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; }
.contacts-filter{ display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--muted); }
.contacts-filter select{ min-width:160px; }

.contacts-table-wrap{ display:flex; flex-direction:column; gap:12px; }
.contacts-table-container{ border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--white); }
.contacts-section{ display:grid; grid-template-columns:40px minmax(0,1fr); gap:12px; align-items:start; }
.contacts-section + .contacts-section{ padding-top:8px; border-top:1px solid var(--line); }
.contacts-section__label{ font-weight:600; color:var(--muted); padding-top:18px; }
.contacts-table{ width:100%; border-collapse:collapse; font-size:14px; }
.contacts-table thead th{ text-align:left; padding:14px 16px; color:var(--muted); font-weight:500; background:#f9fafb; }
.contacts-table tbody td{ padding:16px; border-top:1px solid var(--line); vertical-align:middle; }
.contacts-table tbody tr:hover{ background:#f8fafc; }
.contacts-name__initial{ width:36px; height:36px; border-radius:10px; background:#111827; color:#fff; font-weight:600; display:inline-flex; align-items:center; justify-content:center; }
.contacts-name__meta{ display:flex; flex-direction:column; gap:2px; }
.contacts-name__primary{ font-weight:600; }
.contacts-name__secondary{ font-size:12px; color:var(--muted); }
.contacts-type{ display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; }
.contacts-type--customer{ background:#ecfdf5; color:#047857; }
.contacts-type--supplier{ background:#eef2ff; color:#4338ca; }
.contacts-empty{ text-align:center; padding:48px 16px; border:1px dashed var(--line); border-radius:16px; background:var(--panel-alt); }
.contacts-empty__title{ margin:0 0 8px; font-size:18px; font-weight:600; }
.contacts-empty__body{ margin:0 0 16px; color:var(--muted); }
.contacts-search-empty{ text-align:center; padding:48px 16px; border:1px dashed var(--line); border-radius:16px; background:var(--panel-alt); display:flex; flex-direction:column; gap:12px; align-items:center; }
.contacts-search-empty[hidden]{ display:none; }
.contacts-search-empty i{ font-size:32px; color:var(--muted); }
.contacts-search-empty__title{ margin:0; font-size:18px; font-weight:600; }
.contacts-search-empty__body{ margin:0; color:var(--muted); }

.contacts-breadcrumb{ display:inline-flex; align-items:center; gap:8px; text-decoration:none; color:var(--btn-blue); font-size:14px; margin-bottom:8px; }
.contacts-breadcrumb:hover{ text-decoration:underline; }

.contact-profile{ display:flex; flex-direction:column; gap:24px; }
.contact-profile__header-card{ display:flex; align-items:center; gap:20px; padding:24px; }
.contact-profile__avatar{ width:72px; height:72px; border-radius:20px; background:#111827; color:#fff; display:flex; align-items:center; justify-content:center; font-size:28px; font-weight:600; }
.contact-profile__identity h2{ margin:0; font-size:24px; }
.contact-profile__identity p{ margin:4px 0; color:var(--muted); }
.contact-profile__meta{ margin-left:auto; display:flex; flex-direction:column; gap:6px; text-align:right; font-size:14px; }
.contact-profile__meta a{ color:var(--btn-blue); text-decoration:none; }
.contact-profile__meta a:hover{ text-decoration:underline; }
.contact-profile__grid{ display:grid; grid-template-columns:minmax(0,2fr) minmax(260px,1fr); gap:24px; align-items:start; }
.contact-profile__form{ display:flex; flex-direction:column; gap:24px; }
.contact-profile__form-header{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.contact-profile__form-header h3{ margin:0; font-size:18px; font-weight:600; }
.contact-profile__form-header p{ margin:4px 0 0; color:var(--muted); font-size:14px; }
.contact-profile__fields{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); }
.inline-field{ display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--muted); }
.inline-field span{ font-weight:600; }
.inline-field input,
.inline-field select,
.inline-field textarea{ border:1px solid var(--line); border-radius:12px; padding:12px; font-size:15px; background:var(--panel-alt); transition:border-color .2s, background .2s; }
.inline-field textarea{ resize:vertical; min-height:120px; }
.inline-field--wide{ grid-column:1 / -1; }

.inline-edit__actions{ display:flex; align-items:center; gap:12px; margin-left:auto; }
.inline-edit__confirm{ display:none; align-items:center; gap:10px; }
[data-inline-edit] .inline-edit__confirm{ display:none; }
[data-inline-edit].is-editing .inline-edit__confirm{ display:flex; }
[data-inline-edit].is-editing [data-inline-edit-toggle]{ display:none; }
[data-inline-edit] [data-inline-edit-field]{ pointer-events:none; }
[data-inline-edit] [data-inline-edit-field][readonly],
[data-inline-edit] [data-inline-edit-field][disabled]{ color:inherit; }
[data-inline-edit].is-editing [data-inline-edit-field]{ pointer-events:auto; background:var(--white); border-color:var(--btn-blue); }
[data-inline-edit].is-editing [data-inline-edit-field]:focus{ outline:none; box-shadow:0 0 0 2px rgba(0,106,255,0.12); }

.contact-profile__danger{ display:flex; flex-direction:column; gap:16px; padding:24px; border:1px solid #fecaca; background:#fff5f5; border-radius:16px; }
.contact-profile__danger h3{ margin:0; font-size:18px; font-weight:600; }
.contact-profile__danger p{ margin:0; color:#b91c1c; }
.catalog-profile{ display:flex; flex-direction:column; gap:24px; padding:32px 0; }
.catalog-profile__header-card{ display:flex; align-items:flex-start; gap:20px; padding:24px; }
.catalog-profile__avatar{ width:72px; height:72px; border-radius:20px; background:#111827; color:#fff; display:flex; align-items:center; justify-content:center; font-size:28px; font-weight:600; text-transform:uppercase; }
.catalog-profile__identity{ display:flex; flex-direction:column; gap:12px; }
.catalog-profile__identity h2{ margin:0; font-size:24px; }
.catalog-profile__description{ margin:0; color:var(--muted); max-width:540px; }
.catalog-profile__tags{ display:flex; flex-wrap:wrap; gap:8px; }
.catalog-chip{ display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; background:#f3f4f6; color:#111827; }
.catalog-profile__meta{ margin-left:auto; display:grid; gap:12px; text-align:right; }
.catalog-profile__meta-item{ display:flex; flex-direction:column; gap:2px; }
.catalog-profile__meta-label{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:600; }
.catalog-profile__meta-value{ font-size:16px; font-weight:600; color:var(--text); }
.catalog-profile__grid{ display:grid; grid-template-columns:minmax(0,2fr) minmax(260px,1fr); gap:24px; align-items:start; }
.catalog-profile__stack{ display:flex; flex-direction:column; gap:24px; }
.catalog-profile__sidebar{ display:flex; flex-direction:column; gap:24px; }
.catalog-profile__block{ display:flex; flex-direction:column; gap:20px; padding:24px; }
.catalog-profile__block-header{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.catalog-profile__block-title{ margin:0; font-size:18px; font-weight:600; }
.catalog-profile__block-description{ margin:4px 0 0; color:var(--muted); font-size:14px; max-width:420px; }
.catalog-profile__list{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.catalog-profile__list-item{ display:flex; flex-direction:column; gap:4px; padding:12px 14px; border:1px solid var(--border); border-radius:14px; background:#fff; }
.catalog-profile__list-item dt{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:600; }
.catalog-profile__list-item dd{ margin:0; font-size:18px; font-weight:600; color:var(--text); }
.catalog-profile__list-item--highlight{ border-color:#d1fae5; background:#ecfdf5; }
.catalog-profile__empty{ margin:0; color:var(--muted); }
.catalog-profile__notes{ margin:0; color:var(--text); line-height:1.6; }
.catalog-profile__taxes{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.catalog-profile__taxes li{ padding:10px 12px; border:1px solid var(--border); border-radius:12px; font-weight:500; color:var(--text); }
.btn--danger{ background:#fee2e2; color:#b91c1c; border-color:transparent; }
.btn--danger:hover{ background:#fecaca; }
.btn--danger:active{ background:#fca5a5; color:#7f1d1d; }

.modal__stack{ display:flex; flex-direction:column; gap:20px; }
.modal__description{ margin:0; color:var(--muted); font-size:14px; }
.modal__description a{ color:var(--btn-blue); text-decoration:underline; }
.modal__description a:hover{ text-decoration:none; }

.modal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; padding:24px; z-index:120; }
.modal--fullscreen{ padding:0; align-items:stretch; justify-content:center; }
.modal.is-open{ display:flex; }
.modal[hidden]{ display:none !important; }
.modal__overlay{ position:absolute; inset:0; background:rgba(15,23,42,0.45); }
.modal__dialog{ position:relative; background:var(--surface); border-radius:18px; border:1px solid var(--line); box-shadow:0 24px 48px rgba(15,23,42,0.18); max-width:720px; width:100%; max-height:90vh; display:flex; flex-direction:column; overflow:hidden; }
.modal__dialog--fullscreen{ max-width:none; width:100%; height:100%; max-height:none; border-radius:0; }
.modal__header{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:24px 28px 0; }
.modal__header--fullscreen{ padding:32px 40px 0; }
.modal__title{ margin:0; font-size:22px; font-weight:700; }
.modal__subtitle{ margin:6px 0 0; color:var(--muted); font-size:14px; }
.modal__close{ border:0; background:transparent; color:var(--muted); cursor:pointer; font-size:18px; padding:4px; }
.modal__body{ padding:0 28px 28px; display:flex; flex-direction:column; gap:24px; overflow-y:auto; }
.modal__body--fullscreen{ flex:1; padding:0 40px 40px; overflow:auto; }
.quote-preview-modal{ flex:1; display:flex; justify-content:center; padding:32px 0 48px; }
.quote-preview-modal .quote.A4{ width:min(100%,960px); background:var(--surface); }
.quote-preview__adjustments{ margin-top:12px; display:flex; flex-direction:column; gap:8px; }
.quote-preview__recipient-list{ margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px; list-style:disc; }
.quote-message{ margin:32px 0 24px; }
.quote-message h2{ margin:0 0 12px; font-size:18px; font-weight:700; }
.quote-message p{ margin:0; font-size:14px; line-height:1.6; white-space:pre-wrap; }
.modal__grid{ display:grid; gap:18px; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); }
/* Ensure tax row fields (scheme, value, delete) stay on one row */
.tax-row .modal__grid{
  grid-template-columns: 1fr 1fr auto;
  align-items: end;
}
.modal-field{ display:flex; flex-direction:column; gap:6px; }
.modal-field__label{ font-size:13px; font-weight:600; color:var(--muted); }
.modal-field--wide{ grid-column:1 / -1; }
.modal-field--checkbox{ flex-direction:row; align-items:center; gap:12px; }
.modal-field--checkbox input{ width:auto; min-width:0; }
.modal__footer{ display:flex; justify-content:flex-end; gap:12px; padding-top:8px; }
.modal__footer .btn{ min-width:120px; }

@media (max-width: 768px){
  .contacts-topbar{ flex-direction:column; align-items:flex-start; gap:8px; }
  .contacts-topbar__meta{ margin-left:0; }
  .contacts-toolbar{ flex-direction:column; align-items:stretch; }
  .contacts-toolbar__actions{ width:100%; justify-content:flex-start; }
  .contacts-toolbar__spacer{ display:none; }
  .contacts-card__header{ flex-direction:column; align-items:flex-start; }
  .contacts-section{ grid-template-columns:32px 1fr; }
  .modal__dialog{ max-height:96vh; }
  .modal__header--fullscreen{ padding:20px 20px 0; }
  .modal__body--fullscreen{ padding:0 20px 28px; }
  .quote-preview-modal{ padding:20px 0 32px; }
  .contact-profile__grid{ grid-template-columns:minmax(0,1fr); }
  .contact-profile__meta{ margin-left:0; text-align:left; }
  .contact-profile__header-card{ flex-direction:column; align-items:flex-start; }
}

@media (max-width: 960px){
  .catalog-profile__grid{ grid-template-columns:minmax(0,1fr); }
  .catalog-profile__meta{ margin-left:0; text-align:left; }
}

@media (max-width: 720px){
  .catalog-profile__header-card{ flex-direction:column; align-items:flex-start; }
  .catalog-profile__meta{ width:100%; text-align:left; }
  .catalog-profile__block{ padding:20px; }
  .catalog-profile{ padding:24px 0; }
  .catalog-topbar{ flex-direction:column; align-items:flex-start; gap:8px; }
  .catalog-topbar__actions{ margin-left:0; width:100%; flex-wrap:wrap; }
  .catalog-topbar__actions .btn{ width:100%; justify-content:center; }
}

@media (max-width: 540px){
  .contacts-toolbar__actions{ flex-direction:column; }
  .contacts-toolbar .btn{ width:100%; justify-content:center; }
  .modal__dialog{ padding-top:12px; }
  .modal__header{ padding:16px 20px 0; }
  .modal__body{ padding:0 20px 20px; }
  .modal__header--fullscreen{ padding:16px 16px 0; }
  .modal__body--fullscreen{ padding:0 16px 20px; }
}


/* Invoice styles mirrored from quotes */
html.invoices-page-root,
body.invoices-page-root{
  overflow-x:hidden;
}
.main--invoices{
  display:flex;
  flex-direction:column;
  min-height:100%;
  overflow:visible;
}
.main--invoices > .invoices-main{
  flex:1;
  display:flex;
  flex-direction:column;
  min-height:0;
}
.invoice.A4 {
  --accent: #111;                   
  --ink: #111;
  --muted: #6b7280;
  --line: #e5e7eb;
  --radius: 10px;
  --thin: 0.8px;
  width: 210mm;
  height: 297mm; /* Standard A4 height */
  padding: 8mm 16mm 16mm;
  color: var(--ink);
  font: 12px/1.5 Inter, "Segoe UI", system-ui, Arial, sans-serif;
  background: #fff;
  margin: 0 auto;
  box-sizing: border-box;
  overflow: hidden; /* Prevent scroll */
  page-break-after: always; /* Force page break after */
  @media print {
    size: A4 portrait; /* Set print size */
    margin: 0;
  }
}
.invoice-header {
  display: grid;
  grid-template-columns: 220px 1fr 280px; /* Adjusted right column width */
  grid-template-rows: auto;
  gap: 8px 16mm; /* Using mm units for A4 consistency */
  align-items: start;
  padding-top: -20px; /* Adjusted to move logo higher */
  margin-bottom: 16mm; /* Standard A4 margin */
}
.invoice-header > .card{ grid-column: 3 / 4; justify-self: end; }
  .invoice.A4 { box-shadow: none; }
.invoices-main{
  flex:1;
  display:flex;
  flex-direction:column;
  min-height:0;
}
.invoices-main .page{
  flex:1;
  display:flex;
  flex-direction:column;
  min-height:0;
}
.invoices-main .page.px{ padding:0rem; }
.invoices-main .content{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:0;
}
.invoices-main .card{ background: var(--white); border: 1px solid var(--border); border-radius: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.invoices-main .kpi{ padding: 16px 18px; margin-bottom: 16px; }
.invoices-main .kpi-top{ display:flex; justify-content:space-between; align-items:center; }
.invoices-main .kpi-label{ color: var(--muted); font-size: 12px; }
.invoices-main .kpi-value{ font-size: 28px; font-weight: 600; }
.invoices-main .kpi-overdue{ margin-top: 12px; }
.invoices-main .kpi-overdue-line{ display:flex; align-items:center; gap:8px; color: var(--muted); font-size: 13px; margin-bottom: 6px; }
.invoices-main .analytics-grid{
  margin:0;
  gap:16px;
}
.invoices-main .dot{ width:8px; height:8px; border-radius:50%; display:inline-block; }
.invoices-main .dot-green{ background:#22c55e; }
.invoices-main .dot-red{ background: var(--red); }
.invoices-main .bar{ height: 8px; background:#f1f2f4; border-radius: 999px; }
.invoices-main .bar-green{ height: 8px; background:#22c55e; border-radius: 999px; }
.invoices-main .controls{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.invoices-main .search{ position:relative; }
.invoices-main .search .icon{ position:absolute; left:10px; top:8px; color:#9ca3af; }
.invoices-main .search input{ padding:8px 12px 8px 32px; border:1px solid var(--border); border-radius:999px; min-width:260px; outline:none; }
.invoices-main .pill{ border:1px solid var(--border); border-radius:999px; background:#fff; padding:8px 14px; font-size:13px; }
.invoices-main .pill.light{ background:#f3f4f6; }
.invoices-main .pill-dropdown{ position:relative; display:inline-block; }
.invoices-main .pill-dropdown > summary{ list-style:none; cursor:pointer; }
.invoices-main .pill-dropdown > summary::-webkit-details-marker{ display:none; }
.invoices-main .pill-dropdown-label{ display:inline-flex; align-items:center; gap:8px; border:1px solid var(--border); border-radius:999px; background:#fff; padding:8px 14px; font-size:13px; color:var(--text); }
.invoices-main .pill-dropdown[open] > summary .pill-dropdown-label{ border-color:var(--accent); box-shadow:0 0 0 3px var(--btn-blue-ghost); }
.invoices-main .pill-dropdown-title{ color:var(--muted); font-weight:500; }
.invoices-main .pill-dropdown-value{ font-weight:600; }
.invoices-main .pill-dropdown-caret{ font-size:10px; line-height:1; color:var(--muted); }
.invoices-main .pill-dropdown-menu{ position:absolute; top:calc(100% + 8px); left:0; min-width:200px; background:#fff; border:1px solid var(--border); border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,0.08); padding:8px 0; z-index:50; }
.invoices-main .pill-dropdown-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.invoices-main .pill-dropdown-item{ width:100%; text-align:left; background:none; border:0; padding:8px 16px; font-size:13px; color:var(--text); cursor:pointer; border-radius:8px; }
.invoices-main .pill-dropdown-item:hover{ background:var(--panel-alt); }
.invoices-main .pill-dropdown-item.is-active{ background:var(--btn-blue-ghost); color:var(--btn-blue); font-weight:600; }
.invoices-main .flex-spacer{ flex:1; }
.invoices-main .btn{ border-radius:12px; padding:9px 16px; font-weight:500; border:1px solid var(--black); }
.invoices-main .btn.ghost{ background:#fff; color:#111; border-color:var(--border); }
.invoices-main .btn.ghost.sm{ padding:6px 10px; font-size:12px; }
.invoices-main .btn.primary{ background:var(--black); color:#fff; border-color:var(--black); }
.invoices-main .dropdown{ position:relative; }
.invoices-main .dropdown .menu{ display:none; position:absolute; right:0; top:110%; background:#fff; border:1px solid var(--border); border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.08); min-width:200px; padding:6px 0; }
.invoices-main .dropdown:hover .menu{ display:block; }
.invoices-main .dropdown .menu a{ display:block; padding:10px 14px; color:#111; text-decoration:none; }
.invoices-main .dropdown .menu a:hover{ background:#f8fafc; }
.invoices-main .content > .invoices-table{
  flex:1;
}
.invoices-table{ padding:0; }
.invoices-main .invoices-table{
  display:flex;
  flex-direction:column;
  min-height:0;
  gap:0;
}
.invoices-main .table-wrapper{
  flex:1;
  overflow:auto;
  min-height:0;
  padding:0 16px 16px;
  background:var(--panel, #fff);
}
.invoices-main .table{ width:100%; border-collapse:separate; border-spacing:0; font-size:14px; min-width:100%; }
.invoices-main .table thead th{
  position:sticky;
  top:0;
  z-index:2;
  text-align:left;
  color:#6b7280;
  font-weight:500;
  padding:12px;
  background:var(--surface, var(--panel, #fff));
  box-shadow:inset 0 -1px 0 var(--border), 0 1px 0 rgba(15,23,42,0.04);
  background-clip:padding-box;
}
.invoices-main .table tbody td{ padding:14px 12px; border-bottom:1px solid var(--border); }
.invoices-main .text-right{ text-align:right; }
.invoices-main .w-32{ width:32px; }
.invoices-main .ml{ margin-left:6px; }
.invoices-main .kebab{ cursor:pointer; padding:4px 8px; border-radius:8px; }
.invoices-main .kebab:hover{ background:#f3f4f6; }
.invoices-main .badge{ padding:4px 8px; border-radius:999px; font-size:12px; font-weight:600; }
.invoices-main .badge.green{ color:#065f46; background:#d1fae5; }
.invoices-main .badge.red{ color:#991b1b; background:#fee2e2; }
.invoices-main .badge.gray{ color:#374151; background:#e5e7eb; }
.invoices-main .badge.blue{ color:#1d4ed8; background:#dbeafe; }
.invoices-main .empty{ text-align:center; color:#9ca3af; padding:28px 0; }
.invoices-main .pager{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:12px 16px;
  border-top:1px solid var(--border);
  background:var(--surface, var(--panel, #fff));
}
.invoices-main .pager-summary{ color:#6b7280; font-size:13px; }
.invoices-main .pager-nav{ display:flex; align-items:center; gap:12px; margin-left:auto; }
.invoices-main .pager-list{ display:flex; align-items:center; gap:6px; list-style:none; margin:0; padding:0; }
.invoices-main .pager-link{ display:inline-flex; align-items:center; justify-content:center; min-width:32px; height:32px; padding:0 12px; border-radius:999px; border:1px solid var(--border); font-size:13px; color:var(--text); text-decoration:none; transition:all .15s ease; }
.invoices-main .pager-link:hover{ border-color:var(--accent); color:var(--accent); }
.invoices-main .pager-link.is-active{ background:var(--black); color:#fff; border-color:var(--black); cursor:default; }
.invoices-main .pager-link.is-disabled{ pointer-events:none; opacity:.4; }
.invoices-main .pager-ellipsis{ color:#9ca3af; font-size:14px; padding:0 4px; }
.invoices-header{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:8px 0 8px;
}
.invoices-header__title{ margin:0; font-size:26px; font-weight:600; text-align:left; }
.invoices-header__subtitle{ margin:0; color:var(--muted); }
.invoices-header__top{
  display:flex;
  align-items:center;
  gap:16px;
}
.invoices-header__actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:10px;
}
.invoices-breadcrumb{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); }
.invoices-breadcrumb a{ color:inherit; text-decoration:none; font-weight:500; }
.invoices-breadcrumb a:hover{ color:var(--text); }
.invoices-breadcrumb__divider{ color:var(--border); }
.invoices-breadcrumb__current{ font-weight:600; color:var(--text); }
.invoices-toolbar{
  margin-bottom:0;
  padding:16px;
  overflow:visible;
}
.invoices-toolbar__form{
  width:100%;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.invoices-toolbar__search{
  flex:1 1 280px;
  min-width:220px;
}
.invoices-toolbar__state{ display:none; }
.invoices-toolbar__filters{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.invoices-toolbar .pill-dropdown{ position:relative; display:inline-block; }
.invoices-toolbar .pill-dropdown > summary{ list-style:none; cursor:pointer; }
.invoices-toolbar .pill-dropdown > summary::-webkit-details-marker{ display:none; }
.invoices-toolbar .pill-dropdown-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fff;
  padding:8px 14px;
  font-size:13px;
  color:var(--text);
}
.invoices-toolbar .pill-dropdown[open] > summary .pill-dropdown-label{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--btn-blue-ghost);
}
.invoices-toolbar .pill-dropdown-title{ color:var(--muted); font-weight:500; }
.invoices-toolbar .pill-dropdown-value{ font-weight:600; }
.invoices-toolbar .pill-dropdown-caret{ font-size:10px; line-height:1; color:var(--muted); }
.invoices-toolbar .pill-dropdown-menu{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  min-width:200px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  padding:8px 0;
  z-index:50;
}
.invoices-toolbar .pill-dropdown-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.invoices-toolbar .pill-dropdown-item{
  width:100%;
  text-align:left;
  background:none;
  border:0;
  padding:8px 16px;
  font-size:13px;
  color:var(--text);
  cursor:pointer;
  border-radius:8px;
}
.invoices-toolbar .pill-dropdown-item:hover{ background:var(--panel-alt); }
.invoices-toolbar .pill-dropdown-item.is-active{
  background:var(--btn-blue-ghost);
  color:var(--btn-blue);
  font-weight:600;
}
.invoices-analytics{ margin-top:0; }
.invoices-table{ margin-top:0; padding:20px; display:flex; flex-direction:column; gap:18px; }
.invoices-table-wrap{ display:flex; flex-direction:column; gap:12px; }
.invoices-table-container{ border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--white); }
.invoices-table__table{ width:100%; border-collapse:collapse; font-size:14px; }
.invoices-table__table thead th{ text-align:left; padding:14px 16px; color:var(--muted); font-weight:500; background:#f9fafb; }
.invoices-table__table thead a{
  color:inherit;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.invoices-table__table thead a:hover{ color:var(--text); }
.invoices-table__table tbody td{ padding:16px; border-top:1px solid var(--line); vertical-align:middle; }
.invoices-table__table tbody tr{ transition:background .15s ease; }
.invoices-table__table tbody tr:hover{ background:#f8fafc; }
.invoices-table__checkbox{ width:36px; text-align:center; }
.invoices-table__table .invoices-amount{ font-weight:600; display:block; color:var(--text); }
.invoices-table__table .invoices-amount__hint{ color:var(--muted); margin-top:2px; }
.invoices-table__table .invoices-amount--missing{ color:var(--muted); }
.invoices-table__table .invoices-amount__resolve{ margin-top:4px; }
.invoices-summary{ margin-top:0; padding:16px 20px; }
.invoices-summary p{ margin:0; font-weight:500; font-size:14px; text-align:center; }
.invoice-create{padding:0rem; display:flex; flex-direction:column; gap:1.5rem;}
.invoice-create__topbar{display:flex; justify-content:space-between; align-items:center; gap:1rem;}
.invoice-create__breadcrumbs{display:flex; align-items:center; gap:.5rem; font-size:14px; color:var(--muted);}
.invoice-create__back{color:var(--btn-blue); text-decoration:none; font-weight:600;}
.invoice-create__chevron{color:var(--muted); font-size:12px;}
.invoice-create__current{color:var(--text); font-weight:600;}
.invoice-create__actions{display:flex; gap:.75rem;}
.invoice-create__actions .btn{ padding:.5rem 1.25rem; font-size:14px;}
.invoice-create__layout{display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:1.5rem; align-items:start;}
.invoice-create__main{display:flex; flex-direction:column; gap:1rem;}
.invoice-create__sidebar{display:flex; flex-direction:column; gap:1rem;}
.invoice-card{background:var(--white); border:1px solid var(--border); border-radius:16px; box-shadow:0 1px 2px rgba(15,23,42,0.04);}
.invoice-card__header{display:flex; justify-content:space-between; align-items:center; padding:1.25rem 1.5rem 0;}
.invoice-card__hint{margin-left:auto; font-size:13px; color:var(--muted);}
.invoice-card__header h2{font-size:16px; font-weight:600; margin:0;}
.invoice-card__body{padding:1rem 1.5rem 1.5rem; display:flex; flex-direction:column; gap:1rem;}
.invoice-card .link{background:none; border:0; color:var(--btn-blue); font-weight:500; cursor:pointer; padding:0;}
.invoice-card .link:hover{text-decoration:underline;}
.invoice-card__attachments{display:grid; grid-template-columns:minmax(0,1fr); gap:1rem 1.25rem;}
.invoice-card__attachment{display:flex; flex-direction:column; gap:.5rem;}
.invoice-line-items{gap:1.25rem;}
.invoice-line-items__table{border:1px solid var(--border); border-radius:12px; overflow:hidden;}
.invoice-line-items__header{display:grid; grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,1fr)) auto; background:var(--panel-alt); padding:.75rem 1rem; font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.05em;}
.invoice-line-items__row{display:grid; grid-template-columns: minmax(0,2fr) repeat(4, minmax(0,1fr)) auto; gap:.5rem; padding:1rem; font-size:14px; align-items:center; background:var(--white);}
.invoice-line-items__row + .invoice-line-items__row{border-top:1px solid var(--border);}
.invoice-line-items__name{font-weight:600; color:var(--text); display:block;}
.invoice-line-items__note{color:var(--muted); font-size:12px; margin-top:2px;}
.invoice-line-items__row--editor{gap:1rem;}
.invoice-line-items__item{position:relative; display:flex; flex-direction:column; gap:.25rem;}
.invoice-line-items__input-group{display:flex; align-items:center;}
.invoice-line-items__input{width:100%; border:1px solid var(--border); border-radius:12px; padding:.65rem .85rem; font-size:14px; background:var(--panel);}
.invoice-line-items__input:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-line-items__discount{display:flex; align-items:center;}
.invoice-line-items__discount-trigger{width:100%; border:1px solid var(--border); border-radius:12px; padding:.65rem .85rem; font-size:14px; font-weight:600; background:var(--panel); color:var(--text); display:flex; align-items:center; justify-content:center; gap:.5rem; cursor:pointer; transition:background-color .2s ease, border-color .2s ease, box-shadow .2s ease;}
.invoice-line-items__discount-trigger:hover{background:var(--panel-alt);}
.invoice-line-items__discount-trigger:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-line-items__discount-trigger span{pointer-events:none;}
.invoice-line-items__note--discount{color:var(--muted); font-size:12px;}
.invoice-line-items__total{text-align:right; font-weight:600; display:flex; flex-direction:column; gap:.25rem; align-items:flex-end;}
.invoice-line-items__actions{display:flex; justify-content:flex-end;}
.invoice-line-items__remove{border:0; background:none; color:var(--muted); padding:.25rem; border-radius:8px; cursor:pointer;}
.invoice-line-items__remove:hover{color:var(--red); background:var(--panel-alt);}
.invoice-line-items__add{display:inline-flex; align-items:center; gap:.5rem; border:1px dashed var(--border); color:var(--btn-blue); background:var(--white); border-radius:12px; padding:.75rem 1rem; font-weight:600; cursor:pointer;}
.invoice-line-items__add:hover{background:var(--panel-alt);}
.invoice-dropdown{position:relative; width:100%;}
.invoice-dropdown .selector{width:100%; gap:.75rem; text-align:left;}
.invoice-dropdown .dropdown__menu{left:0; right:0; min-width:100%;}
.invoice-line-items__body{display:flex; flex-direction:column;}
.invoice-dropdown__menu{max-height:320px; overflow:auto;}
.invoice-dropdown__search{padding:12px 16px; border-bottom:1px solid var(--line);}
.invoice-dropdown__search input{width:100%; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.invoice-dropdown__search input:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-dropdown__section{display:flex; flex-direction:column; gap:4px; padding:8px 0;}
.invoice-dropdown__section + .invoice-dropdown__section{border-top:1px solid var(--line);}
.invoice-dropdown__empty{padding:12px 16px; font-size:13px; color:var(--muted); margin:0;}
.invoice-dropdown__item-note{display:block; font-size:12px; color:var(--muted); margin-top:2px;}
.invoice-dropdown__create{font-weight:600;}
.invoice-attachments__body{display:flex; flex-direction:column; gap:.75rem;}
.invoice-attachments__dropzone{display:flex; align-items:flex-start; gap:.75rem; padding:1rem 1.25rem; border:1px dashed var(--border); border-radius:12px; background:var(--panel);}
.invoice-attachments__icon{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:var(--white); color:var(--btn-blue); font-size:16px; flex-shrink:0;}
.invoice-attachments__content{display:flex; flex-direction:column; gap:.5rem;}
.invoice-attachments__button{min-width:0;}
.invoice-attachments__hint{font-size:12px; color:var(--muted); margin:0;}
.invoice-attachments__list{list-style:none; display:flex; flex-direction:column; gap:.5rem; margin:0; padding:0;}
.invoice-attachments__item{display:flex; align-items:center; gap:.5rem; font-size:13px; color:var(--muted);}
.invoice-attachments__item i{color:var(--btn-blue);}
.invoice-service-date{display:flex; align-items:center; gap:.75rem;}
.invoice-service-date input[type="date"]{flex:1; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.invoice-service-date input[type="date"]:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-summary__row--action .link{display:inline-flex; align-items:center; gap:.5rem; font-weight:600;}
.invoice-summary__row--action .link i{font-size:16px;}
.invoice-summary__empty{font-size:13px; color:var(--muted); margin:4px 0 0;}
.invoice-communication__date{width:100%; border:1px solid var(--border); border-radius:12px; padding:.6rem .75rem; font-size:14px; background:var(--panel);}
.invoice-communication__date:focus{outline:none; border-color:var(--focus); box-shadow:0 0 0 3px rgba(37,99,235,0.12);}
.invoice-communication__send-options{display:flex; gap:.75rem; margin-bottom:.5rem; flex-wrap:wrap;}
.invoice-communication__send-option{display:flex; align-items:center; gap:.4rem;}
.invoice-communication__send-schedule{display:flex; flex-direction:column; gap:.5rem;}
.invoice-communication__schedule-inputs{display:flex; gap:.5rem;}
.invoice-communication__schedule-inputs .invoice-communication__date{flex:1 1 0;}
.invoice-activity-log{margin:0;}
.invoice-activity-log__card{border:1px solid var(--border);border-radius:12px;padding:1rem;background:var(--panel);display:flex;flex-direction:column;gap:.65rem;}
.invoice-activity-log__card--scrollable{max-height:22rem;overflow:auto;scrollbar-width:thin;scrollbar-gutter:stable;}
.invoice-activity-log__card--scrollable:focus{outline:none;box-shadow:0 0 0 3px rgba(37,99,235,.18);border-color:var(--focus);}
.invoice-activity-log__card--scrollable::-webkit-scrollbar{width:8px;height:8px;}
.invoice-activity-log__card--scrollable::-webkit-scrollbar-track{background:transparent;}
.invoice-activity-log__card--scrollable::-webkit-scrollbar-thumb{background-color:rgba(148,163,184,.5);border-radius:999px;}
.invoice-activity-log__card--empty{border-style:dashed;color:var(--muted);background:transparent;text-align:center;}
.invoice-activity-log__entry{display:flex;flex-direction:column;gap:.2rem;font-size:14px;color:var(--text);}
.invoice-activity-log__entry+.invoice-activity-log__entry{padding-top:.65rem;border-top:1px solid var(--border);}
.invoice-activity-log__line{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;}
.invoice-activity-log__title{font-weight:600;color:var(--text);}
.invoice-activity-log__meta{display:flex;align-items:center;gap:.35rem;font-size:12px;color:var(--muted);}
.invoice-activity-log__actor{font-weight:600;color:var(--text);}
.invoice-activity-log__extra a{font-size:12px;color:var(--primary);text-decoration:none;}
.invoice-activity-log__extra a:hover{text-decoration:underline;}
.invoice-actions{position:relative;display:inline-flex;}
.invoice-actions__toggle{background:var(--panel);border:1px solid var(--border);border-radius:999px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;font-size:18px;line-height:1;cursor:pointer;color:var(--text);}
.invoice-actions__toggle:hover{border-color:var(--focus);}
.invoice-actions__menu{position:absolute;top:calc(100% + 4px);right:0;background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 24px rgba(15,23,42,0.12);padding:.25rem 0;min-width:200px;z-index:20;list-style:none;margin:0;}
.invoice-actions__menu.is-floating{position:fixed;right:auto;}
.invoice-actions__menu[hidden]{display:none;}
.invoice-actions__item{display:block;width:100%;text-align:left;background:none;border:0;padding:.5rem 1rem;font-size:14px;color:var(--text);cursor:pointer;}
.invoice-actions__item:hover:not([disabled]){background:var(--surface);}
.invoice-actions__item[disabled]{opacity:.55;cursor:not-allowed;}
.invoice-actions__item[aria-disabled="true"]{opacity:.55;cursor:not-allowed;}
.invoice-tax-list{display:flex; flex-direction:column; gap:8px; margin:0; padding:0; border:0;}
.invoice-tax-list__title{font-size:14px; font-weight:600; margin:0 0 4px;}
.invoice-tax-list__option{display:flex; align-items:center; gap:12px; padding:8px 0; font-size:14px; border-bottom:1px solid var(--line);}
.invoice-tax-list__option:last-of-type{border-bottom:0;}
.invoice-tax-list__option input{width:16px; height:16px;}
.invoice-tax-list__option span{display:flex; flex-direction:column; gap:2px;}
.invoice-tax-list__option small{font-size:12px; color:var(--muted);}
.invoice-summary__body{gap:1rem;}
.invoice-summary__list{margin:0; padding:0; display:flex; flex-direction:column; gap:.65rem;}
.invoice-summary__list--muted .invoice-summary__row{color:var(--muted);}
.invoice-summary__list--muted .invoice-summary__row dd{color:var(--muted);}
.invoice-summary__row{display:flex; justify-content:space-between; font-size:14px; color:var(--text);}
.invoice-summary__row--muted{color:var(--muted);}
.invoice-summary__row--muted dd{color:var(--muted);}
.invoice-summary__row dt{font-weight:500;}
.invoice-summary__row dd{margin:0; font-weight:600;}
.invoice-summary__total{display:flex; justify-content:space-between; align-items:center; font-size:18px; font-weight:600;}
.invoice-summary .btn.full{width:100%; border-radius:12px;}
.invoice-save-draft__intro{font-size:14px; color:var(--muted); margin:0;}
.invoice-save-draft__success{display:flex; flex-direction:column; gap:1rem;}
.invoice-save-draft__title{margin:0; font-size:18px; font-weight:600;}
.invoice-save-draft__note{margin:0; font-size:14px; color:var(--muted);}
.invoice-preview{display:flex; flex-direction:column; gap:1.25rem;}
.invoice-preview__details{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem 1.25rem;}
.invoice-preview__field{display:flex; flex-direction:column; gap:.35rem; font-size:14px;}
.invoice-preview__field--wide{grid-column:1 / -1;}
.invoice-preview__label{font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);}
.invoice-preview__value{color:var(--text);}
.invoice-preview__message{white-space:pre-wrap;}
.invoice-preview__recipient-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.35rem;}
.invoice-preview__summary{display:flex; flex-direction:column; gap:1rem;}
.invoice-preview__document .invoice-summary__empty{margin-top:1rem;}
.invoice-communication__share{display:flex; flex-direction:column; gap:.75rem; padding:0; margin:0; border:0;}
.invoice-communication__share legend{font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:.5rem;}
.invoice-preview-modal{ flex:1; display:flex; justify-content:center; padding:32px 0 48px; }
.invoice-preview-modal .invoice.A4{ width:min(100%,960px); background:var(--surface); }
.invoice-preview__adjustments{ margin-top:12px; display:flex; flex-direction:column; gap:8px; }
.invoice-preview__recipient-list{ margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px; list-style:disc; }
.invoice-message{ margin:32px 0 24px; }
.invoice-message h2{ margin:0 0 12px; font-size:18px; font-weight:700; }
.invoice-message p{ margin:0; font-size:14px; line-height:1.6; white-space:pre-wrap; }
  .invoice-preview-modal{ padding:20px 0 32px; }

.badge.linkedin {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #000;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  text-decoration: none;
}

.badge.linkedin:hover {
  opacity: 0.85;
}