body {
  background-color: rgba(229, 252, 246, 0.5);
}

.carousel-inner img {
  width: 85%; /* Mantiene la imagen a ancho completo */
  height: auto; /* Permite que la imagen se ajuste automáticamente */
  max-height: 480px; /* Altura máxima para evitar que se agrande demasiado */
  object-fit: cover; /* Recorta la imagen sin distorsionarla */
}

/* Ajusta el tamaño de las imágenes en el carrusel */
.card-img-top {
  max-height: 100px; /* Cambia el tamaño según lo necesites */
  object-fit: contain; /* Asegura que las imágenes mantengan su proporción */
}

/* Espaciado entre los elementos */
.g-2 > .col {
  margin: 0 auto; /* Centra los elementos si es necesario */
}

/*------BANNER----------*/
.banner-estatico img {
  max-height: 100%; /* Ajusta altura máxima */
  object-fit: cover; /* Recorta la imagen manteniendo proporción */ 
}

/*---------------*/

.formatoTextoOrange {
  font-family: "Open Sans" !important;
  font-size: 14px !important;
  color: rgb(111, 110, 110) !important;
  text-align: justify;
}

.formatoTextoSuperiorOrange {
  font-family: "Open Sans" !important;
  font-size: 18px !important;
  color: rgb(111, 110, 110) !important;
  text-align: justify;
}

.formatoTextostorytimeOrange {
  font-family: "Open Sans" !important;
  font-size: 15px !important;
  color: #6515a6 !important;
  text-align: justify;
}

.formatoTextoProductoCardOrange {
  font-family: "Open Sans" !important;
  font-size: 22px !important;
  font-weight: bold !important;
  color: #6515a6 !important;
  text-align: justify;
}

.formatoTextoFooterOrange {
  font-family: "Open Sans" !important;
  font-size: 16px !important;
  color: rgb(111, 110, 110) !important;
  text-align: center;
}

.formatoButtonOrangeMorado {
  background-color: #6515a6 !important;
  color: rgb(251, 251, 251) !important;
  font-family: "Open Sans" !important;
  font-size: 14px !important;
}

.formatoButtonOrangeGris {
  background-color: rgb(239, 233, 233) !important;
  color: #6515a6 !important;
  font-family: "Open Sans" !important;
  font-size: 14px !important;
}

.politicas-envio {
  font-size: 0.92rem;
  line-height: 1.45;
  color: rgb(139, 132, 132);
}

/* Subtítulos (Cambios en diseño personalizado, etc.) */
.politicas-envio h6 {
  font-size: 1rem;
  font-weight: 600;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  color: rgb(139, 132, 132);
}

/* Párrafos normales */
.politicas-envio p {
  margin: 0 0 0.5rem 0;
  text-align: justify !important;
  color: rgb(139, 132, 132);
}

/* Listas */
.politicas-envio ul {
  padding-left: 1.2rem;
  margin-bottom: 0.8rem;
  text-align: justify !important;
  color: rgb(139, 132, 132);
}

.politicas-envio li {
  margin-bottom: 0.3rem;
  line-height: 1.45;
  text-align: justify !important;
  color: rgb(139, 132, 132);
}

/* Destacar algunas palabras o frases clave */
.politicas-envio strong {
  font-weight: 600;
  color: rgb(139, 132, 132);
}

/* Opcional: estilizar subtítulos sin usar h6 */
.politicas-envio .subtitulo {
  font-weight: 600;
  margin-top: 1rem;
  margin-bottom: 0.4rem;
  color: rgb(139, 132, 132);
}

 
.modal-title{
  color: rgb(139, 132, 132);
}

/*---------------*/

#text-detalle-modal {
  text-align: justify !important;
}

/* Separar botones de control del carrusel */
#productosDestacadoCarrusel .carousel-control-prev,
#productosDestacadoCarrusel .carousel-control-next {
  width: 4%; /* Aumenta el área de clic */
}

#productosDestacadoCarrusel .carousel-control-prev {
  left: -60px; /* Mueve el botón más a la izquierda para mayor separación */
}

#productosDestacadoCarrusel .carousel-control-next {
  right: -60px; /* Mueve el botón más a la derecha para mayor separación */
}

/* Separar botones de control del carrusel */
#nuevosproductosCarrusel .carousel-control-prev,
#nuevosproductosCarrusel .carousel-control-next {
  width: 4%; /* Aumenta el área de clic */
}

#nuevosproductosCarrusel .carousel-control-prev {
  left: -50px; /* Mueve el botón más a la izquierda */
}

#nuevosproductosCarrusel .carousel-control-next {
  right: -50px; /* Mueve el botón más a la derecha */
}

@media (max-width: 992px) {
  /* Tablets y pantallas medianas */
  .carousel-inner img {
    max-height: 430px;
  }

  .section-contenedor {
    width: 100%;
    border-radius: 0;
    border-left: none;
    border-right: none;
  }
}

@media (max-width: 768px) {
  /* Celulares en orientación vertical */
  .carousel-inner img {
    max-height: 390px;
  }
}

@media (max-width: 480px) {
  /* Celulares más pequeños */
  .carousel-inner img {
    max-height: 340px;
  }
}

/* Ajustar la altura general del navbar */

/* Ajustar los enlaces del navbar */
.nav-link {
  padding: 0.25rem 0.5rem !important; /* Reduce el espacio interno de los enlaces */
  font-size: 14px !important; /* Tamaño de fuente más pequeño, ajusta según prefieras */
}

/* Responsive */
@media (max-width: 992px) {
  .d-none {
    display: none !important; /* Oculta menús grandes en pantallas medianas y pequeñas */
  }
  .d-lg-none {
    display: flex !important; /* Muestra el menú unificado solo en pantallas pequeñas */
  }
}

@media (min-width: 992px) {
  .d-lg-flex {
    display: flex !important; /* Muestra los menús separados en pantallas grandes */
  }
  .d-lg-none {
    display: none !important; /* Oculta el menú unificado en pantallas grandes */
  }
}

/* Ocultar el banner/carrusel en pantallas menores a 992px */
@media (max-width: 991.98px) {
  #carouselExampleIndicators {
    display: none !important;
  }
}

.navbar-toggler {
  color: white;
  border: 1px solid white; /* Borde blanco */
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=UTF8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='white'%3E%3Cpath d='M3 12h18v2H3v-2zm0 5h18v2H3v-2z'%3E%3C/path%3E%3C/svg%3E"); /* Ícono blanco */
}

.section-separacion-esp {
  margin-top: 35px !important; /* Espacio entre secciones */
  padding: 15px; /* Espacio interno para que se vea mejor */
  padding-top: 10px !important;
  min-height: 260px;
}

.section-contenedor {
  width: 90%;
  margin: 0 auto;
  border-radius: 40px;
  /*border: 2px solid #e0e0e0;*/
  background: inherit; /* Mantiene el fondo de cada sección */
  /*box-shadow: 0 2px 16px rgba(101,21,166,0.06);*/
  transition: width 0.3s;
}

.navbar-nav .nav-link {
  font-weight: bold; /* Texto más grueso */
  font-size: 1.2rem; /* Ajusta el tamaño del texto */
}

.navbar-brand {
  font-weight: bolder; /* Marca del logo más destacada */
  font-size: 1.3rem; /* Tamaño más grande para la marca */
}

.navbar-nav i {
  font-size: 1.5rem; /* Aumentar tamaño de los iconos */
}

.text-menu-nav {
  font-family: "Montserrat", comic sans-serif !important;
  font-size: 15px !important;
  margin-left: 8px !important;
}

.text-menu-navb {
  display: flex;
  align-items: center;
  height: 40px; /* Ajusta este valor según el alto de tu navbar*/
  background-color: transparent; /* O elimina esta línea si no quieres fondo*/
  font-family: "Raleway", comic sans-serif !important;
  font-size: 14px !important;
  font-weight: none !important;
  color: #6515a6 !important;
}

.text-menu-navc {
  font-family: "Roboto", comic sans-serif !important;
  font-size: 18px !important;
  margin-left: 40px !important;
}

.card.border-0 {
  background-color: yellow;
  max-width: 100% !important;
  margin-top: 40px !important; /* Centra las tarjetas */
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  height: auto !important;
  align-items: center !important;
  display: flex !important;
}

.card-img-top-clientes {
  /*height: 100px; /* Reduce la altura de las imágenes  
            object-fit: cover; /* Mantiene la proporción */
  /*cambio sugerido para reducir el tamaño de las imagenes de clientes*/
  height: 100px !important; /* Ajusta la altura según lo que desees */
  object-fit: contain !important;
  margin: 0 auto;
  display: block;
  align-items: center;
}
.card-body {
  padding: 2px; /* Reduce el espacio dentro de la tarjeta */
}
.card-title {
  font-size: 16px; /* Reduce el tamaño del título */
}
.card-text {
  font-size: 14px; /* Reduce el tamaño del texto */
}

/*Tarjetas productos destacados*/
.custom-col {
  flex: 0 0 calc(25% - 10px);
  max-width: calc(25% - 10px);
  margin: 5px;
}

.card-productos-destacado {
  width: 100%;
  height: 100%;
}

.card-img-top-pd {
  height: 320px;
  object-fit: cover;
}

.icono-whatsapp {
  font-size: 18px !important;
  color: #43b7aa !important;
  border-color: #43b7aa !important;
}

.text-tituloWhatsapp {
  font-family: "Roboto", comic sans-serif !important;
  font-size: 10px;
  color: #43b7aa !important;
}

.icono-correo {
  color: #43b7aa !important; /* Naranja (puedes cambiarlo) */
}

.text-tituloCorreo {
  font-family: "Roboto", comic sans-serif !important;
  font-size: 18px;
  color: #43b7aa !important;
}

.icono-whatsapp:hover {
  background-color: #43b7aa !important;
  font-size: 20px !important;
  color: white !important;
}

/*seccion de ubicacion */
/* Fondo rosa claro para los títulos */
.bg-light-pink {
  background-color: #f9c9d9; /* Color rosa claro */
  color: #6515a6; /* Texto en color complementario */

  /* display: inline-block; */
  min-width: 80%;
  padding: 0.75rem 2rem !important;
  border-radius: 2rem !important;
  margin: 0 auto 1rem auto;
  font-weight: bold;
  text-align: center;

  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.navbar-nav .nav-item i {
  font-size: 1.2rem !important;
  color: #6515a6;
  align-items: baseline;
}


/* Tarjetas con bordes suaves */
.card {
  border-radius: 20px; /* Bordes redondeados */
}

/* Espaciado y diseño centrado */
.img-fluid {
  max-height: 80px;
  object-fit: contain; /* Mantener proporción de la imagen */
}

/*ampliando el card de la section  ubicacio*/
.card-ubicacion {
  background-color: rgba(51, 129, 174, 0);
  max-width: 100%; /* Asegura que ocupe toda la columna */
  padding: 20px; /* Espaciado interno para que se vea mejor */
  border: none !important;
  box-shadow: none !important;
}

/* Centrar y quitar viñetas a los listados del footer */
.card-ubicacion ul,
.card-ubicacion ul li {
  list-style: none;
  padding-left: 0;
  text-align: center;
}

.card-ubicacion ul {
  margin-left: 0;
}

/* Ajustar ancho en pantallas grandes */
@media (min-width: 768px) {
  .card {
    background-color: red;
    max-width: 850px; /* Cambia según lo que necesites */
    margin: 0 auto; /* Centra el card en su contenedor */
  }
}

/* Ajustar títulos y fondo */
.bg-light-pink {
  background-color: #6515a6;
  color: white;
  border-radius: 5px;
}

/* Ajusta el estilo de las viñetas */
ul {
  list-style-type: disc; /* Cambia el tipo de viñeta (puedes usar 'circle', 'square', etc.) */
  padding-left: 20px; /* Añade espacio entre las viñetas y el contenido */
}

/* se comento afecta la posicion vertical de los items del menu
ul li {
    margin-bottom: 10px; /* Espaciado entre los ítems de la lista  
}*/

/* Botón flotante de WhatsApp */
.whatsapp-float {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 30px;
  right: 30px;
  background-color: #25d366;
  color: #fff;
  border-radius: 50%;
  text-align: center;
  font-size: 36px;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s;
  text-decoration: none !important;
}
.whatsapp-float:hover {
  background-color: #128c7e;
  color: #fff;
  text-decoration: none !important;
}

.bg-bienvenida {
  background: linear-gradient(135deg, #e8faf8 0%, #f7fafd 80%);
}

.bg-nuevo-productos {
  background: linear-gradient(135deg, #a9fcf4 5%, #e6f9f5 80%);
}

.bg-productos {
  background: linear-gradient(135deg, #e8faf8 0%, #f7fafd 80%);
}

.bg-clientes {
  background: linear-gradient(135deg, #a9fcf4 5%, #e6f9f5 80%);
}
.bg-storytime {
  background: linear-gradient(135deg, #e8faf8 0%, #f7fafd 80%);
}

.bg-noticias {
  background: linear-gradient(135deg, #a9fcf4 5%, #e6f9f5 80%);
}

h2,
.text-titulo {
  /*font-family: 'Montserrat', 'Poppins', Arial, sans-serif;*/
  font-family: "Open Sans" !important;
  /*font-family: 'Open Sans', Arial, Helvetica, sans-serif;*/
  /*font-size: 30px;*/
  font-size: 1.8rem;
  margin-left: 1px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #6515a6 !important;
}

.text-descripcion {
  font-family: "Open Sans" !important;
  /*font-size: 20px;*/
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 1px;
  color: #666666;
}

.text-descripcion-1 {
  font-family: "Open Sans" !important;
  /*font-size: 20px;*/
  font-size: 0.8rem;
  font-weight: 400;
  letter-spacing: 1px;
  color: #666666;
}

.text-nombre {
  font-family: "Open Sans" !important;
  /*font-size: 20px;*/
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 1px;
  color: #6515a6;
}

.btn-color {
  background-color: #24a2b0 !important;
}

/* Centrar subtítulos del footer */
.card-ubicacion h5 {
  text-align: center !important;
  margin-left: auto;
  margin-right: auto;
}

/* Centrar íconos y texto en la sección Contacto del footer */
.card-ubicacion ul li {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.card-ubicacion ul li i {
  margin-bottom: 4px;
  margin-right: 0 !important;
}