/* ==========================================================================
   UI THEME SYSTEM - CSS Custom Properties, Palettes & Visual Tokens
   ========================================================================== */

:root {
  /* Default Cyber Blue Palette & Base Tokens */
  --bg-color: #0d1117;
  --panel-bg: rgba(22, 27, 34, 0.88);
  --panel-border: rgba(255, 255, 255, 0.12);
  --accent-color: #2563eb;
  --accent-hover: #1d4ed8;
  --text-main: #f0f6fc;
  --text-muted: #8b949e;
  --value-color: #58a6ff;
  
  /* Performance Status Colors */
  --status-good: #3fb950;
  --status-warn: #d29922;
  --status-bad: #f85149;

  /* Console Tag Colors */
  --tag-info: #58a6ff;
  --tag-event: #a371f7;
  --tag-warn: #d29922;
  --tag-error: #f85149;
  --tag-cmd: #3fb950;

  /* Bloom Glow Effect */
  --cell-glow-shadow: 0 0 8px var(--value-color);
  --cell-glow-active: none;
}

/* Base Body Application Theme Styles */
body, html {
  background-color: var(--bg-color);
  color: var(--text-main);
  transition: background-color 0.2s ease, color 0.2s ease;
}

/* Theme Palette Variants */
body[data-palette="blue"] {
  --value-color: #58a6ff;
  --accent-color: #2563eb;
  --accent-hover: #1d4ed8;
}

body[data-palette="green"] {
  --value-color: #3fb950;
  --accent-color: #238636;
  --accent-hover: #2ea043;
}

body[data-palette="amber"] {
  --value-color: #d29922;
  --accent-color: #9e6a03;
  --accent-hover: #bb8009;
}

body[data-palette="purple"] {
  --value-color: #bc8cff;
  --accent-color: #8957e5;
  --accent-hover: #a371f7;
}

body[data-palette="coral"] {
  --value-color: #ff7b72;
  --accent-color: #da3633;
  --accent-hover: #f85149;
}

body[data-palette="cyan"] {
  --value-color: #39c5bb;
  --accent-color: #1b7c75;
  --accent-hover: #2ba79d;
}

body[data-palette="pink"] {
  --value-color: #f43f5e;
  --accent-color: #e11d48;
  --accent-hover: #be123c;
}

body[data-palette="white"] {
  --value-color: #f0f6fc;
  --accent-color: #30363d;
  --accent-hover: #484f58;
}

/* Background Presets */
body[data-bg="dark-slate"] {
  --bg-color: #0d1117;
}

body[data-bg="pure-black"] {
  --bg-color: #000000;
}

body[data-bg="deep-gray"] {
  --bg-color: #161b22;
}

body[data-bg="midnight-navy"] {
  --bg-color: #0a0f1d;
}

body[data-bg="dark-purple"] {
  --bg-color: #13091f;
}

/* Glow Effect Toggle */
body.theme-glow-active {
  --cell-glow-active: var(--cell-glow-shadow);
}