/* ---------- TEMA ---------- */
body.light-theme {
    background-color: #f8f9fa;
    color: #212529;
}
body.dark-theme {
    background-color: #0a0e11;
    color: #f1f1f1;
}
body.dark-theme a {
    color: #9ecbff;
}

/* ---------- SIDEBAR ---------- */
/* Sidebar: stato visibile */
.sidebar {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 1000;
    width: 200px;
    min-height: 110vh;
    background-color: black;
    transition: transform 0.3s ease;
    transform: translateX(0);
}
body {
    overflow-x: hidden;
}
/* Sidebar: stato nascosto */
.sidebar.slide-left {
    transform: translateX(-100%);
}

/* Contenuto principale che si espande */
.main-content {
    transition: margin-left 0.3s ease;
    margin-left: 200px;
}

/* Quando sidebar è chiusa, contenuto prende tutto lo spazio */
.main-content.full-width {
    margin-left: 0;
}

.sidebar-nav {
  background-color: #1f1f1f;
  padding: 1rem 0.8rem;
  border-radius: 0.4rem;
}
.sidebar-wrapper {
  background-color: #000;
  border-radius: 0 0 6px 6px;
  display: inline-block;
  padding: 0.6rem;
  height: auto;
  max-height: 150%;
}

.sidebar-link {
  display: flex;
  align-items: center;
  padding: 10px 14px;
  margin: 5px 0;
  font-size: 0.9rem;
  font-weight: 600;
  color: #e9ecef;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sidebar-link:hover {
  background-color: #343a40;
  color: #ffffff;
}

.sidebar-link.active {
  background-color: #0d6efd;
  color: #ffffff;
  border-left: 3px solid #ffffff;
  padding-left: 11px;
}

.sidebar h5 {
    color: white;
}

/* ---------- TOPBAR ---------- */
.topbar {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
body.dark-theme .topbar {
    border-color: rgba(255, 255, 255, 0.1);
}
.gmpb-hidden {
  display: none !important;
}

/* ---------- NAV SECTION ---------- */
.nav-section {
    text-decoration: none;
    font-weight: bold;
    margin: 0 20px;
    padding: 8px;
    border-bottom: 2px solid transparent;
    color: inherit;
    transition: all 0.2s;
}
.nav-section.active,
.nav-section:hover {
    border-color: #0d6efd;
}

/*  SECONDA TOP BAR */
/* Seconda top bar centrata - senza linea */
.topbar.secondary {
    background-color: #f8f9fa;
    padding: 6px 13px;
    border: 0;            /* Rimuove qualsiasi bordo */
    outline: none;        /* Rimuove bordi esterni */
    box-shadow: none;     /* Rimuove eventuali ombre */
    margin: 0;            /* Elimina margini superiori e inferiori */
}

body.dark-theme .topbar.secondary {
    background-color: #1e1e1e;
    border: 0;
    outline: none;
    box-shadow: none;
    margin: 0;
}

/* Stile bottoni centrati nella seconda top bar - Tecnico */
.topbar.secondary .nav-link {
    color: #333; /* Scritta grigio scuro per un aspetto più tecnico */
    background-color: #f4f4f4; /* Sfondo grigio chiaro */
    padding: 5px 13px;
    margin: 2px;
    border: 1px solid #bbb; /* Bordi grigio medio */
    border-radius: 2px; /* Bordi leggermente squadrati */
    font-weight: 500; /* Meno marcato */
    font-size: 0.9rem; /* Font leggermente più piccolo */
    font-family: 'Courier New', Courier, monospace; /* Font tecnico */
    text-align: center;
    transition: all 0.2s ease;
}

.topbar.secondary .nav-link:hover {
    background-color: #e0e0e0; /* Colore hover leggermente più scuro */
    text-decoration: none;
}

body.dark-theme .topbar.secondary .nav-link {
    color: #ccc; /* Scritta grigio chiaro in modalità scura */
    background-color: #333; /* Sfondo grigio scuro */
    border-color: #555; /* Bordi leggermente più scuri */
}

body.dark-theme .topbar.secondary .nav-link:hover {
    background-color: #444; /* Colore hover in modalità scura */
}

/* ---------- TRANSIZIONI ---------- */
/* Fade/slide morbido (per sezioni diverse dal Portafoglio) */
.slide-fade {
    animation: slideFadeIn 0.5s ease-out;
}
@keyframes slideFadeIn {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Slide orizzontale molto lenta e fluida per Portafoglio */
.slide-hlr {
    animation: slideInFromLeft 0.01s cubic-bezier(0.25, 1, 0.5, 1) 0.15s forwards;
    opacity: 0; /* nascosta finché non parte l’animazione */
}
@keyframes slideInFromLeft {
    0%   { transform: translateX(-40px); opacity: 0; }
    100% { transform: translateX(0);     opacity: 1; }
}


/* ---------- GRAFICO & WATCHLIST ---------- */
#trading-layout {
    display: flex;
    align-items: flex-start;
    gap: 1.2rem;
    margin-top: 1.6rem;
}

#chart-container {
    flex-grow: 1;
}

#tv-chart {
    width: 100%;
    height: 400px;
    border: none;
}

#watchlist-panel {
    width: 256px;
    max-height: 440px;
    overflow-y: auto;
    background-color: #fff;
    padding: 0.8rem;
    border-radius: 6px;
    box-shadow: 0 0 5px rgba(0,0,0,0.05);
}

/* Card del grafico */
#winlose-card {
    background-color: #fff;
    padding: 0.8rem;
    border-radius: 6px;
    box-shadow: 0 0 5px rgba(0,0,0,0.05);
    text-align: center;
}

/* Grafico stesso */
canvas#winLoseChart {
    display: block;
    margin: 0 auto;
}

body.dark-theme #watchlist-panel {
    background-color: #121212;
    color: #f8f9fa;
    border-left-color: #333;
    box-shadow: none;
}
body.dark-theme #watchlist-panel .form-control {
    background-color: #1e1e1e;
    color: #f8f9fa;
    border-color: #444;
}
body.dark-theme #watchlist-panel .btn {
    color: white;
}

/* ---------- GRAFICO ---------- */
#tv-chart {
    width: 100%;
    height: 400px;
    border: none;
}

/* ---------- TABELLE ---------- */
.table-hover tbody tr:hover {
    background-color: rgba(13, 110, 253, 0.05);
}
body.dark-theme .table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

body.dark-theme #watchlist-panel .list-group-item {
    background-color: #1a1a1a;
    color: #f8f9fa;
    border: 1px solid #333;
    border-radius: 6px;
    margin-bottom: 8px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

body.dark-theme #watchlist-panel .list-group-item:hover {
    background-color: #2a2a2a;
}

body.dark-theme #watchlist-panel .btn {
    font-size: 0.8rem;
    padding: 4px 8px;
}

body.dark-theme #watchlist-panel .badge {
    background-color: #0d6efd;
    color: white;
}

/* ---------- CARD (usata per Statistiche) ---------- */
.card {
    background-color: #ffffff;
    color: #212529;
    border-radius: 10px;
    border: none;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

body.dark-theme .card {
    background-color: #1e1e1e !important;
    color: #f8f9fa !important;
    border: 1px solid #333;
}

body.dark-theme .card .card-title,
body.dark-theme .card strong {
    color: #f8f9fa;
}

body.dark-theme .card hr {
    border-top: 1px solid #444;
}
.card.mt-3 {
    padding: 1.2rem;
    margin-top: 1.6rem;
}

/* PULSANTI PICCOLI YOUR TRADES */
#small-trade-buttons {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 10;
}
#small-trade-buttons .btn-sm {
    width: 96px;
}

/* GRAFICI STILI VARI */
.card {
    border-radius: 6px;
    overflow: hidden;
}
.card-header {
    background-color: #f8f9fa;
    font-weight: bold;
}
.dark-theme .card-header {
    background-color: #333;
    color: #fff;
}
/* Uniforma altezza delle card */
.graph-card {
    height: 280px; /* Imposta altezza fissa */
    display: flex;
    flex-direction: column;
}
.graph-card .card-body {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
}
/* Riduci altezza dei canvas */
.graph-card canvas {
    max-height: 224px; /* Adatta il grafico all'interno della card */
}
.container.py-3 {
    padding-top: 0.8rem !important;
    padding-bottom: 0.8rem !important;
}
.row.g-3 {
    margin-top: 0;
}

/* STILE PULSANTI TRADE ATTIVI */
.btn-group .btn {
    margin-right: 4px;
}
.btn-group .btn:last-child {
    margin-right: 0;
}

/* STILE PER IL JOURNAL STRATEGY */
.journal-entry {
    background-color: #f8f9fa;
    padding: 8px;
    border-radius: 5px;
}
body.dark-theme .journal-entry {
    background-color: #2a2a2a;
}

/* Stile per il nome del portafoglio */
.portfolio-name {
  font-weight: 550;
  font-size: 0.9rem;
  color: #333;
  margin-bottom: 0.4rem;
}
body.dark-theme .portfolio-name {
  color: #e0e0e0;
}

/* Tema chiaro: intestazioni e celle adattive */
body.light-theme .thead-adaptive {
  background-color: #f8f9fa;
  color: #212529;
}
body.light-theme .table-adaptive tbody td {
  background-color: #ffffff;
  color: #212529;
}

/* Tema scuro: intestazioni e celle adattive */
body.dark-theme .thead-adaptive {
  background-color: #2c2f33;
  color: #f8f9f9;
}
body.dark-theme .table-adaptive tbody td {
  background-color: #1e1e1e;
  color: #eaeaea;
}
body.dark-theme .table-adaptive tbody tr:nth-child(odd) {
  background-color: #252525;
}
body.dark-theme .table-adaptive tbody tr:nth-child(even) {
  background-color: #1e1e1e;
}
body.dark-theme .table-adaptive td,
body.dark-theme .table-adaptive th {
  border-color: #444;
}
body.dark-theme .badge.bg-secondary {
  background-color: #444;
  color: #fff;
}

/* CSS PER GMPB STATS */
.portfolio-table, .positions-table {
  width: 100%;
  border-collapse: collapse;
  margin: 1em 0;
  font-family: 'Segoe UI', sans-serif;
  background-color: #fdfdfd;
  box-shadow: 0 0 5px rgba(0,0,0,0.1);
}
.portfolio-table th, .portfolio-table td,
.positions-table th, .positions-table td {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}
.portfolio-table th, .positions-table th {
  background-color: #f0f0f0;
  font-weight: bold;
}
.green { color: green; font-weight: bold; }
.red   { color: red;   font-weight: bold; }

/* login custom */
.table-responsive {
  max-height: 52vh;      /* scroll gradevole */
  overflow: auto;
}
.table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--bs-body-bg);  /* o #fff */
}

/* --- Choices: rendi il dropdown sopra tutto e non tagliato --- */
.card .choices,
.card .choices__inner {
  overflow: visible;               /* evita clipping nel card */
}
#dynamic-section,
#dynamic-section .card-body {
  overflow: visible;               /* evita clipping globale */
}

/* il dropdown deve stare sopra topbar e toast (Bootstrap ~1xxx) */
.choices__list--dropdown,
.choices__list[aria-expanded] {
  z-index: 2000 !important;
  position: absolute;              /* sicurezza */
  max-height: 224px;               /* finestra visibile */
  overflow-y: auto;
}

/* ===== Choices: tema scuro leggibile ===== */
.dark-theme .choices__inner{ background:#111827; color:#e5e7eb; border-color:#374151; }
.dark-theme .choices__input{ background:#111827; color:#e5e7eb; }
.dark-theme .choices__list--dropdown,
.dark-theme .choices__list[aria-expanded]{ background:#0b1220; color:#e5e7eb; border-color:#374151; }
.dark-theme .choices__list--dropdown .choices__item--choice{ color:#e5e7eb; }
.dark-theme .choices__list--dropdown .choices__item--choice.is-highlighted{ background:#2563eb; color:#fff; }
.dark-theme .choices__placeholder{ color:#9ca3af; }
.dark-theme .choices__list--multiple .choices__item{ background:#374151; border-color:#4b5563; color:#f3f4f6; }

/* Evita che i wrapper taglino i dropdown */
#dynamic-section, .archivio-card, .archivio-card .card-body{
  overflow: visible; position: relative;
}

/* Dropdown “portale” (lo gestiamo via JS) */
.choices-portal{
  position: fixed !important;
  z-index: 3000 !important;      /* sopra a tutto */
  max-height: 256px;             /* scroll se troppo alto */
  overflow-y: auto;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

/* === DARK THEME: leggibilità carte, tabelle e modali === */

/* Testi nelle card: rendi "muted" davvero leggibile */
body.dark-theme .card .text-muted {
  color: #a9b4c2 !important;  /* grigio chiaro ad alto contrasto */
  opacity: 1;                  /* evita attenuazioni */
}

/* Valori principali un filo più grandi nelle mini-card */
.small-card .fs-6 { font-size: 0.9rem !important; }

/* Tabelle in tema scuro */
body.dark-theme .table {
  color: #e7eaf0;
  --bs-table-bg: transparent;
  --bs-table-border-color: #374357;
}

/* Header tabella (anche quando usi .table-light o sticky) */
body.dark-theme .table thead th,
body.dark-theme .table-light th {
  background-color: #293141 !important;
  color: #e7eaf0 !important;
  border-color: #3a465a !important;
}

/* Riga totali / .table-secondary nel <tfoot> */
body.dark-theme .table-secondary,
body.dark-theme tfoot .table-secondary td,
body.dark-theme tfoot .table-secondary th {
  background-color: #2e394b !important;
  color: #e7eaf0 !important;
  border-color: #3a465a !important;
}

/* Strisce leggere sulle righe per separarle meglio */
body.dark-theme .table-striped > tbody > tr:nth-of-type(odd) {
  --bs-table-accent-bg: rgba(255,255,255,0.03);
  color: inherit;
}

/* Lo sticky header nel tuo CSS prende --bs-body-bg: sovrascriviamolo */
body.dark-theme .table thead th {
  background: #293141 !important;
}

/* Modale del grafico coerente col dark */
body.dark-theme .modal-content {
  background-color: #1f2430;
  color: #e7eaf0;
  border-color: #2c3444;
}

/* Bottoni outline più leggibili sul dark */
body.dark-theme .btn-outline-secondary {
  color: #cbd5e1;
  border-color: #55627a;
}
body.dark-theme .btn-outline-secondary:hover {
  background-color: #55627a;
  color: #fff;
}
body.dark-theme .btn-outline-primary {
  color: #93c5fd;
  border-color: #2563eb;
}
body.dark-theme .btn-outline-primary:hover {
  background-color: #2563eb;
  color: #fff;
}
body.dark-theme .btn-outline-info {
  color: #67e8f9;
  border-color: #0891b2;
}
body.dark-theme .btn-outline-info:hover {
  background-color: #0891b2;
  color: #0b1220;
}
/* Correzione: non toccare i testi della tabella */
body.dark-theme .card .text-muted {
  color: #a9b4c2 !important; /* solo per card */
  opacity: 1;
}

/* Ripristina colore normale delle celle in tabella */
body.dark-theme table td,
body.dark-theme table th {
  color: #e7eaf0 !important; /* testo leggibile */
}

/* Mantieni lo stile per i valori negativi/positivi */
body.dark-theme .text-success { color: #6fcf97 !important; }
body.dark-theme .text-danger { color: #ef6c6c !important; }
body.dark-theme .text-muted {
  color: #b0b0b0 !important; /* per celle con '–' o valori nulli */
}





/* Evidenziazione P/L */
.pnl-pos { color: #16a34a; font-weight: 600; }   /* verde */
.pnl-neg { color: #dc2626; font-weight: 600; }   /* rosso */

/* Tabella GMPB: allineamenti */
.td-right { text-align: right; }
.td-center { text-align: center; }

/* Card metriche account */
#accountData {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(144px, 1fr));
  gap: 10px;
}
.account-card {
  background: #0f172a;           /* dark */
  color: #e2e8f0;
  border: 1px solid rgba(148, 163, 184, 0.15);
  border-radius: 11px;
  padding: 10px 11px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.15);
}
.account-card .account-label {
  font-size: 0.66rem;
  color: #94a3b8;
  margin-bottom: 5px;
}
.account-card .account-value {
  font-size: 0.84rem;
  font-weight: 550;
  line-height: 1rem;
}

/* Toolbar sopra la tabella */
.gmpb-toolbar {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.gmpb-toolbar .form-select, .gmpb-toolbar select {
  max-width: 250px;
}

/* Tabelle */
.table thead th {
  white-space: nowrap;
}
.table tbody tr:hover {
  background-color: rgba(148, 163, 184, 0.08);
}

/* Messaggi di stato */
.text-danger { color: #ef4444; }
.text-center { text-align: center; }









/* ===== SHRINK TOP BAR (principale) ===== */
.topbar{
  padding: 4px 10px !important;      /* era ~py-2 px-4 da Bootstrap */
  min-height: 40px;
}

/* testo e controlli dentro la topbar principale */
.topbar,
.topbar .form-check-label,
.topbar #capital-display,
.topbar .btn,
.topbar .section-link,
.topbar form button {
  font-size: 0.9rem;                 /* riduce la tipografia globale della topbar */
  line-height: 1.2;
}

/* bottoni della topbar (Deposito/Prelievo/Logout/Telegram) */
.topbar .btn,
.topbar form button,
.topbar .section-link.btn {
  padding: 4px 10px !important;      /* più compatti */
  border-radius: 5px;
}

/* interruttore dark-mode più compatto */
.topbar .form-check-input {
  width: 2.1rem;
  height: 1.1rem;
  transform: translateY(1px);
}

/* ===== SHRINK SECOND TOP BAR (centrata) ===== */
.topbar.secondary{
  padding: 4px 10px !important;      /* era 6px 13px */
  min-height: 36px;
}

/* link/bottoni dentro la seconda top bar */
.topbar.secondary .nav-link{
  font-size: 0.85rem;                /* era 0.9rem */
  padding: 4px 10px;                 /* era 5px 13px */
  margin: 1px;                       /* era 2px */
  border-radius: 2px;
}

/* icone dentro i bottoni della seconda top bar */
.topbar.secondary .nav-link i{
  font-size: 0.95em;
  margin-right: 6px;
}

/* se usi anche pill nav con gap custom */
.topbar.secondary .btn-group-ordered{
  gap: .4rem;                        /* leggermente più stretto */
}

/* (opzionale) se vuoi comprimere un filo anche la riga di titoli nelle card sotto */
.card .card-header{
  padding: 6px 10px;
  font-size: 0.95rem;
}




/* ===== Manual Trading v2 — polish ===== */

/* toolbar sopra al grafico */
.mt-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  margin: 8px 0 10px;
}
.mt-toolbar .btn-group .btn{
  padding: 4px 10px; font-size: .85rem;
}

/* bottone “densità” */
.mt-density{
  display:flex; align-items:center; gap:.5rem; font-size:.85rem; color:#6b7280;
}
.mt-density input{ transform: translateY(1px); }

/* stato loading (skeleton) */
.skel{
  position: relative; overflow: hidden; border-radius:8px; background: rgba(148,163,184,.15);
}
.skel::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent);
  transform: translateX(-100%); animation: skel 1.2s infinite;
}
@keyframes skel{ to{ transform: translateX(100%); } }

/* hover/drag feedback watchlist */
.watch-item{ transition: background .15s, border-color .15s; }
.watch-item:hover{ background: rgba(148,163,184,.12); }
.handle{ transition: color .15s; }
.watch-item:active .handle{ color:#0d6efd; }

/* KPI densità compatta */
body.mt-compact .kpi{ padding:8px; }
body.mt-compact .kpi .kpi-value{ font-size:.9rem; }

/* badge count “morbido” */
.badge-soft{
  background: rgba(13,110,253,.12); color:#0d6efd; border:1px solid rgba(13,110,253,.25);
}

/* compatta i bottoni della lista */
.watch-actions .btn{ border-radius: 6px; }

/* miglior leggibilità dei titoli */
.mt-card .card-title, .kpi-title{ letter-spacing:.2px; }


/* === Seconda top bar: stesso colore del resto del layout === */
.topbar.secondary {
  background-color: var(--bs-body-bg) !important; /* si allinea al body */
  border-bottom: 1px solid rgba(0,0,0,.05);       /* bordo come il resto */
}

/* Tema scuro: stessa tinta del body + bordo coerente */
body.dark-theme .topbar.secondary {
  background-color: #0a0e11 !important;           /* come body.dark-theme */
  border-bottom: 1px solid rgba(255,255,255,.08);
}


/* === WATCHLIST – look tecnico === */
.wl-card{ padding:12px; height:500px; display:flex; flex-direction:column; }
.wl-head{ position:sticky; top:0; background:inherit; padding-bottom:8px; margin-bottom:10px; border-bottom:1px solid rgba(148,163,184,.25); }

#watchlist{ display:flex; flex-direction:column; gap:6px; margin:0; padding:0; list-style:none; }
.wl-item{
  display:grid;
  grid-template-columns: 28px 1fr auto 68px 100px auto;
  align-items:center; gap:10px;
  padding:8px 10px;
  background: transparent;
  border:1px solid rgba(148,163,184,.22);
  border-radius:10px;
  transition: background .15s ease, border-color .15s ease, transform .05s ease;
}
body.dark-theme .wl-item {
  background: transparent !important;
  border-color: rgba(148,163,184,.18) !important;
}


.wl-logo{
  width:28px; height:28px; border-radius:6px; overflow:hidden;
  background: linear-gradient(135deg,#1f2937,#0b1220);
  display:flex; align-items:center; justify-content:center;
  font: 600 12px ui-monospace,SFMono-Regular,Menlo,monospace;
  color:#9fb7ff; border:1px solid rgba(148,163,184,.25);
}
.wl-symbol{ font-weight:700; letter-spacing:.3px; }
.wl-name{ font-size:.8rem; opacity:.8; }

.wl-mono{ font-family: ui-monospace,SFMono-Regular,Menlo,monospace; }
.wl-price{ font-weight:700; }
.wl-chg{ font-weight:700; font-size:.85rem; padding:2px 6px; border-radius:999px; text-align:center; min-width:62px; }
.wl-chg.up{ color:#16a34a; background:rgba(22,163,74,.12); border:1px solid rgba(22,163,74,.35); }
.wl-chg.down{ color:#ef4444; background:rgba(239,68,68,.12); border:1px solid rgba(239,68,68,.35); }
.wl-exch{ font-size:.75rem; opacity:.7; letter-spacing:.3px; }

.wl-spark{ height:24px; }
.wl-spark canvas{ width:100%; height:24px; display:block; }

.wl-actions .btn{ --bs-btn-padding-y:.17rem; --bs-btn-padding-x:.45rem; --bs-btn-font-size:.78rem; }

@media (max-width:1200px){
  .wl-item{ grid-template-columns: 28px 1fr 80px 68px 0px auto; }
  .wl-name{ display:none; }
}
@media (max-width:992px){
  .wl-item{ grid-template-columns: 28px 1fr 70px 0px auto; }
  .wl-exch{ display:none; }
  .wl-spark{ display:none; }
}
.indicator-item {
  background: #1c1f24 !important;
  color: #e6faff !important;
  border: 1px solid rgba(0, 206, 209, 0.15) !important;
  border-radius: 6px;
  padding: 6px 10px;
  transition: 0.2s;
}

.indicator-item:hover {
  background: #22262b !important;
  border-color: rgba(0, 206, 209, 0.35) !important;
}

.indicator-item.active {
  background: rgba(0, 206, 209, 0.12) !important;
  border-color: var(--synapse-cyan) !important;
}
.badge-indicator {
  border-radius: 999px;
  padding: 4px 10px;
  font-weight: 600;
}

.badge-indicator-pos {
  background: rgba(46, 204, 113, 0.15);
  color: #2ecc71;
  border: 1px solid rgba(46, 204, 113, 0.4);
}

.badge-indicator-neg {
  background: rgba(231, 76, 60, 0.15);
  color: #e74c3c;
  border: 1px solid rgba(231, 76, 60, 0.4);
}

.badge-indicator-neu {
  background: rgba(255, 255, 255, 0.08);
  color: #e6faff;
  border: 1px solid rgba(255, 255, 255, 0.15);
}