/* Chargé EN DERNIER : recouvre le CSS F1 des anciennes pages (jour + nuit). */

html[data-theme="night"] {
  --bg: #1c242c;
  --panel: #262f38;
  --panel2: #2c3640;
  --line: #3d4a56;
  --text: #f3f6f8;
  --muted: #9aa8b4;
  --red: #ff304f;
  --cyan: #23d9ff;
  --green: #42e6a4;
  --gold: #f5c518;
  --shadow: 0 18px 40px #0004;
  --f1-red: var(--red);
  --f1-black: var(--panel2);
  --f1-white: var(--text);
  --f1-grey: var(--panel);
  --f1-shadow: var(--shadow);
  --accent: var(--red);
  --text-light: var(--text);
  --panel-1: var(--panel);
  --panel-2: var(--panel2);
}
html[data-theme="day"] {
  --bg: #e8eef2;
  --panel: #ffffff;
  --panel2: #f4f7f9;
  --line: #c5d0d8;
  --text: #141a1f;
  --muted: #5c6b76;
  --red: #ff304f;
  --cyan: #1aa3c2;
  --green: #1e9a68;
  --gold: #8a5800;
  --shadow: 0 12px 28px #0001;
  --f1-red: var(--red);
  --f1-black: var(--panel2);
  --f1-white: var(--text);
  --f1-grey: var(--panel);
  --f1-shadow: var(--shadow);
  --accent: var(--red);
  --text-light: var(--text);
  --panel-1: var(--panel);
  --panel-2: var(--panel2);
}

html, body {
  background: var(--bg) !important;
  color: var(--text) !important;
  font-family: Inter, ui-sans-serif, system-ui, Segoe UI, sans-serif !important;
}

.navbar { display: none !important; }

.pw-page {
  color: var(--text);
}
.pw-page .container,
.pw-page .container-fluid {
  max-width: 100%;
}

/* Colonnes internes (garage) : ne pas prendre le style du menu gauche */
.pw-page aside {
  position: static !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.pw-page .f1-card,
.pw-page .jv-card,
.pw-page .stat-block,
.pw-page .summary-card,
.pw-page .formula-card,
.pw-page .card:not(.hero-card) {
  background: var(--panel) !important;
  border: 1px solid var(--line) !important;
  color: var(--text) !important;
  box-shadow: var(--shadow) !important;
  border-radius: 12px !important;
}
.pw-page .f1-card-header,
.pw-page .jv-card-header,
.pw-page .f1-card .f1-card-header,
.pw-page .card-header,
.pw-page .modal-header.f1-card-header {
  background: var(--panel2) !important;
  color: var(--text) !important;
  border-bottom: 1px solid var(--line) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.pw-page .f1-card-header::after,
.pw-page .jv-card-header::after,
.pw-page .f1-card .f1-card-header::after {
  display: none !important;
  content: none !important;
  height: 0 !important;
  background: none !important;
}
.pw-page .f1-card-body,
.pw-page .jv-card-body,
.pw-page .card-body {
  color: var(--text) !important;
  background: transparent !important;
}

/* Titres de page : comme Circuits / Radio, pas le hero Accueil */
body:not(.page-champ) .pw-page h1 {
  font-family: Inter, ui-sans-serif, system-ui, Segoe UI, sans-serif;
  font-weight: 900 !important;
  letter-spacing: var(--title-page-tracking, -1.5px) !important;
  font-size: var(--title-page-size, clamp(28px, 4vw, 42px)) !important;
  line-height: 0.95;
  color: var(--text) !important;
}
body.index .pw-page .hero h1 {
  font-size: clamp(34px, 4vw, 64px) !important;
  letter-spacing: -3px !important;
  line-height: 0.92;
  max-width: 700px;
  margin: 10px 0 14px;
}

/* Titres de bloc : Accueil (.section-title h2) */
body:not(.page-champ) .pw-page .section-title h2,
body:not(.page-champ) .pw-page .jv-block-title,
body:not(.page-champ) .pw-page .subtitle-red,
body:not(.page-champ) .pw-page .f1-dash-title,
body:not(.page-champ) .pw-page .f1-filters-title {
  font-size: var(--title-block-size, 14px) !important;
  letter-spacing: var(--title-block-tracking, 1.3px) !important;
  text-transform: uppercase !important;
  font-weight: 900 !important;
  color: var(--cyan) !important;
  padding-left: 10px;
  position: relative;
}
body:not(.page-champ) .pw-page .f1-card-header,
body:not(.page-champ) .pw-page .jv-card-header {
  font-size: var(--title-block-size, 14px) !important;
  letter-spacing: var(--title-block-tracking, 1.3px) !important;
  font-weight: 900 !important;
  text-transform: uppercase;
  color: var(--cyan) !important;
}

.pw-page .muted,
.pw-page .text-muted {
  color: var(--muted) !important;
}

.pw-page table,
.pw-page table.dataTable,
.pw-page .table {
  font-size: var(--table-font, 12px) !important;
  border-collapse: collapse;
  color: var(--text);
  --bs-table-bg: transparent;
  --bs-table-striped-bg: var(--panel2);
  --bs-table-hover-bg: var(--panel2);
  --bs-table-color: var(--text);
  --bs-table-striped-color: var(--text);
  --bs-table-border-color: var(--line);
}
.pw-page table th,
.pw-page table thead th,
.pw-page #eloTable thead th {
  background: transparent !important;
  color: var(--muted) !important;
  font-size: var(--table-th-size, 9px) !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  border-color: var(--line) !important;
  padding: 11px 8px !important;
}
.pw-page table td:not([class*="band-"]),
.pw-page #eloTable td {
  background: transparent !important;
  border-color: var(--line) !important;
  padding: 11px 8px;
  font-size: var(--table-font, 12px);
}
.pw-page table th.is-on,
.pw-page table th.is-sort,
.pw-page #eloTable thead th.is-on {
  color: var(--text) !important;
}

.pw-page .form-control,
.pw-page .form-select,
.pw-page textarea.form-control,
.pw-page .f1-filter-bar input,
.pw-page .f1-filter-bar select {
  background: var(--panel2) !important;
  color: var(--text) !important;
  border: 1px solid var(--line) !important;
}
.pw-page .form-control::placeholder {
  color: var(--muted) !important;
}

.pw-page .modal-content {
  background: var(--panel) !important;
  color: var(--text) !important;
  border: 1px solid var(--line) !important;
}
.pw-page .btn-primary {
  background: var(--red) !important;
  border-color: var(--red) !important;
  color: #fff !important;
}
.pw-page .btn-outline-secondary,
.pw-page aside button.btn:not(.auth-dock-btn):not(.gc-new) {
  background: var(--panel) !important;
  color: var(--text) !important;
  border: 1px solid var(--line) !important;
}

.pw-page #last-races-list .last-race-item {
  background: var(--panel2) !important;
  color: var(--text) !important;
  box-shadow: none !important;
  border: 1px solid var(--line) !important;
}
.pw-page #last-races-list .circuit,
.pw-page #last-races-list .date,
.pw-page #last-races-list .essai,
.pw-page #last-races-list .nb-pilotes,
.pw-page .stat-value {
  color: var(--text) !important;
}
.pw-page #last-races-list .position,
.pw-page .stat-title {
  color: var(--red) !important;
}

.pw-page .garage-images .img-slot {
  background: var(--panel2) !important;
  border: 1px solid var(--line);
}

.dataTables_wrapper,
.dataTables_info,
.dataTables_filter,
.dataTables_length,
.dataTables_paginate {
  color: var(--text) !important;
}

.hof--light,
.pw-page .hof--light {
  background: transparent !important;
  color: var(--text) !important;
}

.pw-page a:not(.btn):not(.nav-link):not(.kpi-link):not(.hero-kpi):not(.play-dl) {
  color: var(--cyan);
}
.pw-page a.play-dl {
  color: var(--text);
}

.modal-content {
  background: var(--panel) !important;
  color: var(--text) !important;
  border: 1px solid var(--line) !important;
}
.modal-header,
.modal-footer {
  background: var(--panel2) !important;
  color: var(--text) !important;
  border-color: var(--line) !important;
}
.modal-title,
.modal-body,
.modal-body p,
.modal-body label,
.modal-body .form-label {
  color: var(--text) !important;
}
[data-theme="night"] .btn-close { filter: invert(1) grayscale(1); }

.pw-page .garage-images .img-slot,
.pw-page .img-slot {
  width: 150px;
  max-width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 8px;
  background: var(--panel2) !important;
  border: 1px solid var(--line);
}
.pw-page .garage-images .img-slot img,
.pw-page .img-slot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.pw-page .gallery-item {
  width: 160px !important;
  height: 100px !important;
  object-fit: cover;
}
.pw-page .meteo-img,
.pw-page .meteo-img--small {
  width: 26px !important;
  height: 26px !important;
  object-fit: contain !important;
}
.pw-page .circuit-main-image img,
.pw-page .circuit-placeholder img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
.pw-page aside .avatar,
.pw-page .f1-profile img.avatar {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 50%;
}

.pw-page .col-left,
.pw-page .opponent-card {
  background: var(--panel) !important;
  color: var(--text) !important;
  border: 1px solid var(--line);
  box-shadow: none !important;
}

[data-theme="day"] .pw-page,
[data-theme="day"] .pw-page .f1-card,
[data-theme="day"] .pw-page .f1-card-body,
[data-theme="day"] .pw-page .jv-card-body,
[data-theme="day"] .pw-page .stat-block,
[data-theme="day"] .pw-page .stat-value,
[data-theme="day"] .pw-page .card-body,
[data-theme="day"] .modal-body {
  color: #141a1f !important;
}
[data-theme="day"] .modal-title {
  color: #141a1f !important;
}
[data-theme="day"] .pw-page .muted,
[data-theme="day"] .pw-page .text-muted {
  color: #5c6b76 !important;
}
[data-theme="night"] .pw-page,
[data-theme="night"] .pw-page .f1-card-body,
[data-theme="night"] .pw-page .stat-value,
[data-theme="night"] .modal-body {
  color: #f3f6f8 !important;
}

body:not(.page-champ) .pw-page .live-count-inline {
  font-size: 14px !important;
  letter-spacing: 0;
  text-transform: none !important;
  font-weight: 800;
  color: var(--muted) !important;
  padding-left: 0;
}
body:not(.page-champ) .pw-page .live-count-inline::before {
  display: none;
}

.drawer { z-index: 1080; }

.is-hero-kpis .f1-dash-item {
  min-width: 0;
  padding: 6px 4px 8px;
  text-align: left;
}
.is-hero-kpis .f1-dash-label {
  position: relative;
  display: block;
  margin: 0 0 4px;
  padding-left: 10px;
  min-height: 2.2em;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.5px;
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--cyan);
}
.is-hero-kpis .f1-dash-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.12em;
  bottom: 0.12em;
  width: 3px;
  border-radius: 99px;
  background: var(--red);
}
.is-hero-kpis .f1-dash-item b {
  display: block;
  margin: 2px 0 3px;
  font-size: 22px;
  font-weight: 950;
  letter-spacing: -0.4px;
  line-height: 1;
  color: var(--text) !important;
}
.is-hero-kpis .f1-dash-item em {
  display: block;
  margin: 0;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--muted);
  text-transform: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.is-hero-kpis .f1-dash-item .bar {
  height: 4px;
  margin-top: 7px;
  background: color-mix(in srgb, var(--line) 80%, #3a4650);
  border-radius: 99px;
  overflow: hidden;
}
.is-hero-kpis .f1-dash-item .bar i {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--red), var(--cyan));
}