/* Design/css/custom.css */

#ofertas-button {
  position: fixed;
  bottom: 25px;
  right: 25px;
  width: 100px; /* Ancho del área del botón */
  height: 100px; /* Alto del área del botón */
  background-color: transparent;
  border: none;
  cursor: pointer;
  z-index: 1050;
  padding: 0;
  transition: transform 0.2s ease-in-out;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.3)); /* Sombra para que resalte */
}

#ofertas-button:hover {
  transform: scale(1.1); /* Efecto al pasar el mouse */
}

/* Estilos para el SVG de la estrella */
#ofertas-button svg .star-shape {
  fill: #d3a77e; /* Color dorado que combina con tu sitio */
  stroke: #a07d5b; /* Borde sutil */
  stroke-width: 5;
}

/* Estilos para el texto "Ofertas" dentro de la estrella */
#ofertas-button svg .star-text {
  fill: white;
  font-family: 'Poppins', sans-serif; /* Usa una fuente de tu sitio */
  font-size: 20px; /* Tamaño del texto */
  font-weight: 600; /* Grosor del texto */
  text-anchor: middle; /* Centrado horizontal */
  dominant-baseline: middle; /* Centrado vertical */
}

/* Estilo para el header del modal para que combine */
#screenshotsModal .modal-header {
    background-color: #f8f3f0;
    border-bottom: 1px solid #d3a77e;
}

/* =============================================
   ESTILOS PARA ADAPTAR IMÁGENES DENTRO DEL POPUP
   ============================================= */

/* 1. Definimos un tamaño máximo y un fondo para el carrusel */
#ofertasCarousel {
  max-height: 85vh; /* El carrusel ocupará como máximo el 85% de la altura de la pantalla */
  background-color: #1c1c1c; /* Un fondo oscuro para las barras negras (letterboxing) */
}

/* 2. Hacemos que la imagen se ajuste al contenedor sin deformarse */
#ofertasCarousel .carousel-item img {
  width: 100%; /* La imagen intentará ocupar el 100% del ancho... */
  height: 85vh; /* ...y el 100% de la altura máxima definida para el carrusel... */
  
  /* ESTA ES LA PROPIEDAD MÁGICA */
  object-fit: contain; /* ...pero 'contain' la escalará para que quepa completamente sin cortarse ni deformarse. */
}