/* BOS-BOURSE — Theme global (Inter + dark mode overrides) */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --font-main: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Applique Inter partout par défaut (les pages peuvent re-définir si besoin) */
body, button, input, select, textarea {
  font-family: var(--font-main);
}

/* ─────────────────────────────────────────────────────────────
   Dark mode — overrides des CSS variables utilisées par les pages
   ───────────────────────────────────────────────────────────── */
:root[data-theme="dark"] {
  /* Couleurs communes utilisées dans index/positions/vitrine/mes-picks/admin/aide */
  --bg: #0F172A;
  --text: #F1F5F9;
  --card: #1E293B;
  --border: #334155;
  --muted: #94A3B8;

  --grey: #1E293B;
  --white: #1E293B;
  --lgrey: #1E293B;

  --blue: #60A5FA;
  --lblue: #60A5FA;
  --primary: #60A5FA;

  --green: #34D399;
  --lgreen: #064E3B;
  --red: #F87171;
  --lred: #7F1D1D;
  --orange: #FBBF24;
  --lorng: #78350F;
  --amber: #FBBF24;
}

/* Couleurs body + cards génériques en dark */
:root[data-theme="dark"] body { background: #0F172A; color: #F1F5F9; }

:root[data-theme="dark"] header,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .table-card,
:root[data-theme="dark"] .chart-card,
:root[data-theme="dark"] .pick-card,
:root[data-theme="dark"] .login-box,
:root[data-theme="dark"] .pf-card,
:root[data-theme="dark"] .detail-header,
:root[data-theme="dark"] .kpi,
:root[data-theme="dark"] aside.sidebar,
:root[data-theme="dark"] main {
  background-color: #1E293B !important;
  color: #F1F5F9;
  border-color: #334155 !important;
}

:root[data-theme="dark"] .summary,
:root[data-theme="dark"] .toolbar,
:root[data-theme="dark"] details,
:root[data-theme="dark"] .csv-import,
:root[data-theme="dark"] .valo-date-banner {
  background-color: #1E293B !important;
  color: #F1F5F9;
  border-color: #334155 !important;
}

:root[data-theme="dark"] table { color: #F1F5F9; }
:root[data-theme="dark"] table th { background: #0F172A !important; color: #F1F5F9 !important; border-color: #334155 !important; }
:root[data-theme="dark"] table td { color: #F1F5F9; border-color: #334155 !important; }
:root[data-theme="dark"] tr:hover { background: #0F172A !important; }
:root[data-theme="dark"] tr:nth-child(even) { background: #0F172A !important; }

:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea {
  background: #0F172A;
  color: #F1F5F9;
  border-color: #334155;
}
:root[data-theme="dark"] input::placeholder { color: #64748B; }

:root[data-theme="dark"] code,
:root[data-theme="dark"] pre { background: #0F172A !important; color: #F1F5F9; }

:root[data-theme="dark"] .pick-reason,
:root[data-theme="dark"] .empty,
:root[data-theme="dark"] .subtitle { color: #94A3B8; }

/* Bouton toggle mode (commun) */
.theme-toggle {
  background: transparent;
  border: none;
  color: #cbd5e1;
  cursor: pointer;
  font-size: 14px;
  padding: 6px 12px;
  border-radius: 4px;
  transition: background 0.15s;
}
.theme-toggle:hover {
  background: rgba(255,255,255,0.08);
}

/* ─────────────────────────────────────────────────────────────
   Dark mode — Overrides ciblés pour positions.html (classes
   avec background:#fff hardcodé dans le CSS de la page)
   ───────────────────────────────────────────────────────────── */
:root[data-theme="dark"] .summary,
:root[data-theme="dark"] .summary-block,
:root[data-theme="dark"] .summary-block.total,
:root[data-theme="dark"] .valo-date-banner,
:root[data-theme="dark"] button.secondary,
:root[data-theme="dark"] details.csv-import,
:root[data-theme="dark"] .csv-help,
:root[data-theme="dark"] .csv-body {
  background-color: #1E293B !important;
  color: #F1F5F9 !important;
  border-color: #334155 !important;
}

:root[data-theme="dark"] .valo-date-banner { color: #93C5FD !important; }
:root[data-theme="dark"] .summary-block.total { background-color: #0F172A !important; }
:root[data-theme="dark"] .summary strong { color: #F1F5F9 !important; }

:root[data-theme="dark"] button.secondary { color: #F1F5F9 !important; }
:root[data-theme="dark"] button.secondary:hover { background-color: #0F172A !important; }

:root[data-theme="dark"] .csv-help code,
:root[data-theme="dark"] code { background: #0F172A !important; color: #FBBF24 !important; }

/* Status cell : forcer une couleur lisible pour les noms d'instruments (✓ FDJ United, ...) */
:root[data-theme="dark"] .status-cell { color: #94A3B8 !important; }
:root[data-theme="dark"] .status-cell.ok { color: #34D399 !important; }
:root[data-theme="dark"] .status-cell.warn { color: #FBBF24 !important; }
:root[data-theme="dark"] .status-cell.err { color: #F87171 !important; }

/* Inputs DANS le tableau de positions : forcer le contraste */
:root[data-theme="dark"] table input[type="text"],
:root[data-theme="dark"] table input[type="number"],
:root[data-theme="dark"] table input[type="date"],
:root[data-theme="dark"] table select {
  background: #0F172A !important;
  color: #F1F5F9 !important;
  border: 1px solid #334155 !important;
}

/* Header banner sous nav noire (positions) : "Valorisation au dernier EOD : XXX" */
:root[data-theme="dark"] .valo-date-banner strong { color: #BFDBFE !important; }

/* Card "Mon cash par enveloppe" (inline-style #fff dans positions.html) */
:root[data-theme="dark"] [style*="background:#fff"],
:root[data-theme="dark"] [style*="background: #fff"],
:root[data-theme="dark"] [style*="background:#FFFFFF"] {
  background: #1E293B !important;
  color: #F1F5F9 !important;
}

/* Bouton bleu vif "Modifier mon cash" : garder bleu mais texte blanc visible */
:root[data-theme="dark"] button.primary,
:root[data-theme="dark"] button:not(.secondary):not(.danger):not(.tiny):not(.theme-toggle) {
  background: #3B82F6 !important;
  color: #fff !important;
}

/* Header blanc de positions/admin (sous la nav noire) */
:root[data-theme="dark"] header {
  background: #1E293B !important;
  border-bottom-color: #334155 !important;
}
:root[data-theme="dark"] header h1,
:root[data-theme="dark"] header h2,
:root[data-theme="dark"] header h3 { color: #F1F5F9 !important; }
:root[data-theme="dark"] header a { color: #60A5FA !important; }

/* Tableau positions + login-box */
:root[data-theme="dark"] table.positions,
:root[data-theme="dark"] .login-box {
  background: #1E293B !important;
  color: #F1F5F9 !important;
}
:root[data-theme="dark"] table.positions input,
:root[data-theme="dark"] table.positions select { background: #0F172A !important; color: #F1F5F9 !important; border-color: #334155 !important; }

/* Couleurs muted / placeholder visibles en dark */
:root[data-theme="dark"] .csv-import summary,
:root[data-theme="dark"] .csv-help { color: #CBD5E1 !important; }
:root[data-theme="dark"] .csv-help strong { color: #F1F5F9 !important; }

/* Couleurs muted gris foncé visibles en dark */
:root[data-theme="dark"] [style*="color:#5B6573"],
:root[data-theme="dark"] [style*="color: #5B6573"],
:root[data-theme="dark"] [style*="color:#64748B"],
:root[data-theme="dark"] [style*="color: #64748B"] {
  color: #94A3B8 !important;
}

/* Tooltips info dans modals */
:root[data-theme="dark"] [style*="background:#F1F5F9"],
:root[data-theme="dark"] [style*="background: #F1F5F9"] {
  background: #0F172A !important;
}