/* NIBIRU Theme Switcher - Dedicated theme overrides */

/* Base selector styles */
.theme-selector-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
}
.theme-selector {
  appearance: none;
  -webkit-appearance: none;
  color-scheme: dark;
  position: relative;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.04));
  border: 1px solid rgba(255,255,255,0.25);
  color: #ffffff;
  padding: 6px 28px 6px 10px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.3px;
  border-radius: 8px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.15);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  cursor: pointer;
}
.theme-selector:focus { outline: none; border-color: #ff6600; }

/* Dark dropdown menu items (supported in Chromium/Firefox) */
.theme-selector option {
  background-color: #121316;
  color: #ffffff;
}
.theme-selector optgroup {
  color: #ff6600;
}

/* Ensure icon is clearly visible */
.theme-selector-wrap .fa-palette {
  color: #ff6600;
}

/* Theme variables */
:root {
  --ui-bg: #000;
  --ui-panel-bg: #0a0a0a;
  --ui-panel-border: #333;
  --ui-accent: #ff6600;
  --ui-accent-2: #ff8833;
  --ui-text: #ffffff;
  --ui-text-muted: #cccccc;
}

/* Common hook points using CSS variables */
body {
  background: var(--ui-bg);
  color: var(--ui-text);
}
.terminal-header, .terminal-footer {
  background: var(--ui-panel-bg);
  border-top: 1px solid var(--ui-panel-border);
  border-bottom: 1px solid var(--ui-panel-border);
}
.widget, .news-feed, .crypto-list, .market-overview {
  background: var(--ui-panel-bg);
  border: 1px solid var(--ui-panel-border);
}
.bookmark-btn, .mode-switch-btn, .filter-tag, .refresh-btn {
  border-color: var(--ui-panel-border);
}
.chat-overlay {
  backdrop-filter: none;
}

/* ========== Glassmorphism ==========
   Soft frosted glass panels with subtle blur and gradient accents */
[data-theme="glass"] {
  /* Theme-scoped UI variables */
  --ui-bg: linear-gradient(180deg, #0a0f16 0%, #0f1620 60%, #0a0f16 100%);
  --ui-panel-bg: linear-gradient(180deg, #161d27 0%, #12171f 100%);
  --ui-panel-border: #2b323b;
  --ui-accent: #2f6fed; /* cobalt */
  --ui-accent-2: #ff7a2a; /* mecha orange */
  --ui-text: #ffffff;
  --ui-text-muted: #d8dde3;

  /* Override base palette used by styles.css */
  --bloomberg-black: #000000;
  --bloomberg-dark: #0e1217;
  --bloomberg-darker: #12171f;
  --bloomberg-border: #2b323b;
  --bloomberg-border-light: #3a434d;
  --bloomberg-orange: var(--ui-accent);
  --bloomberg-orange-light: var(--ui-accent-2);
  --bloomberg-blue: var(--ui-accent);
  --bloomberg-text: var(--ui-text);
  --bloomberg-text-secondary: #e0e0e0;
  --bloomberg-text-muted: var(--ui-text-muted);
}
[data-theme="glass"] .widget,
[data-theme="glass"] .news-feed,
[data-theme="glass"] .crypto-list,
[data-theme="glass"] .market-overview,
[data-theme="glass"] .terminal-header,
[data-theme="glass"] .terminal-footer {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255,255,255,0.08);
}
[data-theme="glass"] .chat-overlay {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Glass overlays and refined surfaces */
[data-theme="glass"] body::before {
  content: none;
}

[data-theme="glass"] .widget,
[data-theme="glass"] .news-feed,
[data-theme="glass"] .crypto-list,
[data-theme="glass"] .market-overview,
[data-theme="glass"] .terminal-header,
[data-theme="glass"] .terminal-footer,
[data-theme="glass"] .chat-overlay,
[data-theme="glass"] .chat-body,
[data-theme="glass"] .chat-input {
  background: var(--ui-panel-bg);
  border: 1px solid var(--ui-panel-border);
  box-shadow: 0 12px 28px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.08);
}

[data-theme="glass"] .widget,
[data-theme="glass"] .news-feed,
[data-theme="glass"] .crypto-list,
[data-theme="glass"] .market-overview {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
}

[data-theme="glass"] .widget::before,
[data-theme="glass"] .news-feed::before,
[data-theme="glass"] .crypto-list::before,
[data-theme="glass"] .market-overview::before {
  content: none;
}

[data-theme="glass"] .widget::after,
[data-theme="glass"] .news-feed::after,
[data-theme="glass"] .crypto-list::after,
[data-theme="glass"] .market-overview::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 18px rgba(0,0,0,0.18);
  background:
    radial-gradient(circle at 14px 14px, rgba(255,255,255,0.25) 0%, rgba(80,80,80,0.8) 40%, rgba(0,0,0,0) 60%),
    radial-gradient(circle at calc(100% - 14px) 14px, rgba(255,255,255,0.25) 0%, rgba(80,80,80,0.8) 40%, rgba(0,0,0,0) 60%),
    radial-gradient(circle at 14px calc(100% - 14px), rgba(255,255,255,0.25) 0%, rgba(80,80,80,0.8) 40%, rgba(0,0,0,0) 60%),
    radial-gradient(circle at calc(100% - 14px) calc(100% - 14px), rgba(255,255,255,0.25) 0%, rgba(80,80,80,0.8) 40%, rgba(0,0,0,0) 60%);
}

[data-theme="glass"] .terminal-header {
  border-bottom: 1px solid var(--ui-panel-border);
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  background: linear-gradient(180deg, #171d25, #131922);
}
[data-theme="glass"] .terminal-footer {
  border-top: 1px solid var(--ui-panel-border);
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background: linear-gradient(180deg, #131922, #0f141b);
}

[data-theme="glass"] .bookmark-btn,
[data-theme="glass"] .mode-switch-btn,
[data-theme="glass"] .chat-toggle,
[data-theme="glass"] .chat-send,
[data-theme="glass"] .theme-selector {
  background: linear-gradient(180deg, #1a212a, #12171f);
  border: 1px solid #3a434d;
  color: rgba(255,255,255,0.96);
  box-shadow: 0 8px 18px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.12);
}
[data-theme="glass"] .bookmark-btn:hover,
[data-theme="glass"] .mode-switch-btn:hover,
[data-theme="glass"] .chat-toggle:hover,
[data-theme="glass"] .chat-send:hover,
[data-theme="glass"] .theme-selector:hover {
  box-shadow: 0 12px 26px rgba(0,0,0,0.55);
  border-color: var(--ui-accent);
}

[data-theme="glass"] .chat-overlay {
  border: 1px solid var(--ui-panel-border);
  border-radius: 12px;
}
[data-theme="glass"] .chat-input {
  border: 1px solid rgba(255,255,255,0.30);
  border-radius: 10px;
}

[data-theme="glass"] input,
[data-theme="glass"] select,
[data-theme="glass"] textarea {
  background: linear-gradient(180deg, #171d25, #12171f);
  border: 1px solid var(--ui-panel-border);
  color: #e8ecf3;
}
[data-theme="glass"] input::placeholder,
[data-theme="glass"] textarea::placeholder {
  color: rgba(255,255,255,0.72);
}

/* ========== Liquid Glass ==========
   Glossy liquid-like panels with inner highlights and soft borders */
[data-theme="liquid"] {
  /* Theme-scoped UI variables */
  --ui-bg: linear-gradient(160deg, #050505 0%, #0b0b0b 50%, #000 100%);
  --ui-panel-bg: rgba(24,24,24,0.86);
  --ui-panel-border: rgba(255,255,255,0.16);
  --ui-accent: #ff6600;
  --ui-accent-2: #ff8833;
  --ui-text: #ffffff;

  /* Override base palette used by styles.css */
  --bloomberg-black: #000000;
  --bloomberg-dark: var(--ui-panel-bg);
  --bloomberg-darker: rgba(32,32,32,0.92);
  --bloomberg-border: var(--ui-panel-border);
  --bloomberg-border-light: rgba(255,255,255,0.22);
  --bloomberg-orange: var(--ui-accent);
  --bloomberg-orange-light: var(--ui-accent-2);
  --bloomberg-text: var(--ui-text);
  --bloomberg-text-secondary: #f0f0f0;
  --bloomberg-text-muted: #c9c9c9;
}
[data-theme="liquid"] .widget,
[data-theme="liquid"] .news-feed,
[data-theme="liquid"] .crypto-list,
[data-theme="liquid"] .market-overview {
  backdrop-filter: blur(6px);
  box-shadow: 0 6px 24px rgba(255, 136, 51, 0.15), inset 0 1px 0 rgba(255,255,255,0.06);
  border-radius: 10px;
}
[data-theme="liquid"] .terminal-header,
[data-theme="liquid"] .terminal-footer {
  box-shadow: 0 8px 24px rgba(255, 102, 0, 0.12), inset 0 1px 0 rgba(255,255,255,0.07);
}
[data-theme="liquid"] .bookmark-btn,
[data-theme="liquid"] .mode-switch-btn {
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02));
  border: 1px solid rgba(255,255,255,0.16);
}

/* ========== Pixelate Green Pro ==========
   Retro professional terminal with pixel-grid accents and neon green */
[data-theme="pixel-green"] {
  /* Theme-scoped UI variables */
  --ui-bg: #000000;
  --ui-panel-bg: #001100;
  --ui-panel-border: #00aa55;
  --ui-accent: #00ff88;
  --ui-accent-2: #66ffcc;
  --ui-text: #ccffdd;
  --ui-text-muted: #99ddbb;

  /* Override base palette used by styles.css */
  --bloomberg-black: #000000;
  --bloomberg-dark: var(--ui-panel-bg);
  --bloomberg-darker: #002200;
  --bloomberg-border: var(--ui-panel-border);
  --bloomberg-border-light: #00bb66;
  --bloomberg-orange: var(--ui-accent); /* swap accent to neon green */
  --bloomberg-orange-light: var(--ui-accent-2);
  --bloomberg-blue: #33ccff;
  --bloomberg-green: var(--ui-accent);
  --bloomberg-text: var(--ui-text);
  --bloomberg-text-secondary: #aee5c8;
  --bloomberg-text-muted: var(--ui-text-muted);
}
[data-theme="pixel-green"] .terminal-header h1,
[data-theme="pixel-green"] .widget-title,
[data-theme="pixel-green"] .bookmark-label,
[data-theme="pixel-green"] .status-item span {
  letter-spacing: 0.5px;
  text-shadow: 0 0 6px rgba(0,255,136,0.35);
}
[data-theme="pixel-green"] .widget,
[data-theme="pixel-green"] .news-feed,
[data-theme="pixel-green"] .crypto-list,
[data-theme="pixel-green"] .market-overview {
  border-image: linear-gradient(90deg, #007744, #00ff88) 1;
  box-shadow: 0 0 0 1px rgba(0,255,136,0.25) inset,
              0 10px 30px rgba(0,255,136,0.12);
}
[data-theme="pixel-green"] .chat-overlay {
  backdrop-filter: none;
  border: 1px solid rgba(0,255,136,0.25);
}

/* Utility: Accent color hooks */
.mode-switch-btn:hover,
.bookmark-btn:hover,
.filter-tag.active,
.refresh-btn:hover {
  border-color: var(--ui-accent);
  color: var(--ui-text);
}
[data-theme="glass"] {
  /* Mecha palette accents */
  --bloomberg-blue: #2f6fed; /* cobalt */
  --bloomberg-orange: #ff7a2a; /* slightly brighter mech orange */
}

/* Mecha readability overrides for News area */
[data-theme="glass"] #news-content,
[data-theme="glass"] .news-main-container,
[data-theme="glass"] .expanded-news-content {
  background: #12171f !important;
}
[data-theme="glass"] .news-item,
[data-theme="glass"] .news-card,
[data-theme="glass"] .expanded-news-content > div {
  background: #131922 !important;
  border: 1px solid #2b323b !important;
  box-shadow: 0 8px 16px rgba(0,0,0,0.35) !important;
}
[data-theme="glass"] .news-item .title,
[data-theme="glass"] .news-card .title {
  color: #e8ecf3 !important;
}
[data-theme="glass"] .news-item .meta,
[data-theme="glass"] .news-card .meta,
[data-theme="glass"] .news-item .summary,
[data-theme="glass"] .news-card .summary {
  color: #c7ccd5 !important;
}
[data-theme="glass"] .search-bar input,
[data-theme="glass"] #newsSearchExpanded {
  background: #0f141b !important;
  border: 1px solid #2b323b !important;
  color: #e8ecf3 !important;
}
[data-theme="glass"] .filter-tag.active {
  background: #2f6fed !important;
  border-color: #2f6fed !important;
  color: #ffffff !important;
}
[data-theme="glass"] .widget,
[data-theme="glass"] .news-feed,
[data-theme="glass"] .crypto-list,
[data-theme="glass"] .market-overview,
[data-theme="glass"] .terminal-header,
[data-theme="glass"] .terminal-footer,
[data-theme="glass"] .chat-overlay {
  color: #ffffff;
  text-shadow: 0 1px 1px rgba(0,0,0,0.35);
}

/* Strengthen readability of muted labels and data values */
[data-theme="glass"] .stat-label,
[data-theme="glass"] .meter-label,
[data-theme="glass"] .widget-title,
[data-theme="glass"] .bookmark-label,
[data-theme="glass"] .status-item span,
[data-theme="glass"] .news-header h2 {
  color: rgba(255,255,255,0.96);
}

/* ========== Light Mode ==========
   Clean professional light UI with cobalt accents */
[data-theme="light"] {
  /* Theme-scoped UI variables */
  --ui-bg: linear-gradient(180deg, #f6f8fb 0%, #eef1f5 60%, #f6f8fb 100%);
  --ui-panel-bg: #ffffff;
  --ui-panel-border: #d5d9e0;
  --ui-accent: #2f6fed; /* cobalt */
  --ui-accent-2: #ff7a2a; /* orange */
  --ui-text: #0b1320;
  --ui-text-muted: #62708a;

  /* Override base palette used by styles.css */
  --bloomberg-black: #0b1320;
  --bloomberg-dark: #f7f9fc;
  --bloomberg-darker: #eef2f7;
  --bloomberg-border: #d5d9e0;
  --bloomberg-border-light: #e5e9ef;
  --bloomberg-orange: var(--ui-accent-2);
  --bloomberg-orange-light: #ff8f4a;
  --bloomberg-blue: var(--ui-accent);
  --bloomberg-text: var(--ui-text);
  --bloomberg-text-secondary: #1f2a3a;
  --bloomberg-text-muted: var(--ui-text-muted);
}
[data-theme="light"] .widget,
[data-theme="light"] .news-feed,
[data-theme="light"] .crypto-list,
[data-theme="light"] .market-overview,
[data-theme="light"] .terminal-header,
[data-theme="light"] .terminal-footer,
[data-theme="light"] .chat-overlay,
[data-theme="light"] .chat-body,
[data-theme="light"] .chat-input {
  background: var(--ui-panel-bg);
  border: 1px solid var(--ui-panel-border);
  box-shadow: 0 6px 20px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.9);
}
[data-theme="light"] .terminal-header {
  border-bottom: 1px solid var(--ui-panel-border);
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  background: linear-gradient(180deg, #ffffff, #f3f6fb);
}
[data-theme="light"] .terminal-footer {
  border-top: 1px solid var(--ui-panel-border);
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background: linear-gradient(180deg, #f3f6fb, #eef2f7);
}
[data-theme="light"] .bookmark-btn,
[data-theme="light"] .mode-switch-btn,
[data-theme="light"] .chat-toggle,
[data-theme="light"] .chat-send,
[data-theme="light"] .theme-selector {
  background: linear-gradient(180deg, #ffffff, #f5f7fb);
  border: 1px solid #cbd2dc;
  color: #0b1320;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
[data-theme="light"] .bookmark-btn:hover,
[data-theme="light"] .mode-switch-btn:hover,
[data-theme="light"] .chat-toggle:hover,
[data-theme="light"] .chat-send:hover,
[data-theme="light"] .theme-selector:hover {
  border-color: var(--ui-accent);
  box-shadow: 0 3px 10px rgba(0,0,0,0.12);
}
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea {
  background: #ffffff;
  border: 1px solid #c9d0da;
  color: #0b1320;
}
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder {
  color: #7b8798;
}
[data-theme="light"] .stat-label,
[data-theme="light"] .meter-label,
[data-theme="light"] .widget-title,
[data-theme="light"] .bookmark-label,
[data-theme="light"] .status-item span,
[data-theme="light"] .news-header h2 {
  color: #0b1320;
}