/*
 * FantaCapital — AdminLTE Theme Override
 * Versione: 1.1 — pulizia conflitti CSS (vedi nota)
 *
 * QUESTO FILE E' L'UNICA FONTE DI VERITA' per le variabili --fc-*.
 * stock.css / fanta.css / teamdetails.css NON dichiarano piu' un
 * proprio :root: lo facevano tutti e tre, con valori leggermente
 * diversi per una quindicina di variabili condivise (es.
 * --fc-navy-deep, --fc-gold-text) — dato che :root e' globale,
 * l'ultimo file caricato (teamdetails.css) vinceva SEMPRE e
 * sovrascriveva silenziosamente il tema su tutta la pagina.
 * Ora ogni variabile e' definita una volta sola, qui.
 *
 * Ordine di caricamento invariato:
 *   <link rel="stylesheet" href="dist/css/style.css">        <- qui
 *   <link rel="stylesheet" href="dist/css/stock.css">
 *   <link rel="stylesheet" href="dist/css/fanta.css">
 *   <link rel="stylesheet" href="dist/css/teamdetails.css">
 */

/* =====================================================================
   1. VARIABILI CSS CUSTOM
   ===================================================================== */
:root {
  /* Base tema */
  --fc-navy-deep: #0d1b3e;
  --fc-navy: #111d3c;
  --fc-navy-light: #1a2d5a;
  --fc-navy-card: #112036;
  --fc-navy-row: rgba(15, 31, 61, 0.55);
  --fc-navy-row-alt: rgba(10, 22, 45, 0.38);
  --fc-navy-border: rgba(255, 255, 255, 0.10);
  --fc-navy-border-md: rgba(255, 255, 255, 0.20);
  --fc-border: rgba(255, 255, 255, 0.08);
  --fc-border-md: rgba(255, 255, 255, 0.14);

  /* Gold / accento */
  --fc-gold: #F0A500;
  --fc-gold-alt: #D4AF37;
  --fc-gold-dim: rgba(212, 175, 55, 0.15);
  --fc-gold-glow: 0 0 24px rgba(212, 175, 55, 0.35);
  --fc-gold-text: #0d1b3e;
  --fc-gold-border: rgba(240, 165, 0, 0.40);

  /* Stati up/down */
  --fc-up: #10B981;
  --fc-up-dim: rgba(16, 185, 129, 0.12);
  --fc-up-border: rgba(16, 185, 129, 0.30);
  --fc-down: #EF4444;
  --fc-down-dim: rgba(239, 68, 68, 0.15);
  --fc-down-border: rgba(239, 68, 68, 0.40);

  /* Testo */
  --fc-fg: #f5f0e8;
  --fc-fg-75: rgba(245, 240, 232, 0.75);
  --fc-fg-60: rgba(245, 240, 232, 0.60);
  --fc-fg-55: rgba(240, 234, 219, 0.55);
  --fc-fg-45: rgba(245, 240, 232, 0.45);
  --fc-fg-35: rgba(240, 234, 219, 0.35);

  /* Radius / transizioni */
  --fc-radius-card: 16px;
  --fc-radius-btn: 10px;
  --fc-radius-pill: 999px;
  --fc-transition: 0.2s ease;

  /* Ruoli campo — FWD */
  --fc-fwd-bg: rgba(40,  14,  14,  0.55);
  --fc-fwd-border: rgba(200, 60,  40,  0.35);
  --fc-fwd-border-h: rgba(200, 60,  40,  0.65);
  --fc-fwd-text: #f87171;
  --fc-fwd-b1: rgba(200, 60,  40,  0.40);

  /* Ruoli campo — MID */
  --fc-mid-bg: rgba(12,  38,  28,  0.55);
  --fc-mid-border: rgba(16,  185, 129, 0.25);
  --fc-mid-border-h: rgba(16,  185, 129, 0.55);
  --fc-mid-text: #10B981;

  /* Ruoli campo — DEF */
  --fc-def-bg: rgba(10,  22,  52,  0.65);
  --fc-def-border: rgba(59,  130, 246, 0.25);
  --fc-def-border-h: rgba(59,  130, 246, 0.55);
  --fc-def-text: #60a5fa;
  --fc-def-b1: rgba(59,  130, 246, 0.40);

  /* Ruoli campo — GK */
  --fc-gk-bg: rgba(30,  22,  5,   0.65);
  --fc-gk-border: rgba(240, 165, 0,   0.40);
  --fc-gk-text: #F0A500;

  /* Podio classifica */
  --fc-rank-1-bg: rgba(240, 165,   0, 0.18);
  --fc-rank-1-border: rgba(240, 165,   0, 0.55);
  --fc-rank-1-glow: 0 0 20px rgba(240, 165, 0, 0.25);
  --fc-rank-2-bg: rgba(180, 195, 220, 0.12);
  --fc-rank-2-border: rgba(180, 195, 220, 0.40);
  --fc-rank-3-bg: rgba(180, 110,  50, 0.12);
  --fc-rank-3-border: rgba(200, 130,  60, 0.40);

  /* Avatar */
  --fc-av1: #F0A500;
  --fc-av2: #10B981;
  --fc-av3: #60a5fa;
  --fc-av4: #a78bfa;
  --fc-av5: #f472b6;
  --fc-av6: #34d399;
  --fc-av7: #fbbf24;
  --fc-av8: #38bdf8;
  --fc-av9: #fb923c;
  --fc-av10: #e879f9;

  /* Settori */
  --fc-sect-comms: rgba(56,  189, 248, 0.14);
  --fc-sect-comms-b: rgba(56,  189, 248, 0.40);
  --fc-sect-comms-t: #38bdf8;
  --fc-sect-cons: rgba(52,  211, 153, 0.14);
  --fc-sect-cons-b: rgba(52,  211, 153, 0.40);
  --fc-sect-cons-disc: rgba(52,  211, 153, 0.14);
  --fc-sect-cons-disc-b: rgba(52,  211, 153, 0.40);
  --fc-sect-cons-disc-t: #34d399;
  --fc-sect-cons-stap: rgba(167, 139, 250, 0.14);
  --fc-sect-cons-stap-b: rgba(167, 139, 250, 0.40);
  --fc-sect-cons-stap-t: #a78bfa;
  --fc-sect-cons-t: #34d399;
  --fc-sect-energy: rgba(250, 204, 21,  0.14);
  --fc-sect-energy-b: rgba(250, 204, 21,  0.40);
  --fc-sect-energy-t: #facc15;
  --fc-sect-finance: rgba(244, 114, 182, 0.14);
  --fc-sect-finance-b: rgba(244,114,182, 0.40);
  --fc-sect-finance-t: #f472b6;
  --fc-sect-health: rgba(251, 146, 60,  0.14);
  --fc-sect-health-b: rgba(251, 146, 60,  0.40);
  --fc-sect-health-t: #fb923c;
  --fc-sect-industrial: rgba(251, 146, 60,  0.14);
  --fc-sect-industrial-b: rgba(251, 146, 60,  0.40);
  --fc-sect-industrial-t: #fb923c;
  --fc-sect-materials: rgba(134, 239, 172, 0.14);
  --fc-sect-materials-b: rgba(134, 239, 172, 0.40);
  --fc-sect-materials-t: #86efac;
  --fc-sect-realestate: rgba(244, 114, 182, 0.14);
  --fc-sect-realestate-b: rgba(244, 114, 182, 0.40);
  --fc-sect-realestate-t: #f472b6;
  --fc-sect-retail: rgba(167, 139, 250, 0.14);
  --fc-sect-retail-b: rgba(167, 139, 250, 0.40);
  --fc-sect-retail-t: #a78bfa;
  --fc-sect-tech: rgba(96,  165, 250, 0.14);
  --fc-sect-tech-b: rgba(96,  165, 250, 0.40);
  --fc-sect-tech-t: #60a5fa;
  --fc-sect-utilities: rgba(251, 191, 36,  0.14);
  --fc-sect-utilities-b: rgba(251, 191, 36,  0.40);
  --fc-sect-utilities-t: #fbbf24;
}


/* =====================================================================
   2. BODY & LAYOUT GLOBALE
   ===================================================================== */
body,
.wrapper,
.content-wrapper {
  background-color: var(--fc-navy-deep) !important;
  color: var(--fc-fg) !important;
}

.content-wrapper {
  background-color: var(--fc-navy-deep) !important;
}

/* Sfondo alternativo per sezioni interne */
.content {
  background-color: transparent;
}


/* =====================================================================
   3. NAVBAR PRINCIPALE (top bar)
   ===================================================================== */
.main-header.navbar,
.main-header {
  background-color: rgba(13, 27, 62, 0.90) !important;
  border-bottom: 1px solid var(--fc-navy-border) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.main-header .navbar-brand,
.main-header .brand-link {
  color: var(--fc-fg) !important;
  font-weight: 700;
  letter-spacing: -0.01em;
  border-bottom: none !important;
}

.main-header .navbar-brand span,
.brand-link .brand-text span {
  color: var(--fc-gold) !important;
}

/* Link navbar */
.main-header .nav-link,
.main-header .navbar-nav .nav-link {
  color: var(--fc-fg-75) !important;
  transition: color var(--fc-transition);
}

.main-header .nav-link:hover,
.main-header .navbar-nav .nav-link:hover {
  color: var(--fc-gold) !important;
}

/* Icone badge notifiche */
.main-header .badge {
  background-color: var(--fc-gold) !important;
  color: var(--fc-gold-text) !important;
}


/* =====================================================================
   4. SIDEBAR
   ===================================================================== */
.main-sidebar,
.sidebar {
  background-color: var(--fc-navy) !important;
  border-right: 1px solid var(--fc-navy-border) !important;
}

/* Brand sidebar */
.brand-link {
  background-color: var(--fc-navy) !important;
  border-bottom: 1px solid var(--fc-navy-border) !important;
  color: var(--fc-fg) !important;
}

/* Voci di menu */
.nav-sidebar .nav-link,
.sidebar .nav-link {
  color: var(--fc-fg-75) !important;
  border-radius: 8px !important;
  transition: background var(--fc-transition), color var(--fc-transition);
}

.nav-sidebar .nav-link:hover,
.sidebar .nav-link:hover {
  background-color: rgba(240, 165, 0, 0.08) !important;
  color: var(--fc-gold) !important;
}

.nav-sidebar .nav-link.active,
.sidebar .nav-link.active {
  background-color: var(--fc-gold-dim) !important;
  color: var(--fc-gold) !important;
  font-weight: 700;
}

/* Icone sidebar */
.nav-sidebar .nav-icon,
.sidebar .nav-icon {
  color: var(--fc-fg-60) !important;
}

.nav-sidebar .nav-link.active .nav-icon,
.nav-sidebar .nav-link:hover .nav-icon {
  color: var(--fc-gold) !important;
}

/* Header categorie sidebar */
.nav-sidebar .nav-header {
  color: var(--fc-fg-45) !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

/* Treeview (sotto-menu) */
.nav-sidebar .nav-treeview {
  background-color: rgba(0, 0, 0, 0.15) !important;
  border-radius: 8px;
}

.nav-sidebar .nav-treeview .nav-link {
  padding-left: 2rem !important;
}

/* Sidebar mini (collapsed) */
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .brand-text,
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .nav-link p {
  opacity: 0;
}


/* =====================================================================
   5. CARDS
   ===================================================================== */
.card {
  background-color: var(--fc-navy) !important;
  border: 1px solid var(--fc-navy-border) !important;
  border-radius: var(--fc-radius-card) !important;
  color: var(--fc-fg) !important;
  transition: border-color var(--fc-transition), transform var(--fc-transition);
}

.card:hover {
  border-color: rgba(240, 165, 0, 0.30) !important;
  transform: translateY(-2px);
}

.card-header {
  background-color: transparent !important;
  border-bottom: 1px solid var(--fc-navy-border) !important;
  color: var(--fc-fg) !important;
  font-weight: 700;
}

.card-footer {
  background-color: transparent !important;
  border-top: 1px solid var(--fc-navy-border) !important;
  color: var(--fc-fg-60) !important;
}

.card-title {
  color: var(--fc-fg) !important;
}

.card-text {
  color: var(--fc-fg-75) !important;
}

/* Card variante gold (highlight) */
.card.card-fc-gold {
  border-color: rgba(240, 165, 0, 0.40) !important;
  box-shadow: var(--fc-gold-glow) !important;
}


/* =====================================================================
   6. SMALL BOXES (widget statistiche)
   ===================================================================== */
.small-box {
  border-radius: var(--fc-radius-card) !important;
  border: 1px solid var(--fc-navy-border) !important;
  overflow: hidden;
}

.small-box h3 {
  color: var(--fc-fg) !important;
  font-weight: 900;
}

.small-box p {
  color: var(--fc-fg-75) !important;
}

.small-box .icon {
  color: rgba(255, 255, 255, 0.15) !important;
}

/* Colori varianti small-box */
.bg-fc-gold,
.small-box.bg-fc-gold {
  background-color: var(--fc-gold) !important;
}
.bg-fc-gold h3,
.bg-fc-gold p {
  color: var(--fc-gold-text) !important;
}

.small-box.bg-success {
  background-color: var(--fc-up) !important;
}

.small-box.bg-danger {
  background-color: var(--fc-down) !important;
}

.small-box.bg-dark {
  background-color: var(--fc-navy-light) !important;
  border-color: var(--fc-navy-border-md) !important;
}


/* =====================================================================
   7. BOTTONI
   ===================================================================== */

/* Primary = Gold */
.btn-primary {
  background-color: var(--fc-gold) !important;
  border-color: var(--fc-gold) !important;
  color: var(--fc-gold-text) !important;
  font-weight: 700;
  border-radius: var(--fc-radius-btn) !important;
  transition: filter var(--fc-transition), transform var(--fc-transition), box-shadow var(--fc-transition);
}

.btn-primary:hover,
.btn-primary:focus {
  filter: brightness(1.10);
  box-shadow: var(--fc-gold-glow) !important;
  color: var(--fc-gold-text) !important;
}

.btn-primary:active {
  transform: scale(0.96);
}

/* Success = Verde Up */
.btn-success {
  background-color: var(--fc-up) !important;
  border-color: var(--fc-up) !important;
  color: #fff !important;
  font-weight: 700;
  border-radius: var(--fc-radius-btn) !important;
}

/* Danger = Rosso Down */
.btn-danger {
  background-color: var(--fc-down-dim) !important;
  border-color: var(--fc-down-border) !important;
  color: var(--fc-down) !important;
  font-weight: 700;
  border-radius: var(--fc-radius-btn) !important;
}

.btn-danger:hover {
  background-color: rgba(239, 68, 68, 0.25) !important;
}

/* Outline secondary (bordo bianco sottile) */
.btn-outline-secondary,
.btn-default {
  background-color: transparent !important;
  border: 1.5px solid var(--fc-navy-border-md) !important;
  color: var(--fc-fg) !important;
  font-weight: 600;
  border-radius: var(--fc-radius-btn) !important;
}

.btn-outline-secondary:hover,
.btn-default:hover {
  background-color: rgba(255, 255, 255, 0.05) !important;
  color: var(--fc-fg) !important;
}

/* Pill CTA (variante landing) */
.btn-fc-pill {
  border-radius: var(--fc-radius-pill) !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px;
  padding: 6px 18px;
  background-color: var(--fc-gold);
  color: var(--fc-gold-text);
  border: none;
  transition: filter var(--fc-transition);
}

.btn-fc-pill:hover {
  filter: brightness(1.10);
}


/* =====================================================================
   8. FORM & INPUT
   ===================================================================== */
.form-control,
.custom-select,
.form-control:focus {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--fc-navy-border-md) !important;
  color: var(--fc-fg) !important;
  border-radius: 8px !important;
}

.form-control::placeholder {
  color: var(--fc-fg-45) !important;
}

.form-control:focus {
  border-color: rgba(240, 165, 0, 0.50) !important;
  box-shadow: 0 0 0 0.15rem rgba(240, 165, 0, 0.15) !important;
}

.input-group-text {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--fc-navy-border-md) !important;
  color: var(--fc-fg-60) !important;
}

label,
.form-label {
  color: var(--fc-fg-75) !important;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}


/* =====================================================================
   9. TABELLE
   ===================================================================== */
.table,
.dataTable {
  color: var(--fc-fg) !important;
}

.table thead th {
  background-color: var(--fc-navy-light) !important;
  color: var(--fc-fg-60) !important;
  border-bottom: 1px solid var(--fc-navy-border) !important;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.table tbody tr {
  border-bottom: 1px solid var(--fc-navy-border) !important;
  transition: background var(--fc-transition);
}

.table tbody tr:hover {
  background-color: rgba(240, 165, 0, 0.04) !important;
}

.table td,
.table th {
  border-top: none !important;
  border-bottom: 1px solid var(--fc-navy-border) !important;
  vertical-align: middle;
}

/* DataTables override */
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: var(--fc-gold) !important;
  border-color: var(--fc-gold) !important;
  color: var(--fc-gold-text) !important;
  border-radius: 6px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: rgba(240, 165, 0, 0.12) !important;
  color: var(--fc-gold) !important;
  border-color: rgba(240, 165, 0, 0.30) !important;
  border-radius: 6px;
}

.dataTables_filter input,
.dataTables_length select {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid var(--fc-navy-border-md) !important;
  color: var(--fc-fg) !important;
  border-radius: 8px !important;
}

.dataTables_info {
  color: var(--fc-fg-60) !important;
}


/* =====================================================================
   10. BADGE & PILLS
   ===================================================================== */
.badge-primary,
.badge.bg-primary {
  background-color: var(--fc-gold) !important;
  color: var(--fc-gold-text) !important;
}

.badge-success,
.badge.bg-success {
  background-color: var(--fc-up-dim) !important;
  color: var(--fc-up) !important;
  border: 1px solid var(--fc-up-border);
}

.badge-danger,
.badge.bg-danger {
  background-color: var(--fc-down-dim) !important;
  color: var(--fc-down) !important;
  border: 1px solid var(--fc-down-border);
}

/* Badge LIVE animato */
.badge-fc-live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background-color: var(--fc-gold) !important;
  color: var(--fc-gold-text) !important;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: var(--fc-radius-pill);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.badge-fc-live::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  background-color: var(--fc-gold-text);
  border-radius: 50%;
  animation: fc-pulse 1.5s ease-in-out infinite;
}

/* Badge status mercato */
.badge-fc-up {
  background-color: var(--fc-up-dim) !important;
  border: 1px solid var(--fc-up-border) !important;
  color: var(--fc-up) !important;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: var(--fc-radius-pill);
}

.badge-fc-down {
  background-color: var(--fc-down-dim) !important;
  border: 1px solid var(--fc-down-border) !important;
  color: var(--fc-down) !important;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: var(--fc-radius-pill);
}


/* =====================================================================
   11. DROPDOWN & MENU CONTESTUALI
   ===================================================================== */
.dropdown-menu {
  background-color: var(--fc-navy) !important;
  border: 1px solid var(--fc-navy-border-md) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.40) !important;
  padding: 6px !important;
}

.dropdown-item {
  color: var(--fc-fg-75) !important;
  border-radius: 8px !important;
  font-size: 13px;
  transition: background var(--fc-transition), color var(--fc-transition);
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: rgba(240, 165, 0, 0.08) !important;
  color: var(--fc-gold) !important;
}

.dropdown-divider {
  border-top-color: var(--fc-navy-border) !important;
}

.dropdown-header {
  color: var(--fc-fg-45) !important;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}


/* =====================================================================
   12. MODALI
   ===================================================================== */
.modal-content {
  background-color: var(--fc-navy) !important;
  border: 1px solid var(--fc-navy-border-md) !important;
  border-radius: var(--fc-radius-card) !important;
  color: var(--fc-fg) !important;
}

.modal-header {
  border-bottom: 1px solid var(--fc-navy-border) !important;
}

.modal-footer {
  border-top: 1px solid var(--fc-navy-border) !important;
}

.modal-title {
  color: var(--fc-fg) !important;
  font-weight: 700;
}

.btn-close,
.close {
  color: var(--fc-fg-60) !important;
  opacity: 1 !important;
  filter: invert(1) brightness(0.7);
}


/* =====================================================================
   13. ALERTS
   ===================================================================== */
.alert {
  border-radius: 12px !important;
  border-width: 1px !important;
  font-size: 13px;
}

.alert-success {
  background-color: var(--fc-up-dim) !important;
  border-color: var(--fc-up-border) !important;
  color: var(--fc-up) !important;
}

.alert-danger {
  background-color: var(--fc-down-dim) !important;
  border-color: var(--fc-down-border) !important;
  color: var(--fc-down) !important;
}

.alert-warning {
  background-color: rgba(240, 165, 0, 0.12) !important;
  border-color: rgba(240, 165, 0, 0.35) !important;
  color: var(--fc-gold) !important;
}

.alert-info {
  background-color: rgba(59, 130, 246, 0.12) !important;
  border-color: rgba(59, 130, 246, 0.35) !important;
  color: #60a5fa !important;
}


/* =====================================================================
   14. TABS & NAV PILLS
   ===================================================================== */
.nav-tabs {
  border-bottom: 1px solid var(--fc-navy-border) !important;
}

.nav-tabs .nav-link {
  color: var(--fc-fg-60) !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  font-size: 13px;
  font-weight: 600;
  transition: color var(--fc-transition), border-color var(--fc-transition);
}

.nav-tabs .nav-link:hover {
  color: var(--fc-fg) !important;
}

.nav-tabs .nav-link.active {
  color: var(--fc-gold) !important;
  border-bottom-color: var(--fc-gold) !important;
  background-color: transparent !important;
}

.nav-pills .nav-link {
  color: var(--fc-fg-60) !important;
  border-radius: 8px !important;
}

.nav-pills .nav-link.active {
  background-color: var(--fc-gold-dim) !important;
  color: var(--fc-gold) !important;
}


/* =====================================================================
   15. PROGRESS BAR
   ===================================================================== */
.progress {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border-radius: var(--fc-radius-pill) !important;
  height: 6px;
}

.progress-bar {
  background-color: var(--fc-gold) !important;
  border-radius: var(--fc-radius-pill) !important;
}

.progress-bar.bg-success {
  background-color: var(--fc-up) !important;
}

.progress-bar.bg-danger {
  background-color: var(--fc-down) !important;
}


/* =====================================================================
   16. FOOTER
   ===================================================================== */
.main-footer {
  background-color: var(--fc-navy) !important;
  border-top: 1px solid var(--fc-navy-border) !important;
  color: var(--fc-fg-45) !important;
  font-size: 12px;
}

.main-footer a {
  color: var(--fc-gold) !important;
}


/* =====================================================================
   17. SCROLLBAR CUSTOM
   ===================================================================== */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: var(--fc-navy-deep);
}

::-webkit-scrollbar-thumb {
  background: rgba(240, 165, 0, 0.25);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(240, 165, 0, 0.50);
}


/* =====================================================================
   18. COMPONENTI CUSTOM — STOCK CHIP (campo da calcio)
   ===================================================================== */
.fc-stock-chip {
  background: var(--fc-gold-dim);
  border: 1px solid rgba(240, 165, 0, 0.35);
  border-radius: 10px;
  padding: 8px 12px;
  text-align: center;
  min-width: 70px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  transition: border-color var(--fc-transition), transform var(--fc-transition);
}

.fc-stock-chip:hover {
  border-color: rgba(240, 165, 0, 0.70);
  transform: translateY(-2px);
}

.fc-stock-chip .fc-pos {
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fc-fg-60);
  background: var(--fc-navy-deep);
  padding: 1px 6px;
  border-radius: 3px;
  margin-bottom: 4px;
}

.fc-stock-chip .fc-ticker {
  font-size: 12px;
  font-weight: 900;
  color: var(--fc-fg);
  line-height: 1.1;
}

.fc-stock-chip .fc-price {
  font-size: 10px;
  font-weight: 700;
  color: var(--fc-gold);
  margin-top: 2px;
}

.fc-stock-chip .fc-beta {
  font-size: 9px;
  color: var(--fc-fg-45);
  margin-top: 1px;
}


/* =====================================================================
   19. COMPONENTI CUSTOM — STAT CARD MERCATO
   ===================================================================== */
.fc-stat-card {
  background: var(--fc-navy);
  border: 1px solid var(--fc-navy-border);
  border-radius: var(--fc-radius-card);
  padding: 20px 24px;
  transition: border-color var(--fc-transition), transform var(--fc-transition);
}

.fc-stat-card:hover {
  border-color: rgba(240, 165, 0, 0.35);
  transform: translateY(-3px);
}

.fc-stat-card .fc-stat-value {
  font-size: 36px;
  font-weight: 900;
  color: var(--fc-gold);
  line-height: 1;
}

.fc-stat-card .fc-stat-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--fc-fg-60);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: 6px;
}

.fc-stat-card .fc-stat-delta {
  font-size: 12px;
  font-weight: 700;
  margin-top: 8px;
}

.fc-stat-card .fc-stat-delta.up   { color: var(--fc-up); }
.fc-stat-card .fc-stat-delta.down { color: var(--fc-down); }


/* =====================================================================
   20. ANIMAZIONI UTILITY
   ===================================================================== */
@keyframes fc-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.4; transform: scale(0.8); }
}

@keyframes fc-float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-6px); }
}

@keyframes fc-reveal {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

.fc-pulse-dot {
  animation: fc-pulse 1.5s ease-in-out infinite;
}

.fc-float {
  animation: fc-float 3s ease-in-out infinite;
}

.fc-reveal {
  animation: fc-reveal 0.4s ease both;
}

/* Utility colori testo */
.text-fc-gold  { color: var(--fc-gold) !important; }
.text-fc-up    { color: var(--fc-up) !important; }
.text-fc-down  { color: var(--fc-down) !important; }
.text-fc-muted { color: var(--fc-fg-60) !important; }

/* Utility sfondi */
.bg-fc-navy       { background-color: var(--fc-navy) !important; }
.bg-fc-navy-deep  { background-color: var(--fc-navy-deep) !important; }
.bg-fc-gold       { background-color: var(--fc-gold) !important; color: var(--fc-gold-text) !important; }

/* Bordo gold glow */
.fc-gold-glow {
  box-shadow: var(--fc-gold-glow) !important;
}