/* Estilo de la lista de sugerencias */
#tramite_list {
  margin-top: 3px;
  max-height: 200px; /* Limita la altura de la lista */
  overflow-y: auto; /* Agrega scroll si hay más de 5 elementos */
  position: absolute; /* Posiciona la lista debajo del input */
  top: 100%; /* La lista aparecerá justo debajo del input */
  width: 100%; /* Hace que la lista ocupe el mismo ancho que el input */
  background-color: white; /* Fondo blanco */
  border: 1px solid #ddd; /* Borde suave */
  z-index: 1000; /* Asegura que la lista esté por encima de otros elementos */
  display: none; /* Inicialmente oculta */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Sombra sutil */
}

/* Estilo de cada opción dentro de la lista */
#tramite_list li {
  padding: 8px; /* Espaciado dentro de cada opción */
  cursor: pointer; /* Cambia el cursor para indicar que es seleccionable */
  list-style: none; /* Elimina los puntos de la lista */
}

/* Estilo cuando se pasa el mouse sobre una opción */
#tramite_list li:hover {
  background-color: #f0f0f0; /* Fondo gris claro al pasar el mouse */
}


#tramite_list li.highlight {
  background-color: #45668dd1; /* Fondo al seleccionar */
  color: white;
}

/* También puedes poner un borde en foco para mejorar la visibilidad */
#tramite_list li:focus {
  outline: 2px solid #45668dd1; /* Borde de enfoque */
}

/* Estilo para el input cuando está vacío o no ha habido interacción */
#tramite_search:focus {
  border-color: #accdf1; /* Resalta el borde del input cuando está enfocado */
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.25); /* Sombra azul de enfoque */
}

#tramite_search:invalid {
  border-color: red; /* Si el input es inválido, el borde se vuelve rojo */
}

#protesta_ciudadana_evidencia-ubicacion {
  height: 50px; /* O el tamaño que desees */
  padding: 5px;
}

#protesta_ciudadana_evidencia-ubicacion .dz-button {
  font-size: 12px; /* Reducir el tamaño de la fuente */
  padding: 3px 8px; /* Reducir el padding para que el botón sea más pequeño */
  height: auto; /* Ajustar la altura automática */
  border-radius: 5px; /* Mantener los bordes redondeados */
}

.module {
  width: 200px;  /* Estrechamos el contenedor */
  margin: 0 0 1em 0;
  overflow: hidden;
}

.module p {
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;  /* Rompe palabras largas para evitar desbordes */
}

.comentarios-scroll-container {
  border: none !important;
}