/* public/css/style.css */

/* Estilo para ocultar la barra de scroll en elementos específicos (complemento a Tailwind) */
.custom-scrollbar-hide::-webkit-scrollbar {
  display: none; /* Safari and Chrome */
}
.custom-scrollbar-hide {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

/* Placeholder para el mapa si Leaflet no carga o mientras carga */
#map-container:empty::before {
  content: 'Cargando mapa... Por favor, espere.';
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  color: #6b7280; /* text-gray-500 */
  font-style: italic;
}

/* Ajustes finos para la botonera de acciones del modal, si Tailwind no es suficiente */
.action-button-canalera {
  /* Ya definidos en el HTML, pero se podrían refinar aquí si es necesario */
  /* Por ejemplo, asegurar una altura mínima o un espaciado de ícono específico */
}

.social-share-button-v2 i,
.action-button-canalera i {
    /* Podríamos querer asegurar que los iconos no hereden estilos de texto extraños */
    font-style: normal; /* Asegurar que no se pongan itálicos si un contenedor padre lo es */
    line-height: 1; /* Para un mejor centrado vertical a veces */
}

/* Un pequeño spinner CSS simple para usar si es necesario durante cargas */
.simple-spinner {
  border: 4px solid rgba(0, 0, 0, 0.1);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border-left-color: #0891b2; /* Mismo color que theme-color */
  animation: spin 1s ease infinite;
  margin: auto; /* Para centrar si se usa en un div */
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* Para evitar que el body haga scroll cuando el modal está abierto */
body.modal-open {
    overflow: hidden;
}

/* AÑADIR ESTO SI NO ESTÁ para los botones de compartir MÁS GRANDES del modal */
.social-share-button-v2-larger {
  display: inline-flex; align-items: center; justify-content: center;
  width: 3rem; /* w-12 */ height: 3rem; /* h-12 */
  border-radius: 9999px; color: white;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}
.social-share-button-v2-larger:hover {
  transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}
.social-share-button-v2-larger i { font-size: 1.5rem; /* text-2xl */ }