/* ===== theme palettes ===== */
:root,
[data-bs-theme="dark"] {
  --sg-bg: #0e1420;
  --sg-panel: #161d2c;
  --sg-panel-2: #1d2738;
  --sg-border: #263248;
  --sg-text: #dfe6f2;
  --sg-nav-bg: #0b101a;
  --sg-hover: #28354c;
  --sg-up: #2ec27e;
  --sg-down: #ef5350;
  --sg-accent: #28b6d8;
  --sg-muted: #8a97ac;
}
[data-bs-theme="light"] {
  --sg-bg: #eef1f7;
  --sg-panel: #ffffff;
  --sg-panel-2: #f2f5fa;
  --sg-border: #dde3ee;
  --sg-text: #1c2533;
  --sg-nav-bg: #ffffff;
  --sg-hover: #e6eef9;
  --sg-up: #1a9d5f;
  --sg-down: #d8392f;
  --sg-accent: #1577c2;
  --sg-muted: #5d6b7e;
}

body { background: var(--sg-bg); color: var(--sg-text); }
.sg-nav { background: var(--sg-nav-bg); border-bottom: 1px solid var(--sg-border); }

.sg-card {
  background: var(--sg-panel);
  border: 1px solid var(--sg-border);
  border-radius: 12px;
}
.sg-card .sg-card-head {
  padding: .65rem 1rem; border-bottom: 1px solid var(--sg-border);
  font-weight: 600; font-size: .95rem;
}
.sg-card .sg-card-body { padding: 1rem; }

.text-up { color: var(--sg-up) !important; }
.text-down { color: var(--sg-down) !important; }
.text-muted2 { color: var(--sg-muted) !important; }

.sg-stat { background: var(--sg-panel-2); border-radius: 10px; padding: .85rem 1rem; }
.sg-stat .lbl { color: var(--sg-muted); font-size: .78rem; }
.sg-stat .val { font-size: 1.25rem; font-weight: 700; }

.sg-chip {
  display: inline-block; background: var(--sg-panel-2); color: var(--sg-text);
  border: 1px solid var(--sg-border); border-radius: 999px;
  padding: .12rem .6rem; font-size: .72rem; margin: .1rem;
}

/* dashboard signal cards */
.signal-card { transition: transform .12s ease, border-color .12s; cursor: pointer; }
.signal-card:hover { transform: translateY(-2px); border-color: var(--sg-accent); }
.growth-badge { font-size: 1.4rem; font-weight: 800; }

/* tabs */
.nav-tabs.sg-tabs { border-bottom: 1px solid var(--sg-border); flex-wrap: nowrap; overflow-x: auto; }
.nav-tabs.sg-tabs .nav-link {
  color: var(--sg-muted); border: none; white-space: nowrap;
  border-bottom: 2px solid transparent;
}
.nav-tabs.sg-tabs .nav-link.active {
  color: var(--sg-text); background: transparent; border-bottom: 2px solid var(--sg-accent);
}

/* tables */
.table.sg-table { color: var(--sg-text); font-size: .85rem; }
.table.sg-table thead th { color: var(--sg-muted); border-color: var(--sg-border); font-weight: 600; }
.table.sg-table td { border-color: var(--sg-border); }

.chart-box { width: 100%; height: 320px; }
.chart-box.tall { height: 420px; }
.radar-box { width: 100%; height: 300px; }

/* create-signal warning */
.warn-text { color: var(--sg-down); font-size: .85rem; }

/* type-ahead */
.broker-suggest {
  position: absolute; z-index: 30; width: 100%;
  background: var(--sg-panel-2); border: 1px solid var(--sg-border);
  border-radius: 8px; max-height: 280px; overflow-y: auto; margin-top: 2px;
}
.broker-suggest .item { padding: .45rem .75rem; cursor: pointer; font-size: .88rem; color: var(--sg-text); }
.broker-suggest .item:hover, .broker-suggest .item.active { background: var(--sg-hover); }
.broker-suggest .item small { color: var(--sg-muted); }
.broker-suggest .hint { padding: .45rem .75rem; color: var(--sg-accent); font-size: .82rem; border-bottom: 1px dashed var(--sg-border); }
