/* Invoice Centre workspace. Everything is namespaced .ic- and reads the Hub's
   own tokens, so light and dark follow the rest of the app. */

.ic-page, .ic-cv {
  --ic-ink: var(--ink, #282F37);
  --ic-soft: var(--ink-soft, #525C68);
  --ic-mute: var(--ink-mute, #8590A0);
  --ic-line: var(--line, #E7E0CF);
  --ic-surface: var(--surface, #FFFFFF);
  --ic-ground: var(--cream, #FAF7F0);
  --ic-tint: var(--surface-2, #FAF7F0);
  --ic-navy: #262E38;
  --ic-aqua: #4ECDC5;
  --ic-aqua-ink: #17807A;
  --ic-aqua-soft: #E6F8F6;
  --ic-coral: #C23B3B;
  --ic-paid-bg: #E0F4EA;  --ic-paid-fg: #17694A;
  --ic-await-bg: #FFF0D2; --ic-await-fg: #8A5A00;
  --ic-void-bg: #ECE9E1;  --ic-void-fg: #5B6270;
  --ic-shadow: 0 1px 2px rgba(38, 46, 56, .05), 0 10px 28px -14px rgba(38, 46, 56, .18);
  --ic-pop: 0 2px 6px rgba(38, 46, 56, .06), 0 24px 48px -16px rgba(38, 46, 56, .28);
  --ic-display: 'Outfit', 'Inter', system-ui, sans-serif;
  color: var(--ic-ink);
  font-size: 14px;
  line-height: 1.45;
}
[data-theme="dark"] .ic-page, [data-theme="dark"] .ic-cv {
  --ic-tint: #252C34;
  --ic-aqua-ink: #6FDCD5;
  --ic-aqua-soft: rgba(78, 205, 197, .14);
  --ic-coral: #FF8A8A;
  --ic-paid-bg: rgba(64, 190, 135, .16);  --ic-paid-fg: #7FE0B4;
  --ic-await-bg: rgba(240, 180, 60, .16); --ic-await-fg: #F2C879;
  --ic-void-bg: rgba(255, 255, 255, .08); --ic-void-fg: #A7A090;
  --ic-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 10px 28px -14px rgba(0, 0, 0, .6);
  --ic-pop: 0 24px 48px -16px rgba(0, 0, 0, .8);
}
.ic-page [hidden], .ic-cv [hidden] { display: none !important; }
.ic-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ic-page svg, .ic-cv svg { width: 18px; height: 18px; flex: none; }

/* ── Page frame ─────────────────────────────────────────────────────────── */
.ic-page { padding: 20px 16px 8px; }
.ic-hero { display: grid; gap: 14px; margin: 0 auto 18px; transition: max-width .2s ease; }
.ic-hero-title { font-family: var(--ic-display); font-size: 30px; font-weight: 600; letter-spacing: -.02em; line-height: 1.1; margin: 0; text-wrap: balance; }
.ic-hero-sub { color: var(--ic-soft); margin: 6px 0 0; font-size: 15px; }
.ic-ws[data-view="home"] .ic-hero { max-width: 760px; padding-top: 28px; }
.ic-ws[data-view="home"] .ic-body { max-width: 760px; margin: 0 auto; }
.ic-ws:not([data-view="home"]) .ic-hero-text { display: none; }
.ic-msg { max-width: 520px; margin: 56px auto; text-align: center; color: var(--ic-soft); }
.ic-msg h1 { font-family: var(--ic-display); font-size: 22px; font-weight: 600; color: var(--ic-ink); margin: 0 0 6px; }

/* ── Search ─────────────────────────────────────────────────────────────── */
.ic-search { position: relative; scroll-margin-top: calc(var(--app-header-h, 64px) + 16px); }
.ic-search-box { display: flex; align-items: center; gap: 10px; height: 56px; padding: 0 14px 0 18px; background: var(--ic-surface); border: 1px solid var(--ic-line); border-radius: 16px; box-shadow: var(--ic-shadow); transition: border-color .15s, box-shadow .15s; }
.ic-search-box:focus-within { border-color: var(--ic-aqua); box-shadow: 0 0 0 4px var(--ic-aqua-soft), var(--ic-shadow); }
.ic-search-box > svg { color: var(--ic-mute); width: 20px; height: 20px; }
.ic-search-input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; color: var(--ic-ink); font: inherit; font-size: 17px; }
.ic-search-input::placeholder { color: var(--ic-mute); }
.ic-search-input::-webkit-search-cancel-button { display: none; }
.ic-kbd { font: 600 11px/1 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--ic-mute); border: 1px solid var(--ic-line); border-radius: 6px; padding: 4px 7px; }
.ic-ws:not([data-view="home"]) .ic-search-box { height: 46px; border-radius: 13px; box-shadow: none; }
.ic-ws:not([data-view="home"]) .ic-search-input { font-size: 15px; }
.ic-x { display: inline-grid; place-items: center; width: 30px; height: 30px; border: 0; border-radius: 8px; background: transparent; color: inherit; opacity: .65; cursor: pointer; }
.ic-x:hover { opacity: 1; background: rgba(127, 127, 127, .16); }
.ic-x svg { width: 14px; height: 14px; }

.ic-results { margin-top: 10px; background: var(--ic-surface); border: 1px solid var(--ic-line); border-radius: 16px; box-shadow: var(--ic-shadow); padding: 6px; }
.ic-ws:not([data-view="home"]) .ic-results { position: absolute; left: 0; right: 0; top: 100%; z-index: 45; margin-top: 6px; max-height: min(70vh, 620px); overflow-y: auto; box-shadow: var(--ic-pop); }
.ic-res-h { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px 4px; font-size: 11px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--ic-mute); }
.ic-res-h span { letter-spacing: 0; text-transform: none; font-weight: 500; }
.ic-res-note { padding: 6px 12px 10px; color: var(--ic-soft); font-size: 13px; }
.ic-opt { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 7px 12px; border-radius: 11px; color: inherit; text-decoration: none; cursor: pointer; }
.ic-opt.is-active, .ic-opt:hover { background: var(--ic-aqua-soft); }
.ic-opt.is-active { box-shadow: inset 3px 0 0 var(--ic-aqua-ink); }
.ic-opt.is-off { cursor: default; opacity: .7; }
.ic-opt.is-off:hover { background: transparent; }
.ic-opt-ico { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: var(--ic-tint); color: var(--ic-soft); flex: none; }
.ic-opt-ico svg { width: 16px; height: 16px; }
.ic-opt-text { flex: 1; min-width: 0; }
.ic-opt-main { font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ic-opt-sub { color: var(--ic-soft); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ic-opt-go { color: var(--ic-mute); font-size: 12px; white-space: nowrap; opacity: 0; }
.ic-opt.is-active .ic-opt-go { opacity: 1; }
mark.ic-hit { background: transparent; color: var(--ic-aqua-ink); font-weight: 700; }
.ic-tag { display: inline-block; vertical-align: 1px; margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 600; background: var(--ic-tint); color: var(--ic-soft); border: 1px solid var(--ic-line); white-space: nowrap; }
.ic-tag--warn { background: var(--ic-await-bg); color: var(--ic-await-fg); border-color: transparent; }
.ic-tag--aqua { background: var(--ic-aqua-soft); color: var(--ic-aqua-ink); border-color: transparent; }

/* ── Home and group directory ───────────────────────────────────────────── */
.ic-sec-h { font-size: 11px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--ic-mute); margin: 26px 2px 8px; }
.ic-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.ic-card { display: block; padding: 13px 15px; background: var(--ic-surface); border: 1px solid var(--ic-line); border-radius: 14px; color: inherit; text-decoration: none; transition: border-color .15s, transform .15s, box-shadow .15s; }
.ic-card:hover { border-color: var(--ic-aqua); box-shadow: var(--ic-shadow); transform: translateY(-1px); }
.ic-card-t { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ic-card-s { color: var(--ic-soft); font-size: 12.5px; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ic-tips { color: var(--ic-mute); font-size: 13px; margin: 14px 2px 0; }

.ic-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 13px; color: var(--ic-mute); margin-bottom: 8px; }
.ic-crumbs a { color: var(--ic-soft); text-decoration: none; }
.ic-crumbs a:hover { color: var(--ic-aqua-ink); text-decoration: underline; }
.ic-headrow { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.ic-title { font-family: var(--ic-display); font-size: 26px; font-weight: 600; letter-spacing: -.015em; line-height: 1.15; margin: 0; text-wrap: balance; }
.ic-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; color: var(--ic-soft); font-size: 13px; margin-top: 6px; }
.ic-meta .ic-tag { margin-left: 0; }
.ic-note { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; margin-bottom: 12px; border-radius: 12px; background: var(--ic-aqua-soft); color: var(--ic-ink); font-size: 13px; }
.ic-note svg { color: var(--ic-aqua-ink); margin-top: 1px; }
.ic-note--warn { background: var(--ic-await-bg); color: var(--ic-await-fg); }
.ic-note--warn svg { color: inherit; }
.ic-dir { background: var(--ic-surface); border: 1px solid var(--ic-line); border-radius: 16px; padding: 6px; }
.ic-dir .ic-opt-go { opacity: 0; }
.ic-dir .ic-opt:hover .ic-opt-go { opacity: 1; }

/* ── Controls ───────────────────────────────────────────────────────────── */
.ic-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 38px; padding: 0 14px; border-radius: 10px; border: 1px solid var(--ic-line); background: var(--ic-surface); color: var(--ic-ink); font: inherit; font-weight: 600; font-size: 13.5px; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background .12s, border-color .12s, transform .08s; }
.ic-btn:hover { border-color: var(--ic-aqua); background: var(--ic-aqua-soft); }
.ic-btn:active { transform: translateY(1px); }
.ic-btn:disabled { opacity: .45; cursor: not-allowed; }
.ic-btn--sm { height: 32px; padding: 0 11px; font-size: 13px; border-radius: 9px; }
.ic-btn--sm svg { width: 15px; height: 15px; }
.ic-btn--ghost { background: transparent; color: var(--ic-soft); }
.ic-btn--primary { background: var(--ic-aqua); border-color: var(--ic-aqua); color: #10252B; height: 42px; padding: 0 18px; font-size: 14.5px; }
.ic-btn--primary:hover { background: #63D8D1; border-color: #63D8D1; }
.ic-btn--light { background: #fff; border-color: #fff; color: #10252B; }
.ic-btn.is-busy { position: relative; color: transparent !important; pointer-events: none; }
.ic-btn.is-busy::after { content: ''; position: absolute; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--ic-aqua-ink); border-right-color: transparent; animation: ic-spin .7s linear infinite; }
.ic-btn--primary.is-busy::after { border-color: #10252B; border-right-color: transparent; }
@keyframes ic-spin { to { transform: rotate(360deg); } }
.ic-page :focus-visible, .ic-cv :focus-visible { outline: 2px solid var(--ic-aqua-ink); outline-offset: 2px; }
.ic-dock :focus-visible, .ic-jobstrip :focus-visible { outline-color: var(--ic-aqua); }
.ic-search-input:focus-visible { outline: 0; }
.ic-input { height: 36px; padding: 0 10px; border: 1px solid var(--ic-line); border-radius: 9px; background: var(--ic-surface); color: var(--ic-ink); font: inherit; font-size: 13.5px; }

.ic-tools { display: grid; gap: 10px; margin-bottom: 12px; }
.ic-toolrow { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ic-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ic-chip { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--ic-line); background: var(--ic-surface); color: var(--ic-soft); font: inherit; font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer; transition: background .12s, border-color .12s, color .12s; }
.ic-chip:hover { border-color: var(--ic-aqua); color: var(--ic-ink); }
.ic-chip[aria-pressed="true"] { background: var(--ic-navy); border-color: var(--ic-navy); color: #fff; }
[data-theme="dark"] .ic-chip[aria-pressed="true"] { background: var(--ic-aqua); border-color: var(--ic-aqua); color: #10252B; }
.ic-chip-n { font-variant-numeric: tabular-nums; font-size: 12px; }
.ic-custom { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 13px; color: var(--ic-soft); }
.ic-custom label { display: inline-flex; align-items: center; gap: 6px; }
.ic-filter { position: relative; margin-left: auto; flex: 0 1 300px; min-width: 200px; }
.ic-filter svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; color: var(--ic-mute); pointer-events: none; }
.ic-filter .ic-input { width: 100%; padding-left: 32px; }
.ic-sortwrap { display: none; align-items: center; gap: 6px; font-size: 13px; color: var(--ic-soft); }

/* ── Invoice table ──────────────────────────────────────────────────────── */
.ic-sheet { background: var(--ic-surface); border: 1px solid var(--ic-line); border-radius: 16px; box-shadow: var(--ic-shadow); }
.ic-table { width: 100%; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.ic-table th { text-align: left; font-size: 11.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--ic-mute); padding: 0 12px; height: 42px; background: var(--ic-surface); border-bottom: 1px solid var(--ic-line); white-space: nowrap; }
.ic-table th:first-child { border-top-left-radius: 16px; }
.ic-table th:last-child { border-top-right-radius: 16px; }
.ic-cv--ws .ic-table thead th { position: sticky; top: var(--app-header-h, 0px); z-index: 5; }
.ic-th { display: inline-flex; align-items: center; gap: 5px; border: 0; background: transparent; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; padding: 6px 0; cursor: pointer; }
.ic-th:hover { color: var(--ic-ink); }
.ic-caret { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; opacity: 0; }
th[aria-sort="descending"] .ic-caret { opacity: 1; }
th[aria-sort="ascending"] .ic-caret { opacity: 1; transform: rotate(180deg); }
th[aria-sort="ascending"] .ic-th, th[aria-sort="descending"] .ic-th { color: var(--ic-ink); }
.ic-table td { padding: 0 12px; height: 46px; border-bottom: 1px solid var(--ic-line); vertical-align: middle; }
.ic-table tbody tr:last-child td { border-bottom: 0; }
.ic-row { cursor: pointer; transition: background .1s; }
.ic-row:hover { background: var(--ic-tint); }
.ic-row.is-sel, .ic-row.is-sel:hover { background: var(--ic-aqua-soft); }
.ic-row.is-void .ic-num, .ic-row.is-void .ic-c-total { color: var(--ic-mute); text-decoration: line-through; }
.ic-row.is-flash { animation: ic-flash 1.6s ease-out 1; }
@keyframes ic-flash { 0%, 35% { box-shadow: inset 3px 0 0 var(--ic-aqua), inset 0 0 0 999px rgba(78, 205, 197, .22); } 100% { box-shadow: inset 0 0 0 transparent; } }
.ic-c-sel { width: 44px; padding-right: 0 !important; }
.ic-c-sel input, .ic-table th input { width: 17px; height: 17px; accent-color: var(--ic-aqua-ink); cursor: pointer; vertical-align: middle; }
.ic-num { font-weight: 650; }
.ic-hub { margin-left: 7px; font-size: 10.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ic-mute); border: 1px solid var(--ic-line); border-radius: 5px; padding: 1px 5px; }
.ic-c-date, .ic-c-ref { color: var(--ic-soft); }
.ic-c-ref { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ic-r { text-align: right !important; }
.ic-c-total { font-weight: 600; }
.ic-cr { color: var(--ic-mute); font-size: 12px; }
.ic-c-act { text-align: right; white-space: nowrap; width: 1%; }
.ic-c-act .ic-btn + .ic-btn { margin-left: 6px; }
.ic-pill { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.ic-pill::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ic-pill--paid { background: var(--ic-paid-bg); color: var(--ic-paid-fg); }
.ic-pill--awaiting { background: var(--ic-await-bg); color: var(--ic-await-fg); }
.ic-pill--voided { background: var(--ic-void-bg); color: var(--ic-void-fg); }
.ic-morewrap { padding: 12px; text-align: center; border-top: 1px solid var(--ic-line); }
.ic-empty { padding: 44px 20px; text-align: center; color: var(--ic-soft); }
.ic-empty p { margin: 0 0 12px; }
.ic-empty--err p { color: var(--ic-coral); font-weight: 500; }
.ic-skel { padding: 6px 16px 14px; }
.ic-skel-t { color: var(--ic-mute); font-size: 13px; padding: 12px 0 6px; }
.ic-skel i { display: block; height: 14px; margin: 16px 0; border-radius: 7px; background: linear-gradient(90deg, var(--ic-tint) 25%, var(--ic-line) 37%, var(--ic-tint) 63%); background-size: 400% 100%; animation: ic-shim 1.3s ease infinite; }
.ic-skel i:nth-child(odd) { width: 86%; } .ic-skel i:nth-child(3n) { width: 64%; }
@keyframes ic-shim { from { background-position: 100% 0; } to { background-position: 0 0; } }

/* ── Link panel (unlinked customer) ─────────────────────────────────────── */
.ic-link { background: var(--ic-surface); border: 1px solid var(--ic-line); border-radius: 16px; padding: 18px; box-shadow: var(--ic-shadow); }
.ic-link h2 { font-family: var(--ic-display); font-size: 17px; font-weight: 600; margin: 0 0 4px; }
.ic-link p { color: var(--ic-soft); margin: 0 0 12px; font-size: 13px; }
.ic-link-row { display: flex; gap: 8px; }
.ic-link-row .ic-input { flex: 1; min-width: 0; height: 38px; }
.ic-link-res { margin-top: 10px; }
.ic-link-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 2px; border-top: 1px solid var(--ic-line); }
.ic-link-item small { display: block; color: var(--ic-mute); font-size: 12.5px; }

/* ── Download dock ──────────────────────────────────────────────────────── */
.ic-dock { position: sticky; bottom: 16px; z-index: 30; margin: 14px 0 4px; padding: 10px 10px 10px 18px; border-radius: 16px; background: var(--ic-navy); color: #fff; box-shadow: var(--ic-pop); }
[data-theme="dark"] .ic-dock { border: 1px solid rgba(255, 255, 255, .12); }
.ic-dock-row { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; }
.ic-dock-count strong { display: block; font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ic-dock-sub { display: block; font-size: 12.5px; color: rgba(255, 255, 255, .62); }
.ic-dock-actions { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.ic-dockbtn { height: 36px; padding: 0 12px; border: 0; border-radius: 9px; background: transparent; color: rgba(255, 255, 255, .86); font: inherit; font-size: 13.5px; font-weight: 500; cursor: pointer; }
.ic-dockbtn:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.ic-dock .ic-btn--primary { margin-left: 6px; }
.ic-dock .ic-btn--primary:disabled { background: rgba(255, 255, 255, .14); border-color: transparent; color: rgba(255, 255, 255, .55); opacity: 1; }
.ic-export { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 13.5px; }
.ic-export-t { flex: 1 1 220px; }
.ic-export-t--bad { color: #FFB4B4; }
.ic-progress { flex: 1 1 100%; order: 5; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .16); overflow: hidden; }
.ic-progress-bar { display: block; height: 100%; border-radius: 3px; background: var(--ic-aqua); transition: width .4s ease; }
.ic-export-errs { flex: 1 1 100%; order: 6; font-size: 12.5px; color: rgba(255, 255, 255, .8); }
.ic-export-errs ul { margin: 4px 0 0; padding-left: 18px; max-height: 120px; overflow-y: auto; }
.ic-jobstrip { margin: 0 auto 14px; padding: 2px 10px 10px 18px; border-radius: 14px; background: var(--ic-navy); color: #fff; }
.ic-ws[data-view="home"] .ic-jobstrip { max-width: 760px; }
.ic-jobstrip .ic-export { margin-top: 0; border-top: 0; }

/* The sidebar entry stays out of sight until the server says the centre is open. */
.desktop-sidebar a[hidden] { display: none !important; }

/* ── Phones ─────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
  .ic-page { padding: 14px 12px 4px; }
  .ic-hero-title { font-size: 25px; }
  .ic-ws[data-view="home"] .ic-hero { padding-top: 8px; }
  .ic-kbd, .ic-opt-go { display: none; }
  .ic-title { font-size: 22px; }
  .ic-chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 -12px; padding: 0 12px 2px; scrollbar-width: none; }
  .ic-chips::-webkit-scrollbar { display: none; }
  .ic-filter { flex: 1 1 100%; margin-left: 0; }
  .ic-sortwrap { display: inline-flex; }
  .ic-table, .ic-table tbody { display: block; }
  .ic-table thead { display: none; }
  .ic-row { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; grid-template-areas: "sel num total" "sel date status" "sel ref act"; gap: 3px 10px; align-items: center; padding: 12px; border-bottom: 1px solid var(--ic-line); }
  .ic-row:last-child { border-bottom: 0; }
  .ic-table td { display: block; height: auto; padding: 0; border: 0; }
  .ic-c-sel { grid-area: sel; width: auto; } .ic-c-num { grid-area: num; } .ic-c-total { grid-area: total; }
  .ic-c-date { grid-area: date; font-size: 13px; } .ic-c-status { grid-area: status; justify-self: end; }
  .ic-c-ref { grid-area: ref; font-size: 13px; max-width: none; } .ic-c-act { grid-area: act; width: auto; padding-top: 4px !important; }
  .ic-c-due { grid-column: 2 / 4; font-size: 13px; text-align: left !important; }
  .ic-c-due::before { content: 'Due '; color: var(--ic-mute); }
  .ic-dock { bottom: calc(var(--safe-bot, 0px) + 88px); padding: 10px 12px; border-radius: 14px; }
  .ic-dock-actions { width: 100%; }
  .ic-dock .ic-btn--primary { flex: 1; margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ic-page *, .ic-page *::before, .ic-page *::after, .ic-cv *, .ic-cv *::before, .ic-cv *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* On this page "/" belongs to the invoice search, so the header pill drops its hint. */
.app-shell:has(.ic-ws) .tb-search-key { display: none; }