/* TDB — Trading Dashboard styles */

/* AI panel collapse chevron rotation */
#aiMarketPanel .card-header[aria-expanded="true"] .bi-chevron-down {
  transform: rotate(0deg);
  transition: transform 0.2s;
}
#aiMarketPanel .card-header.collapsed .bi-chevron-down,
#aiMarketPanel .card-header[aria-expanded="false"] .bi-chevron-down {
  transform: rotate(-90deg);
  transition: transform 0.2s;
}

:root {
  --stat-bg: #1a1d23;
  --stat-border: #2a2d35;
}

[data-bs-theme="light"] {
  --stat-bg: #f8f9fa;
  --stat-border: #dee2e6;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-size: 0.9rem;
}

/* ── Strategy alert pulse ───────────────────────────────────── */
@keyframes alertPulse {
  0%   { background: rgba(255, 215, 64, .15); }
  100% { background: transparent; }
}
@keyframes retestGlow {
  0%, 100% { box-shadow: inset 0 0 0 1px rgba(255, 193, 7, .3); }
  50%      { box-shadow: inset 0 0 0 1px rgba(255, 193, 7, .7), 0 0 8px rgba(255, 193, 7, .15); }
}
.strat-alert-new {
  animation: alertPulse 2s ease-out;
}
.strat-alert-flip {
  border-left: 3px solid #448aff !important;
}
.strat-alert-stale {
  opacity: .5;
  border-left: 3px solid #6c757d !important;
}
.strat-alert-retest {
  border-left: 3px solid #ffc107 !important;
  background: rgba(255, 193, 7, .06) !important;
  animation: retestGlow 2s ease-in-out 3;
}

/* ── Traffic-light indicator ────────────────────────────────── */
.traffic-light {
  display: inline-flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 8px;
  background: #181a1f;
  border-radius: 24px;
  border: 2px solid #2a2d35;
}
[data-bs-theme="light"] .traffic-light {
  background: #e9ecef;
  border-color: #ced4da;
}
.traffic-light .light {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  transition: opacity .3s, box-shadow .3s;
  opacity: 0.12;
}
.traffic-light .light.green  { background: #00e676; }
.traffic-light .light.yellow { background: #ffd740; }
.traffic-light .light.red    { background: #ff5252; }

.traffic-light.signal-green  .light.green  { opacity: 1; box-shadow: 0 0 14px #00e676; }
.traffic-light.signal-yellow .light.yellow { opacity: 1; box-shadow: 0 0 14px #ffd740; }
.traffic-light.signal-red    .light.red    { opacity: 1; box-shadow: 0 0 14px #ff5252; }

/* ── Signal dot (inline indicator) ──────────────────────────── */
.signal-dot {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  flex-shrink: 0;
  background: #888;
  transition: background .3s, box-shadow .3s;
}
.signal-dot.signal-green  { background: #00e676; box-shadow: 0 0 8px #00e676; }
.signal-dot.signal-yellow { background: #ffd740; box-shadow: 0 0 8px #ffd740; }
.signal-dot.signal-red    { background: #ff5252; box-shadow: 0 0 8px #ff5252; }

/* ── Existing component styles ──────────────────────────────── */
.stat-card {
  background: var(--stat-bg);
  border: 1px solid var(--stat-border) !important;
}

.navbar {
  background: var(--stat-bg) !important;
}

.table th {
  font-weight: 600;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.table td {
  vertical-align: middle;
}

/* Compact badges */
.badge {
  font-weight: 500;
}

/* Card tweaks */
.card {
  background: var(--stat-bg);
  border: 1px solid var(--stat-border) !important;
}
.card-header {
  border-bottom-color: var(--stat-border) !important;
}

/* Green accents on dark */
[data-bs-theme="dark"] .text-success {
  color: #00e676 !important;
}
[data-bs-theme="dark"] .text-danger {
  color: #ff5252 !important;
}
[data-bs-theme="dark"] .btn-success {
  background-color: #00c853;
  border-color: #00c853;
}

/* Scrollable tables (only for generic use; symbol rankings overridden below) */
.table-responsive {
  max-height: 400px;
  overflow-y: auto;
}

/* Symbol Strength table: no scroll — show all rows */
#symbolStrengthCard .table-responsive {
  max-height: none;
  overflow-y: visible;
}

/* Smooth theme transition */
body, .card, .navbar, .stat-card, .table {
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* ── Navbar dropdown styling ────────────────────────────────── */
.dropdown-menu {
  background: var(--stat-bg);
  border-color: var(--stat-border);
}
.dropdown-item {
  font-size: 0.85rem;
}
[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
  background: rgba(255, 255, 255, 0.08);
}

/* ── Strategy toggle rows ───────────────────────────────────── */
tr[data-strategy] {
  transition: opacity 0.2s ease;
}
tr[data-strategy].opacity-50 {
  opacity: 0.45;
}

/* ── Form check inline spacing ──────────────────────────────── */
.form-check-inline {
  margin-right: 0.5rem;
}