/* ==========================================================================
   Fraoula Lead Intelligence — Plum & Gold Yellow Theme System
   ========================================================================== */

:root {
  /* Plum Palette */
  --bg-darkest: #12041A;
  --bg-darker:  #1A0726;
  --bg-card:    #260D38;
  --bg-card-hover: #33134B;
  --border-plum: #4E1B6F;
  --border-plum-light: #6E269B;

  /* Gold Yellow Palette */
  --gold-primary: #FFD700;
  --gold-amber:   #F59E0B;
  --gold-light:   #FEF08A;
  --gold-soft:    #FDE68A;
  --gold-muted:   #D97706;

  /* Neutrals */
  --text-primary: #F8FAFC;
  --text-muted:   #CBD5E1;
  --text-dim:     #94A3B8;
  --text-plum-light: #E9D5FF;
}

/* Custom Scrollbars */
::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-track { background: var(--bg-darkest); }
::-webkit-scrollbar-thumb { background: var(--border-plum); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--gold-amber); }

/* Glassmorphism Plum Cards */
.plum-card {
  background: linear-gradient(135deg, rgba(38, 13, 56, 0.95), rgba(26, 7, 38, 0.98));
  border: 1px solid var(--border-plum);
  backdrop-filter: blur(12px);
  box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.5), 0 0 15px rgba(110, 38, 155, 0.15);
}

.plum-card:hover {
  border-color: var(--border-plum-light);
  box-shadow: 0 12px 35px -5px rgba(0, 0, 0, 0.6), 0 0 20px rgba(245, 158, 11, 0.2);
}

/* Gold Accents & Glows */
.gold-glow {
  text-shadow: 0 0 12px rgba(255, 215, 0, 0.4);
}

.gold-border-glow {
  border-color: var(--gold-amber) !important;
  box-shadow: 0 0 15px rgba(245, 158, 11, 0.3) !important;
}

/* Primary Gold Action Buttons */
.btn-gold {
  background: linear-gradient(135deg, #FFD700 0%, #F59E0B 50%, #D97706 100%);
  color: #1A0726;
  font-weight: 700;
  border: none;
  box-shadow: 0 4px 15px rgba(245, 158, 11, 0.35);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-gold:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(255, 215, 0, 0.5);
  filter: brightness(1.05);
}

.btn-gold:active {
  transform: translateY(0);
  filter: brightness(0.95);
}

/* Plum Secondary Buttons */
.btn-plum {
  background: rgba(78, 27, 111, 0.6);
  color: var(--gold-light);
  border: 1px solid var(--border-plum-light);
  transition: all 0.2s ease;
}

.btn-plum:hover {
  background: rgba(110, 38, 155, 0.8);
  border-color: var(--gold-amber);
  color: #FFFFFF;
}

/* Tab Switching in Plum and Gold */
.nav-tab-btn {
  color: var(--text-dim);
  border-bottom: 2px solid transparent;
  transition: all 0.2s ease;
}

.nav-tab-btn:hover {
  color: var(--gold-light);
}

.nav-tab-btn.active-tab {
  color: var(--gold-primary);
  border-bottom-color: var(--gold-primary);
  text-shadow: 0 0 10px rgba(255, 215, 0, 0.4);
}

/* Badges */
.badge-hot {
  background: linear-gradient(135deg, #DC2626, #F97316);
  color: #FFFFFF;
  font-weight: 700;
  box-shadow: 0 0 10px rgba(220, 38, 38, 0.3);
}

.badge-warm {
  background: linear-gradient(135deg, #D97706, #F59E0B);
  color: #1A0726;
  font-weight: 800;
  box-shadow: 0 0 10px rgba(245, 158, 11, 0.3);
}

.badge-potential {
  background: linear-gradient(135deg, #6E269B, #9333EA);
  color: var(--gold-light);
  font-weight: 700;
}

.badge-verified {
  background: rgba(16, 185, 129, 0.2);
  color: #6EE7B7;
  border: 1px solid rgba(16, 185, 129, 0.4);
}

.badge-flag {
  background: rgba(245, 158, 11, 0.2);
  color: #FCD34D;
  border: 1px solid rgba(245, 158, 11, 0.4);
}
