/* ── FRICTIONLESS V6 — LAB THEME ──────────────────────────── */
/* This file overrides all page-level :root vars to unify the theme */

:root {
  --bg: #06060A !important;
  --bg-subtle: #0C0C14 !important;
  --surface: #0E0D16 !important;
  --surface2: #111019 !important;
  --surface3: #16122A !important;
  --card: #111019 !important;
  --card-hover: #16122A !important;
  --card-border: rgba(139,124,246,0.18) !important;
  --card-border-hover: rgba(139,124,246,0.50) !important;
  --accent: #8B7CF6 !important;
  --accent2: #A594FF !important;
  --accent-bright: #A594FF !important;
  --accent-soft: rgba(139,124,246,0.15) !important;
  --accent-glow: rgba(139,124,246,0.45) !important;
  --green: #34D399 !important;
  --green-soft: rgba(52,211,153,0.15) !important;
  --red: #F87171 !important;
  --red-soft: rgba(248,113,113,0.15) !important;
  --yellow: #FBBF24 !important;
  --yellow-soft: rgba(251,191,36,0.15) !important;
  --cyan: #22D3EE !important;
  --cyan-soft: rgba(34,211,238,0.15) !important;
  --amber: #FBBF24 !important;
  --orange: #FB923C !important;
  --orange-soft: rgba(251,146,60,0.15) !important;
  --white: #F0F0F5 !important;
  --text: #B0B0C4 !important;
  --text2: #B0B0C4 !important;
  --text3: #6E6E88 !important;
  --muted: #6E6E88 !important;
  --border: rgba(139,124,246,0.18) !important;
  --radius: 16px !important;
  --radius-sm: 12px !important;
}

/* ── Body: grid pattern + base ──────────────────────────── */
body {
  background-color: #06060A !important;
  background-image:
    linear-gradient(rgba(139,124,246,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(139,124,246,0.03) 1px, transparent 1px) !important;
  background-size: 60px 60px !important;
  color: #B0B0C4 !important;
  -webkit-font-smoothing: antialiased;
}

/* ── Ambient atmosphere (added via pseudo on body) ──────── */
body::before {
  content: '';
  position: fixed;
  top: -100px; left: 100px;
  width: 800px; height: 800px;
  background: radial-gradient(circle, rgba(139,124,246,0.12) 0%, rgba(139,124,246,0.03) 50%, transparent 70%);
  pointer-events: none;
  z-index: 0;
  animation: v6-breathe 8s ease-in-out infinite;
}
body::after {
  content: '';
  position: fixed;
  bottom: -50px; right: 0;
  width: 700px; height: 700px;
  background: radial-gradient(circle, rgba(34,211,238,0.08) 0%, rgba(34,211,238,0.02) 50%, transparent 70%);
  pointer-events: none;
  z-index: 0;
  animation: v6-breathe 8s ease-in-out 4s infinite;
}
@keyframes v6-breathe { 0%,100% { opacity: 0.7; } 50% { opacity: 1; } }

/* ── Shared element upgrades ────────────────────────────── */

/* Headers with gradient text */
h1 span, .header h1 span, .logo span {
  background: linear-gradient(135deg, #8B7CF6 0%, #A594FF 40%, #22D3EE 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  filter: drop-shadow(0 0 20px rgba(139,124,246,0.4));
}

/* Nav links */
.nav a:hover, .nav-link:hover {
  background: rgba(139,124,246,0.15) !important;
  color: #F0F0F5 !important;
}
.nav a.active, .nav-link.active {
  background: rgba(139,124,246,0.22) !important;
  color: #F0F0F5 !important;
  border-color: rgba(139,124,246,0.35) !important;
}

/* Cards and surfaces */
.card, .stat-card, .client-card, .tool-card, .feature-card,
.metric-card, .action-card, .session-card, .clone-card,
.workflow-card, .channel-card, .platform-card, .council-card {
  background: #111019 !important;
  border-color: rgba(139,124,246,0.18) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
.card:hover, .stat-card:hover, .client-card:hover, .tool-card:hover,
.feature-card:hover, .metric-card:hover, .action-card:hover,
.session-card:hover, .clone-card:hover, .workflow-card:hover,
.channel-card:hover, .platform-card:hover, .council-card:hover {
  border-color: rgba(139,124,246,0.50) !important;
  background: #16122A !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.4), 0 0 30px rgba(139,124,246,0.15) !important;
}

/* Section titles */
.section-title, .section-header, h2, h3 {
  color: #F0F0F5 !important;
}

/* Inputs and textareas */
input[type="text"], input[type="search"], input[type="url"], input[type="email"],
input[type="number"], textarea, select, .search-input, .input {
  background: #0E0D16 !important;
  border-color: rgba(139,124,246,0.18) !important;
  color: #F0F0F5 !important;
}
input:focus, textarea:focus, select:focus, .search-input:focus, .input:focus {
  border-color: #8B7CF6 !important;
  box-shadow: 0 0 0 3px rgba(139,124,246,0.25) !important;
  background: #14122A !important;
}

/* Buttons */
button, .btn, .action-btn {
  transition: all 0.25s ease;
}
button:hover, .btn:hover, .action-btn:hover {
  box-shadow: 0 4px 20px rgba(139,124,246,0.15);
}

/* Tables */
table { border-collapse: collapse; }
th {
  background: #0E0D16 !important;
  border-bottom: 1px solid rgba(139,124,246,0.18) !important;
}
td {
  border-bottom: 1px solid rgba(139,124,246,0.08) !important;
}
tr:hover td {
  background: rgba(139,124,246,0.04) !important;
}

/* Scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(139,124,246,0.25); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(139,124,246,0.40); }

/* Sidebar/navigation backgrounds */
.sidebar, .side-nav, .left-panel, nav {
  background: linear-gradient(180deg, #12101E 0%, #0A0A14 50%, #0D0E18 100%) !important;
  border-color: rgba(139,124,246,0.20) !important;
}

/* Header bars */
.header, .top-bar, .toolbar {
  background: #0A0A12 !important;
  border-color: rgba(139,124,246,0.15) !important;
}

/* Modals and overlays */
.modal, .dialog, .popup, .dropdown {
  background: #111019 !important;
  border: 1px solid rgba(139,124,246,0.25) !important;
  box-shadow: 0 32px 100px rgba(0,0,0,0.7), 0 0 60px rgba(139,124,246,0.12) !important;
}

/* Tags, badges, pills */
.tag, .badge, .pill, .chip, .status {
  border-radius: 20px;
}

/* Lucide icon sizing */
.lucide {
  width: 18px;
  height: 18px;
  stroke-width: 1.75;
  vertical-align: middle;
}
.lucide-sm { width: 14px; height: 14px; }
.lucide-lg { width: 24px; height: 24px; }
.lucide-xl { width: 32px; height: 32px; }