/* ==================== SIMPLE MAP STYLES ==================== */

/* Contenedor del mapa - Estilos básicos */
#map {
  width: 100%;
  height: 500px;
  position: relative;
  display: block;
}

/* Desktop y tablets */
@media (min-width: 768px) {
  #map {
    height: calc(100vh - 200px);
    min-height: 500px;
    max-height: 800px;
  }
}

/* Desktop grande */
@media (min-width: 1200px) {
  #map {
    height: calc(100vh - 180px);
    min-height: 600px;
    max-height: 900px;
  }
}

/* Móviles */
@media (max-width: 767px) {
  #map {
    height: 400px;
  }

  /* Asegurar que el card del mapa esté bien */
  .card-body.p-0 {
    padding: 0;
    height: 400px;
    overflow: hidden;
  }
}

/* Móviles pequeños */
@media (max-width: 375px) {
  #map {
    height: 350px;
  }

  .card-body.p-0 {
    height: 350px;
  }
}

/* Landscape móvil */
@media (max-width: 812px) and (orientation: landscape) {
  #map {
    height: 300px;
  }

  .card-body.p-0 {
    height: 300px;
  }
}