:root{
  --bg:#f5f7fb;
  --panel:#fff;
  --panel2:#f8fafc;
  --line:#dbe3ef;
  --text:#111827;
  --muted:#5b6472;
  --green:#2563eb;
  --yellow:#b7791f;
  --red:#a52323;
  --blue:#2563eb;
  --accent:#2563eb;
  --accent-dark:#1d4ed8;
  --accent-soft:#eaf2ff;
  --success-bg:#eaf7ef;
  --success-ink:#17633a;
  --warning-bg:#fff7d6;
  --warning-ink:#7a5400;
  --danger-bg:#feecec;
  --danger-ink:#a52323;
  --shadow:0 18px 38px rgba(15,23,42,.08);
  --radius:8px;
  color-scheme:light;
}

body{
  color:var(--text);
  background:linear-gradient(180deg,#f8fafc 0%,#eef4fb 100%);
}

.login-shell{
  background:
    linear-gradient(135deg,rgba(37,99,235,.08),transparent 42%),
    linear-gradient(180deg,#fbfdff 0%,#eef4fb 100%);
}

.login-card{
  width:min(560px,100%);
  padding:36px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:var(--shadow);
}

.login-brand{display:flex;align-items:center;gap:18px;margin-bottom:18px}
.login-brand img{width:82px;height:82px;object-fit:contain}
.login-card h1{margin:3px 0 0;font-size:36px;color:var(--text)}
.eyebrow{color:var(--accent)}
.muted,.timezone-note{color:var(--muted)}

input,select,textarea{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  color:var(--text);
  padding:10px 12px;
}

input:focus,select:focus,textarea:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(37,99,235,.16);
}

label{color:var(--text)}
.primary{
  border-radius:var(--radius);
  background:var(--accent);
  color:#fff;
  box-shadow:0 10px 18px rgba(37,99,235,.2);
}
.primary:hover{background:var(--accent-dark);filter:none}

.sidebar{
  width:auto;
  padding:24px 16px 16px;
  background:#fff;
  color:var(--text);
  border-right:1px solid var(--line);
  box-shadow:8px 0 28px rgba(15,23,42,.04);
}

.brand{gap:12px;padding:0 8px 24px}
.sidebar-logo{
  width:48px;
  height:48px;
  object-fit:contain;
  background:var(--panel2);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:4px;
}
.brand strong{color:var(--text);font-size:17px}
.brand small,.sidebar-footer small{color:var(--muted)}

.nav-item{
  color:var(--muted);
  border:1px solid transparent;
  border-radius:var(--radius);
}
.nav-item:hover,.nav-item.active{
  color:var(--accent-dark);
  background:var(--accent-soft);
  border-color:#c7d8ff;
}
.nav-item.active span{color:var(--accent)}
.sidebar-footer{border-top-color:var(--line)}
.text-button{color:var(--muted)}
.text-button:hover{color:var(--danger-ink)}

.topbar{
  background:rgba(255,255,255,.92);
  border-bottom:1px solid var(--line);
  box-shadow:0 4px 18px rgba(15,23,42,.035);
}
.topbar h2{color:var(--text)}
.ny-clock span{color:var(--accent);border-color:#c7d8ff;background:var(--accent-soft)}
.ny-clock small{color:var(--muted)}

.queue-panel{background:rgba(255,255,255,.68);border-right-color:var(--line)}
.queue-create-button{grid-column:1/-1;width:100%;padding:10px 14px}
.queue-hubspot-button{grid-column:1/-1;justify-content:center;width:100%}
.hubspot-search-dialog{width:min(760px,calc(100% - 30px))}
.hubspot-search-controls{display:grid;grid-template-columns:1fr auto;gap:10px}
.hubspot-search-results{display:grid;gap:8px;max-height:52vh;overflow:auto}
.hubspot-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}
.hubspot-search-row strong,.hubspot-search-row small{display:block}
.hubspot-search-row small{color:var(--muted);margin-top:4px}
.hubspot-search-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.read-only-notice{border-color:var(--yellow);background:rgba(255,200,87,.08)}
.primary:disabled{opacity:.6;cursor:wait;box-shadow:none}
.queue-heading{color:var(--muted)}
.count-pill{background:var(--accent-soft);color:var(--accent-dark);border:1px solid #c7d8ff}
.contact-row{color:var(--text);border-radius:var(--radius)}
.contact-row:hover,.contact-row.active{
  background:#fff;
  border-color:var(--line);
  box-shadow:0 10px 22px rgba(15,23,42,.055);
}
.contact-row.active{box-shadow:inset 3px 0 var(--accent),0 10px 22px rgba(15,23,42,.055)}
.contact-meta,.row-right small{color:var(--muted)}

.status{background:var(--accent-soft);color:var(--accent-dark);border:1px solid #c7d8ff}
.status.Queued{color:var(--accent-dark)}
.status.In-Progress{background:var(--warning-bg);color:var(--warning-ink);border-color:#f0dda1}
.status.Follow-Up{background:#f3edff;color:#6941a5;border-color:#d9c8f5}
.status.Completed{background:var(--success-bg);color:var(--success-ink);border-color:#bfe3cc}
.status.Do-Not-Call{background:var(--danger-bg);color:var(--danger-ink);border-color:#f4bcbc}
.overdue{color:var(--danger-ink)!important}

.detail-panel{background:linear-gradient(180deg,#f8fafc 0%,#f3f7fb 100%)}
.empty,.empty-detail{color:var(--muted)}
.empty-icon{background:#fff;border-color:var(--line);color:var(--accent)}
.detail-head h2{color:var(--text)}
.detail-head p{color:var(--muted)}

.action-button{
  border:1px solid var(--line);
  border-radius:var(--radius);
  color:var(--text);
  background:#fff;
  box-shadow:0 5px 12px rgba(15,23,42,.04);
}
.action-button:hover{background:var(--accent-soft);border-color:#bdd1ff;color:var(--accent-dark)}
.action-button.call{background:var(--accent);border-color:var(--accent);color:#fff}
.action-button.call:hover{background:var(--accent-dark);color:#fff}
.action-button.hubspot{border-color:#f4a261;color:#8a4b08;background:#fff7ed;font-weight:750}
.action-button.hubspot:hover{border-color:#ea580c;color:#9a3412;background:#ffedd5}

.info-card,.section-card,.panel,.summary-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.info-card{box-shadow:0 8px 20px rgba(15,23,42,.045)}
.info-card small,.panel-title span{color:var(--muted)}
.info-card strong,.section-card h3,.panel-title h3{color:var(--text)}
.activity-item{border-left-color:#c7d8ff}
.activity-item p{color:var(--text)}
.activity-item small{color:var(--muted)}
.history-card{padding:0;overflow:hidden}
.history-card summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px;cursor:pointer;font-weight:800;list-style:none}
.history-card summary::-webkit-details-marker{display:none}
.history-card summary::after{content:'+';color:var(--accent);font-size:20px;margin-left:auto}
.history-card[open] summary{border-bottom:1px solid var(--line)}
.history-card[open] summary::after{content:'−'}
.history-card summary small{color:var(--muted);font-weight:500}
.history-content{padding:6px 18px 18px}
.history-item{display:grid;grid-template-columns:34px 1fr;gap:11px;padding:14px 0;border-bottom:1px solid var(--line)}
.history-item:last-of-type{border-bottom:0}
.history-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:var(--accent-soft);color:var(--accent-dark);font-weight:850}
.history-icon.hubspot-icon{background:#fff1e6;color:#9a3412}
.history-icon.sales-icon{background:var(--accent-soft);color:var(--accent-dark)}
.history-body{min-width:0}
.history-heading{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.history-body p{margin:7px 0;color:var(--text);white-space:pre-wrap;overflow-wrap:anywhere}
.history-body small{color:var(--muted)}
.source-badge{display:inline-flex;padding:2px 7px;border-radius:999px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.hubspot-source{background:#fff1e6;color:#9a3412}
.sales-source{background:var(--accent-soft);color:var(--accent-dark)}
.history-warning{padding:9px 11px;border-radius:var(--radius);background:var(--warning-bg);color:var(--warning-ink);font-size:12px}
.history-more{margin:16px auto 0}

.dashboard{background:linear-gradient(180deg,#f8fafc 0%,#eef4fb 100%);min-height:calc(100vh - 89px)}
.summary-card strong{color:var(--text)}
.summary-card small{color:var(--muted)}
.data-row,.result-row,.recent-row{border-top-color:var(--line)}
.result-row span,.recent-row small{color:var(--muted)}
.quality-row{background:var(--panel2);border-color:var(--line);border-radius:var(--radius)}
.quality-row span{color:var(--muted)}

dialog{
  background:#fff;
  color:var(--text);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
dialog::backdrop{background:rgba(15,23,42,.55)}
.toast{background:var(--success-ink);color:#fff;border-radius:var(--radius)}
.toast.bad{background:var(--danger-ink)}

.admin-view{padding:28px;display:block}
.admin-view.hidden{display:none}
.admin-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}
.admin-heading h3{margin:0 0 6px;font-size:24px}
.admin-heading p{margin:0}
.admin-heading .primary{width:auto;padding:11px 18px}
.admin-panel{padding:22px}
.admin-user-list{display:grid;gap:10px;margin-top:16px}
.admin-user-row{display:grid;grid-template-columns:minmax(190px,1.35fr) minmax(130px,.8fr) 100px minmax(185px,1fr) 95px minmax(320px,auto);align-items:center;gap:15px;padding:15px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel2)}
.admin-user-row.is-deleted{opacity:.68}
.admin-user-row>div{display:grid;gap:4px}
.admin-user-row small,.admin-user-identity span{color:var(--muted);font-size:12px}
.admin-user-identity strong{display:flex;align-items:center;gap:8px}
.admin-badge{display:inline-flex!important;padding:2px 7px;border-radius:999px;background:var(--accent-soft);color:var(--accent-dark)!important;font-size:10px!important;text-transform:uppercase;letter-spacing:.06em}
.integration-statuses{display:flex!important;flex-wrap:wrap;gap:5px!important;margin-top:3px}.integration-status{display:inline-flex;padding:3px 7px;border-radius:999px;font-size:10px;font-weight:750}.integration-status.linked{background:var(--success-bg);color:var(--success-ink)}.integration-status.missing{background:var(--warning-bg);color:var(--warning-ink)}
.account-status{width:max-content;padding:4px 8px;border-radius:999px;font-size:12px;font-weight:700}
.account-status.enabled{background:var(--success-bg);color:var(--success-ink)}
.account-status.disabled{background:var(--warning-bg);color:var(--warning-ink)}
.account-status.deleted{background:var(--danger-bg);color:var(--danger-ink)}
.admin-actions{display:flex!important;flex-wrap:wrap;justify-content:flex-end;gap:7px!important}
.admin-action{padding:7px 10px;font-size:12px}
.action-button.danger{color:var(--danger-ink);border-color:#f4bcbc;background:var(--danger-bg)}
.admin-dialog{width:min(560px,calc(100vw - 32px))}
.admin-dialog form{margin:0}
.admin-dialog h2{margin-top:0}
.admin-identifiers{grid-template-columns:1fr 1fr}
.checkbox-row{display:flex;align-items:center;gap:9px}
.checkbox-row input{width:auto;margin:0}
.password-rule{font-size:12px;margin:0}
.integration-lookup-note{margin:0;padding:10px 12px;border-radius:var(--radius);background:var(--accent-soft);color:var(--accent-dark);font-size:12px;line-height:1.45}
.contact-name-grid,.contact-options-grid{grid-template-columns:1fr 1fr}
.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
.dialog-actions .primary{width:auto;padding:10px 16px}

@media(max-width:900px){
  .detail-panel.mobile-open{background:#f5f7fb}
  .admin-user-row{grid-template-columns:1fr 1fr}
  .admin-actions{justify-content:flex-start;grid-column:1/-1}
}

@media(max-width:580px){
  .sidebar{background:#fff;box-shadow:0 -8px 25px rgba(15,23,42,.07)}
  .login-card{padding:26px 22px}
  .login-brand img{width:66px;height:66px}
  .login-card h1{font-size:30px}
  .admin-view{padding:20px 14px 90px}
  .admin-heading{align-items:stretch;flex-direction:column}
  .admin-heading .primary{width:100%}
  .admin-user-row{grid-template-columns:1fr}
  .admin-actions{grid-column:auto}
  .admin-identifiers{grid-template-columns:1fr}
  .contact-name-grid,.contact-options-grid{grid-template-columns:1fr}
  .dialog-actions{flex-direction:column-reverse}
  .dialog-actions .primary,.dialog-actions .action-button{width:100%}
}