/**
 * Brain Swarm - Dark Theme Variables
 * Generated from SCSS variables in _colors.scss
 *
 * DO NOT EDIT MANUALLY - This file is auto-generated
 * Generated: 2025-06-21T09:04:10.946Z
 *
 * Usage:
 * <link rel="stylesheet" href="resources/css/themes/dark.css" data-theme="dark">
 *
 * Or dynamically load:
 * window.UniversalTheme.loadThemeCSS('dark');
 */

[data-theme="dark"] {
  --bg-inverse: #ffffff;
  --bg-primary: #0A0A14;
  --bg-secondary: #151520;
  --bg-tertiary: #1F1F2E;
  --border-focus: var(--color-primary);
  --border-primary: #495057;
  --border-secondary: #343a40;
  --bs-bg-primary: #0A0A14;
  --bs-bg-secondary: #151520;
  --bs-border: rgba(#00b8d4, 0.3);
  --bs-button-bg: #00b8d4;
  --bs-button-hover: var(--color-primary-light);
  --bs-button-text: #ffffff;
  --bs-link: var(--color-primary-light);
  --bs-link-hover: var(--color-primary-light);
  --bs-neuron-active: var(--color-primary-light);
  --bs-neuron-inactive: rgba(#00b8d4, 0.2);
  --bs-shadow: rgba(#00b8d4, 0.2);
  --bs-synapse-color: rgba(#7b1fa2, 0.6);
  --bs-text-primary: #f8f9fa;
  --bs-text-secondary: #ced4da;
  --btn-primary-bg: var(--color-primary);
  --btn-primary-text: var(--text-inverse);
  --btn-secondary-bg: var(--color-secondary);
  --btn-secondary-text: var(--text-primary);
  --nav-bg: var(--bg-primary);
  --nav-hover: var(--bg-secondary);
  --nav-text: var(--text-primary);
  --neural-backdrop-blur: 8px;
  --neural-glow-opacity: 0.3;
  --neural-intensity: 0.7;
  --text-inverse: #0A0A14;
  --text-muted: #868e96;
  --text-primary: #f8f9fa;
  --text-secondary: #ced4da;
}

/* Theme-specific utility classes */
.theme-dark {
  /* Apply theme variables to this element and children */
}

/* Color preview utilities (for documentation/debugging) */
.dark-preview {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  padding: 1rem;
}

.dark-color-swatch {
  display: flex;
  align-items: center;
  padding: 0.5rem;
  border: 1px solid var(--border-primary, #ccc);
  border-radius: 4px;
}

.dark-color-sample {
  width: 40px;
  height: 40px;
  border-radius: 4px;
  margin-right: 0.5rem;
  border: 1px solid rgba(0, 0, 0, 0.1);
}