/* Lead Source Management — the Hub's own tokens (styles.css :root), the bluish
   glass look of Automation Task Monitoring. Status colours are the same set the
   rest of the Hub uses: Active green · Potential amber · Inactive slate. */

.ls-shell{grid-column:1 / -1;min-width:0;display:flex;flex-direction:column;gap:16px}
.ls-shell [hidden]{display:none !important}
#lsContent{display:flex;flex-direction:column;gap:16px;min-width:0}

/* ── Bar, tabs, buttons ───────────────────────────────────────────────────── */
.ls-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ls-tabs,.ls-actions{display:flex;gap:6px;flex-wrap:wrap}
.ls-tab{padding:8px 15px;border:1px solid var(--border);border-radius:9px;background:#fff;color:var(--text-2);
  font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}
.ls-tab:hover{border-color:var(--blue);color:var(--blue)}
.ls-tab.active{background:linear-gradient(135deg,#1e5799,#2989d8);color:#fff;border-color:transparent;
  box-shadow:0 4px 14px rgba(30,87,153,.32)}
.ls-btn{padding:8px 16px;border:none;border-radius:9px;background:linear-gradient(135deg,#1e5799,#2989d8);color:#fff;
  font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 3px 10px rgba(30,87,153,.28);
  transition:transform .12s,box-shadow .12s;font-family:inherit}
.ls-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(30,87,153,.34)}
.ls-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.ls-btn-ghost{background:#fff;color:var(--text-1);border:1px solid var(--border);box-shadow:none}
.ls-btn-ghost:hover{transform:none;border-color:var(--blue);color:var(--blue);box-shadow:none}
.ls-btn-sm{padding:5px 11px;font-size:12px}

/* ── Glass card ───────────────────────────────────────────────────────────── */
.ls-card{background:linear-gradient(160deg,rgba(255,255,255,.94),rgba(234,241,251,.86));
  border:1px solid rgba(30,87,153,.14);border-radius:14px;box-shadow:0 4px 18px rgba(30,87,153,.08);
  padding:16px 18px;backdrop-filter:blur(6px)}
.ls-card-h{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-2);
  margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.ls-card-h small{font-weight:500;text-transform:none;letter-spacing:0;color:var(--text-3)}
.ls-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}

.ls-loading{padding:48px 0;text-align:center;color:var(--text-3);font-size:13px}
.ls-muted{color:var(--text-3)}
.ls-empty{text-align:center;padding:56px 20px}
.ls-empty-icon{font-size:40px;margin-bottom:10px}
.ls-empty h3{margin:0 0 6px;font-size:17px;color:var(--text-1)}
.ls-empty p{margin:0 auto 18px;max-width:460px;color:var(--text-2);font-size:13px;line-height:1.55}
.ls-notice{font-size:12.5px;line-height:1.5;padding:10px 14px;border-radius:10px;border:1px solid}
.ls-notice-error{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.ls-notice-info{background:#eff6ff;border-color:#bfdbfe;color:#1e3a8a}

/* ── Dashboard ────────────────────────────────────────────────────────────── */
.ls-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ls-tile{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:4px;padding:14px 16px;
  border-radius:13px;background:linear-gradient(160deg,rgba(255,255,255,.94),rgba(234,241,251,.86));
  border:1px solid rgba(30,87,153,.14);box-shadow:0 3px 12px rgba(30,87,153,.08);
  transition:transform .13s ease,box-shadow .13s ease,border-color .13s ease}
.ls-tile:hover{transform:translateY(-2px);border-color:rgba(30,87,153,.34);box-shadow:0 8px 22px rgba(30,87,153,.17)}
.ls-tile:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ls-tile-n{font-size:28px;font-weight:800;line-height:1;color:#1e3a5f}
.ls-tile-l{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3)}
.ls-tile.active .ls-tile-n{color:#15803d}.ls-tile.potential .ls-tile-n{color:#b45309}
.ls-tile.inactive .ls-tile-n{color:#64748b}
.ls-money{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:0;overflow:hidden;
  background:linear-gradient(135deg,#0b1f3a,#1e5799 60%,#2989d8);border:none;color:#fff;
  box-shadow:0 10px 30px rgba(11,31,58,.28)}
.ls-money>div{padding:18px 20px;border-right:1px solid rgba(255,255,255,.12)}
.ls-money>div:last-child{border-right:none}
.ls-money-n{font-size:24px;font-weight:800;letter-spacing:-.01em}
.ls-money-l{font-size:11px;font-weight:600;opacity:.82;margin-top:3px;text-transform:uppercase;letter-spacing:.05em}
.ls-money-s{font-size:11px;opacity:.65;margin-top:2px}
.ls-mix{display:flex;height:12px;border-radius:999px;overflow:hidden;background:#e2e8f0;margin:6px 0 10px}
.ls-mix span{display:block;height:100%}
.ls-mix-ex{background:linear-gradient(90deg,#1e5799,#3b9eda)}.ls-mix-sh{background:#94a3b8}.ls-mix-ns{background:#e2e8f0}
.ls-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--text-2)}
.ls-legend i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.ls-attn{display:flex;flex-direction:column;gap:8px}
.ls-attn button, .ls-attn-btn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;gap:10px;
  align-items:flex-start;padding:9px 12px;border-radius:10px;background:#fffbeb;border:1px solid #fde68a;
  transition:border-color .13s,transform .13s}
.ls-attn button:hover, .ls-attn-btn:hover{border-color:#f59e0b;transform:translateX(2px)}
.ls-attn b{font-size:13px;color:var(--text-1)}
.ls-attn span{font-size:11.5px;color:#92400e;text-align:right}

/* ── Tables ───────────────────────────────────────────────────────────────── */
.ls-table-wrap{overflow-x:auto;border-radius:12px}
.ls-table{width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px}
.ls-table th{position:sticky;top:0;background:#f1f5f9;color:var(--text-2);font-size:10.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;text-align:left;padding:9px 10px;border-bottom:1px solid var(--border);
  white-space:nowrap}
.ls-table td{padding:10px;border-bottom:1px solid #eef2f7;vertical-align:top;color:var(--text-1)}
.ls-table tbody tr{cursor:pointer;transition:background .12s}
.ls-table tbody tr:hover{background:#f4f8fd}
.ls-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.ls-table .sub{display:block;font-size:11px;color:var(--text-3);margin-top:2px}
.ls-table-static tbody tr{cursor:default}
.ls-table-static tbody tr:hover{background:transparent}

/* ── Pills and chips ──────────────────────────────────────────────────────── */
.ls-pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:2px 9px;
  border-radius:999px;white-space:nowrap}
.ls-pill::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.ls-pill-Active{background:#dcfce7;color:#15803d}
.ls-pill-Potential{background:#fef3c7;color:#b45309}
.ls-pill-Inactive{background:#e2e8f0;color:#475569}
.ls-chip{display:inline-block;font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:6px;
  background:var(--accent-soft);color:var(--blue);margin:0 3px 3px 0}
.ls-lock{font-size:12px}

/* ── Filters ──────────────────────────────────────────────────────────────── */
.ls-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.ls-filters .ls-field{min-width:130px}
.ls-filters .ls-field-search{flex:1;min-width:220px}
.ls-field{display:flex;flex-direction:column;gap:4px}
.ls-field label{font-size:10.5px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.05em}
.ls-input{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid var(--border);border-radius:8px;
  font-size:13px;color:var(--text-1);background:#fff;font-family:inherit;outline:none;
  transition:border-color .15s,box-shadow .15s}
.ls-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
textarea.ls-input{resize:vertical;min-height:64px;line-height:1.45}
.ls-count{font-size:12px;color:var(--text-3);margin-top:10px}

/* ── Slide-over detail panel ──────────────────────────────────────────────── */
.ls-backdrop{position:fixed;inset:0;background:rgba(11,31,58,.38);backdrop-filter:blur(2px);z-index:900;
  animation:lsFade .15s ease}
.ls-panel{position:fixed;top:0;right:0;bottom:0;width:min(560px,100vw);background:#f8fafd;z-index:901;
  box-shadow:-18px 0 40px rgba(11,31,58,.22);display:flex;flex-direction:column;animation:lsSlide .2s ease}
.ls-panel-h{padding:20px 22px 16px;background:linear-gradient(135deg,#0b1f3a,#1e5799);color:#fff}
.ls-panel-h h2{margin:0;font-size:19px;line-height:1.25;word-break:break-word}
.ls-panel-h .ls-panel-sub{font-size:12.5px;opacity:.8;margin-top:4px}
.ls-panel-h a{color:#bfdbfe}
.ls-panel-x{all:unset;cursor:pointer;float:right;font-size:20px;line-height:1;opacity:.8;padding:2px 4px}
.ls-panel-x:hover{opacity:1}
.ls-panel-b{flex:1;overflow-y:auto;padding:18px 22px;display:flex;flex-direction:column;gap:14px}
.ls-panel-f{padding:12px 22px;border-top:1px solid var(--border);background:#fff;display:flex;gap:8px;
  align-items:center;justify-content:space-between;flex-wrap:wrap}
.ls-status-row{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}
.ls-status-btn{all:unset;cursor:pointer;font-size:12px;font-weight:600;padding:5px 12px;border-radius:999px;
  background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.25);transition:background .13s}
.ls-status-btn:hover{background:rgba(255,255,255,.24)}
.ls-status-btn.on{background:#fff;color:#1e3a5f;border-color:#fff}
.ls-dl{display:grid;grid-template-columns:140px minmax(0,1fr);gap:7px 12px;font-size:13px}
.ls-dl dt{color:var(--text-3);font-size:12px}
.ls-dl dd{margin:0;color:var(--text-1);word-break:break-word;white-space:pre-wrap}
.ls-login-box{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;background:#0d1b2e;color:#e2e8f0;
  padding:12px 14px;border-radius:10px;white-space:pre-wrap;word-break:break-all;margin:10px 0 8px}
.ls-login-meta{font-size:11.5px;color:var(--text-3);margin-top:6px}

/* ── Form ─────────────────────────────────────────────────────────────────── */
.ls-modal{position:fixed;inset:0;z-index:950;display:flex;align-items:flex-start;justify-content:center;
  padding:40px 16px;overflow-y:auto;background:rgba(11,31,58,.45);backdrop-filter:blur(3px);animation:lsFade .15s ease}
.ls-form{width:min(860px,100%);background:#f8fafd;border-radius:16px;box-shadow:0 24px 60px rgba(11,31,58,.35);
  overflow:hidden}
.ls-form-h{padding:18px 22px;background:linear-gradient(135deg,#0b1f3a,#1e5799);color:#fff;display:flex;
  justify-content:space-between;align-items:center}
.ls-form-h h2{margin:0;font-size:18px}
.ls-form-b{padding:18px 22px;display:flex;flex-direction:column;gap:14px}
.ls-form-sec{background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.ls-form-sec h4{margin:0 0 10px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--blue)}
.ls-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.ls-form-grid .wide{grid-column:1 / -1}
.ls-req{color:#dc2626}
.ls-hint{font-size:11px;color:var(--text-3);margin-top:3px}
.ls-checks{display:flex;gap:16px;flex-wrap:wrap}
.ls-checks label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--text-1);cursor:pointer}
.ls-form-f{padding:14px 22px;border-top:1px solid var(--border);background:#fff;display:flex;justify-content:flex-end;gap:8px}

/* ── Toast ────────────────────────────────────────────────────────────────── */
.ls-toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:1000;background:#0b1f3a;color:#fff;font-size:13px;
  font-weight:600;padding:11px 16px;border-radius:11px;box-shadow:0 10px 30px rgba(11,31,58,.35);
  animation:lsRise .2s ease}
.ls-toast.error{background:#991b1b}

@keyframes lsFade{from{opacity:0}to{opacity:1}}
@keyframes lsSlide{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes lsRise{from{transform:translate(-50%,10px);opacity:0}to{transform:translate(-50%,0);opacity:1}}

@media (max-width:900px){
  .ls-tiles,.ls-money{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ls-money>div:nth-child(2){border-right:none}
  .ls-dl{grid-template-columns:1fr}
}

/* ── Discover ─────────────────────────────────────────────────────────────────
   Finding new vendors on the live web. Same glass and the same blues as the rest
   of the module; the only new colour work is the three verdict chips, which have
   to read at a glance: green is verified alive, amber could not be read, blue has
   moved to a new owner. Parked and dead never reach this screen. */

.lsd{display:flex;flex-direction:column;gap:16px;min-width:0}
.lsd-intro h3{margin:0 0 4px;font-size:16px;color:var(--text-1)}
.lsd-intro p{margin:0;font-size:13px;color:var(--text-2);max-width:78ch;line-height:1.55}

.lsd-form{background:linear-gradient(160deg,rgba(255,255,255,.94),rgba(234,241,251,.86));
  border:1px solid rgba(30,87,153,.14);border-radius:14px;box-shadow:0 4px 18px rgba(30,87,153,.08);
  padding:16px}
.lsd-go{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}

.lsd-working{padding:22px;text-align:center;color:var(--text-2);font-size:13px;
  background:rgba(234,241,251,.5);border:1px dashed rgba(30,87,153,.2);border-radius:12px}
.lsd-summary{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:13px;color:var(--text-2);padding:10px 14px;border-radius:10px;
  background:rgba(234,241,251,.6);border:1px solid rgba(30,87,153,.12)}
.lsd-summary strong{color:var(--text-1)}

.lsd-cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));margin-top:14px}
.lsd-card{background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(240,245,252,.9));
  border:1px solid rgba(30,87,153,.14);border-left:4px solid var(--border);border-radius:14px;
  box-shadow:0 4px 18px rgba(30,87,153,.08);padding:15px;display:flex;flex-direction:column;gap:10px;
  transition:transform .12s,box-shadow .12s}
.lsd-card:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(30,87,153,.14)}
.lsd-card.lsd-ok{border-left-color:#2e9e5b}
.lsd-card.lsd-warn{border-left-color:#d79a21}
.lsd-card.lsd-moved{border-left-color:#2989d8}

.lsd-card-h{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.lsd-card-h h4{margin:0 0 2px;font-size:14.5px;color:var(--text-1);line-height:1.3}
.lsd-site{font-size:12px;word-break:break-all}
.lsd-site a{color:var(--blue);text-decoration:none}
.lsd-site a:hover{text-decoration:underline}
.lsd-chip{flex:0 0 auto;font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;
  background:rgba(30,87,153,.08);color:var(--text-2);white-space:nowrap}
.lsd-ok .lsd-chip{background:rgba(46,158,91,.13);color:#24794a}
.lsd-warn .lsd-chip{background:rgba(215,154,33,.16);color:#8a6310}
.lsd-moved .lsd-chip{background:rgba(41,137,216,.14);color:#1c5f96}

.lsd-reason{font-size:12.5px;color:var(--text-2);line-height:1.5}
.lsd-moved-note,.lsd-warn-note{font-size:12px;padding:8px 10px;border-radius:9px;line-height:1.45}
.lsd-moved-note{background:rgba(41,137,216,.09);color:#1c5f96}
.lsd-warn-note{background:rgba(215,154,33,.12);color:#8a6310}

.lsd-tags{display:flex;gap:6px;flex-wrap:wrap}
.lsd-tag{font-size:11px;padding:3px 8px;border-radius:999px;background:rgba(30,87,153,.07);color:var(--text-3)}
.lsd-tag-good{background:rgba(46,158,91,.12);color:#24794a;font-weight:600}

.lsd-evidence{display:flex;flex-direction:column;gap:3px;border-top:1px solid rgba(30,87,153,.1);
  padding-top:9px}
.lsd-ev{display:flex;gap:10px;font-size:12px;line-height:1.45}
.lsd-ev-l{flex:0 0 40%;color:var(--text-3)}
.lsd-ev-v{flex:1;color:var(--text-1);word-break:break-word}
.lsd-ev-blank .lsd-ev-v{color:var(--text-3);font-style:italic}

.lsd-price{font-size:12px;color:var(--text-2);line-height:1.45}
.lsd-asks{font-size:12px;color:var(--text-2)}
.lsd-asks strong{display:block;margin-bottom:3px;color:var(--text-1)}
.lsd-asks ul{margin:0;padding-left:17px;line-height:1.5}
.lsd-money-note{font-size:11.5px;color:var(--text-3);line-height:1.45;font-style:italic;
  border-top:1px dashed rgba(30,87,153,.14);padding-top:8px}
.lsd-card-f{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.lsd-card-f-l{display:flex;gap:6px;flex-wrap:wrap}
.lsd-added{font-size:12.5px;font-weight:700;color:#24794a;padding:7px 12px;border-radius:9px;
  background:rgba(46,158,91,.1)}
.lsd-gaps{font-size:12px;color:#8a6310;background:rgba(215,154,33,.1);padding:8px 10px;
  border-radius:9px;line-height:1.45}
.lsd-gaps strong{color:#6f4f0c}

/* ── Cards or comparison table ────────────────────────────────────────────── */
.lsd-views{display:flex;gap:6px;flex:0 0 auto}
.lsd-view{font-size:12px;font-weight:600;padding:5px 11px;border-radius:8px;cursor:pointer;
  border:1px solid var(--border);background:#fff;color:var(--text-2);transition:all .15s ease}
.lsd-view:hover{border-color:var(--blue);color:var(--blue)}
.lsd-view.on{background:linear-gradient(135deg,#1e5799,#2989d8);border-color:transparent;color:#fff;
  box-shadow:0 4px 12px rgba(41,137,216,.28)}

.lsd-matrix-wrap{margin-top:14px;overflow-x:auto;border:1px solid var(--border);border-radius:12px;
  background:#fff;box-shadow:0 6px 18px rgba(30,87,153,.07)}
.lsd-matrix{width:100%;border-collapse:collapse;font-size:12.5px;min-width:900px}
.lsd-matrix th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--blue);background:rgba(30,87,153,.05);padding:9px 11px;white-space:nowrap}
.lsd-matrix td{padding:9px 11px;border-top:1px solid rgba(30,87,153,.09);color:var(--text-1);
  vertical-align:top;max-width:210px;overflow:hidden;text-overflow:ellipsis}
.lsd-matrix tr:hover td{background:rgba(41,137,216,.04)}
.lsd-matrix tr.lsd-ok td:first-child{box-shadow:inset 3px 0 0 #2e9e5b}
.lsd-matrix tr.lsd-warn td:first-child{box-shadow:inset 3px 0 0 #d79a21}
.lsd-matrix tr.lsd-moved td:first-child{box-shadow:inset 3px 0 0 #2989d8}
.lsd-m-name{white-space:nowrap}
.lsd-m-name strong{display:block;color:var(--text-1)}
.lsd-m-blank{color:var(--text-3);font-style:italic}
.lsd-m-site{max-width:180px;word-break:break-all;font-size:11.5px}
.lsd-m-num{text-align:center;white-space:nowrap}
.lsd-m-act{text-align:right;white-space:nowrap}
.lsd-answered{font-weight:700;color:var(--text-2)}
.lsd-chip-sm{display:inline-block;margin-top:3px;font-size:10px;padding:2px 7px}

/* ── Checking one website again ───────────────────────────────────────────── */
.lsd-recheck{margin-top:2px}
.lsd-recheck-out{border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:5px;
  background:rgba(30,87,153,.05);font-size:12.5px;margin-top:8px}
.lsd-recheck-out.lsd-ok{background:rgba(46,158,91,.1)}
.lsd-recheck-out.lsd-warn{background:rgba(215,154,33,.12)}
.lsd-recheck-out.lsd-moved{background:rgba(41,137,216,.1)}
.lsd-recheck-out.lsd-bad{background:rgba(220,38,38,.09)}
.lsd-recheck-advice{font-size:12px;color:var(--text-2);line-height:1.45}

/* ── The outreach draft ───────────────────────────────────────────────────── */
.ls-draft{width:min(720px,100%)}
.ls-draft-meta{font-size:13px;color:var(--text-2)}
.ls-draft-to{word-break:break-all}
.ls-draft-body{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;
  line-height:1.5;resize:vertical;min-height:260px}
.ls-draft-note{font-size:11.5px;color:var(--text-3);line-height:1.45;font-style:italic}

@media (max-width:640px){
  .lsd-cards{grid-template-columns:1fr}
  .lsd-ev{flex-direction:column;gap:1px}
  .lsd-ev-l{flex:none}
  .lsd-summary{flex-direction:column;align-items:flex-start}
}
