#map {
               height: calc(100dvh - 65px);
               width: 99vw;
               margin-top: 65px;
               display: none;
           }

           #mapSelector {
               position: absolute;
               top: 10px;
               left: 10px;
               z-index: 1000;
               background: rgba(0, 0, 0, 0.7);
               color: white;
               padding: 5px;
               border-radius: 0px;
           }

           .map-actions {
               position: absolute;
               left: 50%;
               top: 90%;
               z-index: 999;
               translate: -50%;
           }


           /* Style personnalisé pour les popups */
           .custom-popup .leaflet-popup-content-wrapper {
               background-color: red;
               font-size: 16px;
               border-radius: 0px;
           }

           .custom-popup {
               background-color: black;
               color: #b0aaa4;
           }

           .leaflet-popup-content-wrapper {
               background: black;
               border: 1px solid #333;
               border-radius: 0px;
           }

           .leaflet-popup-tip {
               display: none;
           }

           .info {
               border-color: var(--bordure);
               width: 25vw;
               min-width: 250px;

           }

           .propal-type {
               background-color: black;
               color: gold;
               cursor: pointer;
               font-size: 1em;
               margin-inline: .6em;
           }

           .propal-type:hover {
               background-color: gold;
               color: black;
           }

           .level_choice {
               display: flex;
               width: fit-content;
               min-width: 250px;
               border-color: var(--bordure);
               flex-direction: row;
               justify-content: space-between;


           }

           .hexa-actions {
               margin-top: 50px;
               width: 100%;
               height: 150px;
               display: flex;
               justify-content: center;
               align-items: center;
               color: white;
               flex-direction: column;

           }

           .loc-wrapper {
               width: 75%;
               display: flex;
               align-items: center;
               justify-content: center;
               gap: 1em;
           }

           .loc-choice {
               color: var(--beige);
               border: 1px solid var(--beige);
               padding-inline: 1.5em;
               border-radius: 50px;
               padding-block: .2em;
               font-size: .7em;
               cursor: pointer;
               width: 10%;
               text-align: center;
               min-width: fit-content;
               transition: all .2s ease;

           }

           .loc-choice:hover {
               background-color: var(--beige);
               border: 1px solid var(--beige);
               color: black;
           }

           .choice-country {
               background-color: var(--beige);
               color: black;
           }



           /* CITIES */
           #section-city {
               width: 100%;
               display: flex;
               justify-content: center;
               align-items: center;
               color: white;
               flex-direction: row;
               gap: 3%;
               margin-block: 1em;
               border: none;
           }

           .city-card {
               width: 30%;
               border: 1px solid var(--beige);
               display: flex;
               height: 200px;
               justify-content: center;
               align-items: center;
               cursor: pointer;

               background-image: url('https://skeud.fr/assets/logo.png');
               background-position: center;
               background-size: cover;
               background-position: center;
               background-repeat: no-repeat;


           }

           .city-card-stats-wrapper {
               width: 96%;
               height: 800px;
               border: 1px solid var(--beige);
               display: flex;
               justify-content: center;
               align-items: center;
               flex-direction: column;
               position: relative;
           }

           /* REBOOT */

           .default_country {
               width: calc(100vw - 4em);
               background-color: rgb(0, 0, 0);
               display: flex;
               justify-content: center;
               align-items: center;
               padding: 2em;
               gap: 2em;
           }

           .country {
               /* background-color: #333; */
               width: 100%;
               height: 90%;
               display: flex;
               gap: 2em;
               justify-content: space-around;
               align-items: center;
               padding-block: 2em;
               border-radius: 8px;

           }

           .stats_country {
               height: 90%;
               width: 45%;
               background-color: gray;
               justify-content: space-between;
               align-items: center;
               display: flex;
               flex-direction: column;
               background-color: transparent;
               gap: 2em;
           }

           .map_country {
               height: 90%;
               width: 45%;
               background-color: gray;
               display: flex;
               justify-content: center;
               align-items: center;
               background-color: transparent;
               flex-direction: column;
               gap: .5em;
           }

           .map_country img {
               width: auto;
               height: 85%;
               max-width: 85%;
           }

           .big_nbr_wrapper {
               display: flex;
               background-color: black;
               border-radius: 10px;
               width: 80%;
               color: white;
               justify-content: space-around;
               padding: 1em;
           }

           .big_nbr {
               flex-direction: column;
               display: flex;
               text-align: center;

           }

           .big_nbr span {
               font-size: 3em;
               font-weight: bold;
           }


           .region,
           .departement,
           .pays {
               width: 100%;
               background-color: #000;
               display: flex;
               justify-content: center;
               align-items: center;
               padding-block: 2em;
               display: none;

           }

           .pays {
               display: flex;
               gap: 2em;

           }

           .region_choice_wrapper {
               width: 90%;
               display: flex;
               gap: 2em;
               height: 66dvh;
           }


           .region_map,
           .region_select,
           .departement_map,
           .departement_select,
           .map_country,
           .country_stats {
               display: flex;
               width: 45%;
               background-color: #333;
               padding: 2em;
               border-radius: 8px;
               flex-direction: column;
               justify-content: space-between;
               gap: 1em;
               overflow: auto;
               align-items: center;
               overflow-x: clip;
           }

           .region_map img,
           .dept_map img {
               width: 100%;
               height: auto;
           }

           .region-svg,
           .dept-svg,
           .country-svg {
               fill: black;
               stroke-width: 1px;
               stroke: #80808050;
               transition: all .5s ease;
           }

           .country-svg {
               stroke: black;
           }

           .region-svg:hover,
           .dept-svg:hover {
               fill: antiquewhite;
               cursor: pointer;
           }

           .region-item,
           .dept-item {
               padding: 1em;
               background-color: black;
               border-radius: 8px;
               color: white;
               cursor: pointer;
               width: 98%;
               text-decoration: none;

           }

           .region-item:hover,
           .dept-item:hover {
               outline: 1px solid #ffffff17;

           }

           .hovered {
               fill: antiquewhite;
           }

           .disabled {
               cursor: not-allowed;
               opacity: 0.6;
           }








           .region-item[data-score="0"] {
               cursor: not-allowed;
               color: gray;
               /* optionnel, pour effet visuel */
               pointer-events: none;
               /* empêche le clic */
               background-color: black;
               border: 1px solid gray;
               opacity: .5;
           }

           .dept-item[data-score="0"] {
               cursor: not-allowed;
               color: gray;
               /* optionnel, pour effet visuel */
               pointer-events: none;
               /* empêche le clic */
               background-color: black;
               border: 1px solid gray;
               opacity: .5;
           }

           .country_stats {
               background-color: black;
               padding-block: 0;
           }


           .stat {
               background-color: var(--beige);
               width: 100%;
               display: flex;
               flex-direction: column;
               padding: .5em;
               border-radius: 8px;
               padding-inline: 1em;
           }

           .stat-title {
               opacity: .5;
               font-size: .8em;
               padding-block: .5em;
           }

           .stat-nbr {
               font-size: 3em;
               font-weight: bold;


           }

           .item-img {
               max-width: 5em;
               border-radius: 2px;
           }

           .item-artiste {
               display: flex;
               flex-direction: column;
               text-decoration: none;
               text-align: center;
               align-items: center;
           }

           .little-text {
               font-size: .8em;
               opacity: .5;
               color: black;
               padding-top: .2em;
           }

           .no-pad {
               padding-block: 0;
           }

           svg {
               max-width: 100%;
               height: auto;
           }

           .r-reverse {
               flex-direction: row-reverse;
           }


           /* Media query pour les smartphones */
           @media only screen and (max-width: 1020px) {
               /* Vos styles CSS pour les smartphones ici */

               .region_choice_wrapper {
                   width: 90%;
                   display: flex;
                   gap: 2em;

                   flex-direction: column;
                   justify-content: center;
                   align-items: center;
                   height: 100%;
               }

               .region_map,
               .region_select,
               .departement_map,
               .departement_select,
               .map_country,
               .country_stats {
                   display: flex;
                   width: 100%;
                   background-color: #333;
                   padding: 2em;
                   border-radius: 8px;
                   flex-direction: column;
                   justify-content: space-between;
                   gap: 1em;
                   overflow: auto;
                   align-items: center;
                   overflow-x: clip;
               }

               section {
                   padding: 0;
                   margin-top: 0;
               }

               .r-reverse {
                   flex-direction: column;
               }

           }