/*
 * FantaCapital — Stock Card (Leaderboard + Market)
 * File: fantacapital-stock-card.css (rinominato concettualmente:
 * la sezione "Stock Card / Campo da Calcio" originale e' stata
 * rimossa perche' morta - mai usata da nessuna pagina, sostituita
 * da teamdetails.css - e le sue classi condivise (.pitch-card,
 * .pitch-header, .score-bar, .pitch-footer, .action-btn) andavano
 * in conflitto con quelle, identiche di nome, di teamdetails.css.
 *
 * Le variabili --fc-* non sono piu' dichiarate qui: vengono da
 * style.css (vedi nota in cima a quel file).
 *
 * Le classi .si-role/.si-info/.si-ticker/.si-name/.si-quot/.filter-pill
 * della sezione MERCATO sono state rinominate in .mkt-si-/.mkt-filter-pill
 * perche' andavano in conflitto (stesso nome, valori diversi) con le
 * classi omonime di teamdetails.css, usate nella sidebar rosa della
 * pagina formazione: essendo teamdetails.css caricato per ultimo,
 * vinceva SEMPRE anche sulla pagina mercato, rimpicciolendo testo e
 * pillole filtro rispetto a quanto previsto qui.
 * mercato.php e' stato aggiornato di conseguenza.
 */

/*
 * FantaCapital — Leaderboard Card
 * Componente aggiuntivo: da caricare DOPO fantacapital-adminlte.css
 *
 * Ordine link consigliato:
 *   <link rel="stylesheet" href="adminlte.min.css">
 *   <link rel="stylesheet" href="fantacapital-adminlte.css">
 *   <link rel="stylesheet" href="fantacapital-leaderboard.css">
 *
 * Font richiesto (se non già presente nel progetto):
 *   <link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700;900&family=Barlow:wght@400;500;600&display=swap" rel="stylesheet">
 *
 * Dipende dalle variabili CSS definite in fantacapital-adminlte.css
 */


/* =====================================================================
   VARIABILI AGGIUNTIVE specifiche di questo componente
   ===================================================================== */
/* =====================================================================
   ANIMAZIONI
   ===================================================================== */
@keyframes fc-lb-reveal {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fc-row-in {
  from { opacity: 0; transform: translateX(-10px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes fc-bar-grow {
  from { width: 0; }
}

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


/* =====================================================================
   LEADERBOARD CARD — contenitore esterno
   ===================================================================== */
.lb-card {
  margin: 0 auto;
  width: 100%;
  max-width: 640px;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid var(--fc-border-md);
  background: var(--fc-navy-card);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.50);
  animation: fc-lb-reveal 0.45s ease both;
  transition: max-width 0.2s ease;
}

/* Vista dettagliata: 7 colonne, serve più respiro rispetto alla card compatta */
.lb-card--wide {
  max-width: 860px;
}


/* ── Header ── */
.lb-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background: rgba(0, 0, 0, 0.28);
  border-bottom: 1px solid var(--fc-border);
}

.lb-header-left {
  display: flex;
  align-items: center;
  gap: 10px;
}

.lb-header-icon {
  font-size: 20px;
  line-height: 1;
}

.lb-header-info {}

.lb-header-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 900;
  color: var(--fc-fg);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
}

.lb-header-sub {
  font-size: 10px;
  color: var(--fc-fg-55);
  margin-top: 2px;
  letter-spacing: 0.04em;
}

.lb-header-right {
  display: flex;
  align-items: center;
  gap: 8px;
}

.lb-season-badge {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  background: var(--fc-gold-dim);
  border: 1px solid var(--fc-gold-border);
  color: var(--fc-gold);
  padding: 3px 9px;
  border-radius: 999px;
}

.lb-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  background: var(--fc-gold);
  color: var(--fc-gold-text);
  padding: 3px 9px;
  border-radius: 999px;
}

.lb-live-dot {
  width: 5px;
  height: 5px;
  background: var(--fc-gold-text);
  border-radius: 50%;
  animation: fc-pulse 1.5s ease-in-out infinite;
}

/* Toggle Semplice/Dettagliata */
.lb-view-toggle {
  display: flex;
  gap: 4px;
}
.lb-view-toggle a {
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 8px;
  border: 1px solid var(--fc-border);
  color: var(--fc-fg-60, #aaa);
  text-decoration: none;
}
.lb-view-toggle a.active {
  background: var(--fc-gold, #d4af37);
  color: #1a1a1a;
  border-color: transparent;
}


/* =====================================================================
   GRIGLIA COLONNE — fonte di verità UNICA per header e righe.
   Header e righe DEVONO condividere le stesse grid-template-columns/gap,
   altrimenti le colonne si disallineano tra loro.
   ===================================================================== */
.lb-col-header,
.lb-row {
  display: grid;
  grid-template-columns: 36px 1fr 130px 90px 80px 80px 70px; /* vista dettagliata: # · Squadra · Punteggio totale · Punteggio G · Rendimento G · Bonus G · Trend */
  gap: 10px;
  align-items: center;
  padding: 10px 18px;
}

/* Vista semplice: 5 colonne (# · Squadra · Punteggio totale · Punteggio G · Trend).
   Le prime 4 tracce coincidono con quelle della vista dettagliata, così
   "Squadra" e "Punteggio totale" restano nella stessa posizione passando
   da una vista all'altra. */
.lb-col-header--simple,
.lb-row--simple {
  grid-template-columns: 36px 1fr 130px 90px 70px;
}

/* ── Intestazione colonne: solo differenze rispetto a .lb-row ── */
.lb-col-header {
  padding: 7px 18px;
  background: rgba(0, 0, 0, 0.18);
  border-bottom: 1px solid var(--fc-border);
}
.lb-col-header span {
  font-size: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lb-col-header .col-perf,
.lb-col-header .col-pts,
.lb-col-header .col-delta {
  text-align: right;
}


/* =====================================================================
   TOGGLE "Dettagli bonus (N)" — piccolo, inline accanto al nome
   ===================================================================== */
.lb-bonus-toggle {
  display: inline-block;
  font-size: 10px;
  color: var(--fc-fg-60, #aaa);
}
.lb-bonus-toggle summary {
  cursor: pointer;
  list-style: none; /* rimuove la freccina di default del browser */
}
.lb-bonus-toggle summary::-webkit-details-marker { display: none; }
.lb-bonus-toggle summary::before {
  content: "▸ ";
}
.lb-bonus-toggle[open] summary::before {
  content: "▾ ";
}

/* Pannello a tutta larghezza: nascosto finché il toggle non è aperto */
.lb-bonus-panel {
  display: none;
  grid-column: 1 / -1;      /* occupa tutta la larghezza della riga grid */
  margin-top: 10px;
  padding: 12px 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--fc-border);
  border-radius: 10px;
}
.lb-row:has(.lb-bonus-toggle[open]) .lb-bonus-panel {
  display: block;
}

.lb-bonus-panel-grid {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.lb-bonus-panel-row {
  display: grid;
  grid-template-columns: 20px 110px 1fr auto;
  align-items: center;
  gap: 10px;
  font-size: 12px;
}
.lb-bonus-panel-icon { text-align: center; }
.lb-bonus-panel-ticker {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
  min-width: 0;
}
.lb-bonus-panel-ticker a {
  display: flex;
  flex-direction: column;
  color: inherit;
  text-decoration: none;
}
.lb-bonus-panel-ticker a:hover .lb-bonus-panel-ticker-sym {
  text-decoration: underline;
}
.lb-bonus-panel-ticker-sym {
  font-weight: 700;
  font-family: monospace;
}
.lb-bonus-panel-ticker-name {
  font-size: 10px;
  color: var(--fc-fg-45, #999);
  font-family: inherit;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lb-bonus-panel-text { color: var(--fc-fg-80, #ccc); }
.lb-bonus-panel-pt { font-weight: 700; white-space: nowrap; }
.lb-bonus-panel-pt.positive { color: #1cc88a; }
.lb-bonus-panel-pt.negative { color: #e74a3b; }


/* =====================================================================
   LISTA RIGHE
   ===================================================================== */
.lb-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ── Decorazioni della singola riga (non toccano grid-template-columns/gap,
   già definiti sopra insieme all'header) ── */
.lb-row {
  border-bottom: 1px solid var(--fc-border);
  background: var(--fc-navy-row);
  cursor: pointer;
  transition: background 0.18s, border-color 0.18s;
  animation: fc-row-in 0.35s ease both;
  position: relative;
  overflow: hidden;
}

/* Stagger animazione righe */
.lb-row:nth-child(1)  { animation-delay: 0.04s; }
.lb-row:nth-child(2)  { animation-delay: 0.08s; }
.lb-row:nth-child(3)  { animation-delay: 0.12s; }
.lb-row:nth-child(4)  { animation-delay: 0.16s; }
.lb-row:nth-child(5)  { animation-delay: 0.20s; }
.lb-row:nth-child(6)  { animation-delay: 0.24s; }
.lb-row:nth-child(7)  { animation-delay: 0.28s; }
.lb-row:nth-child(8)  { animation-delay: 0.32s; }
.lb-row:nth-child(9)  { animation-delay: 0.36s; }
.lb-row:nth-child(10) { animation-delay: 0.40s; }

.lb-row:nth-child(odd) {
  background: var(--fc-navy-row-alt);
}

.lb-row:last-child {
  border-bottom: none;
}

.lb-row:hover {
  background: rgba(240, 165, 0, 0.06) !important;
  border-color: rgba(240, 165, 0, 0.18);
}

/* Riga "tu" (evidenziata) */
.lb-row.is-me {
  background: rgba(240, 165, 0, 0.08) !important;
  border-left: 3px solid var(--fc-gold);
  padding-left: 15px;
}

.lb-row.is-me:hover {
  background: rgba(240, 165, 0, 0.13) !important;
}

/* Podio top-3 */
.lb-row.rank-1 {
  background: var(--fc-rank-1-bg) !important;
  border-bottom-color: rgba(240, 165, 0, 0.20);
}
.lb-row.rank-1:hover { background: rgba(240,165,0,0.22) !important; }

.lb-row.rank-2 {
  background: var(--fc-rank-2-bg) !important;
}

.lb-row.rank-3 {
  background: var(--fc-rank-3-bg) !important;
}

/* Shimmer sui top-3 */
.lb-row.rank-1::before,
.lb-row.rank-2::before,
.lb-row.rank-3::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    transparent 30%,
    rgba(255,255,255,0.04) 50%,
    transparent 70%
  );
  background-size: 200% 100%;
  animation: fc-shimmer 3s linear infinite;
  pointer-events: none;
}


/* ── Cella: rank ── */
.lb-rank {
  display: flex;
  align-items: center;
  justify-content: center;
}

.rank-num {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px;
  font-weight: 900;
  color: var(--fc-fg-55);
  line-height: 1;
  width: 22px;
  text-align: center;
}

.rank-1 .rank-num { color: var(--fc-gold); font-size: 16px; }
.rank-2 .rank-num { color: #b4c3dc; font-size: 15px; }
.rank-3 .rank-num { color: #c8763c; font-size: 15px; }

.rank-trophy {
  font-size: 14px;
  line-height: 1;
}


/* ── Cella: player ── */
.lb-player {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.lb-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px;
  font-weight: 900;
  color: #0a1628;
  flex-shrink: 0;
  border: 1.5px solid rgba(255,255,255,0.15);
}

/* Varianti colore avatar */
.lb-avatar.av-1  { background: var(--fc-av1); }
.lb-avatar.av-2  { background: var(--fc-av2); }
.lb-avatar.av-3  { background: var(--fc-av3); }
.lb-avatar.av-4  { background: var(--fc-av4); }
.lb-avatar.av-5  { background: var(--fc-av5); }
.lb-avatar.av-6  { background: var(--fc-av6); }
.lb-avatar.av-7  { background: var(--fc-av7); }
.lb-avatar.av-8  { background: var(--fc-av8); }
.lb-avatar.av-9  { background: var(--fc-av9); }
.lb-avatar.av-10 { background: var(--fc-av10); color: #fff; }

/* Anello dorato per il primo */
.rank-1 .lb-avatar {
  border-color: var(--fc-gold);
  box-shadow: 0 0 10px rgba(240,165,0,0.40);
}

.lb-player-info {
  min-width: 0;
}

.lb-player-name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--fc-fg);
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lb-player-team {
  font-size: 9px;
  color: var(--fc-fg-55);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Tag "ME" accanto al nome */
.lb-me-tag {
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: var(--fc-gold);
  color: var(--fc-gold-text);
  padding: 1px 5px;
  border-radius: 3px;
  margin-left: 5px;
  vertical-align: middle;
}


/* ── Cella: punteggio totale (con numero grande, senza barra) ── */
.lb-perf {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
  padding-right: 8px;
}

.lb-perf-val {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}

.lb-perf-big .lb-perf-val {
  font-size: 20px;
}

.lb-bonus-badge {
  font-size: 11px;
  display: inline-block;
}

.lb-perf-val.positive { color: var(--fc-up); }
.lb-perf-val.negative { color: var(--fc-down); }

.lb-perf-bar-wrap {
  width: 100%;
  height: 3px;
  background: rgba(255,255,255,0.06);
  border-radius: 999px;
  overflow: hidden;
}

.lb-perf-bar {
  height: 100%;
  border-radius: 999px;
  animation: fc-bar-grow 0.8s ease both;
}

.lb-perf-bar.positive { background: var(--fc-up); }
.lb-perf-bar.negative { background: var(--fc-down); }


/* ── Cella: punti (Punteggio G / Rendimento G / Bonus G) ── */
.lb-pts {
  text-align: right;
  padding-right: 8px;
}

.lb-pts-val {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 900;
  color: var(--fc-fg);
  line-height: 1;
}

.rank-1 .lb-pts-val { color: var(--fc-gold); }

.lb-pts-label {
  font-size: 8px;
  color: var(--fc-fg-35);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}


/* ── Cella: delta posizione ── */
.lb-delta {
  text-align: right;
}

.lb-delta-badge {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  line-height: 1.3;
}

.lb-delta-badge.up {
  background: var(--fc-up-dim);
  color: var(--fc-up);
}

.lb-delta-badge.down {
  background: var(--fc-down-dim);
  color: var(--fc-down);
}

.lb-delta-badge.same {
  background: rgba(255,255,255,0.06);
  color: var(--fc-fg-55);
}


/* =====================================================================
   FOOTER SUMMARY
   ===================================================================== */
.lb-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 18px;
  background: rgba(0, 0, 0, 0.22);
  border-top: 1px solid var(--fc-border);
  gap: 12px;
}

.lb-footer-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
}

.lb-footer-val {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 900;
  color: var(--fc-gold);
  line-height: 1;
}

.lb-footer-lbl {
  font-size: 8px;
  color: var(--fc-fg-35);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.lb-footer-divider {
  width: 1px;
  height: 28px;
  background: var(--fc-border-md);
  flex-shrink: 0;
}

.lb-footer-cta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--fc-gold);
  color: var(--fc-gold-text);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 7px 14px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  transition: filter 0.15s, transform 0.15s;
  margin-left: auto;
}

.lb-footer-cta:hover  { filter: brightness(1.12); }
.lb-footer-cta:active { transform: scale(0.96); }
/*--#market--/
/*
 * FantaCapital — Market / Azioni Page
 * Da caricare DOPO fantacapital-adminlte.css
 *
 *   <link rel="stylesheet" href="adminlte.min.css">
 *   <link rel="stylesheet" href="fantacapital-adminlte.css">
 *   <link rel="stylesheet" href="fantacapital-market.css">
 */

/* =====================================================================
   VARIABILI AGGIUNTIVE
   ===================================================================== */
/* =====================================================================
   ANIMAZIONI
   ===================================================================== */
@keyframes fc-page-in {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fc-card-in {
  from { opacity: 0; transform: translateY(10px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0)   scale(1); }
}
@keyframes fc-ticker-flash {
  0%   { background: rgba(240,165,0,0.25); }
  100% { background: transparent; }
}
@keyframes fc-bar-grow {
  from { width: 0; }
}
@keyframes fc-sparkline {
  from { stroke-dashoffset: 200; }
  to   { stroke-dashoffset: 0; }
}

/* =====================================================================
   PAGE HEADER
   ===================================================================== */
.mkt-page {
  animation: fc-page-in 0.4s ease both;
  padding: 0 0 40px;
}

.mkt-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
}

.mkt-topbar-left {}

.mkt-page-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 28px;
  font-weight: 900;
  color: var(--fc-fg);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  line-height: 1;
}

.mkt-page-sub {
  font-size: 12px;
  color: var(--fc-fg-55);
  margin-top: 4px;
}

.mkt-page-sub .mkt-update-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  background: var(--fc-up);
  border-radius: 50%;
  margin-right: 5px;
  animation: fc-pulse 1.5s ease-in-out infinite;
  vertical-align: middle;
}

.mkt-topbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* =====================================================================
   STAT STRIP (4 KPI in cima)
   ===================================================================== */
.mkt-kpi-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 20px;
}

.mkt-kpi {
  background: var(--fc-navy-card);
  border: 1px solid var(--fc-border-md);
  border-radius: 14px;
  padding: 14px 16px;
  animation: fc-card-in 0.4s ease both;
  transition: border-color 0.2s, transform 0.2s;
}
.mkt-kpi:hover {
  border-color: rgba(240,165,0,0.35);
  transform: translateY(-2px);
}
.mkt-kpi:nth-child(1) { animation-delay: 0.04s; }
.mkt-kpi:nth-child(2) { animation-delay: 0.08s; }
.mkt-kpi:nth-child(3) { animation-delay: 0.12s; }
.mkt-kpi:nth-child(4) { animation-delay: 0.16s; }

.mkt-kpi-label {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--fc-fg-35);
  margin-bottom: 6px;
}

.mkt-kpi-value {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 26px;
  font-weight: 900;
  color: var(--fc-gold);
  line-height: 1;
}

.mkt-kpi-delta {
  font-size: 11px;
  font-weight: 700;
  margin-top: 4px;
}
.mkt-kpi-delta.up   { color: var(--fc-up); }
.mkt-kpi-delta.down { color: var(--fc-down); }
.mkt-kpi-delta.neutral { color: var(--fc-fg-55); }

/* =====================================================================
   FILTRI & RICERCA
   ===================================================================== */
.mkt-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.mkt-search-wrap {
  position: relative;
  flex: 1;
  min-width: 180px;
  max-width: 280px;
}

.mkt-search-icon {
  position: absolute;
  left: 11px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  color: var(--fc-fg-35);
  pointer-events: none;
}

.mkt-search {
  width: 100%;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--fc-border-md);
  border-radius: 9px;
  color: var(--fc-fg);
  font-size: 13px;
  padding: 8px 12px 8px 32px;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.mkt-search::placeholder { color: var(--fc-fg-35); }
.mkt-search:focus {
  border-color: rgba(240,165,0,0.45);
  box-shadow: 0 0 0 3px rgba(240,165,0,0.10);
}

/* Pill filtri settore */
.mkt-filter-pills {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.mkt-pill {
  font-size: 11px;
  font-weight: 700;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid var(--fc-border-md);
  background: transparent;
  color: var(--fc-fg-55);
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.mkt-pill:hover {
  background: rgba(255,255,255,0.06);
  color: var(--fc-fg);
}
.mkt-pill.active {
  background: var(--fc-gold-dim);
  border-color: var(--fc-gold-border);
  color: var(--fc-gold);
}

/* Sort select */
.mkt-sort {
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--fc-border-md);
  border-radius: 9px;
  color: var(--fc-fg);
  font-size: 12px;
  padding: 7px 10px;
  outline: none;
  cursor: pointer;
}
.mkt-sort option { background: #0f1f3d; }

/* View toggle grid/list */
.mkt-view-toggle {
  display: flex;
  border: 1px solid var(--fc-border-md);
  border-radius: 9px;
  overflow: hidden;
}

.mkt-view-btn {
  background: transparent;
  border: none;
  color: var(--fc-fg-55);
  font-size: 14px;
  padding: 7px 11px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.mkt-view-btn.active {
  background: var(--fc-gold-dim);
  color: var(--fc-gold);
}
.mkt-view-btn:hover:not(.active) {
  background: rgba(255,255,255,0.05);
  color: var(--fc-fg);
}

/* =====================================================================
   GRIGLIA CARD AZIONI
   ===================================================================== */
.mkt-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
}

/* ── Singola stock card ── */
.stock-card {
  background: var(--fc-navy-card);
  border: 1px solid var(--fc-border-md);
  border-radius: 16px;
  padding: 16px;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
  animation: fc-card-in 0.4s ease both;
  position: relative;
  overflow: hidden;
}

.stock-card:hover {
  border-color: rgba(240,165,0,0.40);
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.40);
}

/* Stagger */
.stock-card:nth-child(1)  { animation-delay: 0.04s; }
.stock-card:nth-child(2)  { animation-delay: 0.07s; }
.stock-card:nth-child(3)  { animation-delay: 0.10s; }
.stock-card:nth-child(4)  { animation-delay: 0.13s; }
.stock-card:nth-child(5)  { animation-delay: 0.16s; }
.stock-card:nth-child(6)  { animation-delay: 0.19s; }
.stock-card:nth-child(7)  { animation-delay: 0.22s; }
.stock-card:nth-child(8)  { animation-delay: 0.25s; }
.stock-card:nth-child(9)  { animation-delay: 0.28s; }
.stock-card:nth-child(10) { animation-delay: 0.31s; }
.stock-card:nth-child(11) { animation-delay: 0.34s; }
.stock-card:nth-child(12) { animation-delay: 0.37s; }

/* Accent colorato in alto a destra */
.stock-card::before {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: 80px; height: 80px;
  border-radius: 0 16px 0 80px;
  opacity: 0.07;
  transition: opacity 0.2s;
}
.stock-card:hover::before { opacity: 0.14; }
.stock-card.up-card::before   { background: var(--fc-up); }
.stock-card.down-card::before { background: var(--fc-down); }

/* ── Row 1: logo + nome + badge settore ── */
.sc-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 12px;
}

.sc-identity {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sc-logo {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid rgba(255,255,255,0.20);
  display: flex;
  color:#112036;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
.sc-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 5px;
}

.sc-names {}
.sc-ticker {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 18px;
  font-weight: 900;
  color: var(--fc-fg);
  line-height: 1;
  letter-spacing: 0.03em;
}
.sc-name {
  font-size: 10px;
  color: var(--fc-fg-55);
  margin-top: 1px;
  line-height: 1.2;
}

/* Badge settore */
.sc-sector-badge {
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  padding: 3px 8px;
  border-radius: 999px;
  white-space: nowrap;
  flex-shrink: 0;
}
.sc-sector-badge.tech    { background: var(--fc-sect-tech);    border: 1px solid var(--fc-sect-tech-b);    color: var(--fc-sect-tech-t); }
.sc-sector-badge.cons    { background: var(--fc-sect-cons);    border: 1px solid var(--fc-sect-cons-b);    color: var(--fc-sect-cons-t); }
.sc-sector-badge.health  { background: var(--fc-sect-health);  border: 1px solid var(--fc-sect-health-b);  color: var(--fc-sect-health-t); }
.sc-sector-badge.retail  { background: var(--fc-sect-retail);  border: 1px solid var(--fc-sect-retail-b);  color: var(--fc-sect-retail-t); }
.sc-sector-badge.energy  { background: var(--fc-sect-energy);  border: 1px solid var(--fc-sect-energy-b);  color: var(--fc-sect-energy-t); }
.sc-sector-badge.finance { background: var(--fc-sect-finance); border: 1px solid var(--fc-sect-finance-b); color: var(--fc-sect-finance-t); }

/* ── Row 2: prezzo + delta ── */
.sc-price-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 10px;
}

.sc-price {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 26px;
  font-weight: 900;
  color: var(--fc-fg);
  line-height: 1;
}

.sc-delta-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}

.sc-delta {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}
.sc-delta.up   { color: var(--fc-up); }
.sc-delta.down { color: var(--fc-down); }

.sc-delta-abs {
  font-size: 10px;
  color: var(--fc-fg-35);
}

/* ── Sparkline SVG ── */
.sc-sparkline {
  width: 100%;
  height: 36px;
  margin-bottom: 12px;
  overflow: visible;
}

.sc-spark-path {
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 200;
  animation: fc-sparkline 1.2s ease both;
}
.sc-spark-path.up   { stroke: var(--fc-up); }
.sc-spark-path.down { stroke: var(--fc-down); }

.sc-spark-area {
  opacity: 0.08;
}
.sc-spark-area.up   { fill: var(--fc-up); }
.sc-spark-area.down { fill: var(--fc-down); }

/* ── Grid dati fondamentali ── */
.sc-data-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 6px 4px;
  margin-bottom: 12px;
}

.sc-datum {
  background: rgba(255,255,255,0.04);
  border-radius: 7px;
  padding: 6px 7px;
}

.sc-datum-label {
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--fc-fg-35);
  margin-bottom: 2px;
}

.sc-datum-value {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--fc-fg);
  line-height: 1;
}

.sc-datum-value.gold   { color: var(--fc-gold); }
.sc-datum-value.up     { color: var(--fc-up); }
.sc-datum-value.down   { color: var(--fc-down); }

/* ── Barra progresso 52W range ── */
.sc-range-row {
  margin-bottom: 12px;
}

.sc-range-label-row {
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  color: var(--fc-fg-35);
  margin-bottom: 4px;
}

.sc-range-bar-wrap {
  position: relative;
  height: 4px;
  background: rgba(255,255,255,0.06);
  border-radius: 999px;
  overflow: visible;
}

.sc-range-bar {
  position: absolute;
  left: 0; top: 0;
  height: 100%;
  background: linear-gradient(90deg, rgba(240,165,0,0.4), var(--fc-gold));
  border-radius: 999px;
  animation: fc-bar-grow 0.8s ease both;
}

.sc-range-dot {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 8px; height: 8px;
  background: var(--fc-gold);
  border: 2px solid var(--fc-navy-card);
  border-radius: 50%;
  box-shadow: 0 0 6px rgba(240,165,0,0.5);
}

/* ── Footer: ruolo + pulsante ── */
.sc-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 10px;
  border-top: 1px solid var(--fc-border);
}

.sc-role-badges {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.sc-role-badge {
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid;
}
.sc-role-badge.fwd { color: #f87171; border-color: rgba(200,60,40,0.50); background: rgba(40,14,14,0.50); }
.sc-role-badge.mid { color: var(--fc-up); border-color: var(--fc-up-border); background: rgba(12,38,28,0.50); }
.sc-role-badge.def { color: #60a5fa; border-color: rgba(59,130,246,0.40); background: rgba(10,22,52,0.50); }
.sc-role-badge.gk  { color: var(--fc-gold); border-color: var(--fc-gold-border); background: rgba(30,22,5,0.50); }

.sc-add-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: var(--fc-gold);
  color: var(--fc-gold-text);
  border: none;
  border-radius: 7px;
  padding: 6px 12px;
  cursor: pointer;
  transition: filter 0.15s, transform 0.15s;
}
.sc-add-btn:hover  { filter: brightness(1.12); }
.sc-add-btn:active { transform: scale(0.95); }

.sc-add-btn.owned {
  background: var(--fc-up-dim);
  color: var(--fc-up);
  border: 1px solid var(--fc-up-border);
}
.sc-add-btn.owned:hover { background: rgba(16,185,129,0.22); }

/* =====================================================================
   VISTA LISTA (toggle)
   ===================================================================== */
.mkt-grid.list-view {
  grid-template-columns: 1fr;
  gap: 6px;
}

.mkt-grid.list-view .stock-card {
  padding: 10px 16px;
  border-radius: 12px;
}

.mkt-grid.list-view .stock-card::before { display: none; }

.mkt-grid.list-view .sc-top,
.mkt-grid.list-view .sc-price-row,
.mkt-grid.list-view .sc-data-grid,
.mkt-grid.list-view .sc-range-row,
.mkt-grid.list-view .sc-sparkline,
.mkt-grid.list-view .sc-footer {
  display: none;
}

.mkt-grid.list-view .sc-list-row {
  display: flex !important;
}

/* Row visibile solo in list-view */
.sc-list-row {
  display: none;
  align-items: center;
  gap: 12px;
}

.sc-list-logo {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(255,255,255,0.15);
  overflow: hidden;
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.sc-list-logo img { width:100%; height:100%; object-fit:contain; padding:4px; }

.sc-list-names { flex: 0 0 110px; }
.sc-list-ticker {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 15px; font-weight: 900;
  color: var(--fc-fg); line-height: 1;
}
.sc-list-name { font-size: 9px; color: var(--fc-fg-55); margin-top:1px; }

.sc-list-sector { flex: 0 0 80px; }

.sc-list-price {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px; font-weight: 900;
  color: var(--fc-fg); flex: 0 0 80px;
}

.sc-list-delta {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 14px; font-weight: 700;
  flex: 0 0 70px;
}
.sc-list-delta.up   { color: var(--fc-up); }
.sc-list-delta.down { color: var(--fc-down); }

.sc-list-beta {
  font-size: 11px; color: var(--fc-fg-55);
  flex: 0 0 50px;
}
.sc-list-mktcap {
  font-size: 11px; color: var(--fc-fg-55);
  flex: 0 0 70px; text-align: right;
}

.sc-list-actions {
  margin-left: auto;
  display: flex; gap: 6px;
}

.sc-list-btn {
  font-size: 10px; font-weight: 700;
  padding: 5px 10px; border-radius: 6px; border: none; cursor: pointer;
  transition: filter 0.15s;
}
.sc-list-btn.add { background: var(--fc-gold); color: var(--fc-gold-text); }
.sc-list-btn.add:hover { filter: brightness(1.12); }
.sc-list-btn.info {
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--fc-border-md);
  color: var(--fc-fg-55);
}
.sc-list-btn.info:hover { color: var(--fc-fg); }

/* =====================================================================
   EMPTY STATE (ricerca senza risultati)
   ===================================================================== */
.mkt-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 20px;
  display: none;
}
.mkt-empty.visible { display: block; }
.mkt-empty-icon { font-size: 48px; margin-bottom: 12px; }
.mkt-empty-text { font-size: 16px; color: var(--fc-fg-55); }


/* =====================================================================
   RESPONSIVE — AdminLTE sidebar
   ===================================================================== */

/*
 * AdminLTE sidebar espansa = 250px + padding content = ~32px × 2
 * Spazio utile reale: viewport - 250px - 64px padding = viewport - 314px
 *
 * Logica breakpoint:
 *   ≥ 1400px  → 4 colonne  (sidebar + contenuto ampio)
 *   ≥ 1100px  → 3 colonne
 *   ≥ 800px   → 2 colonne
 *   < 800px   → 1 colonna  (sidebar collassata o mobile)
 *
 * Le classi .sidebar-collapse e .sidebar-mini di AdminLTE
 * sono gestite tramite media query secondarie.
 */

/* Base: lascia che auto-fill decida, ma limita il minimo a 220px */
.mkt-grid {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

/* Viewport ampio: sidebar espansa (250px) → 4 colonne */
@media (min-width: 1400px) {
  .mkt-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* Medio-grande: 3 colonne */
@media (max-width: 1399px) and (min-width: 1050px) {
  .mkt-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Medio: 2 colonne (sidebar espansa stringe lo spazio) */
@media (max-width: 1049px) and (min-width: 700px) {
  .mkt-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* KPI strip: 2+2 invece di 4 in fila */
  .mkt-kpi-strip {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Topbar: impila titolo e budget */
  .mkt-topbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  /* Toolbar: manda i pill su una riga separata */
  .mkt-toolbar {
    flex-wrap: wrap;
    row-gap: 8px;
  }
  .mkt-filter-pills {
    width: 100%;
    order: 3;
  }
}

/* Stretto: 1 colonna (sidebar collassata o mobile) */
@media (max-width: 699px) {
  .mkt-grid {
    grid-template-columns: 1fr;
  }

  .mkt-kpi-strip {
    grid-template-columns: repeat(2, 1fr);
  }

  .mkt-topbar {
    flex-direction: column;
    align-items: flex-start;
  }

  .mkt-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .mkt-search-wrap {
    max-width: 100%;
  }

  .mkt-filter-pills {
    width: 100%;
  }

  .mkt-view-toggle,
  .mkt-sort {
    align-self: flex-end;
  }

  /* Card: riduci padding su schermi piccoli */
  .stock-card {
    padding: 13px;
  }

  /* Data grid: 2 colonne invece di 3 */
  .sc-data-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* KPI: font più piccolo */
  .mkt-kpi-value {
    font-size: 22px;
  }
}

/* ── Sidebar collassata (AdminLTE aggiunge .sidebar-mini.sidebar-collapse al body) ──
   Quando la sidebar è collassata (62px) si guadagna ~188px:
   forziamo una colonna in più rispetto ai breakpoint standard.         */
.sidebar-mini.sidebar-collapse .mkt-grid,
.sidebar-collapse .mkt-grid {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

@media (min-width: 1050px) {
  .sidebar-mini.sidebar-collapse .mkt-grid,
  .sidebar-collapse .mkt-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 1049px) and (min-width: 700px) {
  .sidebar-mini.sidebar-collapse .mkt-grid,
  .sidebar-collapse .mkt-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ── Content wrapper AdminLTE: forza box-sizing e niente overflow ── */
.content-wrapper .mkt-page {
  width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
  padding: 20px 20px 40px;
}

/* Riduci padding interno delle card su spazi ridotti */
@media (max-width: 1200px) {
  .stock-card {
    padding: 13px;
  }
  .mkt-kpi {
    padding: 11px 13px;
  }
  .mkt-kpi-value {
    font-size: 22px;
  }
  .sc-price {
    font-size: 22px;
  }
}

/* Nasconde la sparkline su schermi molto stretti per guadagnare altezza */
@media (max-width: 480px) {
  .sc-sparkline {
    display: none;
  }
  .sc-data-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.stock-item[draggable="true"] { cursor: grab; }
.stock-item.dragging { opacity: 0.4; }
.slot { position: relative; }
.slot.drop-target { outline: 2px dashed var(--fc-gold); outline-offset: 2px; }
.slot-remove {
  position: absolute; top: 4px; right: 4px;
  width: 18px; height: 18px; border: none; border-radius: 50%;
  background: rgba(0,0,0,0.5); color: #fff; font-size: 10px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; opacity: 0; transition: opacity .15s;
}
.slot:hover .slot-remove { opacity: 1; }

.slot.drop-invalid {
  outline: 2px dashed var(--fc-down);
  outline-offset: 2px;
  background: var(--fc-down-dim);
}
/* ════════════════════════════════════════
   MERCATO DI TRASFERIMENTO
   Allineato al design system navy + gold
   (fantacapital-adminlte.css)
   ════════════════════════════════════════ */

.market-status-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  background: var(--fc-navy-deep);
  border: 1px solid var(--fc-navy-border);
  color: var(--fc-fg);
  border-radius: var(--fc-radius-card);
  padding: 14px 18px;
  margin-bottom: 14px;
}
.market-status-left { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.market-status-text { font-size: 13px; color: var(--fc-fg-60); }

.market-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .04em;
  padding: 5px 12px;
  border-radius: var(--fc-radius-pill);
}
.market-badge.open {
  background: var(--fc-up-dim);
  border: 1px solid var(--fc-up-border);
  color: var(--fc-up);
}
.market-badge.closed {
  background: var(--fc-down-dim);
  border: 1px solid var(--fc-down-border);
  color: var(--fc-down);
}
.market-badge-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: currentColor;
}
.market-badge.open .market-badge-dot { animation: market-pulse 1.4s infinite; }
@keyframes market-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(16,185,129,.5); }
  70%  { box-shadow: 0 0 0 6px rgba(16,185,129,0); }
  100% { box-shadow: 0 0 0 0 rgba(16,185,129,0); }
}

.market-counter { font-size: 13px; color: var(--fc-fg-60); }
.market-counter strong { color: var(--fc-gold); font-size: 15px; }

.market-rules-box {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: var(--fc-gold-dim);
  border: 1px solid var(--fc-navy-border-md);
  border-radius: var(--fc-radius-btn);
  padding: 12px 16px;
  font-size: 13px;
  color: var(--fc-fg-75);
  margin-bottom: 18px;
}
.market-rules-box i { color: var(--fc-gold); margin-top: 2px; }
.market-rules-box strong { color: var(--fc-fg); }

.market-panel {
  background: var(--fc-navy);
  border: 1px solid var(--fc-navy-border);
  border-radius: var(--fc-radius-card);
  overflow: hidden;
  margin-bottom: 18px;
  box-shadow: 0 4px 18px rgba(0,0,0,.25);
}
.market-panel-header {
  padding: 16px 18px 10px;
  border-bottom: 1px solid var(--fc-navy-border);
}
.market-panel-title {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 700;
  font-size: 19px;
  color: var(--fc-fg);
  letter-spacing: .02em;
}
.market-panel-subtitle {
  font-size: 12px;
  color: var(--fc-fg-45);
  margin-top: 2px;
}

.market-panel-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px 18px;
  border-bottom: 1px solid var(--fc-navy-border);
}
.mkt-filter-pill {
  border: 1px solid var(--fc-navy-border-md);
  background: transparent;
  color: var(--fc-fg-60);
  font-size: 12px;
  font-weight: 600;
  border-radius: var(--fc-radius-pill);
  padding: 5px 12px;
  cursor: pointer;
  transition: all var(--fc-transition);
}
.mkt-filter-pill:hover { border-color: var(--fc-gold); color: var(--fc-fg); }
.mkt-filter-pill.active {
  background: var(--fc-gold);
  border-color: var(--fc-gold);
  color: var(--fc-gold-text);
}

.market-search { padding: 10px 18px; border-bottom: 1px solid var(--fc-navy-border); }
.market-search input[type="text"] {
  width: 100%;
  background: var(--fc-navy-deep);
  border: 1px solid var(--fc-navy-border-md);
  border-radius: var(--fc-radius-btn);
  padding: 7px 12px;
  font-size: 13px;
  color: var(--fc-fg);
}
.market-search input::placeholder { color: var(--fc-fg-45); }
.market-search input:focus {
  outline: none;
  border-color: var(--fc-gold);
}

/* ── Filtro range crediti (min/max) ── */
.market-credit-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  flex-wrap: wrap;
}
.market-credit-filter label {
  font-size: 11px;
  color: var(--fc-fg-45);
  white-space: nowrap;
}
.market-credit-filter input[type="number"] {
  width: 80px;
  background: var(--fc-navy-deep);
  border: 1px solid var(--fc-navy-border-md);
  border-radius: var(--fc-radius-btn);
  padding: 5px 8px;
  font-size: 12px;
  color: var(--fc-fg);
}
.market-credit-filter input[type="number"]::placeholder { color: var(--fc-fg-45); }
.market-credit-filter input[type="number"]:focus {
  outline: none;
  border-color: var(--fc-gold);
}
.market-credit-sep { color: var(--fc-fg-45); font-size: 12px; }

/* ── Checkbox "Solo acquistabili con i miei crediti" ── */
.market-checkbox-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-size: 12px;
  color: var(--fc-fg-60);
  cursor: pointer;
  user-select: none;
}
.market-checkbox-row input[type="checkbox"] {
  accent-color: var(--fc-gold);
  cursor: pointer;
}

.market-list {
  max-height: 560px;
  overflow-y: auto;
}
.market-empty {
  padding: 28px 18px;
  text-align: center;
  font-size: 13px;
  color: var(--fc-fg-45);
}

.market-item {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  border-bottom: 1px solid var(--fc-navy-border);
  transition: background var(--fc-transition);
}
.market-item:hover { background: var(--fc-navy-light); }
.market-item.selected { background: var(--fc-gold-dim); }

.mkt-si-role {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 22px;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--fc-fg);
  border: 1px solid transparent;
}
.mkt-si-role.gk  { background: var(--fc-gk-bg);  border-color: var(--fc-gold);        color: var(--fc-gold); }
.mkt-si-role.def { background: var(--fc-def-bg); border-color: var(--fc-def-border-h); color: var(--fc-def-text); }
.mkt-si-role.mid { background: var(--fc-mid-bg); border-color: var(--fc-mid-border-h); color: var(--fc-up); }
.mkt-si-role.fwd { background: var(--fc-fwd-bg); border-color: var(--fc-fwd-border-h); color: var(--fc-fwd-text); }

.mkt-si-info { min-width: 0; }
.mkt-si-ticker {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: var(--fc-fg);
}
.mkt-si-name {
  font-size: 11px;
  color: var(--fc-fg-45);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mkt-si-quot {
  font-size: 13px;
  font-weight: 700;
  color: var(--fc-gold);
  white-space: nowrap;
  text-align: right;
  grid-column: 3;
  grid-row: 1;
}

.market-item-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}

.action-btn.small {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid transparent;
  border-radius: var(--fc-radius-btn);
  font-size: 12px;
  font-weight: 600;
  padding: 5px 10px;
  cursor: pointer;
  transition: opacity var(--fc-transition), filter var(--fc-transition);
}
.action-btn.small:hover { filter: brightness(1.15); }
.action-btn.small:disabled {
  opacity: .35;
  cursor: not-allowed;
  filter: none;
}
.action-btn.small.sell {
  background: var(--fc-down-dim);
  border-color: var(--fc-down-border);
  color: var(--fc-down);
}
.action-btn.small.swap {
  background: rgba(96, 165, 250, 0.15);
  border-color: var(--fc-def-border-h);
  color: var(--fc-def-text);
}
.action-btn.small.buy {
  background: var(--fc-up-dim);
  border-color: var(--fc-up-border);
  color: var(--fc-up);
}

.market-op-badge {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: var(--fc-radius-pill);
  letter-spacing: .02em;
  border: 1px solid transparent;
}
.market-op-badge.sell {
  background: var(--fc-down-dim);
  border-color: var(--fc-down-border);
  color: var(--fc-down);
}
.market-op-badge.swap {
  background: rgba(96, 165, 250, 0.15);
  border-color: var(--fc-def-border-h);
  color: var(--fc-def-text);
}
.market-op-badge.buy {
  background: var(--fc-up-dim);
  border-color: var(--fc-up-border);
  color: var(--fc-up);
}
.market-op-badge.locked {
  background: rgba(255,255,255,0.06);
  border-color: var(--fc-navy-border-md);
  color: var(--fc-fg-45);
  display: inline-flex; align-items: center; gap: 4px;
}