/* === BEGIN theme-overrides.css (original) === */
/**
 * THEME OVERRIDES - APPLICATION DES VARIABLES CSS
 * Priorité pour forcer l'utilisation des variables de thème
 * Chargé APRÈS front.css
 */

/* ========================================
   BACKGROUND ET STRUCTURE GÉNÉRALE
   ======================================== */

/* Background principal avec priorité */
body {
  background:
    radial-gradient(1600px 1000px at 15% -10%, var(--panel) 0%, var(--panel-2) 45%, transparent 60%),
    radial-gradient(1400px 1000px at 100% 130%, var(--panel) 0%, var(--panel-2) 50%, transparent 60%),
    var(--bg) !important;

}

/* Tous les panels et cartes */
.card, .panel, .tcard {
  background: linear-gradient(180deg, var(--panel), var(--panel-2)) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
  color: var(--text) !important;
}

/* Container et espacement */
.container {
  gap: var(--gap) !important;
  padding: var(--gap) !important;
}

/* ========================================
   TRANSPORT - ÉLÉMENTS CRITIQUES
   ======================================== */

/* Chips de temps d'attente */
.chip {
  background: var(--chip-bg) !important;
  color: var(--chip-text) !important;
}

/* Badges de numéro de bus */
.line-badge .num {
  background: var(--bus-number-bg) !important;
  color: var(--bus-number-text) !important;
  border: 2px solid var(--bus-number-border) !important;
}

/* Badge RER */
.line-badge .round.letter {
  background: var(--rer-bg) !important;
  color: var(--rer-text) !important;
}

/* Missions et horaires RER */
.rer-mission {
  background: var(--rer-mission-bg) !important;
  color: var(--rer-mission-text) !important;
}

.rer-time {
  background: var(--rer-time-bg) !important;
  color: var(--rer-time-text) !important;
}

/* Tables RER */
.rer-table thead th {
  background: var(--table-header-bg) !important;
  color: var(--table-header-text) !important;
  border-bottom: 1px solid var(--table-border) !important;
}

.rer-panel h4 {
  color: var(--table-header-accent) !important;
  border-left-color: var(--table-header-accent) !important;
}

/* Station names */
.station {
  color: var(--text) !important;
}

/* ========================================
   MÉTÉO - TOUS LES ÉLÉMENTS
   ======================================== */

/* Carte météo principale */
.meteo-card {
  color: var(--text) !important;
}

/* Zone droite météo */
.meteo-right {
  background: var(--meteo-bg-gradient) !important;
  border: 1px solid var(--border) !important;
}

/* Détails météo */
.meteo-kv {
  background: var(--meteo-kv-bg) !important;
  border: 1px solid var(--border) !important;
}

.meteo-kv .k {
  color: var(--muted) !important;
}

.meteo-kv .v {
  color: var(--text) !important;
}

/* Localisation */
.place-tag {
  background: var(--place-bg) !important;
  color: var(--place-text) !important;
  border: 1px solid var(--place-border) !important;
}

/* Température et minmax */
.meteo-top .temp {
  color: var(--text) !important;
}

.meteo-top .minmax {
  color: var(--muted) !important;
}

.meteo-top .minmax b {
  color: var(--text) !important;
}

/* Ligne de pluie */
.meteo-rainline {
  color: var(--meteo-text-primary) !important;
}

/* ========================================
   GRAPHIQUES MÉTÉO - SVG
   ======================================== */

/* Grilles du graphique */
.spark-grid line {
  stroke: var(--spark-grid) !important;
}

.spark-grid-vert line {
  stroke: var(--spark-grid-vert) !important;
}

/* Points et lignes */
.spark-dots circle {
  fill: var(--spark-dots) !important;
}

.spark-axis text {
  fill: var(--spark-text) !important;
}

.spark-path {
  fill: var(--spark-fill) !important;
  stroke: var(--spark-line) !important;
}

/* ========================================
   BADGES MÉTÉO JOUR
   ======================================== */

/* Badge jour principal */
.day {
  background: var(--day-bg) !important;
}

.day h5 {
  color: var(--day-title) !important;
}

/* Badge pluie */
.day .rain {
  background: var(--day-rain-bg) !important;
  color: var(--day-rain-text) !important;
  border-color: var(--day-rain-border) !important;
}

/* Badge vent */
.day .wind {
  background: var(--day-wind-bg) !important;
  color: var(--day-wind-text) !important;
  border-color: var(--day-wind-border) !important;
}

/* ========================================
   BADGES ET STATUTS
   ======================================== */

/* Badges de mise à jour */
.upd-badge {
  background: var(--badge-bg) !important;
  color: var(--badge-text) !important;
  border: 1px solid var(--badge-border) !important;
}

.upd-badge .dot {
  background: var(--badge-dot) !important;
  box-shadow: 0 0 8px var(--badge-dot) !important;
}

/* Badge ticker */
.ticker-badge {
  background: var(--badge-bg) !important;
  color: var(--badge-text) !important;
  border: 1px solid var(--badge-border) !important;
}

/* ========================================
   ALERTES ET TICKER
   ======================================== */

/* Ticker backgrounds */
.ticker.warning,
.ticker-yellow {
  background: var(--ticker-yellow-bg) !important;
  border-color: var(--ticker-yellow-border) !important;
  color: var(--ticker-yellow-text) !important;
}

.ticker.alert,
.ticker-orange {
  background: var(--ticker-orange-bg) !important;
  border-color: var(--ticker-orange-border) !important;
  color: var(--ticker-orange-text) !important;
}

.ticker.critical,
.ticker-red {
  background: var(--ticker-red-bg) !important;
  border-color: var(--ticker-red-border) !important;
  color: var(--ticker-red-text) !important;
}

/* Alertes génériques */
.alert {
  background: var(--alert-bg) !important;
  border: 1px dashed var(--border) !important;
}


/* ========================================
   ANNONCES - ZONE INFOS
   ======================================== */

/* Titre de la zone annonces */
.panel-head .title {
  color: var(--accent) !important;
}

/* Corps du panel */
.panel-body {
  color: var(--text) !important;
}

/* Cartes d'annonces */
.ann-card {
  background: var(--panel) !important;
  border: 1px solid var(--ann-border) !important;
  box-shadow: var(--ann-shadow) !important;
}

.ann-title {
  color: var(--text) !important;
}

.ann-text {
  color: var(--text) !important;
}

.ann-date {
  color: var(--muted) !important;
}

.ann-text a {
  color: var(--accent) !important;
}

/* ========================================
   ÉLÉMENTS COMMUNS - FORCE GLOBALE
   ======================================== */

/* Tous les textes mutés */
.muted,
.text-muted,
.rer-muted {
  color: var(--muted) !important;
}

/* Toutes les bordures */
.border,
[class*="border"] {
  border-color: var(--border) !important;
}

/* Tous les titres et accents */
.title {
  color: var(--accent) !important;
}

/* ========================================
   CORRECTIONS SPÉCIFIQUES PAR THÈME
   ======================================== */

/* Thème sombre - Forcer couleurs de texte */
body[data-theme="dark"] .meteo-card,
body[data-theme="dark"] .meteo-card *,
body[data-theme="dark"] .rer-table,
body[data-theme="dark"] .rer-table *,
body[data-theme="dark"] .tcard,
body[data-theme="dark"] .tcard *,
body[data-theme="dark"] .station {
  color: var(--text) !important;
}

/* Thème nature - ajustements */
body[data-theme="nature"] .ratp-wrap .title,
body[data-theme="nature"] .meteo--compact .title {
  color: var(--accent) !important;
}

/* Thème sunset - ajustements */
body[data-theme="sunset"] .meteo-top .temp {
  color: var(--accent-dark) !important;
}
/* Theme sombre - badge bus */
body[data-theme="dark"] .line-badge .bus-icon {
  background-color: var(--bus-icon-bg);
  stroke: var(--bus-icon-stroke);
}

body[data-theme="dark"] .line-badge .num {
  background-color: var(--bus-number-bg);
  color: var(--bus-number-text);
  border-color: var(--bus-number-border);
}

/* === END theme-overrides.css === */

/* === BEGIN theme-override-ultra.css (original) === */
/**
 * THEME UNIFIED - VERSION OPTIMISÉE
 * CSS de priorité maximale pour l'application des variables de thème
 * À charger APRÈS front.css
 */

/* ========================================
   PRIORITÉ ABSOLUE - RÉINITIALISATION
   ======================================== */

/* Reset des badges bus/RER qui corrige le problème dans tous les thèmes */
.line-badge,
.t-bus .line-badge, 
.t-rer .line-badge {
  background: none !important;
  background-color: transparent !important;
}

/* ========================================
   BACKGROUND ET STRUCTURE GÉNÉRALE
   ======================================== */

/* Background principal */
body {
  background: 
    linear-gradient(
      0deg,
      var(--panel) 0%,
      var(--panel-2) 40%,
      var(--bg) 50%,
      var(--panel-2) 60%,
      var(--panel) 100%
    ) !important;
  background-size: 100% 200% !important;
  background-position: 0 0 !important;
  background-attachment: fixed !important;
      
}

/* Tous les panels et cartes */
.card, .panel, .tcard {
  background: linear-gradient(180deg, var(--panel), var(--panel-2)) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
  color: var(--text) !important;
}

/* Container et espacement */
.container {
  gap: var(--gap) !important;
  padding: var(--gap) !important;
}


/* ========================================
   TRANSPORT - BADGES, CHIPS ET LIGNE
   ======================================== */

/* Application universelle des styles de badges à tous les thèmes */
body[data-theme] .t-bus .line-badge {
  background-color: var(--bus-badge-bg, var(--panel)) !important;
  border: 1px solid var(--bus-badge-border, var(--border)) !important;
}

body[data-theme] .t-rer .line-badge {
  background-color: var(--rer-badge-bg, var(--panel)) !important;
  border: 1px solid var(--rer-badge-border, var(--border)) !important;
}

/* Éléments internes des badges bus */
body[data-theme] .t-bus .line-badge .round {
  background-color: var(--bus-icon-bg, var(--panel)) !important;
}

body[data-theme] .t-bus .line-badge .num {
  background-color: var(--bus-number-bg) !important;
  color: var(--bus-number-text) !important;
  border: 2px solid var(--bus-number-border) !important;
}

/* Éléments internes des badges RER */
body[data-theme] .t-rer .line-badge .round {
  background-color: var(--rer-bg) !important;
  color: var(--rer-text) !important;
}

body[data-theme] .t-rer .line-badge span:not(.round) {
  color: var(--rer-badge-text, var(--text)) !important;
}

/* Chips de temps d'attente */
.chip {
  background: var(--chip-bg) !important;
  color: var(--chip-text) !important;
}

.chip.soon {
  background: var(--warning) !important;
  color: white !important;
}

/* Badge température universel */
body[data-theme] .temperature-badge,
body[data-theme] [id*="temp"], 
body[data-theme] .temp-display {
  background-color: var(--temp-badge-bg, var(--panel)) !important;
  color: var(--temp-badge-text, var(--text)) !important;
  border: 1px solid var(--temp-badge-border, var(--border)) !important;
}

/* Station names */
.station {
  color: var(--text) !important;
}

/* ========================================
   RER - MISSIONS, HORAIRES ET TABLES
   ======================================== */

/* Missions et horaires RER */
.rer-mission {
  background: var(--rer-mission-bg) !important;
  color: var(--rer-mission-text) !important;
}

.rer-time {
  background: var(--rer-time-bg) !important;
  color: var(--rer-time-text) !important;
}

/* Tables RER */
.rer-table thead th {
  background: var(--table-header-bg) !important;
  color: var(--table-header-text) !important;
  border-bottom: 1px solid var(--table-border) !important;
}
.rer-table thead th:last-child{
  text-align: right;
}

.rer-panel h4 {
  color: var(--table-header-accent) !important;
  border-left-color: var(--table-header-accent) !important;
}

/* ========================================
   MÉTÉO - COMPOSANTS PRINCIPAUX
   ======================================== */

/* Carte météo principale */
.meteo-card {
  color: var(--text) !important;
}

/* Zone droite météo */
.meteo-right {
  background: var(--meteo-bg-gradient) !important;
  border: 1px solid var(--border) !important;
}

/* Détails météo */
.meteo-kv {
  background: var(--meteo-kv-bg) !important;
  border: 1px solid var(--border) !important;
}

.meteo-kv .k {
  color: var(--muted) !important;
}

.meteo-kv .v {
  color: var(--text) !important;
}

/* Localisation */
.place-tag {
  background: var(--place-bg) !important;
  color: var(--place-text) !important;
  border: 1px solid var(--place-border) !important;
}

/* Température et minmax */
.meteo-top .temp {
  color: var(--text) !important;
}

.meteo-top .minmax {
  color: var(--muted) !important;
}

.meteo-top .minmax b {
  color: var(--text) !important;
}

/* Ligne de pluie */
.meteo-rainline {
  color: var(--meteo-text-primary) !important;
}

/* ========================================
   GRAPHIQUES MÉTÉO - SVG
   ======================================== */

/* Grilles du graphique */
.spark-grid line {
  stroke: var(--spark-grid) !important;
}

.spark-grid-vert line {
  stroke: var(--spark-grid-vert) !important;
}

/* Points et lignes */
.spark-dots circle {
  fill: var(--spark-dots) !important;
}

.spark-axis text {
  fill: var(--spark-text) !important;
}

.spark-path {
  fill: var(--spark-fill) !important;
  stroke: var(--spark-line) !important;
}

/* ========================================
   BADGES MÉTÉO JOUR
   ======================================== */

/* Badge jour principal */
.day {
  background: var(--day-bg) !important;
}

.day h5 {
  color: var(--day-title) !important;
}

/* Badge pluie */
.day .rain {
  background: var(--day-rain-bg) !important;
  color: var(--day-rain-text) !important;
  border-color: var(--day-rain-border) !important;
}

/* Badge vent */
.day .wind {
  background: var(--day-wind-bg) !important;
  color: var(--day-wind-text) !important;
  border-color: var(--day-wind-border) !important;
}

/* ========================================
   BADGES ET STATUTS
   ======================================== */

/* Badges de mise à jour */
.upd-badge {
  background: var(--badge-bg) !important;
  color: var(--badge-text) !important;
  border: 1px solid var(--badge-border) !important;
}

.upd-badge .dot {
  background: var(--badge-dot) !important;
  box-shadow: 0 0 8px var(--badge-dot) !important;
}

/* Badge ticker */
.ticker-badge {
  background: var(--badge-bg) !important;
  color: var(--badge-text) !important;
  border: 1px solid var(--badge-border) !important;
}

/* ========================================
   ALERTES ET TICKER
   ======================================== */

/* Ticker backgrounds */
.ticker.warning,
.ticker-yellow {
  background: var(--ticker-yellow-bg) !important;
  border-color: var(--ticker-yellow-border) !important;
  color: var(--ticker-yellow-text) !important;
}

.ticker.alert,
.ticker-orange {
  background: var(--ticker-orange-bg) !important;
  border-color: var(--ticker-orange-border) !important;
  color: var(--ticker-orange-text) !important;
}

.ticker.critical,
.ticker-red {
  background: var(--ticker-red-bg) !important;
  border-color: var(--ticker-red-border) !important;
  color: var(--ticker-red-text) !important;
}

/* Alertes génériques */
.alert {
  background: var(--alert-bg) !important;
  border: 1px dashed var(--border) !important;
}

/* ========================================
   ANNONCES - ZONE INFOS
   ======================================== */

/* Titre de la zone annonces */
.panel-head .title {
  color: var(--accent) !important;
}

/* Corps du panel */
.panel-body {
  color: var(--text) !important;
}

/* Cartes d'annonces */
.ann-card {
  background: var(--panel) !important;
  border: 1px solid var(--ann-border) !important;
  box-shadow: var(--ann-shadow) !important;
}

.ann-title {
  color: var(--text) !important;
}

.ann-text {
  color: var(--text) !important;
}

.ann-date {
  color: var(--muted) !important;
}

.ann-text a {
  color: var(--accent) !important;
}

/* ========================================
   ÉLÉMENTS COMMUNS - FORCE GLOBALE
   ======================================== */

/* Tous les textes mutés */
.muted,
.text-muted,
.rer-muted {
  color: var(--muted) !important;
}

/* Toutes les bordures */
.border,
[class*="border"] {
  border-color: var(--border) !important;
}

/* Tous les titres et accents */
.title {
  color: var(--accent) !important;
}

/* ========================================
   CORRECTIONS SPÉCIFIQUES PAR THÈME
   ======================================== */

/* Thème sombre - Forcer couleurs de texte */
body[data-theme="dark"] .meteo-card,
body[data-theme="dark"] .meteo-card *,
body[data-theme="dark"] .rer-table,
body[data-theme="dark"] .rer-table *,
body[data-theme="dark"] .tcard,
body[data-theme="dark"] .tcard *,
body[data-theme="dark"] .station,
body[data-theme="dark"] .rer-table tbody td {
  color: var(--text) !important;
}

/* Thème nature - ajustements */
body[data-theme="nature"] .ratp-wrap .title,
body[data-theme="nature"] .meteo--compact .title {
  color: var(--accent) !important;
}

/* Thème sunset - ajustements */
body[data-theme="sunset"] .meteo-top .temp {
  color: var(--accent-dark) !important;
}



/* ========================================
   TRANSITION ET ANIMATION
   ======================================== */
* {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}


/* === END theme-override-ultra.css === */
