/* Polices État */

@font-face {
    font-family: "Marianne";
    font-style: normal;
    font-weight: normal;
    src: url("./fonts/Marianne-Regular.woff") format("woff");
}

@font-face {
    font-family: "Marianne";
    src: url("./fonts/Marianne-Bold.woff") format("woff");
    font-weight: bold;
}

@font-face {
    font-family: "Marianne";
    src: url("./fonts/Marianne-Bold_Italic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: "Marianne";
    src: url("./fonts/Marianne-Regular_Italic.woff") format("woff");
    font-style: italic;
}

@font-face {
    font-family: "Marianne ExtraBold";
    src: url("./fonts/Marianne-ExtraBold.woff") format("woff");
    font-style: normal;
}

@font-face {
    font-family: "Marianne ExtraBold";
    src: url("./fonts/Marianne-ExtraBold_Italic.woff") format("woff");
    font-style: italic;
}

:root {
    --vert: #2E6E53;
    --vert-hover: #276144;
}

/*couleurs etc

Styles Bootstrap : card dropdown etc

Styles : textes, etc

voir pour générer légende avec boucle sur palette

*/

* {
    font-family: "Marianne";
}

.leaflet-attribution-flag {
    display: none !important; /* permet de supprimer le drapeau ukrainien intempestif */
}

.Select {  /* règle la présentation des entrées de menu multi-lignes
    dans les menus déroulants */
    line-height: 1;
}

 /* classes de pop-ups */

.lexique { /* wrapper de la pop-up */
    min-width: 32%;
    max-width: 100%;
    padding-top: 0;
}

.lexique .modal-dialog { /* contenu de la pop-up */
    min-width: 30%;
  }

.mentions { /* wrapper de la pop-up */
    min-width: 32%;
    max-width: 100%;
    padding-top: 0;
}

.mentions .modal-dialog { /* contenu de la pop-up */
    min-width: 30%;
  }

.popup_main {
    min-width: 32%;
    max-width: 350%;
    padding-top: 0;
}

.geoloc {
    min-width: 32%;
    max-width: 400%;
    padding-top: 0;
}

.geoloc .modal-dialog { /* contenu de la pop-up */
    width: 20%;
    max-width: 100%;
    min-width: 380px;
  }

  @media screen and (max-width: 400px) {
    .geoloc .modal-dialog {
        min-width: 300px;
    }
  }

/* cadre */

.card {
    background-color: #f2f4f4; 
    padding: 20px;  
    border-radius: 5px;
    margin-bottom: 30px;
}

/* titres */

.titre-colle {
    margin-bottom: 0.5em;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1;
}

.titre-eloigne {
    margin-bottom: 2em;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1;
}

/* boutons */

.bouton {
    background-color: var(--vert);
    color: white;
    border: none;
    padding: 0.5rem 1rem;
    font-weight: 600;
    border-radius: 0.25rem;
    transition: background-color 0.3s ease;
  }
  
  .bouton:hover,
  .bouton:focus {
    background-color: var(--vert-hover);
    color: white;
    text-decoration: none;
    outline: none;
  }

/* légende */

.legende {
    position: absolute;
    bottom: 0.7%;
    left: 0.7%;
    z-index: 1000;
    background: white;
    padding: 5px;
    border-radius: 8px;
    opacity: 0.66;
}

@media (max-width: 768px) {
    .legende {
        bottom: 6%; 
    }
}