.map-container {
    display: flex;
    justify-content: center; /* Deixe o mapa no centro */
    align-items: center;
    height: 85vh;
    margin-top: -305px;
    margin-left: 310px; /* Empurra o contêiner para a direita */
}

#map {
    height: 100%; /* Altura proporcional à altura do contêiner */
    width: 100%; /* Largura proporcional à largura da tela */
    max-height: 830px; /* Altura máxima do mapa */
    max-width: 1580px; /* Largura máxima do mapa */
    background-color: rgba(255, 255, 255, 0.77); /* Fundo transparente */
    border-radius: 10px; /* Bordas arredondadas para estética */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra para destaque */
}

#map { height: 90vh; } /* Altura do mapa */

.locate-btn {
    padding: 10px 15px;
    background-color: #007BFF;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}
.locate-btn:hover {
    background-color: #0056b3;
}

#chatbot-button {
    display: none !important;
}


.custom-marker {
    position: relative;
    width: 50px;
    height: 50px;
}

.custom-marker img {
    border: 3px solid red; /* Borda ao redor da foto */
    border-radius: 50%; /* Forma circular */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); /* Sombra ao redor */
    display: block;
}

/* === Ajustes apenas para dispositivos móveis === */
@media screen and (max-width: 768px) {
    .map-container {
        height: 70vh;
        margin: 0 auto; /* Centraliza o mapa sem usar margens fixas */
        padding: 10px; /* Evita cortes no layout */
    }

    #map {
        max-width: 100%;
        max-height: 65vh;
    }

    .locate-btn {
        padding: 10px 15px;
        font-size: 14px;
    }
}

/* Ajustes para telas muito pequenas (celulares pequenos) */
@media screen and (max-width: 480px) {
    .map-container {
        height: 60vh;
        padding: 5px;
    }

    #map {
        max-width: 100%;
        max-height: 60vh;
    }

    .locate-btn {
        padding: 8px 12px;
        font-size: 12px;
    }

    .custom-marker {
        width: 40px;
        height: 40px;
    }
}