/*! http://responsiveslides.com v1.55 by @viljamis */

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width:50%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 50%;
  border: 0;
  }

/* Clase para los botones del slider - Línea 35 */
.boton-slider {
  display: block;
  border-radius: 25px;
  border: 2px solid #0a74b6;
  padding: 18px;
  width: 120px;
  height: 40px;
  color: #0a74b6;
  font-size: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 8.5%;
  position: absolute;
  right: 10%;
  top: 80%;
  transform: translateY(-50%);
  z-index: 0;
  white-space: nowrap;
  transition: all 0.6s ease-in-out;
  opacity: 0;
  animation: fadeInButtonDesktop 0.8s ease-in-out forwards;
}

@keyframes fadeInButtonDesktop {
  0% {
    opacity: 0;
    transform: translateY(-50%) translateX(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
  }
}

.boton-slider:hover {
  background-color: #0a74b6;
  color: #ffffff;
  transform: translateY(-50%) scale(1.05);
  box-shadow: 0 6px 12px rgba(10, 116, 182, 0.3);
}

/* Media query para pantallas menores a 600px */
@media (max-width: 600px) {
  /* Configuración general para todas las imágenes del slider */
  .carousel .item img {
    width: 100%;
    height: auto;
    max-height: 513px;
    object-fit: contain;
  }
  
  /* Banda azul inferior para cada slide - SOLO MÓVIL */
  .slide-footer {
    position: relative;
    width: 100%;
    background-color: #0a74b6;
    padding: 15px 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    z-index: 10;
    opacity: 0;
    animation: fadeInSlideFooter 0.8s ease-in-out forwards;
  }

  @keyframes fadeInSlideFooter {
    0% {
      opacity: 0;
      transform: translateY(20px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }

  /* Asegurar que la banda azul siempre esté visible */
  .carousel .item .slide-footer {
    display: flex !important;
    visibility: visible !important;
  }

  /* Clase para los botones del slider - SOLO MÓVIL */
  .boton-slider {
    display: inline-block;
    border-radius: 25px;
    border: none;
    background-color: transparent;
    padding: 12px 24px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
    text-align: center;
    transition: all 0.6s ease-in-out;
    cursor: pointer;
    position: static;
    left: auto;
    right: auto;
    top: auto;
    transform: none;
    width: auto;
    height: auto;
    opacity: 0;
    animation: fadeInButton 0.8s ease-in-out forwards;
  }

  @keyframes fadeInButton {
    0% {
      opacity: 0;
      transform: translateY(10px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .boton-slider:hover {
    background-color: #ffffff;
    color: #0a74b6;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  }
  
  /* Slide 1: Gasas - Imagen dummy específica */
  .carousel .item:nth-child(1) img {
    content: url('../img/home/01\ home\ imgs-\ gasa\ gasana.png');
  }
  
  /* Slide 2: Envases/Frascos - Imagen dummy específica */
  .carousel .item:nth-child(2) img {
    content: url('../img/home/02\ home\ imgs-envases-gasana.png');
  }
  
  /* Slide 3: Bálsamos - Imagen dummy específica */
  .carousel .item:nth-child(3) img {
    content: url('../img/home/10-home-imgs--balsamo-gasana.jpg');
  }
  
  /* Slide 4: Árnica - Imagen dummy específica */
  .carousel .item:nth-child(4) img {
    content: url('../img/home/home-arnica.jpg');
  }
  
  /* Slide 5: Cinta Hipo - Imagen dummy específica */
  .carousel .item:nth-child(5) img {
    content: url('../img/home/home-cintahipo.jpg');
  }
  
  /* VERSIÓN EN INGLÉS - Imágenes de productos en inglés */
  /* Solo aplicar cuando la página está en inglés */
  html[lang="en"] .carousel .item:nth-child(1) img {
    content: url('../img/01home.png');
  }
  
  html[lang="en"] .carousel .item:nth-child(2) img {
    content: url('../img/02home.png');
  }
  
  html[lang="en"] .carousel .item:nth-child(3) img {
    content: url('../img/10home.jpg');
  }
  
  html[lang="en"] .carousel .item:nth-child(4) img {
    content: url('../img/12home.png');
  }
  
  html[lang="en"] .carousel .item:nth-child(5) img {
    content: url('../img/11home.jpg');
  }
  
  /* Ajustar la banda azul para móviles */
  .slide-footer {
    padding: 12px 15px;
  }
  
  /* Ajustar el botón para móviles */
  .boton-slider {
    padding: 10px 20px;
    font-size: 14px;
  }
}
  
  /* Ajustar la banda azul para móviles */
  .slide-footer {
    padding: 12px 15px;
  }
  
  /* Ajustar el botón para móviles */
  .boton-slider {
    padding: 10px 20px;
    font-size: 14px;
  }
