/* =============================================
   GALANT IT — Theme System
   Modes: light · dark · auto (via JS)
   Palettes: aurora · professional · healthcare
   ============================================= */

/* ── Semantic tokens (defaults = Aurora Dark) ── */
:root {
  --navbar-bg: rgba(6, 11, 24, 0.82);
  --navbar-bg-scrolled: rgba(6, 11, 24, 0.96);
  --dropdown-bg: rgba(13, 21, 39, 0.98);
  --mobile-menu-bg: rgba(6, 11, 24, 0.98);
  --hero-tag-bg: rgba(0, 198, 255, 0.08);
  --hero-tag-border: rgba(0, 198, 255, 0.22);
  --page-hero-bg: linear-gradient(135deg, rgba(0, 198, 255, 0.05) 0%, rgba(123, 47, 247, 0.05) 100%);
  --btn-ghost-bg: rgba(255, 255, 255, 0.04);
  --btn-ghost-border: rgba(255, 255, 255, 0.12);
  --logo-fallback-accent: #00c6ff;
  --canvas-node-1: rgba(0, 198, 255, 0.55);
  --canvas-node-2: rgba(123, 47, 247, 0.55);
  --canvas-node-3: rgba(247, 37, 133, 0.55);
}

html { color-scheme: light dark; }
[data-theme="light"] { color-scheme: light; }
[data-theme="dark"] { color-scheme: dark; }

/* ══════════════════════════════════════════
   PALETTE: AURORA (default neon — current)
   ══════════════════════════════════════════ */
[data-palette="aurora"][data-theme="dark"],
:root:not([data-theme]) {
  --bg-primary: #060b18;
  --bg-surface: #0d1527;
  --bg-card: rgba(255, 255, 255, 0.04);
  --bg-card-hover: rgba(255, 255, 255, 0.08);
  --border-glass: rgba(255, 255, 255, 0.08);
  --grad-primary: linear-gradient(135deg, #00c6ff 0%, #7b2ff7 100%);
  --grad-accent: linear-gradient(135deg, #f72585 0%, #7b2ff7 100%);
  --color-primary: #00c6ff;
  --color-violet: #7b2ff7;
  --color-accent: #f72585;
  --text-primary: #e2e8f0;
  --text-muted: #94a3b8;
  --text-white: #ffffff;
  --shadow-glow: 0 0 40px rgba(0, 198, 255, 0.15);
  --shadow-card: 0 8px 32px rgba(0, 0, 0, 0.4);
  --navbar-bg: rgba(6, 11, 24, 0.82);
  --navbar-bg-scrolled: rgba(6, 11, 24, 0.96);
  --dropdown-bg: rgba(13, 21, 39, 0.98);
  --mobile-menu-bg: rgba(6, 11, 24, 0.98);
  --hero-tag-bg: rgba(0, 198, 255, 0.1);
  --hero-tag-border: rgba(0, 198, 255, 0.25);
  --page-hero-bg: linear-gradient(135deg, rgba(0, 198, 255, 0.06) 0%, rgba(123, 47, 247, 0.06) 100%);
  --btn-ghost-bg: rgba(255, 255, 255, 0.05);
  --btn-ghost-border: rgba(255, 255, 255, 0.14);
  --logo-fallback-accent: #00c6ff;
}

[data-palette="aurora"][data-theme="light"] {
  --bg-primary: #f8fafc;
  --bg-surface: #ffffff;
  --bg-card: #ffffff;
  --bg-card-hover: #f1f5f9;
  --border-glass: rgba(15, 23, 42, 0.1);
  --grad-primary: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
  --grad-accent: linear-gradient(135deg, #7c3aed 0%, #6366f1 100%);
  --color-primary: #4f46e5;
  --color-violet: #7c3aed;
  --color-accent: #6366f1;
  --text-primary: #1e293b;
  --text-muted: #475569;
  --text-white: #0f172a;
  --shadow-glow: 0 0 40px rgba(79, 70, 229, 0.1);
  --shadow-card: 0 4px 24px rgba(15, 23, 42, 0.08);
  --navbar-bg: rgba(255, 255, 255, 0.92);
  --navbar-bg-scrolled: rgba(255, 255, 255, 0.98);
  --dropdown-bg: #ffffff;
  --mobile-menu-bg: #ffffff;
  --hero-tag-bg: rgba(79, 70, 229, 0.08);
  --hero-tag-border: rgba(79, 70, 229, 0.2);
  --page-hero-bg: linear-gradient(135deg, rgba(79, 70, 229, 0.04) 0%, rgba(248, 250, 252, 1) 100%);
  --btn-ghost-bg: rgba(15, 23, 42, 0.04);
  --btn-ghost-border: rgba(15, 23, 42, 0.12);
  --logo-fallback-accent: #4f46e5;
  --canvas-node-1: rgba(79, 70, 229, 0.35);
  --canvas-node-2: rgba(124, 58, 237, 0.35);
  --canvas-node-3: rgba(99, 102, 241, 0.35);
}

/* ══════════════════════════════════════════
   PALETTE: PROFESSIONAL (corporate SaaS)
   ══════════════════════════════════════════ */
[data-palette="professional"][data-theme="dark"] {
  --bg-primary: #0f172a;
  --bg-surface: #1e293b;
  --bg-card: rgba(255, 255, 255, 0.04);
  --bg-card-hover: rgba(255, 255, 255, 0.07);
  --border-glass: rgba(255, 255, 255, 0.09);
  --grad-primary: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
  --grad-accent: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);
  --color-primary: #3b82f6;
  --color-violet: #1d4ed8;
  --color-accent: #60a5fa;
  --text-primary: #e2e8f0;
  --text-muted: #94a3b8;
  --text-white: #f8fafc;
  --shadow-glow: 0 0 40px rgba(59, 130, 246, 0.15);
  --shadow-card: 0 8px 32px rgba(0, 0, 0, 0.35);
  --navbar-bg: rgba(15, 23, 42, 0.9);
  --navbar-bg-scrolled: rgba(15, 23, 42, 0.97);
  --dropdown-bg: rgba(30, 41, 59, 0.98);
  --mobile-menu-bg: rgba(15, 23, 42, 0.98);
  --hero-tag-bg: rgba(59, 130, 246, 0.12);
  --hero-tag-border: rgba(59, 130, 246, 0.28);
  --page-hero-bg: linear-gradient(135deg, rgba(59, 130, 246, 0.07) 0%, rgba(29, 78, 216, 0.05) 100%);
  --btn-ghost-bg: rgba(255, 255, 255, 0.05);
  --btn-ghost-border: rgba(255, 255, 255, 0.12);
  --logo-fallback-accent: #3b82f6;
  --canvas-node-1: rgba(59, 130, 246, 0.55);
  --canvas-node-2: rgba(29, 78, 216, 0.55);
  --canvas-node-3: rgba(96, 165, 250, 0.55);
}

[data-palette="professional"][data-theme="light"] {
  --bg-primary: #ffffff;
  --bg-surface: #f8fafc;
  --bg-card: #ffffff;
  --bg-card-hover: #f1f5f9;
  --border-glass: rgba(15, 23, 42, 0.08);
  --grad-primary: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  --grad-accent: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  --color-primary: #2563eb;
  --color-violet: #1d4ed8;
  --color-accent: #3b82f6;
  --text-primary: #0f172a;
  --text-muted: #475569;
  --text-white: #0f172a;
  --shadow-glow: 0 0 30px rgba(37, 99, 235, 0.1);
  --shadow-card: 0 2px 16px rgba(15, 23, 42, 0.06);
  --navbar-bg: rgba(255, 255, 255, 0.92);
  --navbar-bg-scrolled: rgba(255, 255, 255, 0.98);
  --dropdown-bg: #ffffff;
  --mobile-menu-bg: #ffffff;
  --hero-tag-bg: rgba(37, 99, 235, 0.08);
  --hero-tag-border: rgba(37, 99, 235, 0.2);
  --page-hero-bg: linear-gradient(135deg, rgba(37, 99, 235, 0.04) 0%, rgba(248, 250, 252, 1) 100%);
  --btn-ghost-bg: rgba(15, 23, 42, 0.03);
  --btn-ghost-border: rgba(15, 23, 42, 0.1);
  --logo-fallback-accent: #2563eb;
  --canvas-node-1: rgba(37, 99, 235, 0.55);
  --canvas-node-2: rgba(29, 78, 216, 0.55);
  --canvas-node-3: rgba(59, 130, 246, 0.55);
}

/* ══════════════════════════════════════════
   PALETTE: HEALTHCARE (clinical / trust)
   ══════════════════════════════════════════ */
[data-palette="healthcare"][data-theme="dark"] {
  --bg-primary: #0c1929;
  --bg-surface: #132337;
  --bg-card: rgba(255, 255, 255, 0.04);
  --bg-card-hover: rgba(255, 255, 255, 0.07);
  --border-glass: rgba(255, 255, 255, 0.08);
  --grad-primary: linear-gradient(135deg, #14b8a6 0%, #0d9488 100%);
  --grad-accent: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
  --color-primary: #14b8a6;
  --color-violet: #0d9488;
  --color-accent: #2dd4bf;
  --text-primary: #e2e8f0;
  --text-muted: #94a3b8;
  --text-white: #f0fdfa;
  --shadow-glow: 0 0 40px rgba(20, 184, 166, 0.14);
  --shadow-card: 0 8px 32px rgba(0, 0, 0, 0.35);
  --navbar-bg: rgba(12, 25, 41, 0.9);
  --navbar-bg-scrolled: rgba(12, 25, 41, 0.97);
  --dropdown-bg: rgba(19, 35, 55, 0.98);
  --mobile-menu-bg: rgba(12, 25, 41, 0.98);
  --hero-tag-bg: rgba(20, 184, 166, 0.12);
  --hero-tag-border: rgba(20, 184, 166, 0.28);
  --page-hero-bg: linear-gradient(135deg, rgba(20, 184, 166, 0.07) 0%, rgba(13, 148, 136, 0.05) 100%);
  --btn-ghost-bg: rgba(255, 255, 255, 0.05);
  --btn-ghost-border: rgba(255, 255, 255, 0.12);
  --logo-fallback-accent: #14b8a6;
  --canvas-node-1: rgba(20, 184, 166, 0.55);
  --canvas-node-2: rgba(13, 148, 136, 0.55);
  --canvas-node-3: rgba(45, 212, 191, 0.55);
}

[data-palette="healthcare"][data-theme="light"] {
  --bg-primary: #f0fdfa;
  --bg-surface: #ffffff;
  --bg-card: #ffffff;
  --bg-card-hover: #f0fdfa;
  --border-glass: rgba(13, 78, 74, 0.1);
  --grad-primary: linear-gradient(135deg, #0d9488 0%, #0f766e 100%);
  --grad-accent: linear-gradient(135deg, #14b8a6 0%, #0d9488 100%);
  --color-primary: #0d9488;
  --color-violet: #0f766e;
  --color-accent: #14b8a6;
  --text-primary: #134e4a;
  --text-muted: #5b7a78;
  --text-white: #042f2e;
  --shadow-glow: 0 0 30px rgba(13, 148, 136, 0.1);
  --shadow-card: 0 2px 16px rgba(13, 78, 74, 0.06);
  --navbar-bg: rgba(255, 255, 255, 0.92);
  --navbar-bg-scrolled: rgba(255, 255, 255, 0.98);
  --dropdown-bg: #ffffff;
  --mobile-menu-bg: #ffffff;
  --hero-tag-bg: rgba(13, 148, 136, 0.08);
  --hero-tag-border: rgba(13, 148, 136, 0.22);
  --page-hero-bg: linear-gradient(135deg, rgba(13, 148, 136, 0.05) 0%, rgba(240, 253, 250, 1) 100%);
  --btn-ghost-bg: rgba(4, 47, 46, 0.04);
  --btn-ghost-border: rgba(4, 47, 46, 0.1);
  --logo-fallback-accent: #0d9488;
  --canvas-node-1: rgba(13, 148, 136, 0.55);
  --canvas-node-2: rgba(15, 118, 110, 0.55);
  --canvas-node-3: rgba(20, 184, 166, 0.55);
}

/* Light mode component tweaks */
[data-theme="light"] .g-navbar.scrolled {
  box-shadow: 0 2px 20px rgba(15, 23, 42, 0.08);
  border-bottom-color: var(--border-glass);
}
[data-theme="light"] .nav-link:hover,
[data-theme="light"] .nav-link.active {
  color: var(--text-primary);
  background: rgba(15, 23, 42, 0.06);
}
[data-theme="light"] .dropdown-item-ai:hover { background: rgba(15, 23, 42, 0.05); }
[data-theme="light"] .dropdown-item-ai div[style*="color:#e2e8f0"],
[data-theme="light"] .dropdown-item-ai div[style*="color: #e2e8f0"] {
  color: var(--text-primary) !important;
}
[data-theme="light"] .glass-card { box-shadow: var(--shadow-card); }
[data-theme="light"] .hero-product-badge { background: var(--bg-card); border-color: var(--border-glass); }
[data-theme="light"] .hero-product-badge:hover { background: var(--bg-card-hover); color: var(--text-primary); }
[data-theme="light"] .btn-ghost { background: var(--btn-ghost-bg); border-color: var(--btn-ghost-border); color: var(--text-primary); }
[data-theme="light"] .glow-orb { opacity: 0.2; }
[data-theme="light"] .orb-cyan { background: var(--color-primary); }
[data-theme="light"] .orb-violet { background: var(--color-violet); }

/* Fix hardcoded dark-theme inline colors */
[data-theme="light"] [style*="color:#e2e8f0"],
[data-theme="light"] [style*="color: #e2e8f0"],
[data-theme="light"] [style*="color:#fff"],
[data-theme="light"] [style*="color: #fff"],
[data-theme="light"] [style*="color:#ffffff"],
[data-theme="light"] [style*="color: #ffffff"] {
  color: var(--text-primary) !important;
}
[data-theme="light"] [style*="color:#7f8ea3"],
[data-theme="light"] [style*="color: #7f8ea3"] {
  color: var(--text-muted) !important;
}
[data-theme="light"] #mobile-close { color: var(--text-primary) !important; }

/* Marquee logos — were inverted to white for dark bg */
[data-theme="light"] .marquee-logo {
  filter: brightness(0) opacity(0.55);
  opacity: 1;
}
[data-theme="light"] .marquee-logo:hover {
  filter: brightness(0) opacity(0.8);
}

/* CTA banner — was always dark */
[data-theme="light"] .cta-banner {
  background: linear-gradient(135deg, #e0f2fe 0%, #ede9fe 100%);
  border-top-color: var(--border-glass);
  border-bottom-color: var(--border-glass);
}
[data-theme="light"] .cta-banner .section-title,
[data-theme="light"] .cta-banner h2,
[data-theme="light"] .cta-banner .section-subtitle,
[data-theme="light"] .cta-banner p {
  color: var(--text-primary);
}

/* Hero canvas — soften on light backgrounds */
[data-theme="light"] #hero-canvas { opacity: 0.3; }

/* Section labels */
[data-theme="light"] .section-label {
  background: var(--hero-tag-bg);
  border-color: var(--hero-tag-border);
}

/* Dropdown borders with hardcoded white rgba */
[data-theme="light"] [style*="rgba(255,255,255,0.06)"],
[data-theme="light"] [style*="rgba(255, 255, 255, 0.06)"] {
  border-top-color: var(--border-glass) !important;
}

/* Theme switch stays readable in both modes */
[data-theme="light"] .theme-switch-btn.active { color: #fff; }
