/* ═══════════════════ RESET & VARIABLES ═══════════════════ */*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }:root {  --bg: #FFFFFF;  --sidebar: #F5F5F5;  --card: #FFFFFF;  --card-hover: #FAFAFA;  --border: #E5E5E5;  --border-strong: #D0D0D0;  --accent: #FF6B00;  --accent-dim: #FFF4EE;  --accent-border: #FFD5B8;  --text: #0A0A0A;  --text-sec: #555555;  --text-dim: #999999;  --success: #16a34a;  --success-bg: #F0FDF4;  --danger: #dc2626;  --danger-bg: #FEF2F2;  --info: #2563eb;  --info-bg: #EFF6FF;  --warning: #d97706;  --warning-bg: #FFFBEB;  --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;  --panel-w: 440px;  --sidebar-w: 232px;  --radius: 10px;  --radius-sm: 6px;  --shadow: 0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);  --shadow-md: 0 4px 12px rgba(0,0,0,0.1), 0 2px 4px rgba(0,0,0,0.06);  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12), 0 4px 8px rgba(0,0,0,0.06);}html, body {  height: 100%;  background: var(--bg);  color: var(--text);  font-family: var(--font);  font-size: 14px;  line-height: 1.5;  overflow: hidden;  -webkit-font-smoothing: antialiased;}a { cursor: pointer; text-decoration: none; color: inherit; }button { cursor: pointer; font-family: var(--font); font-size: 13px; border: none; }input, select, textarea { font-family: var(--font); font-size: 13px; color: var(--text); }svg { display: block; flex-shrink: 0; }/* ═══════════════════ SCROLLBARS ═══════════════════ */::-webkit-scrollbar { width: 5px; height: 5px; }::-webkit-scrollbar-track { background: #F5F5F5; }::-webkit-scrollbar-thumb { background: #D5D5D5; border-radius: 3px; }::-webkit-scrollbar-thumb:hover { background: #BBBBBB; }/* ═══════════════════ LOGIN ═══════════════════ */#login-screen {  display: flex;  align-items: center;  justify-content: center;  height: 100vh;  background: #FAFAFA;}.login-card {  background: var(--card);  border: 1px solid var(--border);  border-radius: 16px;  padding: 44px 40px;  width: 380px;  box-shadow: var(--shadow-lg);}.login-logo {  display: flex;  align-items: center;  gap: 12px;  margin-bottom: 6px;}.login-logo-icon {  width: 44px; height: 44px;  background: var(--accent);  border-radius: 10px;  display: flex; align-items: center; justify-content: center;  font-size: 22px; font-weight: 800; color: #fff;  box-shadow: 0 4px 12px rgba(255,107,0,0.3);}.login-logo span { font-size: 22px; font-weight: 800; color: var(--text); }.login-sub {  color: var(--text-sec);  font-size: 13px;  margin-bottom: 32px;  padding-left: 2px;}.login-error {  background: var(--danger-bg);  border: 1px solid #FECACA;  color: var(--danger);  padding: 10px 14px;  border-radius: var(--radius-sm);  font-size: 13px;  margin-bottom: 12px;}/* ═══════════════════ APP LAYOUT ═══════════════════ */#app {  display: flex;  height: 100vh;  overflow: hidden;  background: var(--bg);}/* ═══════════════════ SIDEBAR ═══════════════════ */#sidebar {  width: var(--sidebar-w);  min-width: var(--sidebar-w);  background: var(--sidebar);  border-right: 1px solid var(--border);  display: flex;  flex-direction: column;  overflow-y: auto;  overflow-x: hidden;}.sidebar-logo {  display: flex;  align-items: center;  gap: 10px;  padding: 20px 18px 18px;  border-bottom: 1px solid var(--border);  flex-shrink: 0;}.logo-mark {  width: 34px; height: 34px;  background: var(--accent);  border-radius: 8px;  display: flex; align-items: center; justify-content: center;  font-size: 17px; font-weight: 800; color: #fff;  flex-shrink: 0;  box-shadow: 0 2px 8px rgba(255,107,0,0.25);}.logo-title { font-size: 14px; font-weight: 800; color: var(--text); }.logo-sub { font-size: 11px; color: var(--text-dim); }.sidebar-nav {  padding: 10px 10px;  border-bottom: 1px solid var(--border);  display: flex;  flex-direction: column;  gap: 2px;}.nav-item {  display: flex;  align-items: center;  gap: 10px;  padding: 9px 10px 9px 12px;  border-radius: var(--radius-sm);  font-size: 13px;  font-weight: 500;  color: var(--text-sec);  transition: all 0.15s;  user-select: none;  border-left: 3px solid transparent;}.nav-item svg { width: 16px; height: 16px; }.nav-item:hover {  background: #EEEEEE;  color: var(--text);  border-left-color: transparent;}.nav-item.active {  background: var(--accent-dim);  color: var(--accent);  border-left-color: var(--accent);  font-weight: 600;}.sidebar-section {  padding: 14px 10px;  border-bottom: 1px solid var(--border);  display: flex;  flex-direction: column;  gap: 5px;}.sidebar-section-label {  font-size: 10px;  font-weight: 700;  color: var(--text-dim);  text-transform: uppercase;  letter-spacing: 0.9px;  padding: 0 4px 6px;}.sidebar-btn {  width: 100%;  display: flex;  align-items: center;  gap: 8px;  padding: 8px 12px;  border-radius: var(--radius-sm);  font-size: 13px;  justify-content: flex-start;  transition: all 0.15s;}.sidebar-btn svg { width: 14px; height: 14px; }.sidebar-footer {  margin-top: auto;  padding: 12px 10px;  border-top: 1px solid var(--border);  display: flex;  align-items: center;  gap: 8px;}.sidebar-user {  display: flex;  align-items: center;  gap: 8px;  flex: 1;  min-width: 0;}.user-avatar {  width: 30px; height: 30px;  background: var(--accent);  border-radius: 50%;  display: flex; align-items: center; justify-content: center;  font-size: 12px; font-weight: 700; color: #fff;  flex-shrink: 0;}.user-info { min-width: 0; }.user-name { font-size: 13px; font-weight: 700; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.user-role { font-size: 11px; color: var(--text-dim); }.logout-btn {  background: none;  color: var(--text-dim);  padding: 6px;  border-radius: var(--radius-sm);  transition: all 0.15s;  flex-shrink: 0;}.logout-btn:hover { background: var(--danger-bg); color: var(--danger); }.logout-btn svg { width: 16px; height: 16px; }/* ═══════════════════ MAIN CONTENT ═══════════════════ */#main {  flex: 1;  display: flex;  flex-direction: column;  overflow: hidden;  min-width: 0;  background: var(--bg);}/* ═══════════════════ STATS BAR ═══════════════════ */#stats-bar {  display: flex;  gap: 12px;  padding: 14px 20px;  border-bottom: 1px solid var(--border);  flex-shrink: 0;  overflow-x: auto;  background: var(--bg);}.stat-card {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius);  padding: 14px 18px;  min-width: 128px;  flex-shrink: 0;  box-shadow: var(--shadow);  transition: box-shadow 0.15s;}.stat-card:hover { box-shadow: var(--shadow-md); }.stat-label {  font-size: 11px;  font-weight: 600;  color: var(--text-dim);  margin-bottom: 5px;  white-space: nowrap;  text-transform: uppercase;  letter-spacing: 0.4px;}.stat-value { font-size: 24px; font-weight: 800; color: var(--text); }.stat-value.success { color: var(--success); }.stat-value.warn { color: var(--warning); }.stat-value.danger { color: var(--danger); }/* ═══════════════════ FILTER BAR ═══════════════════ */#filter-bar {  display: flex;  align-items: center;  gap: 8px;  padding: 10px 20px;  border-bottom: 1px solid var(--border);  flex-shrink: 0;  flex-wrap: wrap;  background: #FAFAFA;}.filter-search-wrap {  position: relative;  display: flex;  align-items: center;  flex: 1;  min-width: 200px;}.filter-search-wrap svg {  position: absolute;  left: 10px;  width: 14px; height: 14px;  color: var(--text-dim);  pointer-events: none;}.filter-search-wrap input {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  color: var(--text);  padding: 7px 10px 7px 32px;  outline: none;  width: 100%;  transition: border-color 0.15s, box-shadow 0.15s;  box-shadow: var(--shadow);}.filter-search-wrap input:focus {  border-color: var(--accent);  box-shadow: 0 0 0 3px rgba(255,107,0,0.1);}.filter-search-wrap input::placeholder { color: var(--text-dim); }#filter-bar select {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  color: var(--text);  padding: 7px 10px;  outline: none;  cursor: pointer;  transition: border-color 0.15s, box-shadow 0.15s;  flex-shrink: 0;  box-shadow: var(--shadow);}#filter-bar select:focus {  border-color: var(--accent);  box-shadow: 0 0 0 3px rgba(255,107,0,0.1);}#filter-bar select option { background: #fff; color: var(--text); }.score-range {  display: flex;  align-items: center;  gap: 5px;  font-size: 12px;  font-weight: 500;  color: var(--text-sec);  flex-shrink: 0;}.score-range input {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  color: var(--text);  padding: 7px 8px;  width: 52px;  outline: none;  text-align: center;  box-shadow: var(--shadow);  transition: border-color 0.15s;}.score-range input:focus { border-color: var(--accent); }.filter-clear { flex-shrink: 0; font-size: 12px; }/* ═══════════════════ VIEW HEADER ═══════════════════ */#view-header {  display: flex;  align-items: center;  justify-content: space-between;  padding: 10px 20px;  flex-shrink: 0;  border-bottom: 1px solid var(--border);  background: var(--bg);}.lead-count {  font-size: 13px;  font-weight: 600;  color: var(--text-sec);}.view-toggle {  display: flex;  background: var(--sidebar);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  overflow: hidden;}.view-btn {  background: none;  color: var(--text-sec);  padding: 6px 18px;  font-size: 13px;  font-weight: 600;  transition: all 0.15s;}.view-btn.active { background: var(--accent); color: #fff; }.view-btn:not(.active):hover { background: #EBEBEB; color: var(--text); }/* ═══════════════════ PIPELINE VIEW ═══════════════════ */#pipeline-view {  flex: 1;  display: flex;  gap: 14px;  padding: 16px 20px 20px;  overflow-x: auto;  overflow-y: hidden;  align-items: flex-start;  background: #FAFAFA;}.pipeline-col {  min-width: 270px;  max-width: 270px;  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius);  display: flex;  flex-direction: column;  max-height: calc(100vh - 295px);  flex-shrink: 0;  box-shadow: var(--shadow);  transition: box-shadow 0.15s, border-color 0.15s;}.pipeline-col.drag-over {  border-color: var(--accent);  box-shadow: 0 0 0 2px rgba(255,107,0,0.2), var(--shadow-md);}.col-header {  display: flex;  align-items: center;  justify-content: space-between;  padding: 12px 14px;  border-bottom: 1px solid var(--border);  flex-shrink: 0;  background: #FAFAFA;  border-radius: var(--radius) var(--radius) 0 0;}.col-title {  font-size: 13px;  font-weight: 700;  color: var(--text);  display: flex;  align-items: center;  gap: 8px;}.col-dot {  width: 8px; height: 8px;  border-radius: 50%;  flex-shrink: 0;}.col-count {  font-size: 11px;  font-weight: 700;  color: var(--text-sec);  background: var(--border);  padding: 2px 8px;  border-radius: 10px;}.col-cards {  flex: 1;  overflow-y: auto;  padding: 8px;  display: flex;  flex-direction: column;  gap: 8px;}.col-empty {  text-align: center;  color: var(--text-dim);  font-size: 12px;  padding: 24px 10px;  font-style: italic;}/* Lead Card */.lead-card {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  padding: 12px 13px;  cursor: pointer;  transition: all 0.15s;  position: relative;  box-shadow: var(--shadow);}.lead-card:hover {  border-color: var(--accent-border);  box-shadow: var(--shadow-md);  transform: translateY(-1px);}.lead-card.dragging { opacity: 0.45; transform: scale(0.97) rotate(1deg); }.card-top {  display: flex;  align-items: flex-start;  justify-content: space-between;  margin-bottom: 5px;  gap: 8px;}.card-name { font-size: 13px; font-weight: 700; color: var(--text); }.card-business { font-size: 11px; color: var(--text-sec); margin-bottom: 6px; }.card-phone { font-size: 11px; color: var(--text-dim); font-family: 'SF Mono', 'Consolas', monospace; margin-bottom: 8px; }.card-meta {  display: flex;  align-items: center;  justify-content: space-between;  flex-wrap: wrap;  gap: 5px;}.card-followup {  font-size: 11px;  font-weight: 600;  padding: 2px 7px;  border-radius: 4px;}.card-followup.future { color: var(--info); background: var(--info-bg); }.card-followup.overdue { color: var(--danger); background: var(--danger-bg); }.card-followup.done { color: var(--success); background: var(--success-bg); }.card-followup.not-set { color: var(--text-dim); }.card-actions {  display: none;  gap: 4px;  margin-top: 9px;  padding-top: 9px;  border-top: 1px solid var(--border);  flex-wrap: wrap;}.lead-card:hover .card-actions { display: flex; }.card-action-btn {  background: #F5F5F5;  color: var(--text-sec);  border: 1px solid var(--border);  border-radius: 4px;  padding: 4px 8px;  font-size: 11px;  font-weight: 500;  transition: all 0.15s;}.card-action-btn:hover {  background: var(--accent-dim);  color: var(--accent);  border-color: var(--accent-border);}/* Score Dot */.score-dot {  width: 26px; height: 26px;  border-radius: 50%;  display: flex; align-items: center; justify-content: center;  font-size: 11px;  font-weight: 800;  flex-shrink: 0;}.score-hot { background: #DCFCE7; color: #15803d; border: 1.5px solid #BBF7D0; }.score-warm { background: var(--accent-dim); color: var(--accent); border: 1.5px solid var(--accent-border); }.score-cold { background: var(--danger-bg); color: var(--danger); border: 1.5px solid #FECACA; }/* Source Badge */.source-badge {  font-size: 10px;  font-weight: 700;  padding: 2px 8px;  border-radius: 10px;  text-transform: uppercase;  letter-spacing: 0.4px;  border: 1px solid transparent;}.source-facebook { background: #EFF6FF; color: #1d4ed8; border-color: #BFDBFE; }.source-instagram { background: #FDF2F8; color: #9d174d; border-color: #FBCFE8; }.source-landing_page { background: #F0FDF4; color: #15803d; border-color: #BBF7D0; }.source-whatsapp { background: #F0FDF4; color: #15803d; border-color: #BBF7D0; }.source-manual { background: #F9FAFB; color: var(--text-sec); border-color: var(--border); }/* Assigned Avatar */.assigned-avatar {  width: 22px; height: 22px;  background: var(--accent-dim);  border: 1.5px solid var(--accent-border);  border-radius: 50%;  display: flex; align-items: center; justify-content: center;  font-size: 9px;  font-weight: 800;  color: var(--accent);  flex-shrink: 0;}/* ═══════════════════ TABLE VIEW ═══════════════════ */#table-view {  flex: 1;  display: flex;  flex-direction: column;  overflow: hidden;  padding: 16px 20px 20px;  background: #FAFAFA;}.bulk-bar {  display: flex;  align-items: center;  gap: 10px;  padding: 10px 16px;  background: var(--accent-dim);  border: 1px solid var(--accent-border);  border-radius: var(--radius-sm);  margin-bottom: 12px;  font-size: 13px;  flex-wrap: wrap;}#bulk-count { font-weight: 700; color: var(--accent); }#bulk-stage-sel {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  color: var(--text);  padding: 6px 10px;  outline: none;}.table-wrap {  flex: 1;  overflow: auto;  border: 1px solid var(--border);  border-radius: var(--radius);  box-shadow: var(--shadow);  background: var(--card);}#leads-table {  width: 100%;  border-collapse: collapse;  font-size: 13px;}#leads-table thead tr {  background: #F5F5F5;  border-bottom: 2px solid var(--border);  position: sticky;  top: 0;  z-index: 1;}#leads-table th {  padding: 10px 14px;  text-align: left;  font-size: 11px;  font-weight: 700;  color: var(--text);  text-transform: uppercase;  letter-spacing: 0.5px;  white-space: nowrap;}#leads-table th.sortable { cursor: pointer; user-select: none; }#leads-table th.sortable:hover { color: var(--accent); }#leads-table th.sorted { color: var(--accent); }.sort-icon::after { content: ' ↕'; opacity: 0.35; font-size: 10px; }th.sorted.asc .sort-icon::after { content: ' ↑'; opacity: 1; }th.sorted.desc .sort-icon::after { content: ' ↓'; opacity: 1; }#leads-table tbody tr {  border-bottom: 1px solid #F0F0F0;  transition: background 0.1s;  cursor: pointer;}/* Alternating rows */#leads-table tbody tr:nth-child(even) { background: #F9F9F9; }#leads-table tbody tr:nth-child(odd) { background: var(--card); }#leads-table tbody tr:hover { background: var(--accent-dim) !important; }#leads-table tbody tr.selected { background: #FFF4EE !important; outline: none; }#leads-table td { padding: 10px 14px; vertical-align: middle; color: var(--text); }#leads-table td:first-child { width: 36px; }/* ═══════════════════ LEAD PANEL ═══════════════════ */#lead-panel {  position: fixed;  top: 0; right: 0;  width: var(--panel-w);  height: 100vh;  background: var(--card);  border-left: 1px solid var(--border);  z-index: 100;  transform: translateX(100%);  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);  display: flex;  flex-direction: column;  box-shadow: -4px 0 24px rgba(0,0,0,0.08);}#lead-panel.open { transform: translateX(0); }#lead-panel-inner {  flex: 1;  overflow-y: auto;  padding: 20px;  display: flex;  flex-direction: column;  gap: 16px;}#backdrop {  display: none;  position: fixed;  inset: 0;  background: rgba(0,0,0,0.3);  z-index: 99;  backdrop-filter: blur(2px);}#backdrop.show { display: block; }/* Panel sections */.panel-header-row {  display: flex;  align-items: flex-start;  justify-content: space-between;  gap: 12px;}.panel-close {  background: #F5F5F5;  color: var(--text-sec);  padding: 5px 8px;  border-radius: 6px;  font-size: 14px;  transition: all 0.15s;  flex-shrink: 0;  border: 1px solid var(--border);  line-height: 1;}.panel-close:hover { background: var(--danger-bg); color: var(--danger); border-color: #FECACA; }.panel-name { font-size: 20px; font-weight: 800; color: var(--text); margin-bottom: 3px; }.panel-business { font-size: 13px; color: var(--text-sec); margin-bottom: 6px; }.panel-phone {  font-size: 14px;  color: var(--info);  cursor: pointer;  font-family: 'SF Mono', 'Consolas', monospace;  font-weight: 600;  transition: opacity 0.15s;}.panel-phone:hover { opacity: 0.75; text-decoration: underline; }.panel-badges { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; }.panel-section {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius);  padding: 14px 16px;}.panel-section-title {  font-size: 10px;  font-weight: 700;  color: var(--text-dim);  text-transform: uppercase;  letter-spacing: 0.6px;  margin-bottom: 12px;}.info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.info-item label { font-size: 11px; font-weight: 600; color: var(--text-dim); display: block; margin-bottom: 2px; text-transform: uppercase; letter-spacing: 0.4px; }.info-item span { font-size: 13px; color: var(--text); }.panel-field { margin-bottom: 12px; }.panel-field:last-child { margin-bottom: 0; }.panel-field label { font-size: 11px; font-weight: 700; color: var(--text-sec); display: block; margin-bottom: 5px; text-transform: uppercase; letter-spacing: 0.4px; }.panel-input, .panel-select, .panel-textarea {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  color: var(--text);  padding: 8px 10px;  width: 100%;  outline: none;  transition: border-color 0.15s, box-shadow 0.15s;  font-family: var(--font);  font-size: 13px;}.panel-input:focus, .panel-select:focus, .panel-textarea:focus {  border-color: var(--accent);  box-shadow: 0 0 0 3px rgba(255,107,0,0.1);}.panel-select option { background: #fff; color: var(--text); }.panel-textarea { resize: vertical; min-height: 80px; line-height: 1.6; }.followup-row { display: flex; align-items: center; gap: 10px; }.followup-row input[type="date"] { flex: 1; }.followup-check { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; color: var(--text-sec); flex-shrink: 0; cursor: pointer; }.followup-check input[type="checkbox"] { width: 15px; height: 15px; cursor: pointer; accent-color: var(--accent); }.save-indicator { font-size: 11px; color: var(--text-dim); text-align: right; margin-top: 4px; height: 14px; }/* Bot answers */.bot-toggle {  background: none;  color: var(--text-sec);  font-size: 12px;  font-weight: 600;  padding: 0;  display: flex;  align-items: center;  gap: 6px;  width: 100%;  text-align: left;  text-transform: uppercase;  letter-spacing: 0.4px;}.bot-toggle:hover { color: var(--accent); }.bot-content { margin-top: 10px; display: none; }.bot-content.open { display: block; }.bot-row { display: flex; gap: 10px; margin-bottom: 6px; padding: 6px 8px; background: #FAFAFA; border-radius: 4px; font-size: 12px; }.bot-key { color: var(--text-sec); font-weight: 600; min-width: 110px; }.bot-val { color: var(--text); }/* Activity Log */.activity-item {  display: flex;  gap: 12px;  padding: 8px 0;  border-bottom: 1px solid #F5F5F5;  font-size: 12px;}.activity-item:last-child { border-bottom: none; }.activity-dot {  width: 8px; height: 8px;  border-radius: 50%;  background: var(--accent);  margin-top: 4px;  flex-shrink: 0;}.activity-action { font-weight: 700; color: var(--text); margin-bottom: 2px; }.activity-detail { color: var(--text-sec); }.activity-time { font-size: 11px; color: var(--text-dim); margin-top: 2px; }/* Panel Actions */.panel-actions { display: flex; gap: 8px; flex-wrap: wrap; padding-top: 4px; }/* Score slider */.score-edit-wrap { display: flex; align-items: center; gap: 12px; }.score-edit-wrap input[type="range"] { flex: 1; accent-color: var(--accent); }.score-edit-val { font-size: 16px; font-weight: 800; width: 26px; text-align: center; }/* ═══════════════════ BUTTONS ═══════════════════ */.btn-primary {  background: var(--accent);  color: #fff;  border-radius: var(--radius-sm);  padding: 9px 16px;  font-weight: 700;  display: flex;  align-items: center;  justify-content: center;  gap: 6px;  transition: all 0.15s;  box-shadow: 0 2px 6px rgba(255,107,0,0.25);}.btn-primary:hover {  background: #E05E00;  box-shadow: 0 4px 12px rgba(255,107,0,0.35);  transform: translateY(-1px);}.btn-primary:active { transform: translateY(0); }.btn-secondary {  background: var(--accent-dim);  color: var(--accent);  border: 1px solid var(--accent-border);  border-radius: var(--radius-sm);  padding: 8px 14px;  font-weight: 600;  transition: all 0.15s;}.btn-secondary:hover { background: #FFE8D6; border-color: var(--accent); }.btn-ghost {  background: var(--card);  color: var(--text-sec);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  padding: 8px 14px;  font-weight: 500;  transition: all 0.15s;}.btn-ghost:hover { background: #F5F5F5; border-color: var(--border-strong); color: var(--text); }.btn-danger {  background: var(--danger-bg);  color: var(--danger);  border: 1px solid #FECACA;  border-radius: var(--radius-sm);  padding: 8px 14px;  font-weight: 600;  transition: all 0.15s;}.btn-danger:hover { background: #FEE2E2; border-color: #FCA5A5; }.btn-success {  background: var(--success-bg);  color: var(--success);  border: 1px solid #BBF7D0;  border-radius: var(--radius-sm);  padding: 8px 14px;  font-weight: 600;  transition: all 0.15s;}.btn-success:hover { background: #DCFCE7; border-color: #86EFAC; }.btn-full { width: 100%; justify-content: center; }.btn-sm { padding: 6px 12px; font-size: 12px; }/* ═══════════════════ FORMS ═══════════════════ */.form-group { display: flex; flex-direction: column; gap: 5px; }.form-group label {  font-size: 12px;  font-weight: 700;  color: var(--text-sec);  text-transform: uppercase;  letter-spacing: 0.4px;}.form-group input, .form-group select, .form-group textarea {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  color: var(--text);  padding: 8px 10px;  outline: none;  transition: border-color 0.15s, box-shadow 0.15s;}.form-group input::placeholder, .form-group textarea::placeholder { color: var(--text-dim); }.form-group input:focus, .form-group select:focus, .form-group textarea:focus {  border-color: var(--accent);  box-shadow: 0 0 0 3px rgba(255,107,0,0.1);}.form-group select option { background: #fff; color: var(--text); }.form-group textarea { resize: vertical; line-height: 1.5; }.form-row { display: flex; gap: 12px; }.form-row .form-group { flex: 1; }/* ═══════════════════ MODALS ═══════════════════ */.modal-overlay {  position: fixed;  inset: 0;  background: rgba(0,0,0,0.35);  z-index: 200;  display: flex;  align-items: center;  justify-content: center;  padding: 20px;  backdrop-filter: blur(3px);}.modal-card {  background: var(--card);  border: 1px solid var(--border);  border-radius: 14px;  padding: 28px;  width: 100%;  max-width: 560px;  max-height: 90vh;  overflow-y: auto;  box-shadow: var(--shadow-lg);}.modal-sm { max-width: 400px; }.modal-header {  display: flex;  align-items: center;  justify-content: space-between;  margin-bottom: 22px;  padding-bottom: 16px;  border-bottom: 1px solid var(--border);}.modal-header h2 { font-size: 17px; font-weight: 800; color: var(--text); }.modal-close {  background: #F5F5F5;  color: var(--text-sec);  font-size: 15px;  padding: 4px 8px;  border-radius: 6px;  border: 1px solid var(--border);  transition: all 0.15s;  line-height: 1;}.modal-close:hover { background: var(--danger-bg); color: var(--danger); border-color: #FECACA; }.modal-actions {  display: flex;  justify-content: flex-end;  gap: 10px;  margin-top: 22px;  padding-top: 16px;  border-top: 1px solid var(--border);}.modal-hint { font-size: 13px; color: var(--text-sec); margin-bottom: 16px; line-height: 1.7; }.modal-hint strong { color: var(--text); font-weight: 700; }.confirm-msg { font-size: 14px; color: var(--text-sec); margin-bottom: 6px; line-height: 1.7; }/* Upload Zone */.upload-zone {  border: 2px dashed var(--border-strong);  border-radius: var(--radius);  padding: 36px;  text-align: center;  color: var(--text-sec);  transition: all 0.15s;  margin-bottom: 12px;  background: #FAFAFA;}.upload-zone:hover { border-color: var(--accent); background: var(--accent-dim); }.upload-zone svg { margin: 0 auto 12px; color: var(--text-dim); }.upload-zone p { font-size: 14px; line-height: 1.8; color: var(--text-sec); }.upload-browse { color: var(--accent); cursor: pointer; font-weight: 700; }.upload-browse:hover { text-decoration: underline; }#upload-file { display: none; }.upload-filename { font-size: 12px; color: var(--accent); font-weight: 700; margin-top: 4px; }/* Message modal — WhatsApp composer */.message-recipient {  background: var(--success-bg);  border: 1px solid #BBF7D0;  border-radius: var(--radius-sm);  padding: 10px 14px;  margin-bottom: 14px;  font-size: 13px;  font-weight: 600;  color: var(--success);}/* ═══════════════════ TOAST ═══════════════════ */#toast {  position: fixed;  bottom: 24px;  right: 24px;  z-index: 999;  display: flex;  flex-direction: column;  gap: 8px;  pointer-events: none;}.toast-item {  background: var(--card);  border: 1px solid var(--border);  border-radius: var(--radius-sm);  padding: 12px 18px;  font-size: 13px;  font-weight: 600;  color: var(--text);  max-width: 340px;  box-shadow: var(--shadow-lg);  animation: slideUp 0.2s ease-out;}.toast-item.success { border-left: 3px solid var(--success); background: var(--success-bg); color: var(--success); }.toast-item.error { border-left: 3px solid var(--danger); background: var(--danger-bg); color: var(--danger); }.toast-item.info { border-left: 3px solid var(--info); background: var(--info-bg); color: var(--info); }@keyframes slideUp {  from { opacity: 0; transform: translateY(12px); }  to { opacity: 1; transform: translateY(0); }}/* ═══════════════════ UTILS ═══════════════════ */.hidden { display: none !important; }
/* ═══════════════════ GOALS VIEW ═══════════════════ */
#goals-view {
  flex: 1;
  overflow-y: auto;
  background: #FFFFFF;
}

.gv-scroller { min-height: 100%; padding: 24px; }

.gv-container {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Hero */
.gv-hero {
  background: linear-gradient(135deg, #FFF4EE, #FFF8F4);
  border: 1px solid #FFD9B8;
  border-radius: 16px;
  padding: 28px 32px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 32px;
  align-items: center;
}

.gv-hero-badge {
  font-size: 11px;
  font-weight: 800;
  color: #FF6B00;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.gv-hero-title {
  font-size: 26px;
  font-weight: 900;
  color: #0A0A0A;
  line-height: 1.1;
  margin-bottom: 6px;
}

.gv-hero-period { font-size: 13px; color: #666666; font-weight: 500; }

.gv-hero-countdown {
  text-align: center;
  background: rgba(255,107,0,0.06);
  border: 1px solid rgba(255,107,0,0.25);
  border-radius: 12px;
  padding: 20px 32px;
  flex-shrink: 0;
}

.gv-cd-num {
  font-size: 64px;
  font-weight: 900;
  color: #FF6B00;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.gv-cd-label {
  font-size: 10px;
  font-weight: 800;
  color: #FF6B00;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-top: 4px;
}

.gv-cd-sub { font-size: 12px; color: #777777; margin-top: 6px; }

.gv-hero-progress { display: flex; flex-direction: column; gap: 8px; }

.gv-hp-label {
  font-size: 10px;
  font-weight: 700;
  color: #777777;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.gv-hp-bar {
  background: #E5E5E5;
  border-radius: 6px;
  height: 10px;
  overflow: hidden;
  border: 1px solid #D5D5D5;
}

.gv-hp-fill {
  height: 100%;
  background: linear-gradient(90deg, #FF6B00, #FF8C42);
  border-radius: 6px;
  transition: width 0.5s ease;
}

.gv-hp-pct { font-size: 11px; color: #666666; font-weight: 500; }

/* Overall */
.gv-overall-card {
  background: #F5F5F5;
  border: 1px solid #E5E5E5;
  border-radius: 12px;
  padding: 20px 28px;
  display: flex;
  align-items: center;
  gap: 24px;
}

.gv-oc-label {
  font-size: 10px;
  font-weight: 800;
  color: #777777;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  white-space: nowrap;
  min-width: 160px;
}

.gv-oc-body { flex: 1; display: flex; align-items: center; gap: 20px; }

.gv-oc-pct {
  font-size: 44px;
  font-weight: 900;
  color: #FF6B00;
  min-width: 100px;
  font-variant-numeric: tabular-nums;
}

.gv-oc-bar-wrap {
  flex: 1;
  background: #E5E5E5;
  border-radius: 8px;
  height: 16px;
  overflow: hidden;
  border: 1px solid #D5D5D5;
}

.gv-oc-bar {
  height: 100%;
  background: linear-gradient(90deg, #FF6B00, #FF8C42);
  border-radius: 8px;
  transition: width 0.5s ease;
}

/* Goal Cards */
.gv-goals-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.gv-goal-card {
  background: #F5F5F5;
  border: 1px solid #E5E5E5;
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.gv-goal-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #FF6B00, #FF8C42);
}

.gv-goal-card:hover { border-color: #FF6B00; box-shadow: 0 4px 16px rgba(255,107,0,0.1); }

.gvc-icon { font-size: 28px; line-height: 1; }

.gvc-label {
  font-size: 11px;
  font-weight: 700;
  color: #777777;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  line-height: 1.4;
}

.gvc-count-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.gvc-count {
  font-size: 48px;
  font-weight: 900;
  color: #0A0A0A;
  line-height: 1;
  flex: 1;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.gvc-target { font-size: 20px; font-weight: 600; color: #AAAAAA; }

.gvc-minus, .gvc-plus {
  width: 36px; height: 36px;
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 8px;
  color: #0A0A0A;
  font-size: 20px;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.15s;
  flex-shrink: 0;
  cursor: pointer;
}

.gvc-minus:hover { background: #FEE2E2; border-color: #FCA5A5; color: #DC2626; }
.gvc-plus:hover { background: #FF6B00; border-color: #FF6B00; color: #fff; }

.gvc-bar-wrap {
  background: #E5E5E5;
  border-radius: 6px;
  height: 10px;
  overflow: hidden;
  border: 1px solid #D5D5D5;
}

.gvc-bar {
  height: 100%;
  background: linear-gradient(90deg, #FF6B00, #FF8C42);
  border-radius: 6px;
  transition: width 0.4s ease;
}

.gvc-stats {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.gvc-pct { font-size: 22px; font-weight: 900; color: #FF6B00; }

.gvc-revenue { font-size: 12px; font-weight: 700; color: #FF8C42; text-align: right; }

.gvc-unit-price { font-size: 11px; color: #AAAAAA; font-weight: 500; }

/* Bottom grid */
.gv-bottom-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding-bottom: 24px;
}

.gv-leads-card, .gv-budget-card {
  background: #F5F5F5;
  border: 1px solid #E5E5E5;
  border-radius: 14px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.gv-card-title {
  font-size: 10px;
  font-weight: 800;
  color: #FF6B00;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding-bottom: 12px;
  border-bottom: 1px solid #E5E5E5;
}

/* Leads sources */
.gv-leads-sources { display: flex; flex-direction: column; gap: 10px; }

.gv-lead-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0;
}

.gv-lead-source-label { font-size: 14px; font-weight: 600; color: #0A0A0A; }

.gv-lead-source-ctrl { display: flex; align-items: center; gap: 10px; }

.gvc-minus-sm, .gvc-plus-sm {
  width: 30px; height: 30px;
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 6px;
  color: #0A0A0A;
  font-size: 18px;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all 0.15s;
}

.gvc-minus-sm:hover { background: #FEE2E2; border-color: #FCA5A5; color: #DC2626; }
.gvc-plus-sm:hover { background: #FF6B00; border-color: #FF6B00; color: #fff; }

.gv-lead-num {
  font-size: 22px;
  font-weight: 900;
  color: #0A0A0A;
  min-width: 40px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.gv-leads-live {
  display: flex;
  align-items: center;
  background: rgba(255,107,0,0.06);
  border: 1px solid rgba(255,107,0,0.2);
  border-radius: 10px;
  padding: 14px 20px;
}

.gv-live-stat { flex: 1; text-align: center; }

.gv-live-num {
  font-size: 40px;
  font-weight: 900;
  color: #FF6B00;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.gv-live-label {
  font-size: 11px;
  color: #777777;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-top: 6px;
}

.gv-live-divider { width: 1px; height: 44px; background: #E5E5E5; margin: 0 10px; flex-shrink: 0; }

/* Budget */
.gv-budget-rows { display: flex; flex-direction: column; gap: 12px; }

.gv-budget-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #E5E5E5;
}

.gv-budget-row:last-child { border-bottom: none; }

.gvb-label { font-size: 13px; font-weight: 600; color: #666666; }

.gvb-value { font-size: 18px; font-weight: 800; color: #0A0A0A; font-variant-numeric: tabular-nums; }

.gvb-total { color: #FF6B00 !important; font-size: 22px !important; }

.gvb-cpl { color: #FF8C42 !important; font-size: 22px !important; }

.gvb-edit { flex: 1; display: flex; justify-content: flex-end; }

.gvb-input {
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 8px;
  color: #0A0A0A;
  padding: 8px 12px;
  font-size: 15px;
  font-weight: 700;
  width: 180px;
  text-align: right;
  outline: none;
  font-family: var(--font);
  transition: border-color 0.15s;
  font-variant-numeric: tabular-nums;
}

.gvb-input:focus { border-color: #FF6B00; box-shadow: 0 0 0 2px rgba(255,107,0,0.12); }

.gvb-bar-row { display: flex; flex-direction: column; gap: 4px; width: 100%; }

.gvb-bar-wrap {
  background: #E5E5E5;
  border-radius: 6px;
  height: 8px;
  overflow: hidden;
  border: 1px solid #D5D5D5;
}

.gvb-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #FF6B00, #FF8C42);
  border-radius: 6px;
  transition: width 0.4s ease;
}

.gvb-bar-pct { font-size: 10px; color: #777777; font-weight: 600; text-align: right; }

.gvb-highlight {
  background: rgba(255,107,0,0.05);
  border-radius: 8px;
  padding: 12px 14px !important;
  border: 1px solid rgba(255,107,0,0.15) !important;
  margin-top: 4px;
}

/* Tabs */
.gv-tabs {
  display: flex;
  gap: 4px;
  background: #F5F5F5;
  border: 1px solid #E5E5E5;
  border-radius: 12px;
  padding: 6px;
}

.gv-tab {
  flex: 1;
  background: transparent;
  color: #777777;
  border: none;
  border-radius: 8px;
  padding: 12px 10px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.15s;
  text-align: center;
  white-space: nowrap;
}

.gv-tab:hover { color: #0A0A0A; background: #EBEBEB; }

.gv-tab.active {
  background: #FF6B00;
  color: #fff;
  box-shadow: 0 2px 8px rgba(255,107,0,0.3);
}

.gv-tab-pane {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 24px;
}

/* Tab card wrapper */
.gv-tab-card {
  background: #F5F5F5;
  border: 1px solid #E5E5E5;
  border-radius: 14px;
  padding: 22px;
}

/* Leads tab */
.gv-leads-inner { display: flex; flex-direction: column; gap: 16px; }

.gv-leads-sources-wrap { background: #F5F5F5; border: 1px solid #E5E5E5; border-radius: 14px; padding: 22px; }

/* Clients tab */
.gv-clients-inner { display: flex; flex-direction: column; gap: 16px; }

.gv-acf-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr auto;
  gap: 10px;
  margin-top: 14px;
  align-items: center;
}

.gv-acf-grid input, .gv-acf-grid select {
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 8px;
  color: #0A0A0A;
  padding: 9px 12px;
  font-size: 13px;
  font-family: var(--font);
  outline: none;
  transition: border-color 0.15s;
}

.gv-acf-grid input:focus, .gv-acf-grid select:focus {
  border-color: #FF6B00;
  box-shadow: 0 0 0 3px rgba(255,107,0,0.1);
}

.gv-add-client-btn {
  background: #FF6B00;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s;
  box-shadow: 0 2px 8px rgba(255,107,0,0.25);
}

.gv-add-client-btn:hover { background: #e05e00; transform: translateY(-1px); }

.gv-clients-empty {
  color: #777777;
  font-size: 14px;
  text-align: center;
  padding: 32px;
  background: #F5F5F5;
  border: 1px solid #E5E5E5;
  border-radius: 14px;
}

/* Clients table */
.gv-clients-table {
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 14px;
  overflow: hidden;
}

.gvct-header, .gvct-row, .gvct-footer {
  display: grid;
  grid-template-columns: 2fr 1.5fr 1.2fr 1.2fr auto;
  gap: 12px;
  padding: 12px 20px;
  align-items: center;
}

.gvct-header {
  background: #F5F5F5;
  font-size: 10px;
  font-weight: 800;
  color: #777777;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-bottom: 1px solid #E5E5E5;
}

.gvct-row {
  border-bottom: 1px solid #F0F0F0;
  transition: background 0.1s;
}

.gvct-row:last-of-type { border-bottom: none; }
.gvct-row:hover { background: #FAFAFA; }

.gvct-name { font-size: 14px; font-weight: 700; color: #0A0A0A; }
.gvct-svc  { font-size: 13px; font-weight: 700; }
.gvct-amt  { font-size: 14px; font-weight: 800; color: #FF6B00; font-variant-numeric: tabular-nums; }
.gvct-date { font-size: 12px; color: #777777; }

.gvct-del {
  background: #F5F5F5;
  border: 1px solid #E5E5E5;
  color: #AAAAAA;
  border-radius: 6px;
  width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  transition: all 0.15s;
}

.gvct-del:hover { background: #FEE2E2; border-color: #FCA5A5; color: #DC2626; }

.gvct-footer {
  background: #FFF4EE;
  border-top: 1px solid #FFD9B8;
  font-size: 13px;
  font-weight: 700;
}

.gvct-total { color: #FF6B00; font-size: 16px; font-variant-numeric: tabular-nums; }