/* ==================== RGO HQ — Redesigned Command Center ==================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  --bg-0: #08090c;
  --bg-1: #0f1219;
  --bg-2: #151921;
  --bg-3: #1c2230;
  --bg-hover: #242b3a;
  --border: rgba(255,255,255,0.06);
  --border-subtle: rgba(255,255,255,0.04);
  --border-active: rgba(255,255,255,0.12);
  --text-primary: #fafafa;
  --text-secondary: #a1a1aa;
  --text-tertiary: #71717a;
  --text-muted: #52525b;
  --accent: #6366f1;
  --accent-hover: #818cf8;
  --accent-subtle: rgba(99,102,241,0.12);
  --accent-gradient: linear-gradient(135deg, #6366f1, #8b5cf6);
  --green: #22c55e;
  --green-subtle: rgba(34,197,94,0.12);
  --red: #ef4444;
  --red-subtle: rgba(239,68,68,0.12);
  --amber: #f59e0b;
  --amber-subtle: rgba(245,158,11,0.12);
  --blue: #3b82f6;
  --blue-subtle: rgba(59,130,246,0.12);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.4);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.5);
  --shadow-glow: 0 0 40px rgba(99,102,241,0.08);
  --shadow-card: 0 2px 8px rgba(0,0,0,0.3);
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
  --transition: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --sidebar-width: 220px;
  --sidebar-collapsed: 64px;
  --header-height: 52px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: var(--font-sans);
  background: var(--bg-0);
  color: var(--text-primary);
  line-height: 1.5;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: flex;
  min-height: 100vh;
}

/* ==================== SIDEBAR ==================== */
.sidebar {
  width: var(--sidebar-width);
  background: var(--bg-1);
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 200;
  transition: width 200ms ease;
  overflow: hidden;
}
.sidebar.collapsed { width: var(--sidebar-collapsed); }
.sidebar.collapsed .logo-text,
.sidebar.collapsed .nav-label,
.sidebar.collapsed .status-label,
.sidebar.collapsed .sidebar-time { display: none; }
.sidebar.collapsed .sidebar-toggle svg { transform: rotate(180deg); }
.sidebar.collapsed .sidebar-logo { justify-content: center; }
.sidebar.collapsed .tab-btn { justify-content: center; padding: 10px 0; }
.sidebar.collapsed .sidebar-status { align-items: center; justify-content: center; }
.sidebar.collapsed .status-indicator { justify-content: center; }

.sidebar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px 12px;
  flex-shrink: 0;
}
.sidebar-logo {
  display: flex;
  align-items: center;
  gap: 10px;
}
.logo-icon {
  font-size: 20px;
  color: var(--accent);
  flex-shrink: 0;
}
.logo-text {
  font-size: 17px;
  font-weight: 800;
  color: var(--text-primary);
  letter-spacing: -0.5px;
  white-space: nowrap;
}
.logo-accent { color: var(--accent); margin-left: 1px; }

.sidebar-toggle {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  padding: 4px;
  border-radius: var(--radius-sm);
  transition: all var(--transition);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sidebar-toggle:hover { color: var(--text-primary); background: var(--bg-3); }
.sidebar-toggle svg { transition: transform 200ms ease; }

.sidebar-nav {
  flex: 1;
  padding: 4px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow-y: auto;
}

.nav-divider {
  height: 1px;
  background: var(--border);
  margin: 8px 8px;
}

/* Tab buttons (sidebar nav items) */
.tab-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: none;
  border: none;
  border-left: 3px solid transparent;
  color: var(--text-tertiary);
  font-size: 13px;
  font-weight: 500;
  font-family: var(--font-sans);
  cursor: pointer;
  transition: all var(--transition);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  white-space: nowrap;
  text-align: left;
  width: 100%;
}
.tab-btn:hover {
  color: var(--text-secondary);
  background: rgba(255,255,255,0.03);
}
.tab-btn.active {
  color: var(--text-primary);
  background: rgba(99,102,241,0.08);
  border-left-color: var(--accent);
}
.nav-icon {
  flex-shrink: 0;
  opacity: 0.6;
}
.tab-btn.active .nav-icon { opacity: 1; }
.tab-btn:hover .nav-icon { opacity: 0.85; }
.nav-label { white-space: nowrap; }

.sidebar-bottom {
  padding: 12px 16px;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
.sidebar-status {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sidebar-time {
  font-size: 11px;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ==================== APP LAYOUT ==================== */
.app-layout {
  margin-left: var(--sidebar-width);
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-width: 0;
  max-width: calc(100vw - var(--sidebar-width));
  overflow-x: hidden;
  transition: margin-left 200ms ease;
}
.app-layout.sidebar-collapsed { margin-left: var(--sidebar-collapsed); max-width: calc(100vw - var(--sidebar-collapsed)); }

/* ==================== HEADER ==================== */
.header {
  background: var(--bg-0);
  padding: 0 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--header-height);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 100;
  flex-shrink: 0;
}
.header-left { display: flex; align-items: center; }
.page-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
}
.header-right {
  display: flex;
  align-items: center;
  gap: 16px;
}

.status-indicator {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-tertiary);
}
.status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.status-dot.online {
  background: var(--green);
  box-shadow: 0 0 6px rgba(34,197,94,0.5);
  animation: pulse-dot 3s ease-in-out infinite;
}
@keyframes pulse-dot {
  0%, 100% { box-shadow: 0 0 6px rgba(34,197,94,0.5); }
  50% { box-shadow: 0 0 12px rgba(34,197,94,0.8); }
}

.current-time {
  color: var(--text-tertiary);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.user-badge {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-secondary);
  background: var(--bg-2);
  padding: 4px 10px 4px 4px;
  border-radius: 20px;
}
.user-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--accent-gradient);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
}

/* ==================== MAIN CONTENT ==================== */
.main {
  padding: 24px 28px;
  flex: 1;
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  max-width: 100%;
}
.tab-content {
  display: none;
  animation: fadeInTab 0.25s ease;
}
.tab-content.active { display: block; }

@keyframes fadeInTab {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ==================== KANBAN BOARD ==================== */
.kanban-container { padding: 0; }
.kanban-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0 16px;
  flex-wrap: wrap;
  gap: 12px;
}
.kanban-person-tabs {
  display: flex;
  gap: 4px;
  background: var(--bg-2);
  padding: 3px;
  border-radius: var(--radius-md);
}
.kanban-person-btn {
  padding: 7px 16px;
  border-radius: 9px;
  border: none;
  background: transparent;
  color: var(--text-tertiary);
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  font-family: var(--font-sans);
  transition: all var(--transition);
}
.kanban-person-btn:hover { color: var(--text-primary); }
.kanban-person-btn.active {
  background: var(--bg-3);
  color: var(--text-primary);
  box-shadow: var(--shadow-sm);
}

.kanban-controls { display: flex; align-items: center; gap: 8px; }
.kanban-last-updated { color: var(--text-muted); font-size: 12px; }
.kanban-refresh-btn, .kanban-ai-btn {
  padding: 6px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--bg-2);
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
  font-family: var(--font-sans);
  transition: all var(--transition);
}
.kanban-refresh-btn:hover, .kanban-ai-btn:hover {
  border-color: var(--border-active);
  color: var(--text-primary);
}
.kanban-ai-btn {
  border-color: rgba(139,92,246,0.25);
  color: #c4b5fd;
}
.kanban-ai-btn:hover { background: rgba(139,92,246,0.1); color: #e9d5ff; }
.kanban-ai-btn.loading { opacity: 0.5; pointer-events: none; }

.kanban-board {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 16px;
  min-height: 400px;
  align-items: flex-start;
}
.kanban-board::-webkit-scrollbar { height: 6px; }
.kanban-board::-webkit-scrollbar-track { background: transparent; }
.kanban-board::-webkit-scrollbar-thumb { background: var(--bg-hover); border-radius: 3px; }

.kanban-column {
  min-width: 260px;
  max-width: 310px;
  flex: 0 0 260px;
  background: var(--bg-1);
  border-radius: var(--radius-lg);
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 180px);
  transition: border-color var(--transition), background var(--transition);
}
.kanban-column-header {
  padding: 14px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  background: var(--bg-1);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  z-index: 1;
  border-bottom: 1px solid var(--border);
}
.kanban-column-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.kanban-column-count {
  background: var(--bg-3);
  color: var(--text-muted);
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 10px;
  min-width: 24px;
  text-align: center;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.kanban-column-cards {
  padding: 8px;
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 60px;
}
.kanban-column-cards::-webkit-scrollbar { width: 3px; }
.kanban-column-cards::-webkit-scrollbar-thumb { background: var(--bg-hover); border-radius: 2px; }

.kanban-card {
  background: var(--bg-2);
  border-radius: var(--radius-md);
  padding: 14px;
  cursor: grab;
  transition: all 200ms ease;
  border-left: 3px solid var(--accent);
  font-size: 12px;
  box-shadow: var(--shadow-card);
}
.kanban-card:hover {
  transform: scale(1.02);
  box-shadow: var(--shadow-md), 0 0 20px rgba(99,102,241,0.08);
  background: var(--bg-3);
}
.kanban-card:active { cursor: grabbing; }
.kanban-card.urgency-critical { border-left-color: var(--red); }
.kanban-card.urgency-high { border-left-color: var(--amber); }
.kanban-card.urgency-medium { border-left-color: var(--blue); }
.kanban-card.urgency-low { border-left-color: var(--green); }

.kanban-card-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 2px;
  line-height: 1.3;
}
.kanban-card-address { font-size: 11px; color: var(--text-muted); margin-bottom: 6px; }
.kanban-card-summary {
  font-size: 11px;
  color: var(--text-tertiary);
  line-height: 1.5;
  margin-bottom: 6px;
  max-height: 58px;
  overflow: hidden;
}
.kanban-card-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
  color: var(--text-muted);
  gap: 4px;
  flex-wrap: wrap;
}
.kanban-card-badge {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.badge-critical { background: var(--red-subtle); color: #fca5a5; }
.badge-high { background: var(--amber-subtle); color: #fcd34d; }
.badge-medium { background: var(--blue-subtle); color: #93c5fd; }
.badge-low { background: var(--green-subtle); color: #86efac; }

.kanban-card-financials {
  font-size: 11px;
  color: #fcd34d;
  margin-bottom: 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.kanban-card-actions-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background: var(--accent-subtle);
  color: #a5b4fc;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 600;
}
.kanban-card-people { display: flex; gap: 3px; margin-top: 6px; }
.kanban-person-avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--bg-3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 700;
  color: var(--accent);
  border: 1px solid var(--border);
}
.kanban-card-recommendation {
  font-size: 11px;
  color: var(--amber);
  background: var(--amber-subtle);
  border-radius: var(--radius-sm);
  padding: 6px 8px;
  margin: 6px 0 4px;
  line-height: 1.4;
}
.kanban-card-expand-btn {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 11px;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
  transition: all var(--transition);
}
.kanban-card-expand-btn:hover {
  background: var(--accent-subtle);
  color: var(--accent);
}

.kanban-empty {
  text-align: center;
  padding: 24px 12px;
  color: var(--text-muted);
  font-size: 13px;
}
.kanban-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px;
  color: var(--text-secondary);
  gap: 12px;
  width: 100%;
}
.kanban-wa-offline {
  text-align: center;
  padding: 40px;
  color: var(--text-muted);
}
.kanban-wa-offline .offline-icon { font-size: 48px; margin-bottom: 12px; }

/* Drag & drop */
.kanban-card.sortable-ghost { opacity: 0.3; }
.kanban-card.sortable-drag {
  transform: rotate(1deg) scale(1.04);
  box-shadow: var(--shadow-lg);
  z-index: 1000;
}
.kanban-card.sortable-chosen {
  box-shadow: 0 4px 16px rgba(99,102,241,0.2);
}
.kanban-column.drag-over {
  border: 1px dashed var(--accent);
  background: rgba(99,102,241,0.03);
}

/* ==================== CARD DETAIL MODAL ==================== */
.card-detail-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.8);
  backdrop-filter: blur(4px);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn 0.15s ease;
}
.card-detail-panel {
  background: var(--bg-2);
  border-radius: var(--radius-xl);
  max-width: 560px;
  width: 90%;
  max-height: 80vh;
  overflow-y: auto;
  padding: 28px;
  box-shadow: var(--shadow-lg);
}
.card-detail-panel h2 { color: var(--text-primary); margin: 0 0 8px; font-size: 20px; font-weight: 700; }
.card-detail-panel .detail-address { color: var(--text-muted); font-size: 13px; margin-bottom: 16px; }
.card-detail-panel .detail-summary { color: var(--text-secondary); font-size: 14px; line-height: 1.7; margin-bottom: 16px; }
.card-detail-section { margin-bottom: 16px; }
.card-detail-section h4 {
  color: var(--accent);
  font-size: 11px;
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  font-weight: 600;
}
.card-detail-section ul { list-style: none; padding: 0; }
.card-detail-section li {
  color: var(--text-secondary);
  font-size: 13px;
  padding: 5px 0;
  border-bottom: 1px solid var(--border-subtle);
}
.card-detail-section li::before { content: '→'; color: var(--accent); margin-right: 8px; }
.card-detail-close {
  position: absolute;
  top: 16px;
  right: 16px;
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 20px;
  cursor: pointer;
  transition: color var(--transition);
}
.card-detail-close:hover { color: var(--text-primary); }

/* ==================== PRIORITY BAR ==================== */
.priority-bar {
  background: var(--bg-1);
  border-radius: var(--radius-lg);
  padding: 12px 16px;
  margin-bottom: 16px;
}
.priority-bar-title { font-size: 12px; font-weight: 600; color: var(--red); }
.priority-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.priority-chip {
  background: var(--bg-2);
  border-radius: var(--radius-sm);
  padding: 6px 12px;
  font-size: 12px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all var(--transition);
  border: 1px solid transparent;
}
.priority-chip:hover { border-color: var(--border-active); background: var(--bg-3); }
.priority-chip strong { color: var(--text-primary); }
.chip-sub { color: var(--text-muted); font-size: 10px; margin-left: 4px; }
.priority-chip-urgent { border-left: 2px solid var(--red); }
.priority-chip-idle { border-left: 2px solid var(--amber); }
.priority-chip-action { border-left: 2px solid var(--blue); }
.priority-chip-detail {
  display: none;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--border);
}
.priority-chip.expanded .priority-chip-detail { display: block; }
.priority-chip.expanded { background: var(--bg-3); border-color: rgba(99,102,241,0.2); }
.chip-action { font-size: 11px; color: var(--accent); padding: 2px 0; }

.nova-alert-btn {
  background: var(--accent-subtle);
  color: var(--accent);
  border: 1px solid rgba(99,102,241,0.2);
  border-radius: var(--radius-sm);
  padding: 4px 12px;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--font-sans);
  transition: all var(--transition);
}
.nova-alert-btn:hover { background: rgba(99,102,241,0.2); }
.nova-alert-btn:disabled { opacity: 0.5; cursor: default; }

/* ==================== NOVA TASK PANEL ==================== */
.nova-task-panel {
  background: var(--bg-1);
  border-radius: var(--radius-lg);
  padding: 14px 16px;
  margin-bottom: 12px;
}
.task-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.task-panel-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 8px;
}
.task-nova-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent-gradient);
  box-shadow: 0 0 6px rgba(139,92,246,0.4);
  animation: pulse-dot 3s ease-in-out infinite;
}
.task-panel-counts { display: flex; gap: 8px; }
.task-count { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 4px; }
.task-count-pending { background: var(--amber-subtle); color: var(--amber); }
.task-count-progress { background: var(--blue-subtle); color: var(--blue); }
.task-count-done { background: var(--green-subtle); color: var(--green); }

.task-list { display: flex; flex-direction: column; gap: 4px; }
.task-item {
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--transition);
  border-left: 2px solid transparent;
}
.task-item:hover { background: var(--bg-2); }
.task-pending { border-left-color: var(--amber); }
.task-in_progress { border-left-color: var(--blue); }
.task-completed { border-left-color: var(--green); opacity: 0.7; }
.task-blocked { border-left-color: var(--red); }

.task-item-main { display: flex; align-items: flex-start; gap: 8px; }
.task-status-icon { font-size: 14px; flex-shrink: 0; margin-top: 1px; }
.task-item-info { flex: 1; min-width: 0; }
.task-item-title { font-size: 12px; font-weight: 600; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.task-item-update { font-size: 11px; color: var(--text-tertiary); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.task-item-time { font-size: 10px; color: var(--text-muted); white-space: nowrap; flex-shrink: 0; }

.task-item-detail {
  display: none;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
  font-size: 11px;
  color: var(--text-tertiary);
}
.task-item-detail.expanded { display: block; }
.task-update-entry { padding: 3px 0; display: flex; gap: 8px; }
.task-update-time { color: var(--text-muted); flex-shrink: 0; min-width: 55px; }

/* ==================== NOVA POPUP ==================== */
.nova-popup {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 10000;
  width: 380px;
  background: var(--bg-2);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg), var(--shadow-glow);
  transform: translateY(-20px);
  opacity: 0;
  transition: transform 0.3s ease, opacity 0.3s ease;
  overflow: hidden;
}
.nova-popup.visible { transform: translateY(0); opacity: 1; }
.nova-popup-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: var(--bg-3);
  border-bottom: 1px solid var(--border);
}
.nova-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--accent-gradient);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: #fff;
  font-size: 14px;
  flex-shrink: 0;
}
.nova-popup-title { font-size: 14px; font-weight: 600; color: var(--text-primary); }
.nova-popup-subtitle { font-size: 11px; color: var(--text-muted); margin-top: 1px; }
.nova-popup-close { background: none; border: none; color: var(--text-muted); font-size: 18px; cursor: pointer; margin-left: auto; padding: 0 4px; }
.nova-popup-close:hover { color: var(--text-primary); }
.nova-popup-body { padding: 14px 16px; }
.nova-item-name { font-size: 16px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
.nova-popup-reason { font-size: 11px; color: var(--amber); background: var(--amber-subtle); padding: 2px 8px; border-radius: 4px; display: inline-block; margin-bottom: 8px; font-weight: 500; }
.nova-popup-action { font-size: 12px; color: var(--accent); padding: 3px 0; }
.nova-popup-footer { display: flex; gap: 6px; padding: 12px 16px; border-top: 1px solid var(--border); }
.nova-popup-btn {
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  border: none;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--font-sans);
  transition: all var(--transition);
  white-space: nowrap;
}
.nova-btn-primary { flex: 1; background: var(--accent); color: #fff; }
.nova-btn-primary:hover { opacity: 0.85; }
.nova-btn-primary:disabled { opacity: 0.5; cursor: default; }
.nova-btn-skip { background: var(--accent-subtle); color: var(--accent); }
.nova-btn-skip:hover { background: rgba(99,102,241,0.2); }
.nova-btn-secondary { background: var(--bg-3); color: var(--text-muted); font-size: 11px; }
.nova-btn-secondary:hover { color: var(--text-secondary); }
.nova-popup-remaining { text-align: center; font-size: 10px; color: var(--text-muted); padding: 6px 0 10px; }

/* ==================== KPI CARDS ==================== */
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.kpi-card {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  box-shadow: var(--shadow-card);
  transition: transform 200ms ease, box-shadow 200ms ease;
}
.kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md), 0 0 20px rgba(99,102,241,0.08);
}
.kpi-icon {
  font-size: 28px;
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-1);
  border-radius: var(--radius-md);
}
.kpi-content { flex: 1; }
.kpi-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 4px;
  line-height: 1;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
.kpi-label {
  font-size: 12px;
  color: var(--text-tertiary);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.kpi-suggestion {
  font-size: 11px;
  color: var(--text-muted);
  font-style: italic;
  margin-top: 6px;
  line-height: 1.4;
}

/* ==================== SALES ==================== */
.sales-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-bottom: 32px;
}
.sales-kpi-card {
  background: var(--bg-2);
  padding: 24px;
  border-radius: var(--radius-lg);
  text-align: center;
  box-shadow: var(--shadow-card);
  transition: transform 200ms ease, box-shadow 200ms ease;
  position: relative;
  overflow: hidden;
}
.sales-kpi-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--accent-gradient);
  opacity: 0.5;
}
.sales-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md), 0 0 20px rgba(99,102,241,0.08);
}
.sales-kpi-value {
  font-size: 36px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 4px;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
.sales-kpi-label {
  color: var(--text-tertiary);
  font-weight: 500;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}
.team-performance h2 {
  color: var(--text-primary);
  margin-bottom: 16px;
  font-size: 16px;
  font-weight: 600;
}
.performers-grid { display: grid; gap: 12px; }

/* Sales subtabs */
.sales-subtabs {
  display: flex; gap: 6px; margin-bottom: 20px; padding: 4px;
  background: var(--bg-2); border-radius: 24px; width: fit-content;
}
.sales-subtab-content { display: none; }
.sales-subtab-content.active { display: block; animation: salesFadeIn 200ms ease; }
@keyframes salesFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.sales-kpi-trend { margin-top: 4px; font-size: 12px; }
.sales-trend { font-weight: 600; font-size: 12px; padding: 2px 8px; border-radius: 12px; }
.sales-trend.trend-up { color: var(--green); background: var(--green-subtle); }
.sales-trend.trend-down { color: var(--red); background: var(--red-subtle); }
.sales-trend.trend-flat { color: var(--text-tertiary); }

.sales-loading-pulse { animation: salesPulse 1.5s ease-in-out infinite; display: inline-block; }
@keyframes salesPulse { 0%,100% { opacity: .3; } 50% { opacity: 1; } }
.sales-loading { text-align: center; color: var(--text-tertiary); padding: 40px; }
.sales-empty { text-align: center; color: var(--text-muted); padding: 32px; }

.sales-section { margin-bottom: 28px; }
.sales-section-title { color: var(--text-secondary); font-size: 14px; font-weight: 600; margin-bottom: 14px; }

.sales-team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }

.sales-setter-group { margin-bottom: 16px; }
.sales-setter-group-label {
  font-size: 11px; text-transform: uppercase; letter-spacing: 1px;
  color: var(--text-muted); font-weight: 600; margin-bottom: 10px; padding-left: 4px;
}
.sales-setter-group .sales-team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.sales-setter-group .sales-person-card { margin-bottom: 0; }

.sales-person-card {
  background: var(--bg-2); border-radius: var(--radius-lg); padding: 18px;
  border: 1px solid var(--border); transition: transform 200ms, box-shadow 200ms;
}
.sales-person-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.sales-person-header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.sales-person-avatar {
  width: 36px; height: 36px; border-radius: 50%; display: flex;
  align-items: center; justify-content: center; font-weight: 700;
  color: #fff; font-size: 14px; flex-shrink: 0;
}
.sales-person-name { font-weight: 600; color: var(--text-primary); font-size: 14px; }
.sales-person-role { font-size: 11px; color: var(--text-tertiary); }
.sales-person-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 10px; }
.sales-stat { text-align: center; }
.sales-stat-value { font-size: 18px; font-weight: 700; color: var(--text-primary); font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.sales-stat-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .3px; margin-top: 2px; }

/* Sales detail cards */
.sales-detail-card {
  background: var(--bg-2); border-radius: var(--radius-lg); padding: 22px;
  border: 1px solid var(--border); margin-bottom: 16px;
}
.sales-detail-header { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.sales-detail-metrics { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 16px; }
.sales-detail-metric { text-align: center; }
.sales-detail-metric-value { font-size: 22px; font-weight: 700; color: var(--text-primary); font-family: var(--font-mono); }
.sales-detail-metric-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; margin-top: 4px; }
.sales-detail-bar { height: 4px; background: var(--bg-3); border-radius: 2px; margin-top: 6px; overflow: hidden; }
.sales-detail-bar-fill { height: 100%; border-radius: 2px; transition: width 600ms ease; }

/* AI Suggestions */
.sales-suggestions { display: flex; flex-direction: column; gap: 10px; }
.sales-suggestion-card {
  display: flex; gap: 14px; padding: 16px; border-radius: var(--radius-md);
  background: var(--bg-2); border: 1px solid var(--border); align-items: flex-start;
}
.sales-suggestion-positive { border-left: 3px solid var(--green); }
.sales-suggestion-warning { border-left: 3px solid var(--amber); }
.sales-suggestion-alert { border-left: 3px solid var(--red); }
.sales-suggestion-info { border-left: 3px solid var(--blue); }
.sales-suggestion-icon { font-size: 20px; flex-shrink: 0; }
.sales-suggestion-title { font-weight: 600; color: var(--text-primary); font-size: 13px; margin-bottom: 4px; }
.sales-suggestion-msg { color: var(--text-secondary); font-size: 12px; line-height: 1.5; }

/* Forecast */
.sales-forecast-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; margin-bottom: 12px; }
.sales-forecast-item { text-align: center; padding: 14px; background: var(--bg-3); border-radius: var(--radius-md); }
.sales-forecast-days { font-weight: 700; font-size: 16px; color: var(--text-primary); }
.sales-forecast-pipeline { font-size: 11px; color: var(--text-tertiary); margin: 4px 0 10px; }
.sales-forecast-range { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 13px; }
.sales-forecast-worst { color: var(--red); }
.sales-forecast-expected { color: var(--green); font-weight: 700; }
.sales-forecast-best { color: var(--blue); }
.sales-forecast-labels { display: flex; justify-content: space-between; font-size: 9px; color: var(--text-muted); text-transform: uppercase; margin-top: 2px; }
.sales-forecast-rates { font-size: 11px; color: var(--text-tertiary); text-align: center; }

/* Funnel */
.sales-funnel { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sales-funnel-stage { flex: 1; min-width: 120px; }
.sales-funnel-bar {
  background: var(--accent-gradient); border-radius: 6px; padding: 8px 12px;
  min-width: 40px; transition: width 400ms ease;
}
.sales-funnel-count { color: #fff; font-weight: 700; font-size: 16px; font-family: var(--font-mono); }
.sales-funnel-label { font-size: 10px; color: var(--text-muted); margin-top: 4px; text-transform: uppercase; letter-spacing: .3px; }
.sales-funnel-arrow { color: var(--text-muted); font-size: 18px; }

/* Revenue bar chart */
.sales-bar-chart { display: flex; align-items: flex-end; gap: 8px; height: 200px; padding-top: 20px; }
.sales-bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; min-width: 40px; }
.sales-bar { background: var(--accent-gradient); border-radius: 4px 4px 0 0; width: 100%; max-width: 48px; transition: height 500ms ease; }
.sales-bar-stacked { width: 100%; max-width: 48px; transition: height 500ms ease; overflow: hidden; border-radius: 4px; }
.sales-bar-value { font-size: 9px; color: var(--text-tertiary); font-family: var(--font-mono); margin-bottom: 4px; white-space: nowrap; }
.sales-bar-label { font-size: 10px; color: var(--text-muted); margin-top: 6px; }

/* Revenue table */
.sales-table-wrap { overflow-x: auto; }
.sales-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.sales-table th { text-align: left; padding: 10px 12px; color: var(--text-tertiary); font-weight: 600; font-size: 11px; text-transform: uppercase; border-bottom: 1px solid var(--border); }
.sales-table td { padding: 10px 12px; color: var(--text-secondary); border-bottom: 1px solid var(--border-subtle); }
.sales-table tr:hover td { color: var(--text-primary); background: var(--bg-hover); }

/* AM list */
.sales-am-list { display: flex; flex-direction: column; gap: 8px; }
.sales-am-item { padding: 10px 14px; background: var(--bg-3); border-radius: var(--radius-sm); font-size: 13px; color: var(--text-secondary); }

/* ==================== COMMAND CENTER ==================== */

/* Projection Section */
.command-projection-section {
  margin-bottom: 32px;
}

.projection-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px;
  box-shadow: var(--shadow-card);
  position: relative;
  overflow: hidden;
}

.projection-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--accent-gradient);
}

.projection-header {
  margin-bottom: 24px;
}

.projection-header h2 {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.projection-amount {
  color: var(--green);
}

.projection-subtitle {
  font-size: 14px;
  color: var(--text-secondary);
}

.trend-positive { color: var(--green); }
.trend-negative { color: var(--red); }

.projection-progress {
  margin-bottom: 20px;
}

.progress-bar {
  width: 100%;
  height: 8px;
  background: var(--bg-3);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 8px;
}

.progress-fill {
  height: 100%;
  background: var(--accent-gradient);
  border-radius: 4px;
  transition: width 800ms ease;
}

.progress-text {
  font-size: 12px;
  color: var(--text-tertiary);
  font-family: var(--font-mono);
}

.projection-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.projection-stat {
  text-align: center;
}

.projection-stat .stat-value {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-primary);
  font-family: var(--font-mono);
}

.projection-stat .stat-label {
  font-size: 12px;
  color: var(--text-tertiary);
  margin-top: 4px;
}

/* Command Center Grid */
.command-center-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-bottom: 32px;
}

.command-section {
  margin-bottom: 32px;
}

.command-section-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}

/* Revenue by Channel */
.revenue-channels {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.revenue-channel {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px;
}

.channel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.channel-name {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 14px;
}

.channel-amount {
  font-weight: 700;
  color: var(--green);
  font-family: var(--font-mono);
  font-size: 14px;
}

.channel-details {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.channel-count, .channel-percent {
  font-size: 12px;
  color: var(--text-secondary);
}

.channel-bar {
  height: 4px;
  background: var(--bg-3);
  border-radius: 2px;
  overflow: hidden;
}

.channel-fill {
  height: 100%;
  background: var(--accent-gradient);
  border-radius: 2px;
  transition: width 600ms ease;
}

/* Close Feed */
.close-feed {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  max-height: 450px;
  overflow-y: auto;
}

.close-feed-section {
  margin-bottom: 16px;
}

.close-feed-section:last-child {
  margin-bottom: 0;
}

.close-feed-section-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-secondary);
  padding: 12px 16px 8px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-3);
  margin: 0 0 0 0;
}

.close-feed-section:first-child .close-feed-section-title {
  border-top-left-radius: var(--radius-md);
  border-top-right-radius: var(--radius-md);
}

.close-feed-item {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-subtle);
}

.close-feed-item:last-child {
  border-bottom: none;
}

.close-feed-item-product {
  background: rgba(245, 158, 11, 0.02);
}

.close-item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}

.close-customer {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.close-amount {
  font-weight: 700;
  color: var(--green);
  font-family: var(--font-mono);
  font-size: 13px;
}

.close-item-details {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.close-method, .close-time {
  font-size: 11px;
  color: var(--text-tertiary);
}

.source-badge {
  font-size: 9px;
  font-weight: 600;
  padding: 1px 4px;
  border-radius: 3px;
  margin-left: 4px;
}

.source-financed {
  background: var(--blue-subtle);
  color: var(--blue);
}

.source-shopify {
  background: var(--amber-subtle);
  color: var(--amber);
}

.close-feed-summary {
  padding: 8px 16px;
  background: var(--bg-3);
  border-top: 1px solid var(--border-subtle);
  margin-top: 8px;
}

.dedup-notice {
  font-size: 10px;
  color: var(--text-tertiary);
  text-align: center;
}

/* Closer Performance Cards */
.closer-performance-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.closer-performance-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px;
  box-shadow: var(--shadow-card);
}

.closer-card-header {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}

.closer-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: 600;
  font-size: 16px;
  margin-right: 12px;
}

.closer-info {
  flex: 1;
}

.closer-name {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 15px;
}

.closer-role {
  font-size: 12px;
  color: var(--text-secondary);
  margin-top: 2px;
}

.closer-metrics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.closer-metric {
  text-align: center;
}

.metric-value {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  font-family: var(--font-mono);
}

.metric-label {
  font-size: 11px;
  color: var(--text-tertiary);
  margin-top: 4px;
}

/* Setter Performance Groups */
.setter-performance-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 24px;
}

.setter-group {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px;
}

.setter-group-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-subtle);
}

.setter-group-members {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.setter-card {
  background: var(--bg-3);
  border-radius: var(--radius-sm);
  padding: 12px;
}

.setter-header {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}

.setter-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: 600;
  font-size: 12px;
  margin-right: 8px;
}

.setter-info {
  flex: 1;
}

.setter-name {
  font-weight: 500;
  color: var(--text-primary);
  font-size: 13px;
}

.setter-quality-badge {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  margin-top: 2px;
}

.setter-quality-high {
  background: var(--green-subtle);
  color: var(--green);
}

.setter-quality-medium {
  background: var(--amber-subtle);
  color: var(--amber);
}

.setter-quality-low {
  background: var(--red-subtle);
  color: var(--red);
}

.setter-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.setter-stat {
  font-size: 11px;
  color: var(--text-secondary);
  background: var(--bg-1);
  padding: 4px 8px;
  border-radius: 4px;
  font-family: var(--font-mono);
}

.setter-stat-warning {
  background: var(--amber-subtle);
  color: var(--amber);
}

/* AI Insights */
.ai-insights {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ai-insight {
  display: flex;
  align-items: flex-start;
  padding: 16px;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  border-left: 4px solid var(--accent);
}

.ai-insight-positive { border-left-color: var(--green); }
.ai-insight-warning { border-left-color: var(--amber); }
.ai-insight-alert { border-left-color: var(--red); }
.ai-insight-info { border-left-color: var(--blue); }

.ai-insight-icon {
  font-size: 20px;
  margin-right: 12px;
  margin-top: 2px;
}

.ai-insight-content {
  flex: 1;
}

.ai-insight-title {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 14px;
  margin-bottom: 4px;
}

.ai-insight-message {
  font-size: 13px;
  color: var(--text-secondary);
  line-height: 1.5;
}

/* Command Center Loading and Errors */
.command-loading, .command-empty, .command-error {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  font-size: 13px;
  color: var(--text-tertiary);
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.command-error {
  color: var(--red);
  background: var(--red-subtle);
}

.new-closer-badge {
  display: inline-block;
  background: var(--amber);
  color: var(--bg-0);
  font-size: 10px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  margin-left: 6px;
}

/* ==================== CALENDAR WIDGET ==================== */
.calendar-section {
  background: var(--bg-1);
  border-radius: var(--radius-lg);
  padding: 16px;
  margin-bottom: 16px;
}
.calendar-section h3 { color: var(--text-primary); font-size: 14px; font-weight: 600; margin-bottom: 10px; }
.calendar-day-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border);
}
.calendar-day-label.today { color: var(--green); border-bottom-color: rgba(34,197,94,0.2); }
.calendar-appt {
  display: flex;
  gap: 12px;
  padding: 10px;
  border-radius: var(--radius-sm);
  margin-bottom: 4px;
  border-left: 2px solid var(--blue);
  background: transparent;
  transition: background var(--transition);
}
.calendar-appt:hover { background: var(--bg-2); }
.calendar-appt.type-call { border-left-color: var(--green); }
.calendar-appt.type-meeting { border-left-color: var(--blue); }
.calendar-appt.type-showing { border-left-color: var(--amber); }
.calendar-appt-time { font-size: 12px; font-weight: 500; color: var(--text-tertiary); min-width: 60px; font-variant-numeric: tabular-nums; }
.calendar-appt-info { flex: 1; }
.calendar-appt-title { font-size: 13px; font-weight: 500; color: var(--text-primary); }
.calendar-appt-contact { font-size: 11px; color: var(--text-muted); margin-top: 1px; }
.calendar-appt-zoom {
  display: inline-block;
  background: var(--blue-subtle);
  color: var(--blue);
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  margin-top: 4px;
  text-decoration: none;
  font-weight: 500;
}
.calendar-appt-zoom:hover { background: rgba(59,130,246,0.2); }
.calendar-empty { text-align: center; color: var(--text-muted); padding: 20px; font-size: 13px; }

/* ==================== CONSTRUCTION ==================== */
.construction-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
  background: linear-gradient(135deg, var(--bg-2), var(--bg-3));
  padding: 24px 28px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border);
}
.construction-title h1 { color: var(--text-primary); margin-bottom: 4px; font-size: 22px; font-weight: 700; }
.construction-title p { color: var(--text-tertiary); font-size: 14px; }
.construction-stats { display: flex; gap: 32px; }
.const-stat { text-align: center; }
.const-stat-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 4px;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
.const-stat-label { color: var(--text-muted); font-size: 11px; text-transform: uppercase; letter-spacing: 0.8px; }

/* Construction subtabs — pill style */
.construction-subtabs {
  display: flex;
  gap: 6px;
  margin-bottom: 20px;
  padding: 4px;
  background: var(--bg-2);
  border-radius: 24px;
  width: fit-content;
}
.subtab {
  padding: 8px 18px;
  border: none;
  border-radius: 20px;
  cursor: pointer;
  background: transparent;
  color: var(--text-tertiary);
  font-size: 13px;
  font-weight: 500;
  font-family: var(--font-sans);
  transition: all var(--transition);
}
.subtab:hover { color: var(--text-primary); }
.subtab.active {
  background: var(--accent);
  color: #fff;
  box-shadow: var(--shadow-sm);
}
.construction-subtab-content { display: none; }
.construction-subtab-content.active { display: block; }

/* AM subtab content */
/* ===== AM TAB — SUBTAB CONTENT ===== */
.am-subtab-content { display: none; }
.am-subtab-content.active { display: block; animation: salesFadeIn 200ms ease; }

/* AM Subtab Navigation — bottom-border indicator style */
#tab-account-management .am-subtabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid #2a2f3e;
  margin-bottom: 24px;
  padding: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
#tab-account-management .am-subtabs::-webkit-scrollbar { display: none; }
#tab-account-management .am-subtabs .subtab {
  padding: 10px 18px;
  border: none;
  border-radius: 0;
  cursor: pointer;
  background: transparent;
  color: #6b7280;
  font-size: 13px;
  font-weight: 500;
  font-family: var(--font-sans);
  transition: color 0.15s, box-shadow 0.15s;
  position: relative;
  white-space: nowrap;
  box-shadow: none;
}
#tab-account-management .am-subtabs .subtab:hover {
  color: #e2e8f0;
}
#tab-account-management .am-subtabs .subtab.active {
  color: #4f9eff;
  background: transparent;
  box-shadow: inset 0 -2px 0 0 #4f9eff;
  font-weight: 600;
}

/* ===== AM HEADER ===== */
.am-header { margin-bottom: 24px; }
.am-header .am-title h1 { margin: 0 0 4px 0; font-size: 22px; color: #e2e8f0; }
.am-header .am-title p { margin: 0 0 20px 0; color: #6b7280; font-size: 13px; }

/* ===== AM METRICS BAR ===== */
.am-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: 14px;
}
.am-metric-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 16px 18px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.2s, transform 0.2s;
}
.am-metric-card:hover {
  border-color: rgba(255,255,255,0.12);
  transform: translateY(-1px);
}
.am-metric-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--accent, #4f9eff);
  border-radius: 3px 3px 0 0;
}
.am-metric-card .am-metric-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  margin-bottom: 10px;
  background: var(--icon-bg, rgba(79,158,255,0.1));
  font-size: 16px;
}
.am-metric-icon {
  font-size: 16px;
}
.am-metric-value {
  font-size: 24px;
  font-weight: 700;
  color: #e2e8f0;
  line-height: 1;
}
.am-metric-label {
  font-size: 11px;
  color: #6b7280;
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.am-metric-sub {
  font-size: 11px;
  color: #8b95a5;
  margin-top: 6px;
}

/* ===== AM SHARED TABLE STYLES ===== */
.am-table-wrap {
  overflow-x: auto;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.06);
  background: #161b22;
  -webkit-overflow-scrolling: touch;
}
.am-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.am-table thead th {
  padding: 11px 14px;
  text-align: left;
  color: #8b95a5;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  border-bottom: 1px solid #2a2f3e;
  background: #1c2333;
  position: sticky;
  top: 0;
  z-index: 1;
  white-space: nowrap;
}
.am-table thead th.sortable { cursor: pointer; }
.am-table thead th.sortable:hover { color: #e2e8f0; }
.am-table thead th.text-right { text-align: right; }
.am-table thead th.text-center { text-align: center; }
.am-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: background 0.12s;
}
.am-table tbody tr:nth-child(even) { background: rgba(255,255,255,0.015); }
.am-table tbody tr:hover { background: rgba(79,158,255,0.04); }
.am-table tbody td {
  padding: 10px 14px;
  color: #c9d1d9;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}
.am-table tbody td.text-right { text-align: right; }
.am-table tbody td.text-center { text-align: center; }
.am-table tbody td.cell-name { color: #e2e8f0; font-weight: 500; }
.am-table tbody td.cell-money { color: #10b981; font-weight: 600; font-size: 12px; }
.am-table tbody td.cell-muted { color: #6b7280; font-size: 12px; }
.am-table tbody td.cell-small { font-size: 11px; color: #8b95a5; }

/* ===== AM STATUS BADGES ===== */
.am-badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  white-space: nowrap;
  line-height: 1.4;
}
.am-badge-blue { background: rgba(59,130,246,0.12); color: #60a5fa; }
.am-badge-green { background: rgba(16,185,129,0.12); color: #34d399; }
.am-badge-red { background: rgba(239,68,68,0.12); color: #f87171; }
.am-badge-amber { background: rgba(245,158,11,0.12); color: #fbbf24; }
.am-badge-purple { background: rgba(139,92,246,0.12); color: #a78bfa; }
.am-badge-cyan { background: rgba(6,182,212,0.12); color: #22d3ee; }
.am-badge-gray { background: rgba(107,114,128,0.12); color: #9ca3af; }
.am-badge-orange { background: rgba(249,115,22,0.12); color: #fb923c; }

/* ===== AM FILTER / SEARCH BAR ===== */
.am-filters {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 16px;
  padding: 12px 16px;
  background: #1c2333;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.06);
}
.am-filters input[type="text"],
.am-filters select {
  background: #0d1117;
  color: #e2e8f0;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 13px;
  font-family: var(--font-sans);
  transition: border-color 0.15s;
  outline: none;
}
.am-filters input[type="text"]:focus,
.am-filters select:focus {
  border-color: #4f9eff;
}
.am-filters input[type="text"] { min-width: 240px; }
.am-filters .am-filter-count {
  color: #6b7280;
  font-size: 12px;
  margin-left: auto;
}

/* ===== AM FILTER PILLS (matches range-pill from Sales) ===== */
.am-pill {
  padding: 5px 13px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px;
  background: transparent;
  color: #9ca3af;
  cursor: pointer;
  transition: all 0.15s;
  white-space: nowrap;
  font-family: var(--font-sans);
}
.am-pill:hover {
  border-color: rgba(79,158,255,0.4);
  color: #e5e7eb;
}
.am-pill.active {
  background: rgba(79,158,255,0.15);
  border-color: #4f9eff;
  color: #4f9eff;
  font-weight: 600;
}

/* ===== AM SECTION CARD (shared panel) ===== */
.am-section {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 20px;
}
.am-section h3 {
  color: #e2e8f0;
  margin: 0 0 16px 0;
  font-size: 15px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ===== AM KPI MINI CARDS (summary rows) ===== */
.am-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.am-kpi-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  padding: 14px 16px;
  text-align: center;
  transition: border-color 0.15s;
}
.am-kpi-card:hover { border-color: rgba(255,255,255,0.1); }
.am-kpi-card.accent-left {
  border-left: 3px solid var(--kpi-color, #4f9eff);
}
.am-kpi-card .kpi-val {
  font-size: 22px;
  font-weight: 700;
  color: var(--kpi-color, #e2e8f0);
  line-height: 1;
}
.am-kpi-card .kpi-label {
  font-size: 11px;
  color: #6b7280;
  margin-top: 5px;
}

/* ===== AM PIPELINE STAGE CARDS ===== */
.am-stage-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}
.am-stage-card {
  background: #0d1117;
  border: 1px solid rgba(255,255,255,0.06);
  border-left: 3px solid var(--stage-color, #4f9eff);
  border-radius: 8px;
  padding: 12px;
  text-align: center;
  transition: border-color 0.15s, background 0.15s;
}
.am-stage-card:hover { background: #161b22; }
.am-stage-card .stage-count {
  font-size: 20px;
  font-weight: 700;
  color: var(--stage-color, #e2e8f0);
}
.am-stage-card .stage-name {
  font-size: 10px;
  color: #8b95a5;
  margin: 4px 0;
  line-height: 1.3;
}
.am-stage-card .stage-value {
  font-size: 10px;
  color: #6b7280;
}

/* ===== AM ONBOARDING PIPELINE CARDS ===== */
.am-pipeline-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.am-pipeline-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 18px;
  transition: border-color 0.2s;
}
.am-pipeline-card:hover { border-color: rgba(255,255,255,0.12); }
.am-pipeline-card h4 {
  color: #e2e8f0;
  margin: 0 0 12px 0;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.am-pipeline-card .pipeline-count {
  color: #4f9eff;
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 12px;
}
.am-pipeline-card .pipeline-stages {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.am-pipeline-card .pipeline-stage-chip {
  background: #0d1117;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  padding: 6px 10px;
  text-align: center;
  flex: 1;
  min-width: 70px;
}
.am-pipeline-card .pipeline-stage-chip .chip-label {
  font-size: 10px;
  color: #8b95a5;
  line-height: 1.3;
}
.am-pipeline-card .pipeline-stage-chip .chip-count {
  font-size: 14px;
  font-weight: 700;
  color: #e2e8f0;
}

/* Progress bar for onboarding stages */
.am-progress-bar {
  height: 4px;
  background: #2a2f3e;
  border-radius: 2px;
  overflow: hidden;
  margin-top: 12px;
}
.am-progress-bar .progress-fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.4s ease;
}

/* ===== AM OVERVIEW CARDS ===== */
.am-overview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
  margin-top: 20px;
}
.am-overview-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 20px;
  transition: border-color 0.2s;
}
.am-overview-card:hover { border-color: rgba(255,255,255,0.1); }
.am-overview-card h3 {
  color: #e2e8f0;
  margin: 0 0 16px 0;
  font-size: 15px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}
.am-overview-card .am-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}
.am-overview-card .am-kpi-value {
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}
.am-overview-card .am-kpi-label {
  color: #8b95a5;
  font-size: 11px;
  margin-top: 4px;
}
.am-overview-card .card-footer {
  border-top: 1px solid rgba(255,255,255,0.06);
  padding-top: 12px;
  color: #8b95a5;
  font-size: 12px;
}

/* ===== AM REFUNDS RISK ROWS ===== */
.am-table tbody tr.risk-high { background: rgba(239,68,68,0.04); }
.am-table tbody tr.risk-high:hover { background: rgba(239,68,68,0.08); }
.am-table tbody tr.risk-medium { background: rgba(245,158,11,0.03); }
.am-table tbody tr.risk-medium:hover { background: rgba(245,158,11,0.06); }

/* ===== AM MENTORSHIP TABLE ===== */
.am-mentorship-summary {
  display: flex;
  gap: 16px;
  align-items: stretch;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.am-mentorship-stat {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.am-mentorship-stat .ms-val {
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
}
.am-mentorship-stat .ms-label {
  color: #6b7280;
  font-size: 12px;
  line-height: 1.3;
}
.am-dist-bar {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 14px 20px;
  flex: 1;
  min-width: 280px;
}
.am-dist-bar .dist-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.am-dist-bar .dist-header span { color: #6b7280; font-size: 11px; }
.am-dist-bar .dist-header .dist-hint { color: #4a5068; font-size: 9px; }
.am-dist-bar .dist-bars {
  display: flex;
  align-items: end;
  gap: 3px;
  height: 40px;
}
.am-dist-bar .dist-bar {
  flex: 1;
  border-radius: 2px;
  cursor: help;
  position: relative;
  transition: opacity 0.15s;
}
.am-dist-bar .dist-bar:hover .dist-tip { display: block !important; }
.am-dist-bar .dist-tip {
  display: none;
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: #1c2333;
  border: 1px solid #3a4058;
  border-radius: 4px;
  padding: 3px 7px;
  white-space: nowrap;
  font-size: 11px;
  color: #e2e8f0;
  z-index: 10;
  pointer-events: none;
}
.am-dist-bar .dist-labels {
  display: flex;
  gap: 3px;
  margin-top: 2px;
}
.am-dist-bar .dist-labels span {
  flex: 1;
  text-align: center;
  font-size: 8px;
  color: #4a5068;
}

/* ===== AM PAGINATION ===== */
.am-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 14px 0;
}
.am-pagination button {
  padding: 6px 16px;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
  font-family: var(--font-sans);
}
.am-pagination button:not(:disabled) {
  background: rgba(79,158,255,0.1);
  color: #4f9eff;
  border-color: rgba(79,158,255,0.3);
}
.am-pagination button:not(:disabled):hover {
  background: rgba(79,158,255,0.2);
}
.am-pagination button:disabled {
  background: transparent;
  color: #4a5068;
  border-color: rgba(255,255,255,0.06);
  cursor: default;
}
.am-pagination .page-info {
  color: #8b95a5;
  font-size: 12px;
}

/* ===== AM LOADING STATE ===== */
#tab-account-management .loading-construction {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  color: #6b7280;
  gap: 12px;
}

/* ===== AM EDIT BUTTON ===== */
.am-edit-btn {
  background: transparent;
  color: #4f9eff;
  border: 1px solid rgba(79,158,255,0.2);
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 11px;
  cursor: pointer;
  transition: all 0.15s;
}
.am-edit-btn:hover {
  background: rgba(79,158,255,0.1);
  border-color: rgba(79,158,255,0.4);
}

/* Mentorship grid (legacy compat) */
.mentorship-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}
.mentorship-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.mentorship-card .mc-ring {
  width: 44px; height: 44px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 700;
  flex-shrink: 0;
}
.mentorship-card .mc-info { flex: 1; min-width: 0; }
.mentorship-card .mc-name {
  font-size: 13px; font-weight: 600; color: #e2e8f0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mentorship-card .mc-stage {
  font-size: 11px; color: #6b7280; margin-top: 2px;
}

/* Project cards */
.projects-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 16px;
}
.project-card {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: transform 200ms ease, box-shadow 200ms ease;
  cursor: pointer;
  min-height: 320px;
  box-shadow: var(--shadow-card);
}
.project-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md), 0 0 20px rgba(99,102,241,0.08);
}
.project-header { padding: 20px 20px 0; display: flex; justify-content: space-between; align-items: flex-start; }
.project-title { font-size: 17px; font-weight: 700; color: var(--text-primary); margin-bottom: 4px; }
.project-subtitle { color: var(--text-tertiary); font-size: 13px; }
.project-status-badge {
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.status-active { background: var(--green-subtle); color: var(--green); }
.status-progress { background: var(--amber-subtle); color: var(--amber); }
.status-complete { background: var(--blue-subtle); color: var(--blue); }
.status-attention { background: var(--red-subtle); color: var(--red); }

.project-media {
  height: 280px;
  position: relative;
  margin: 16px;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--bg-0);
}
.media-content { width: 100%; height: 100%; position: relative; }
.media-content video, .media-content img { width: 100%; height: 100%; object-fit: cover; }
.media-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, transparent 50%);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s;
}
.project-media:hover .media-overlay { opacity: 1; }
.media-play-button {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(99,102,241,0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 28px;
  transition: transform 0.2s;
}
.media-play-button:hover { transform: scale(1.08); }
.media-info { position: absolute; bottom: 12px; left: 12px; right: 12px; color: white; text-shadow: 0 1px 4px rgba(0,0,0,0.8); }
.media-type { font-size: 10px; text-transform: uppercase; letter-spacing: 1px; opacity: 0.8; }
.media-title { font-size: 14px; font-weight: 600; }

.no-media-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--bg-0);
  color: var(--text-muted);
}
.no-media-icon { font-size: 48px; margin-bottom: 12px; opacity: 0.4; }
.no-media-text { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.no-media-subtext { font-size: 12px; opacity: 0.6; }

.project-stats { padding: 20px; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
.project-stat { text-align: center; }
.project-stat-value { font-size: 20px; font-weight: 700; color: var(--text-primary); margin-bottom: 2px; font-family: var(--font-mono); }
.project-stat-label { color: var(--text-muted); font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; }

/* ==================== FINANCIALS ==================== */
.financial-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.fin-kpi {
  background: var(--bg-2);
  border-radius: var(--radius-md);
  padding: 20px;
  text-align: center;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
  transition: transform 150ms ease, box-shadow 150ms ease;
}
.fin-kpi:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}
.fin-kpi::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--accent-gradient);
  opacity: 0.4;
}
.fin-kpi-value { font-size: 1.4rem; font-weight: 700; color: var(--text-primary); font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.fin-kpi-label { font-size: 10px; color: var(--text-muted); margin-top: 6px; text-transform: uppercase; letter-spacing: 0.5px; }
.fin-kpi-icon { font-size: 18px; margin-bottom: 6px; }
.fin-kpi--green .fin-kpi-value { color: var(--green); }
.fin-kpi--green::before { background: var(--green); }
.fin-kpi--red .fin-kpi-value { color: var(--red); }
.fin-kpi--red::before { background: var(--red); }
.fin-kpi--amber .fin-kpi-value { color: var(--amber); }
.fin-kpi--amber::before { background: var(--amber); }
.fin-kpi--blue .fin-kpi-value { color: var(--blue); }
.fin-kpi--blue::before { background: var(--blue); }

.financial-table-wrap { overflow-x: auto; border-radius: var(--radius-md); border: 1px solid var(--border); }
.fin-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.fin-table th {
  text-align: left;
  padding: 12px 12px;
  color: var(--text-muted);
  font-weight: 600;
  font-size: 11px;
  border-bottom: 2px solid var(--border-active);
  cursor: pointer;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  background: var(--bg-2);
  position: sticky;
  top: 0;
}
.fin-table th:hover { color: var(--text-primary); }
.fin-table th.sorted-asc::after { content: ' ▲'; font-size: 9px; color: var(--accent); }
.fin-table th.sorted-desc::after { content: ' ▼'; font-size: 9px; color: var(--accent); }
.fin-table td { padding: 11px 12px; border-bottom: 1px solid var(--border-subtle); color: var(--text-secondary); }
.fin-table tbody tr { cursor: pointer; transition: background var(--transition); }
.fin-table tbody tr:nth-child(even) { background: rgba(255,255,255,0.02); }
.fin-table tbody tr:nth-child(odd) { background: rgba(255,255,255,0.005); }
.fin-table tbody tr:hover { background: rgba(99,102,241,0.06); }
.fin-table .money-green { color: var(--green); font-family: var(--font-mono); font-weight: 600; }
.fin-table .money-red { color: var(--red); font-family: var(--font-mono); font-weight: 600; }
.fin-table .status-badge { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 10px; font-weight: 600; }
.status-completed { background: var(--green-subtle); color: var(--green); }
.status-construction { background: var(--blue-subtle); color: var(--blue); }
.status-phase1 { background: var(--blue-subtle); color: #60a5fa; }
.status-pending-close { background: var(--amber-subtle); color: var(--amber); }
.status-pending { background: var(--bg-3); color: var(--text-muted); }

.fin-detail-row td { padding: 0 !important; border: none !important; }
.fin-detail-content { background: var(--bg-0); padding: 14px 18px; border-radius: var(--radius-sm); margin: 4px 10px 10px; }
.fin-detail-content table { width: 100%; font-size: 12px; }
.fin-detail-content th { color: var(--text-muted); font-size: 10px; padding: 5px 6px; border-bottom: 1px solid var(--border); }
.fin-detail-content td { padding: 5px 6px; color: var(--text-secondary); border-bottom: 1px solid var(--border-subtle); }
.fin-summary-grid { display: flex; gap: 20px; margin-bottom: 10px; flex-wrap: wrap; }
.fin-summary-item { text-align: center; }
.fin-summary-val { font-size: 1.1rem; font-weight: 700; color: var(--accent); font-family: var(--font-mono); }
.fin-summary-lbl { font-size: 10px; color: var(--text-muted); text-transform: uppercase; }

/* ==================== UPDATES ==================== */
.updates-list { display: flex; flex-direction: column; gap: 12px; }
.update-card { background: var(--bg-2); border-radius: var(--radius-lg); padding: 18px; box-shadow: var(--shadow-card); }
.update-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.update-project-name { font-size: 14px; font-weight: 600; color: var(--text-primary); }
.update-time { font-size: 11px; color: var(--text-muted); }
.update-messages { display: flex; flex-direction: column; gap: 6px; }
.update-msg { padding: 8px 12px; background: var(--bg-0); border-radius: var(--radius-sm); border-left: 2px solid var(--accent-subtle); }
.update-msg-sender { font-size: 11px; font-weight: 600; color: var(--accent); }
.update-msg-text { font-size: 12px; color: var(--text-secondary); margin-top: 2px; }
.update-msg-time { font-size: 10px; color: var(--text-muted); }
.update-msg-media { display: inline-block; background: var(--accent-subtle); color: var(--accent); font-size: 10px; padding: 1px 5px; border-radius: 3px; margin-left: 4px; }

/* ==================== CONTENT FOR RICH ==================== */
.content-cards-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 768px) { .content-cards-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1200px) { .content-cards-grid { grid-template-columns: repeat(3, 1fr); } }

.content-card { background: var(--bg-2); border-radius: var(--radius-lg); padding: 16px; display: flex; flex-direction: column; gap: 10px; box-shadow: var(--shadow-card); }
.content-card-header { display: flex; flex-direction: column; gap: 6px; }
.content-card-name { font-size: 14px; font-weight: 600; color: var(--text-primary); }
.content-card-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.content-card-details { font-size: 12px; color: var(--text-tertiary); display: flex; flex-direction: column; gap: 3px; }
.content-caption-wrap { display: flex; flex-direction: column; gap: 6px; }
.content-caption {
  background: var(--bg-0);
  color: var(--text-secondary);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px;
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.5;
  resize: vertical;
  width: 100%;
}
.content-copy-btn {
  align-self: flex-start;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-sm);
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  font-family: var(--font-sans);
  transition: opacity var(--transition);
}
.content-copy-btn:hover { opacity: 0.85; }
.content-card-actions { display: flex; gap: 8px; }
.content-zillow-btn {
  display: inline-block;
  background: var(--bg-3);
  color: var(--text-secondary);
  text-decoration: none;
  padding: 5px 12px;
  border-radius: var(--radius-sm);
  font-size: 12px;
  transition: background var(--transition);
}
.content-zillow-btn:hover { background: var(--bg-hover); }
.content-filter-btn {
  background: var(--bg-2);
  color: var(--text-tertiary);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  font-family: var(--font-sans);
  transition: all var(--transition);
}
.content-filter-btn.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.content-filter-btn:hover { border-color: var(--border-active); }

/* ==================== PLACEHOLDER TABS ==================== */
.placeholder-tab {
  text-align: center;
  padding: 60px 24px;
  max-width: 600px;
  margin: 0 auto;
}
.placeholder-icon {
  font-size: 56px;
  margin-bottom: 16px;
  opacity: 0.8;
}
.placeholder-tab h2 {
  color: var(--text-primary);
  margin-bottom: 8px;
  font-size: 24px;
  font-weight: 700;
}
.placeholder-desc {
  color: var(--text-tertiary);
  font-size: 14px;
  margin-bottom: 32px;
}
.placeholder-card {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 32px;
  box-shadow: var(--shadow-card);
  margin-bottom: 20px;
}
.placeholder-connect {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--bg-2);
  border: 1px dashed var(--border-active);
  border-radius: var(--radius-lg);
  padding: 12px 20px;
  font-size: 13px;
  color: var(--text-tertiary);
}
.placeholder-connect-icon { font-size: 16px; }

/* Shared stat cards for placeholder tabs */
.pm-stats, .cra-stats, .ai-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.pm-stat-card, .cra-stat-card, .ai-stat-card {
  background: var(--bg-1);
  padding: 20px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  gap: 14px;
}
.pm-stat-icon, .cra-stat-icon, .ai-stat-icon { font-size: 24px; }
.pm-stat-value, .cra-stat-value, .ai-stat-value {
  font-size: 22px;
  font-weight: 700;
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
.pm-stat-label, .cra-stat-label, .ai-stat-label { color: var(--text-tertiary); font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; }
.pm-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.pm-action-btn {
  background: var(--accent);
  color: white;
  border: none;
  padding: 12px 24px;
  border-radius: var(--radius-md);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--font-sans);
  transition: opacity var(--transition);
}
.pm-action-btn:hover { opacity: 0.85; }

/* Keep old class names for JS compatibility */
.propmanager-overview, .cra-overview, .ai-overview { text-align: center; padding: 32px; }
.propmanager-overview h2, .cra-overview h2, .ai-overview h2 {
  color: var(--text-primary);
  margin-bottom: 24px;
  font-size: 22px;
  font-weight: 700;
}

/* ==================== COSTS TAB ==================== */
/* Side-by-side costs layout */
/* Costs KPI 3-column layout: Onyx | Combined | Nova */
.costs-kpi-layout {
  display: grid;
  grid-template-columns: 1fr 1.5fr 1fr;
  gap: 16px;
  margin-bottom: 24px;
}
.costs-kpi-group {
  position: relative;
  overflow: hidden;
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 20px;
  box-shadow: var(--shadow-card);
}
.costs-kpi-group-label {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--text-tertiary);
  margin-bottom: 14px;
}
.costs-kpi-onyx { border-top: 3px solid #4f9eff; }
.costs-kpi-combined { border-top: 3px solid var(--accent); background: linear-gradient(135deg, var(--bg-2), var(--bg-3)); }
.costs-kpi-nova { border-top: 3px solid #a78bfa; }
.costs-kpi-pair {
  display: flex;
  gap: 16px;
}
.costs-kpi-box {
  flex: 1;
  text-align: center;
  padding: 12px 8px;
  background: var(--bg-1);
  border-radius: var(--radius-md);
}
.costs-kpi-box-hero {
  background: rgba(99,102,241,0.08);
}
.costs-kpi-val {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.costs-kpi-val-lg { font-size: 26px; }
.costs-kpi-lbl {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 4px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.costs-kpi-onyx .costs-kpi-val { color: #4f9eff; }
.costs-kpi-nova .costs-kpi-val { color: #a78bfa; }
.costs-kpi-combined .costs-kpi-val { color: var(--text-primary); }

.kpi-grid-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.kpi-grid-6 .kpi-card { min-width: 0; overflow: hidden; padding: 16px 12px; gap: 10px; }
.kpi-grid-6 .kpi-value { font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi-combined { background: linear-gradient(135deg, var(--bg-2), var(--bg-3)); }
.costs-agent-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 20px; }
.costs-agent-col { min-width: 0; border-radius: var(--radius-lg); }
.costs-agent-onyx { border-left: 3px solid #4f9eff; padding-left: 20px; }
.costs-agent-nova { border-left: 3px solid #a78bfa; padding-left: 20px; }
.costs-agent-header { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; padding: 16px 20px; background: var(--bg-2); border-radius: var(--radius-lg); border: 1px solid var(--border); }
.costs-agent-name { font-size: 17px; font-weight: 700; color: var(--text-primary); }
.costs-agent-spend { font-size: 22px; font-weight: 700; font-family: var(--font-mono); color: #4f9eff; }
.costs-agent-nova .costs-agent-spend { color: #a78bfa; }
.costs-agent-nova .cost-value { color: #a78bfa; }
.costs-agent-nova .chart-bar { background: linear-gradient(to top, #7c3aed, #a78bfa); }
.costs-agent-nova .model-bar-fill.opus,
.costs-agent-nova .model-bar-fill.sonnet,
.costs-agent-nova .model-bar-fill.haiku,
.costs-agent-nova .model-bar-fill.other { background: #a78bfa; }
.costs-status-badge { font-size: 12px; margin-left: auto; white-space: nowrap; padding: 4px 10px; border-radius: 12px; }
.status-live { color: #10b981; }
.status-cached { color: #f59e0b; }
.status-offline { color: #6b7280; }
.agent-offline { opacity: 0.5; }
.agent-offline .costs-agent-header { opacity: 1; }
.costs-offline-msg { text-align: center; padding: 60px 20px; color: var(--text-muted); font-size: 15px; background: var(--bg-2); border-radius: var(--radius-lg); }
/* (moved to responsive overhaul section at bottom) */
.costs-dashboard { padding: 0; }
.costs-section {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 20px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border);
}
.costs-section h2 { margin: 0 0 14px; font-size: 14px; font-weight: 600; color: var(--text-tertiary); text-transform: uppercase; letter-spacing: 0.5px; }
.costs-table-wrap { overflow-x: auto; border-radius: var(--radius-sm); }
.costs-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.costs-table th {
  text-align: left;
  padding: 10px 12px;
  color: var(--text-muted);
  font-weight: 600;
  font-size: 11px;
  border-bottom: 2px solid var(--border-active);
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  background: var(--bg-1);
}
.costs-table td {
  padding: 9px 12px;
  color: var(--text-secondary);
  border-bottom: 1px solid var(--border-subtle);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.costs-table tr:nth-child(even) td { background: rgba(255,255,255,0.018); }
.costs-table tr:nth-child(odd) td { background: transparent; }
.costs-table tr:hover td { background: rgba(99,102,241,0.05); }
.costs-table .cost-value { color: var(--green); font-weight: 700; font-family: var(--font-mono); }
.costs-agent-onyx .costs-table .cost-value { color: #4f9eff; }
.costs-agent-nova .costs-table .cost-value { color: #a78bfa; }
.costs-table .cost-high { color: var(--amber); }
.costs-table .session-label { max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.costs-table .kind-badge { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 10px; font-weight: 600; }
.kind-main { background: var(--blue-subtle); color: var(--blue); }
.kind-subagent { background: rgba(168,85,247,0.12); color: #a855f7; }
.kind-cron { background: var(--green-subtle); color: var(--green); }
.kind-unknown { background: var(--bg-3); color: var(--text-muted); }

.costs-chart { display: flex; align-items: flex-end; gap: 10px; height: 160px; padding: 12px 0; }
.chart-bar-group { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.chart-bar {
  width: 100%;
  max-width: 64px;
  background: var(--accent-gradient);
  border-radius: 6px 6px 0 0;
  min-height: 3px;
  transition: height 0.3s;
}
.chart-bar:hover { opacity: 0.8; }
.chart-bar-value { color: var(--text-secondary); font-size: 11px; font-weight: 600; font-family: var(--font-mono); }
.chart-bar-label { color: var(--text-muted); font-size: 10px; }

.costs-models { display: flex; gap: 12px; flex-wrap: wrap; }
.model-card {
  flex: 1;
  min-width: 180px;
  background: var(--bg-1);
  border-radius: var(--radius-md);
  padding: 18px;
}
.model-name { color: var(--text-primary); font-weight: 600; font-size: 13px; margin-bottom: 6px; }
.model-cost { color: var(--accent); font-size: 1.4rem; font-weight: 700; font-family: var(--font-mono); }
.model-meta { color: var(--text-muted); font-size: 12px; margin-top: 4px; }
.model-bar { height: 4px; background: var(--bg-3); border-radius: 2px; margin-top: 10px; overflow: hidden; }
.model-bar-fill { height: 100%; border-radius: 2px; }
.model-bar-fill.opus { background: var(--accent); }
.model-bar-fill.sonnet { background: #a855f7; }
.model-bar-fill.haiku { background: var(--green); }
.model-bar-fill.other { background: var(--text-muted); }

/* ==================== LIGHTBOX ==================== */
.media-lightbox {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.9);
  backdrop-filter: blur(8px);
  z-index: 10000;
  display: none;
  align-items: center;
  justify-content: center;
}
.lightbox-content {
  max-width: 90vw;
  max-height: 90vh;
  background: var(--bg-2);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.lightbox-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}
.lightbox-header h3 { color: var(--text-primary); font-size: 16px; font-weight: 600; }
.lightbox-close {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 20px;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: var(--radius-sm);
  transition: all var(--transition);
}
.lightbox-close:hover { background: var(--red-subtle); color: var(--red); }
.lightbox-media {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-0);
  min-height: 300px;
  max-height: 70vh;
  overflow: hidden;
}
.lightbox-media video, .lightbox-media img { max-width: 100%; max-height: 100%; object-fit: contain; }
.lightbox-controls { padding: 16px 20px; text-align: center; }
.lightbox-btn {
  background: var(--accent);
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: var(--radius-sm);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--font-sans);
  transition: opacity var(--transition);
}
.lightbox-btn:hover { opacity: 0.85; }

/* ==================== CHAT WIDGET ==================== */
.chat-widget {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 380px;
  height: 520px;
  background: var(--bg-0);
  border-radius: var(--radius-xl);
  display: flex;
  flex-direction: column;
  z-index: 9000;
  box-shadow: 0 16px 60px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.04);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}
.chat-widget.collapsed {
  height: 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(20px) scale(0.95);
}
.chat-widget.collapsed .chat-body { display: none; }
.chat-widget.hidden { display: none; }
.chat-header {
  padding: 14px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  background: var(--accent);
}
.chat-header-title { font-size: 14px; font-weight: 600; color: #fff; }
.chat-minimize { color: rgba(255,255,255,0.7); font-size: 18px; transition: color var(--transition); }
.chat-minimize:hover { color: #fff; }
.chat-body { flex: 1; display: flex; flex-direction: column; overflow: hidden; background: var(--bg-0); }
.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.chat-messages::-webkit-scrollbar { width: 3px; }
.chat-messages::-webkit-scrollbar-thumb { background: var(--bg-hover); border-radius: 2px; }
.chat-msg { max-width: 82%; animation: msgSlide 0.2s ease; }
@keyframes msgSlide { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
.chat-msg.sent { align-self: flex-end; }
.chat-msg.received { align-self: flex-start; }
.chat-msg-sender { font-size: 11px; font-weight: 600; color: var(--accent); margin-bottom: 3px; padding-left: 2px; }
.chat-msg-body {
  padding: 10px 14px;
  border-radius: 18px;
  font-size: 13px;
  line-height: 1.6;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.chat-msg-body strong { font-weight: 600; }
.chat-msg.sent .chat-msg-body { background: var(--accent); color: #fff; border-bottom-right-radius: 6px; }
.chat-msg.received .chat-msg-body {
  background: var(--bg-2);
  color: var(--text-secondary);
  border-bottom-left-radius: 6px;
}
.chat-msg-time { font-size: 10px; margin-top: 4px; padding: 0 4px; font-variant-numeric: tabular-nums; }
.chat-msg.sent .chat-msg-time { color: var(--text-muted); text-align: right; }
.chat-msg.received .chat-msg-time { color: var(--text-muted); }
.chat-typing { padding: 4px 14px; font-size: 12px; color: var(--text-muted); }
.typing-dots span { animation: blink 1.4s infinite; }
.typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.typing-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes blink { 0%,100% { opacity: 0.2; } 50% { opacity: 1; } }
.chat-input-area {
  display: flex;
  gap: 8px;
  padding: 12px 14px;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
  background: var(--bg-1);
}
.chat-input-area input {
  flex: 1;
  background: var(--bg-0);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 10px 16px;
  color: var(--text-primary);
  font-size: 13px;
  outline: none;
  font-family: var(--font-sans);
  transition: border-color var(--transition);
}
.chat-input-area input::placeholder { color: var(--text-muted); }
.chat-input-area input:focus { border-color: var(--accent); }
.chat-send-btn {
  background: var(--accent);
  border: none;
  border-radius: 50%;
  width: 38px;
  height: 38px;
  color: #fff;
  font-size: 15px;
  cursor: pointer;
  transition: all var(--transition);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.chat-send-btn:hover { opacity: 0.85; transform: scale(1.05); }
.chat-toggle-btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: var(--accent-gradient);
  border: none;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
  z-index: 8999;
  box-shadow: 0 4px 20px rgba(99,102,241,0.35);
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.chat-toggle-btn:hover { transform: scale(1.08); box-shadow: 0 6px 24px rgba(99,102,241,0.45); }
.chat-toggle-btn.hidden { display: none; }
.chat-toggle-btn.chat-notify {
  animation: chatPulse 1s ease infinite;
  box-shadow: 0 0 20px rgba(139,92,246,0.6);
}
@keyframes chatPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }

/* ==================== STALENESS ==================== */
.stale-badge { font-size: 10px; padding: 1px 6px; border-radius: 4px; font-weight: 600; }
.stale-critical { background: var(--red-subtle); color: #fca5a5; }
.stale-warning { background: var(--amber-subtle); color: #fcd34d; }

/* ==================== LOADING ==================== */
.loading-construction { grid-column: 1 / -1; text-align: center; padding: 48px 20px; color: var(--text-tertiary); }
.loading-spinner {
  width: 32px;
  height: 32px;
  border: 2px solid var(--border);
  border-top: 2px solid var(--accent);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  margin: 0 auto 16px;
}
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* ==================== CALLS (FATHOM INTEGRATION) ==================== */
.calls-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(135deg, var(--bg-2), var(--bg-3));
  border-radius: var(--radius-lg);
  padding: 24px 28px;
  margin-bottom: 24px;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border);
}
.calls-title { flex: 1; }
.calls-title h1 { font-size: 22px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
.calls-title p { color: var(--text-tertiary); font-size: 14px; }
.calls-refresh-btn {
  background: var(--accent);
  color: white;
  border: none;
  border-radius: var(--radius-md);
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--transition);
}
.calls-refresh-btn:hover { background: var(--accent-hover); transform: translateY(-1px); }

.ci-search-bar { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
.ci-search-input {
  flex: 1;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 10px 14px;
  color: var(--text-primary);
  font-size: 14px;
  font-family: var(--font-sans);
  outline: none;
  transition: border-color 0.15s;
}
.ci-search-input:focus { border-color: var(--accent); }
.ci-search-input::placeholder { color: var(--text-muted); }
.ci-stats {
  font-size: 12px;
  color: var(--text-tertiary);
  white-space: nowrap;
  font-family: var(--font-mono);
  background: var(--bg-2);
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid var(--border);
}

.upcoming-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 10px 16px;
  margin-bottom: 16px;
}
.upcoming-label { font-size: 12px; font-weight: 600; color: var(--text-tertiary); }
.ub-chip {
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 4px 12px;
  font-size: 12px;
  color: var(--text-secondary);
  cursor: pointer;
  font-family: var(--font-sans);
  transition: all 0.15s;
}
.ub-chip:hover { border-color: var(--accent); color: var(--accent); }
.ub-urgent { color: var(--red); font-weight: 700; }
.ub-soon { color: #eab308; font-weight: 600; }

.ci-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 0;
  border-radius: var(--radius-lg);
  overflow: hidden;
  min-height: 600px;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border);
}
.ci-sidebar {
  background: var(--bg-1);
  border-right: 1px solid var(--border);
  overflow-y: auto;
  max-height: 75vh;
}
.ci-sidebar-loading { padding: 20px; color: var(--text-tertiary); font-size: 13px; text-align: center; }

.ci-person {
  padding: 12px 16px;
  cursor: pointer;
  border-bottom: 1px solid var(--border);
  transition: all 0.15s;
}
.ci-person:hover { background: var(--bg-2); }
.ci-person.active { background: rgba(99,102,241,0.08); border-left: 3px solid var(--accent); }
.ci-person-top { display: flex; justify-content: space-between; align-items: center; }
.ci-person-name { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.ci-upcoming-dot { font-size: 11px; }
.ci-person-count {
  font-size: 10px;
  background: var(--bg-hover);
  color: var(--text-tertiary);
  padding: 1px 6px;
  border-radius: 8px;
  font-family: var(--font-mono);
}
.ci-person-meta { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
.ci-open-actions { color: #eab308; font-weight: 500; }

.ci-detail { background: var(--bg-0); overflow-y: auto; max-height: 75vh; padding: 24px; }
.ci-detail-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; color: var(--text-muted); font-size: 14px; text-align: center; }

.ci-detail-header { margin-bottom: 20px; }
.ci-detail-name { font-size: 24px; font-weight: 700; color: var(--text-primary); margin-bottom: 10px; }
.ci-detail-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.ci-badge {
  font-size: 11px;
  background: var(--bg-2);
  padding: 2px 10px;
  border-radius: 12px;
  color: var(--text-tertiary);
  text-decoration: none;
}
.ci-badge.warn { color: #eab308; }
.ci-badge.ghl { color: var(--green); cursor: pointer; }
.ci-badge.ghl:hover { background: rgba(34,197,94,0.1); }

.ci-upcoming-callout {
  background: var(--accent-subtle);
  border-radius: var(--radius-md);
  padding: 10px 14px;
  font-size: 13px;
  color: var(--accent);
  font-weight: 500;
  margin-bottom: 20px;
}

.ci-section { margin-bottom: 24px; }
.ci-section-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
}

.ci-actions-list { display: flex; flex-direction: column; gap: 4px; }
.ci-action-item {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: 13px;
  color: var(--text-secondary);
  line-height: 1.6;
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  background: rgba(234,179,8,0.04);
  border-left: 2px solid #eab308;
  transition: background 0.1s;
}
.ci-action-item:hover { background: rgba(234,179,8,0.08); }
.ci-action-check { color: #eab308; flex-shrink: 0; font-size: 14px; }
.ci-action-text { flex: 1; }
.ci-action-assignee { font-size: 10px; color: var(--accent); font-weight: 600; flex-shrink: 0; background: var(--accent-subtle); padding: 2px 8px; border-radius: 10px; }

.ci-notes { display: flex; flex-direction: column; gap: 4px; }
.ci-note { font-size: 13px; color: var(--text-secondary); line-height: 1.5; padding: 2px 0; }

/* Timeline */
.ci-timeline { position: relative; padding-left: 20px; }
.ci-timeline::before { content: ''; position: absolute; left: 6px; top: 0; bottom: 0; width: 1px; background: var(--border); }
.ci-timeline-entry { position: relative; margin-bottom: 24px; }
.ci-timeline-dot {
  position: absolute;
  left: -17px;
  top: 4px;
  width: 9px;
  height: 9px;
  background: var(--accent);
  border-radius: 50%;
  border: 2px solid var(--bg-0);
}
.ci-timeline-content { padding-left: 4px; }
.ci-timeline-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.ci-timeline-date { font-size: 12px; font-weight: 600; color: var(--accent); font-family: var(--font-mono); }
.ci-timeline-dur { font-size: 10px; color: var(--text-muted); background: var(--bg-2); padding: 1px 5px; border-radius: 4px; }
.ci-timeline-link { font-size: 11px; color: var(--text-muted); text-decoration: none; }
.ci-timeline-link:hover { color: var(--accent); }
.ci-timeline-purpose { font-size: 13px; color: var(--text-primary); font-weight: 500; margin-bottom: 8px; }

.ci-timeline-topics { margin-bottom: 8px; }
.ci-topic { margin-bottom: 6px; }
.ci-topic-title { font-size: 12px; font-weight: 600; color: var(--text-primary); margin-bottom: 2px; }
.ci-topic-bullet { font-size: 12px; color: var(--text-secondary); line-height: 1.5; padding-left: 8px; }

.ci-timeline-actions { background: var(--bg-1); border-radius: var(--radius-sm); padding: 8px 10px; margin-top: 6px; }
.ci-timeline-action { font-size: 12px; color: var(--text-secondary); padding: 2px 0; }
.ci-timeline-action.done { opacity: 0.5; text-decoration: line-through; }

/* Ledger */
.ledger-header { margin-bottom: 20px; }

/* ==================== RESPONSIVE ==================== */
@media (max-width: 1400px) {
  .kanban-column { min-width: 230px; max-width: 270px; flex: 0 0 230px; }
}
@media (max-width: 1100px) {
  .kanban-column { min-width: 200px; max-width: 240px; flex: 0 0 200px; }
  .kanban-board { gap: 8px; }
  .kanban-card-summary { display: none; }
}
@media (max-width: 900px) {
  .ci-layout { grid-template-columns: 1fr; }
  .ci-sidebar { max-height: 200px; border-right: none; border-bottom: 1px solid var(--border); }
}
@media (max-width: 768px) {
  /* Sidebar overlay mode */
  .sidebar {
    position: fixed;
    transform: translateX(-100%);
    z-index: 1000;
    box-shadow: var(--shadow-lg);
  }
  .sidebar.mobile-open { transform: translateX(0); }
  .app-layout { margin-left: 0 !important; }
  .main { padding: 16px; }
  .kanban-board { flex-direction: column; }
  .kanban-column { min-width: 100%; max-width: 100%; flex: none; max-height: none; }
  .kanban-header { flex-direction: column; align-items: flex-start; }
  .kanban-card-summary { display: block; }
  .construction-header { flex-direction: column; gap: 16px; }
  .construction-subtabs { width: 100%; overflow-x: auto; }
  .subtab { flex: 1; text-align: center; padding: 8px; font-size: 12px; white-space: nowrap; }
  .projects-grid { grid-template-columns: 1fr; }
  .chat-widget { width: calc(100vw - 40px); height: 60vh; }
  .sales-kpis, .kpi-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .sales-kpis, .kpi-grid { grid-template-columns: 1fr; }
  .project-stats { grid-template-columns: 1fr; }
}

/* ==================== ALERTS (legacy) ==================== */
.alerts-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); gap: 16px; }
.alert-card {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  cursor: pointer;
  transition: all var(--transition);
}

/* Executive summary */
.executive-summary { margin-bottom: 24px; }
.kpi-trend { font-size: 12px; padding: 3px 10px; border-radius: var(--radius-md); display: inline-block; }
.kpi-trend.positive { background: var(--green-subtle); color: var(--green); }
.kpi-trend.negative { background: var(--red-subtle); color: var(--red); }

/* Loading states */
.loading-calls {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 48px 20px; color: var(--text-tertiary);
}
.loading-calls .loading-spinner {
  width: 24px; height: 24px; border: 2px solid var(--border);
  border-top-color: var(--accent); border-radius: 50%;
  animation: spin 1s linear infinite; margin-bottom: 12px;
}

/* Generic loading states */
.loading-state {
  display: flex; align-items: center; justify-content: center;
  padding: 24px; color: var(--text-tertiary); font-size: 14px;
}
.loading-state .spinner {
  width: 20px; height: 20px; border: 2px solid var(--border);
  border-top-color: var(--accent); border-radius: 50%;
  animation: spin 1s linear infinite; margin-right: 8px;
}
.section-loading { min-height: 100px; }
.card-loading { min-height: 60px; background: var(--bg-2); border-radius: var(--radius-md); }

/* Empty states */
.empty-state {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 48px 20px; color: var(--text-tertiary); text-align: center;
}
.empty-state .empty-icon {
  font-size: 48px; margin-bottom: 16px; opacity: 0.5;
}
.empty-state .empty-title {
  font-size: 16px; font-weight: 600; margin-bottom: 8px; color: var(--text-secondary);
}
.empty-state .empty-desc {
  font-size: 14px; max-width: 300px; line-height: 1.5;
}

/* Call prep cards (legacy) */
.prep-card { background: var(--bg-2); border-radius: var(--radius-lg); padding: 20px; border-left: 3px solid var(--accent); }
.prep-card.urgent { border-left-color: var(--red); }
.prep-card.soon { border-left-color: #eab308; }
.prep-name { font-size: 18px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
.prep-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.prep-badge { font-size: 10px; background: var(--bg-3); padding: 2px 8px; border-radius: 10px; color: var(--text-tertiary); }
.prep-badge.ghl { color: var(--green); }
.prep-time-badge { text-align: center; padding: 8px 14px; background: var(--bg-3); border-radius: var(--radius-md); }
.prep-time-badge.urgent { background: rgba(239,68,68,0.1); }
.prep-time-badge.soon { background: rgba(234,179,8,0.1); }
.prep-time-label { font-size: 16px; font-weight: 700; color: var(--text-primary); font-family: var(--font-mono); }
.prep-time-detail { font-size: 11px; color: var(--text-tertiary); font-family: var(--font-mono); }
.prep-history { border-top: 1px solid var(--border); padding-top: 14px; }
.prep-history-title { font-size: 12px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; }
.prep-meeting { margin-bottom: 14px; }
.prep-meeting-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.prep-meeting-date { font-size: 12px; font-weight: 600; color: var(--accent); font-family: var(--font-mono); }
.prep-meeting-dur { font-size: 10px; color: var(--text-muted); background: var(--bg-2); padding: 1px 5px; border-radius: 4px; }
.prep-takeaways { margin-bottom: 8px; }
.prep-takeaway { font-size: 12px; color: var(--text-secondary); line-height: 1.5; padding: 1px 0; }
.prep-actions { background: var(--bg-3); border-radius: var(--radius-sm); padding: 8px 10px; }
.prep-actions-label { font-size: 10px; font-weight: 600; color: #eab308; margin-bottom: 4px; }
.prep-action { font-size: 11px; color: var(--text-secondary); padding: 2px 0; }

/* Contact modal */
.contact-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.7); z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 20px; backdrop-filter: blur(4px); }
.contact-modal { background: var(--bg-0); border-radius: var(--radius-lg); max-width: 700px; width: 100%; max-height: 80vh; display: flex; flex-direction: column; }
.contact-modal-header { display: flex; justify-content: space-between; align-items: flex-start; padding: 20px 24px; border-bottom: 1px solid var(--border); }
.contact-modal-name { font-size: 20px; font-weight: 700; color: var(--text-primary); margin-bottom: 8px; }
.contact-modal-close { background: none; border: none; color: var(--text-tertiary); font-size: 20px; cursor: pointer; padding: 4px; }
.contact-modal-close:hover { color: var(--text-primary); }
.contact-modal-body { overflow-y: auto; padding: 20px 24px; }

/* Tab bar (hidden — kept for backward compat but replaced by sidebar) */
.tab-bar { display: none; }

/* ==================== SALES DATE RANGE PICKER ==================== */
.sales-date-range {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding: 12px 16px;
  background: var(--card-bg, #1a1f2e);
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.06);
}
.date-range-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.range-pill {
  padding: 5px 13px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px;
  background: transparent;
  color: #9ca3af;
  cursor: pointer;
  transition: all 0.15s;
  white-space: nowrap;
}
.range-pill:hover {
  border-color: rgba(79,158,255,0.4);
  color: #e5e7eb;
}
.range-pill.active {
  background: rgba(79,158,255,0.15);
  border-color: #4f9eff;
  color: #4f9eff;
  font-weight: 600;
}
.date-range-custom {
  display: flex;
  align-items: center;
  gap: 8px;
}
.date-range-custom input[type="date"] {
  padding: 5px 10px;
  font-size: 12px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 8px;
  color: #e5e7eb;
  outline: none;
}
.date-range-custom input[type="date"]:focus {
  border-color: #4f9eff;
}
.range-apply-btn {
  padding: 5px 14px;
  font-size: 12px;
  font-weight: 600;
  background: #4f9eff;
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}
.range-apply-btn:hover { background: #3b8de6; }
.date-range-label {
  font-size: 12px;
  color: #6b7280;
  margin-left: auto;
  white-space: nowrap;
}
.new-closer-badge {
  display: inline-block;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 600;
  background: rgba(234,179,8,0.2);
  color: #eab308;
  border-radius: 10px;
  margin-left: 8px;
}

/* ==================== CLOSE LEDGER ==================== */

/* Summary Cards */
.close-ledger-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.close-ledger-card {
  background: var(--bg-2);
  padding: 20px;
  border-radius: var(--radius-lg);
  text-align: center;
  box-shadow: var(--shadow-card);
  transition: transform 200ms ease, box-shadow 200ms ease;
  position: relative;
  overflow: hidden;
}

.close-ledger-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--accent-gradient);
  opacity: 0.5;
}

.close-ledger-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md), 0 0 20px rgba(79,158,255,0.08);
}

.close-ledger-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 4px;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

.close-ledger-label {
  color: var(--text-tertiary);
  font-weight: 500;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}

.close-ledger-sublabel {
  color: var(--text-muted);
  font-size: 13px;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

/* Filter Bar */
.close-ledger-filters {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 20px;
  margin-bottom: 24px;
  box-shadow: var(--shadow-card);
}

.filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 16px;
  margin-bottom: 12px;
}

.filter-row:last-child {
  margin-bottom: 0;
}

.filter-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.filter-group label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.filter-group input,
.filter-group select {
  padding: 8px 12px;
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  font-size: 13px;
  min-width: 120px;
  transition: all var(--transition);
}

.filter-group input:focus,
.filter-group select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(79,158,255,0.15);
}

.filter-group input[type="text"] {
  min-width: 200px;
}

.filter-buttons {
  display: flex;
  gap: 8px;
  align-items: end;
}

.filter-apply-btn,
.filter-reset-btn,
.filter-export-btn {
  padding: 8px 16px;
  border: none;
  border-radius: var(--radius-sm);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--transition);
}

.filter-apply-btn {
  background: var(--accent);
  color: white;
}

.filter-apply-btn:hover {
  background: var(--accent-hover);
}

.filter-reset-btn {
  background: var(--bg-3);
  color: var(--text-secondary);
  border: 1px solid var(--border);
}

.filter-reset-btn:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}

.filter-export-btn {
  background: var(--green);
  color: white;
}

.filter-export-btn:hover {
  background: rgba(34,197,94,0.8);
}

/* Table */
.close-ledger-table-container {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  overflow: hidden;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  box-shadow: var(--shadow-card);
  margin-bottom: 24px;
}

.close-ledger-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.close-ledger-table th {
  background: var(--bg-3);
  text-align: left;
  padding: 12px;
  color: var(--text-tertiary);
  font-weight: 600;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  white-space: nowrap;
  position: sticky;
  top: 0;
  z-index: 10;
  transition: all var(--transition);
}

.close-ledger-table th:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}

.close-ledger-table th.sorted-asc::after {
  content: ' ▲';
  font-size: 9px;
  color: var(--accent);
}

.close-ledger-table th.sorted-desc::after {
  content: ' ▼';
  font-size: 9px;
  color: var(--accent);
}

.close-ledger-table td {
  padding: 12px;
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  vertical-align: middle;
}

.close-ledger-table tbody tr {
  cursor: pointer;
  transition: all var(--transition);
}

.close-ledger-table tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.02);
}

.close-ledger-table tbody tr:hover {
  background: var(--bg-3);
  color: var(--text-primary);
}

.close-ledger-table .amount-cell {
  text-align: right;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--text-primary);
}

/* Type Badges */
.type-badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 12px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.type-blue {
  background: var(--blue-subtle);
  color: var(--blue);
}

.type-amber {
  background: var(--amber-subtle);
  color: var(--amber);
}

.type-purple {
  background: rgba(168,85,247,0.12);
  color: #a855f7;
}

.type-gray {
  background: var(--bg-3);
  color: var(--text-muted);
}

.type-cyan {
  background: rgba(34,211,238,0.12);
  color: #22d3ee;
}

.type-green {
  background: var(--green-subtle);
  color: var(--green);
}

/* Detail Rows */
.detail-row td {
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

.detail-cell {
  padding: 0 !important;
}

.detail-content {
  background: var(--bg-0);
  padding: 16px 20px;
  border-radius: var(--radius-sm);
  margin: 4px 12px 8px;
  border-left: 3px solid var(--accent);
}

.detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  font-size: 12px;
  color: var(--text-secondary);
}

.detail-grid strong {
  color: var(--text-tertiary);
  font-weight: 600;
}

/* Pagination */
.close-ledger-pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--bg-2);
  padding: 16px 20px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}

.pagination-info {
  color: var(--text-secondary);
  font-size: 13px;
}

.pagination-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.page-size-select {
  padding: 6px 10px;
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-primary);
  font-size: 13px;
  cursor: pointer;
}

.pagination-controls button {
  padding: 6px 12px;
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-secondary);
  font-size: 12px;
  cursor: pointer;
  transition: all var(--transition);
}

.pagination-controls button:hover:not(:disabled) {
  background: var(--bg-hover);
  color: var(--text-primary);
  border-color: var(--border-active);
}

.pagination-controls button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.page-number {
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 600;
  min-width: 100px;
  text-align: center;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .close-ledger-summary {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
  }
  
  .filter-row {
    flex-direction: column;
    align-items: stretch;
  }
  
  .filter-group {
    width: 100%;
  }
  
  .filter-group input,
  .filter-group select {
    min-width: auto;
    width: 100%;
  }
  
  .filter-buttons {
    width: 100%;
    justify-content: space-between;
  }
  
  .close-ledger-table-container {
    overflow-x: auto;
  }
  
  .close-ledger-pagination {
    flex-direction: column;
    gap: 12px;
    text-align: center;
  }
}

/* ==================== NEW SETTER PERFORMANCE STYLES ==================== */

.setter-team {
  margin-bottom: 2rem;
}

.setter-team-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 1rem;
  padding-left: 0.5rem;
}

.setter-team-members {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
}

.setter-card-new {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 1.25rem;
  transition: var(--transition);
}

.setter-card-new:hover {
  border-color: var(--border-active);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.setter-card-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.setter-avatar {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: 600;
  font-size: 1rem;
}

.setter-name-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-primary);
}

.setter-metrics-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.setter-metric-section {
  background: var(--bg-1);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  padding: 0.875rem;
}

.metric-section-title {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--text-secondary);
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.metric-main {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 0.25rem;
}

.metric-sub {
  font-size: 0.8rem;
  color: var(--text-tertiary);
}

.metric-weekly {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  font-size: 0.75rem;
  color: var(--text-tertiary);
  margin-top: 0.5rem;
}

.metric-weekly span {
  background: var(--bg-3);
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
}

.metric-breakdown {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.metric-breakdown > div {
  font-size: 0.8rem;
  color: var(--text-tertiary);
}

/* TYPE AND CHANNEL BADGES */

.type-badge, .channel-badge {
  font-size: 0.65rem;
  padding: 0.2rem 0.4rem;
  border-radius: 4px;
  font-weight: 600;
  margin-left: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.type-new { background: var(--green-subtle); color: var(--green); }
.type-upsell { background: var(--blue-subtle); color: var(--blue); }
.type-outstanding { background: var(--amber-subtle); color: var(--amber); }
.type-split { background: var(--red-subtle); color: var(--red); }
.type-dd { background: #6b7280; color: #f3f4f6; }
.type-organic { background: #4b5563; color: #d1d5db; }

.channel-whop { background: var(--accent-subtle); color: var(--accent); }
.channel-financed { background: var(--amber-subtle); color: var(--amber); }
.channel-dd { background: #6b7280; color: #f3f4f6; }
.channel-shopify { background: var(--green-subtle); color: var(--green); }

/* ==================== RESPONSIVE OVERHAUL ==================== */

/* Mobile menu button */
.mobile-menu-btn {
  display: none;
  background: none;
  border: none;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 4px;
  margin-right: 8px;
  border-radius: var(--radius-sm);
}
.mobile-menu-btn:hover { color: var(--text-primary); background: var(--bg-3); }
@media (max-width: 768px) {
  .mobile-menu-btn { display: flex; align-items: center; }
}

/* Mobile sidebar overlay backdrop */
@media (max-width: 768px) {
  .sidebar.mobile-open ~ .app-layout::before {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 999;
  }
}

/* Global overflow prevention */
html { overflow-x: hidden; }
.main { max-width: 100%; overflow-x: hidden; }
.tab-content { min-width: 0; }

/* Ensure all flex children can shrink */
.costs-agent-col,
.command-section,
.sales-detail-card,
.projection-card,
.kpi-card,
.sales-kpi-card { min-width: 0; }

/* All tables get horizontal scroll */
.close-ledger-table-container,
.financial-table-wrap,
.costs-table-wrap,
.sales-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Sales subtabs scroll on narrow */
.sales-subtabs { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.construction-subtabs { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }

/* Date range pills wrap */
.date-range-pills { flex-wrap: wrap; }

/* Costs chart bars shouldn't overflow */
.costs-chart { overflow-x: auto; min-height: 160px; }

/* Sales bar chart responsive */
.sales-bar-chart { overflow-x: auto; min-width: 0; }

/* ---- 1200px breakpoint ---- */
@media (max-width: 1200px) {
  .costs-kpi-layout { grid-template-columns: 1fr 1.4fr 1fr; }
  .kpi-grid-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .command-center-grid { grid-template-columns: 1fr; }
  .projection-stats { grid-template-columns: repeat(3, 1fr); }
  .setter-team-members { grid-template-columns: 1fr; }
}

/* ---- 1024px breakpoint ---- */
@media (max-width: 1024px) {
  .costs-agent-grid { grid-template-columns: 1fr; }
  .costs-kpi-layout { grid-template-columns: 1fr; }
  .costs-kpi-pair { flex-wrap: wrap; }
  .closer-performance-grid { grid-template-columns: 1fr; }
  .setter-performance-groups { grid-template-columns: 1fr; }
  .sales-team-grid { grid-template-columns: 1fr; }
  .sales-setter-group .sales-team-grid { grid-template-columns: 1fr; }
  .sales-forecast-grid { grid-template-columns: repeat(2, 1fr); }
  .projects-grid { grid-template-columns: 1fr; }
  .construction-stats { gap: 16px; }
  .construction-header { flex-direction: column; gap: 16px; }
}

/* ---- 768px breakpoint (existing enhanced) ---- */
@media (max-width: 768px) {
  .kpi-grid-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .projection-stats { grid-template-columns: 1fr 1fr; }
  .construction-stats { flex-wrap: wrap; justify-content: center; }
  .sales-detail-metrics { grid-template-columns: repeat(2, 1fr); }
  .closer-metrics { grid-template-columns: repeat(2, 1fr); }
  .header { padding: 0 16px; }
  .header-right { gap: 8px; }
  .sales-funnel { flex-direction: column; }
  .sales-funnel-arrow { transform: rotate(90deg); }
  .costs-agent-onyx, .costs-agent-nova { padding-left: 10px; }
  .model-card { min-width: 140px; }
  .setter-metrics-grid { grid-template-columns: 1fr; }
  .sales-subtabs { width: 100%; }
  .sales-subtabs .subtab { white-space: nowrap; flex-shrink: 0; }
  .filter-row { flex-direction: column; align-items: stretch; }
  .filter-group { width: 100%; }
  .filter-group input, .filter-group select { min-width: auto; width: 100%; }
  .close-ledger-pagination { flex-direction: column; gap: 12px; text-align: center; }
  .pagination-controls { flex-wrap: wrap; justify-content: center; }
}

/* ---- 480px breakpoint ---- */
@media (max-width: 480px) {
  .kpi-grid-6 { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: 1fr; }
  .sales-kpis { grid-template-columns: 1fr; }
  .close-ledger-summary { grid-template-columns: 1fr; }
  .projection-stats { grid-template-columns: 1fr; }
  .main { padding: 12px; }
  .kpi-card { padding: 16px; gap: 12px; }
  .kpi-value { font-size: 20px; }
  .sales-kpi-value { font-size: 28px; }
  .construction-stats { flex-direction: column; align-items: center; }
  .costs-agent-header { flex-wrap: wrap; gap: 8px; }
  .costs-agent-name { font-size: 14px; }
  .costs-agent-spend { font-size: 16px; }
  .sales-detail-metrics { grid-template-columns: 1fr 1fr; }
  .closer-metrics { grid-template-columns: 1fr; }
  .sales-forecast-grid { grid-template-columns: 1fr; }
  .financial-kpis { grid-template-columns: 1fr 1fr; }
  .pm-stats, .cra-stats, .ai-stats { grid-template-columns: 1fr; }
  .ci-layout { grid-template-columns: 1fr; }
  .ci-sidebar { max-height: 200px; border-right: none; border-bottom: 1px solid var(--border); }
  .ci-detail { padding: 16px; }
  .ci-detail-name { font-size: 18px; }
  .calls-header { flex-direction: column; gap: 12px; align-items: flex-start; }
  .chat-widget { width: calc(100vw - 24px); right: 12px; }
  .bookings-kpis { grid-template-columns: repeat(3, 1fr) !important; }
}

/* ==================== NESTED SUBTABS ==================== */
.nested-subtabs {
  display: flex;
  gap: 4px;
  margin-bottom: 16px;
  padding: 3px;
  background: var(--bg-3);
  border-radius: 12px;
  width: fit-content;
}
.nested-subtab {
  padding: 6px 14px;
  border: none;
  border-radius: 9px;
  cursor: pointer;
  background: transparent;
  color: var(--text-tertiary);
  font-size: 12px;
  font-weight: 500;
  font-family: var(--font-sans);
  transition: all var(--transition);
}
.nested-subtab:hover { color: var(--text-primary); }
.nested-subtab.active {
  background: var(--bg-1);
  color: var(--text-primary);
  box-shadow: var(--shadow-sm);
}
.nested-content { display: none; animation: salesFadeIn 200ms ease; }
.nested-content.active { display: block; }

/* ==================== BOOKINGS LEDGER ==================== */
.bookings-kpis {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.bookings-kpi {
  background: var(--bg-2);
  border-radius: var(--radius-md);
  padding: 18px;
  text-align: center;
  box-shadow: var(--shadow-card);
  position: relative;
  overflow: hidden;
}
.bookings-kpi::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--accent-gradient);
  opacity: 0.4;
}
.bookings-kpi-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--text-primary);
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
.bookings-kpi-label {
  font-size: 11px;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 4px;
}
.bookings-kpi-shirly::before { background: linear-gradient(135deg, #8b5cf6, #a78bfa); opacity: 0.8; }
.bookings-kpi-jev::before { background: linear-gradient(135deg, #3b82f6, #60a5fa); opacity: 0.8; }
.bookings-kpi-organic::before { background: linear-gradient(135deg, #6b7280, #9ca3af); opacity: 0.8; }

.setter-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 600;
}
.setter-shirly { background: rgba(139, 92, 246, 0.15); color: #c4b5fd; }
.setter-jev { background: rgba(59, 130, 246, 0.15); color: #93c5fd; }
.setter-organic { background: rgba(107, 114, 128, 0.15); color: #9ca3af; }

.bk-status-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: capitalize;
}
.bk-status-confirmed { background: var(--blue-subtle); color: var(--blue); }
.bk-status-showed { background: var(--green-subtle); color: var(--green); }
.bk-status-no_show, .bk-status-no-show { background: var(--red-subtle); color: var(--red); }
.bk-status-cancelled { background: rgba(107, 114, 128, 0.15); color: #9ca3af; }
.bk-status-upcoming { background: rgba(59, 130, 246, 0.12); color: #3b82f6; }
.bk-status-rescheduled { background: rgba(245, 158, 11, 0.12); color: #f59e0b; }
.booking-type-new { background: rgba(16,185,129,0.15); color: #10b981; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; }
.booking-type-reschedule { background: rgba(245,158,11,0.15); color: #f59e0b; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; }
.booking-attr-icon { font-size: 12px; margin-right: 4px; }


/* Booking Override */
.booking-override-btn { cursor: pointer; opacity: 0.5; font-size: 12px; margin-left: 4px; display: inline; }
.booking-override-btn:hover { opacity: 1; }
.booking-attr-manual { color: #f59e0b; }
.override-modal { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius-lg, 12px); padding: 24px; z-index: 1000; min-width: 300px; box-shadow: var(--shadow-lg, 0 8px 32px rgba(0,0,0,0.3)); }
.override-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 999; }

/* ==================== AI INSIGHTS & AUTOMATION ==================== */
.ai-insights-container {
  padding: 24px;
  max-width: 1400px;
  margin: 0 auto;
}

.ai-insights-header {
  margin-bottom: 32px;
  text-align: center;
}

.ai-insights-header h2 {
  color: var(--text-primary);
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 8px;
  background: var(--accent-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ai-insights-header p {
  color: var(--text-secondary);
  font-size: 16px;
}

.ai-insights-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 24px;
  grid-template-areas: 
    "insights automation"
    "leads leads";
}

.ai-insights-panel {
  grid-area: insights;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 24px;
}

.ai-automation-panel {
  grid-area: automation;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 24px;
}

.ai-leads-panel {
  grid-area: leads;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 24px;
}

.ai-insights-panel h3,
.ai-automation-panel h3,
.ai-leads-panel h3 {
  color: var(--text-primary);
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.ai-insight-card {
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px;
  margin-bottom: 12px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  transition: var(--transition);
}

.ai-insight-card:hover {
  border-color: var(--border-active);
  background: var(--bg-hover);
}

.ai-insight-icon {
  font-size: 20px;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 2px;
}

.ai-insight-content {
  flex: 1;
}

.ai-insight-title {
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 4px;
}

.ai-insight-message {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.4;
}

.ai-insight-priority {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  margin-top: 8px;
}

.ai-insight-priority.high {
  background: var(--red-subtle);
  color: var(--red);
}

.ai-insight-priority.medium {
  background: var(--amber-subtle);
  color: var(--amber);
}

.ai-insight-priority.low {
  background: var(--blue-subtle);
  color: var(--blue);
}

.automation-status-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px;
  background: var(--bg-3);
  border-radius: var(--radius-md);
  margin-bottom: 12px;
  transition: var(--transition);
}

.automation-status-item:hover {
  background: var(--bg-hover);
}

.status-indicator {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 4px;
}

.status-indicator.status-ready {
  background: var(--green);
  box-shadow: 0 0 8px rgba(34, 197, 94, 0.5);
}

.status-indicator.status-monitoring {
  background: var(--blue);
  animation: pulse 2s infinite;
}

.status-indicator.status-disabled {
  background: var(--text-muted);
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.status-content {
  flex: 1;
}

.status-title {
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 4px;
}

.status-desc {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.4;
}

.booking-ready-lead {
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px;
  margin-bottom: 12px;
  transition: var(--transition);
}

.booking-ready-lead:hover {
  border-color: var(--border-active);
  background: var(--bg-hover);
}

.lead-header {
  display: flex;
  justify-content: between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.lead-info h4 {
  color: var(--text-primary);
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 4px;
}

.lead-info p {
  color: var(--text-secondary);
  font-size: 13px;
}

.lead-confidence {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}

.lead-confidence.high {
  background: var(--green-subtle);
  color: var(--green);
}

.lead-confidence.medium {
  background: var(--amber-subtle);
  color: var(--amber);
}

.lead-signals {
  margin-top: 12px;
}

.lead-signals h5 {
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 6px;
}

.lead-signals-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.lead-signal {
  background: var(--accent-subtle);
  color: var(--accent);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 500;
}

@media (max-width: 768px) {
  .ai-insights-grid {
    grid-template-columns: 1fr;
    grid-template-areas: 
      "insights"
      "automation"
      "leads";
  }
}

/* ==================== QUALIFIED LEADS LEDGER ==================== */
.leads-ledger-controls {
  display: flex;
  justify-content: between;
  align-items: center;
  margin-bottom: 16px;
  gap: 12px;
}

.leads-filter select {
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  padding: 6px 12px;
  font-size: 12px;
}

.qualified-lead-card {
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px;
  margin-bottom: 12px;
  transition: var(--transition);
}

.qualified-lead-card:hover {
  border-color: var(--border-active);
  background: var(--bg-hover);
}

.lead-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.lead-card-info h4 {
  color: var(--text-primary);
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 4px;
}

.lead-card-info .lead-contact {
  color: var(--text-secondary);
  font-size: 13px;
  margin-bottom: 2px;
}

.lead-card-info .lead-handler {
  color: var(--text-tertiary);
  font-size: 12px;
}

.lead-status {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  white-space: nowrap;
}

.lead-status.ready-to-book {
  background: var(--green-subtle);
  color: var(--green);
}

.lead-status.needs-phone {
  background: var(--amber-subtle);
  color: var(--amber);
}

.lead-status.needs-contact {
  background: var(--red-subtle);
  color: var(--red);
}

.lead-status.qualifying {
  background: var(--blue-subtle);
  color: var(--blue);
}

.lead-status.booked {
  background: var(--accent-subtle);
  color: var(--accent);
}

.lead-status.early-stage {
  background: rgba(107, 114, 128, 0.15);
  color: #9ca3af;
}

.lead-card-body {
  margin-bottom: 12px;
}

.lead-qualification-score {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.qualification-score-bar {
  flex: 1;
  height: 6px;
  background: var(--bg-2);
  border-radius: 3px;
  overflow: hidden;
}

.qualification-score-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}

.qualification-score-fill.low {
  background: var(--red);
}

.qualification-score-fill.medium {
  background: var(--amber);
}

.qualification-score-fill.high {
  background: var(--green);
}

.lead-signals-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}

.lead-signals-col h5 {
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 6px;
}

.lead-signals-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.lead-signal-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--text-secondary);
}

.lead-signal-icon {
  color: var(--green);
  font-size: 10px;
}

.lead-suggestions-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.lead-suggestion-item {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 12px;
  color: var(--text-secondary);
  padding: 6px 8px;
  background: var(--bg-2);
  border-radius: var(--radius-sm);
}

.lead-suggestion-icon {
  color: var(--accent);
  font-size: 12px;
  margin-top: 1px;
}

.lead-card-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 12px;
  border-top: 1px solid var(--border-subtle);
}

.lead-card-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  color: var(--text-tertiary);
}

.lead-card-buttons {
  display: flex;
  gap: 8px;
}

.lead-action-btn {
  padding: 6px 12px;
  border: 1px solid var(--border);
  background: var(--bg-2);
  color: var(--text-primary);
  border-radius: var(--radius-sm);
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  transition: var(--transition);
}

.lead-action-btn:hover {
  border-color: var(--border-active);
  background: var(--bg-hover);
}

.lead-action-btn.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}

.lead-action-btn.primary:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}

.lead-action-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.leads-empty {
  text-align: center;
  padding: 32px;
  color: var(--text-secondary);
}

.leads-empty-icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: 0.5;
}

.booking-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 24px;
  z-index: 1000;
  min-width: 400px;
  max-width: 500px;
  box-shadow: var(--shadow-lg);
}

.booking-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 999;
}

.booking-modal h3 {
  color: var(--text-primary);
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 16px;
}

.booking-form-group {
  margin-bottom: 16px;
}

.booking-form-group label {
  display: block;
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 6px;
}

.booking-form-group input,
.booking-form-group textarea {
  width: 100%;
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  padding: 8px 12px;
  font-size: 13px;
}

.booking-form-group input:focus,
.booking-form-group textarea:focus {
  outline: none;
  border-color: var(--accent);
}

.booking-form-group textarea {
  resize: vertical;
  min-height: 80px;
}

.booking-modal-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 20px;
}

/* ==================== WHATSAPP TAB ==================== */
.wa-dashboard { display: flex; flex-direction: column; height: calc(100vh - 80px); gap: 0; }
.wa-status-bar { display: flex; gap: 24px; padding: 12px 20px; background: rgba(79,158,255,0.06); border: 1px solid var(--border, #1e2a3a); border-radius: 10px; margin-bottom: 12px; align-items: center; flex-shrink: 0; }
.wa-status-item { display: flex; align-items: center; gap: 6px; font-size: 0.85rem; color: #8b95a5; }
.wa-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.wa-dot.online { background: #10b981; box-shadow: 0 0 6px #10b981; }
.wa-dot.offline { background: #ef4444; box-shadow: 0 0 6px #ef4444; }
.wa-layout { display: flex; gap: 12px; flex: 1; min-height: 0; }
.wa-sidebar { width: 30%; min-width: 280px; display: flex; flex-direction: column; background: rgba(255,255,255,0.02); border: 1px solid var(--border, #1e2a3a); border-radius: 10px; overflow: hidden; }
.wa-search-wrap { padding: 10px; flex-shrink: 0; }
.wa-search { width: 100%; padding: 8px 12px; background: rgba(255,255,255,0.05); border: 1px solid var(--border, #1e2a3a); border-radius: 8px; color: #fff; font-size: 0.85rem; outline: none; }
.wa-search:focus { border-color: #4f9eff; }
.wa-category-tabs { display: flex; gap: 4px; padding: 0 10px 8px; flex-wrap: wrap; flex-shrink: 0; }
.wa-cat-btn { padding: 3px 10px; border-radius: 12px; border: 1px solid var(--border, #1e2a3a); background: transparent; color: #8b95a5; font-size: 0.75rem; cursor: pointer; transition: all 0.15s; }
.wa-cat-btn.active, .wa-cat-btn:hover { background: rgba(79,158,255,0.15); color: #4f9eff; border-color: #4f9eff; }
.wa-group-list { flex: 1; overflow-y: auto; padding: 4px; }
.wa-group-item { padding: 10px 12px; border-radius: 8px; cursor: pointer; transition: background 0.15s; border-bottom: 1px solid rgba(255,255,255,0.03); }
.wa-group-item:hover { background: rgba(79,158,255,0.08); }
.wa-group-item.active { background: rgba(79,158,255,0.15); border-left: 3px solid #4f9eff; }
.wa-group-name { color: #e2e8f0; font-size: 0.9rem; font-weight: 500; margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-group-meta { display: flex; gap: 8px; font-size: 0.75rem; color: #6b7280; align-items: center; }
.wa-group-cat { padding: 1px 6px; border-radius: 4px; font-size: 0.65rem; font-weight: 600; }
.wa-cat-mpm { background: rgba(16,185,129,0.15); color: #10b981; }
.wa-cat-rgo { background: rgba(79,158,255,0.15); color: #4f9eff; }
.wa-cat-cfc { background: rgba(245,158,11,0.15); color: #f59e0b; }
.wa-cat-exec { background: rgba(139,92,246,0.15); color: #8b5cf6; }
.wa-cat-dm { background: rgba(236,72,153,0.15); color: #ec4899; }
.wa-cat-other { background: rgba(107,114,128,0.15); color: #6b7280; }
.wa-messages-panel { flex: 1; display: flex; flex-direction: column; background: rgba(255,255,255,0.02); border: 1px solid var(--border, #1e2a3a); border-radius: 10px; overflow: hidden; min-width: 0; }
.wa-messages-header { padding: 12px 16px; border-bottom: 1px solid var(--border, #1e2a3a); display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.wa-messages-header h3 { margin: 0; color: #e2e8f0; font-size: 1rem; }
.wa-messages-subtitle { color: #6b7280; font-size: 0.8rem; }
.wa-back-btn { margin-left: auto; background: rgba(79,158,255,0.1); color: #4f9eff; border: 1px solid rgba(79,158,255,0.3); border-radius: 6px; padding: 4px 12px; font-size: 0.8rem; cursor: pointer; }
.wa-back-btn:hover { background: rgba(79,158,255,0.2); }
.wa-messages-feed { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 6px; }
.wa-msg { padding: 10px 14px; background: rgba(255,255,255,0.03); border-radius: 8px; }
.wa-msg-header { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; flex-wrap: wrap; }
.wa-msg-sender { color: #4f9eff; font-weight: 600; font-size: 0.85rem; }
.wa-msg-group { background: rgba(79,158,255,0.12); color: #4f9eff; padding: 1px 8px; border-radius: 10px; font-size: 0.7rem; }
.wa-msg-type { padding: 1px 8px; border-radius: 10px; font-size: 0.7rem; font-weight: 500; }
.wa-msg-time { margin-left: auto; color: #6b7280; font-size: 0.75rem; white-space: nowrap; }
.wa-msg-text { color: #c9d1d9; font-size: 0.85rem; line-height: 1.5; white-space: pre-wrap; word-break: break-word; }
.wa-loading, .wa-empty, .wa-error { display: flex; align-items: center; justify-content: center; padding: 40px; color: #6b7280; font-size: 0.9rem; }
.wa-error { color: #ef4444; }

/* ==================== TYPE FILTER CHECKBOXES ==================== */

.filter-group-types {
    flex: 1.5 !important; /* Make type filter take up more space */
}

.type-filter-container {
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 12px;
    min-width: 280px;
}

.type-filter-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-subtle);
}

.type-invert-btn {
    background: var(--bg-3);
    border: 1px solid var(--border);
    color: var(--text-secondary);
    padding: 4px 8px;
    border-radius: var(--radius-sm);
    font-size: 11px;
    cursor: pointer;
    transition: var(--transition);
}

.type-invert-btn:hover {
    background: var(--bg-hover);
    color: var(--text-primary);
}

.type-checkboxes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-bottom: 8px;
}

.type-checkbox-item {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 4px 6px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    font-size: 13px;
}

.type-checkbox-item:hover {
    background: var(--bg-hover);
}

.type-checkbox-item input[type="checkbox"] {
    width: 14px;
    height: 14px;
    margin-right: 8px;
    cursor: pointer;
    accent-color: var(--accent);
}

.type-label {
    color: var(--text-secondary);
    font-weight: 500;
    transition: var(--transition);
}

.type-checkbox-item:has(input:checked) .type-label {
    color: var(--text-primary);
}

.type-filter-header .type-checkbox-item .type-label {
    color: var(--text-primary);
    font-weight: 600;
}

.type-filter-summary {
    font-size: 11px;
    color: var(--text-tertiary);
    text-align: center;
    padding-top: 8px;
    border-top: 1px solid var(--border-subtle);
}

/* Mobile responsiveness for type filter */
@media (max-width: 768px) {
    .type-filter-container {
        min-width: auto;
        width: 100%;
    }
    
    .type-checkboxes {
        grid-template-columns: 1fr;
    }
    
    .filter-group-types {
        flex: 1 !important;
        min-width: 100%;
    }
}


/* ==================== LEADS FUNNEL ==================== */
.leads-funnel-dashboard { padding: 0; }

.leads-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.leads-kpi-card {
    background: var(--card-bg, #1e1e2e);
    border: 1px solid var(--border-subtle, #2a2a3e);
    border-radius: 12px;
    padding: 20px;
    text-align: center;
}

.leads-kpi-card.critical {
    border-width: 2px;
    border-color: #ef4444;
}

.leads-kpi-value {
    font-size: 2rem;
    font-weight: 700;
    color: #f1f5f9;
}

.leads-kpi-label {
    font-size: 0.85rem;
    color: #9ca3af;
    margin-top: 4px;
}

.leads-section {
    background: var(--card-bg, #1e1e2e);
    border: 1px solid var(--border-subtle, #2a2a3e);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
}

.leads-section-title {
    font-size: 1rem;
    font-weight: 600;
    color: #f1f5f9;
    margin: 0 0 16px 0;
}

.leads-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

/* Funnel */
.funnel-stages { display: flex; flex-direction: column; gap: 8px; }

.funnel-stage {
    display: grid;
    grid-template-columns: 120px 1fr 50px;
    align-items: center;
    gap: 12px;
}

.funnel-label { font-size: 0.85rem; color: #cbd5e1; font-weight: 500; }

.funnel-bar-container {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 6px;
    height: 32px;
    overflow: hidden;
}

.funnel-bar {
    height: 100%;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: width 0.6s ease;
    min-width: 40px;
}

.funnel-value { font-size: 0.8rem; font-weight: 700; color: #fff; }

.funnel-rate { font-size: 0.75rem; color: #9ca3af; text-align: right; }

.funnel-overall {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border-subtle, #2a2a3e);
    text-align: right;
    font-size: 0.85rem;
    color: #9ca3af;
}

.funnel-overall strong { color: #22c55e; }

/* Team Breakdown */
.team-row {
    display: grid;
    grid-template-columns: 140px 1fr 50px;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
}

.team-row.team-unassigned .team-name { color: #ef4444; font-weight: 600; }

.team-name { font-size: 0.85rem; color: #cbd5e1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.team-count { font-size: 0.85rem; color: #f1f5f9; font-weight: 600; text-align: right; }

.team-bar-wrap {
    height: 20px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 4px;
    overflow: hidden;
}

.team-bar { height: 100%; border-radius: 4px; transition: width 0.5s ease; }

/* Setter Table */
.leads-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.leads-table th { text-align: left; padding: 8px 10px; color: #9ca3af; font-weight: 500; border-bottom: 1px solid var(--border-subtle, #2a2a3e); }
.leads-table td { padding: 8px 10px; color: #cbd5e1; border-bottom: 1px solid rgba(255, 255, 255, 0.03); }
.leads-table tr:hover td { background: rgba(255, 255, 255, 0.03); }

.rate-good { color: #22c55e !important; font-weight: 600; }
.rate-ok { color: #f59e0b !important; font-weight: 600; }
.rate-bad { color: #ef4444 !important; font-weight: 600; }

/* Daily Volume Chart */
.daily-chart {
    display: flex;
    align-items: flex-end;
    gap: 6px;
    height: 160px;
    padding-top: 20px;
}

.daily-bar-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.daily-bar {
    width: 100%;
    max-width: 40px;
    border-radius: 4px 4px 0 0;
    transition: height 0.5s ease;
}

.daily-label { font-size: 0.65rem; color: #6b7280; white-space: nowrap; }
.daily-count { font-size: 0.7rem; color: #9ca3af; font-weight: 600; }

@media (max-width: 768px) {
    .leads-kpis { grid-template-columns: repeat(2, 1fr); }
    .leads-grid { grid-template-columns: 1fr; }
    .funnel-stage { grid-template-columns: 80px 1fr 40px; }
    .team-row { grid-template-columns: 100px 1fr 40px; }
}

/* ==================== ORG TREE ==================== */
.org-dashboard { padding: 0; }
.org-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; flex-wrap:wrap; gap:16px; }
.org-title h1 { color:var(--text-primary); font-size:1.5rem; font-weight:700; }
.org-title p { color:var(--text-tertiary); font-size:0.85rem; margin-top:4px; }
.org-view-toggle { display:flex; gap:4px; background:var(--bg-2); border-radius:var(--radius-sm); padding:3px; }
.org-view-btn { padding:8px 16px; border:none; background:transparent; color:var(--text-secondary); border-radius:6px; cursor:pointer; font-size:0.85rem; font-family:var(--font-sans); transition:var(--transition); }
.org-view-btn.active { background:var(--accent); color:#fff; }
.org-view { display:none; }
.org-view.active { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* Tree nodes */
.org-tree { display:flex; flex-direction:column; align-items:center; gap:0; min-width:max-content; }
.org-node { display:flex; flex-direction:column; align-items:center; }
.org-node-card { display:flex; align-items:center; gap:10px; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-md); padding:10px 16px; cursor:pointer; transition:var(--transition); position:relative; min-width:180px; }
.org-node-card:hover { border-color:var(--accent); background:var(--bg-3); }
.org-node-card.expanded { border-color:var(--accent); }
.org-node-card.ceo { background:linear-gradient(135deg, rgba(99,102,241,0.15), rgba(139,92,246,0.1)); border-color:rgba(99,102,241,0.3); }
.org-node-card.ai { background:linear-gradient(135deg, rgba(34,197,94,0.1), rgba(16,185,129,0.08)); border-color:rgba(34,197,94,0.2); }
.org-node-card.dept { background:var(--bg-3); border-style:dashed; }
.org-avatar { width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:600; color:#fff; flex-shrink:0; }
.org-avatar.person { background:var(--accent-gradient); }
.org-avatar.ai-avatar { background:linear-gradient(135deg,#22c55e,#10b981); }
.org-avatar.dept-avatar { background:var(--bg-hover); color:var(--text-secondary); font-size:16px; }
.org-node-info { display:flex; flex-direction:column; gap:2px; }
.org-node-name { color:var(--text-primary); font-size:0.85rem; font-weight:600; white-space:nowrap; }
.org-node-role { color:var(--text-tertiary); font-size:0.72rem; white-space:nowrap; }
.org-status { width:8px; height:8px; border-radius:50%; position:absolute; top:8px; right:8px; }
.org-status.online { background:var(--green); box-shadow:0 0 6px var(--green); }
.org-status.offline { background:var(--text-muted); }
.org-status.ai-status { background:var(--green); box-shadow:0 0 6px var(--green); animation:pulse-glow 2s infinite; }
@keyframes pulse-glow { 0%,100%{opacity:1} 50%{opacity:0.5} }

/* Tree lines */
.org-children { display:flex; flex-direction:column; align-items:center; }
.org-vline { width:1px; height:16px; background:var(--border-active); }
.org-hgroup { display:flex; justify-content:center; position:relative; }
.org-hgroup::before { content:''; position:absolute; top:0; left:50%; right:50%; height:1px; background:var(--border-active); }
.org-hgroup > .org-node { position:relative; }
.org-hgroup > .org-node::before { content:''; position:absolute; top:0; left:50%; width:1px; height:16px; background:var(--border-active); }
.org-hbranch { display:flex; gap:8px; align-items:flex-start; padding-top:16px; position:relative; }
.org-hbranch::before { content:''; position:absolute; top:0; height:1px; background:var(--border-active); }
.org-hbranch > .org-node { position:relative; }
.org-hbranch > .org-node::before { content:''; position:absolute; top:-16px; left:50%; width:1px; height:16px; background:var(--border-active); }
.org-collapse-icon { margin-left:auto; color:var(--text-tertiary); font-size:12px; transition:transform 0.2s; }
.org-node-card.expanded .org-collapse-icon { transform:rotate(180deg); }

/* Collapsible children */
.org-children.collapsed { display:none; }

/* Business arms */
.org-arms { margin-top:40px; }
.org-arms-title { color:var(--text-primary); font-size:1.1rem; font-weight:600; margin-bottom:16px; }
.org-arms-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.org-arm-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-md); padding:20px; }
.org-arm-card h4 { color:var(--text-primary); font-size:0.95rem; margin-bottom:12px; }
.org-arm-flow { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.org-arm-step { background:var(--bg-3); color:var(--text-secondary); padding:6px 12px; border-radius:20px; font-size:0.78rem; white-space:nowrap; }
.org-arm-arrow { color:var(--text-muted); font-size:12px; }

/* Systems grid */
.org-systems-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:16px; }
.org-system-card { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-md); padding:16px; display:flex; align-items:flex-start; gap:12px; transition:var(--transition); }
.org-system-card:hover { border-color:var(--accent); }
.org-system-icon { width:40px; height:40px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-size:20px; flex-shrink:0; }
.org-system-info { flex:1; }
.org-system-name { color:var(--text-primary); font-weight:600; font-size:0.9rem; }
.org-system-type { color:var(--text-tertiary); font-size:0.78rem; margin-top:2px; }
.org-system-desc { color:var(--text-secondary); font-size:0.78rem; margin-top:6px; }
.org-system-status { display:flex; align-items:center; gap:6px; margin-top:8px; font-size:0.75rem; }
.org-system-status .dot { width:6px; height:6px; border-radius:50%; }
.org-system-status .dot.connected { background:var(--green); }
.org-system-status .dot.dev { background:var(--amber); }
.org-system-status .dot.active { background:var(--green); }

@media (max-width:768px) {
  .org-arms-grid { grid-template-columns:1fr; }
  .org-hbranch { flex-direction:column; align-items:center; gap:0; }
  .org-systems-grid { grid-template-columns:1fr; }
}

/* ==================== RENT ROLL (FACELIFT) ==================== */
.rr-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
  background: linear-gradient(135deg, var(--bg-2), var(--bg-3));
  padding: 24px 28px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border);
  flex-wrap: wrap;
  gap: 16px;
}
.rr-title h1 { color: var(--text-primary); margin-bottom: 4px; font-size: 22px; font-weight: 700; }
.rr-title p { color: var(--text-tertiary); font-size: 14px; }
.rr-controls { display: flex; align-items: center; gap: 12px; }
.rr-month-select {
  background: var(--bg-3);
  color: var(--text-primary);
  border: 1px solid var(--border-active);
  border-radius: 20px;
  padding: 8px 20px;
  font-size: 14px;
  font-family: var(--font-sans);
  cursor: pointer;
  min-width: 160px;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' stroke='%2371717a' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 32px;
  transition: border-color var(--transition);
}
.rr-month-select:hover { border-color: var(--accent); }
.rr-month-select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px rgba(99,102,241,0.15); }
.rr-month-select:focus { outline: none; border-color: var(--accent); }

/* Analytics */
.rr-trends { margin-bottom: 24px; }

.rr-revenue-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.rr-rev-item {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 20px;
  text-align: center;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
  transition: transform 150ms;
}
.rr-rev-item:hover { transform: translateY(-1px); }
.rr-rev-item::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--accent-gradient); opacity: 0.5; }
.rr-rev-val { font-size: 22px; font-weight: 700; color: var(--text-primary); font-family: var(--font-mono); }
.rr-rev-lbl { font-size: 10px; color: var(--text-muted); margin-top: 6px; text-transform: uppercase; letter-spacing: 0.4px; }

.rr-analytics-section {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  padding: 20px;
  margin-bottom: 16px;
  box-shadow: var(--shadow-card);
}
.rr-analytics-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--border-active);
}
.rr-analytics-row {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 16px;
  margin-bottom: 16px;
}
.rr-analytics-flex1 { }
.rr-analytics-flex2 { }

/* Main Chart */
.rr-main-chart { width: 100%; height: auto; max-height: 260px; }

.rr-chart-legend {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin-top: 12px;
  font-size: 11px;
  color: var(--text-muted);
}
.rr-legend-dot { width: 10px; height: 10px; border-radius: 2px; display: inline-block; margin-right: 4px; vertical-align: middle; }
.rr-legend-line { width: 16px; height: 2px; display: inline-block; margin-right: 4px; vertical-align: middle; border-radius: 1px; }
.rr-legend-dashed { background: repeating-linear-gradient(90deg, #f59e0b 0, #f59e0b 4px, transparent 4px, transparent 7px) !important; }

/* Donut */
.rr-donut-wrap { display: flex; align-items: center; gap: 20px; justify-content: center; padding: 10px 0; }
.rr-donut-svg { width: 160px; height: 160px; flex-shrink: 0; }
.rr-donut-legend { display: flex; flex-direction: column; gap: 6px; }
.rr-donut-legend-item { font-size: 12px; color: var(--text-secondary); display: flex; align-items: center; gap: 6px; }
.rr-donut-legend-item strong { color: var(--text-primary); font-family: var(--font-mono); }

/* Heatmap */
.rr-heatmap { overflow-x: auto; padding: 4px; }
.rr-heatmap-header, .rr-heatmap-row {
  display: flex;
  gap: 2px;
  min-width: max-content;
}
.rr-heatmap-header { margin-bottom: 2px; }
.rr-hm-label {
  font-size: 11px;
  color: var(--text-secondary);
  padding: 4px 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
  min-width: 120px;
  max-width: 140px;
  flex-shrink: 0;
}
.rr-heatmap-header .rr-hm-label { color: var(--text-muted); font-weight: 600; }
.rr-hm-month { font-size: 9px; color: var(--text-muted); text-align: center; padding: 4px 2px; font-family: var(--font-mono); min-width: 42px; }
.rr-hm-cell-wrap { position: relative; }
.rr-hm-cell-wrap:hover .rr-hm-tooltip { display: block; }
.rr-hm-tooltip { display: none; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: var(--bg-0); border: 1px solid var(--border); border-radius: 6px; padding: 4px 8px; font-size: 10px; color: var(--text-secondary); white-space: nowrap; z-index: 10; pointer-events: none; }
.rr-hm-cell {
  font-size: 9px;
  text-align: center;
  padding: 6px 2px;
  border-radius: 3px;
  font-family: var(--font-mono);
  font-weight: 600;
  color: rgba(255,255,255,0.8);
  min-width: 42px;
}
.rr-hm-full { background: rgba(34,197,94,0.35); color: #86efac; }
.rr-hm-good { background: rgba(34,197,94,0.18); color: #86efac; }
.rr-hm-warn { background: rgba(245,158,11,0.25); color: #fcd34d; }
.rr-hm-bad { background: rgba(239,68,68,0.3); color: #fca5a5; }
.rr-hm-nodata { background: rgba(255,255,255,0.03); color: var(--text-muted); }
.rr-hm-legend {
  display: flex;
  gap: 10px;
  margin-top: 12px;
  justify-content: flex-end;
  align-items: center;
}
.rr-hm-legend-label { font-size: 10px; color: var(--text-muted); margin-right: 4px; }
.rr-hm-legend span {
  font-size: 10px;
  padding: 3px 10px;
  border-radius: 4px;
  font-weight: 600;
}

/* Property Performance Cards */
.rr-prop-perf-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}
.rr-prop-perf-card-wrap { transition: transform 150ms; }
.rr-prop-perf-card-wrap:hover { transform: translateY(-1px); }
.rr-prop-perf-card {
  background: var(--bg-1);
  border-radius: var(--radius-md);
  padding: 14px;
  border: 1px solid var(--border);
}
.rr-ppc-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.rr-ppc-addr { font-size: 12px; font-weight: 600; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 160px; }
.rr-ppc-trend { font-size: 18px; font-weight: 700; }
.rr-ppc-body { display: flex; gap: 12px; align-items: center; }
.rr-ppc-spark { flex: 1; }
.rr-ppc-spark svg { width: 100%; height: 32px; }
.rr-ppc-spark-label { font-size: 10px; color: var(--text-muted); margin-top: 2px; font-family: var(--font-mono); }
.rr-ppc-stats { display: flex; flex-direction: column; gap: 4px; }
.rr-ppc-stat-val { font-size: 13px; font-weight: 700; font-family: var(--font-mono); }
.rr-ppc-stat-lbl { font-size: 9px; color: var(--text-muted); margin-left: 4px; }

/* Properties title */
.rr-properties-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--border-active);
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Mini occupancy bar in property header */
.rr-occ-mini-bar {
  width: 40px;
  height: 4px;
  background: var(--bg-3);
  border-radius: 2px;
  overflow: hidden;
  flex-shrink: 0;
}
.rr-occ-mini-fill { height: 100%; border-radius: 2px; transition: width 300ms; }

/* KPIs */
.rr-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 24px;
}

/* Property Cards */
.rr-properties { display: flex; flex-direction: column; gap: 12px; }
.rr-property-card {
  background: var(--bg-2);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border);
  transition: border-color 150ms;
}
.rr-property-card:hover { border-color: var(--border-active); }
.rr-property-header {
  padding: 16px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  transition: background var(--transition);
  flex-wrap: wrap;
  gap: 8px;
}
.rr-property-header:hover { background: rgba(99,102,241,0.04); }
.rr-property-title { display: flex; align-items: center; gap: 10px; }
.rr-property-addr { font-size: 15px; font-weight: 600; color: var(--text-primary); }
.rr-unit-badge {
  background: var(--accent-subtle);
  color: var(--accent);
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
}
.rr-property-summary {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 12px;
  color: var(--text-secondary);
}
.rr-chevron {
  color: var(--text-muted);
  font-size: 10px;
  transition: transform 200ms;
}
.rr-property-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 300ms ease;
}
.rr-property-body.rr-expanded {
  max-height: 2000px;
}
.rr-units-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.rr-units-table th {
  text-align: left;
  padding: 10px 16px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  border-bottom: 2px solid var(--border-active);
  background: var(--bg-1);
}
.rr-units-table td {
  padding: 10px 16px;
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
}
.rr-units-table tbody tr:nth-child(even) td { background: rgba(255,255,255,0.015); }
.rr-units-table tbody tr:hover td { background: rgba(99,102,241,0.04); }
.rr-money { font-family: var(--font-mono); font-variant-numeric: tabular-nums; text-align: right; color: var(--green); }
.rr-row-paid td { }
.rr-row-partial td { background: rgba(245,158,11,0.06) !important; }
.rr-row-unpaid td { background: rgba(239,68,68,0.04); }
.rr-row-vacant td { background: rgba(239,68,68,0.06); }
.rr-vacant-badge {
  background: var(--red-subtle);
  color: var(--red);
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  letter-spacing: 0.5px;
}
.rr-total-row td {
  border-top: 2px solid var(--border);
  background: var(--bg-1);
  color: var(--text-primary);
}

@media (max-width: 900px) {
  .rr-trends { grid-template-columns: 1fr; }
  .rr-kpis { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 600px) {
  .rr-kpis { grid-template-columns: repeat(2, 1fr); }
}

/* === CRA (Cap Rate Academy) === */
.cra-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
  flex-wrap: wrap;
  gap: 16px;
}
.cra-title h1 { color: var(--text-primary); font-size: 1.5rem; margin: 0; }
.cra-title p { color: var(--text-tertiary); margin: 4px 0 0; font-size: 0.85rem; }
.cra-header-stats { display: flex; gap: 16px; flex-wrap: wrap; }
.cra-subtabs {
  display: flex;
  gap: 6px;
  margin-bottom: 20px;
  padding: 4px;
  background: var(--bg-2);
  border-radius: 24px;
  width: fit-content;
  overflow-x: auto;
  max-width: 100%;
}
.cra-subtab-content { display: none; }
.cra-subtab-content.active { display: block; }

/* KPI grid for overview */
.cra-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.cra-kpi-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  text-align: center;
}
.cra-kpi-value { font-size: 2rem; font-weight: 700; color: var(--text-primary); }
.cra-kpi-label { font-size: 0.8rem; color: var(--text-tertiary); margin-top: 4px; }

/* Tables */
.cra-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-2);
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.cra-table th, .cra-table td {
  padding: 12px 16px;
  text-align: left;
  border-bottom: 1px solid var(--border);
  font-size: 0.85rem;
}
.cra-table th {
  background: var(--bg-3);
  color: var(--text-secondary);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.5px;
}
.cra-table td { color: var(--text-primary); }
.cra-table tr:last-child td { border-bottom: none; }
.cra-table tr:hover td { background: rgba(255,255,255,0.02); }

/* Badges */
.cra-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
}
.cra-badge-admin { background: rgba(239,68,68,0.15); color: #f87171; }
.cra-badge-pro { background: rgba(59,130,246,0.15); color: #60a5fa; }
.cra-badge-vip { background: rgba(168,85,247,0.15); color: #c084fc; }
.cra-badge-portfolio_builder { background: rgba(234,179,8,0.15); color: #facc15; }
.cra-badge-standard { background: rgba(100,116,139,0.15); color: #94a3b8; }
.cra-badge-chat { background: rgba(59,130,246,0.15); color: #60a5fa; }
.cra-badge-events { background: rgba(16,185,129,0.15); color: #34d399; }
.cra-badge-resources { background: rgba(234,179,8,0.15); color: #facc15; }
.cra-badge-embed { background: rgba(168,85,247,0.15); color: #c084fc; }
.cra-badge-software { background: rgba(239,68,68,0.15); color: #f87171; }
.cra-badge-free_training { background: rgba(16,185,129,0.15); color: #34d399; }

/* Action buttons */
.cra-btn { padding: 5px 12px; border: none; border-radius: 6px; cursor: pointer; font-size: 0.78rem; font-weight: 500; transition: all 0.15s; }
.cra-btn-edit { background: rgba(59,130,246,0.15); color: #60a5fa; }
.cra-btn-edit:hover { background: rgba(59,130,246,0.25); }
.cra-btn-delete { background: rgba(239,68,68,0.15); color: #f87171; }
.cra-btn-delete:hover { background: rgba(239,68,68,0.25); }
.btn-primary { padding: 8px 18px; background: var(--accent); color: #fff; border: none; border-radius: 8px; cursor: pointer; font-size: 0.85rem; font-weight: 500; }
.btn-primary:hover { opacity: 0.85; }

/* Modal */
.cra-modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.6);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cra-modal {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 16px;
  width: 560px;
  max-width: 90vw;
  max-height: 80vh;
  overflow-y: auto;
}
.cra-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px 0;
}
.cra-modal-header h3 { color: var(--text-primary); margin: 0; }
.cra-modal-body { padding: 20px 24px 24px; }
.cra-modal-body label { display: block; color: var(--text-secondary); font-size: 0.8rem; margin-bottom: 4px; margin-top: 12px; }
.cra-modal-body input, .cra-modal-body textarea, .cra-modal-body select {
  width: 100%;
  padding: 10px 12px;
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-primary);
  font-size: 0.85rem;
  font-family: var(--font-sans);
}
.cra-modal-body textarea { min-height: 80px; resize: vertical; }
.cra-modal-body .btn-primary { margin-top: 16px; width: 100%; }

/* Cards (for overview sections) */
.cra-section { margin-bottom: 24px; }
.cra-section-title { color: var(--text-secondary); font-size: 0.9rem; margin-bottom: 12px; }

/* Role breakdown */
.cra-role-grid { display: flex; gap: 12px; flex-wrap: wrap; }
.cra-role-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px 24px;
  text-align: center;
  min-width: 120px;
}
.cra-role-count { font-size: 1.5rem; font-weight: 700; color: var(--text-primary); }
.cra-role-name { font-size: 0.75rem; color: var(--text-tertiary); text-transform: uppercase; margin-top: 4px; }

/* Analytics chart bars */
.cra-bar-chart { display: flex; flex-direction: column; gap: 8px; }
.cra-bar-row { display: flex; align-items: center; gap: 12px; }
.cra-bar-label { width: 140px; font-size: 0.8rem; color: var(--text-secondary); text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cra-bar { height: 24px; background: var(--accent); border-radius: 4px; min-width: 2px; transition: width 0.3s; }
.cra-bar-value { font-size: 0.8rem; color: var(--text-tertiary); min-width: 40px; }

/* Empty state */
.cra-empty { text-align: center; padding: 48px 20px; color: var(--text-tertiary); }
.cra-empty-icon { font-size: 2.5rem; margin-bottom: 12px; }
.cra-empty p { font-size: 0.9rem; }

/* Health strip */
.cra-health-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.8rem;
  color: var(--text-tertiary);
}
.cra-health-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #94a3b8;
  display: inline-block;
}
.cra-health-good { background: #34d399; box-shadow: 0 0 6px #34d399; }
.cra-health-warn { background: #facc15; box-shadow: 0 0 6px #facc15; }
.cra-health-error { background: #f87171; box-shadow: 0 0 6px #f87171; }
.cra-health-sep { color: var(--border); }
.cra-refresh-btn {
  background: none; border: 1px solid var(--border); color: var(--text-secondary);
  border-radius: 6px; padding: 2px 8px; cursor: pointer; font-size: 0.85rem;
  transition: all 0.15s;
}
.cra-refresh-btn:hover { background: var(--bg-3); color: var(--text-primary); }

/* Data Center Hero */
.dc-hero-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
  margin-bottom: 28px;
}
.dc-hero-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 18px 14px;
  text-align: center;
  transition: transform 0.15s, box-shadow 0.15s;
}
.dc-hero-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.dc-hero-icon { font-size: 1.5rem; margin-bottom: 6px; }
.dc-hero-value { font-size: 2rem; font-weight: 800; color: var(--text-primary); }
.dc-hero-label { font-size: 0.72rem; color: var(--text-tertiary); text-transform: uppercase; letter-spacing: 0.5px; margin-top: 4px; }

/* Sections */
.dc-section { margin-bottom: 28px; }
.dc-section-header h2 { color: var(--text-primary); font-size: 1.1rem; margin: 0 0 16px; }

/* Layout grids */
.dc-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dc-three-col { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }

/* Cards */
.dc-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
}
.dc-card h3 { color: var(--text-secondary); font-size: 0.85rem; margin: 0 0 14px; text-transform: uppercase; letter-spacing: 0.3px; }
.dc-card-scroll { max-height: 400px; overflow-y: auto; }
.dc-muted { color: var(--text-tertiary); font-size: 0.85rem; }

/* Compact table */
.dc-compact-table th, .dc-compact-table td { padding: 8px 10px; font-size: 0.78rem; }

/* Role bar */
.dc-role-bar { display: flex; height: 28px; border-radius: 6px; overflow: hidden; margin-bottom: 14px; }
.dc-role-segment { min-width: 4px; transition: width 0.3s; }
.dc-role-legend { display: flex; flex-wrap: wrap; gap: 12px; }
.dc-legend-item { font-size: 0.78rem; color: var(--text-secondary); display: flex; align-items: center; gap: 5px; }
.dc-legend-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }

/* Growth indicator */
.dc-growth-indicator { margin-top: 14px; padding: 10px 14px; background: var(--bg-3); border-radius: 8px; font-size: 0.82rem; }
.dc-trend-up { color: #34d399; }
.dc-trend-down { color: #f87171; }

/* Channel list */
.dc-channel-list { display: flex; flex-direction: column; gap: 8px; }
.dc-channel-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.dc-channel-info { min-width: 140px; flex-shrink: 0; }
.dc-channel-name { font-size: 0.82rem; color: var(--text-primary); font-weight: 500; display: block; }
.dc-channel-meta { font-size: 0.7rem; color: var(--text-tertiary); display: block; }
.dc-channel-bar-wrap { flex: 1; height: 8px; background: var(--bg-3); border-radius: 4px; overflow: hidden; }
.dc-channel-bar { height: 100%; background: var(--accent); border-radius: 4px; transition: width 0.3s; }
.dc-channel-count { font-size: 0.78rem; color: var(--text-secondary); min-width: 36px; text-align: right; font-weight: 600; }

/* Category breakdown */
.dc-cat-grid { display: flex; flex-direction: column; gap: 10px; }
.dc-cat-item { display: flex; align-items: center; gap: 10px; }
.dc-cat-bar-bg { flex: 1; height: 6px; background: var(--bg-3); border-radius: 3px; overflow: hidden; }
.dc-cat-bar-fill { height: 100%; border-radius: 3px; }
.dc-cat-label { font-size: 0.78rem; color: var(--text-secondary); min-width: 120px; }
.dc-cat-count { font-size: 0.72rem; color: var(--text-tertiary); min-width: 80px; text-align: right; }

/* Top channels */
.dc-top-channels { display: flex; flex-direction: column; gap: 6px; }
.dc-top-ch { font-size: 0.82rem; color: var(--text-secondary); padding: 6px 0; }

/* Mini bar chart (sparkline-style) */
.dc-mini-chart { display: flex; align-items: flex-end; gap: 2px; height: 64px; padding-top: 4px; }
.dc-mini-bar { flex: 1; background: var(--accent); border-radius: 2px 2px 0 0; min-width: 3px; transition: height 0.3s; opacity: 0.8; }
.dc-mini-bar:hover { opacity: 1; }

/* Inventory items */
.dc-inventory-item { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); }
.dc-inventory-item:last-child { border-bottom: none; }
.dc-inv-icon { font-size: 1.2rem; }
.dc-inv-info { flex: 1; }
.dc-inv-name { font-size: 0.82rem; color: var(--text-primary); font-weight: 500; }
.dc-inv-meta { font-size: 0.72rem; color: var(--text-tertiary); }
.dc-inv-label { font-size: 0.72rem; color: var(--text-tertiary); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; font-weight: 600; }

/* Health row */
.dc-health-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 16px; }
.dc-health-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
  text-align: center;
}
.dc-health-metric { font-size: 1.1rem; font-weight: 700; color: var(--text-primary); margin-bottom: 4px; }
.dc-health-metric.dc-health-good { color: #34d399; }
.dc-health-metric.dc-health-warn { color: #facc15; }
.dc-health-metric.dc-health-error { color: #f87171; }
.dc-health-label { font-size: 0.72rem; color: var(--text-tertiary); text-transform: uppercase; }

/* Quick links */
.dc-quicklinks { display: flex; gap: 10px; flex-wrap: wrap; }
.dc-link-btn {
  padding: 8px 16px;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--accent);
  font-size: 0.82rem;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.15s;
  font-weight: 500;
}
.dc-link-btn:hover { background: var(--bg-3); border-color: var(--accent); }

/* Workflows */
.dc-workflows-empty { text-align: center; padding: 40px 20px; }
.dc-wf-icon { font-size: 3rem; margin-bottom: 12px; }
.dc-wf-text { color: var(--text-tertiary); font-size: 0.95rem; max-width: 500px; margin: 0 auto; }

.dc-wf-mock {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 24px;
  margin-top: 24px;
}
.dc-wf-mock h3 { color: var(--text-secondary); font-size: 0.9rem; margin: 0 0 16px; }
.dc-wf-pipeline { display: flex; align-items: center; gap: 0; justify-content: center; flex-wrap: wrap; }
.dc-wf-node {
  background: var(--bg-3);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
  text-align: center;
  min-width: 140px;
}
.dc-wf-node-icon { font-size: 1.5rem; margin-bottom: 4px; }
.dc-wf-node-label { font-size: 0.72rem; text-transform: uppercase; color: var(--text-tertiary); letter-spacing: 0.5px; margin-bottom: 4px; }
.dc-wf-node-detail { font-size: 0.78rem; color: var(--text-secondary); }
.dc-wf-node-detail em { color: var(--accent); }
.dc-wf-arrow { font-size: 1.5rem; color: var(--text-tertiary); padding: 0 12px; }
.dc-wf-source { border-top: 2px solid #34d399; }
.dc-wf-filter { border-top: 2px solid #facc15; }
.dc-wf-dest { border-top: 2px solid #4f9eff; }
.dc-wf-cadence { border-top: 2px solid #a78bfa; }
.dc-wf-status { margin-top: 14px; font-size: 0.8rem; color: var(--text-tertiary); text-align: center; }

@media (max-width: 1200px) {
  .dc-hero-grid { grid-template-columns: repeat(3, 1fr); }
  .dc-three-col { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .cra-header { flex-direction: column; }
  .cra-subtabs { width: 100%; }
  .dc-hero-grid { grid-template-columns: repeat(2, 1fr); }
  .dc-two-col { grid-template-columns: 1fr; }
  .dc-three-col { grid-template-columns: 1fr; }
  .dc-wf-pipeline { flex-direction: column; }
  .dc-wf-arrow { transform: rotate(90deg); }
}

/* ==================== RENT PAYMENT TRACKER ==================== */

/* Approval Banner */
.rr-approval-banner {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.15), rgba(245, 158, 11, 0.05));
  border: 1px solid rgba(245, 158, 11, 0.3);
  border-radius: 12px;
  padding: 12px 20px;
  margin-bottom: 16px;
  animation: bannerPulse 3s ease-in-out infinite;
}
@keyframes bannerPulse {
  0%, 100% { border-color: rgba(245, 158, 11, 0.3); }
  50% { border-color: rgba(245, 158, 11, 0.6); }
}
.rr-approval-banner-content {
  display: flex;
  align-items: center;
  gap: 12px;
}
.rr-approval-icon { font-size: 20px; }
.rr-approval-text { color: #f5a623; font-weight: 600; flex: 1; font-size: 0.95rem; }
.rr-approval-btn {
  background: #f59e0b;
  color: #000;
  border: none;
  border-radius: 8px;
  padding: 8px 20px;
  font-weight: 600;
  cursor: pointer;
  font-size: 0.85rem;
  transition: background 0.2s;
}
.rr-approval-btn:hover { background: #d97706; }
.rr-approval-refresh-btn {
  background: none;
  border: 1px solid rgba(255,255,255,0.1);
  color: #8b95a5;
  border-radius: 8px;
  padding: 8px 12px;
  cursor: pointer;
  font-size: 0.85rem;
  transition: all 0.2s;
}
.rr-approval-refresh-btn:hover { background: rgba(255,255,255,0.05); color: #e2e8f0; }

/* Review Modal Items */
.rp-item {
  background: var(--bg-2, #141b2d);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 12px;
  transition: border-color 0.2s;
}
.rp-item:hover { border-color: rgba(255,255,255,0.12); }
.rp-item-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
}
.rp-message {
  color: #8b95a5;
  font-size: 0.85rem;
  font-style: italic;
  padding: 8px 12px;
  background: rgba(0,0,0,0.2);
  border-radius: 8px;
  margin-bottom: 10px;
  line-height: 1.4;
  word-break: break-word;
}
.rp-parsed {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.rp-field {
  background: rgba(255,255,255,0.04);
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.82rem;
}
.rp-field-label { color: #6b7280; font-size: 0.75rem; display: block; margin-bottom: 2px; }
.rp-field-value { color: #e2e8f0; font-weight: 600; }
.rp-confidence {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 600;
}
.rp-confidence-high { background: rgba(16, 185, 129, 0.2); color: #10b981; }
.rp-confidence-medium { background: rgba(245, 158, 11, 0.2); color: #f59e0b; }
.rp-confidence-low { background: rgba(107, 114, 128, 0.2); color: #6b7280; }
.rp-actions {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}
.rp-action-btn {
  padding: 6px 16px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 600;
  transition: all 0.2s;
}
.rp-approve { background: rgba(16, 185, 129, 0.2); color: #10b981; }
.rp-approve:hover { background: rgba(16, 185, 129, 0.35); }
.rp-edit { background: rgba(79, 158, 255, 0.2); color: #4f9eff; }
.rp-edit:hover { background: rgba(79, 158, 255, 0.35); }
.rp-reject { background: rgba(239, 68, 68, 0.2); color: #ef4444; }
.rp-reject:hover { background: rgba(239, 68, 68, 0.35); }

/* Edit Form */
.rp-edit-form {
  display: none;
  background: rgba(0,0,0,0.2);
  border-radius: 8px;
  padding: 12px;
  margin-top: 10px;
}
.rp-edit-form.active { display: block; }
.rp-edit-row {
  display: flex;
  gap: 10px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.rp-edit-field {
  flex: 1;
  min-width: 140px;
}
.rp-edit-field label {
  display: block;
  font-size: 0.75rem;
  color: #6b7280;
  margin-bottom: 4px;
}
.rp-edit-field input, .rp-edit-field select {
  width: 100%;
  background: var(--bg-1, #0a0e14);
  color: #e2e8f0;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 0.82rem;
}
.rp-edit-save {
  background: #4f9eff;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 8px 20px;
  cursor: pointer;
  font-weight: 600;
  font-size: 0.82rem;
  margin-top: 4px;
}
.rp-edit-save:hover { background: #3b8cef; }

/* Live Payments Section */
.rr-live-payments {
  margin-top: 24px;
  background: var(--bg-2, #141b2d);
  border: 1px solid rgba(16, 185, 129, 0.2);
  border-radius: 12px;
  padding: 20px;
}
.rr-live-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}
.rr-live-header h3 { color: #10b981; margin: 0; font-size: 1rem; }
.rr-live-count {
  color: #6b7280;
  font-size: 0.85rem;
}
.rr-live-table-wrap { overflow-x: auto; }
.rr-live-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}
.rr-live-table th {
  text-align: left;
  padding: 8px 12px;
  color: #6b7280;
  font-weight: 600;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.rr-live-table td {
  padding: 8px 12px;
  color: #e2e8f0;
  border-bottom: 1px solid rgba(255,255,255,0.03);
}
.rr-live-table tr {
  background: rgba(16, 185, 129, 0.03);
  transition: background 0.2s;
}
.rr-live-table tr:hover { background: rgba(16, 185, 129, 0.08); }
.rr-live-amount { color: #10b981; font-weight: 600; }
.rr-live-method {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 0.78rem;
  background: rgba(255,255,255,0.06);
  color: #8b95a5;
  text-transform: capitalize;
}
.rr-live-source {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 0.72rem;
  background: rgba(37, 211, 102, 0.15);
  color: #25d366;
  font-weight: 600;
}

/* ==================== RENT COLLECTION TRACKER ==================== */
.rc-tracker {
  margin-top: 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.rc-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  background: rgba(16, 185, 129, 0.04);
}
.rc-header h3 { color: #fff; margin: 0; font-size: 1rem; }
.rc-subtitle { color: var(--text-secondary); font-size: 0.8rem; display: block; margin-top: 2px; }
.rc-header-right { display: flex; align-items: center; gap: 12px; }
.rc-last-analyzed { color: var(--text-secondary); font-size: 0.75rem; }
.rc-analyze-btn {
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 8px 16px;
  cursor: pointer;
  font-size: 0.85rem;
  font-weight: 600;
  transition: all 0.2s;
}
.rc-analyze-btn:hover { filter: brightness(1.1); }
.rc-analyze-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.rc-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1px;
  background: var(--border);
  border-bottom: 1px solid var(--border);
}
.rc-summary-card {
  background: var(--surface);
  padding: 14px 16px;
  text-align: center;
}
.rc-summary-card .rc-metric {
  font-size: 1.3rem;
  font-weight: 700;
  color: #fff;
}
.rc-summary-card .rc-metric.green { color: #10b981; }
.rc-summary-card .rc-metric.yellow { color: #f59e0b; }
.rc-summary-card .rc-metric.red { color: #ef4444; }
.rc-summary-card .rc-metric.blue { color: #3b82f6; }
.rc-summary-card .rc-label {
  font-size: 0.72rem;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-top: 4px;
}

.rc-properties { padding: 16px 20px; }
.rc-empty { text-align: center; padding: 40px; color: var(--text-secondary); }
.rc-empty p { margin: 0; }

.rc-prop {
  margin-bottom: 16px;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.rc-prop-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: rgba(255,255,255,0.02);
  cursor: pointer;
  transition: background 0.15s;
}
.rc-prop-header:hover { background: rgba(255,255,255,0.04); }
.rc-prop-address { color: #fff; font-weight: 600; font-size: 0.9rem; }
.rc-prop-stats { display: flex; gap: 16px; align-items: center; }
.rc-prop-bar {
  width: 120px;
  height: 6px;
  background: var(--border);
  border-radius: 3px;
  overflow: hidden;
}
.rc-prop-bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s;
}
.rc-prop-bar-fill.green { background: #10b981; }
.rc-prop-bar-fill.yellow { background: #f59e0b; }
.rc-prop-bar-fill.red { background: #ef4444; }
.rc-prop-amount { color: var(--text-secondary); font-size: 0.82rem; font-weight: 500; }
.rc-prop-pct { font-size: 0.75rem; font-weight: 700; min-width: 40px; text-align: right; }

.rc-prop-units {
  display: none;
  border-top: 1px solid var(--border);
}
.rc-prop.expanded .rc-prop-units { display: block; }

.rc-unit {
  display: grid;
  grid-template-columns: 70px 1fr 90px 80px 60px;
  align-items: center;
  padding: 8px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.03);
  font-size: 0.82rem;
  gap: 8px;
}
.rc-unit:last-child { border-bottom: none; }
.rc-unit-id { color: var(--text-secondary); font-family: monospace; }
.rc-unit-tenant { color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rc-unit-amount { text-align: right; font-weight: 600; }
.rc-unit-amount.paid { color: #10b981; }
.rc-unit-amount.partial { color: #f59e0b; }
.rc-unit-amount.pending { color: var(--text-secondary); }
.rc-unit-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
}
.rc-unit-status.paid { background: rgba(16,185,129,0.15); color: #10b981; }
.rc-unit-status.partial { background: rgba(245,158,11,0.15); color: #f59e0b; }
.rc-unit-status.pending { background: rgba(59,130,246,0.15); color: #3b82f6; }
.rc-unit-status.scheduled { background: rgba(139,92,246,0.15); color: #a78bfa; }
.rc-unit-status.unconfirmed { background: rgba(156,163,175,0.15); color: #9ca3af; }
.rc-unit-status.no_info { background: rgba(239,68,68,0.08); color: #6b7280; }
.rc-unit-conf { font-size: 0.7rem; }
.rc-unit-conf.high { color: #10b981; }
.rc-unit-conf.medium { color: #f59e0b; }
.rc-unit-conf.low { color: #ef4444; }

.rc-unit-detail {
  grid-column: 1 / -1;
  padding: 6px 0 4px 70px;
  font-size: 0.75rem;
  color: var(--text-secondary);
  line-height: 1.5;
}
.rc-unit-detail .rc-detail-item { margin-bottom: 2px; }
.rc-unit-detail .rc-detail-label { color: #6b7280; }

.rc-issues {
  padding: 12px 20px;
  border-top: 1px solid var(--border);
  background: rgba(239,68,68,0.03);
}
.rc-issues h4 { color: #ef4444; margin: 0 0 8px; font-size: 0.85rem; }
.rc-issues ul { margin: 0; padding-left: 18px; }
.rc-issues li { color: var(--text-secondary); font-size: 0.8rem; margin-bottom: 4px; }

.rc-timeline {
  padding: 12px 20px;
  border-top: 1px solid var(--border);
}
.rc-timeline h4 { color: var(--text-secondary); margin: 0 0 8px; font-size: 0.85rem; }
.rc-tl-item {
  display: flex;
  gap: 10px;
  padding: 4px 0;
  font-size: 0.78rem;
  border-left: 2px solid var(--border);
  padding-left: 12px;
  margin-left: 4px;
}
.rc-tl-date { color: #6b7280; min-width: 80px; font-family: monospace; }
.rc-tl-event { color: var(--text-secondary); }

.rc-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-secondary);
}
.rc-loading .rc-spinner {
  display: inline-block;
  width: 28px;
  height: 28px;
  border: 3px solid var(--border);
  border-top: 3px solid var(--accent);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  margin-bottom: 12px;
}

/* ==================== INTEL TAB ==================== */

.intel-dashboard {
  padding: 0;
}

.intel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  flex-wrap: wrap;
  gap: 12px;
}

.intel-title h1 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-primary);
}

.intel-title p {
  color: var(--text-tertiary);
  font-size: 0.85rem;
  margin-top: 2px;
}

.intel-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.intel-last-updated {
  font-size: 0.8rem;
  color: var(--text-tertiary);
}

.intel-panels {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  align-items: start;
}

@media (max-width: 1200px) {
  .intel-panels {
    grid-template-columns: 1fr;
  }
}

.intel-panel {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 20px;
  max-height: 85vh;
  overflow-y: auto;
}

.intel-panel::-webkit-scrollbar {
  width: 4px;
}
.intel-panel::-webkit-scrollbar-track {
  background: transparent;
}
.intel-panel::-webkit-scrollbar-thumb {
  background: var(--border-active);
  border-radius: 4px;
}

.intel-panel-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}

.intel-empty {
  color: var(--text-tertiary);
  font-size: 0.85rem;
  text-align: center;
  padding: 40px 20px;
}

/* Intel Cards */
.intel-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px;
  margin-bottom: 12px;
}

.intel-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
  gap: 8px;
}

.intel-card-title {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--text-primary);
}

.intel-card-status {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin-bottom: 10px;
  line-height: 1.4;
}

.intel-card-acquisition {
  border-left: 3px solid var(--green);
}

.intel-section-subtitle {
  color: var(--text-primary);
  font-size: 0.9rem;
  font-weight: 600;
  margin: 16px 0 10px;
}

/* Badges */
.intel-badge {
  font-size: 0.7rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 12px;
  white-space: nowrap;
}

.intel-badge-blue {
  background: var(--blue-subtle);
  color: var(--blue);
}
.intel-badge-green {
  background: var(--green-subtle);
  color: var(--green);
}
.intel-badge-orange {
  background: var(--amber-subtle);
  color: var(--amber);
}
.intel-badge-red {
  background: var(--red-subtle);
  color: var(--red);
}
.intel-badge-gray {
  background: rgba(113,113,122,0.15);
  color: var(--text-tertiary);
}

/* Update timeline */
.intel-updates-timeline {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.intel-update-item {
  padding: 8px 10px;
  background: var(--bg-3);
  border-radius: var(--radius-sm);
  border-left: 2px solid var(--border-active);
}

.intel-update-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.intel-update-time {
  font-size: 0.7rem;
  color: var(--text-muted);
}

.intel-source-badge {
  font-size: 0.65rem;
  color: var(--text-tertiary);
  background: var(--bg-2);
  padding: 1px 6px;
  border-radius: 10px;
  border: 1px solid var(--border);
}

.intel-update-body {
  font-size: 0.8rem;
  line-height: 1.4;
}

.intel-sender {
  font-weight: 600;
  color: var(--accent-hover);
  margin-right: 4px;
}

.intel-summary {
  color: var(--text-secondary);
}

.intel-original-text {
  font-size: 0.7rem;
  color: var(--text-muted);
  font-style: italic;
  margin-top: 4px;
  padding: 4px 8px;
  background: var(--bg-2);
  border-radius: 4px;
  max-height: 40px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.intel-more {
  font-size: 0.75rem;
  color: var(--accent);
  text-align: center;
  padding: 4px;
}

/* Action items / next steps */
.intel-actions, .intel-next-steps, .intel-issues {
  font-size: 0.8rem;
  margin-top: 10px;
  color: var(--text-secondary);
}
.intel-actions strong, .intel-next-steps strong, .intel-issues strong {
  color: var(--text-primary);
}
.intel-actions ul, .intel-next-steps ul, .intel-issues ul {
  margin: 4px 0 0 16px;
  padding: 0;
}
.intel-actions li, .intel-next-steps li, .intel-issues li {
  margin-bottom: 2px;
}

/* Deal terms */
.intel-deal-terms {
  display: flex;
  gap: 16px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.intel-term {
  font-size: 0.8rem;
  color: var(--text-secondary);
}
.intel-term strong {
  color: var(--text-primary);
}

/* Deal Pipeline KPIs */
.intel-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 16px;
}

.intel-kpi {
  text-align: center;
  padding: 12px 8px;
  border-radius: var(--radius-sm);
  background: var(--bg-2);
  border: 1px solid var(--border);
}

.intel-kpi-value {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}
.intel-kpi-label {
  font-size: 0.65rem;
  color: var(--text-tertiary);
  margin-top: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.intel-kpi-orange .intel-kpi-value { color: var(--amber); }
.intel-kpi-blue .intel-kpi-value { color: var(--blue); }
.intel-kpi-green .intel-kpi-value { color: var(--green); }
.intel-kpi-red .intel-kpi-value { color: var(--red); }

/* Deal Stages */
.intel-stage-section {
  margin-bottom: 16px;
}

.intel-stage-title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 8px;
}

.intel-stage-count {
  font-size: 0.75rem;
  color: var(--text-tertiary);
  font-weight: 400;
}

.intel-deal-cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.intel-deal-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  border-left: 3px solid var(--border-active);
}

.intel-deal-blue { border-left-color: var(--blue); }
.intel-deal-orange { border-left-color: var(--amber); }
.intel-deal-green { border-left-color: var(--green); }
.intel-deal-red { border-left-color: var(--red); }
.intel-deal-amber { border-left-color: var(--amber); }

.intel-deal-name {
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--text-primary);
}

.intel-deal-status {
  font-size: 0.75rem;
  color: var(--text-secondary);
  margin: 2px 0;
}

.intel-deal-detail {
  font-size: 0.75rem;
  color: var(--text-tertiary);
}

.intel-deal-last-update {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--border);
  font-size: 0.75rem;
}

.intel-deal-last-update .intel-update-time {
  margin-right: 6px;
}

.intel-deal-last-update .intel-sender {
  font-size: 0.75rem;
}

.intel-deal-last-update .intel-summary {
  display: block;
  margin-top: 2px;
  font-size: 0.75rem;
}

/* MPM Project Cards */
.intel-mpm-card {
  padding: 12px 14px;
}

.intel-mpm-latest {
  margin-bottom: 8px;
}

.intel-expand {
  margin-top: 8px;
}

.intel-expand summary {
  font-size: 0.75rem;
  color: var(--accent);
  cursor: pointer;
  user-select: none;
}

.intel-expand summary:hover {
  color: var(--accent-hover);
}

.intel-expand[open] .intel-updates-timeline {
  margin-top: 8px;
}

/* Intel Live Feed */
.intel-live-feed-section {
  background: var(--bg-1, #131820);
  border: 1px solid var(--border, #1e2533);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 8px;
}
.intel-live-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.intel-filter-btn {
  padding: 4px 14px;
  border-radius: 20px;
  border: 1px solid #2a2f3e;
  background: transparent;
  color: #a0a6b8;
  cursor: pointer;
  font-size: 0.85em;
  transition: all 0.15s;
}
.intel-filter-btn:hover {
  border-color: #4f9eff;
  color: #e2e8f0;
}
.intel-filter-btn.active {
  background: rgba(79, 158, 255, 0.15);
  border-color: #4f9eff;
  color: #4f9eff;
}
.intel-feed-item:hover {
  background: rgba(255, 255, 255, 0.03);
}

/* =========================================
   OVERVIEW KPI CARDS
   ========================================= */
.overview-kpi-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 20px;
}
.overview-kpi-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 20px 24px;
  text-align: center;
}
.overview-kpi-value {
  font-size: 2rem;
  font-weight: 800;
  color: #e4e7ec;
  line-height: 1.1;
}
.overview-kpi-label {
  font-size: 0.85rem;
  color: #8b95a5;
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.overview-kpi-trend {
  margin-top: 8px;
  font-size: 0.8rem;
}
.overview-kpi-trend .trend-up { color: #22c55e; }
.overview-kpi-trend .trend-down { color: #ef4444; }
.overview-kpi-trend .trend-flat { color: #8b95a5; }

/* Department summary row */
.overview-dept-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}
.overview-dept-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column;
}
.overview-dept-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.overview-dept-icon {
  font-size: 1.3rem;
}
.overview-dept-title {
  font-size: 1rem;
  font-weight: 700;
  color: #e4e7ec;
}
.overview-dept-body {
  flex: 1;
}
.overview-dept-stats {
  display: flex;
  gap: 20px;
  margin-bottom: 14px;
}
.overview-dept-stat {
  display: flex;
  flex-direction: column;
}
.overview-dept-stat-value {
  font-size: 1.5rem;
  font-weight: 800;
  color: #e4e7ec;
}
.overview-dept-stat-value.overview-stat-warn {
  color: #f59e0b;
}
.overview-dept-stat-label {
  font-size: 0.75rem;
  color: #8b95a5;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.overview-dept-section {
  margin-top: 10px;
}
.overview-dept-subtitle {
  font-size: 0.75rem;
  font-weight: 600;
  color: #8b95a5;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 6px;
}
.overview-leaderboard-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
  font-size: 0.85rem;
  color: #c9cfd8;
}
.overview-leaderboard-item .lb-rank {
  color: #8b95a5;
  width: 18px;
  flex-shrink: 0;
}
.overview-leaderboard-item .lb-name {
  flex: 1;
  margin-left: 4px;
}
.overview-leaderboard-item .lb-count {
  font-weight: 600;
  color: #4f8cff;
}
.overview-recent-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
  font-size: 0.83rem;
  color: #c9cfd8;
}
.overview-recent-item .rc-name { flex: 1; }
.overview-recent-item .rc-amount { font-weight: 600; color: #22c55e; }
.overview-recent-item .rc-time { color: #8b95a5; font-size: 0.78rem; margin-left: 8px; }
.overview-mentorship-stat {
  display: flex;
  justify-content: space-between;
  padding: 3px 0;
  font-size: 0.85rem;
  color: #c9cfd8;
}
.overview-mentorship-stat .ms-label { color: #8b95a5; }
.overview-mentorship-stat .ms-value { font-weight: 600; color: #e4e7ec; }

@media (max-width: 900px) {
  .overview-kpi-row { grid-template-columns: repeat(2, 1fr); }
  .overview-dept-row { grid-template-columns: 1fr; }
}

/* =========================================
   INTEL — EXECUTIVE BRIEFING REDESIGN
   ========================================= */
.intel-exec-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.intel-exec-header-left {
  display: flex;
  align-items: baseline;
  gap: 16px;
}
.intel-exec-title {
  font-size: 1.5rem;
  font-weight: 800;
  color: #e4e7ec;
  margin: 0;
}
.intel-exec-subtitle {
  font-size: 0.85rem;
  color: #8b95a5;
}
.intel-exec-refresh-btn {
  background: rgba(79,140,255,0.12);
  color: #4f8cff;
  border: 1px solid rgba(79,140,255,0.25);
  border-radius: 8px;
  padding: 8px 16px;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.2s;
}
.intel-exec-refresh-btn:hover {
  background: rgba(79,140,255,0.2);
}
.intel-exec-refresh-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Attention banner */
.intel-attention-banner {
  background: rgba(239,68,68,0.08);
  border: 1px solid rgba(239,68,68,0.25);
  border-radius: 12px;
  padding: 14px 20px;
  margin-bottom: 20px;
  color: #fca5a5;
  font-size: 0.9rem;
}
.intel-attention-banner .attn-title {
  font-weight: 700;
  color: #ef4444;
  margin-bottom: 6px;
}
.intel-attention-banner .attn-item {
  padding: 2px 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Section titles */
.intel-exec-section {
  margin-bottom: 28px;
}
.intel-exec-section-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #e4e7ec;
  margin: 0 0 16px 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Property grid */
.intel-property-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 16px;
}
.intel-prop-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 18px 20px;
}
.intel-prop-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
}
.intel-prop-address {
  font-size: 1rem;
  font-weight: 700;
  color: #e4e7ec;
}
.intel-status-badge {
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  white-space: nowrap;
}
.intel-status-active { background: rgba(34,197,94,0.12); color: #22c55e; border: 1px solid rgba(34,197,94,0.25); }
.intel-status-uc { background: rgba(79,140,255,0.12); color: #4f8cff; border: 1px solid rgba(79,140,255,0.25); }
.intel-status-attention { background: rgba(245,158,11,0.12); color: #f59e0b; border: 1px solid rgba(245,158,11,0.25); }
.intel-status-default { background: rgba(139,149,165,0.12); color: #8b95a5; border: 1px solid rgba(139,149,165,0.25); }

.intel-prop-summary {
  font-size: 0.85rem;
  color: #9ca3af;
  margin-bottom: 8px;
  line-height: 1.5;
}
.intel-prop-updates {
  border-top: 1px solid rgba(255,255,255,0.04);
  padding-top: 8px;
  margin-top: 8px;
}
.intel-prop-update-item {
  display: flex;
  gap: 8px;
  padding: 4px 0;
  font-size: 0.82rem;
}
.intel-prop-update-time {
  color: #6b7280;
  min-width: 55px;
  flex-shrink: 0;
  text-align: right;
}
.intel-prop-update-text {
  color: #c9cfd8;
}
.intel-prop-actions {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.04);
}
.intel-prop-actions ul {
  margin: 4px 0;
  padding-left: 18px;
}
.intel-prop-actions li {
  font-size: 0.82rem;
  color: #9ca3af;
  padding: 1px 0;
}

/* Acquisitions */
.intel-acquisitions-section {
  margin-top: 16px;
}
.intel-acquisitions-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #f59e0b;
  margin-bottom: 12px;
}
.intel-acq-card {
  background: rgba(245,158,11,0.04);
  border: 1px solid rgba(245,158,11,0.12);
  border-radius: 12px;
  padding: 16px 20px;
  margin-bottom: 12px;
}
.intel-acq-terms {
  display: flex;
  gap: 16px;
  margin: 8px 0;
  font-size: 0.85rem;
}
.intel-acq-term {
  color: #9ca3af;
}
.intel-acq-term strong { color: #e4e7ec; }

/* Deal pipeline KPIs */
.intel-deal-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.intel-deal-kpi {
  border-radius: 12px;
  padding: 16px;
  text-align: center;
}
.intel-deal-kpi-value {
  font-size: 1.8rem;
  font-weight: 800;
  line-height: 1.1;
}
.intel-deal-kpi-label {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  margin-top: 4px;
  opacity: 0.8;
}
.intel-deal-kpi-active  { background: rgba(245,158,11,0.1); color: #f59e0b; border: 1px solid rgba(245,158,11,0.2); }
.intel-deal-kpi-uc      { background: rgba(79,140,255,0.1); color: #4f8cff; border: 1px solid rgba(79,140,255,0.2); }
.intel-deal-kpi-closed  { background: rgba(34,197,94,0.1); color: #22c55e; border: 1px solid rgba(34,197,94,0.2); }
.intel-deal-kpi-dropped { background: rgba(239,68,68,0.08); color: #ef4444; border: 1px solid rgba(239,68,68,0.15); }

/* Deal stages */
.intel-deal-stages {}
.intel-deal-stage {
  margin-bottom: 20px;
}
.intel-deal-stage-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.intel-deal-stage-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #e4e7ec;
}
.intel-deal-stage-count {
  background: rgba(255,255,255,0.06);
  color: #8b95a5;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 0.75rem;
  font-weight: 600;
}
.intel-deal-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 12px;
}
.intel-deal-card-exec {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 14px 18px;
  transition: border-color 0.2s;
}
.intel-deal-card-exec:hover {
  border-color: rgba(255,255,255,0.12);
}
.intel-deal-card-exec.deal-uc { border-left: 3px solid #4f8cff; }
.intel-deal-card-exec.deal-active { border-left: 3px solid #f59e0b; }
.intel-deal-card-exec.deal-closed { border-left: 3px solid #22c55e; opacity: 0.85; }
.intel-deal-card-exec.deal-dropped { border-left: 3px solid #ef4444; opacity: 0.5; }
.intel-deal-card-exec.deal-reengaged { border-left: 3px solid #8b5cf6; }

.intel-deal-client {
  font-size: 0.95rem;
  font-weight: 700;
  color: #e4e7ec;
  margin-bottom: 4px;
}
.intel-deal-prop {
  font-size: 0.82rem;
  color: #9ca3af;
}
.intel-deal-meta {
  display: flex;
  gap: 12px;
  margin-top: 6px;
  font-size: 0.8rem;
  color: #8b95a5;
}
.intel-deal-meta span { display: flex; align-items: center; gap: 3px; }
.intel-deal-last-update-exec {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.04);
  font-size: 0.8rem;
  color: #8b95a5;
}
.intel-deal-last-update-exec .lu-time { color: #6b7280; }
.intel-deal-last-update-exec .lu-text { color: #c9cfd8; }

/* MPM project cards */
.intel-mpm-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 16px;
}
.intel-mpm-card-exec {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 18px 20px;
}
.intel-mpm-card-exec.mpm-has-issues {
  border-color: rgba(239,68,68,0.2);
}
.intel-mpm-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 8px;
}
.intel-mpm-client {
  font-size: 1rem;
  font-weight: 700;
  color: #e4e7ec;
}
.intel-mpm-badge-active {
  background: rgba(34,197,94,0.12);
  color: #22c55e;
  border: 1px solid rgba(34,197,94,0.25);
  padding: 2px 10px;
  border-radius: 20px;
  font-size: 0.72rem;
  font-weight: 600;
}
.intel-mpm-badge-idle {
  background: rgba(139,149,165,0.1);
  color: #8b95a5;
  border: 1px solid rgba(139,149,165,0.2);
  padding: 2px 10px;
  border-radius: 20px;
  font-size: 0.72rem;
  font-weight: 600;
}
.intel-mpm-source {
  font-size: 0.72rem;
  color: #6b7280;
  margin-bottom: 6px;
}
.intel-mpm-summary {
  font-size: 0.85rem;
  color: #9ca3af;
  line-height: 1.5;
  margin-bottom: 10px;
}
.intel-mpm-issues {
  background: rgba(239,68,68,0.06);
  border: 1px solid rgba(239,68,68,0.15);
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 10px;
}
.intel-mpm-issues-title {
  font-size: 0.8rem;
  font-weight: 700;
  color: #ef4444;
  margin-bottom: 4px;
}
.intel-mpm-issues ul {
  margin: 0;
  padding-left: 16px;
}
.intel-mpm-issues li {
  font-size: 0.82rem;
  color: #fca5a5;
  padding: 1px 0;
}
.intel-mpm-next-steps {
  margin-top: 8px;
}
.intel-mpm-next-steps-title {
  font-size: 0.78rem;
  font-weight: 600;
  color: #8b95a5;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  margin-bottom: 4px;
}
.intel-mpm-step {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 2px 0;
  font-size: 0.82rem;
  color: #c9cfd8;
}
.intel-mpm-step::before {
  content: '☐';
  color: #6b7280;
  flex-shrink: 0;
}
.intel-mpm-expand {
  margin-top: 10px;
}
.intel-mpm-expand summary {
  font-size: 0.82rem;
  color: #4f8cff;
  cursor: pointer;
  user-select: none;
}
.intel-mpm-expand summary:hover {
  color: #6da3ff;
}
.intel-mpm-updates-list {
  padding-top: 8px;
}

@media (max-width: 768px) {
  .intel-deal-kpis { grid-template-columns: repeat(2, 1fr); }
  .intel-property-grid { grid-template-columns: 1fr; }
  .intel-mpm-grid { grid-template-columns: 1fr; }
  .intel-exec-header { flex-direction: column; gap: 12px; align-items: flex-start; }
}

/* =========================================
   INTEL V2 - Enhanced Layout
   ========================================= */

/* Summary Metrics Bar */
.intel-metrics-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 20px;
}
.intel-metric-card {
  display: flex;
  align-items: center;
  gap: 14px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  padding: 16px 20px;
  transition: border-color 0.2s, transform 0.15s;
}
.intel-metric-card:hover {
  border-color: rgba(255,255,255,0.12);
  transform: translateY(-1px);
}
.intel-metric-card-issues .intel-metric-value {
  color: #ef4444;
}
.intel-metric-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}
.intel-metric-info {
  min-width: 0;
}
.intel-metric-value {
  font-size: 1.6rem;
  font-weight: 800;
  color: #e4e7ec;
  line-height: 1.1;
}
.intel-metric-label {
  font-size: 0.75rem;
  color: #8b95a5;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  margin-top: 2px;
}

/* Main Layout: Content + Sidebar */
.intel-main-layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 20px;
  align-items: start;
}

/* Subtabs Navigation */
.intel-subtabs {
  display: flex;
  gap: 4px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 4px;
  margin-bottom: 16px;
}
.intel-subtab {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border: none;
  background: transparent;
  color: #8b95a5;
  font-size: 0.88rem;
  font-weight: 600;
  border-radius: 9px;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.intel-subtab:hover {
  color: #c9cfd8;
  background: rgba(255,255,255,0.04);
}
.intel-subtab.active {
  background: rgba(79,140,255,0.12);
  color: #4f8cff;
  box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}
.intel-subtab-icon {
  font-size: 1rem;
}
.intel-subtab-count {
  font-size: 0.7rem;
  background: rgba(255,255,255,0.08);
  padding: 1px 7px;
  border-radius: 10px;
  min-width: 20px;
  text-align: center;
}
.intel-subtab.active .intel-subtab-count {
  background: rgba(79,140,255,0.2);
  color: #4f8cff;
}

/* Subtab content panels */
.intel-subtab-content {
  display: none;
}
.intel-subtab-content.active {
  display: block;
  animation: intelFadeIn 0.2s ease;
}
@keyframes intelFadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Toolbar: Search + Sort */
.intel-toolbar {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  align-items: center;
}
.intel-search-wrap {
  flex: 1;
  position: relative;
}
.intel-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.85rem;
  pointer-events: none;
}
.intel-search-input {
  width: 100%;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 9px 14px 9px 36px;
  color: #e4e7ec;
  font-size: 0.85rem;
  outline: none;
  transition: border-color 0.2s;
  box-sizing: border-box;
}
.intel-search-input:focus {
  border-color: rgba(79,140,255,0.4);
}
.intel-search-input::placeholder {
  color: #6b7280;
}
.intel-sort-select {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 9px 14px;
  color: #c9cfd8;
  font-size: 0.82rem;
  cursor: pointer;
  outline: none;
  min-width: 170px;
}
.intel-sort-select:focus {
  border-color: rgba(79,140,255,0.4);
}

/* Live Feed Sidebar */
.intel-feed-sidebar {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  overflow: hidden;
  position: sticky;
  top: 20px;
  max-height: calc(100vh - 100px);
  display: flex;
  flex-direction: column;
}
.intel-feed-sidebar-header {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
}
.intel-feed-sidebar-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #e4e7ec;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  user-select: none;
}
.intel-feed-toggle-icon {
  font-size: 0.7rem;
  color: #6b7280;
  transition: transform 0.2s;
}
.intel-feed-sidebar.collapsed .intel-feed-toggle-icon {
  transform: rotate(180deg);
}
.intel-feed-sidebar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.intel-feed-refresh-btn {
  background: rgba(79,140,255,0.1);
  border: 1px solid rgba(79,140,255,0.2);
  border-radius: 8px;
  padding: 4px 10px;
  color: #4f8cff;
  cursor: pointer;
  font-size: 0.8rem;
  transition: background 0.2s;
}
.intel-feed-refresh-btn:hover {
  background: rgba(79,140,255,0.2);
}
.intel-feed-sidebar-body {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: max-height 0.3s ease;
}
.intel-feed-sidebar.collapsed .intel-feed-sidebar-body {
  max-height: 0 !important;
  overflow: hidden;
}
.intel-live-filters {
  display: flex;
  gap: 6px;
  padding: 10px 16px;
  flex-wrap: wrap;
  flex-shrink: 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.intel-feed-stream {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}
.intel-feed-stream::-webkit-scrollbar {
  width: 4px;
}
.intel-feed-stream::-webkit-scrollbar-track {
  background: transparent;
}
.intel-feed-stream::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.1);
  border-radius: 4px;
}

/* Feed Time Groups */
.intel-feed-time-group {
  padding: 0;
}
.intel-feed-time-label {
  padding: 10px 16px 6px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  position: sticky;
  top: 0;
  background: rgba(22,27,34,0.95);
  backdrop-filter: blur(8px);
  z-index: 1;
  border-bottom: 1px solid rgba(255,255,255,0.03);
}

/* Feed Items - Chat Style */
.intel-feed-msg {
  display: flex;
  gap: 10px;
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.025);
  transition: background 0.15s;
  cursor: default;
}
.intel-feed-msg:hover {
  background: rgba(255,255,255,0.03);
}
.intel-feed-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
  text-transform: uppercase;
}
.intel-feed-msg-body {
  flex: 1;
  min-width: 0;
}
.intel-feed-msg-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
}
.intel-feed-sender {
  font-size: 0.82rem;
  font-weight: 700;
  color: #e4e7ec;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.intel-feed-cat-badge {
  font-size: 0.65rem;
  font-weight: 600;
  padding: 1px 7px;
  border-radius: 10px;
  white-space: nowrap;
  flex-shrink: 0;
}
.intel-feed-time {
  font-size: 0.7rem;
  color: #6b7280;
  margin-left: auto;
  flex-shrink: 0;
  white-space: nowrap;
}
.intel-feed-text {
  font-size: 0.82rem;
  color: #9ca3af;
  line-height: 1.45;
  word-break: break-word;
}

/* Enhanced Empty States */
.intel-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 24px;
  text-align: center;
}
.intel-empty-state-icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
  opacity: 0.5;
}
.intel-empty-state-title {
  font-size: 0.95rem;
  font-weight: 600;
  color: #8b95a5;
  margin-bottom: 4px;
}
.intel-empty-state-desc {
  font-size: 0.82rem;
  color: #6b7280;
}

/* Enhanced Property Cards */
.intel-prop-card {
  transition: border-color 0.2s, transform 0.15s;
  cursor: pointer;
  position: relative;
}
.intel-prop-attention {
  border-color: rgba(239,68,68,0.2) !important;
  box-shadow: inset 0 0 0 1px rgba(239,68,68,0.05);
}
.intel-prop-card:hover {
  border-color: rgba(255,255,255,0.12);
  transform: translateY(-1px);
}
.intel-prop-card.expanded {
  border-color: rgba(79,140,255,0.3);
}
.intel-prop-card .intel-card-expand-zone {
  display: none;
}
.intel-prop-card.expanded .intel-card-expand-zone {
  display: block;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.04);
  animation: intelFadeIn 0.2s ease;
}

/* Dollar amounts highlighted */
.intel-money {
  color: #22c55e;
  font-weight: 700;
}

/* Timeline indicator on cards */
.intel-last-activity {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
  color: #6b7280;
  margin-top: 8px;
}
.intel-last-activity-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.intel-last-activity-dot.recent { background: #22c55e; }
.intel-last-activity-dot.moderate { background: #f59e0b; }
.intel-last-activity-dot.stale { background: #6b7280; }

/* Deal card expand */
.intel-deal-card-exec {
  cursor: pointer;
}
.intel-deal-card-exec .intel-deal-expand-body {
  display: none;
}
.intel-deal-card-exec.expanded {
  border-color: rgba(255,255,255,0.15);
}
.intel-deal-card-exec.expanded .intel-deal-expand-body {
  display: block;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.04);
  animation: intelFadeIn 0.2s ease;
}

/* MPM card expand */
.intel-mpm-card-exec {
  cursor: pointer;
  transition: border-color 0.2s, transform 0.15s;
}
.intel-mpm-card-exec:hover {
  transform: translateY(-1px);
}
.intel-mpm-card-exec.expanded {
  border-color: rgba(139,92,246,0.3);
}
.intel-mpm-card-exec .intel-card-expand-zone {
  display: none;
}
.intel-mpm-card-exec.expanded .intel-card-expand-zone {
  display: block;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.04);
  animation: intelFadeIn 0.2s ease;
}

/* Responsive adjustments for new layout */
@media (max-width: 1200px) {
  .intel-main-layout {
    grid-template-columns: 1fr;
  }
  .intel-feed-sidebar {
    position: static;
    max-height: 500px;
  }
  .intel-metrics-bar {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .intel-metrics-bar {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .intel-metric-card {
    padding: 12px 14px;
  }
  .intel-subtabs {
    flex-wrap: wrap;
  }
  .intel-toolbar {
    flex-direction: column;
  }
  .intel-sort-select {
    width: 100%;
  }
}

/* ===== OVERVIEW REDESIGN — Executive Command Center ===== */

/* Hero Metrics Row */
.ov-hero {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.ov-hero-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 16px 18px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.ov-hero-card:hover {
  border-color: rgba(79,158,255,0.2);
  box-shadow: 0 0 20px rgba(79,158,255,0.05);
}
.ov-hero-icon {
  font-size: 1.6rem;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 2px;
}
.ov-hero-body {
  flex: 1;
  min-width: 0;
}
.ov-hero-value {
  font-size: 1.6rem;
  font-weight: 800;
  color: #e4e7ec;
  line-height: 1.15;
  letter-spacing: -0.5px;
}
.ov-hero-label {
  font-size: 0.78rem;
  color: #8b95a5;
  margin-top: 2px;
  font-weight: 500;
}
.ov-hero-period {
  display: inline-block;
  background: rgba(79,158,255,0.1);
  color: #4f9eff;
  font-size: 0.7rem;
  padding: 1px 7px;
  border-radius: 4px;
  margin-left: 4px;
  font-weight: 600;
  vertical-align: middle;
}

/* Date Range Picker for Hero Cards */
.ov-date-picker {
  display: inline-block;
  position: relative;
  margin-left: 4px;
  vertical-align: middle;
}
.ov-date-pill {
  display: inline-block;
  background: rgba(79,158,255,0.1);
  color: #4f9eff;
  font-size: 0.7rem;
  padding: 1px 7px;
  border-radius: 4px;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  font-family: inherit;
  line-height: 1.4;
}
.ov-date-pill:hover {
  background: rgba(79,158,255,0.18);
  border-color: rgba(79,158,255,0.3);
}
.ov-date-pill::after {
  content: '▾';
  margin-left: 3px;
  font-size: 0.55rem;
  opacity: 0.7;
}
.ov-date-picker.open .ov-date-pill {
  background: rgba(79,158,255,0.22);
  border-color: rgba(79,158,255,0.4);
}
.ov-date-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 100;
  background: #1c2231;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 4px 0;
  min-width: 140px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}
.ov-date-picker.open .ov-date-dropdown {
  display: block;
}
.ov-date-option {
  display: block;
  width: 100%;
  padding: 6px 14px;
  background: none;
  border: none;
  color: #c0c7d3;
  font-size: 0.75rem;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.1s, color 0.1s;
  white-space: nowrap;
}
.ov-date-option:hover {
  background: rgba(79,158,255,0.1);
  color: #e4e7ec;
}
.ov-date-option.active {
  color: #4f9eff;
  background: rgba(79,158,255,0.08);
}
.ov-hero-trend {
  margin-top: 6px;
  font-size: 0.78rem;
  font-weight: 600;
}
.ov-hero-trend .trend-up { color: #22c55e; }
.ov-hero-trend .trend-down { color: #ef4444; }
.ov-hero-trend .trend-flat { color: #6b7280; }

/* Hero card breakdown row (bookings sub-metrics) */
.ov-hero-breakdown {
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.ov-bd-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  min-width: 0;
}
.ov-bd-value {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.2;
  color: #e4e7ec;
}
.ov-bd-label {
  font-size: 0.65rem;
  color: #6b7280;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  margin-top: 2px;
}
.ov-bd-new .ov-bd-value { color: #22c55e; }
.ov-bd-resched .ov-bd-value { color: #f59e0b; }
.ov-bd-noshow .ov-bd-value { color: #ef4444; }
.ov-bd-divider {
  width: 1px;
  height: 28px;
  background: rgba(255,255,255,0.08);
  flex-shrink: 0;
}

/* Attention Required */
.ov-attention {
  background: rgba(239,68,68,0.06);
  border: 1px solid rgba(239,68,68,0.2);
  border-radius: 12px;
  padding: 16px 20px;
  margin-bottom: 24px;
}
.ov-attention-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.ov-attention-icon { font-size: 1.1rem; }
.ov-attention-title {
  font-size: 0.9rem;
  font-weight: 700;
  color: #fca5a5;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.ov-attention-items {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ov-attention-item {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(239,68,68,0.08);
  border: 1px solid rgba(239,68,68,0.15);
  border-radius: 8px;
  padding: 10px 16px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  flex: 1 1 auto;
  min-width: 220px;
}
.ov-attention-item:hover {
  background: rgba(239,68,68,0.14);
  border-color: rgba(239,68,68,0.3);
}
.ov-attention-item.warn {
  background: rgba(245,158,11,0.08);
  border-color: rgba(245,158,11,0.2);
}
.ov-attention-item.warn:hover {
  background: rgba(245,158,11,0.14);
  border-color: rgba(245,158,11,0.35);
}
.ov-attn-count {
  font-size: 1.3rem;
  font-weight: 800;
  color: #fca5a5;
  min-width: 40px;
}
.ov-attention-item.warn .ov-attn-count { color: #fbbf24; }
.ov-attn-text {
  font-size: 0.82rem;
  color: #d1d5db;
  line-height: 1.3;
}

/* Main grid: departments + activity */
.ov-main-grid {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 20px;
  margin-bottom: 24px;
}

/* Department cards */
.ov-departments {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.ov-dept-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  padding: 20px;
  transition: border-color 0.2s;
}
.ov-dept-card:hover {
  border-color: rgba(255,255,255,0.1);
}
.ov-dept-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.ov-dept-head-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ov-dept-icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: 1.1rem;
  flex-shrink: 0;
}
.ov-dept-name {
  font-size: 1rem;
  font-weight: 700;
  color: #e4e7ec;
}
.ov-dept-link {
  font-size: 0.78rem;
  color: #4f9eff;
  cursor: pointer;
  font-weight: 600;
  white-space: nowrap;
  transition: color 0.15s;
}
.ov-dept-link:hover { color: #7ab8ff; text-decoration: underline; }

.ov-dept-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 12px;
}
.ov-dept-metric {
  display: flex;
  flex-direction: column;
}
.ov-dept-metric-val {
  font-size: 1.35rem;
  font-weight: 800;
  color: #e4e7ec;
  line-height: 1.2;
}
.ov-dept-metric-val.ov-metric-warn { color: #f59e0b; }
.ov-dept-metric-lbl {
  font-size: 0.72rem;
  color: #6b7280;
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  font-weight: 500;
}

.ov-dept-extra {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,0.05);
  font-size: 0.82rem;
  color: #8b95a5;
}
.ov-dept-extra:empty { display: none; }

/* Activity Feed */
.ov-activity {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  max-height: 600px;
}
.ov-activity-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.ov-activity-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #e4e7ec;
}
.ov-activity-refresh {
  background: none;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 6px;
  padding: 4px 8px;
  cursor: pointer;
  font-size: 0.8rem;
  color: #8b95a5;
  transition: background 0.15s;
}
.ov-activity-refresh:hover { background: rgba(255,255,255,0.05); }
.ov-activity-list {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ov-activity-list::-webkit-scrollbar { width: 4px; }
.ov-activity-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 2px; }

.ov-feed-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 8px;
  border-radius: 8px;
  transition: background 0.12s;
}
.ov-feed-item:hover { background: rgba(255,255,255,0.03); }
.ov-feed-icon {
  font-size: 1rem;
  flex-shrink: 0;
  margin-top: 1px;
}
.ov-feed-body {
  flex: 1;
  min-width: 0;
}
.ov-feed-text {
  font-size: 0.82rem;
  color: #d1d5db;
  line-height: 1.4;
}
.ov-feed-text strong { color: #e4e7ec; font-weight: 600; }
.ov-feed-time {
  font-size: 0.7rem;
  color: #6b7280;
  margin-top: 2px;
}
.ov-activity-empty {
  text-align: center;
  color: #6b7280;
  padding: 32px 16px;
  font-size: 0.85rem;
}

/* Data Freshness Footer */
.ov-freshness-footer {
  font-size: 0.72rem;
  color: #4b5563;
  padding: 8px 0;
  text-align: center;
  border-top: 1px solid rgba(255,255,255,0.04);
}
.ov-freshness-footer span { display: inline; }
.ov-freshness-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
}
.ov-freshness-dot.fresh { background: #22c55e; }
.ov-freshness-dot.stale { background: #f59e0b; }
.ov-freshness-dot.old { background: #ef4444; }

/* Responsive */
@media (max-width: 1200px) {
  .ov-main-grid {
    grid-template-columns: 1fr;
  }
  .ov-activity {
    max-height: 400px;
  }
}
@media (max-width: 1200px) {
  .ov-hero {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 900px) {
  .ov-hero {
    grid-template-columns: repeat(2, 1fr);
  }
  .ov-departments {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .ov-hero {
    grid-template-columns: 1fr;
  }
  .ov-hero-card {
    padding: 14px 16px;
  }
  .ov-hero-value {
    font-size: 1.4rem;
  }
}

/* ==================== PROPMANAGER DATA CENTER ==================== */
.pm-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 24px;
}
.pm-title-row h1 { margin: 0; font-size: 1.5rem; color: #e2e8f0; }
.pm-title-row p { margin: 2px 0 0; color: #8b949e; font-size: 0.85rem; }
.pm-subtabs { display: flex; gap: 4px; background: #161b22; border-radius: 8px; padding: 4px; }
.pm-subtab-content { display: none; }
.pm-subtab-content.active { display: block; animation: salesFadeIn 200ms ease; }

/* Hero Metrics */
.pm-hero-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
  margin-bottom: 24px;
}
.pm-hero-card {
  background: #161b22;
  border: 1px solid #30363d;
  border-radius: 12px;
  padding: 20px 16px;
  text-align: center;
  transition: border-color 0.2s, transform 0.15s;
}
.pm-hero-card:hover { border-color: #4f9eff; transform: translateY(-2px); }
.pm-hero-icon { font-size: 1.6rem; margin-bottom: 8px; }
.pm-hero-value { font-size: 1.8rem; font-weight: 700; color: #e2e8f0; }
.pm-hero-label { font-size: 0.75rem; color: #8b949e; text-transform: uppercase; letter-spacing: 0.5px; margin-top: 4px; }
.pm-hero-sub { font-size: 0.7rem; color: #f0883e; margin-top: 2px; }

/* Grid Layout */
.pm-grid-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 24px; }
.pm-section-card {
  background: #161b22;
  border: 1px solid #30363d;
  border-radius: 12px;
  padding: 20px;
}
.pm-section-card.pm-full-width { grid-column: 1 / -1; }
.pm-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.pm-section-header h3 { margin: 0; color: #e2e8f0; font-size: 1rem; }
.pm-section-badge {
  background: #1c2333;
  color: #4f9eff;
  font-size: 0.8rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 20px;
}

/* Role Chart */
.pm-role-chart { margin-bottom: 12px; }
.pm-role-bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.pm-role-bar-label {
  width: 120px;
  font-size: 0.78rem;
  color: #8b949e;
  text-align: right;
  flex-shrink: 0;
}
.pm-role-bar-track {
  flex: 1;
  height: 22px;
  background: #1c2333;
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}
.pm-role-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.5s ease;
  display: flex;
  align-items: center;
  padding-left: 6px;
  font-size: 0.7rem;
  color: #fff;
  font-weight: 600;
  min-width: 24px;
}
.pm-role-legend { display: flex; flex-wrap: wrap; gap: 8px; }
.pm-role-legend-item { font-size: 0.72rem; color: #8b949e; display: flex; align-items: center; gap: 4px; }
.pm-role-legend-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }

/* Occupancy */
.pm-occupancy-bar-container { margin-bottom: 16px; }
.pm-occupancy-label { display: flex; justify-content: space-between; font-size: 0.85rem; color: #e2e8f0; margin-bottom: 6px; }
.pm-occupancy-bar { height: 20px; background: #1c2333; border-radius: 6px; overflow: hidden; }
.pm-occupancy-fill { height: 100%; background: linear-gradient(90deg, #238636, #2ea043); border-radius: 6px; transition: width 0.5s ease; }
.pm-occupancy-details { display: flex; gap: 16px; margin-top: 8px; font-size: 0.78rem; color: #8b949e; }
.pm-occupancy-alert {
  background: rgba(248, 81, 73, 0.1);
  border: 1px solid rgba(248, 81, 73, 0.3);
  border-radius: 8px;
  padding: 12px;
  margin-top: 12px;
  color: #f85149;
  font-size: 0.82rem;
  text-align: center;
}

/* Overview Stats */
.pm-overview-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.pm-ov-stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #1c2333;
  border-radius: 8px;
  padding: 10px 12px;
}
.pm-ov-label { color: #8b949e; font-size: 0.78rem; }
.pm-ov-value { color: #e2e8f0; font-weight: 600; font-size: 0.95rem; }

/* Platform Health */
.pm-health-actions { display: flex; align-items: center; gap: 8px; }
.pm-health-dot { font-size: 1rem; }
.pm-health-dot.online { color: #2ea043; }
.pm-health-dot.offline { color: #f85149; }
.pm-health-dot.checking { color: #d29922; }
#pm-health-status { font-size: 0.8rem; color: #8b949e; }
.pm-refresh-btn {
  background: #1c2333;
  border: 1px solid #30363d;
  color: #e2e8f0;
  border-radius: 6px;
  padding: 4px 10px;
  cursor: pointer;
  font-size: 1rem;
  transition: background 0.15s;
}
.pm-refresh-btn:hover { background: #30363d; }
.pm-health-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.pm-health-item {
  background: #1c2333;
  border-radius: 8px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pm-health-label { color: #8b949e; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.3px; }
.pm-health-value { color: #e2e8f0; font-size: 0.9rem; font-weight: 500; }
.pm-health-link { color: #4f9eff; font-size: 0.85rem; text-decoration: none; word-break: break-all; }
.pm-health-link:hover { text-decoration: underline; }

/* Org List */
.pm-org-list { margin-top: 16px; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.pm-org-card {
  background: #1c2333;
  border: 1px solid #30363d;
  border-radius: 8px;
  padding: 12px;
}
.pm-org-name { color: #e2e8f0; font-weight: 600; font-size: 0.85rem; margin-bottom: 4px; }
.pm-org-detail { color: #8b949e; font-size: 0.75rem; }

/* App Iframe */
.pm-app-iframe {
  width: 100%;
  height: calc(100vh - 160px);
  border: none;
  border-radius: 8px;
  background: #0d1117;
}

/* Responsive */
@media (max-width: 1200px) {
  .pm-hero-grid { grid-template-columns: repeat(3, 1fr); }
  .pm-health-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .pm-hero-grid { grid-template-columns: repeat(2, 1fr); }
  .pm-grid-2col { grid-template-columns: 1fr; }
  .pm-overview-stats { grid-template-columns: repeat(2, 1fr); }
  .pm-health-grid { grid-template-columns: 1fr; }
  .pm-header { flex-direction: column; align-items: flex-start; }
}


/* ==================== SALES TAB VISUAL FACELIFT ==================== */

/* --- 1. KPI ROW OVERHAUL --- */
.sales-kpis {
  gap: 14px;
  margin-bottom: 24px;
}

.sales-kpi-card {
  background: var(--bg-2);
  padding: 22px 20px 18px;
  border: 1px solid var(--border);
  box-shadow: none;
  position: relative;
  overflow: hidden;
}

.sales-kpi-card::before {
  height: 2px;
  opacity: 0;
}

.sales-kpi-card:hover {
  border-color: var(--border-active);
  box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}

.sales-kpi-value {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.5px;
  margin-bottom: 6px;
  line-height: 1.1;
}

.sales-kpi-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.8px;
  color: var(--text-muted);
  margin-bottom: 10px;
}

.sales-kpi-trend {
  margin-top: 6px;
  font-size: 12px;
  min-height: 22px;
}

.sales-trend {
  font-weight: 600;
  font-size: 11px;
  padding: 3px 10px;
  border-radius: 20px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.sales-trend.trend-up {
  color: #10b981;
  background: rgba(16,185,129,0.1);
}

.sales-trend.trend-down {
  color: #ef4444;
  background: rgba(239,68,68,0.1);
}

.sales-trend.trend-flat {
  color: var(--text-tertiary);
  background: rgba(255,255,255,0.04);
}

/* Revenue KPI value in green */
#salesRevenue {
  color: #10b981;
}

/* --- 2. DATE RANGE PILLS OVERHAUL --- */
.sales-date-range {
  padding: 10px 14px;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  margin-bottom: 20px;
  gap: 10px;
}

.date-range-pills {
  gap: 5px;
}

.range-pill {
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--text-tertiary);
  cursor: pointer;
  transition: all 0.15s ease;
}

.range-pill:hover {
  background: rgba(255,255,255,0.04);
  color: var(--text-secondary);
  border-color: transparent;
}

.range-pill.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(99,102,241,0.25);
}

/* --- 3. SUBTAB NAVIGATION OVERHAUL --- */
.sales-subtabs {
  background: transparent;
  border-radius: 0;
  padding: 0;
  gap: 0;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--border);
  width: 100%;
}

#tab-sales .sales-subtabs .subtab,
.sales-subtabs .subtab {
  padding: 10px 18px;
  border-radius: 0;
  background: transparent !important;
  color: var(--text-tertiary);
  font-size: 13px;
  font-weight: 500;
  position: relative;
  transition: color 0.15s ease;
  box-shadow: none !important;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}

#tab-sales .sales-subtabs .subtab:hover,
.sales-subtabs .subtab:hover {
  color: var(--text-primary);
}

#tab-sales .sales-subtabs .subtab.active,
.sales-subtabs .subtab.active {
  color: var(--accent-hover) !important;
  background: transparent !important;
  box-shadow: none !important;
  border-bottom: 2px solid var(--accent);
}

/* Nested subtabs - same treatment */
.nested-subtabs {
  background: transparent;
  border-radius: 0;
  padding: 0;
  gap: 0;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--border);
  width: 100%;
}

.nested-subtab {
  padding: 8px 16px;
  border-radius: 0;
  background: transparent;
  color: var(--text-tertiary);
  font-size: 12px;
  font-weight: 500;
  position: relative;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color 0.15s ease;
}

.nested-subtab:hover {
  color: var(--text-primary);
}

.nested-subtab.active {
  background: transparent;
  color: var(--accent-hover);
  box-shadow: none;
  border-bottom: 2px solid var(--accent);
}

/* --- 4. PROJECTION CARD OVERHAUL --- */
.projection-card {
  background: linear-gradient(135deg, rgba(99,102,241,0.06), rgba(139,92,246,0.04));
  border: 1px solid rgba(99,102,241,0.15);
  padding: 28px 32px;
}

.projection-card::before {
  height: 3px;
  background: var(--accent-gradient);
  opacity: 1;
}

.projection-header h2 {
  font-size: 20px;
  font-weight: 700;
}

.projection-amount {
  color: #10b981;
  font-size: 28px;
  font-weight: 800;
}

.projection-subtitle {
  font-size: 13px;
  color: var(--text-secondary);
  margin-top: 4px;
}

.projection-stat .stat-value {
  font-size: 22px;
  font-weight: 800;
}

/* --- 5. COMMAND SECTION HEADERS --- */
.command-section {
  margin-bottom: 28px;
}

.command-section-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}

/* --- 6. CLOSER PERFORMANCE CARDS --- */
.closer-performance-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px;
  transition: all 0.2s ease;
}

.closer-performance-card:hover {
  border-color: var(--border-active);
  box-shadow: 0 4px 16px rgba(0,0,0,0.2);
  transform: translateY(-2px);
}

.closer-name {
  font-size: 16px;
  font-weight: 700;
}

.closer-metrics {
  gap: 14px;
}

.closer-metric {
  background: var(--bg-1);
  border-radius: var(--radius-sm);
  padding: 10px 8px;
}

.metric-value {
  font-size: 20px;
  font-weight: 800;
}

.metric-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-top: 4px;
}

/* Revenue metric values in green */
.closer-metric .metric-value[data-type="revenue"],
.setter-metric-section .metric-main[style*="color:#10b981"],
.close-amount,
.channel-amount {
  color: #10b981 !important;
}

/* --- 7. SETTER CARDS OVERHAUL --- */
.setter-card-new {
  background: var(--bg-2);
  border: 1px solid var(--border);
  padding: 1.25rem;
  transition: all 0.2s ease;
}

.setter-card-new:hover {
  border-color: var(--border-active);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.2);
}

.setter-name-title {
  font-size: 1.15rem;
  font-weight: 700;
}

.setter-metric-section {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 0.75rem;
}

.metric-section-title {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.6px;
  color: var(--text-muted);
}

.metric-main {
  font-size: 1.3rem;
  font-weight: 800;
}

/* --- 8. TABLES — GLOBAL SALES STYLING --- */
.sales-table tbody tr:nth-child(even) td,
.close-ledger-table tbody tr:nth-child(even) td {
  background: rgba(255,255,255,0.015);
}

.sales-table tbody tr:hover td,
.close-ledger-table tbody tr:hover td {
  background: rgba(99,102,241,0.06) !important;
}

.sales-table th,
.close-ledger-table th {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 10px 12px;
  border-bottom: 2px solid var(--border);
  position: relative;
  user-select: none;
}

.sales-table th[onclick],
.close-ledger-table th[onclick] {
  cursor: pointer;
}

.sales-table th[onclick]:hover,
.close-ledger-table th[onclick]:hover {
  color: var(--text-secondary);
}

.sales-table td,
.close-ledger-table td {
  padding: 10px 12px;
  font-size: 13px;
  border-bottom: 1px solid var(--border-subtle);
  transition: background 0.1s ease;
}

/* Dollar amounts green in tables */
.sales-table td[data-type="money"],
.close-ledger-table td[data-type="money"] {
  color: #10b981;
  font-weight: 600;
}

/* --- 9. STATUS BADGES --- */
.status-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.status-badge.status-won,
.status-badge.status-closed,
.status-badge.status-completed {
  background: rgba(16,185,129,0.12);
  color: #10b981;
}

.status-badge.status-open,
.status-badge.status-active,
.status-badge.status-in-progress {
  background: rgba(59,130,246,0.12);
  color: #3b82f6;
}

.status-badge.status-lost,
.status-badge.status-cancelled,
.status-badge.status-no-show {
  background: rgba(239,68,68,0.12);
  color: #ef4444;
}

.status-badge.status-pending,
.status-badge.status-scheduled {
  background: rgba(245,158,11,0.12);
  color: #f59e0b;
}

/* --- 10. CLOSE FEED STYLING --- */
.close-feed {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.close-feed-item {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-subtle);
  transition: background 0.1s ease;
}

.close-feed-item:hover {
  background: rgba(255,255,255,0.02);
}

.close-feed-item:last-child {
  border-bottom: none;
}

/* --- 11. REVENUE CHANNEL CARDS --- */
.revenue-channel {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  transition: border-color 0.15s ease;
}

.revenue-channel:hover {
  border-color: var(--border-active);
}

.channel-amount {
  color: #10b981;
  font-weight: 700;
  font-size: 15px;
}

/* --- 12. LOADING & EMPTY STATES --- */
.sales-loading {
  text-align: center;
  color: var(--text-muted);
  padding: 48px 24px;
  font-size: 13px;
}

.sales-loading::before {
  content: '⏳';
  display: block;
  font-size: 28px;
  margin-bottom: 10px;
  opacity: 0.5;
}

.sales-empty {
  text-align: center;
  color: var(--text-muted);
  padding: 48px 24px;
  font-size: 13px;
}

.sales-empty::before {
  content: '📭';
  display: block;
  font-size: 28px;
  margin-bottom: 10px;
  opacity: 0.5;
}

.command-loading {
  font-size: 13px;
  color: var(--text-muted);
  border: 1px solid var(--border);
  background: var(--bg-2);
}

.command-empty {
  font-size: 13px;
  color: var(--text-muted);
  padding: 32px;
}

.command-empty::before {
  content: '📭';
  margin-right: 6px;
}

.command-error {
  border: 1px solid rgba(239,68,68,0.2);
}

/* --- 13. DETAIL CARDS (CLOSERS/SETTERS TABS) --- */
.sales-detail-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 24px;
  margin-bottom: 16px;
  transition: border-color 0.15s ease;
}

.sales-detail-card:hover {
  border-color: var(--border-active);
}

.sales-detail-metric-value {
  font-size: 24px;
  font-weight: 800;
}

.sales-detail-metric-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--text-muted);
}

/* --- 14. PERSON CARDS (shared) --- */
.sales-person-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px;
  transition: all 0.2s ease;
}

.sales-person-card:hover {
  border-color: var(--border-active);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.2);
}

.sales-person-name {
  font-size: 15px;
  font-weight: 700;
}

.sales-stat-value {
  font-size: 18px;
  font-weight: 800;
}

/* --- 15. AI INSIGHTS SECTION --- */
.sales-suggestion-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  transition: border-color 0.15s ease;
}

.sales-suggestion-card:hover {
  border-color: var(--border-active);
}

/* --- 16. CLOSE LEDGER TABLE --- */
.close-ledger-summary {
  gap: 12px;
  margin-bottom: 20px;
}

.close-ledger-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.close-ledger-table-container {
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--border);
}

.close-ledger-table {
  border-collapse: collapse;
  width: 100%;
}

.close-ledger-table thead tr {
  background: var(--bg-3);
}

.close-ledger-table tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.015);
}

.close-ledger-table tbody tr:hover {
  background: rgba(99,102,241,0.06);
}

/* --- 17. PIPELINE TAB --- */
.sales-funnel-stage {
  transition: transform 0.15s ease;
}

.sales-funnel-stage:hover {
  transform: scale(1.03);
}

.sales-funnel-bar {
  border-radius: var(--radius-sm);
  transition: all 0.3s ease;
}

/* --- 18. GENERAL SPACING & POLISH --- */
.sales-dashboard {
  padding-top: 4px;
}

.sales-dashboard > .sales-kpis {
  margin-bottom: 20px;
}

.sales-dashboard > .sales-date-range {
  margin-bottom: 16px;
}

.sales-dashboard > .sales-subtabs {
  margin-bottom: 24px;
}

/* Consistent section spacing */
.command-center-grid {
  gap: 24px;
  margin-bottom: 24px;
}

.closer-performance-grid {
  gap: 16px;
}

.setter-performance-groups {
  gap: 20px;
}

/* Section dividers */
.command-section + .command-section {
  border-top: 1px solid var(--border);
  padding-top: 24px;
}

/* Smooth animations */
.sales-subtab-content.active {
  animation: salesFadeIn 250ms ease-out;
}

@keyframes salesFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

/* --- 19. TYPE/CHANNEL BADGES POLISH --- */
.type-badge, .channel-badge {
  font-size: 9px;
  padding: 2px 7px;
  border-radius: 4px;
  font-weight: 700;
  letter-spacing: 0.4px;
  line-height: 1.4;
}

/* --- 20. FILTER BAR POLISH --- */
.close-ledger-filters {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px;
  margin-bottom: 16px;
}

.filter-row {
  gap: 12px;
}

.filter-group label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-muted);
}

.filter-group input,
.filter-group select {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-secondary);
  padding: 6px 10px;
  font-size: 12px;
  transition: border-color 0.15s ease;
}

.filter-group input:focus,
.filter-group select:focus {
  border-color: var(--accent);
  outline: none;
}

.filter-apply-btn {
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-sm);
  padding: 6px 16px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease;
}

.filter-apply-btn:hover {
  background: var(--accent-hover);
}

.filter-reset-btn {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-tertiary);
  border-radius: var(--radius-sm);
  padding: 6px 14px;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.filter-reset-btn:hover {
  border-color: var(--border-active);
  color: var(--text-secondary);
}

/* --- 21. LEADS FUNNEL KPI CARDS --- */
.leads-kpis {
  gap: 14px;
  margin-bottom: 24px;
}

.leads-kpi-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px;
  transition: border-color 0.15s ease;
}

.leads-kpi-card:hover {
  border-color: var(--border-active);
}

.leads-kpi-card.critical {
  border-color: rgba(239,68,68,0.3);
}

.leads-section {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px;
  margin-bottom: 20px;
}

.leads-section-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-secondary);
  margin-bottom: 14px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

/* --- 22. AI INSIGHTS TAB --- */
.ai-insights-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 4px;
}

.ai-insights-header p {
  font-size: 13px;
  color: var(--text-tertiary);
}

.ai-insights-panel,
.ai-automation-panel,
.ai-leads-panel {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 20px;
}

.ai-insights-panel h3,
.ai-automation-panel h3,
.ai-leads-panel h3 {
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  color: var(--text-secondary);
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}

.automation-status-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border-subtle);
}

.automation-status-item:last-child {
  border-bottom: none;
}

.status-indicator {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 5px;
  flex-shrink: 0;
}

.status-indicator.status-ready { background: #10b981; box-shadow: 0 0 6px rgba(16,185,129,0.4); }
.status-indicator.status-monitoring { background: #3b82f6; box-shadow: 0 0 6px rgba(59,130,246,0.4); }

/* --- 23. PROGRESS BAR POLISH --- */
.progress-bar {
  height: 8px;
  background: var(--bg-3);
  border-radius: 4px;
  overflow: hidden;
}

.progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent), #10b981);
  border-radius: 4px;
  transition: width 1s ease;
}

/* --- 24. SCROLLBAR POLISH FOR CLOSE FEED --- */
.close-feed::-webkit-scrollbar {
  width: 4px;
}

.close-feed::-webkit-scrollbar-track {
  background: transparent;
}

.close-feed::-webkit-scrollbar-thumb {
  background: var(--bg-3);
  border-radius: 2px;
}

.close-feed::-webkit-scrollbar-thumb:hover {
  background: var(--text-muted);
}

/* --- 25. SALES LOADING PULSE REFINEMENT --- */
.sales-loading-pulse {
  color: var(--text-muted);
  font-size: 28px;
}

@keyframes salesPulse {
  0%, 100% { opacity: 0.2; }
  50% { opacity: 0.8; }
}

/* --- END SALES FACELIFT --- */

/* --- SORT INDICATORS FOR TABLE HEADERS --- */
.sales-table th[onclick]::after,
.close-ledger-table th[onclick]::after {
  content: '⇅';
  margin-left: 4px;
  font-size: 10px;
  opacity: 0.3;
}

.close-ledger-table th.sorted-asc::after {
  content: '↑';
  opacity: 0.8;
  color: var(--accent-hover);
}

.close-ledger-table th.sorted-desc::after {
  content: '↓';
  opacity: 0.8;
  color: var(--accent-hover);
}

/* Alternating rows for revenue tables */
.sales-table tbody tr:nth-child(even) td {
  background: rgba(255,255,255,0.015);
}

.sales-table tbody tr:hover td {
  background: rgba(99,102,241,0.06) !important;
}

/* ==================== FACELIFT: Additional Polish (Construction/RentRoll/Calls/Costs) ==================== */

/* Construction section headers */
.construction-section-header {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--border-active);
}

/* Ledger table dollar amounts green */
.ledger-money-green { color: var(--green) !important; font-family: var(--font-mono); font-weight: 600; }

/* Costs — status badge backgrounds */
.costs-status-badge.status-live { background: rgba(16,185,129,0.1); color: #10b981; }
.costs-status-badge.status-cached { background: rgba(245,158,11,0.1); color: #f59e0b; }
.costs-status-badge.status-offline { background: rgba(107,114,128,0.1); color: #6b7280; }

/* Costs KPI value sizing fix */
.costs-kpi-val { font-size: 22px; }
.costs-kpi-val-lg { font-size: 28px; }

/* Costs agent column separation */
.costs-agent-onyx { background: rgba(79,158,255,0.02); border-radius: var(--radius-lg); padding: 20px; }
.costs-agent-nova { background: rgba(167,139,250,0.02); border-radius: var(--radius-lg); padding: 20px; }

/* Calls timeline polish */
.ci-timeline-entry { padding-left: 4px; }
.ci-timeline-dot { border: 2px solid var(--bg-0); box-shadow: 0 0 0 1px var(--accent); }
.ci-timeline-date { font-size: 13px; }
.ci-timeline-purpose { font-size: 14px; }

/* Calls section polish */
.ci-section { background: var(--bg-1); border-radius: var(--radius-md); padding: 16px; margin-bottom: 20px; border: 1px solid var(--border); }
.ci-section-title { border-bottom: none; margin-bottom: 12px; padding-bottom: 0; font-size: 13px; }

/* Rent Roll analytics section border */
.rr-analytics-section { border: 1px solid var(--border); }

/* Content cards polish */
.content-card { border: 1px solid var(--border); transition: transform 150ms, box-shadow 150ms; }
.content-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }

/* Responsive costs */
@media (max-width: 1100px) {
  .costs-agent-grid { grid-template-columns: 1fr; }
  .costs-kpi-layout { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .ci-layout { grid-template-columns: 1fr; }
}

/* ===== INTEL ATTENTION BANNER OVERHAUL ===== */
.intel-attention-banner {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.attn-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}
.attn-header-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.attn-header-title {
  font-weight: 700;
  font-size: 1rem;
  color: #e2e8f0;
}
.attn-count-badge {
  font-size: 0.75rem;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 12px;
  background: rgba(239,68,68,0.15);
  color: #ef4444;
}
.attn-count-badge.warn { background: rgba(245,158,11,0.15); color: #f59e0b; }
.attn-count-badge.info { background: rgba(79,158,255,0.15); color: #4f9eff; }
.attn-toggle-btn {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  color: #8b95a5;
  font-size: 0.78rem;
  padding: 5px 12px;
  cursor: pointer;
  transition: all 0.15s;
}
.attn-toggle-btn:hover { background: rgba(255,255,255,0.08); color: #c9cfd8; }

/* Severity sections */
.attn-section {
  border-radius: 10px;
  padding: 12px 16px;
  transition: all 0.2s;
}
.attn-section.critical {
  background: rgba(239,68,68,0.06);
  border: 1px solid rgba(239,68,68,0.2);
}
.attn-section.warning {
  background: rgba(245,158,11,0.06);
  border: 1px solid rgba(245,158,11,0.2);
}
.attn-section.info {
  background: rgba(79,158,255,0.06);
  border: 1px solid rgba(79,158,255,0.2);
}
.attn-section-header {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}
.attn-section-icon {
  font-size: 0.85rem;
}
.attn-section-label {
  font-weight: 700;
  font-size: 0.82rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.attn-section.critical .attn-section-label { color: #ef4444; }
.attn-section.warning .attn-section-label { color: #f59e0b; }
.attn-section.info .attn-section-label { color: #4f9eff; }
.attn-section-count {
  font-size: 0.75rem;
  color: #6b7280;
  margin-left: auto;
}
.attn-section-chevron {
  color: #6b7280;
  font-size: 0.7rem;
  transition: transform 0.2s;
}
.attn-section.expanded .attn-section-chevron {
  transform: rotate(90deg);
}
.attn-section-items {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.25s ease;
}
.attn-section.expanded .attn-section-items {
  max-height: 600px;
}
.attn-issue-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 0.85rem;
  color: #c9cfd8;
  word-break: break-word;
}
.attn-issue-row:last-child { border-bottom: none; }
.attn-issue-project {
  font-weight: 600;
  color: #e2e8f0;
  white-space: nowrap;
  min-width: 100px;
  flex-shrink: 0;
}
.attn-issue-text {
  flex: 1;
  min-width: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.attn-issue-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-top: 7px;
  flex-shrink: 0;
}
.attn-section.critical .attn-issue-dot { background: #ef4444; }
.attn-section.warning .attn-issue-dot { background: #f59e0b; }
.attn-section.info .attn-issue-dot { background: #4f9eff; }

/* ===== GLOBAL OVERFLOW & RESPONSIVE FIXES ===== */
.intel-dashboard,
.intel-content-area,
.intel-feed-sidebar,
.intel-main-layout {
  min-width: 0;
  overflow: hidden;
}
.intel-prop-card,
.intel-acq-card,
.intel-deal-card,
.intel-mpm-card {
  min-width: 0;
  overflow: hidden;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.intel-prop-summary,
.intel-prop-update-text,
.intel-feed-msg-text,
.intel-feed-msg-body,
.intel-mpm-summary,
.intel-deal-detail {
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
  min-width: 0;
}
.intel-prop-address,
.intel-mpm-client,
.intel-deal-name {
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.intel-prop-card-header,
.intel-mpm-card-header {
  flex-wrap: wrap;
  gap: 8px;
}
.intel-status-badge {
  white-space: nowrap;
  flex-shrink: 0;
}
.intel-metrics-bar {
  flex-wrap: wrap !important;
}
.intel-metric-card {
  min-width: 140px;
}

/* Responsive: stack layout on smaller screens */
@media (max-width: 1100px) {
  .intel-main-layout {
    grid-template-columns: 1fr !important;
  }
  .intel-feed-sidebar {
    max-height: 400px;
  }
}
@media (max-width: 700px) {
  .intel-property-grid,
  .intel-mpm-grid {
    grid-template-columns: 1fr !important;
  }
  .intel-subtabs {
    flex-wrap: wrap;
  }
  .intel-metrics-bar {
    gap: 8px !important;
  }
  .intel-metric-card {
    min-width: 120px;
    flex: 1 1 45%;
  }
  .intel-exec-header {
    flex-wrap: wrap;
    gap: 10px;
  }
}

/* ===== INTEL PROPERTY CARD OVERHAUL ===== */
.intel-prop-card {
  background: #161b22 !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 14px !important;
  padding: 0 !important;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.15s, box-shadow 0.2s;
  overflow: hidden;
}
.intel-prop-card:hover {
  border-color: rgba(79,158,255,0.2) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}
.intel-prop-card.expanded {
  border-color: rgba(79,158,255,0.3) !important;
}
.intel-prop-card-header {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 16px 18px 12px !important;
  margin-bottom: 0 !important;
  background: rgba(255,255,255,0.015);
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.intel-prop-card-header .intel-prop-top-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.intel-prop-address {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: #e2e8f0 !important;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Status badge — short labels only, wrap if long */
.intel-status-badge {
  max-width: 180px;
  white-space: nowrap !important;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
}
/* Long status text rendered below header as description */
.intel-prop-status-desc {
  font-size: 0.8rem;
  color: #8b95a5;
  margin-top: 6px;
  line-height: 1.45;
  word-wrap: break-word;
}
.intel-prop-card-body {
  padding: 12px 18px 16px;
}
.intel-prop-summary {
  font-size: 0.85rem !important;
  color: #b0b8c4 !important;
  margin-bottom: 10px !important;
  line-height: 1.5 !important;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.intel-prop-update-item {
  display: flex !important;
  gap: 10px !important;
  padding: 6px 0 !important;
  font-size: 0.82rem !important;
  align-items: flex-start;
}
.intel-prop-update-time {
  color: #6b7280 !important;
  min-width: 50px !important;
  flex-shrink: 0 !important;
  font-size: 0.75rem;
  padding-top: 1px;
}
.intel-prop-update-text {
  color: #c0c8d4 !important;
  word-wrap: break-word;
  overflow-wrap: break-word;
  min-width: 0;
}
.intel-prop-actions {
  margin-top: 12px !important;
  padding: 10px 14px !important;
  border-top: none !important;
  background: rgba(255,255,255,0.02);
  border-radius: 8px;
}
.intel-prop-actions ul {
  margin: 6px 0 0 !important;
  padding-left: 16px !important;
}
.intel-prop-actions li {
  font-size: 0.82rem !important;
  color: #9ca3af !important;
  padding: 3px 0 !important;
  line-height: 1.4;
}
/* Expand hint */
.intel-prop-card::after {
  content: 'Click to expand';
  display: block;
  text-align: center;
  font-size: 0.72rem;
  color: #4b5563;
  padding: 6px 0 10px;
  transition: color 0.15s;
}
.intel-prop-card:hover::after {
  color: #6b7280;
}
.intel-prop-card.expanded::after {
  content: 'Click to collapse';
  color: #4f9eff;
}

/* Last activity indicator */
.intel-last-activity {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  color: #6b7280;
  margin: 6px 0 0;
}
.intel-last-activity-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}
.intel-last-activity-dot.recent { background: #10b981; }
.intel-last-activity-dot.moderate { background: #f59e0b; }
.intel-last-activity-dot.stale { background: #6b7280; }

/* MPM + Deal cards same treatment */
.intel-mpm-card,
.intel-deal-stage-card {
  background: #161b22;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  overflow: hidden;
  word-wrap: break-word;
}

/* MPM status line */
.intel-mpm-status-line {
  font-size: 0.75rem;
  font-weight: 600;
  color: #4f9eff;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin: 4px 0 6px;
}
.intel-mpm-summary {
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  line-height: 1.45 !important;
}
.intel-mpm-card-exec {
  overflow: hidden;
  word-wrap: break-word;
}

/* ===== BANKING TAB ===== */
.banking-dashboard { padding: 0; }

.banking-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.banking-kpi-card {
  background: var(--bg-card, #1a1a2e);
  border: 1px solid var(--border, #2a2a4a);
  border-radius: 12px;
  padding: 20px;
  text-align: center;
}

.banking-kpi-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-muted, #8888aa);
  margin-bottom: 8px;
}

.banking-kpi-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary, #e0e0ff);
}

.banking-kpi-value.positive { color: #4ade80; }
.banking-kpi-value.negative { color: #f87171; }

.banking-kpi-sub {
  font-size: 10px;
  color: var(--text-muted, #6666aa);
  margin-top: 4px;
}

.banking-charts-row {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 16px;
  margin-bottom: 24px;
}

.banking-chart-card {
  background: var(--bg-card, #1a1a2e);
  border: 1px solid var(--border, #2a2a4a);
  border-radius: 12px;
  padding: 20px;
}

.banking-chart-card.banking-chart-wide { }

.banking-chart-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary, #e0e0ff);
  margin-bottom: 16px;
}

.banking-table-section {
  background: var(--bg-card, #1a1a2e);
  border: 1px solid var(--border, #2a2a4a);
  border-radius: 12px;
  padding: 20px;
}

.banking-table-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 12px;
}

.banking-table-header h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary, #e0e0ff);
}

.banking-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.banking-filters select {
  background: var(--bg-input, #12121e);
  color: var(--text-primary, #e0e0ff);
  border: 1px solid var(--border, #2a2a4a);
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 12px;
  cursor: pointer;
}

.banking-table-wrap {
  overflow-x: auto;
  max-height: 500px;
  overflow-y: auto;
}

.banking-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.banking-table th {
  position: sticky;
  top: 0;
  background: var(--bg-card, #1a1a2e);
  text-align: left;
  padding: 10px 12px;
  font-weight: 600;
  color: var(--text-muted, #8888aa);
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.5px;
  border-bottom: 1px solid var(--border, #2a2a4a);
}

.banking-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border-light, #1e1e36);
  color: var(--text-primary, #d0d0ee);
}

.banking-table tr:hover td {
  background: rgba(100, 100, 255, 0.04);
}

.banking-table .text-right { text-align: right; }

.banking-table .amt-deposit { color: #4ade80; font-weight: 600; }
.banking-table .amt-withdrawal { color: #f87171; font-weight: 600; }

.banking-table .badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
}

.banking-table .badge-deposit { background: rgba(74, 222, 128, 0.12); color: #4ade80; }
.banking-table .badge-withdrawal { background: rgba(248, 113, 113, 0.12); color: #f87171; }

@media (max-width: 900px) {
  .banking-charts-row {
    grid-template-columns: 1fr;
  }
  .banking-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Banking Account Selector */
.banking-account-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  flex-wrap: wrap;
  gap: 12px;
}

.banking-account-tabs {
  display: flex;
  gap: 4px;
  background: var(--bg-card, #1a1a2e);
  border: 1px solid var(--border, #2a2a4a);
  border-radius: 10px;
  padding: 4px;
}

.banking-acct-btn {
  padding: 8px 16px;
  border: none;
  background: transparent;
  color: var(--text-muted, #8888aa);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.banking-acct-btn:hover {
  color: var(--text-primary, #e0e0ff);
  background: rgba(100, 100, 255, 0.08);
}

.banking-acct-btn.active {
  background: var(--accent, #818cf8);
  color: #fff;
}

.banking-account-meta {
  font-size: 11px;
  color: var(--text-muted, #6666aa);
}

/* ==================== GLOBAL OVERFLOW FIX (2026-03-16) ==================== */
/* Ensure nothing breaks out of viewport */
body, html { max-width: 100vw; overflow-x: hidden; }
.app-layout { overflow-x: hidden; }

/* All direct children of .main need overflow containment */
.main > * { max-width: 100%; }

/* Tables must scroll, not expand parent */
table { max-width: 100%; }
.sales-table-wrap,
.close-ledger-table-container,
.financial-table-wrap,
.costs-table-wrap,
.am-table-wrap,
.rr-live-table-wrap,
.banking-table-wrap,
.leads-table-wrap { 
  overflow-x: auto; 
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

/* Grid containers need overflow containment */
.kpi-grid,
.sales-kpis,
.sales-team-grid,
.sales-forecast-grid,
.sales-detail-metrics,
.performers-grid,
.projects-grid,
.alerts-grid,
.content-cards-grid {
  max-width: 100%;
  overflow: hidden;
}

/* Flex row containers should wrap on overflow */
.sales-subtabs,
.construction-subtabs,
.am-subtabs,
.calls-subtabs,
.cra-subtabs,
.date-range-pills { 
  flex-wrap: wrap; 
  max-width: 100%; 
}

/* Cards should not exceed parent */
.kpi-card,
.sales-kpi-card,
.projection-card,
.sales-detail-card,
.sales-person-card,
.alert-card { 
  min-width: 0; 
  max-width: 100%; 
  overflow: hidden;
}

/* Text truncation for long names/values */
.sales-person-name,
.sales-person-role,
.kpi-label,
.kpi-value { 
  overflow: hidden; 
  text-overflow: ellipsis; 
  white-space: nowrap; 
}

/* Chart containers */
.sales-bar-chart,
.costs-chart,
.rr-chart-wrap { 
  overflow-x: auto; 
  max-width: 100%; 
}

/* Mobile: full width everything */
@media (max-width: 768px) {
  .app-layout { max-width: 100vw !important; }
  .main { padding: 12px; max-width: 100vw; }
  .kpi-grid, .sales-kpis { grid-template-columns: 1fr 1fr !important; }
  .sales-team-grid { grid-template-columns: 1fr !important; }
  .sales-forecast-grid { grid-template-columns: 1fr 1fr !important; }
  .sales-detail-metrics { grid-template-columns: 1fr 1fr !important; }
  .performers-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 480px) {
  .kpi-grid, .sales-kpis { grid-template-columns: 1fr !important; }
  .sales-forecast-grid { grid-template-columns: 1fr !important; }
}

/* Subscription sub-notes on hero cards */
.ov-hero-sub-note {
  font-size: 0.75rem;
  color: #9ca3af;
  margin-top: -2px;
  min-height: 1rem;
}

/* Fix: Ensure user badge in header is not overlapped by content */
.header-right {
  z-index: 101;
  position: relative;
}
.user-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  padding: 4px 12px;
  background: var(--bg-2);
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
}
.user-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 13px;
  color: white;
  flex-shrink: 0;
}

/* Fix: Header must be above all scrolling content */
.header {
  z-index: 200 !important;
  position: sticky !important;
  top: 0 !important;
}
.app-layout > .header {
  z-index: 200;
}

/* Ensure .main content scrolls under header */
.main {
  position: relative;
  z-index: 1;
}

/* ==================== MEDIA GALLERY ==================== */

.media-gallery-header {
  margin-bottom: 24px;
}

.media-gallery-header h1 {
  font-size: 2rem;
  color: var(--text-primary);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.media-gallery-header p {
  color: var(--text-secondary);
  margin: 8px 0 0 0;
}

.media-gallery-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 12px;
  border: 1px solid var(--border-color);
}

.filter-controls {
  display: flex;
  gap: 12px;
  align-items: center;
}

.filter-controls select {
  background: var(--bg-primary);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: 8px 12px;
  color: var(--text-primary);
  font-size: 14px;
}

.gallery-refresh {
  display: flex;
  align-items: center;
  gap: 8px;
}

.refresh-btn {
  background: var(--bg-primary);
  border: 1px solid var(--border-color);
  border-radius: 6px;
  padding: 6px 8px;
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 16px;
  transition: all 0.2s ease;
}

.refresh-btn:hover {
  background: var(--bg-tertiary);
  color: var(--text-primary);
}

.media-gallery-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 24px;
  height: calc(100vh - 200px);
}

/* Projects Sidebar */
.projects-sidebar {
  background: var(--bg-secondary);
  border-radius: 12px;
  border: 1px solid var(--border-color);
  padding: 20px;
  overflow-y: auto;
}

.projects-sidebar h3 {
  color: var(--text-primary);
  margin: 0 0 16px 0;
  font-size: 1.1rem;
}

.projects-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.project-item {
  padding: 12px;
  background: var(--bg-primary);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.project-item:hover {
  background: var(--bg-tertiary);
  border-color: var(--accent-color);
}

.project-item.selected {
  background: var(--accent-color);
  border-color: var(--accent-color);
  color: white;
}

.project-name {
  font-weight: 600;
  margin-bottom: 4px;
}

.project-stats {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  opacity: 0.8;
}

.loading-projects, .no-projects, .error-message {
  text-align: center;
  padding: 20px;
  color: var(--text-secondary);
  font-style: italic;
}

.error-message {
  color: #ff6b6b;
}

/* Main Content Area */
.media-main-content {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.selected-project-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 20px;
  padding: 16px;
  background: var(--bg-secondary);
  border-radius: 12px;
  border: 1px solid var(--border-color);
}

.selected-project-header h2 {
  color: var(--text-primary);
  margin: 0;
  font-size: 1.4rem;
}

.project-stats .stats-separator {
  margin: 0 8px;
  opacity: 0.5;
}

.btn-primary {
  background: var(--accent-color);
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 8px;
  cursor: pointer;
  font-weight: 600;
  transition: background 0.2s ease;
}

.btn-primary:hover {
  background: #3a7bd5;
}

.btn-secondary {
  background: var(--bg-primary);
  color: var(--text-primary);
  border: 1px solid var(--border-color);
  padding: 8px 16px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.btn-secondary:hover {
  background: var(--bg-tertiary);
}

/* Media Grid */
.media-grid {
  flex: 1;
  overflow-y: auto;
  background: var(--bg-secondary);
  border-radius: 12px;
  border: 1px solid var(--border-color);
  padding: 20px;
}

.media-grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
}

.media-grid-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-secondary);
}

.loading-media {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  gap: 16px;
}

.loading-spinner {
  width: 24px;
  height: 24px;
  border: 2px solid var(--border-color);
  border-top: 2px solid var(--accent-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* Media Cards */
.media-card {
  background: var(--bg-primary);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.media-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.media-thumbnail-container {
  position: relative;
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: var(--bg-secondary);
}

.media-thumbnail {
  width: 100%;
  height: 100%;
  object-fit: cover;
  cursor: pointer;
  transition: transform 0.2s ease;
}

.media-thumbnail:hover {
  transform: scale(1.05);
}

.file-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: var(--text-secondary);
  line-height: 1.2;
}

.media-status-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 4px 8px;
  border-radius: 16px;
  font-size: 11px;
  font-weight: 600;
  backdrop-filter: blur(4px);
}

.media-status-badge.pending {
  background: rgba(255, 193, 7, 0.9);
  color: #000;
}

.media-status-badge.approved {
  background: rgba(40, 167, 69, 0.9);
  color: white;
}

.media-status-badge.rejected {
  background: rgba(220, 53, 69, 0.9);
  color: white;
}

.media-status-badge.queued {
  background: rgba(108, 117, 125, 0.9);
  color: white;
}

.media-info {
  padding: 16px;
}

.media-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.media-sender {
  font-weight: 600;
  color: var(--text-primary);
}

.media-timestamp {
  font-size: 12px;
  color: var(--text-secondary);
}

.media-context {
  font-size: 13px;
  color: var(--text-secondary);
  font-style: italic;
  margin-bottom: 12px;
  line-height: 1.4;
}

.media-caption {
  margin-bottom: 16px;
  position: relative;
}

.caption-input {
  width: 100%;
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: 8px 40px 8px 12px;
  color: var(--text-primary);
  font-size: 14px;
  resize: vertical;
  min-height: 60px;
  font-family: inherit;
}

.caption-input:focus {
  outline: none;
  border-color: var(--accent-color);
}

.suggest-caption-btn {
  position: absolute;
  right: 8px;
  top: 8px;
  background: var(--accent-color);
  border: none;
  color: white;
  padding: 6px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
  transition: background 0.2s ease;
}

.suggest-caption-btn:hover {
  background: #3a7bd5;
}

.media-actions {
  display: flex;
  gap: 8px;
}

.approve-btn, .reject-btn {
  flex: 1;
  padding: 8px 12px;
  border: 1px solid var(--border-color);
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  transition: all 0.2s ease;
}

.approve-btn {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.approve-btn:hover {
  background: #28a745;
  color: white;
  border-color: #28a745;
}

.approve-btn.approved {
  background: #28a745;
  color: white;
  border-color: #28a745;
}

.reject-btn {
  background: var(--bg-secondary);
  color: var(--text-primary);
}

.reject-btn:hover {
  background: #dc3545;
  color: white;
  border-color: #dc3545;
}

.reject-btn.rejected {
  background: #dc3545;
  color: white;
  border-color: #dc3545;
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .media-gallery-layout {
    grid-template-columns: 1fr;
    height: auto;
  }
  
  .projects-sidebar {
    max-height: 200px;
    margin-bottom: 20px;
  }
  
  .media-gallery-controls {
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
  }
  
  .filter-controls {
    justify-content: center;
  }
  
  .selected-project-header {
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
  }
  
  .media-grid-container {
    grid-template-columns: 1fr;
  }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* =============================================================
   COMPREHENSIVE RESPONSIVE FIXES
   Targets 1024–1440px viewports without breaking 1920px+ layouts
   ============================================================= */

/* --- Global: ensure all table wrappers scroll horizontally --- */
.sales-table-wrap,
.am-table-wrap,
.close-ledger-table-container,
.financial-table-wrap,
.costs-table-wrap,
.banking-table-wrap,
.leads-table-wrap,
.rr-property-body {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

/* Rent roll expanded body: allow horizontal scroll while keeping expand animation */
.rr-property-body.rr-expanded {
  overflow-y: hidden;
  overflow-x: auto;
}

/* Rent roll units table: ensure minimum width for readability */
.rr-units-table {
  min-width: 700px;
}

/* Close ledger table needs min-width to trigger scroll */
.close-ledger-table {
  min-width: 900px;
}

/* AM table min-width */
.am-table {
  min-width: 800px;
}

/* --- Filter bars: always wrap gracefully --- */
.filter-row,
.am-filters,
.close-ledger-filters .filter-row,
.rr-controls,
.intel-controls,
.construction-header {
  flex-wrap: wrap;
}

/* --- KPI / stat grids: prevent overflow --- */
.kpi-grid,
.am-kpi-grid,
.sales-kpis,
.close-ledger-summary,
.rr-revenue-summary,
.rr-kpis,
.construction-stats {
  max-width: 100%;
  overflow: hidden;
}

/* ---- 1440px breakpoint ---- */
@media (max-width: 1440px) {
  /* Intel panels: 3 cols → 2 cols */
  .intel-panels {
    grid-template-columns: 1fr 1fr;
  }

  /* KPI 6-grid: 6 cols → 4 cols */
  .kpi-grid-6 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  /* Close ledger summary cards wrap tighter */
  .close-ledger-summary {
    grid-template-columns: repeat(3, 1fr);
  }

  /* AM filters: reduce min-width on text inputs */
  .am-filters input[type="text"] {
    min-width: 180px;
  }

  /* Filter group inputs: reduce min-width */
  .filter-group input[type="text"] {
    min-width: 160px;
  }

  /* Rent roll revenue summary: wrap */
  .rr-revenue-summary {
    flex-wrap: wrap;
  }

  /* Rent roll analytics row: stack if flex */
  .rr-analytics-row {
    flex-wrap: wrap;
  }
}

/* ---- 1280px breakpoint ---- */
@media (max-width: 1280px) {
  /* Intel panels: stack to single column */
  .intel-panels {
    grid-template-columns: 1fr;
  }

  /* KPI 6-grid → 3 cols */
  .kpi-grid-6 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  /* Close ledger summary: 2 cols */
  .close-ledger-summary {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Sales forecast grid: 2 cols */
  .sales-forecast-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Sales team grid: single col */
  .sales-team-grid {
    grid-template-columns: 1fr;
  }

  /* Costs agent grid: single col */
  .costs-agent-grid {
    grid-template-columns: 1fr;
  }

  /* Costs KPI layout: stack */
  .costs-kpi-layout {
    grid-template-columns: 1fr;
  }

  /* Construction stats: wrap */
  .construction-stats {
    flex-wrap: wrap;
    gap: 16px;
  }

  /* AM filters: further reduce */
  .am-filters input[type="text"] {
    min-width: 140px;
  }

  /* Filter group: reduce min-widths */
  .filter-group input,
  .filter-group select {
    min-width: 100px;
  }
  .filter-group input[type="text"] {
    min-width: 140px;
  }

  /* Construction header stack */
  .construction-header {
    flex-direction: column;
    gap: 16px;
  }

  /* Rent roll header stack */
  .rr-header {
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
  }

  /* Projection stats: 3 cols */
  .projection-stats {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Command center grid: single col */
  .command-center-grid {
    grid-template-columns: 1fr;
  }

  /* Performers grid: 2 cols */
  .performers-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Projects grid: single col */
  .projects-grid {
    grid-template-columns: 1fr;
  }

  /* Setter performance: single col */
  .setter-performance-groups {
    grid-template-columns: 1fr;
  }

  /* Closer performance: single col */
  .closer-performance-grid {
    grid-template-columns: 1fr;
  }
}

/* ---- 1024px breakpoint additions ---- */
@media (max-width: 1024px) {
  /* KPI grids → 2 cols */
  .kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kpi-grid-6 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* AM KPI grid: 3 cols */
  .am-kpi-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  /* Close ledger summary: 2 cols */
  .close-ledger-summary {
    grid-template-columns: repeat(2, 1fr);
  }

  /* All filter inputs full-width */
  .am-filters input[type="text"] {
    min-width: 120px;
    flex: 1;
  }
  .am-filters select {
    flex: 1;
  }

  /* Sales funnel: wrap tighter */
  .sales-funnel {
    flex-wrap: wrap;
    justify-content: center;
  }

  /* Rent roll KPIs: 3 cols */
  .rr-kpis {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Rent roll donut wrap: stack */
  .rr-donut-wrap {
    flex-direction: column;
    align-items: center;
  }

  /* Rent roll analytics row: stack */
  .rr-analytics-row {
    flex-direction: column;
    gap: 20px;
  }

  /* Intel header: stack */
  .intel-header {
    flex-direction: column;
    align-items: flex-start;
  }

  /* Content cards: 2 cols */
  .content-cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Sales detail metrics: 2 cols */
  .sales-detail-metrics {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Closer metrics: 2 cols */
  .closer-metrics {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Fin summary grid: wrap */
  .fin-summary-grid {
    flex-wrap: wrap;
  }
}

/* =====================================================
   === Media Pipeline ===
   ===================================================== */

.media-pipeline-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* --- Stats Bar --- */
.mp-stats-bar {
  display: flex;
  gap: 2px;
  background: #1a1f2e;
  border-radius: 10px;
  overflow: hidden;
}
.mp-stat {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 14px 8px;
  border-right: 1px solid rgba(255,255,255,0.06);
}
.mp-stat:last-child { border-right: none; }
.mp-stat-val {
  font-size: 1.5rem;
  font-weight: 700;
  color: #e2e8f0;
}
.mp-stat-label {
  font-size: 0.7rem;
  color: #8b95a5;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 2px;
}

/* --- View Tabs --- */
.mp-view-tabs {
  display: flex;
  gap: 4px;
  padding: 0 4px;
}
.mp-view-tab {
  padding: 8px 18px;
  border: 1px solid #2d3548;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  background: #0f1419;
  color: #8b95a5;
  cursor: pointer;
  font-size: 0.85rem;
  font-weight: 500;
  transition: all 0.15s;
}
.mp-view-tab.active {
  background: #1a1f2e;
  color: #e2e8f0;
  border-color: #10b981;
  border-bottom-color: #1a1f2e;
}
.mp-view-tab:hover:not(.active) { color: #e2e8f0; background: #151a27; }
.mp-tab-count {
  background: #2d3548;
  color: #8b95a5;
  font-size: 0.7rem;
  padding: 1px 6px;
  border-radius: 10px;
  margin-left: 4px;
}
.mp-view-tab.active .mp-tab-count { background: #10b981; color: #fff; }

/* --- Review Toolbar --- */
.mp-review-toolbar {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  padding: 8px 0;
}
.mp-review-toolbar select {
  background: #1a1f2e;
  color: #e2e8f0;
  border: 1px solid #2d3548;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 0.85rem;
  cursor: pointer;
}
.mp-review-toolbar select:focus { outline: none; border-color: #10b981; }
.mp-refresh-btn {
  background: #1a1f2e;
  color: #8b95a5;
  border: 1px solid #2d3548;
  border-radius: 6px;
  width: 34px;
  height: 34px;
  font-size: 1.1rem;
  cursor: pointer;
  transition: all 0.2s;
}
.mp-refresh-btn:hover { color: #10b981; border-color: #10b981; }

/* --- Layout: Sidebar + Main --- */
.mp-layout {
  display: flex;
  gap: 16px;
}

/* --- Sidebar --- */
.mp-sidebar {
  width: 240px;
  min-width: 240px;
  background: #1a1f2e;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 300px);
  position: sticky;
  top: 0;
}
.mp-sidebar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #2d3548;
}
.mp-sidebar-header h3 {
  margin: 0;
  font-size: 0.9rem;
  color: #e2e8f0;
  font-weight: 600;
}
.mp-sidebar-header select {
  background: #0f1419;
  color: #8b95a5;
  border: 1px solid #2d3548;
  border-radius: 4px;
  padding: 3px 6px;
  font-size: 0.75rem;
  cursor: pointer;
}
.mp-projects-list {
  flex: 1;
  overflow-y: auto;
  padding: 6px;
}
.mp-project-item {
  display: flex;
  flex-direction: column;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s;
  margin-bottom: 2px;
  gap: 4px;
}
.mp-project-item:hover { background: rgba(16, 185, 129, 0.08); }
.mp-project-item.active {
  background: rgba(16, 185, 129, 0.15);
  border-left: 3px solid #10b981;
}
.mp-project-item-name {
  font-size: 0.88rem;
  color: #e2e8f0;
  font-weight: 500;
  line-height: 1.3;
}
.mp-project-item-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.mp-project-item-count {
  font-size: 0.72rem;
  color: #8b95a5;
}
.mp-badge-unreviewed, .mp-badge-pending {
  background: #d29922;
  color: #000;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 10px;
  min-width: 18px;
  text-align: center;
}

/* --- Main Area --- */
.mp-main {
  flex: 1;
  min-width: 0;
}

/* --- Project Header --- */
.mp-project-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #1a1f2e;
  border-radius: 10px;
  padding: 14px 18px;
  margin-bottom: 12px;
}
.mp-project-info h2 {
  margin: 0;
  font-size: 1.15rem;
  color: #e2e8f0;
  font-weight: 600;
}
.mp-project-meta {
  font-size: 0.8rem;
  color: #8b95a5;
  margin-top: 4px;
}
.mp-sep { margin: 0 6px; opacity: 0.4; }

/* --- Media Grid (responsive flow) --- */
.mp-media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  padding: 4px 0;
}

/* --- Media Card --- */
.mp-card {
  background: #1a1f2e;
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.15s, box-shadow 0.15s;
  border: 1px solid transparent;
  display: flex;
  flex-direction: column;
}
.mp-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
  border-color: #2d3548;
}
.mp-card.mp-flash-approve {
  animation: mpFlashGreen 0.6s ease;
}
@keyframes mpFlashGreen {
  0% { box-shadow: 0 0 0 0 rgba(16,185,129,0.5); }
  50% { box-shadow: 0 0 20px 4px rgba(16,185,129,0.3); }
  100% { box-shadow: none; }
}

/* Thumbnail wrapper */
.mp-card-thumb-wrap {
  position: relative;
  height: 180px;
  overflow: hidden;
  background: #0f1419;
  cursor: pointer;
}
.mp-card-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.mp-card-file {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 1.5rem;
  color: #8b95a5;
  text-align: center;
}
/* Video play overlay */
.mp-video-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 48px;
  height: 48px;
  background: rgba(0,0,0,0.6);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.mp-video-overlay::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 0 10px 18px;
  border-color: transparent transparent transparent #fff;
  margin-left: 3px;
}

/* Hover overlay with action buttons */
.mp-card-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  gap: 6px;
  padding: 8px 10px;
  background: linear-gradient(transparent, rgba(0,0,0,0.85));
  opacity: 0;
  transition: opacity 0.2s;
  justify-content: center;
}
.mp-card:hover .mp-card-overlay { opacity: 1; }
.mp-overlay-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.3);
  background: rgba(0,0,0,0.5);
  backdrop-filter: blur(4px);
  cursor: pointer;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
}
.mp-overlay-btn:hover { transform: scale(1.15); border-color: rgba(255,255,255,0.6); }
.mp-obtn-approve:hover, .mp-obtn-approve.active { background: rgba(16,185,129,0.7); border-color: #10b981; }
.mp-obtn-reject:hover, .mp-obtn-reject.active { background: rgba(239,68,68,0.7); border-color: #ef4444; }

/* Inline reject confirm */
.mp-reject-confirm {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(248,81,73,0.95);
  color: #fff;
  padding: 8px 12px;
  font-size: 0.78rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  backdrop-filter: blur(4px);
}
.mp-reject-confirm button {
  background: rgba(255,255,255,0.2);
  border: 1px solid rgba(255,255,255,0.3);
  color: #fff;
  border-radius: 4px;
  padding: 3px 10px;
  cursor: pointer;
  font-size: 0.75rem;
}
.mp-reject-confirm button:hover { background: rgba(255,255,255,0.35); }
.mp-reject-confirm .mp-reject-yes { background: rgba(0,0,0,0.3); }

/* Status badge */
.mp-card-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 0.7rem;
  font-weight: 600;
  backdrop-filter: blur(4px);
}
.mp-badge-pending   { background: rgba(234, 179, 8, 0.85); color: #000; }
.mp-badge-approved  { background: rgba(16, 185, 129, 0.85); color: #fff; }
.mp-badge-rejected  { background: rgba(239, 68, 68, 0.85); color: #fff; }
.mp-badge-queued    { background: rgba(249, 115, 22, 0.85); color: #fff; }
.mp-badge-posted    { background: rgba(139, 92, 246, 0.85); color: #fff; }

/* Checkbox */
.mp-card-check {
  position: absolute;
  top: 8px;
  left: 8px;
  cursor: pointer;
}
.mp-card-check input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #10b981;
  cursor: pointer;
}

/* Compact info bar */
.mp-card-compact {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  font-size: 0.78rem;
  border-bottom: 1px solid #1e2536;
  flex-wrap: wrap;
}
.mp-card-compact .mp-card-sender { color: #10b981; font-weight: 500; }
.mp-card-compact .mp-card-date { color: #8b95a5; }
.mp-card-compact .mp-source-tag { margin-left: auto; }

/* Collapsible details */
.mp-card-details { border-top: none; }
.mp-card-expand {
  padding: 6px 12px;
  font-size: 0.75rem;
  color: #8b95a5;
  cursor: pointer;
  user-select: none;
  list-style: none;
  text-align: center;
  transition: color 0.15s;
}
.mp-card-expand:hover { color: #10b981; }
.mp-card-expand::marker, .mp-card-expand::-webkit-details-marker { display: none; }
.mp-card-details[open] .mp-card-expand { color: #10b981; border-bottom: 1px solid #1e2536; }
.mp-card-body {
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mp-card-context {
  font-size: 0.78rem;
  color: #8b95a5;
  font-style: italic;
  line-height: 1.4;
  max-height: 3.2em;
  overflow: hidden;
}
.mp-source-tag {
  display: inline-block;
  background: rgba(234, 179, 8, 0.15);
  color: #eab308;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 20px;
  border: 1px solid rgba(234, 179, 8, 0.3);
  width: fit-content;
}

/* Caption area */
.mp-card-caption {
  display: flex;
  gap: 6px;
  align-items: flex-start;
}
.mp-caption-input {
  flex: 1;
  background: #0f1419;
  border: 1px solid #2d3548;
  border-radius: 6px;
  color: #e2e8f0;
  padding: 6px 8px;
  font-size: 0.8rem;
  resize: vertical;
  min-height: 36px;
  font-family: inherit;
}
.mp-caption-input:focus { border-color: #10b981; outline: none; }
.mp-suggest-btn {
  background: #0f1419;
  border: 1px solid #2d3548;
  border-radius: 6px;
  font-size: 1rem;
  cursor: pointer;
  padding: 4px 8px;
  transition: border-color 0.2s;
}
.mp-suggest-btn:hover { border-color: #10b981; }

/* AI Suggestion Flags */
.mp-ai-flag {
  padding: 4px 10px;
  font-size: 0.72rem;
  font-weight: 500;
  text-align: center;
}
.mp-ai-reject {
  background: rgba(239,68,68,0.15);
  color: #f87171;
  border-bottom: 1px solid rgba(239,68,68,0.2);
}
.mp-ai-review {
  background: rgba(251,191,36,0.12);
  color: #fbbf24;
  border-bottom: 1px solid rgba(251,191,36,0.2);
}
.mp-card-flagged { border-color: rgba(239,68,68,0.3) !important; }

/* Category badges */
.mp-cat-badge { font-size: 0.85rem; flex-shrink: 0; cursor: default; }
.mp-cat-receipt { opacity: 0.7; }
.mp-cat-document { opacity: 0.7; }
.mp-cat-other { opacity: 0.5; }

/* --- Empty / Loading states --- */
.mp-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  color: #8b95a5;
  grid-column: 1 / -1;
}
.mp-empty-icon { font-size: 3rem; margin-bottom: 12px; }
.mp-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 40px;
  color: #8b95a5;
  grid-column: 1 / -1;
}
.mp-error {
  padding: 20px;
  color: #ef4444;
  text-align: center;
  grid-column: 1 / -1;
}

/* --- Lightbox --- */
.mp-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9500;
  cursor: pointer;
}
.mp-lightbox img {
  max-width: 90vw;
  max-height: 90vh;
  object-fit: contain;
  border-radius: 8px;
  cursor: default;
}
.mp-lightbox-close {
  position: absolute;
  top: 20px;
  right: 24px;
  background: rgba(255,255,255,0.15);
  border: none;
  color: #fff;
  font-size: 1.5rem;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.2s;
}
.mp-lightbox-close:hover { background: rgba(255,255,255,0.3); }

/* ===== SCHEDULE VIEW ===== */
.mp-schedule-content {
  padding: 8px 0;
}
.mp-schedule-project {
  background: #161b22;
  border: 1px solid #1e2536;
  border-radius: 10px;
  margin-bottom: 16px;
  overflow: hidden;
}
.mp-schedule-project-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 18px;
  cursor: pointer;
  transition: background 0.15s;
}
.mp-schedule-project-header:hover { background: rgba(16,185,129,0.05); }
.mp-schedule-project-header h3 {
  margin: 0;
  font-size: 1rem;
  color: #e2e8f0;
  font-weight: 600;
}
.mp-schedule-project-header h3 .mp-sched-count {
  font-size: 0.8rem;
  color: #8b95a5;
  font-weight: 400;
  margin-left: 8px;
}
.mp-schedule-project-header .mp-sched-toggle {
  color: #8b95a5;
  font-size: 1rem;
  transition: transform 0.2s;
}
.mp-schedule-project.expanded .mp-sched-toggle {
  transform: rotate(180deg);
}
.mp-schedule-project-body {
  display: none;
  border-top: 1px solid #1e2536;
}
.mp-schedule-project.expanded .mp-schedule-project-body {
  display: block;
}
.mp-sched-confirm-bar {
  display: flex;
  justify-content: flex-end;
  padding: 10px 18px;
  border-bottom: 1px solid #1e2536;
}
.mp-sched-confirm-btn {
  background: #10b981;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 7px 18px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.15s;
}
.mp-sched-confirm-btn:hover { opacity: 0.85; }
.mp-sched-confirm-btn:disabled { opacity: 0.5; cursor: default; }

/* Timeline items */
.mp-timeline {
  padding: 0 18px 14px;
}
.mp-timeline-item {
  display: flex;
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid #1e2536;
  align-items: flex-start;
}
.mp-timeline-item:last-child { border-bottom: none; }
.mp-timeline-item.mp-next-in-queue {
  background: rgba(16,185,129,0.06);
  margin: 0 -18px;
  padding: 12px 18px;
  border-radius: 6px;
}
.mp-timeline-date {
  min-width: 80px;
  flex-shrink: 0;
}
.mp-timeline-date .mp-date-main {
  font-size: 0.82rem;
  color: #e2e8f0;
  font-weight: 600;
}
.mp-timeline-date .mp-date-sub {
  font-size: 0.7rem;
  color: #8b95a5;
  margin-top: 2px;
}
.mp-timeline-media {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.mp-timeline-thumb {
  width: 56px;
  height: 42px;
  border-radius: 4px;
  overflow: hidden;
  background: #0f1419;
  position: relative;
}
.mp-timeline-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mp-timeline-thumb .mp-video-overlay {
  width: 24px;
  height: 24px;
}
.mp-timeline-thumb .mp-video-overlay::after {
  border-width: 5px 0 5px 9px;
  margin-left: 2px;
}
.mp-timeline-caption {
  flex: 1;
  min-width: 0;
}
.mp-timeline-caption-text {
  font-size: 0.82rem;
  color: #c9d1d9;
  line-height: 1.45;
  cursor: pointer;
}
.mp-timeline-caption-text:hover { color: #e2e8f0; }
.mp-timeline-caption-edit {
  width: 100%;
  background: #0f1419;
  border: 1px solid #10b981;
  border-radius: 6px;
  color: #e2e8f0;
  padding: 6px 8px;
  font-size: 0.82rem;
  font-family: inherit;
  resize: vertical;
  min-height: 48px;
}
.mp-timeline-meta {
  font-size: 0.72rem;
  color: #8b95a5;
  margin-top: 4px;
}
.mp-next-badge {
  display: inline-block;
  background: #10b981;
  color: #fff;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 1px 8px;
  border-radius: 10px;
  margin-left: 6px;
}

/* ===== STATUS VIEW ===== */
.mp-status-content {
  padding: 8px 0;
}
.mp-status-overview {
  background: #161b22;
  border: 1px solid #1e2536;
  border-radius: 10px;
  padding: 20px 24px;
  margin-bottom: 20px;
}
.mp-status-overview h3 {
  margin: 0 0 14px;
  font-size: 1rem;
  color: #e2e8f0;
}
.mp-status-overview-stats {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.mp-status-overview-stat {
  text-align: center;
}
.mp-status-overview-stat .mp-so-val {
  font-size: 1.8rem;
  font-weight: 700;
  color: #10b981;
}
.mp-status-overview-stat .mp-so-label {
  font-size: 0.75rem;
  color: #8b95a5;
  margin-top: 2px;
}
.mp-status-progress-bar {
  height: 8px;
  background: #1e2536;
  border-radius: 4px;
  margin-top: 16px;
  overflow: hidden;
}
.mp-status-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #10b981, #34d399);
  border-radius: 4px;
  transition: width 0.5s ease;
}

/* Channel cards */
.mp-channel-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}
.mp-channel-card {
  background: #161b22;
  border: 1px solid #1e2536;
  border-radius: 10px;
  padding: 16px;
}
.mp-channel-card h4 {
  margin: 0 0 10px;
  font-size: 0.95rem;
  color: #e2e8f0;
  font-weight: 600;
}
.mp-channel-stats {
  display: flex;
  gap: 12px;
  font-size: 0.8rem;
  color: #8b95a5;
  margin-bottom: 10px;
}
.mp-channel-stats span { white-space: nowrap; }
.mp-channel-progress {
  height: 6px;
  background: #1e2536;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 8px;
}
.mp-channel-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #10b981, #34d399);
  border-radius: 3px;
  transition: width 0.5s ease;
}
.mp-channel-footer {
  display: flex;
  justify-content: space-between;
  font-size: 0.75rem;
  color: #8b95a5;
}

/* Recent posts section */
.mp-recent-posts {
  background: #161b22;
  border: 1px solid #1e2536;
  border-radius: 10px;
  padding: 18px;
}
.mp-recent-posts h3 {
  margin: 0 0 14px;
  font-size: 1rem;
  color: #e2e8f0;
}
.mp-recent-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mp-recent-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  background: #0d1117;
  border-radius: 8px;
}
.mp-recent-item-thumb {
  width: 48px;
  height: 36px;
  border-radius: 4px;
  overflow: hidden;
  background: #1a1f2e;
  flex-shrink: 0;
}
.mp-recent-item-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mp-recent-item-info {
  flex: 1;
  min-width: 0;
}
.mp-recent-item-caption {
  font-size: 0.8rem;
  color: #c9d1d9;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mp-recent-item-meta {
  font-size: 0.72rem;
  color: #8b95a5;
  margin-top: 2px;
}

/* --- Responsive --- */
@media (max-width: 1200px) {
  .mp-media-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
  .mp-channel-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
}
@media (max-width: 768px) {
  .mp-layout { flex-direction: column; }
  .mp-sidebar { width: 100%; min-width: unset; max-height: 200px; }
  .mp-media-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
  .mp-stats-bar { flex-wrap: wrap; }
  .mp-stat { min-width: 80px; }
  .mp-channel-grid { grid-template-columns: 1fr; }
}

/* Compact project grid */
.projects-grid.compact-view {
  grid-template-columns: 1fr !important;
  gap: 2px !important;
}
.projects-grid.compact-view .project-card {
  min-height: unset !important;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 6px 12px;
  gap: 10px;
  border-radius: 6px;
  box-shadow: none;
}
.projects-grid.compact-view .project-card:hover {
  transform: none;
  background: var(--bg-3, #1e2536);
}
.projects-grid.compact-view .project-card .project-header {
  padding: 0;
  flex: 1;
  min-width: 0;
  gap: 0;
}
.projects-grid.compact-view .project-card .project-title {
  font-size: 13px;
  margin-bottom: 0;
}
.projects-grid.compact-view .project-card .project-subtitle {
  font-size: 11px;
  margin-top: 1px;
}
.projects-grid.compact-view .project-card .project-media {
  width: 36px;
  height: 36px;
  min-height: unset;
  margin: 0;
  border-radius: 6px;
  flex-shrink: 0;
  order: -1;
}
.projects-grid.compact-view .project-card .project-media img {
  height: 36px !important;
  min-height: unset !important;
}
.projects-grid.compact-view .project-card .project-media div {
  font-size: 10px !important;
}
.projects-grid.compact-view .project-card .project-media div div:first-child {
  font-size: 16px !important;
  margin-bottom: 0 !important;
}
/* Hide extra detail lines in compact */
.projects-grid.compact-view .project-card [style*="font-size:11px"][style*="margin-top:4px"] {
  display: none;
}
.projects-grid.compact-view .project-card .project-title {
  font-size: 14px;
}
.projects-grid.compact-view .project-card .project-subtitle {
  font-size: 11px;
}

/* Gallery view media default height */
.projects-grid:not(.compact-view) .project-media {
  min-height: 140px;
}
/* Compact: force entire card small */
.projects-grid.compact-view .project-card * {
  box-sizing: border-box;
}
.projects-grid.compact-view .project-media,
.projects-grid.compact-view .project-media > * {
  max-height: 36px !important;
  min-height: 36px !important;
}

/* ==================== PROPERTY MAPS TABLE ==================== */
.maps-table-container {
  margin-top: 24px;
  background: var(--bg-secondary);
  border-radius: 12px;
  border: 1px solid var(--border);
}

.maps-table-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}

.maps-table-header h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-primary);
}

.maps-table-controls {
  display: flex;
  gap: 12px;
  align-items: center;
}

.maps-search-input {
  padding: 6px 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font-size: 0.85rem;
  width: 200px;
}

.maps-search-input:focus {
  outline: none;
  border-color: var(--accent);
}

.maps-filter-select {
  padding: 6px 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font-size: 0.85rem;
  min-width: 150px;
}

.maps-filter-select:focus {
  outline: none;
  border-color: var(--accent);
}

.maps-table-wrap {
  overflow-x: auto;
}

.maps-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}

.maps-table th {
  background: var(--bg-tertiary);
  color: var(--text-secondary);
  font-weight: 600;
  padding: 12px 16px;
  text-align: left;
  border-bottom: 1px solid var(--border);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.maps-table td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-subtle);
  vertical-align: top;
}

.maps-table tbody tr:hover {
  background: var(--bg-hover);
}

.maps-table-loading {
  padding: 40px 20px !important;
  text-align: center;
  color: var(--text-tertiary);
}

.maps-table-loading .loading-spinner {
  margin: 0 auto 12px;
}

/* Property Status Badges */
.property-status-badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.property-status-badge.closed {
  background: rgba(34, 197, 94, 0.1);
  color: rgb(34, 197, 94);
  border: 1px solid rgba(34, 197, 94, 0.2);
}

.property-status-badge.under-contract {
  background: rgba(139, 92, 246, 0.1);
  color: rgb(139, 92, 246);
  border: 1px solid rgba(139, 92, 246, 0.2);
}

.property-status-badge.offer-out {
  background: rgba(245, 158, 11, 0.1);
  color: rgb(245, 158, 11);
  border: 1px solid rgba(245, 158, 11, 0.2);
}

.property-status-badge.looking {
  background: rgba(59, 130, 246, 0.1);
  color: rgb(59, 130, 246);
  border: 1px solid rgba(59, 130, 246, 0.2);
}

.property-status-badge.active {
  background: rgba(16, 185, 129, 0.1);
  color: rgb(16, 185, 129);
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.property-status-badge.no-reply {
  background: rgba(239, 68, 68, 0.1);
  color: rgb(239, 68, 68);
  border: 1px solid rgba(239, 68, 68, 0.2);
}

.property-status-badge.refund-risk {
  background: rgba(220, 38, 127, 0.1);
  color: rgb(220, 38, 127);
  border: 1px solid rgba(220, 38, 127, 0.2);
}

/* Property Links */
.property-links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.property-link {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  background: var(--bg-tertiary);
  color: var(--accent);
  text-decoration: none;
  border-radius: 4px;
  font-size: 0.75rem;
  transition: all 0.2s ease;
}

.property-link:hover {
  background: var(--accent);
  color: white;
}

.property-link-icon {
  margin-right: 4px;
  font-size: 0.7rem;
}

/* Property Address */
.property-address {
  font-weight: 500;
  color: var(--text-primary);
  line-height: 1.3;
}

.property-address-full {
  display: block;
  font-size: 0.75rem;
  color: var(--text-secondary);
  margin-top: 2px;
}

/* Property Client */
.property-client {
  font-weight: 500;
  color: var(--text-primary);
}

.property-client-type {
  display: block;
  font-size: 0.75rem;
  color: var(--text-tertiary);
  margin-top: 2px;
}

/* Property Price */
.property-price {
  font-weight: 600;
  color: var(--accent);
  font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', monospace;
}

.property-price-estimate {
  display: block;
  font-size: 0.75rem;
  color: var(--text-tertiary);
  margin-top: 2px;
  font-weight: normal;
}

/* ==================== PROFESSIONAL PROPERTY MAPS STYLING - DARK THEME ==================== */

/* WhatsApp Intel Integration Animations */
@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}

.whatsapp-live-badge {
  background: #10b981 !important;
  color: white;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.7rem;
  font-weight: 500;
}

.property-maps-container {
  padding: 0;
  background: var(--bg-0);
  min-height: calc(100vh - 80px);
}

.maps-header-professional {
  background: var(--bg-2);
  border: 1px solid var(--border);
  color: var(--text-primary);
  padding: 16px 20px;
  border-radius: 8px;
  margin-bottom: 16px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.maps-title-professional h1 {
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0 0 8px 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.maps-title-professional p {
  font-size: 1.1rem;
  opacity: 0.9;
  margin: 0;
}

.maps-stats-professional {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  margin-top: 24px;
}

.stat-card-professional {
  background: var(--bg-3);
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  border: 1px solid var(--border);
}

.stat-value-professional {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 4px;
}

.stat-label-professional {
  font-size: 0.9rem;
  opacity: 0.8;
}

.maps-content-professional {
  display: grid;
  grid-template-columns: 1fr 450px;
  gap: 24px;
  height: calc(100vh - 300px);
  min-height: 600px;
}

.map-section-professional {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
}

.map-controls-professional {
  background: var(--bg-3);
  padding: 16px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.map-filters-professional {
  display: flex;
  gap: 12px;
  align-items: center;
}

.map-toggles-professional {
  display: flex;
  gap: 16px;
}

.toggle-btn-professional {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-1);
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 500;
  color: var(--text-primary);
}

.toggle-btn-professional.active {
  border-color: var(--accent);
  background: var(--accent);
  color: white;
}

.toggle-btn-professional:hover {
  border-color: var(--accent);
  background: var(--bg-hover);
}

.map-indicator-professional {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  margin-right: 4px;
}

.rich-indicator-professional { background: #10b981; }
.mpm-indicator-professional { background: #3b82f6; }

.table-section-professional {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
}

.table-header-professional {
  background: var(--bg-3);
  padding: 20px;
  border-bottom: 1px solid var(--border);
  border-radius: 16px 16px 0 0;
}

.table-header-professional h3 {
  margin: 0 0 16px 0;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--text-primary);
}

.search-filters-professional {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.search-input-professional {
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
  transition: border-color 0.2s ease;
  background: var(--bg-1);
  color: var(--text-primary);
}

.search-input-professional:focus {
  outline: none;
  border-color: var(--accent);
}

.filter-select-professional {
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
  background: var(--bg-1);
  transition: border-color 0.2s ease;
  color: var(--text-primary);
}

.filter-select-professional:focus {
  outline: none;
  border-color: var(--accent);
}

.table-content-professional {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.property-table-professional {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
  table-layout: fixed;
}

.property-table-professional th {
  background: var(--bg-3);
  color: var(--text-secondary);
  font-weight: 600;
  padding: 8px 12px;
  text-align: left;
  border-bottom: 1px solid var(--border);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  word-wrap: break-word;
}

.property-table-professional th:nth-child(1) { width: 15%; } /* Status */
.property-table-professional th:nth-child(2) { width: 40%; } /* Address */
.property-table-professional th:nth-child(3) { width: 25%; } /* Owner */
.property-table-professional th:nth-child(4) { width: 20%; } /* Links */

.property-table-professional td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border-subtle);
  vertical-align: top;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.property-table-professional tbody tr:hover {
  background: var(--bg-hover);
}

.status-badge-professional {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.status-closed-professional { background: #dcfce7; color: #166534; }
.status-contract-professional { background: #ede9fe; color: #5b21b6; }
.status-active-professional { background: #dbeafe; color: #1e40af; }
.status-looking-professional { background: #fef3c7; color: #92400e; }
.status-offer-professional { background: #fed7d7; color: #c53030; }

.property-address-professional {
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.3;
  font-size: 0.8rem;
  word-break: break-word;
}

.property-coords-professional {
  font-size: 0.65rem;
  color: var(--text-tertiary);
  margin-top: 2px;
}

.property-owner-professional {
  font-weight: 500;
  color: var(--text-primary);
  font-size: 0.8rem;
  word-break: break-word;
}

.property-type-professional {
  font-size: 0.65rem;
  color: var(--text-secondary);
  margin-top: 2px;
}

.property-links-professional {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.property-link-professional {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 4px 8px;
  background: var(--accent);
  color: white;
  text-decoration: none;
  border-radius: 4px;
  font-size: 0.65rem;
  font-weight: 500;
  transition: background-color 0.2s ease;
  white-space: nowrap;
}

.property-link-professional:hover {
  background: var(--accent-hover);
  color: white;
}

.property-link-professional.maps {
  background: #10b981;
}

.property-link-professional.maps:hover {
  background: #059669;
}

.table-body-professional {
  overflow-y: auto;
  max-height: 400px;
}

.loading-professional {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px !important;
  color: var(--text-secondary);
  text-align: center;
}

.spinner-professional {
  width: 20px;
  height: 20px;
  border: 2px solid var(--border);
  border-top: 2px solid var(--accent);
  border-radius: 50%;
  animation: spin-professional 1s linear infinite;
  margin-right: 12px;
}

@keyframes spin-professional {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@media (max-width: 1400px) {
  .maps-content-professional {
    grid-template-columns: 1fr;
    height: auto;
  }
  
  .table-section-professional {
    margin-top: 24px;
  }
  
  .property-table-professional th:nth-child(1) { width: 12%; }
  .property-table-professional th:nth-child(2) { width: 45%; }
  .property-table-professional th:nth-child(3) { width: 23%; }
  .property-table-professional th:nth-child(4) { width: 20%; }
}

@media (max-width: 768px) {
  .property-table-professional th:nth-child(1) { width: 10%; }
  .property-table-professional th:nth-child(2) { width: 50%; }
  .property-table-professional th:nth-child(3) { width: 20%; }
  .property-table-professional th:nth-child(4) { width: 20%; }
  
  .property-address-professional {
    font-size: 0.75rem;
  }
  
  .property-link-professional {
    font-size: 0.6rem;
    padding: 3px 6px;
  }
}

/* ==================== DUPLICATE MANAGEMENT ==================== */

.duplicates-container {
  padding: 20px;
}

.duplicates-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e5e7eb;
}

.duplicates-header h2 {
  margin: 0;
  color: #1f2937;
  font-size: 24px;
  font-weight: 600;
}

.duplicates-header p {
  margin: 8px 0 0 0;
  color: #6b7280;
  font-size: 14px;
}

.duplicates-actions {
  display: flex;
  gap: 12px;
}

.duplicates-summary {
  display: flex;
  gap: 24px;
  margin-bottom: 24px;
}

.summary-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 16px;
  text-align: center;
  min-width: 140px;
}

.summary-value {
  font-size: 28px;
  font-weight: 700;
  color: #1e40af;
  margin-bottom: 4px;
}

.summary-label {
  font-size: 12px;
  color: #64748b;
  text-transform: uppercase;
  font-weight: 500;
}

.duplicates-empty {
  text-align: center;
  padding: 60px 20px;
  background: #f8fafc;
  border-radius: 12px;
  border: 2px dashed #cbd5e1;
}

.duplicates-empty .empty-icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.duplicates-empty h3 {
  margin: 0 0 8px 0;
  color: #374151;
  font-size: 20px;
}

.duplicates-empty p {
  margin: 0;
  color: #6b7280;
  font-size: 14px;
}

.duplicates-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.duplicate-group {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.duplicate-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #f3f4f6;
}

.duplicate-info h3 {
  margin: 0 0 4px 0;
  color: #111827;
  font-size: 18px;
  font-weight: 600;
}

.duplicate-email {
  color: #6b7280;
  font-size: 14px;
  margin-bottom: 8px;
}

.duplicate-stats {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.duplicate-stats .stat {
  background: #f3f4f6;
  color: #374151;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
}

.attribution-badge {
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}

.attribution-badge.good {
  background: #dcfce7;
  color: #166534;
}

.attribution-badge.warn {
  background: #fef3c7;
  color: #92400e;
}

.duplicate-entries {
  margin-top: 12px;
}

.duplicate-entries h4 {
  margin: 12px 0 8px 0;
  color: #374151;
  font-size: 14px;
  font-weight: 600;
}

.entry-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.entry-card.primary {
  background: #dcfce7;
  border-color: #bbf7d0;
}

.entry-card.duplicate {
  background: #fef2f2;
  border-color: #fecaca;
}

.entry-info {
  font-size: 14px;
  color: #374151;
}

.entry-channel {
  font-size: 12px;
  color: #6b7280;
  text-transform: uppercase;
  font-weight: 500;
}

/* Modal Styles */
.modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-content {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25);
  max-width: 600px;
  width: 90%;
  max-height: 80vh;
  overflow: auto;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  border-bottom: 1px solid #e5e7eb;
}

.modal-header h3 {
  margin: 0;
  color: #111827;
  font-size: 18px;
  font-weight: 600;
}

.modal-close {
  font-size: 24px;
  color: #9ca3af;
  cursor: pointer;
  line-height: 1;
}

.modal-close:hover {
  color: #374151;
}

.modal-body {
  padding: 24px;
}

.modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 24px;
  border-top: 1px solid #e5e7eb;
  background: #f8fafc;
}

.merge-plan {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.merge-summary {
  background: #f0f9ff;
  border: 1px solid #bae6fd;
  border-radius: 8px;
  padding: 16px;
}

.merge-summary h4 {
  margin: 0 0 8px 0;
  color: #0c4a6e;
  font-size: 16px;
}

.merge-summary p {
  margin: 0 0 12px 0;
  color: #0369a1;
  font-size: 14px;
}

.merge-stats {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.stat-item {
  font-size: 14px;
  color: #374151;
}

.merge-details {
  background: #fafafa;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 16px;
}

.merge-details h5 {
  margin: 0 0 12px 0;
  color: #374151;
  font-size: 14px;
  font-weight: 600;
}

.merge-entry {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding: 12px;
  margin-bottom: 8px;
  font-size: 14px;
}

.merge-entry.primary {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.merge-entry.discard {
  background: #fef2f2;
  border-color: #fecaca;
}

.merge-warning {
  background: #fffbeb;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  padding: 16px;
  color: #92400e;
  font-size: 14px;
}

.merge-success {
  text-align: center;
  padding: 20px;
}

.success-icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.merge-success h4 {
  margin: 0 0 8px 0;
  color: #065f46;
  font-size: 18px;
}

.merge-success p {
  margin: 0 0 16px 0;
  color: #047857;
  font-size: 14px;
}

.merge-results {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 6px;
  padding: 12px;
  text-align: left;
}

.merge-results div {
  margin-bottom: 4px;
  font-size: 14px;
  color: #065f46;
}

.history-empty {
  text-align: center;
  padding: 40px 20px;
}

.history-empty .empty-icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.merge-history-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.history-item {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 16px;
}

.history-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.history-amount {
  font-size: 18px;
  font-weight: 600;
  color: #059669;
}

.history-date {
  font-size: 12px;
  color: #6b7280;
}

.history-details {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.history-details div {
  font-size: 14px;
  color: #374151;
}


/* FIX: Ensure all sidebar tabs are visible - April 5 2026 */
.sidebar-nav {
  max-height: calc(100vh - 120px) !important;
  overflow-y: auto !important;
  padding-bottom: 20px !important;
}

/* Force navbar to show all tabs */
.sidebar {
  overflow-y: auto !important;
}

/* INTEL PAGE FORMATTING IMPROVEMENTS - April 5 2026 */
.intel-prop-card, .intel-mpm-card {
  max-height: 400px !important;
  overflow-y: auto !important;
}

.intel-prop-updates {
  max-height: 200px !important;
  overflow-y: auto !important;
}

.intel-prop-update-item {
  padding: 6px 0 !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
}

.intel-prop-update-time {
  min-width: 80px !important;
  font-size: 11px !important;
  color: var(--text-tertiary) !important;
}

.intel-attention-section {
  max-height: 300px !important;
  overflow-y: auto !important;
}

.intel-attention-item {
  padding: 8px 12px !important;
  margin: 4px 0 !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

.intel-mpm-updates-list {
  max-height: 250px !important;
  overflow-y: auto !important;
}

/* ===== LOADING SPINNER & ERROR BOUNDARY STYLES ===== */
.loading-spinner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    text-align: center;
}

.spinner {
    width: 32px;
    height: 32px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    border-top-color: var(--accent);
    animation: spin 1s ease-in-out infinite;
    margin-bottom: 12px;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.loading-spinner span {
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 500;
}

/* Error boundaries styling */
.error-boundary {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 8px;
    padding: 16px;
    margin: 8px 0;
    color: #fca5a5;
}

.error-boundary h3 {
    margin: 0 0 8px 0;
    color: #ef4444;
    font-size: 16px;
    font-weight: 600;
}

.error-boundary p {
    margin: 0;
    font-size: 14px;
    opacity: 0.9;
}

/* Enhanced accessibility */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ARIA labels and focus indicators */
[role="button"]:focus,
button:focus,
a:focus {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

/* Loading states for data-heavy sections */
.data-loading {
    opacity: 0.6;
    pointer-events: none;
}

.data-loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 24px;
    height: 24px;
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    border-top-color: var(--accent);
    animation: spin 1s linear infinite;
}