@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap");
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --font:"Inter",system-ui,sans-serif;
  --mono:"JetBrains Mono",monospace;
  --bg:#0a0f0d;--surface:#111916;--card:#151e1a;
  --border:#1e2e28;--border-light:#1a2822;
  --accent:#14b8a6;--accent-dark:#0d9488;--accent-light:rgba(20,184,166,.08);--accent-rgb:20,184,166;
  --accent2:#34d399;
  --text:#d1fae5;--text-secondary:#94a3b8;--muted:#5e8578;
  --danger:#f87171;--danger-light:rgba(248,113,113,.06);
  --warning:#fbbf24;--warning-light:rgba(251,191,36,.06);
  --success:#34d399;--success-light:rgba(52,211,153,.06);
  --info:#60a5fa;--info-light:rgba(96,165,250,.06);
  --sidebar-bg:#0d1410;--sidebar-active:rgba(20,184,166,.15);--sidebar-hover:rgba(20,184,166,.06);
  --nav-border:#1e2e28;
  --shadow-sm:0 1px 2px rgba(0,0,0,.3);--shadow:0 1px 3px rgba(0,0,0,.35);
  --shadow-md:0 4px 12px rgba(0,0,0,.3);--shadow-lg:0 8px 24px rgba(0,0,0,.4);
  --radius:4px;--radius-lg:8px;--radius-pill:99px;
}
:root.light{
  --bg:#f0fdf4;--surface:#fff;--card:#fff;
  --border:#d1fae5;--border-light:#ecfdf5;
  --accent:#0d9488;--accent-dark:#0f766e;--accent-light:#f0fdfa;--accent-rgb:13,148,136;
  --accent2:#059669;
  --text:#042f2e;--text-secondary:#334155;--muted:#5e8578;
  --danger:#dc2626;--danger-light:#fef2f2;
  --warning:#d97706;--warning-light:#fffbeb;
  --success:#059669;--success-light:#ecfdf5;
  --info:#2563eb;--info-light:#eff6ff;
  --sidebar-bg:#042f2e;--sidebar-active:rgba(255,255,255,.12);--sidebar-hover:rgba(255,255,255,.06);
  --nav-border:rgba(255,255,255,.1);
  --shadow-sm:0 1px 2px rgba(0,0,0,.04);--shadow:0 1px 3px rgba(0,0,0,.06);
  --shadow-md:0 4px 12px rgba(0,0,0,.06);--shadow-lg:0 8px 24px rgba(0,0,0,.08);
}
html,body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:13px;line-height:1.5;min-height:100vh}
.hidden{display:none!important}

/* ═══ LOGIN — TERMINAL STYLE ═══ */
.login-screen{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.login-box,.login-bg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#050a08}
.login-box{flex-direction:column;gap:0}
.login-box h1{font-family:var(--mono);font-size:28px;font-weight:700;color:#14b8a6;margin-bottom:6px;letter-spacing:-1px}
.login-box p,.login-subtitle{font-family:var(--mono);color:#5e8578;font-size:11px;margin-bottom:24px}
.login-box input{
  width:320px;padding:10px 14px;margin-bottom:12px;
  background:#0a0f0d;border:1px solid #1e2e28;border-radius:4px;
  font-family:var(--mono);font-size:13px;color:#d1fae5;
}
.login-box input::placeholder{color:#3d5a4f}
.login-box input:focus{outline:none;border-color:#14b8a6;box-shadow:0 0 0 2px rgba(20,184,166,.15)}
.login-box button{
  width:320px;padding:10px;
  background:#14b8a6;color:#042f2e;border:none;border-radius:4px;
  font-family:var(--mono);font-size:13px;font-weight:700;cursor:pointer;
  text-transform:uppercase;letter-spacing:.1em;
}
.login-box button:hover{background:#0d9488}
.login-box .error,.error{color:#f87171;font-family:var(--mono);font-size:12px;margin-top:10px;text-align:center}

/* ═══ MINI SIDEBAR (60px icons only) ═══ */
.sidebar{
  position:fixed!important;top:0!important;left:0!important;bottom:0!important;
  width:60px!important;height:100vh!important;
  display:flex!important;flex-direction:column!important;
  background:var(--sidebar-bg)!important;
  border-right:1px solid var(--nav-border)!important;
  z-index:100;overflow:visible!important;
  transition:width .2s!important;
}
.sidebar:hover{width:60px!important}
.sidebar.collapsed{width:60px!important}
.sidebar.open{width:60px!important}

.logo{
  display:flex!important;align-items:center!important;justify-content:center!important;
  height:52px!important;padding:0!important;
  border-bottom:1px solid var(--nav-border)!important;
}
.logo-icon{display:flex;flex-shrink:0}
.logo-text{display:none!important}
.sidebar-collapse{display:none!important}

.sidebar nav{
  flex:1!important;display:flex!important;flex-direction:column!important;
  padding:8px 0!important;gap:2px!important;overflow-y:auto!important;overflow-x:hidden!important;
  scrollbar-width:none;
}
.sidebar nav::-webkit-scrollbar{display:none}
.sidebar nav a{
  display:flex!important;align-items:center!important;justify-content:center!important;
  width:44px!important;height:38px!important;margin:0 8px!important;
  border-radius:6px!important;color:var(--muted)!important;text-decoration:none;
  transition:all .15s;position:relative;
  border:none!important;background:none!important;
}
.sidebar nav a svg{display:block!important;width:18px!important;height:18px!important;flex-shrink:0}
.sidebar nav a span{
  display:none!important;
}
.sidebar nav a:hover{background:var(--sidebar-hover)!important;color:var(--accent)!important}
.sidebar nav a.active{background:var(--sidebar-active)!important;color:var(--accent)!important}
.sidebar nav a::after{
  content:attr(data-tip);
  position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);
  background:var(--card);color:var(--text);border:1px solid var(--border);
  padding:4px 10px;border-radius:4px;font-size:11px;font-weight:600;
  white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s;z-index:200;
}
.sidebar nav a:hover::after{opacity:1}

.sidebar-footer{
  padding:8px!important;border-top:1px solid var(--nav-border)!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;gap:6px!important;
}
.sidebar-footer span{display:none!important}
.sidebar-footer button{
  width:36px!important;height:36px!important;padding:0!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  font-size:11px!important;background:none!important;
  border:1px solid var(--border)!important;color:var(--muted)!important;
  border-radius:6px!important;cursor:pointer;
}
.sidebar-footer button:hover{color:var(--danger)!important;border-color:var(--danger)!important}
.sidebar-overlay{display:none!important}
.sidebar-expand{display:none!important}

/* ═══ TOP INFO BAR ═══ */
.topbar{
  position:fixed;top:0;left:60px;right:0;height:44px;
  background:var(--surface);border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 20px;z-index:99;
}
.topbar-left{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;color:var(--muted)}
.topbar-left .brand{color:var(--accent);font-weight:700;font-size:14px}
.topbar-right{display:flex;align-items:center;gap:12px}

/* ═══ MAIN CONTENT ═══ */
main,#main-content{margin-left:60px!important;margin-top:44px!important;padding:20px 24px!important;min-height:calc(100vh - 44px);transition:none!important}
.page-header{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
  margin-bottom:16px;
}
.page-header h2{
  font-family:var(--mono)!important;font-size:14px!important;font-weight:700!important;
  color:var(--accent)!important;text-transform:uppercase!important;letter-spacing:.08em!important;
  margin-bottom:0!important;
}
h2{font-family:var(--mono);font-size:14px!important;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.08em}
h3{font-size:13px!important;font-weight:700;font-family:var(--mono);color:var(--text);margin-bottom:10px}

/* ═══ STAT CARDS — TERMINAL METRICS ═══ */
.cards,.stat-cards,.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:20px}
.stat-card,.card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:14px 16px;position:relative;overflow:hidden;
}
.stat-card::before,.card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--accent),transparent);
}
.stat-card:hover,.card:hover{border-color:var(--accent);box-shadow:0 0 12px rgba(20,184,166,.08)}
.card-label,.stat-label{font-family:var(--mono);font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:6px}
.card-value,.stat-value{font-family:var(--mono);font-size:24px;font-weight:700;color:var(--text);letter-spacing:-.5px}

/* ═══ TABLES — DENSE STRIPED ═══ */
.table-wrap{background:var(--card)!important;border:1px solid var(--border)!important;border-radius:var(--radius)!important;overflow-x:auto!important;box-shadow:none!important}
table{width:100%;border-collapse:collapse!important;font-size:12px!important;font-family:var(--font)}
thead th{
  background:var(--surface)!important;
  color:var(--muted)!important;font-family:var(--mono)!important;font-size:9px!important;font-weight:700!important;
  text-transform:uppercase!important;letter-spacing:.1em!important;padding:8px 12px!important;
  border-bottom:1px solid var(--border)!important;
  position:sticky;top:0;z-index:2;white-space:nowrap;
}
tbody tr{border-bottom:1px solid var(--border-light)!important;transition:background .1s}
tbody tr:nth-child(even){background:rgba(20,184,166,.02)}
tbody tr:hover{background:rgba(20,184,166,.06)!important}
tbody td{padding:8px 12px!important;vertical-align:middle;color:var(--text-secondary);font-size:12px}
tbody tr td:first-child{border-radius:0}
tbody tr td:last-child{border-radius:0}

/* ═══ BADGES — OUTLINED ═══ */
.badge,[class*="badge-"]{
  display:inline-block;padding:2px 8px;border-radius:var(--radius);
  font-family:var(--mono);font-size:10px;font-weight:600;
  text-transform:uppercase;letter-spacing:.05em;
  background:transparent!important;border:1px solid;
}
.badge-approved,.badge-new,.badge-ftd,.green,.badge-new_lead,.badge-deposited{border-color:var(--success);color:var(--success)}
.badge-declined,.badge-rejected,.badge-invalid,.red,.danger{border-color:var(--danger);color:var(--danger)}
.badge-pending,.badge-hold,.badge-sent,.badge-warning{border-color:var(--warning);color:var(--warning)}
.badge-callback,.badge-follow_up,.blue{border-color:var(--info);color:var(--info)}

/* ═══ BUTTONS ═══ */
button,.btn{
  font-family:var(--mono);font-size:11px;font-weight:600;
  padding:6px 14px;border-radius:var(--radius);cursor:pointer;
  border:1px solid var(--border);background:transparent;color:var(--text);
  transition:all .15s;display:inline-flex;align-items:center;gap:5px;
  text-transform:uppercase;letter-spacing:.05em;
}
button:hover,.btn:hover{border-color:var(--accent);color:var(--accent)}
button.secondary,.btn.secondary{background:transparent!important;color:var(--text)!important;border:1px solid var(--border)!important}
button.secondary:hover,.btn.secondary:hover{border-color:var(--accent)!important;color:var(--accent)!important}
button.sm,.btn.sm{padding:3px 8px!important;font-size:10px!important}

/* ═══ INPUTS ═══ */
select,input[type="text"],input[type="email"],input[type="number"],input[type="search"],input[type="url"],input[type="tel"],input[type="date"],input[type="password"],textarea{
  font-family:var(--font);font-size:12px;padding:6px 10px;
  border:1px solid var(--border);border-radius:var(--radius);
  background:var(--surface);color:var(--text);transition:border-color .15s;
}
select:focus,input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.1)}
.filters,.filter-section{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}

/* ═══ MODALS ═══ */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:2000;backdrop-filter:blur(4px)}
.modal{background:var(--card);border-radius:var(--radius-lg);padding:24px;width:540px;max-width:95vw;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-lg);border:1px solid var(--border)}
.modal h3{font-size:14px;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:20px;padding-top:14px;border-top:1px solid var(--border)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.form-row label{display:block;font-family:var(--mono);font-size:10px;font-weight:600;color:var(--muted);margin-bottom:3px;text-transform:uppercase;letter-spacing:.06em}

/* ═══ PAGINATION ═══ */
.pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;padding:14px 0;font-size:12px;color:var(--muted);font-family:var(--mono)}
.pagination button{background:transparent!important;color:var(--text)!important;border:1px solid var(--border)!important;padding:4px 12px;border-radius:var(--radius);font-size:11px}
.pagination button:hover{border-color:var(--accent)!important;color:var(--accent)!important}
.pagination button:disabled{opacity:.3;cursor:default}

/* ═══ DETAIL ═══ */
.lead-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.detail-field{padding:8px 12px;background:var(--surface);border-radius:var(--radius);border:1px solid var(--border-light)}
.detail-field small{display:block;font-family:var(--mono);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:2px}
.detail-field span,.detail-field div{font-size:12px;color:var(--text);font-weight:500}
.panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:14px}

/* ═══ MISC ═══ */
.score-cell{cursor:pointer;position:relative}.score-hover{text-decoration:underline dotted}
.score-tip{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:6px 10px;font-family:var(--mono);font-size:10px;box-shadow:var(--shadow-md);z-index:10;white-space:nowrap}
.status-history-row{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--border-light);font-size:11px}
.status-tooltip{position:absolute;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:8px;box-shadow:var(--shadow-lg);z-index:100;font-size:11px}
.tooltip-wrap{position:relative}
.tooltip-box{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:#111916;color:var(--text);padding:4px 8px;border-radius:3px;font-family:var(--mono);font-size:10px;white-space:nowrap;z-index:50;pointer-events:none;border:1px solid var(--border)}
.copy-btn{background:none!important;border:1px solid var(--border)!important;color:var(--muted)!important;padding:2px 6px!important;border-radius:3px!important;font-family:var(--mono);font-size:10px;cursor:pointer}
.copy-btn:hover{color:var(--accent)!important;border-color:var(--accent)!important}
.ic-section{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:12px}
.pd-badge{display:inline-block;padding:2px 6px;border-radius:var(--radius);font-family:var(--mono);font-size:9px;font-weight:600}
.logo-preview{width:40px;height:40px;object-fit:contain;border-radius:var(--radius);border:1px solid var(--border)}
.palette-swatch{width:24px;height:24px;border-radius:4px;border:1px solid var(--border);cursor:pointer}
.geo-day-cb,.rot-day-cb,.st-country-cb,.lead-cb,.sh-date{accent-color:var(--accent)}
.country-pick-item{padding:5px 10px;cursor:pointer;font-size:11px;border-bottom:1px solid var(--border-light)}
.country-pick-item:hover{background:var(--accent-light)}
.abs{position:absolute}.active_count{font-weight:700}.actions{display:flex;gap:4px;align-items:center}

/* ═══ CHAT HIDDEN ═══ */
.chat-btn,.chat-window{display:none!important;visibility:hidden!important;pointer-events:none!important}

/* ═══ DASHBOARD TICKER ═══ */
.dash-ticker{
  display:flex;gap:0;background:var(--card);border:1px solid var(--border);
  border-radius:var(--radius);margin-bottom:16px;overflow:hidden;
  font-family:var(--mono);
}
.dash-ticker .tick{
  flex:1;padding:10px 16px;border-right:1px solid var(--border);
  display:flex;flex-direction:column;gap:2px;
}
.dash-ticker .tick:last-child{border-right:none}
.dash-ticker .tick-label{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.dash-ticker .tick-val{font-size:18px;font-weight:700;color:var(--text)}

/* ═══ RESPONSIVE ═══ */
@media(max-width:768px){
  .sidebar{width:0!important;overflow:hidden!important}
  .sidebar.open{width:60px!important}
  .sidebar-expand{display:flex!important;position:fixed;top:8px;left:8px;z-index:101;background:var(--accent);color:#042f2e;border:none;width:34px;height:34px;border-radius:6px;font-size:14px;cursor:pointer}
  main,#main-content{margin-left:0!important;margin-top:44px!important;padding:14px 12px!important}
  .modal{width:95vw;padding:16px}
  .form-row{grid-template-columns:1fr}
}

/* ═══ ANIM ═══ */
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.page-content,[data-page]{animation:fadeUp .2s ease-out}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:var(--muted)}

/* ═══ LIGHT MODE OVERRIDES ═══ */
:root.light body,:root.light html{background:#f0fdf4!important}
:root.light main,:root.light #main-content{background:#f0fdf4!important}
:root.light .sidebar{background:#042f2e!important;border-right-color:rgba(255,255,255,.08)!important}
:root.light .sidebar nav a{color:rgba(167,243,208,.5)!important}
:root.light .sidebar nav a:hover{color:#fff!important;background:rgba(255,255,255,.06)!important}
:root.light .sidebar nav a.active{color:#fff!important;background:rgba(255,255,255,.12)!important}
:root.light .logo{border-bottom-color:rgba(255,255,255,.08)!important}
:root.light .sidebar-footer{border-top-color:rgba(255,255,255,.08)!important}
:root.light .sidebar-footer button{border-color:rgba(255,255,255,.15)!important;color:rgba(167,243,208,.5)!important}

:root.light h2,:root.light h3,:root.light .page-header h2{color:#0d9488!important}
:root.light select,:root.light input,:root.light textarea{background:#fff!important;border-color:#d1d5db!important;color:#1e293b!important}
:root.light .table-wrap{background:#fff!important;border-color:#d1fae5!important}
:root.light thead th{background:#f0fdf4!important;color:#5e8578!important;border-bottom-color:#d1fae5!important}
:root.light tbody tr{border-bottom-color:#ecfdf5!important}
:root.light tbody tr:nth-child(even){background:rgba(13,148,136,.02)}
:root.light tbody tr:hover{background:rgba(13,148,136,.05)!important}
:root.light tbody td{color:#1e293b!important}
:root.light .stat-card,:root.light .card,:root.light .panel{background:#fff!important;border-color:#d1fae5!important}
:root.light .stat-card::before,:root.light .card::before{background:linear-gradient(90deg,#0d9488,transparent)}
:root.light .card-label,:root.light .stat-label{color:#5e8578!important}
:root.light .card-value,:root.light .stat-value{color:#042f2e!important}
:root.light .pagination{color:#5e8578!important}
:root.light .pagination button{background:#fff!important;border-color:#d1fae5!important;color:#042f2e!important}
:root.light .modal{background:#fff!important;border-color:#d1fae5!important}
:root.light .detail-field{background:#f0fdf4!important;border-color:#d1fae5!important}
:root.light .dash-ticker{background:#fff!important;border-color:#d1fae5!important}
:root.light .dash-ticker .tick{border-right-color:#d1fae5!important}
:root.light .dash-ticker .tick-val{color:#042f2e!important}
:root.light .copy-btn{background:#fff!important;border-color:#d1fae5!important;color:#5e8578!important}
:root.light .badge-approved,:root.light .green{border-color:#059669!important;color:#059669!important}
:root.light .badge-declined,:root.light .badge-rejected,:root.light .red{border-color:#dc2626!important;color:#dc2626!important}
:root.light .badge-pending,:root.light .badge-hold,:root.light .badge-warning{border-color:#d97706!important;color:#d97706!important}
:root.light .badge-callback,:root.light .blue{border-color:#2563eb!important;color:#2563eb!important}
:root.light .score-tip,:root.light .status-tooltip{background:#fff!important;border-color:#d1fae5!important;color:#1e293b!important}
:root.light .ic-section{background:#fff!important;border-color:#d1fae5!important}
:root.light .notif-panel,:root.light #notif-panel{background:#fff!important;border-color:#d1fae5!important}
:root.light button{border-color:#d1fae5!important}
:root.light button:hover{border-color:#0d9488!important;color:#0d9488!important}
:root.light .login-box{background:#f0fdf4}
:root.light .login-box input{background:#fff;border-color:#d1fae5;color:#042f2e}
:root.light .login-box h1{color:#0d9488}