/* styles.css */
:root {
  --bg-dark: #0a0f0d;
  --bg-sidebar: #0d1512;
  --bg-card: rgba(20, 31, 26, 0.8);
  --bg-card-solid: #141f1a;
  --accent: #9ef01a;
  --accent-hover: #8bd815;
  --text-main: #c8d6cf;
  --text-muted: #6b8a78;
  --text-heading: #e8f5ec;
  --border-color: #1e3329;
  --bg-input: #162420;
  --bg-modal: #101a15;
  --bg-hover: rgba(158, 240, 26, 0.03);
  --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.3);
  --skeleton-from: #141f1a;
  --skeleton-mid: #1e3329;
  --color-scheme: dark;

  /* Shared variables */
  --transition-speed: 0.3s;
  --bg-button-secondary: #1f2937;
  /* Gray 800 */
  --bg-button-hover: #374151;
  /* Gray 700 */
}

/* Light Theme */
[data-theme="light"] {
  --bg-dark: #f8fafc;
  /* Lighter slate */
  --bg-sidebar: #ffffff;
  --bg-card: #ffffff;
  --bg-card-solid: #ffffff;
  --accent: #22c55e;
  /* Green 500 - more standard vibrant green */
  --accent-hover: #16a34a;
  /* Green 600 */
  --text-main: #1e293b;
  /* Slate 800 */
  --text-muted: #64748b;
  --text-heading: #0f172a;
  --border-color: #f1f5f9;
  /* Even lighter slate */
  --bg-input: #f1f5f9;
  --bg-modal: #ffffff;
  --bg-hover: rgba(16, 185, 129, 0.05);
  --shadow-card: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --skeleton-from: #f1f5f9;
  --skeleton-mid: #e2e8f0;
  --color-scheme: light;

  --bg-button-secondary: #e2e8f0;
  /* Light gray */
  --bg-button-hover: #cbd5e1;
  /* Darker light gray */
}

body {
  font-family: "Inter", sans-serif;
  background-color: var(--bg-dark);
  color: var(--text-main);
  margin: 0;
  display: flex;
  min-height: 100vh;
}

/* Sidebar Styling */
.sidebar {
  width: 260px;
  background-color: var(--bg-sidebar);
  border-right: 1px solid var(--border-color);
  display: flex;
  flex-direction: column;
  position: fixed;
  height: 100vh;
  z-index: 50;
  transition: transform 0.3s ease-in-out;
}

.sidebar-header {
  padding: 1.5rem;
  border-bottom: 1px solid var(--border-color);
  display: flex;
  align-items: center;
}

.branding {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-heading);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.nav-links {
  flex: 1;
  padding: 1.5rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.nav-item {
  display: flex;
  align-items: center;
  padding: 0.75rem 1rem;
  color: var(--text-muted);
  text-decoration: none;
  border-radius: 0.5rem;
  transition: all 0.2s;
  font-weight: 500;
}

.nav-item:hover,
.nav-item.active {
  background-color: rgba(158, 240, 26, 0.1);
  color: var(--accent);
}

.nav-item i {
  width: 24px;
  margin-right: 0.75rem;
}

/* Main Content Area */
.main-content {
  flex: 1;
  margin-left: 260px;
  /* Width of sidebar */
  padding: 2rem;
  overflow-y: auto;
}

/* Utilities */
.bg-accent {
  background-color: var(--accent);
}

.text-accent {
  color: var(--accent);
}

.border-accent {
  border-color: var(--accent);
}

.card {
  background-color: var(--bg-card);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(158, 240, 26, 0.1);
  border-color: rgba(158, 240, 26, 0.25);
}

/* Table Enhancements (Nansen-like) */
.table-container {
  overflow-x: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th {
  text-align: left;
  padding: 1rem;
  font-weight: 600;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border-color);
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

td {
  padding: 1rem;
  border-bottom: 1px solid var(--border-color);
  color: var(--text-main);
  font-size: 0.95rem;
}

tr:hover td {
  background-color: var(--bg-hover);
}

/* AI Chat Modal Adjustments */
#ai-chat-modal .card {
  background-color: var(--bg-card);
  border: 1px solid var(--border-color);
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
  .sidebar {
    transform: translateX(-100%);
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .main-content {
    margin-left: 0;
    padding: 1rem;
  }
}

/* Animations */
.fade-in {
  animation: fadeIn 0.5s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.loading-spinner {
  border: 2px solid rgba(255, 255, 255, 0);
  border-radius: 50%;
  border-top: 2px solid var(--accent);
  width: 24px;
  height: 24px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.glow-hover:hover {
  box-shadow: 0 0 15px rgba(158, 240, 26, 0.5);
}

/* Price Rolling Animation */
@keyframes priceTickUp {
  0% {
    transform: translateY(40%);
    opacity: 0;
    color: var(--accent);
  }

  50% {
    color: var(--accent);
  }

  100% {
    transform: translateY(0);
    opacity: 1;
    color: inherit;
  }
}

@keyframes priceTickDown {
  0% {
    transform: translateY(-40%);
    opacity: 0;
    color: #ef4444;
  }

  50% {
    color: #ef4444;
  }

  100% {
    transform: translateY(0);
    opacity: 1;
    color: inherit;
  }
}

.price-tick-up {
  animation: priceTickUp 0.45s ease-out;
}

.price-tick-down {
  animation: priceTickDown 0.45s ease-out;
}

@keyframes pulseUp {
  0% {
    background-color: transparent;
  }

  20% {
    background-color: rgba(158, 240, 26, 0.2);
  }

  100% {
    background-color: transparent;
  }
}

@keyframes pulseDown {
  0% {
    background-color: transparent;
  }

  20% {
    background-color: rgba(239, 68, 68, 0.2);
  }

  100% {
    background-color: transparent;
  }
}

.price-pulse-up {
  animation: pulseUp 1.5s ease-out;
}

.price-pulse-down {
  animation: pulseDown 1.5s ease-out;
}

/* Coin logo in table */
.coin-logo {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  background-color: var(--bg-input);
}

.coin-logo-fallback {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.7rem;
  color: var(--text-heading);
  background: linear-gradient(135deg, var(--accent), #22c55e);
}

/* Skeleton Loading */
.skeleton {
  background: linear-gradient(90deg, var(--skeleton-from) 25%, var(--skeleton-mid) 50%, var(--skeleton-from) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 4px;
  color: transparent !important;
  cursor: default;
  user-select: none;
}

.skeleton-text {
  height: 1em;
  margin-bottom: 0.5em;
  width: 100%;
}

.skeleton-card {
  height: 200px;
}

@keyframes shimmer {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -200% 0;
  }
}

/* ============================================
   ChatGPT-Inspired AI Chat Styles
   ============================================ */

/* Chat Modal Sizing */
#ai-chat-modal .chat-modal-inner {
  width: 100%;
  max-width: 40rem;
  height: 85vh;
  max-height: 700px;
  display: flex;
  flex-direction: column;
  background-color: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

/* Chat Header */
.chat-header {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border-color);
  background: var(--bg-card);
  backdrop-filter: blur(8px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
}

.chat-header-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.chat-header-left .status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 6px var(--accent);
}

/* Settings Panel (collapsible) */
.chat-settings-panel {
  border-bottom: 1px solid var(--border-color);
  background: var(--bg-hover);
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.3s ease, padding 0.3s ease;
  padding: 0 1rem;
}

.chat-settings-panel.open {
  max-height: 200px;
  padding: 0.75rem 1rem;
}

/* Chat Body */
.chat-body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 0;
  scroll-behavior: smooth;
}

.chat-body::-webkit-scrollbar {
  width: 6px;
}

.chat-body::-webkit-scrollbar-track {
  background: transparent;
}

.chat-body::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.2);
  border-radius: 3px;
}

.chat-body::-webkit-scrollbar-thumb:hover {
  background: rgba(148, 163, 184, 0.4);
}

/* Message Row */
.chat-msg {
  display: flex;
  gap: 0.75rem;
  padding: 0.75rem 1.25rem;
  animation: msgFadeIn 0.3s ease-out;
}

.chat-msg.user {
  flex-direction: row-reverse;
}

.chat-msg.user .chat-msg-content {
  align-items: flex-end;
}

@keyframes msgFadeIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Avatar */
.chat-avatar {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  flex-shrink: 0;
  margin-top: 2px;
}

.chat-msg.assistant .chat-avatar {
  background: linear-gradient(135deg, var(--accent), #70c700);
  color: #1a1a2e;
}

.chat-msg.user .chat-avatar {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  color: white;
}

/* Message Content */
.chat-msg-content {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  max-width: 85%;
  min-width: 0;
}

/* Message Bubble */
.chat-bubble {
  padding: 0.75rem 1rem;
  border-radius: 12px;
  font-size: 0.9rem;
  line-height: 1.6;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.chat-msg.assistant .chat-bubble {
  background: var(--bg-hover);
  color: var(--text-main);
  border: 1px solid rgba(16, 185, 129, 0.1);
  /* Very subtle emerald border */
  border-top-left-radius: 4px;
}

.chat-msg.user .chat-bubble {
  background: linear-gradient(135deg, #6366f1, #7c3aed);
  color: white;
  border-top-right-radius: 4px;
}

/* Markdown inside chat bubbles */
.chat-bubble p {
  margin: 0 0 0.5em;
}

.chat-bubble p:last-child {
  margin-bottom: 0;
}

.chat-bubble strong {
  color: var(--accent);
  font-weight: 600;
}

.chat-bubble code {
  background: rgba(0, 0, 0, 0.3);
  padding: 0.15em 0.4em;
  border-radius: 4px;
  font-size: 0.85em;
  font-family: 'JetBrains Mono', 'Fira Code', monospace;
}

.chat-bubble pre {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  padding: 0.75rem;
  overflow-x: auto;
  margin: 0.5em 0;
}

.chat-bubble pre code {
  background: none;
  padding: 0;
  font-size: 0.82em;
}

.chat-bubble ul,
.chat-bubble ol {
  padding-left: 1.25em;
  margin: 0.4em 0;
}

.chat-bubble li {
  margin-bottom: 0.25em;
}

.chat-bubble blockquote {
  border-left: 3px solid var(--accent);
  padding-left: 0.75em;
  margin: 0.5em 0;
  color: var(--text-muted);
  font-style: italic;
}

.chat-bubble table {
  border-collapse: collapse;
  margin: 0.5em 0;
  font-size: 0.85em;
  width: 100%;
}

.chat-bubble th,
.chat-bubble td {
  border: 1px solid rgba(148, 163, 184, 0.2);
  padding: 0.4em 0.6em;
  text-align: left;
}

.chat-bubble th {
  background: rgba(0, 0, 0, 0.2);
  font-weight: 600;
  text-transform: none;
  letter-spacing: normal;
  font-size: inherit;
  color: var(--text-main);
}

.chat-bubble a {
  color: var(--accent);
  text-decoration: underline;
}

/* Timestamp */
.chat-timestamp {
  font-size: 0.65rem;
  color: rgba(148, 163, 184, 0.5);
  padding: 0 0.25rem;
}

/* Typing Indicator */
.typing-indicator {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0.75rem 1rem;
}

.typing-indicator span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent);
  opacity: 0.4;
  animation: typingBounce 1.4s infinite ease-in-out;
}

.typing-indicator span:nth-child(1) {
  animation-delay: 0s;
}

.typing-indicator span:nth-child(2) {
  animation-delay: 0.2s;
}

.typing-indicator span:nth-child(3) {
  animation-delay: 0.4s;
}

@keyframes typingBounce {

  0%,
  80%,
  100% {
    transform: scale(0.6);
    opacity: 0.3;
  }

  40% {
    transform: scale(1);
    opacity: 1;
  }
}

/* Tool Call Card */
.tool-card {
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid var(--border-color);
  border-radius: 10px;
  padding: 0.75rem;
  margin: 0.5em 0;
}

.tool-card-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  color: var(--accent);
  font-weight: 600;
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.tool-card-item {
  display: flex;
  gap: 0.5rem;
  padding: 0.4rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  font-size: 0.82rem;
}

.tool-card-item:last-child {
  border-bottom: none;
}

.tool-card-item a {
  color: var(--text-main);
  text-decoration: none;
  transition: color 0.2s;
}

.tool-card-item a:hover {
  color: var(--accent);
}

.tool-card-item .news-time {
  color: var(--text-muted);
  font-size: 0.7rem;
  white-space: nowrap;
}

/* Chat Input */
.chat-input-area {
  padding: 0.75rem 1rem;
  border-top: 1px solid var(--border-color);
  background: var(--bg-card);
  flex-shrink: 0;
}

.chat-input-wrapper {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  background: var(--bg-input);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 0.25rem 0.5rem;
  transition: border-color 0.2s;
}

.chat-input-wrapper:focus-within {
  border-color: var(--accent);
}

.chat-input-wrapper input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: var(--text-main);
  padding: 0.6rem 0.5rem;
  font-size: 0.9rem;
}

.chat-input-wrapper input::placeholder {
  color: var(--text-muted);
}

.chat-send-btn {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  border: none;
  background: var(--accent);
  color: #1a1a2e;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  flex-shrink: 0;
}

.chat-send-btn:hover:not(:disabled) {
  transform: scale(1.05);
  box-shadow: 0 0 12px rgba(158, 240, 26, 0.4);
}

.chat-send-btn:disabled {
  background: rgba(148, 163, 184, 0.2);
  color: var(--text-muted);
  cursor: not-allowed;
}

/* Chat Stats Bar */
.chat-stats-bar {
  padding: 0.35rem 1rem;
  font-size: 0.7rem;
  color: var(--text-muted);
  background: rgba(0, 0, 0, 0.15);
  border-top: 1px solid rgba(255, 255, 255, 0.03);
  text-align: center;
  flex-shrink: 0;
}

/* ===============================
   News Cards — Enhanced
   =============================== */
.news-card-enhanced {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.news-card-enhanced:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
  border-color: rgba(158, 240, 26, 0.15);
}

.news-card-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

.news-card-img {
  height: 160px;
  background-size: cover;
  background-position: center;
  position: relative;
}

.news-card-img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(38, 50, 56, 0.95) 0%, transparent 60%);
}

.news-card-img-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.02);
}

.news-card-badges {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  z-index: 2;
}

.news-badge {
  font-size: 0.6rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(6px);
  color: var(--accent);
  border: 1px solid rgba(158, 240, 26, 0.15);
}

.news-card-body {
  padding: 1rem 1.1rem 1.1rem;
}

.news-card-title {
  font-size: 0.88rem;
  font-weight: 600;
  color: #f1f5f9;
  line-height: 1.4;
  margin: 0 0 0.4rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.2s;
}

.news-card-enhanced:hover .news-card-title {
  color: var(--accent);
}

.news-card-excerpt {
  font-size: 0.75rem;
  color: var(--text-muted);
  line-height: 1.5;
  margin: 0 0 0.75rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.news-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.68rem;
  color: #64748b;
}

.news-source-badge,
.news-time-badge {
  display: flex;
  align-items: center;
  gap: 4px;
}

.news-source-badge {
  font-weight: 500;
  color: #94a3b8;
}

/* Dashboard card and news refinements */
.metric-icon {
  width: 2.35rem;
  height: 2.35rem;
  display: grid;
  place-items: center;
  border-radius: .75rem;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.055);
  box-shadow: inset 0 1px rgba(255,255,255,.035);
}
.metric-icon i { font-size: 1rem; }
.metric-icon-value { color: var(--acid); }
.metric-icon-assets { color: #6cabff; }
.metric-icon-trend { color: #49d98a; }
.metric-icon-pnl { color: #f0c65a; }
.menu-toggle svg { width: 1.4rem; height: 1.4rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.8; }
.ai-fab-icon { width: 1.35rem; height: 1.35rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }

[data-theme="dark"] .news-card-enhanced {
  background: linear-gradient(145deg, rgba(20,25,20,.98), rgba(8,10,8,.98));
  border-color: var(--line-soft);
  border-radius: 12px;
}
[data-theme="dark"] .news-card-enhanced:hover { border-color: rgba(183,248,51,.32); box-shadow: 0 14px 34px rgba(0,0,0,.32); }
.news-card-img { height: 138px; }
.news-card-img-overlay { background: linear-gradient(to top, rgba(5,7,5,.8), transparent 68%); }
.news-card-body { padding: .9rem 1rem 1rem; }
.news-card-title { font-family: 'Manrope', system-ui, sans-serif; font-size: .92rem; font-weight: 750; letter-spacing: -.025em; }
.news-card-excerpt { font-family: 'Manrope', system-ui, sans-serif; font-size: .74rem; line-height: 1.45; }
.news-card-footer { padding-top: .1rem; font-family: 'DM Mono', ui-monospace, monospace; }

@media (max-width: 640px) {
  .metric-icon { width: 2.1rem; height: 2.1rem; border-radius: .65rem; }
  .news-card-img { height: 132px; }
}

/* ===============================
   Theme Toggle Button
   =============================== */
.theme-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 1rem;
  border-radius: 0.5rem;
  border: 1px solid var(--border-color);
  background: var(--bg-hover);
  color: var(--text-muted);
  cursor: pointer;
  font-size: 0.85rem;
  font-weight: 500;
  transition: all 0.25s;
  width: 100%;
}

.theme-toggle:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: rgba(158, 240, 26, 0.06);
}

.theme-toggle i {
  width: 20px;
  text-align: center;
  font-size: 1rem;
  transition: transform 0.3s;
}

.theme-toggle:hover i {
  transform: rotate(30deg);
}

/* ===============================
   Light Theme Component Overrides
   =============================== */
[data-theme="light"] body {
  color-scheme: light;
}

[data-theme="light"] .branding {
  color: var(--text-heading);
}

[data-theme="light"] td {
  border-bottom-color: var(--border-color);
}

[data-theme="light"] tr:hover td {
  background-color: var(--bg-hover);
}

[data-theme="light"] .card:hover {
  border-color: rgba(22, 163, 74, 0.3);
}

[data-theme="light"] .glow-hover:hover {
  box-shadow: 0 0 15px rgba(22, 163, 74, 0.25);
}

[data-theme="light"] .nav-item:hover,
[data-theme="light"] .nav-item.active {
  background-color: rgba(22, 163, 74, 0.08);
}

/* Light mode: override Tailwind dark-oriented utility classes */
[data-theme="light"] .bg-gray-800 {
  background-color: #ffffff !important;
}

[data-theme="light"] .bg-gray-700 {
  background-color: var(--bg-input) !important;
}

[data-theme="light"] .bg-gray-700\/50 {
  background-color: rgba(22, 163, 74, 0.08) !important;
}

[data-theme="light"] .bg-gray-600 {
  background-color: var(--bg-input) !important;
}

[data-theme="light"] .bg-gray-900 {
  background-color: #f8fafc !important;
}

[data-theme="light"] .bg-gray-900\/50,
[data-theme="light"] .bg-gray-800\/50 {
  background-color: rgba(248, 250, 252, 0.9) !important;
}

[data-theme="light"] .border-gray-700,
[data-theme="light"] .border-gray-600,
[data-theme="light"] .border-gray-800 {
  border-color: var(--border-color) !important;
}

[data-theme="light"] .text-white {
  color: var(--text-heading) !important;
}

[data-theme="light"] .text-gray-400,
[data-theme="light"] .text-gray-500 {
  color: var(--text-muted) !important;
}

[data-theme="light"] .text-gray-300 {
  color: var(--text-main) !important;
}

[data-theme="light"] .text-gray-600 {
  color: #94a3b8 !important;
}

/* Light mode: Chat UI */
[data-theme="light"] .chat-modal-inner {
  background: var(--bg-modal) !important;
  border-color: var(--border-color) !important;
}

[data-theme="light"] .chat-header {
  background: linear-gradient(135deg, #f1f5f9, #e2e8f0) !important;
  border-color: var(--border-color) !important;
}

[data-theme="light"] .chat-body {
  background: #f8fafc !important;
}

[data-theme="light"] .chat-input-area {
  background: var(--bg-modal) !important;
  border-color: var(--border-color) !important;
}

[data-theme="light"] .chat-input-wrapper input {
  background: var(--bg-input) !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

[data-theme="light"] .chat-msg.assistant .chat-bubble {
  background: #ffffff !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

[data-theme="light"] .chat-msg.user .chat-bubble {
  background: var(--accent) !important;
  color: #ffffff !important;
}

/* Light mode: News cards */
[data-theme="light"] .news-card-enhanced {
  background: #ffffff;
  border-color: var(--border-color);
  box-shadow: var(--shadow-card);
}

[data-theme="light"] .news-card-enhanced:hover {
  border-color: rgba(22, 163, 74, 0.25);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .news-card-title {
  color: var(--text-heading);
}

[data-theme="light"] .news-card-enhanced:hover .news-card-title {
  color: var(--accent);
}

[data-theme="light"] .news-badge {
  background: rgba(22, 163, 74, 0.1);
  color: var(--accent);
  border-color: rgba(22, 163, 74, 0.2);
}

[data-theme="light"] .news-card-img-overlay {
  background: linear-gradient(to top, rgba(255, 255, 255, 0.95) 0%, transparent 60%);
}

/* Light mode: Settings modal */
[data-theme="light"] #settings-modal .card {
  background-color: var(--bg-modal) !important;
  border-color: var(--border-color) !important;
}

[data-theme="light"] #settings-modal select,
[data-theme="light"] #settings-modal input {
  background-color: var(--bg-input) !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

/* Light mode: accent button */
[data-theme="light"] .bg-accent {
  background-color: var(--accent) !important;
}

[data-theme="light"] .text-accent {
  color: var(--accent) !important;
}

/* Light mode: footer */
[data-theme="light"] .border-gray-800\/50 {
  border-color: var(--border-color) !important;
}

/* Light mode: mobile header */
[data-theme="light"] .bg-\[\#263238\] {
  background-color: var(--bg-dark) !important;
}

/* Smooth transition */
body,
.sidebar,
.main-content,
.card,
.nav-item,
.chat-modal-inner,
.news-card-enhanced {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* Fix for dropdowns in dark mode */
.input-adaptive {
    background-color: var(--bg-input);
    color: var(--text-main);
    border: 1px solid var(--border-color);
}

/* Original graphite/lime command-center treatment. */
:root { --panel-ink: #080a08; --panel-raised: #101410; --line-soft: rgba(232,255,190,.10); --acid: #b7f833; }
body { font-family:'Manrope',system-ui,sans-serif; background: var(--bg-dark); letter-spacing: -.018em; }
[data-theme="dark"] body { background: radial-gradient(circle at 82% 8%, rgba(183,248,51,.10), transparent 28%), #080a08; }
[data-theme="light"] body { background: var(--bg-dark); }
.text-xs,.text-sm,.eyebrow,.bot-status,.bot-output,th,.chat-timestamp { font-family:'DM Mono',ui-monospace,monospace; letter-spacing:-.03em; }
h1,h2,h3,.text-2xl,.text-xl { font-family:'Manrope',system-ui,sans-serif; font-weight:800; letter-spacing:-.045em; }
h1 { font-size: 1.75rem; }
h2 { font-size: 1.25rem; }
h3 { font-size: 1.1rem; }
.section-heading { font-family:'Manrope',system-ui,sans-serif; font-weight:800; letter-spacing:-.04em; color: var(--text-heading); }
#portfolio-value,#change-value,#total-holdings,#best-performer,.font-bold { font-variant-numeric:tabular-nums; }
.chart-container canvas,#performanceChart,#predictionChart { filter:drop-shadow(0 0 9px rgba(183,248,51,.07)); }
[data-theme="dark"] .sidebar { background: #080a08; border-right: 1px solid var(--line-soft); }
[data-theme="light"] .sidebar { background: var(--bg-sidebar); border-right: 1px solid var(--border-color); }
[data-theme="dark"] .main-content { background-image: radial-gradient(rgba(183,248,51,.055) 1px, transparent 1px); background-size: 18px 18px; }
[data-theme="light"] .main-content { background-image: none; background-color: var(--bg-dark); }
[data-theme="dark"] .card { background: linear-gradient(145deg, rgba(19,24,19,.98), rgba(8,10,8,.98)); border: 1px solid var(--line-soft); border-radius: 14px; box-shadow: inset 0 1px rgba(255,255,255,.025); }
[data-theme="light"] .card { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 14px; box-shadow: var(--shadow-card); }
[data-theme="dark"] .card:hover { border-color: rgba(183,248,51,.24); }
[data-theme="light"] .card:hover { border-color: rgba(22, 163, 74, 0.3); box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
.nav-item.active { background: rgba(183,248,51,.10); color: #efffd3; border: 1px solid rgba(183,248,51,.18); border-radius: 9px; }
[data-theme="light"] .nav-item.active { background: rgba(22, 163, 74, 0.08); color: var(--accent); border-color: rgba(22, 163, 74, 0.2); }
.nav-item > i { width:1.25rem; text-align:center; color:#829277; transition:color .2s ease, transform .2s ease; }
.nav-item:hover > i,.nav-item.active > i { color:var(--acid); transform:translateX(2px); }
[data-theme="light"] .nav-item > i { color: var(--text-muted); }
[data-theme="light"] .nav-item:hover > i,[data-theme="light"] .nav-item.active > i { color: var(--accent); }
.wallet-connect,.bot-preview { display:inline-flex; align-items:center; gap:.55rem; border:1px solid rgba(183,248,51,.30); background:rgba(183,248,51,.08); color:#edffc8; border-radius:9px; padding:.55rem .8rem; font-weight:700; font-size:.8rem; height:2.5rem; box-sizing:border-box; vertical-align:middle; }
.wallet-connect:hover,.bot-preview:hover { background:var(--acid); color:#0b0e08; }
.wallet-connect.is-connected { border-color:var(--acid); color:var(--acid); }
[data-theme="light"] .wallet-connect,[data-theme="light"] .bot-preview { border-color: rgba(22,163,74,.35); background: rgba(22,163,74,.08); color: var(--accent); }
[data-theme="light"] .wallet-connect:hover,[data-theme="light"] .bot-preview:hover { background: var(--accent); color: #fff; }
[data-theme="light"] .wallet-connect.is-connected { border-color: var(--accent); color: var(--accent); }
.bot-console { padding:1.25rem; margin-top:1.5rem; background: radial-gradient(circle at 80% 0, rgba(183,248,51,.14), transparent 35%), linear-gradient(145deg,#151b10,#080a08); }
[data-theme="light"] .bot-console { background: radial-gradient(circle at 80% 0, rgba(22,163,74,.06), transparent 35%), #ffffff; }
.eyebrow { text-transform:uppercase; letter-spacing:.15em; font-size:.64rem; color:var(--acid); font-weight:800; margin-bottom:.25rem; }
.bot-status { border:1px solid rgba(183,248,51,.32); color:var(--acid); border-radius:999px; padding:.25rem .55rem; font-size:.68rem; font-weight:800; }
.bot-metrics { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:1rem; }.bot-metrics div { padding:.7rem; background:rgba(0,0,0,.22); border:1px solid var(--line-soft); border-radius:8px; }.bot-metrics span { display:block; color:#6f786d; font-size:.68rem; margin-bottom:.2rem; }.bot-metrics strong { font-size:.78rem; color:#f3f7ed; }.bot-output { color:#879084; font-size:.72rem; margin: .8rem 0 0; }
.wallet-profile { padding:1.25rem; margin-top:1.5rem; }.wallet-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }.wallet-grid div { border:1px solid var(--line-soft); background:rgba(0,0,0,.2); padding:.75rem; border-radius:8px; min-width:0; }.wallet-grid span { display:block; color:#6f786d; font: .66rem 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; margin-bottom:.35rem; }.wallet-grid strong { display:block; color:#edf5e8; font:.78rem 'DM Mono',monospace; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wallet-token-add { display:flex; gap:.6rem; margin-top:.9rem; }.wallet-token-add input { min-width:0; flex:1; padding:.55rem .65rem; border-radius:8px; font:.72rem 'DM Mono',monospace; }.wallet-token-list { display:grid; gap:.45rem; margin-top:.7rem; color:#899487; font:.72rem 'DM Mono',monospace; }.wallet-token-row { display:grid; grid-template-columns:.8fr 1fr 1fr; gap:.5rem; align-items:center; padding:.6rem .7rem; border:1px solid var(--line-soft); background:rgba(0,0,0,.18); border-radius:7px; }.wallet-token-row span { text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wallet-scan { width:100%; margin-top:.6rem; padding:.55rem; border:1px dashed rgba(183,248,51,.28); border-radius:8px; color:#b7f833; background:rgba(183,248,51,.045); font:.7rem 'DM Mono',monospace; }.wallet-scan:disabled { opacity:.55; }
@media (max-width: 640px) { .wallet-connect span { display:none; } .wallet-connect { padding:.6rem; } }

/* Quiet live-market motion: visual activity without competing with the data. */
.brand-orbit { animation: orbit-breathe 4.5s ease-in-out infinite; filter: drop-shadow(0 0 7px rgba(183,248,51,.32)); }
.card.fade-in { animation: terminal-rise .55s cubic-bezier(.2,.8,.2,1) both; }
.bot-console::after { content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; background:linear-gradient(110deg, transparent 28%, rgba(183,248,51,.08) 48%, transparent 67%); transform:translateX(-120%); animation: console-sweep 7s ease-in-out infinite; }
.bot-console { position:relative; overflow:hidden; }
.wallet-connect.is-connected::before { content:""; width:.42rem; height:.42rem; border-radius:50%; background:var(--acid); box-shadow:0 0 0 0 rgba(183,248,51,.6); animation: connection-pulse 2s infinite; }
@keyframes orbit-breathe { 0%,100% { transform:scale(1) rotate(0); } 50% { transform:scale(1.08) rotate(4deg); } }
@keyframes terminal-rise { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@keyframes console-sweep { 0%,62% { transform:translateX(-120%); } 83%,100% { transform:translateX(120%); } }
@keyframes connection-pulse { 0% { box-shadow:0 0 0 0 rgba(183,248,51,.5); } 70%,100% { box-shadow:0 0 0 7px rgba(183,248,51,0); } }
@media (prefers-reduced-motion: reduce) { .brand-orbit,.card.fade-in,.bot-console::after,.wallet-connect.is-connected::before { animation:none !important; } }

img.brand-orbit { display:block; flex:0 0 auto; width:2rem; height:2rem; object-fit:contain; padding:2px; border-radius:9px; background:radial-gradient(circle,rgba(183,248,51,.22),rgba(8,10,8,.9) 70%); border:1px solid rgba(183,248,51,.24); }
[data-theme="light"] img.brand-orbit { background:radial-gradient(circle,rgba(22,163,74,.12),rgba(255,255,255,.9) 70%); border-color:rgba(22,163,74,.25); filter: brightness(1.1) contrast(1.1); }
.download-progress { height:6px; overflow:hidden; margin-top:.5rem; border:1px solid rgba(183,248,51,.18); border-radius:999px; background:#070907; }
.download-progress-bar { width:0; height:100%; background:linear-gradient(90deg,#82b814,#b7f833,#e8ffae); box-shadow:0 0 10px rgba(183,248,51,.65); transition:width .2s ease; }
.download-progress.is-indeterminate .download-progress-bar { width:42%; animation:download-scan 1.25s ease-in-out infinite; }
@keyframes download-scan { from { transform:translateX(-120%); } to { transform:translateX(260%); } }
.chat-attach-btn { color:#8b9785; padding:.55rem; background:transparent; border:0; }.chat-attach-btn:not(:disabled):hover { color:var(--acid); }.chat-attach-btn:disabled { opacity:.35; cursor:not-allowed; }
@media (max-width:768px) { .branding .brand-orbit { width:2.15rem; height:2.15rem; padding:3px; } }

[data-theme="light"] .input-adaptive {
    background-color: var(--bg-input);
    color: var(--text-main);
    border: 1px solid var(--border-color);
}

/* Light mode: wallet & bot sections */
[data-theme="light"] .eyebrow { color: var(--accent); }
[data-theme="light"] .bot-status { border-color: rgba(22,163,74,.35); color: var(--accent); }
[data-theme="light"] .bot-metrics div { background: var(--bg-input); border-color: var(--border-color); }
[data-theme="light"] .bot-metrics span { color: var(--text-muted); }
[data-theme="light"] .bot-metrics strong { color: var(--text-heading); }
[data-theme="light"] .bot-output { color: var(--text-muted); }
[data-theme="light"] .wallet-grid div { border-color: var(--border-color); background: var(--bg-input); }
[data-theme="light"] .wallet-grid span { color: var(--text-muted); }
[data-theme="light"] .wallet-grid strong { color: var(--text-heading); }
[data-theme="light"] .wallet-scan { border-color: rgba(22,163,74,.3); color: var(--accent); background: rgba(22,163,74,.05); }
[data-theme="light"] .wallet-token-row { border-color: var(--border-color); background: var(--bg-input); color: var(--text-main); }
[data-theme="light"] #wallet-details-panel { border-color: var(--border-color) !important; background: var(--bg-input) !important; }
[data-theme="light"] #wallet-details-panel span { color: var(--text-muted) !important; }
[data-theme="light"] #wallet-details-panel strong { color: var(--text-heading) !important; }
[data-theme="light"] .text-heading { color: var(--text-heading); }
[data-theme="light"] .text-muted { color: var(--text-muted); }

/* Light mode: summary card text overrides */
[data-theme="light"] .card p.text-gray-400 { color: var(--text-muted) !important; }
[data-theme="light"] .card h3.text-white { color: var(--text-heading) !important; }
[data-theme="light"] .card .text-gray-500 { color: var(--text-muted) !important; }