* {
    margin: 0;
    padding: 0;

    box-sizing: border-box;
}

#map {
    outline: none;
    width: 100%;
    height: 100vh;
    z-index: 1;
}

#desplegable {
    position: absolute;
    top: 5rem;
    left: 1rem;
    width: 40rem;
    height: 82%;
    z-index: 9999;
    font-size: 1rem;
}

:root {
    --color_borde_mapa: #c4c4c4;
}

#filtros {
    background: var(--header);
    backdrop-filter: blur(18px);
    padding: 0.5rem;
    gap: 0.5rem;
    
    position: relative;
    border-radius: 0.5vw;
    color: var(--color_p);
    transition: all 0.3s ease;
    overflow: hidden;
    
    display: flex;
    flex-direction: row;
}

#filtros .boton {
    cursor: pointer;
    width: 100%;
    border: var(--border);
    background: transparent;
    padding: 0.5rem;
    border-radius: 0.5rem;
    color: var(--color_p);
    font-weight: 900;
    font-size: 1rem;
}

#filtros .boton:hover {
    background-color: rgba(255, 255, 255, 1);
    color: black;
}

#info {
    margin-top: 1rem;
    z-index: 9999;
    padding: 1rem;
    overflow-y: scroll;
    pointer-events: auto; /* Permite la interacción con el texto */
    height: 94%;
    
    position: relative;
    text-decoration: none;
    border-radius: 0.5vw;
    background: var(--header);
    backdrop-filter: blur(18px);
    color: var(--color_p);
    transition: all 0.3s ease;
    overflow-y: auto;

    display: flex;
    flex-direction: column;
    gap: 1rem;
}

#info::-webkit-scrollbar {
  width: 12px;
}

#info::-webkit-scrollbar-track {
    border-radius: 0 0.5rem 0.5rem 0;
    background: #5a5a5a;
}

#info::-webkit-scrollbar-thumb {
    border-radius: 0.5rem;
    background: white;
}


.poligono {
    border-left: solid 6px red;
    padding: 0.5rem;
    border-radius: 0.3rem;
    background: var(--background_div);
}

.poligono:hover {
    color: black !important;
    background: #f2dada;
}

.titulo {
    margin-top: 0.5rem !important;
}

#info font {
    font-weight: bold;
    color: red !important;
}

#info hr {
    border: solid grey 1px;
    margin: 0.5rem 0 1rem 0;
}

#info a {
    color: #0072d0 !important;
}

#map_coordenadas {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    z-index: 9999;
    padding: 0.5rem;
    font-size: 1rem;
    
    text-decoration: none;
    border-radius: 0.5vw;
    background: var(--header);
    backdrop-filter: blur(18px);
    color: var(--color_p);
    transition: all 0.3s ease;
    overflow: hidden;
}