/* Surcharge de la couleur "bg-primary" de Bootstrap pour background et card header */
.bg-primary {
  background-color: #204b47 !important;
}


/* Gif de chargement au lancement du dashboard */
._dash-loading {
    font-size: 0;
    background-image: url('images/fish_loading.gif');
    height: 350px;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
}


/* Pour cacher les cartes */
.hide {
    position: absolute !important;
    left: -10000px !important;
}


/* Dropdown sélection des sites : on réduit le padding-x */
#tabs-dropdown-sites a {
    padding: 0.5rem 0.1rem;
}


/* Dropdown (titre) dans le panneau à droite des cartes */
#title-infos {
    flex-shrink: 1;
    padding-right: 0px;
    padding-left: 0px;
}
#title-infos > .dash-dropdown {
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
}
#title-infos .Select-control {
    height: auto;
}
#title-infos .Select-menu-outer {
    margin-top: 0.5rem;
}
#title-infos .Select-arrow-zone {
    display: none;
}
#title-infos .Select-multi-value-wrapper > .Select-value {
    padding: 0px;
    font-weight: 500;
    line-height:1.2;
    font-size: 1.40625rem; /* Taille d'un titre h4 */
    position: static; /* Valeur par défaut de la propriété 'position' */
    white-space: normal; /* Valeur par défaut de la propriété 'white-space' */
}
#title-infos .Select-multi-value-wrapper > .Select-input {
    display: none !important;
}


/* Boutons "précédent"/"suivant" dans le panneau à droite des cartes */
#button-prev-infos, #button-next-infos {
    flex-shrink: 1;
    width: auto;
}


/* Boutons collapse affichage paramètres données/visuels */
.collapse-btn, .collapse-btn:hover, .collapse-btn:active, .collapse-btn:focus {
    font-size: 1.05rem;
    padding: 0;
    text-decoration: none;
    border: none;
    box-shadow: none;
    font-weight: 500; /* Propriété d'un titre h5 */
    line-height: 1.2; /* Propriété d'un titre h5 */
}


/* Modification du padding des sliders des strates */
.padding-slider-strates {
    padding: 25px 0px !important;
}


/* Groupe de boutons pour sélection du type de graphique/distribution (onglets 1 et 2) */
.radio-group .form-check {
    padding-left: 0;
}
.radio-group .form-check .form-check-label {
    border: none;
    box-shadow: none;
}
.radio-group .btn-group > .form-check:not(:last-child) > .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.radio-group .btn-group > .form-check:not(:first-child) > .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: -1px;
}


/* Pour enlever la dernière margin d'un groupe de cases à cocher / boutons radio */
.delete-last-margin > div:last-child {
    margin-right: 0;
}


/* Pour enlever la margin-bottom d'un switch */
.delete-margin-bottom > div:first-child {
    margin-bottom: 0;
}


/* Pour ouvrir le menu d'un dropdown vers le haut plutôt que vers le bas */
/* À supprimer quand Dash aura ajouté la fonctionnalité : https://github.com/JedWatson/react-select/issues/1602 */
.open-dropdown-top .Select-menu-outer {
    top: auto;
    bottom: 100%;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    border: 1px solid #ccc;
    border-bottom-color: #e6e6e6;
}

.open-dropdown-top.is-open > .Select-control {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    border-color: #d9d9d9 #ccc #b3b3b3;
}


/* Pour aligner sur une ligne à l'horizontal un dropdown et son label */
.param-dropdown-align {
  display: flex;
  flex-wrap: wrap;
  align-items: center
}