@charset "utf-8";
/* CSS Auto Compilé */
:root {
  --man_color: #4AA1DA;
  --woman_color: #F756FF;
  --bkcolor_1: #FFFFFF;
  --color_1: #DE4C4D;
  --bkcolor_2: #DE4C4D;
  --color_2: #FFFFFF;
  --bkcolor_3: #2B4A54;
  --color_3: #FFFFFF;
  --bkcolor_4: #DE4C4D;
  --color_4: #FFFFFF;
  --bkcolor_5: #363636;
  --color_5: #FFFFFF;
  --bkcolor_6: #DE4C4D;
  --color_6: #FFFFFF;
  --app_color: #E14E4D;
  --bkcolor_7: #000;
  --color_7: #FFF;
  --bkcolor_8: #3D3D3D;
  --bkcolor_9: #3F5E68;
  --bkcolor_10: #000000;
  --bkcolor_11: #FFFFFF;
  --color_12: #FFFFFF;
  --color_13: #FFFFFF;
  --bkcolor_14: #DE4C4D;
  --color_15: #FFFFFF;
  --bkcolor_16: #5E7D87;
  --bkcolor_17: #FFFFFF;
  --bkcolor_18: #000000;
  --bkcolor_20: #FFFFFF;
  --color_20: #000000;
  --color_21: #2A2D33;
  --color_22: #2A2D33;
  --color_23: #2A2D33;
  --bkcolor_24: #DE4C4D;
  --bkcolor_26: #8B8B8B;
  --font_1: Arial;
  --font_1_url: [FONT1_URL];
  --font_2: [FONT2];
  --font_2_url: [FONT2_URL];
  --font_3: [FONT3];
  --font_3_url: [FONT3_URL];
  --font_4: [FONT4];
  --font_4_url: [FONT4_URL];
  --font_5: [FONT5];
  --font_5_url: [FONT5_URL];
  --font_6: [FONT6];
  --font_6_url: [FONT6_URL];
  --font_7: [FONT7];
  --font_7_url: [FONT7_URL];
}
/* =====================================================================
   Results (Meilleurs temps) — la page timing des classements filtrables.
   Titre/compteur + recherche, filtres ax-select (piste, kart, genre,
   période avec sous-intervalles), tableau .ranking_table dans une carte,
   pagination ajax. Top bar 70px + onglets famille 44px.
   ===================================================================== */
body > .body {
  padding-top: 140px;
  /* top bar 70px + onglets 44px + air */
}
/* styles_ax fige .ax-body à 356px sous 850px : pleine largeur pour le tableau */
@media (max-width: 850px) {
  .ax-body {
    width: calc(100% - 20px);
  }
}
/* =====================================================================
   Onglets enfants de la famille timing, fixés sous la top bar (70px).
   Défilent horizontalement quand il y en a beaucoup.
   Copie locale — même bloc dans styles_leaderboards.less, garder en phase.
   ===================================================================== */
.ax-top_bar_tabs {
  position: fixed;
  top: 70px;
  left: 0;
  right: 0;
  z-index: 999999;
  /* juste sous la .ax-top_bar */
  display: flex;
  gap: 5px;
  height: 44px;
  padding: 0 15px;
  background-color: var(--bkcolor_brightness_2);
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.09);
  overflow-x: auto;
  scrollbar-width: none;
}
.ax-top_bar_tabs::-webkit-scrollbar {
  display: none;
}
.ax-top_bar_tabs a {
  display: flex;
  align-items: center;
  padding: 0 18px;
  border-bottom: 3px solid transparent;
  color: var(--color_brightness);
  font-size: 14rem;
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}
.ax-top_bar_tabs a:hover {
  color: var(--bkcolor_main);
}
.ax-top_bar_tabs a.active {
  color: var(--bkcolor_main);
  border-bottom-color: var(--bkcolor_main);
}
/* ---- Titre/compteur + recherche ---- */
.results_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  flex-wrap: wrap;
  /* la recherche passe dessous quand c'est étroit */
}
.results_title {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.results_search {
  flex-shrink: 0;
  width: 220px;
  margin-left: auto;
  /* reste à droite même compteur masqué (space-between n'a alors plus qu'un enfant) */
}
@media (max-width: 400px) {
  .results_search {
    width: 100%;
  }
}
.results_search input {
  padding-right: 40px;
  /* la place de la loupe */
}
.results_search .search_button {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 40px;
  border: none;
  background: none;
  cursor: pointer;
  color: inherit;
  opacity: 0.6;
}
.results_search .search_button:hover {
  opacity: 1;
}
.results_search .search_button::before {
  content: "\f002";
  font-family: 'fontawesome bold';
  font-size: 15rem;
}
/* pseudo introuvable (data-error posé par le js) : le triangle d'erreur ax prend la place de la loupe */
.results_search[data-error] input {
  color: #d32f2f;
}
.results_search[data-error] .search_button {
  display: none;
}
/* ---- Filtres ---- */
.results_filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  margin-top: 15px;
}
/* ---- La carte du tableau ---- */
.results_card {
  position: relative;
  /* ancre le ax-loader */
  margin-top: 15px;
  padding-top: 15px;
  padding-bottom: 15px;
}
.results_card[data-loading] #results {
  opacity: 0.35;
  pointer-events: none;
  transition: opacity 0.15s ease;
}
.results_card[data-loading] .results_loader {
  display: block;
}
.results_card .ax-block_content-message {
  text-align: center;
}
/* =====================================================================
   Tableau de classement (.ranking_table) : entêtes, lignes cliquables,
   rangs 1/2/3 en médailles, ligne du membre connecté surlignée (.active,
   posée par js). Le conteneur (carte ax) reste à la charge de la page.
   Copie locale — même bloc dans styles_leaderboards.less, garder en phase.
   ===================================================================== */
:root {
  --ranking_border: color-mix(in srgb, var(--color_brightness) 12%, transparent);
  /* Or / argent / bronze — mêmes teintes que le mini leaderboards */
  --ranking_gold: #fbb610;
  --ranking_silver: #a4aeba;
  --ranking_bronze: #e9a35b;
}
.ranking_table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14rem;
}
.ranking_table th {
  padding: 6px 8px;
  font-size: 11rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-align: center;
  /* toutes les colonnes centrées, sauf le pseudo */
  opacity: 0.55;
}
.ranking_table th.pseudo {
  text-align: left;
}
.ranking_table td {
  padding: 7px 8px;
  border-top: 1px solid var(--ranking_border);
}
/* ---- Colonnes (centrées sous leurs titres, le pseudo absorbe la largeur) ---- */
.ranking_table .rank,
.ranking_table .kart,
.ranking_table .date,
.ranking_table .sector,
.ranking_table .value {
  text-align: center;
}
.ranking_table .rank {
  width: 34px;
  padding-left: 0;
}
.ranking_table .pseudo {
  font-weight: 600;
  /* la colonne qui absorbe la largeur ; width 100% + max-width 0 = ellipsis en table auto */
  width: 100%;
  max-width: 0;
  white-space: nowrap;
  overflow: hidden;
}
/* l'ellipsis est sur le nom et pas sur la cellule : un nom long ne pousse pas le volant hors de vue */
.ranking_table .pseudo .name {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
}
.ranking_table .pseudo:has(.skill_wheel) .name {
  max-width: calc(100% - 26px);
  /* la place du volant du niveau : 18px + 8px de margin */
}
/* non-membre (pas de clic) : pseudo discret, comme l'ancienne page */
.ranking_table tbody tr:not([onclick]) .pseudo {
  font-weight: normal;
  opacity: 0.8;
}
.ranking_table .date {
  white-space: nowrap;
  font-size: 12rem;
}
.ranking_table .sector {
  white-space: nowrap;
  font-size: 12rem;
  /* comme la date : les temps intermédiaires en retrait du temps final */
  font-variant-numeric: tabular-nums;
}
/* ---- Chip kart (colonne kart des lignes, ou entête de carte des leaderboards) ---- */
.kart_chip {
  display: inline-block;
  max-width: 110px;
  box-sizing: border-box;
  padding: 2px 10px;
  /* demi-hauteur de la chip x % du thème -> carré / arrondi / pilule bien distincts */
  border-radius: calc(11px * var(--border_radius_percent, 100) / 100);
  font-size: 11rem;
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
/* ---- Volant du niveau du pilote (statuts 3/4/5), comme l'ancienne page résultats ---- */
.ranking_table .pseudo .skill_wheel {
  width: 18px;
  height: 18px;
  box-sizing: border-box;
  padding: 2px;
  /* le dessin du volant remplit tout le png : sans marge il touche le bord de la pastille */
  margin-left: 8px;
  border-radius: 50%;
  background-color: #1d1d1d;
  /* pastille sombre : les volants jaunes ressortent sur les deux thèmes */
  vertical-align: text-top;
}
/* ---- Pagination sous le tableau (première page / -20 / +20 / dernière page) ---- */
.ranking_pagination {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 12px;
}
.ranking_pagination [data-page] {
  width: 34px;
  height: 34px;
  padding: 0;
}
.ranking_pagination [data-page]::before {
  font-family: 'fontawesome bold';
  font-size: 12rem;
}
.ranking_pagination [data-page="first"]::before {
  content: "\f048";
}
.ranking_pagination [data-page="previous"]::before {
  content: "\f04a";
}
.ranking_pagination [data-page="next"]::before {
  content: "\f04e";
}
.ranking_pagination [data-page="last"]::before {
  content: "\f051";
}
.ranking_table .value {
  font-weight: 800;
  /* le temps ressort à la couleur du centre, sans fond ni filet */
  color: var(--bkcolor_main);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
/* Sur grand écran les colonnes chiffres respirent (le pseudo absorbe le reste) */
@media (min-width: 850px) {
  .ranking_table .date,
  .ranking_table .sector,
  .ranking_table .value {
    padding-left: 22px;
    padding-right: 22px;
  }
}
/* ---- Médaille du rang : pleine pour 1/2/3, numéro simple ensuite.
   Suit le niveau d'arrondi du thème (carré / arrondi / rond). ---- */
.ranking_table .rank span {
  display: inline-block;
  min-width: 24px;
  /* la pastille ronde ; un rang à 3+ chiffres l'élargit (padding) au lieu de déborder sur le kart */
  height: 24px;
  line-height: 24px;
  padding: 0 4px;
  /* compté dans min-width (border-box global) */
  border-radius: calc(12px * var(--border_radius_percent, 100) / 100);
  text-align: center;
  font-weight: bold;
}
.ranking_table .rank_1 .rank span {
  background-color: var(--ranking_gold);
  color: #fff;
}
.ranking_table .rank_2 .rank span {
  background-color: var(--ranking_silver);
  color: #fff;
}
.ranking_table .rank_3 .rank span {
  background-color: var(--ranking_bronze);
  color: #fff;
}
/* ---- Survol d'une ligne cliquable et membre connecté (classe .active posée
   côté client, la page est en cache) : la même pastille, ancrée en overlay sur
   la ligne (une tr ne prend pas de border-radius), arrondie selon le thème et
   élargie de 6px pour ne pas coller la médaille ni la valeur.
   Survol = fond discret · membre connecté = anneau à la couleur du thème. ---- */
.ranking_table tbody tr[onclick] {
  cursor: pointer;
}
.ranking_table tbody tr[onclick],
.ranking_table tbody tr.active {
  position: relative;
  z-index: 0;
  /* la pastille en z-index -1 reste devant le fond de la carte */
}
.ranking_table tbody tr[onclick] td:first-child::after,
.ranking_table tbody tr.active td:first-child::after {
  content: "";
  position: absolute;
  inset: 0 -6px;
  z-index: -1;
  /* derrière le texte de la ligne */
  border-radius: calc(10px * var(--border_radius_percent, 100) / 100);
  pointer-events: none;
}
.ranking_table tbody tr[onclick]:hover td:first-child::after {
  background-color: var(--ranking_border);
}
/* au survol le pseudo se teinte suivant le sexe (bleu homme / rose femme), mêmes teintes que l'ancienne page */
.ranking_table tbody tr[data-sex="1"]:hover .pseudo {
  color: #4aa1da;
}
.ranking_table tbody tr[data-sex="2"]:hover .pseudo {
  color: #F756FF;
}
.ranking_table tbody tr.active td:first-child::after {
  border: 2px solid var(--bkcolor_main);
}
.ranking_table tbody tr.active .pseudo {
  color: var(--bkcolor_main);
}
/* Mobile : le tableau reste dans le padding de la carte, les lignes de
   séparation gardent donc une marge sur les côtés (jamais bord à bord) */
/* ---- Colonnes secondaires masquées quand c'est étroit (le tableau garde
   clt / kart / pseudo / temps, comme l'ancienne page) ---- */
@media (max-width: 768px) {
  .ranking_table .sector {
    display: none;
  }
}
@media (max-width: 560px) {
  .ranking_table .date {
    display: none;
  }
}
@media (max-width: 430px) {
  .ranking_table .kart {
    display: none;
  }
}