/*
  ============================================================
  ATIYA DIGITAL LABS — Portal Theme Override
  Drop this file into: static/css/portal_theme.css
  Then see claude_code_morning.txt for how to link it.
  
  This file overrides ALL purple, gold, and off-brand accent
  colors in the portal and replaces them with neon green.
  ============================================================
*/

/* ── CORE COLOR VARIABLES ─────────────────────────────────── */
:root {
  --accent:          #39FF14;
  --accent-low:      rgba(57, 255, 20, 0.08);
  --accent-mid:      rgba(57, 255, 20, 0.25);
  --accent-glow:     0 0 16px rgba(57, 255, 20, 0.35);

  /* Kill the gold and purple variables */
  --border-gold:     rgba(57, 255, 20, 0.2);
  --accent-gold:     #39FF14;
  --accent-purple:   #39FF14;
  --color-primary:   #39FF14;
  --color-accent:    #39FF14;

  /* Background stays dark */
  --bg-primary:      #000000;
  --bg-secondary:    #080808;
  --bg-card:         #0d0d0d;
  --bg-sidebar:      #080808;

  /* Borders */
  --border-primary:  #1a1a1a;
  --border-accent:   rgba(57, 255, 20, 0.2);

  /* Text */
  --text-primary:    #ffffff;
  --text-secondary:  rgba(255, 255, 255, 0.75);
  --text-subtle:     rgba(255, 255, 255, 0.4);
  --text-muted:      rgba(255, 255, 255, 0.25);

  /* Status */
  --success:         #39FF14;
  --danger:          #ff6b6b;
  --warning:         #FFB800;

  /* Fonts */
  --font-display:    'Orbitron', monospace;
  --font-body:       'Exo 2', sans-serif;
}

/* ── SIDEBAR ──────────────────────────────────────────────── */
.sidebar {
  background: var(--bg-sidebar) !important;
  border-right: 1px solid var(--border-primary) !important;
}

.sidebar-brand .brand-name {
  color: var(--text-primary) !important;
  font-family: var(--font-display) !important;
}

.sidebar-brand .brand-tagline {
  color: var(--accent) !important;
  font-family: var(--font-display) !important;
  font-size: 0.6rem !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
}

.sidebar-label {
  color: rgba(255, 255, 255, 0.25) !important;
  font-family: var(--font-display) !important;
  font-size: 0.55rem !important;
  letter-spacing: 0.25em !important;
}

.sidebar-link {
  color: rgba(255, 255, 255, 0.45) !important;
  border-left: 2px solid transparent !important;
  transition: all 0.2s !important;
}

.sidebar-link:hover {
  color: var(--text-primary) !important;
  background: var(--accent-low) !important;
  border-left-color: rgba(57, 255, 20, 0.4) !important;
}

.sidebar-link.active {
  color: var(--accent) !important;
  background: var(--accent-low) !important;
  border-left-color: var(--accent) !important;
}

/* ── MAIN CONTENT AREA ────────────────────────────────────── */
.main-content {
  background: var(--bg-primary) !important;
}

.page-title {
  font-family: var(--font-display) !important;
  color: var(--text-primary) !important;
}

.page-subtitle {
  color: var(--text-subtle) !important;
}

/* ── CARDS ────────────────────────────────────────────────── */
.card, [class*="card"] {
  background: var(--bg-card) !important;
  border-color: var(--border-primary) !important;
}

/* Room cards with accent borders */
[class*="card"]:hover {
  border-color: rgba(57, 255, 20, 0.2) !important;
}

/* ── PLAN BADGE ───────────────────────────────────────────── */
[class*="plan-badge"],
[class*="plan-tag"],
[class*="badge"] {
  background: var(--accent-low) !important;
  border-color: var(--accent-mid) !important;
  color: var(--accent) !important;
}

/* ── BUTTONS ──────────────────────────────────────────────── */
/* Primary buttons */
.btn-primary,
[class*="btn-primary"],
button[style*="background: var(--color-primary)"],
button[style*="background:var(--color-primary)"] {
  background: var(--accent) !important;
  color: #000 !important;
  border-color: var(--accent) !important;
}

/* Ghost / outline buttons */
.btn-ghost,
[class*="btn-ghost"],
.btn-outline,
[class*="btn-outline"] {
  border-color: rgba(57, 255, 20, 0.3) !important;
  color: var(--accent) !important;
  background: transparent !important;
}

.btn-ghost:hover,
.btn-outline:hover {
  background: var(--accent-low) !important;
  border-color: var(--accent) !important;
}

/* ── QUICK ACTIONS ────────────────────────────────────────── */
.quick-action,
[class*="quick-action"] {
  background: var(--bg-card) !important;
  border-color: var(--border-primary) !important;
  color: var(--text-secondary) !important;
}

.quick-action:hover {
  border-color: var(--accent-mid) !important;
  color: var(--accent) !important;
}

/* ── ROOM CARDS — Plan tags ───────────────────────────────── */
/* ALL PLANS tag */
[class*="tag-all"],
span:contains("ALL PLANS") {
  background: rgba(57, 255, 20, 0.08) !important;
  color: var(--accent) !important;
  border-color: rgba(57, 255, 20, 0.2) !important;
}

/* SCALE tag */
[class*="tag-scale"] {
  background: rgba(57, 255, 20, 0.12) !important;
  color: var(--accent) !important;
}

/* BUILD tag */
[class*="tag-build"] {
  background: rgba(57, 255, 20, 0.06) !important;
  color: rgba(57, 255, 20, 0.7) !important;
}

/* ── INPUTS & FORMS ───────────────────────────────────────── */
input, textarea, select {
  background: #111 !important;
  border-color: var(--border-primary) !important;
  color: var(--text-primary) !important;
}

input:focus, textarea:focus, select:focus {
  border-color: rgba(57, 255, 20, 0.5) !important;
  box-shadow: 0 0 0 2px rgba(57, 255, 20, 0.08) !important;
  outline: none !important;
}

/* ── LINKS & ACCENTS ──────────────────────────────────────── */
a[class*="accent"],
[style*="color: var(--color-primary)"],
[style*="color:var(--color-primary)"],
[style*="color: var(--accent-gold)"],
[style*="color: var(--accent-purple)"] {
  color: var(--accent) !important;
}

/* ── TOAST / NOTIFICATION ─────────────────────────────────── */
[style*="--border-gold"] {
  border-color: rgba(57, 255, 20, 0.25) !important;
}

/* ── PROGRESS BARS ────────────────────────────────────────── */
[class*="progress"] > [class*="fill"],
[class*="progress-bar"] {
  background: var(--accent) !important;
  box-shadow: 0 0 6px var(--accent) !important;
}

/* ── MESSAGES / RECENT MESSAGES ───────────────────────────── */
[class*="message"] {
  border-color: var(--border-primary) !important;
}

[class*="message-you"],
[class*="msg-you"] {
  background: var(--accent-low) !important;
  border-color: var(--accent-mid) !important;
  color: var(--text-primary) !important;
}

/* ── STATS / KPI CARDS ────────────────────────────────────── */
[class*="stat-value"],
[class*="kpi-value"],
[class*="metric-value"] {
  color: var(--accent) !important;
}

/* ── SCROLLBAR ────────────────────────────────────────────── */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(57, 255, 20, 0.2);
  border-radius: 99px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(57, 255, 20, 0.4);
}

/* ── KILL ALL PURPLE ──────────────────────────────────────── */
/* Catches any hardcoded purple values that might sneak through */
[style*="#7c3aed"], [style*="#8b5cf6"], [style*="#6d28d9"],
[style*="#a855f7"], [style*="#9333ea"], [style*="purple"] {
  color: var(--accent) !important;
  border-color: var(--accent-mid) !important;
  background-color: var(--accent-low) !important;
}

/* ── KILL ALL GOLD/AMBER ──────────────────────────────────── */
[style*="#f59e0b"], [style*="#d97706"], [style*="#b45309"],
[style*="#fbbf24"], [style*="amber"], [style*="#FFD700"],
[style*="#FFC107"] {
  color: var(--accent) !important;
  border-color: var(--accent-mid) !important;
}