/** Shopify CDN: Minification failed

Line 20:85 Unexpected "*"
Line 39:51 Unexpected "*"

**/
/* Grid de 2 columnas para galería de productos */

.product__media-gallery--grid {
  --grid-gap: 1rem;
}

/* Ocultar slider cuando se usa grid - SOLO DESKTOP */
@media screen and (min-width: 750px) {
  .product__media-gallery--grid .product__media-slider--hidden {
    display: none !important;
  }

  /* Ocultar completamente el slider principal cuando es grid */
  media-gallery[data-desktop-layout="grid_2_columns"] slider-component#GalleryViewer-*,
  media-gallery[data-desktop-layout="grid_2_columns"] #GalleryViewer-*,
  .product__media-gallery--grid slider-component,
  .product__media-gallery--grid .slider-mobile-gutter {
    display: none !important;
  }

  /* Asegurar que el grid sea completamente visible */
  .product__media-gallery--grid .product__media-grid-wrapper {
    display: block !important;
  }

  /* Ocultar botones de navegación del slider cuando es grid */
  media-gallery[data-desktop-layout="grid_2_columns"] .slider-buttons {
    display: none !important;
  }

  /* Ocultar thumbnails completamente cuando se usa grid - SOLO DESKTOP */
  .product__media-gallery--grid .thumbnail-slider,
  .product__media-gallery--grid #GalleryThumbnails-*,
  media-gallery[data-desktop-layout="grid_2_columns"] .thumbnail-slider,
  media-gallery[data-desktop-layout="grid_2_columns"] slider-component[id*="GalleryThumbnails"] {
    display: none !important;
  }

  /* Regla adicional para asegurar que no aparezcan thumbnails */
  [data-desktop-layout="grid_2_columns"] .thumbnail-list,
  [data-desktop-layout="grid_2_columns"] .thumbnail-slider {
    display: none !important;
  }
}

/* Grid container - SOLO DESKTOP */
@media screen and (min-width: 750px) {
  .product__media-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--grid-gap);
    margin-top: 1rem;
  }

  .product__media-grid-item {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 0.5rem;
    background-color: rgba(var(--color-foreground), 0.04);
  }

  .product__media-grid-item img,
  .product__media-grid-item video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
  }

  .product__media-grid-item:hover img,
  .product__media-grid-item:hover video {
    transform: scale(1.05);
  }
}

/* EN MÓVIL: Usar comportamiento normal (slider) */
@media screen and (max-width: 749px) {
  .product__media-gallery--grid .product__media-slider--hidden {
    display: block !important;
  }
  
  .product__media-gallery--grid .product__media-grid-wrapper {
    display: none !important;
  }
}

/* Badge para videos y modelos 3D - SOLO DESKTOP */
@media screen and (min-width: 750px) {
  .product__media-grid-item .thumbnail__badge {
    position: absolute;
    top: 0.75rem;
    left: 0.75rem;
    z-index: 2;
    background-color: rgba(var(--color-background), 0.9);
    border-radius: 50%;
    padding: 0.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  }

  .product__media-grid-item .thumbnail__badge .svg-wrapper {
    width: 1rem;
    height: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

/* Responsive design - Solo ajustes para diferentes tamaños de desktop */
@media screen and (min-width: 750px) and (max-width: 989px) {
  .product__media-grid {
    gap: 0.875rem;
  }
}

@media screen and (min-width: 990px) {
  .product__media-grid {
    gap: 1.25rem;
  }
  
  .product__media-grid-item {
    border-radius: 0.75rem;
  }
}

/* Auto-complete cuando hay número impar de imágenes - SOLO DESKTOP */
@media screen and (min-width: 750px) {
  .product__media-grid:has(.product__media-grid-item:nth-child(odd):last-child) .product__media-grid-item:last-child {
    grid-column: 1 / -1;
    aspect-ratio: 2/1;
  }
}

/* Animaciones de entrada - SOLO DESKTOP */
@media screen and (min-width: 750px) and (prefers-reduced-motion: no-preference) {
  .product__media-grid-item {
    animation: fadeInUp 0.6s ease forwards;
    opacity: 0;
    transform: translateY(20px);
  }
  
  .product__media-grid-item:nth-child(1) { animation-delay: 0.1s; }
  .product__media-grid-item:nth-child(2) { animation-delay: 0.2s; }
  .product__media-grid-item:nth-child(3) { animation-delay: 0.3s; }
  .product__media-grid-item:nth-child(4) { animation-delay: 0.4s; }
  .product__media-grid-item:nth-child(5) { animation-delay: 0.5s; }
  .product__media-grid-item:nth-child(6) { animation-delay: 0.6s; }
  .product__media-grid-item:nth-child(7) { animation-delay: 0.7s; }
  .product__media-grid-item:nth-child(8) { animation-delay: 0.8s; }
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Estados de focus y accesibilidad - SOLO DESKTOP */
@media screen and (min-width: 750px) {
  .product__media-grid-item:focus-within,
  .product__media-grid-item:hover {
    outline: 2px solid rgba(var(--color-foreground), 0.2);
    outline-offset: 2px;
  }
}

/* Mejoras para modo oscuro - SOLO DESKTOP */
@media screen and (min-width: 750px) and (prefers-color-scheme: dark) {
  .product__media-grid-item {
    background-color: rgba(var(--color-background), 0.1);
  }
  
  .product__media-grid-item .thumbnail__badge {
    background-color: rgba(var(--color-foreground), 0.9);
  }
}