/* Shared visual language with the public Denko website. */
:root { --ink:#202326; --muted:#63696d; --line:#dedfda; --sidebar:#171b1d; --cyan:#344f49; --aqua:#344f49; --violet:#344f49; --rose:#923e3e; --shadow:none; --soft-shadow:none; }
body,.workspace { background:#f4f4f1; color:var(--ink); }
.sidebar { background:#171b1d; }
.brand-card,.brand-mark,.sidebar-toggle { background:transparent; box-shadow:none; border-radius:3px; }
.brand-card { border:0; padding-left:0; }
.brand-mark { border:1px solid #646969; color:#fff; }
.brand-name { text-transform:uppercase; letter-spacing:.22em; font-weight:500; }
.brand-subtitle { color:#b9bdbc; font-weight:400; }
.tab,button { border-radius:3px; background:#202326; box-shadow:none; font-weight:500; }
button:hover,.tab:hover { background:#344f49; box-shadow:none; transform:none; }
.tab { background:transparent; }
.tab.active { background:#34403c; box-shadow:none; }
.tab-label { min-width:0; flex:1; text-align:left; }
.tab-count { min-width:28px; margin-left:auto; padding:3px 7px; color:#d9dddb; background:#ffffff14; border-radius:999px; font-size:10px; text-align:center; }
.portal-shell.sidebar-collapsed .tab-count { display:none; }
.sidebar-actions button { background:#343a3c; }
.topbar { background:#fff; color:var(--ink); border-bottom:1px solid var(--line); box-shadow:none; }
.topbar h1 { color:var(--ink); font-weight:500; letter-spacing:-.04em; }
.eyebrow,.panel-kicker { color:var(--muted); font-weight:500; font-size:10px; letter-spacing:.16em; }
[data-user-summary] { color:var(--muted); border:0; background:transparent; font-weight:400; }
[data-user-summary] span { color:var(--ink); }
.topbar button { border:1px solid var(--line); background:#f4f4f1; }
.workspace-heading { padding-top:20px; padding-bottom:12px; }
.workspace-heading h2,.detail-heading h2 { font-size:32px; font-weight:500; letter-spacing:-.045em; }
.panel h2 { font-weight:500; letter-spacing:-.025em; }
.panel,.table-panel,.card,.empty,.detail-grid div { border:1px solid var(--line); border-radius:4px; box-shadow:none; }
.count-pill,.pill { background:#e9ece8; color:#344f49; font-weight:500; }
th { background:#f7f7f4; color:var(--muted); font-weight:500; letter-spacing:.06em; }
.strong-cell { font-weight:600; }
.clickable-row:hover td,.clickable-row:focus td { background:#f0f3ef; }
input,select,textarea { border-color:var(--line); border-radius:3px; background:#fff; }
input:focus,select:focus,textarea:focus { border-color:#344f49; box-shadow:0 0 0 3px #344f491a; }
button:focus-visible,a:focus-visible,select:focus-visible,textarea:focus-visible { outline:2px solid #718c80; outline-offset:3px; }
.danger-button { background:#923e3e; }
.back-link,.ghost-button { background:transparent; color:#344f49; }
.dots-button,.row-menu button { background:transparent; }
.row-menu { border-radius:4px; border:1px solid var(--line); box-shadow:0 6px 18px #20232615; }
.mobile-menu-toggle,.sidebar-backdrop { display:none; }
.customer-import-panel { width:min(1460px,100%); margin:0 auto 18px; padding:0; overflow:hidden; }
.customer-import-panel summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 20px; list-style:none; }
.customer-import-panel summary::-webkit-details-marker { display:none; }
.customer-import-panel summary span { display:flex; align-items:center; gap:10px; }
.customer-import-panel summary svg { width:18px; color:#344f49; }
.customer-import-panel summary strong { font-size:14px; font-weight:600; }
.customer-import-panel summary small { color:var(--muted); font-size:12px; }
.customer-import-panel[open] summary { border-bottom:1px solid var(--line); }
.customer-import-body { padding:20px; }
.customer-import-body>p { margin:0 0 16px; font-size:13px; }
.customer-import-body form { display:grid; grid-template-columns:minmax(260px,1fr) auto; align-items:end; gap:12px; }
.customer-import-body form>p { grid-column:1/-1; margin:0; color:var(--muted); font-size:13px; }
.customer-toolbar { display:grid; width:min(1460px,100%); grid-template-columns:minmax(340px,1.5fr) repeat(3,minmax(150px,.65fr)) auto; align-items:end; gap:14px; margin:0 auto 18px; }
.customer-toolbar>label,.customer-search label { display:grid; min-width:0; gap:8px; color:var(--muted); font-size:11px; }
.customer-toolbar select,.customer-toolbar input { min-height:42px; }
.customer-toolbar>p { margin:0 0 11px; color:var(--muted); font-size:12px; white-space:nowrap; }
.customer-search { display:grid; grid-template-columns:minmax(190px,1fr) auto auto; align-items:end; gap:8px; }
.customer-search button { min-height:42px; }
.customer-notes { margin-bottom:24px; }
.customer-notes form { display:block; }
.customer-notes label { display:grid; gap:8px; }
.customer-notes textarea { width:100%; resize:vertical; line-height:1.6; }
.customer-notes .form-actions { margin-top:16px; align-items:center; }
[data-notes-status] { color:var(--muted); font-size:13px; }
button:disabled { opacity:.55; cursor:wait; }
.customers-table-panel { overflow-x:auto; }
.workspace-heading p,.detail-heading p,label,input,select,textarea { font-weight:400; }
.menu-label { font-weight:500; }
.customers-table-panel table { min-width:920px; border:0; border-radius:0; table-layout:fixed; }
.customer-col-select { width:48px; }
.customer-col-business { width:25%; }
.customer-col-state { width:140px; }
.customer-col-sector { width:19%; }
.customer-col-contact { width:21%; }
.customer-col-website { width:17%; }
.customer-col-actions { width:58px; }
.customer-col-select,.customer-col-business,.customer-col-state,.customer-col-sector,.customer-col-contact,.customer-col-website,.customer-col-actions { display:table-column; }
.customer-table td,.customer-table th { padding:16px 18px; vertical-align:top; }
.customer-table .customer-select-cell { padding-right:0; text-align:center; vertical-align:middle; }
.customer-select-checkbox { width:18px; height:18px; min-height:18px; padding:0; border-radius:3px; accent-color:#344f49; cursor:pointer; }
.customer-row.selected td { background:#edf3ef; }
.customer-table th:last-child,.customer-table td:last-child { text-align:right; }
.customer-name,.customer-contact-cell>span { display:block; overflow-wrap:anywhere; }
.customer-subtext { display:block; margin-top:6px; color:var(--muted); font-family:Inter,Segoe UI,Arial,sans-serif; font-size:11px; font-weight:400; line-height:1.45; overflow-wrap:anywhere; }
.customer-state-cell { vertical-align:middle!important; }
.customer-state-cell .inline-state-select { width:100%; min-width:0; margin:0; }
.customer-table tbody tr:nth-last-child(-n+3) .row-menu { top:auto; bottom:42px; }
.inline-state-select.none { color:#475467; background:#f2f4f7; }
.inline-state-select.emailed { color:#075985; background:#e0f2fe; }
.inline-state-select.called { color:#7c2d12; background:#ffedd5; }
.inline-state-select.follow-up { color:#7f1d1d; background:#fee2e2; }
.inline-state-select.completed { color:#166534; background:#dcfce7; }
.customer-pagination { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 18px; border-top:1px solid var(--line); background:#fff; }
.customer-pagination p { margin:0; color:var(--muted); font-size:12px; }
.customer-pagination p strong { color:var(--ink); font-weight:600; }
.pagination-buttons { display:flex; align-items:center; gap:5px; }
.pagination-button { min-width:36px; min-height:36px; padding:7px 10px; color:var(--ink); background:#f4f4f1; border:1px solid var(--line); }
.pagination-button svg { width:14px; height:14px; }
.pagination-button.active { color:#fff; background:#344f49; border-color:#344f49; }
.pagination-gap { width:24px; color:var(--muted); text-align:center; }
.customer-bulk-bar { display:grid; width:min(1460px,100%); grid-template-columns:minmax(240px,1fr) auto; align-items:center; gap:18px 28px; margin:0 auto 18px; padding:18px 20px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:4px; }
.customer-bulk-summary { display:grid; gap:3px; }
.customer-bulk-summary .panel-kicker { margin:0; }
.customer-bulk-summary strong { font-size:20px; font-weight:600; }
.customer-bulk-summary small { color:var(--muted); font-size:11px; line-height:1.5; }
.customer-bulk-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.customer-bulk-actions button { min-height:40px; }
[data-bulk-email-status] { grid-column:1/-1; min-height:0; margin:0; color:var(--muted); font-size:12px; }
[data-bulk-email-status]:empty { display:none; }
.analytics-heading { align-items:center; }
.analytics-heading label { min-width:170px; }
.analytics-metrics { grid-template-columns:repeat(6,minmax(0,1fr)); margin-bottom:22px; }
.analytics-metrics .card { min-height:150px; }
.analytics-metrics .metric { display:block; margin-top:8px; color:#344f49; font-size:32px; font-weight:500; }
.analytics-trend-panel { width:min(1460px,100%); margin:0 auto 22px; }
.traffic-chart { display:flex; min-height:250px; align-items:flex-end; gap:5px; padding-top:24px; overflow-x:auto; }
.traffic-day { display:grid; min-width:18px; height:210px; flex:1 0 18px; grid-template-rows:20px minmax(80px,1fr) 30px; gap:6px; align-items:end; text-align:center; }
.traffic-day strong { color:var(--muted); font-size:10px; font-weight:500; }
.traffic-day>span { display:block; width:100%; min-height:2px; background:#718c80; border-radius:2px 2px 0 0; }
.traffic-day small { overflow:hidden; color:var(--muted); font-size:9px; white-space:nowrap; }
.analytics-grid { display:grid; width:min(1460px,100%); grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin:0 auto; }
.analytics-grid .panel { min-width:0; }
.analytics-wide { grid-column:1/-1; }
.analytics-table-wrap { overflow-x:auto; }
.analytics-list { display:grid; gap:16px; margin-top:22px; }
.analytics-list-row>div:first-child { display:flex; justify-content:space-between; gap:16px; margin-bottom:6px; color:var(--muted); font-size:13px; }
.analytics-list-row strong { color:var(--ink); font-weight:600; }
.analytics-bar { height:7px; overflow:hidden; background:#e9ece8; border-radius:999px; }
.analytics-bar span { display:block; height:100%; background:#718c80; border-radius:inherit; }
.analytics-empty,.analytics-note { color:var(--muted); font-size:13px; }
.analytics-empty { margin:22px 0 0; }
.analytics-note { margin:20px 0 0; padding-top:16px; border-top:1px solid var(--line); }
.analytics-error { width:min(720px,100%); margin:40px auto; }
.analytics-error button { margin-top:12px; }
@media(max-width:900px) { .analytics-grid { grid-template-columns:1fr; } .analytics-wide { grid-column:auto; } }
@media(max-width:1380px) { .analytics-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:900px) { .analytics-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .analytics-metrics { grid-template-columns:1fr; } }
@media(max-width:1380px) { .customer-toolbar { grid-template-columns:repeat(3,minmax(160px,1fr)); } .customer-search,.customer-toolbar>p { grid-column:1/-1; } .customer-toolbar>p { justify-self:end; } }
@media(max-width:1120px) {
  body.portal-nav-open { overflow:hidden; }
  .portal-shell,.portal-shell.sidebar-collapsed { display:block; }
  .sidebar,.portal-shell.sidebar-collapsed .sidebar { position:fixed; inset:0 auto 0 0; z-index:50; width:min(320px,88vw); min-height:100dvh; padding:20px; overflow-y:auto; transform:translateX(-105%); transition:transform .2s ease; }
  .portal-shell.sidebar-open .sidebar { transform:translateX(0); }
  .sidebar-backdrop { position:fixed; inset:0; z-index:45; width:100%; height:100%; min-height:0; padding:0; background:#11182780; border-radius:0; opacity:0; pointer-events:none; transition:opacity .2s ease; }
  .sidebar-backdrop:hover { background:#11182780; transform:none; }
  .portal-shell.sidebar-open .sidebar-backdrop { display:block; opacity:1; pointer-events:auto; }
  .mobile-menu-toggle { display:inline-flex; min-height:40px; padding:8px 11px; color:var(--ink); background:#f4f4f1; border:1px solid var(--line); }
  .mobile-menu-toggle svg { width:17px; }
  .topbar,.portal-shell.sidebar-collapsed .topbar { position:sticky; top:0; left:auto; z-index:30; min-height:72px; flex-direction:row; align-items:center; padding:12px 20px; }
  .topbar-title { min-width:0; flex:1; }
  .workspace { padding:24px 20px 40px; }
  .customer-toolbar { grid-template-columns:1fr 1fr; }
  .customer-search { grid-column:1/-1; }
  .customer-toolbar>p { grid-column:1/-1; justify-self:end; }
}
@media(max-width:800px) { .customer-bulk-bar { grid-template-columns:1fr; } .customer-bulk-actions { justify-content:flex-start; } [data-bulk-email-status] { grid-column:auto; } }
@media(max-width:1040px) { .customers-table-panel table { min-width:700px; } .customer-col-website { display:none; } }
@media(max-width:720px) { .customer-col-sector { display:none; } }
@media(max-width:640px) {
  .topbar { gap:10px; }
  .mobile-menu-toggle span,[data-user-summary] { display:none; }
  .topbar-actions { gap:6px; }
  .topbar-actions button { min-height:38px; padding:7px 10px; }
  .customer-toolbar { grid-template-columns:1fr; }
  .customer-toolbar>label,.customer-toolbar>p { grid-column:auto; width:100%; justify-self:start; }
  .customer-search { grid-template-columns:1fr auto; }
  .customer-search label { grid-column:1/-1; }
  .customer-search .ghost-button { grid-column:auto; }
  .customer-import-body form { grid-template-columns:1fr; }
  .customer-import-body form>p { grid-column:auto; }
  .customer-pagination { align-items:flex-start; flex-direction:column; }
  .pagination-buttons { width:100%; justify-content:space-between; }
  .pagination-button.page-number,.pagination-gap { display:none; }
  .pagination-button.page-number.active { display:inline-flex; }
  .workspace-heading h2,.detail-heading h2 { font-size:27px; }
  .customers-table-panel table { min-width:560px; }
  .analytics-heading label { width:100%; }
  .traffic-chart { min-height:220px; }
  .traffic-day { height:180px; }
}