.custom-tabs-container {
    width: 100%; /* Utilisez 100% pour une largeur pleine page ou ajustez selon vos besoins */
    margin: auto;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Ajoute une légère ombre pour un effet élévé */
}

.custom-tabs {
    border-top-left-radius: 6px; /* Arrondit les coins supérieurs pour un look plus doux */
    border-top-right-radius: 6px;
    background-color: #f9f9f9; /* Couleur de fond légère pour contraster avec la couleur principale */
    background-color: transparent; 
    margin-bottom: 25px;
    box-shadow: none;
    border-bottom: 1px solid #edf2f7; 
    width: 100%;
    display: flex;
    justify-content: center;
}

.custom-tab {
    color: rgb(16, 31, 105) !important; /* Applique la couleur aux textes des onglets pour un look cohérent */
    border-radius: 3px !important; /* Assure la cohérence des coins arrondis */
    background-color: transparent !important; /* Fond transparent pour les onglets non sélectionnés */
    padding: 12px 24px !important; /* Ajuste le padding pour plus d'espace */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background-color 0.3s ease !important; /* Transition douce pour le survol */
    font-weight: 600 !important;
    font-size: 17px !important;
}

.custom-tab:hover {
    background-color: rgba(16, 31, 105, 0.1) !important; /* Légère coloration au survol pour indiquer l'interaction */
}

.custom-tab--selected {
    color: rgb(16, 31, 105) !important;
    font-weight: 800 !important;
    background-color: white !important; /* Applique la couleur principale à l'onglet sélectionné */
    border-top: 4px solid rgb(16, 31, 105) !important; /* Renforce la bordure supérieure pour l'onglet actif */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important; /* Ajoute une ombre pour un effet de profondeur */
    font-size: 20px !important;
}