/* ==========================================================
   🧱 MAIN CONTENT
   ========================================================== */
.athlete-profile-main-content {
    margin-left: calc(5rem + 1rem) !important;
    margin-right: 1rem !important;  
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
}

/* ==========================================================
   🃏 CARDS
   ========================================================== */
.athlete-profile-card {
    background-color: #ffffff !important;
    border-radius: 6px !important;
    padding: 1.2rem !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08),
                0 8px 20px rgba(0, 0, 0, 0.06) !important;
}

/* --- Card Header --- */
.athlete-profile-card-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    margin-bottom: 1rem !important;
    flex-wrap: wrap !important;
    gap: 0.8rem !important;
}

/* --- Top right component --- */
.athlete-profile-card-top-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
}

/* --- Card content --- */
.athlete-profile-card-content {
    max-width: 100% !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    box-sizing: border-box !important;
}

/* --- Objectif Card --- */
.athlete-profile-objective-card {
    background-color: var(--ffbad-bg-light) !important;
    border: 1px solid var(--ffbad-blue) !important;
    border-radius: 6px !important;
    padding: 0.8rem 0.8rem !important;
    box-sizing: border-box !important;

    overflow-x: auto !important;   /* scroll horizontal */
    overflow-y: hidden !important; /* pas de scroll vertical */
    max-width: 100% !important;
}

/* ==========================================================
   🎯 SECTIONS
   ========================================================== */
.athlete-profile-section-top {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
    align-items: flex-start !important;
}

.athlete-profile-card-profile {
    flex: 1 1 400px !important;
    max-width: 400px !important;
    min-width: 300px !important;
}

.athlete-profile-card-environment {
    flex: 1 1 500px !important;
    min-width: 300px !important;
}

/* Classement / Résultats */
.athlete-profile-section-planning-para {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
    align-items: flex-start !important;
}

.athlete-profile-card-planning-para,
.athlete-profile-card-funding-para {
    flex: 1 1 500px !important;
    min-width: 300px !important;
}

/* Classement / Résultats */
.athlete-profile-section-ranking {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
    align-items: flex-start !important;
}

.athlete-profile-card-ranking,
.athlete-profile-card-results {
    flex: 1 1 500px !important;
    min-width: 300px !important;
}

/* Objectifs de développement */
.athlete-profile-section-development {
    display: flex !important;
    flex-direction: column !important;
}

.athlete-profile-card-development {
    width: 100% !important;
    min-width: 300px !important;
}

/* ---- Bas de page : grille flexible ---- */
.athlete-profile-section-bottom {
    display: flex !important;
     flex-wrap: wrap !important;
    gap: 1rem !important;
}

/* ---- Chaque colonne ---- */
.athlete-profile-col-left,
.athlete-profile-col-right {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 500px !important;  /* largeur idéale */
    min-width: 300px !important; /* largeur minimale */
    gap: 1rem !important;
}

.athlete-profile-col-left > *:not(:last-child),
.athlete-profile-col-right > *:not(:last-child) {
    margin-bottom: 0 !important;
}

/* ==========================================================
   🧾 HEADERS
   ========================================================== */
.athlete-profile-card-sub-header-blue {
    font-size: 14px !important;
    font-weight: bold !important;
    color: var(--ffbad-blue-light) !important;
    /* margin: 0 !important; */
    letter-spacing: 0.3px !important;
}

.athlete-profile-card-sub-header-red {
    font-size: 14px !important;
    font-weight: bold !important;
    color: var(--ffbad-red-light) !important;
    /* margin: 0 !important; */
    letter-spacing: 0.3px !important;
}

.athlete-profile-card-sub-header-blue-small {
    font-size: 12px !important;
    font-weight: bold !important;
    color: var(--ffbad-blue-light) !important;
    /* margin: 0 !important; */
    letter-spacing: 0.3px !important;
}

.athlete-profile-card-sub-header-red-small {
    font-size: 12px !important;
    font-weight: bold !important;
    color: var(--ffbad-red-light) !important;
    /* margin: 0 !important; */
    letter-spacing: 0.3px !important;
}

/* ==========================================================
   🔘 BUTTON
   ========================================================== */
.athlete-profile-button-outline-red {
    background-color: transparent !important;
    border: 1px solid var(--ffbad-red) !important;
    color: var(--ffbad-red) !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    padding: 0.3rem 0.8rem !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
    transition: all 0.2s ease-in-out !important;
}

.athlete-profile-button-outline-red:focus,
.athlete-profile-button-outline-red:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

.athlete-profile-button-outline-red:hover {
    background-color: var(--ffbad-red) !important;
    color: #ffffff !important;
    border-color: var(--ffbad-red) !important;
    box-shadow: 0 0 6px rgba(213, 43, 30, 0.3) !important;
}

.athlete-profile-button-outline-red:active {
    transform: scale(0.92) !important;
    background-color: #b1221d !important;
    border-color: #b1221d !important;
    border-radius: 8px !important;
}

.athlete-profile-button-outline-red i {
    font-size: 12px !important;
}


/* ==========================================================
   🟦 HR
   ========================================================== */
.athlete-profile-hr-blue {
    border: none !important;
    border-top: 2px solid var(--ffbad-blue-light) !important;
    border-radius: 2px !important;
    width: 90% !important;
    margin: 1rem auto !important;
    opacity: 1 !important;
}

.athlete-profile-hr-blue-low-margin {
    border: none !important;
    border-top: 2px solid var(--ffbad-blue-light) !important;
    border-radius: 2px !important;
    width: 95% !important;
    margin: 0.4rem auto !important;
    opacity: 1 !important;
}

.athlete-profile-hr-blue-small {
    border: none !important;
    border-top: 2px solid var(--ffbad-blue-light) !important;
    border-radius: 2px !important;
    width: 70% !important;
    margin: 0.5rem auto !important;
    opacity: 1 !important;
}

.athlete-profile-hr-red {
    border: none !important;
    border-top: 2px solid var(--ffbad-red-light) !important;
    border-radius: 2px !important;
    width: 90% !important;
    margin: 1rem auto !important;
    opacity: 1 !important;
}


/* ==========================================================
   🔴 Accès interdit
   ========================================================== */
.athlete-profile-access-denied {
    color: var(--ffbad-blue-light) !important;
    font-weight: bold !important;
    text-align: left !important;
    font-size: 14px !important;
    font-style: italic !important;
}

/* ==========================================================
   🔴 Carte Profil
   ========================================================== */
/* === Structure globale === */
.profile-card-athlete-profile {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    gap: 0rem !important;
}

/* === Ligne haute : photo + nom/pays === */
.profile-top-athlete-profile {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 1rem !important;
    width: 100% !important;
}

.profile-photo-athlete-profile {
    flex: 0 0 150px !important;
    width: 150px !important;
    height: 150px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
}

.profile-identity-athlete-profile {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    flex: 1 !important;
    gap: 0.2rem !important;
}

.profile-country-athlete-profile {
    display: flex !important;
    align-items: center !important;
    gap: 0.3rem !important;
}

.profile-flag-athlete-profile {
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    object-fit: fill !important;
    overflow: hidden !important;
    border: 1px solid #ccc !important; /* effet clean sur fond blanc */
    display: inline-block !important;
}

/* === Ligne basse : Âge + Main === */
.profile-info-row-athlete-profile {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    gap: 1rem !important;
    width: 100% !important;
    flex-wrap: wrap !important;
}

.profile-info-block-athlete-profile {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    flex: 1 1 45% !important;
}

.hand-icon-athlete-profile {
    max-height: 50px !important;
    width: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important; /* pour centrer l’icône dans son bloc */
}

/* ==========================================================
   🔴 Carte Environnement
   ========================================================== */
.environment-container-athlete-profile {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1.5rem !important;
    justify-content: space-between !important; 
    width: 100% !important;
}

.environment-column-athlete-profile {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 150px !important;
    align-items: center !important; 
    text-align: center !important;  
    gap: 1rem !important;
}

.environment-item-athlete-profile {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}

.environment-item-value {
    margin-top: 3px !important;
    font-size: 12px !important;
    font-weight: bold !important;
    color: var(--ffbad-blue) !important;
}

.environment-updated-date {
    width: 100% !important;
    text-align: right !important;
    font-size: 12px !important;
    font-style: italic !important;
    color: var(--ffbad-blue-light) !important;
    margin-top: 0.3rem !important;
}

/* === MODAL HISTORIQUE ENVIRONNEMENT === */
/* Boîte principale (taille, bordure, ombre, centrage) */
.history-modal-athlete-profile {
    border-radius: 6px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25) !important;
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

/* Control the dialog width to 80% of the viewport */
.history-modal-athlete-profile .modal-dialog {
  max-width: 70vw !important;   /* hard limit */
  width: 70vw !important;       /* target width */
  margin: 1.75rem auto;         /* keep it centered horizontally */
}

/* Le vrai contenu du modal (scrollable) */
.history-modal-athlete-profile .modal-content {
    border: none !important;      /* on enlève la bordure interne Bootstrap */
    background: transparent !important;  /* transparent pour voir le fond du dialog */
    box-shadow: none !important;
    overflow-y: auto !important;
    flex: 1 !important;
    padding: .5em;
}

.history-modal-athlete-profile .modal-header {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  border-bottom: none
}

/* Responsive fallback: use full width on very small screens */
@media (max-width: 576px) {
  .history-modal-athlete-profile .modal-dialog {
    width: 95vw !important;
    max-width: 95vw !important;
    margin: 0.5rem auto;
  }
}


/* === CONTENEUR GLOBAL DU MODAL === */
.history-modal-athlete-profile-body {
    padding: 1rem !important;
    background: #fff !important;
    overflow-y: auto !important;
}

/* === BLOCS COLLAPSABLES === */
.history-modal-athlete-profile-block {
    border: 1px solid #e0e0e0 !important;
    border-radius: 6px !important;
    padding: 0.75rem 1rem !important;
    margin-bottom: 1rem !important;
    background-color: #fafafa !important;
}

.history-modal-athlete-profile-summary {
    font-weight: bold  !important;
    font-size: 15px  !important;
    color: var(--ffbad-blue)  !important;
    cursor: pointer  !important;
}

.history-modal-athlete-profile-summary:hover {
    color: var(--ffbad-red-light) !important;
}

.history-modal-athlete-profile-row-extra {
    margin-top: 0.7rem !important;
    border-top: 1px dashed var(--ffbad-blue-light) !important;
    padding-top: 0.5rem !important;
    text-align: center !important;
}

.history-modal-athlete-profile-empty {
    font-style: italic !important;
    color: #666 !important;
    margin: 1rem 0 !important;
}

/* ==========================================================
   🎨 AG GRID - Thème FFBaD (Historique Environnement)
   ========================================================== */
.ag-theme-alpine.history-modal-athlete-profile-aggrid {
    --ag-background-color: #ffffff;
    --ag-header-background-color: var(--ffbad-blue, #101F69);
    --ag-header-foreground-color: white;
    --ag-border-color: #bfc5d1;
    --ag-font-family: "Open Sans", sans-serif;
    --ag-row-hover-color: #f2f6ff;
    border: 1.5px solid #bfc5d1;
    border-radius: 6px;
    font-family: "Open Sans", sans-serif;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* === EN-TÊTES === */
.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-header {
    border-bottom: 2px solid #bfc5d1 !important; /* ligne plus visible sous le header */
}

.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-icon {
    color: white !important; /* ligne plus visible sous le header */
}

/* === EN-TÊTES === */
.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-header-cell-label {
    justify-content: center;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: white !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px;
    white-space: nowrap !important;
}

/* === FIX TEXTE COUPÉ === */
.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-cell-wrapper {
    height: 100% !important;
}

/* 1️⃣ Force la cellule à agir comme une boîte à ellipsis */
.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-cell {
    display: block !important;             /* au lieu de flex */
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-align: center !important;
    font-size: 12px;
    color: var(--ffbad-blue, #101F69) !important;
    padding: 2px 4px !important;
}

/* 2️⃣ Laisse le contenu s'afficher à gauche (début visible) */
.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-cell-value {
    display: inline-block !important;
    vertical-align: middle !important;
    text-align: center !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    width: 100% !important;
}

/* === ZEBRA STRIPING === */
.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-row-odd {
    background-color: #f9fbff !important;  /* bleu très clair pour contraste doux */
}

.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-row-even {
    background-color: #ffffff !important;
}

.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-row {
    border-bottom: 1px solid #e5e8ef ;
}

/* === ALIGNEMENT INTERNE (texte bien centré verticalement) === */
.ag-theme-alpine.history-modal-athlete-profile-aggrid .ag-cell-value {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Taille de police spécifique uniquement pour les cellules du tableau trajectoire */
.ag-theme-alpine.history-modal-athlete-profile-aggrid .traj-perf-cell {
    font-size: 14px !important;
    line-height: 16px !important;
}

/* ==========================================================
   🎨 Carte Classement
   ========================================================== */
/* --- container du top --- */
.ranking-top-container-athlete-profile {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
    width: 100% !important;
    align-items: flex-start !important;
}

/* --- box gauche : 175px fixe --- */
.ranking-left-box-athlete-profile {
    width: 175px !important;
    min-width: 175px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.25rem !important;
    background-image: url(../../images/from_application/images/rank_frame.svg) !important;
    background-position: center 0 !important;
    background-repeat: no-repeat !important;
    padding-top: 30px !important;
    text-align: center !important;
}

.ranking-left-box-blue-athlete-profile {
    width: 175px !important;
    min-width: 175px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.25rem !important;
    background-image: url(../../images/from_application/images/rank_frame_blue.svg) !important;
    background-position: center 0 !important;
    background-repeat: no-repeat !important;
    padding-top: 30px !important;
    text-align: center !important;
}

/* --- box droite : prend le reste, mais wrap si < 250px --- */
.ranking-right-box-athlete-profile {
    flex: 1 1 250px !important;
    min-width: 250px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.25rem !important;
    text-align: center !important;
}

/* --- radio menu inline --- */
.ranking-radio-wrapper-athlete-profile {
    display: flex !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    width: 100% !important;
}

.rank-table-row {
    display: flex !important;
    flex-wrap: wrap !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    box-sizing: border-box !important;
    font-size: 10px !important;
    align-items: center !important;
    padding: 4px 6px !important;
    border: 1px solid #DDD;
    border-radius: 6px !important;
    margin-bottom: 4px !important;
    gap: 8px !important;
}

.rank-table-col-year {
    width: 55px !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;       /* <<< ne casse jamais */
}

.rank-table-col-name {
    min-width: 100px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;       /* ... */
    flex-grow: 1 !important;
    flex-basis: 80px !important;
}

.rank-table-col-points {
    width: 30px !important;
    flex-shrink: 0 !important;
    text-align: right !important;
    white-space: nowrap !important;        /* <<< ne casse jamais */
}

.rank-table-col-result {
    width: 30px !important;
    flex-shrink: 0 !important;
    text-align: left !important;
    white-space: nowrap !important;        /* <<< empêche le retour à la ligne */
}

.rank-table-container {
    display: flex !important;
    gap: 1rem !important;
    flex-wrap: wrap !important;
}

.rank-table-block {
    flex: 1 1 250px !important;
    min-width: 200px !important;      /* <<< protège l’apparence “tableau” */
    box-sizing: border-box !important;
}

/* Ligne grisée = tournois non utilisés dans le calcul */
.rank-table-row-reserve {
    background-color: #f3f3f3 !important;   /* gris clair */
    color: #666 !important;                 /* texte légèrement estompé */
    border-color: #e0e0e0 !important;       /* bordure plus douce */
}

/* ==========================================================
   🎨 Carte Résultats
   ========================================================== */
.results-objective-athlete-profile {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.25rem !important;
    text-align: center !important;
}

/* La grande carte objectifs (2 étages Seniors + Jeunes) */
.objective-badge-container {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.75rem !important;
    justify-content: center !important;
    align-items: stretch !important;
    width: 100% !important;
    margin-top: 0.5rem !important;
}

.objective-badge-card {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
    padding: 0.6rem 0.8rem !important;

    background: #FFFFFF !important;
    border-radius: 6px !important;

    min-width: 120px !important;
    max-width: 220px !important;

    box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;

    box-sizing: border-box !important;
}

/* --- Catégorie : S1000, S300, WJC, etc. --- */
.objective-badge-category {
    font-size: 14px !important;
    font-weight: bold !important;
    color: var(--ffbad-blue-light) !important;
    margin-bottom: 0.25rem !important;
}

/* --- Ligne objectif --- */
.objective-badge-objective {
    font-size: 12px !important;
    color: var(--ffbad-blue) !important;
    font-weight : bold !important;
    margin-bottom: 0.15rem !important;
}

/* --- Ligne meilleur résultat réel --- */
.objective-badge-result {
    font-size: 12px !important;
    color: var(--ffbad-blue-light) !important;
    margin-bottom: 0.25rem !important;
}

/* --- Statut + icône --- */
.objective-badge-status {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.25rem !important;

    font-size: 12px !important;
    font-weight: bold !important;
}

/* --- Icône (check, croix, synchroniser) --- */
.objective-status-icon {
    width: 16px !important;
    height: 16px !important;
}

.results-radio-wrapper-athlete-profile {
    display: flex !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    width: 100% !important;
}

.ag-theme-alpine.table-results-athlete-profile-aggrid {
    --ag-background-color: #ffffff;
    --ag-header-background-color: var(--ffbad-blue, #101F69);
    --ag-header-foreground-color: white;
    --ag-border-color: #bfc5d1;
    --ag-font-family: "Open Sans", sans-serif;
    border: 1.5px solid #bfc5d1;
    border-radius: 6px;
    font-family: "Open Sans", sans-serif;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* === EN-TÊTES === */
.ag-theme-alpine.table-results-athlete-profile-aggrid .ag-header {
    border-bottom: 2px solid #bfc5d1 !important; /* ligne plus visible sous le header */
}

.ag-theme-alpine.table-results-athlete-profile-aggrid .ag-icon {
    color: var(--ffbad-red) !important; /* ligne plus visible sous le header */
}

/* === EN-TÊTES === */
.ag-theme-alpine.table-results-athlete-profile-aggrid .ag-header-cell-label {
    justify-content: center;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: white !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px;
    white-space: nowrap !important;
}

/* --- ZEBRA ROWS --- */
.ag-theme-alpine.table-results-athlete-profile-aggrid .ag-row-odd {
    background-color: #f6f8ff;
}

.ag-theme-alpine.table-results-athlete-profile-aggrid .ag-row-even {
    background-color: #ffffff;
}

/* Ligne séparatrice douce */
.ag-theme-alpine.table-results-athlete-profile-aggrid .ag-row {
    border-bottom: 1px solid #e5e8ef;
    cursor: pointer !important;
}

.ag-theme-alpine.table-results-athlete-profile-aggrid .ag-cell {
    font-size: 12px !important;
    font-weight: normal !important; /* optionnel si tu veux renforcer la lisibilité */
    color: var(--ffbad-blue, #101F69) !important;   /* optionnel si tu veux harmoniser */
}

/* ===================================================================
   📌 OBJECTIFS DE DÉVELOPPEMENT - Layout principal
   =================================================================== */
.development-goals-athlete-profile-container {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    width: 100%;
}

/* ----- Colonne de gauche ----- */
.development-goals-athlete-profile-left-col {
    width: 350px;
    min-width: 280px;
    padding: 1rem;
}

.development-goals-athlete-profile-right-col {
    flex: 1 1 500px;
    display: grid;
    grid-template-columns: 1fr; /* par défaut une colonne (style de jeu + tactico) */
    gap: 0.8rem;
}

/* Ligne 3 & 4 : 2 blocs côte à côte */
.development-goals-athlete-profile-duo-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 0.8rem;
}

.development-goals-athlete-profile-block {
    position: relative;
    background: #ffffff;
    border: 1.5px solid #7076ac;
    border-radius: 6px;
    padding: 0rem;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);

    /* Taille max + scroll interne */
    max-height: 270px;
    display: flex;
    flex-direction: column;
}

/* ----- Badge en haut à droite ----- */
.development-goals-athlete-profile-badge {
    position: absolute;
    top: 0.4rem;
    right: 0.4rem;
    width: 40px;
    height: 20px;
    font-size: 11px;
    font-weight: 700;
    border-radius: 6px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ----- Texte interne avec scroll ----- */
.development-goals-athlete-profile-text {
    font-size: 12px;
    color: var(--ffbad-blue, #101F69);
    text-align: justify;
    white-space: pre-wrap;

    overflow-y: auto;
    padding: 1rem 0.4rem 0.4rem 0.4rem;
}

.development-axes-list-athlete-profile {
    background: #ffffff !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 0.4rem 0.8rem !important;
}

.development-axes-text-athlete-profile {
    font-size: 12px !important;
    font-weight:bold !important;
    color: var(--ffbad-blue, #101F69) !important;
    text-align: justify !important;
    line-height: 1.25 !important;
}

.development-axes-item-athlete-profile {
    display: flex !important;
    align-items: center !important;   /* centrage vertical */
    gap: 0.5rem !important;
}

/* --- radio menu inline --- */
.development-radio-wrapper-athlete-profile {
    display: flex !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    width: 100% !important;
}

.checkbox-athlete-profile input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 22px !important;
    height: 22px !important;
    border: 2px solid var(--ffbad-red, #D52B1E) !important; /* bleu fédé */
    border-radius: 4px !important;
    background-color: white !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    outline: none !important;
    box-shadow: none !important; /* 🚫 enlève l'aura focus */
    margin-right: 6px !important;
    position: relative !important;
}

/* Effet hover */
.checkbox-athlete-profile input[type="checkbox"]:hover {
    transform: scale(1.05);
    filter: brightness(1.2);
}

/* Etat coché (fond vert fédé) */
.checkbox-athlete-profile input[type="checkbox"]:checked {
    background-color: #28a745 !important; /* vert validé */
    border-color: #28a745 !important;
}

/* ==========================================================
   🃏 Carte Stats Matchs
   ========================================================== */
.filters-row-matches-athlete-profile {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.4rem 1rem !important;
    width: 100% !important;
    align-items: flex-start !important;
}

/* LES BLOCS S'AJUSTENT À LEUR CONTENU */
.filter-block-matches-athlete-profile {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.35rem !important;

    flex: 0 0 auto !important; /* clé : largeur = contenu */
    width: auto !important;    /* permet au contenu de déterminer la largeur */

    /* OPTIONNEL mais souvent utile :
       min-width: max-content permet de ne pas casser le contenu */
    min-width: max-content !important;
}

/* Label */
.filters-label-matches-athlete-profile {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--ffbad-blue-light) !important;
}

/* ----------- CLASSEMENT ----------- */
.rank-container-matches-athlete-profile {
    display: flex !important;
    align-items: center !important;
    padding: 6px !important;
    border: 1px solid var(--ffbad-blue, #101F69) !important;
    border-radius: 6px !important;
    background-color: #FFFFFF !important;
}

/* INPUT */
.rank-input-matches-athlete-profile {
    width: 50px !important;
    border: none !important;
    outline: none !important;
    background-color: #FFFFFF !important;
    font-size: 12px !important;
    font-weight: bold !important;
    padding: 6px 11px !important;
    color: var(--ffbad-blue, #101F69) !important;
}

/* PLACEHOLDER */
.rank-input-matches-athlete-profile::placeholder {
    font-size: 12px !important;
    font-weight: bold !important;
    color: var(--ffbad-blue, #101F69) !important;
    opacity: 0.6 !important;
}

/* FLECHES DES INPUT NUMBER (safari + chrome + edge) */
.rank-input-matches-athlete-profile::-webkit-outer-spin-button,
.rank-input-matches-athlete-profile::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

.rank-input-matches-athlete-profile {
    -moz-appearance: textfield !important; /* Firefox */
}


.rank-ffbad-input-matches-athlete-profile {
    width: 100% !important;
    color : #101F69 !important;
    font-size: 12px !important;
    font-weight: bold !important;
}

.rank-ffbad-input-matches-athlete-profile .Select-multi-value-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    flex: 1 1 auto !important;
    align-items: center !important;
    gap: 2px 4px !important;
    min-width: 30px !important;
}


.rank-ffbad-input-matches-athlete-profile .Select-control {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
    padding-right: 10px !important;

    height: 30px !important;

    display: flex !important;
    align-items: center !important;
    position: relative !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* keep red background on open state */
.rank-ffbad-input-matches-athlete-profile .is-open > .Select-control,
.rank-ffbad-input-matches-athlete-profile .Select.is-open .Select-control {
    background-color: transparent !important;
}

/* ── Placeholder ── */
.rank-ffbad-input-matches-athlete-profile .Select-placeholder {
    color: var(--ffbad-grey) !important;
    font-style: italic !important;
    font-size: 12px !important;
}

/* ── Selected-value pill ── */
.rank-ffbad-input-matches-athlete-profile .Select-value {
    display: inline-flex !important;
    align-items: center !important;

    background-color: transparent !important;
    color: var(--ffbad-blue) !important;

    /* padding: 2px 6px !important; */
    margin: 0 !important;
    max-width: 100% !important;
    flex-shrink: 1 !important;
    box-sizing: border-box !important;

    line-height: 24px !important;
}

/* ── Value label (text inside the pill) ── */
.rank-ffbad-input-matches-athlete-profile .Select-value-label {
  color: var(--ffbad-blue) !important;
  font-weight: 700 !important;
  background-color: transparent !important;
  display: inline-block !important;

  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

/* ── "×" icon inside the multi pill ── */
.rank-ffbad-input-matches-athlete-profile .Select-value-icon {
    color: var(--ffbad-red) !important;
    fill: var(--ffbad-red) !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: color 0.15s ease !important;
}
.rank-ffbad-input-matches-athlete-profile .Select-value-icon:hover {
    color: var(--ffbad-red-dark) !important;
    border-left-color: rgba(184, 31, 23, 0.35) !important;
}

/* ----------- DATE RANGE ----------- */
.date-range-matches-athlete-profile {
    max-width: 120px !important;
}

.DateRangePickerInput,
.DateInput_input {
    border-radius: 6px !important;
    font-size: 13px !important;
    border: none;
}

.custom-datepicker-filter {
    position: relative !important;
    box-sizing: border-box !important;

    border: 1px solid var(--ffbad-blue, #101F69) !important;
    border-radius: 8px !important;
    background-color: var(--ffbad-white) !important;

    /* default width — override with size modifiers below */
    min-width: 220px !important;
    max-width: 220px !important;
    width: 100% !important;

    padding: 4px !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    margin-right: 0px;
}

.custom-datepicker-filter .DateRangePicker .DateInput {
    width: calc(50% - 12px) !important;
    font-weight: bold !important;
}

/* -------- Fond transparent uniquement pour ce filtre -------- */

.custom-datepicker-filter .DateRangePickerInput {
    background-color: white !important;
    border: none !important;
    box-shadow: none !important;
}

.custom-datepicker-filter .DateInput {
    background-color: white !important;
    border: none !important;
}

.custom-datepicker-filter .DateInput_input {
  color: var(--ffbad-blue, #101f69) !important;
  font-size: 12px !important;
  font-weight: bold !important;
  padding:6px 11px;
}


/* Flèche centrale */
.custom-datepicker-filter .DateRangePickerInput_arrow {
    background-color: white !important;
    border: none !important;
}

/* ========= LAYOUT GLOBAL ========= */
.matches-stats-container {
    display: flex;
    flex-wrap: wrap;            /* AUTORISE LE RETOUR À LA LIGNE */
    gap: 0.5rem 2rem;
    justify-content: space-between;  /* OK même avec wrap */
    align-items: center;
    padding: 1rem 0rem;
}

/* ========= DONUT CSS ========= */
.donut-block {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Donut externe */
.donut {
    --size: 90px;
    --thickness: 12px;
    --color-main: #4CAF50;
    --color-bg: #E5E8EF;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    background:
        conic-gradient(
            var(--color-main) calc(var(--percentage) * 1%),
            var(--color-bg) 0
        );
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

/* Cercle interne (blanc) */
.donut-inner {
    width: calc(var(--size) - var(--thickness) * 2);
    height: calc(var(--size) - var(--thickness) * 2);
    background: white;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    font-weight: 700;
    color: var(--ffbad-blue, #101F69);
}

/* Texte à droite du donut */
.donut-text-block {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.donut-label { color: var(--ffbad-blue, #101F69); font-size: 12px;}
.donut-win { color: #4CAF50; font-size: 12px; font-weight: bold;}
.donut-loss { color: var(--ffbad-red, #D52B1E); font-weight: bold; font-size: 12px; }
.donut-total-label { font-weight: bold; color: var(--ffbad-blue, #101F69); font-size: 12px; }
.donut-total { font-weight: bold; color: var(--ffbad-blue, #101F69); font-size: 12px;}

/* ========= BARRES 2 SETS / 3 SETS ========= */
/* Bloc global des barres */
.sets-block {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

/* Une ligne : "2 sets" | [barre] | "72%" */
.set-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: nowrap;
}

/* Label à gauche ("2 sets", "3 sets") */
.set-name {
    font-size: 12px;
    font-weight: 600;
    color: var(--ffbad-blue, #101F69);
    white-space: nowrap;
}

/* Conteneur de la barre au centre */
.set-bar-container {
    width: 160px;             /* <--- largeur FIXE */
    height: 12px;
    background: #E5E8EF;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;     
}

/* Barre verte remplie */
.set-bar-fill {
    height: 100%;
    background: #4CAF50;
    border-radius: 6px;
}

/* Pourcentage à droite de la barre */
.set-percent {
    font-size: 12px;
    font-weight: 700;
    color: var(--ffbad-blue, #101F69);
    white-space: nowrap;
}


/* ==========================================================
   Carte Adversaires – Layout global
   ========================================================== */

.opponents-wrapper-opponents-athlete-profile {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
}

.objective-wrapper-opponents-athlete-profile {
    display: flex;
    justify-content: center;      /* centrer le bloc */
    width: 100%;
}

.objective-scroller-opponents-athlete-profile {
    display: flex;
    align-items: center;
    gap: 1rem;
    overflow-x: auto;             /* scroll horizontal */
    white-space: nowrap;          /* force tout sur une seule ligne */
    padding-bottom: 4px;          /* petit espace pour scrollbar */
}

.objective-icon-opponents-athlete-profile {
    width: 52px;
    height: 52px;
    flex-shrink: 0;             /* empêche l'image de se réduire */
}

/* Liste des lignes TopX */
.opponent-stats-list-opponents-athlete-profile {
    display: block;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
}

.opponent-row-opponents-athlete-profile {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    height: 22px;
}

/* Label TopX */
.opponent-row-label-opponents-athlete-profile {
    width: 60px;
    font-size: 12px;
    font-weight: 600;
    color: var(--ffbad-blue-light);
}

.opponent-row-sep-opponents-athlete-profile {
    font-weight: bold;
    color: var(--ffbad-blue, #101F69);
}

/* Objectif (valeur texte) */
.opponent-row-goal-opponents-athlete-profile {
    width: 32px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: var(--ffbad-blue, #101F69);
}

/*
   Barre + “trait SVG” en CSS */

/* Conteneur de la barre */
.opponent-bar-container-opponents-athlete-profile {
    position: relative;
    width: 160px;     /* largeur fixe */
    min-width: 160px;
    height: 12px;
    background: white;
    border-radius: 6px;
    overflow: visible;
}

/* Barre verte (winrate) */
.opponent-bar-fill-opponents-athlete-profile {
    height: 100%;
    background: #4CAF50;
    border-radius: 6px;
    width: 0%;
}

/* ---- BARRE OBJECTIF EXACTE ---- */
.goal-marker-wrapper-opponents-athlete-profile {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* Ligne verticale de 1px */
.goal-line-opponents-athlete-profile {
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 0;
    width: 1px;
    background: black;
}

/* % de victoire à droite */
.opponent-row-percent-opponents-athlete-profile {
    width: 32px;
    font-size: 12px;
    font-weight: 700;
    text-align: left;
    color: var(--ffbad-blue, #101F69);

    flex-shrink: 0;          /* NE RÉTRÉCIT JAMAIS */
    white-space: nowrap;     /* RESTE SUR LA 1ÈRE LIGNE */
}

.opponent-row-wl-wrapper-opponents-athlete-profile {
    display: flex;
    align-items: center;
    gap: 0.2rem;

    font-size: 12px;
    font-weight: 700;

    flex-wrap: wrap;         /* ✅ AUTORISE LE RETOUR À LA LIGNE */
    min-width: 0;
}

/* Le mode career cache la colonne objectif */
.career-mode .opponent-row-goal-opponents-athlete-profile {
    display: none !important;
}

/* Et retire l’espace prévu pour l’icône */
.career-mode .objective-icon-opponents-athlete-profile {
    display: none !important;
}


/*
   Podium */

.bottom-blocks-opponents-athlete-profile {
    display: flex;
    flex-wrap: wrap;                     /* passe à la ligne si nécessaire */
    justify-content: space-between;      /* répartit équitablement */
    gap: 1.5rem;
    width: 100%;
}

/* Chaque bloc (podium / résumé) */
.bottom-block-item-opponents-athlete-profile {
    flex: 1 1 150px;                     /* min 150px + répartition fluide */
    display: flex;
    justify-content: center;             /* centré horizontalement */
    align-items: flex-start;             /* contenu aligné en haut */
}

/* Le podium et le résumé doivent occuper leur propre colonne interne */
.bottom-block-item-opponents-athlete-profile > div {
    width: 100%;
    max-width: 215px;                    /* pour éviter qu’il s’étale trop */
}

.podium-container-opponents-athlete-profile {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
}

.podium-step-1-opponents-athlete-profile,
.podium-step-2-opponents-athlete-profile,
.podium-step-3-opponents-athlete-profile {
    width: 60px;
    background: var(--ffbad-blue, #101F69);
    color: white;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    position: relative;
    border-radius: 4px 4px 0 0;
    margin-top:30px;
}

/* Hauteurs différenciées des marches */
.podium-step-1-opponents-athlete-profile {
    height: 90px;
    background: #C0C0C0 !important;   /* OR */
}

.podium-step-2-opponents-athlete-profile {
    height: 110px;
    background: #FFD700 !important;   /* ARGENT */
}

.podium-step-3-opponents-athlete-profile {
    height: 70px;
    background: #CD7F32 !important;   /* BRONZE */
}

/* Rang affiché au-dessus */
.podium-rank-opponents-athlete-profile {
    position: absolute;
    top: -24px;
    font-size: 12px;
    font-weight: 700;
    color: var(--ffbad-blue, #101F69);
}

/* 
   Résumé matchs / tournois
   */

.summary-opponents-athlete-profile {
    display: flex;
    flex-direction: column;
    color: var(--ffbad-blue, #101F69);
    font-weight: bold;
}

.summary-line-opponents-athlete-profile {
    font-size: 14px;
    text-align: center
}

/* ==========================================================
   Carte A360
   ========================================================== */
.a360-wrapper-a360-athlete-profile {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 1rem !important;
}

.a360-block-a360-athlete-profile {
    border: 2px solid var(--ffbad-blue-light) !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    padding: 0.8rem !important;
}

.a360-row-a360-athlete-profile {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 0.3rem !important;
}

.a360-label-a360-athlete-profile {
    font-weight: bold !important;
    font-size: 12px !important;
    color: var(--ffbad-blue-light) !important;
}

.a360-badge-green-a360-athlete-profile,
.a360-badge-orange-a360-athlete-profile,
.a360-badge-red-a360-athlete-profile,
.a360-badge-purple-a360-athlete-profile {
    border-radius: 6px !important;
    font-size: 12px !important;
    color: white !important;
    height: 27px !important;
    width: 54px !important;
    display: flex !important;
    align-items: center !important;   /* centre verticalement */
    justify-content: center !important; /* centre horizontalement */
    font-weight: bold !important;
}

.a360-badge-green-a360-athlete-profile { background: #4CAF50 !important; }
.a360-badge-orange-a360-athlete-profile { background: #FFA500 !important; }
.a360-badge-red-a360-athlete-profile { background: var(--ffbad-red, #D52B1E) !important;}
.a360-badge-purple-a360-athlete-profile { background: var(--ffbad-blue-light) !important; }

.a360-timeline-wrapper-a360-athlete-profile {
    border: 1px solid var(--ffbad-blue-light) !important;
    border-radius: 12px !important;
    padding: 4px !important;
    min-width: 220px !important;
    margin-top: 0.8rem !important;
}

.a360-timeline-wrapper-a360-athlete-profile::-webkit-scrollbar {
    display: none !important;
}

.a360-timeline-session-container-a360-athlete-profile {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.a360-timeline-row-a360-athlete-profile {
    display: flex !important;
    gap: 4px !important;
    justify-content: center !important;
    align-items: center !important;
}

.a360-fitness-wrapper-a360-athlete-profile {
    border: 1px solid var(--ffbad-blue-light) !important;
    border-radius: 12px !important;
    padding: 4px !important;
    margin-top: 2rem !important;
}


.a360-timeline-plotly-a360-athlete-profile {
    width: 100% !important;
    height: auto !important;
    flex-shrink: 0 !important;
}

/* ==========================================================
   Carte Engagement FD
   ========================================================== */
/* ------------ BOXES ------------ */

.funding-box-fixe-athlete-profile {
    border: 1px solid black !important;
    border-radius: 12px !important;
    background-color: #F3F5FF !important;
    padding: 12px 18px !important;
    margin-bottom: 16px !important;
}

.funding-box-variable-athlete-profile {
    border: 1px solid black !important;
    border-radius: 12px !important;
    background-color: #F3F5FF !important;
    padding: 12px 18px !important;
    margin-bottom: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.funding-box-total-athlete-profile {
    border: 2px solid var(--ffbad-red, #D52B1E) !important;
    border-radius: 12px !important;
    background-color: #FDEDED !important;
    padding: 18px !important;
    margin-bottom: 16px !important;
}


/* ------------ TEXT ------------ */

.funding-text-primary-athlete-profile {
    font-size: 14px !important;
    font-weight: bold !important;
    color: #7076AC !important;
}

.funding-text-secondary-athlete-profile {
    font-size: 16px !important;
    font-weight: bold !important;
    color: #7076AC !important;
}

.funding-text-total-athlete-profile {
    font-size: 18px !important;
    font-weight: bold !important;
    color: var(--ffbad-blue, #101F69) !important;
}


/* ------------ CADENAS ------------ */

.funding-lock-box-athlete-profile {
    border-radius: 8px !important;
    padding: 4px !important;
    height: 40px !important;
    width: 60px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: 12px !important;
}

.funding-lock-img-athlete-profile {
    height: 20px !important;
    width: 20px !important;
}

.custom-list-level {
    margin-left: 1.4rem !important;
    font-size: 12px !important;
}

.custom-list-level ul,
.custom-list-level ol {
    margin-left: 0.8rem !important;
     font-size: 12px !important;
}

/* Suivi PVC */
/* Layout global */
.athlete-profile-pvc-card-layout {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
}

.athlete-profile-pvc-item-value {
    margin-top: 3px !important;
    font-size: 16px !important;
    font-weight: bold !important;
}

.athlete-profile-pvc-sub-item-value {
    font-size: 10px;
    font-weight: normal;
    font-style: italic;
    color: rgb(112, 118, 172);
    margin-top: 1px;
    margin-bottom: 0.5rem;
}

.athlete-profile-pvc-metrics-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;     /* centre horizontalement */
    align-items: flex-start;
    gap: 0.3rem 1rem;
    width: 100%;
}

.athlete-profile-pvc-metrics-col {
    flex: 1 1 100px !important;
    align-items: center !important;
    text-align: center !important;
}

/* -------- Cartes (communes) -------- */
.athlete-profile-pvc-card {
  padding: 16px 18px;
  border-radius: 6px;
  background-color: #F8F9FA;
  border: 1px solid rgba(0, 0, 0, 0.05);
}


.ranking-card {
    height: 200px;
    background-repeat: no-repeat;
    background-position: center top;
    padding: 32px 12px 16px 12px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: inherit;
}

.ranking-card-title {
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
    text-align: center;
}

.ranking-card-columns {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-between;
    width: 100%;
    flex: 1;
}

.ranking-card-column {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 2px;
}

.ranking-card-col-label {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.4px;
    margin-bottom: 4px;
}

.ranking-card-col-main {
    font-weight: 700;
    line-height: 1;
    margin-bottom: 6px;
}

.ranking-card-col-sub-label {
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0.3px;
    margin-bottom: 2px;
}

.ranking-card-col-sub-value {
    font-size: 13px;
    font-weight: 700;
}

.ranking-card-separator {
    width: 0.5px;
    margin: 8px 0;
    align-self: stretch;
}

.ranking-card-date {
    font-size: 10px;
    margin-top: 6px;
    text-align: center;
}

.ranking-cards-row-athlete-profile-youth {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem 0.5rem;
    width: 100%;
}

.ranking-cards-cell-athlete-profile-youth {
    flex: 1 1 260px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-width: 260px;
}

/* ============================================
   Variante FFBaD (bleu)
   ============================================ */
.ranking-card-ffbad {
    width: 260px;
    background-image: url(../../images/from_application/images/rank_frame_blue_wide.svg);
    background-size: 260px 200px;
    color: #101F69;
}

.ranking-card-ffbad .ranking-card-title,
.ranking-card-ffbad .ranking-card-col-main,
.ranking-card-ffbad .ranking-card-col-sub-value {
    color: #101F69;
}

.ranking-card-ffbad .ranking-card-col-main{
    font-size: 24px;
}

.ranking-card-ffbad .ranking-card-col-label,
.ranking-card-ffbad .ranking-card-col-sub-label {
    color: #7076AC;
}

.ranking-card-ffbad .ranking-card-separator {
    background-color: rgba(16, 31, 105, 0.25);
}

.ranking-card-ffbad .ranking-card-date {
    color: #7076AC;
}

/* ============================================
   Variante BWF (rouge)
   ============================================ */
.ranking-card-bwf {
    width: 260px;  /* à ajuster selon la largeur réelle de rank_frame_wide.svg */
    background-image: url(../../images/from_application/images/rank_frame_red_wide.svg);
    background-size: 260px 200px;  /* à ajuster */
    color: #D52B1E;
}

.ranking-card-bwf .ranking-card-title,
.ranking-card-bwf .ranking-card-col-main,
.ranking-card-bwf .ranking-card-col-sub-value {
    color: #D52B1E;
}

.ranking-card-bwf .ranking-card-col-main{
    font-size: 20px;
}

.ranking-card-bwf .ranking-card-col-label,
.ranking-card-bwf .ranking-card-col-sub-label {
    color: #EF4D53;
}

.ranking-card-bwf .ranking-card-separator {
    background-color: rgba(213, 43, 30, 0.25);
}

.ranking-card-bwf .ranking-card-date {
    color: #EF4D53;
}


/* ============================================================
   Ranking time timeline
   ============================================================ */

.athlete-profile-ranking-time-card {
    width: 100%;
    background: #ffffff;
    border: 1px solid #e1e1e8;
    border-radius: 18px;
    overflow: hidden;
}

.athlete-profile-ranking-time-scroll-wrapper {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 10px 12px 8px 12px;
}

.athlete-profile-ranking-time-img {
    display: block;
    width: 1180px;
    min-width: 1000px;
    height: auto;
}

/* Empty state */
.athlete-profile-ranking-time-empty {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid #e1e1e8;
    border-radius: 14px;
    background: #ffffff;
    color: var(--ffbad-grey, #555555);
    font-size: 13px;
}

@media (max-width: 780px) {
    .athlete-profile-ranking-time-scroll-wrapper {
        padding: 8px;
    }
}














/* FLECHE CENTRALE */
.rank-arrow-matches-athlete-profile {
    width: 20px !important;
    height: 20px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 12px !important;
    background-color: #FFFFFF !important;

    background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'>\
<path fill='%23101F69' d='M694 242l249 250c12 11 12 21 1 32L694 773c-5 5-10 7-16 7s-11-2-16-7c-11-11-11-21 0-32l210-210H68c-13 0-23-10-23-23s10-23 23-23h806L662 275c-21-22 11-54 32-33z'></path>\
</svg>") !important;
}

.goal-marker-opponents-athlete-profile {
    position: absolute;
    width: 5px;
    height: 18px;
    top: -2px;
    background-repeat: no-repeat;
    background-size: 2px 16px;
    background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='2' height='16'>\
<rect width='2' height='16' fill='%23101F69'/>\
</svg>");
}