/* GaleriaDigital: visor de fotos de producto (assets/js/galeriaDigital.js) y foto principal de la ficha tecnica. 2026-10-17 */
html.gd-abierta, html.gd-abierta body { overflow: hidden !important; }

.gd { position: fixed; inset: 0; z-index: 20000; display: flex; flex-direction: column; background: rgba(12, 14, 18, .96);
      color: #fff; font-family: inherit; -webkit-tap-highlight-color: transparent; }
.gd[hidden] { display: none; }

.gd-barra { display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 16px; min-height: 56px; box-sizing: border-box; }
.gd-titulo { flex: 1; min-width: 0; line-height: 1.3; }
.gd-titulo strong { display: block; font-size: 16px; letter-spacing: .3px; }
.gd-titulo span { display: block; font-size: 13px; color: #c9ced6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gd-contador { font-size: 14px; color: #c9ced6; font-variant-numeric: tabular-nums; }

.gd-btn { border: 0; cursor: pointer; color: #fff; background: rgba(255, 255, 255, .12); border-radius: 50%;
          display: inline-flex; align-items: center; justify-content: center; transition: background .15s; }
.gd-btn:hover { background: rgba(255, 255, 255, .24); }
.gd-btn:focus-visible { outline: 3px solid #ffb23e; outline-offset: 2px; }
.gd-cerrar { width: 44px; height: 44px; font-size: 28px; line-height: 1; flex: none; }

.gd-escenario { position: relative; flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center;
                overflow: hidden; touch-action: none; user-select: none; -webkit-user-select: none; }
.gd-img, .gd-mini { max-width: calc(100% - 32px); max-height: calc(100% - 16px); object-fit: contain; }
.gd-img { position: relative; z-index: 1; transform-origin: center center; will-change: transform; background: #fff; border-radius: 4px; cursor: zoom-in; }
.gd[data-zoom="1"] .gd-img { cursor: grab; }
.gd[data-zoom="1"] .gd-img:active { cursor: grabbing; }
.gd-mini { position: absolute; z-index: 0; width: min(100% - 32px, 1000px); filter: blur(6px); opacity: 0; transition: opacity .2s; background: #fff; border-radius: 4px; }
.gd-cargando-foto .gd-mini { opacity: 1; }
.gd-cargando-foto .gd-img { opacity: 0; }

.gd-cargando { position: absolute; z-index: 2; width: 40px; height: 40px; border-radius: 50%; border: 4px solid rgba(255, 255, 255, .25);
               border-top-color: #fff; animation: gd-girar .8s linear infinite; display: none; }
.gd-cargando-foto .gd-cargando { display: block; }
@keyframes gd-girar { to { transform: rotate(360deg); } }
.gd-error .gd-img { opacity: 1; }

.gd-nav { position: absolute; z-index: 3; top: 50%; width: 52px; height: 52px; margin-top: -26px; font-size: 38px; line-height: 1; padding-bottom: 4px; }
.gd-prev { left: 12px; }
.gd-next { right: 12px; }

.gd-ayuda { position: absolute; z-index: 3; bottom: 14px; left: 50%; transform: translateX(-50%); max-width: calc(100% - 32px);
            padding: 8px 14px; border-radius: 20px; background: rgba(0, 0, 0, .65); font-size: 13px; text-align: center;
            pointer-events: none; opacity: 0; transition: opacity .4s; }
.gd-ayuda.gd-visible { opacity: 1; }

.gd-tira { display: flex; gap: 8px; padding: 10px 12px 14px; overflow-x: auto; justify-content: center; -webkit-overflow-scrolling: touch; }
.gd-tira.gd-oculta { display: none; }
.gd-miniatura { flex: none; width: 76px; height: 54px; padding: 0; border: 2px solid transparent; border-radius: 6px; background: #fff;
                cursor: pointer; overflow: hidden; opacity: .65; transition: opacity .15s, border-color .15s; }
.gd-miniatura img { width: 100%; height: 100%; object-fit: contain; display: block; }
.gd-miniatura:hover { opacity: 1; }
.gd-miniatura.gd-activa { border-color: #e53935; opacity: 1; }
.gd-miniatura:focus-visible { outline: 3px solid #ffb23e; outline-offset: 1px; }

@media (max-width: 640px) {
    .gd-barra { min-height: 50px; padding: 6px 8px 6px 12px; }
    .gd-titulo strong { font-size: 15px; }
    .gd-nav { width: 42px; height: 42px; margin-top: -21px; font-size: 30px; background: rgba(0, 0, 0, .35); }
    .gd-prev { left: 6px; } .gd-next { right: 6px; }
    .gd-img, .gd-mini { max-width: 100%; }
    .gd-tira { justify-content: flex-start; padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
    .gd-miniatura { width: 64px; height: 46px; }
}

/* ---- Ficha tecnica: foto principal y miniaturas ---- */
.gd-ficha { text-align: center; }
.gd-ficha-principal { position: relative; display: block; width: 100%; max-width: 520px; margin: 0 auto; padding: 0; border: 1px solid #e3e6ea;
                      border-radius: 6px; background: #fff; cursor: zoom-in; overflow: hidden; }
.gd-ficha-principal img { display: block; width: 100%; height: auto; aspect-ratio: 1000 / 711; object-fit: contain; }
.gd-ficha-lupa { position: absolute; right: 10px; bottom: 10px; padding: 6px 12px; border-radius: 16px; background: rgba(0, 0, 0, .62);
                 color: #fff; font-size: 13px; pointer-events: none; }
.gd-ficha-principal:focus-visible { outline: 3px solid #ffb23e; outline-offset: 2px; }
.gd-ficha-tira { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin: 10px auto 0; max-width: 520px; }
.gd-ficha-tira button { width: 72px; height: 52px; padding: 0; border: 2px solid #e3e6ea; border-radius: 6px; background: #fff; cursor: pointer; overflow: hidden; }
.gd-ficha-tira button img { width: 100%; height: 100%; object-fit: contain; display: block; }
.gd-ficha-tira button.gd-activa { border-color: #e53935; }
.gd-ficha-codigo { margin: 10px 0 6px; font-size: 20px; }

/* Listado de Consultar productos: la miniatura invita a ampliar */
.gd-ampliable { cursor: zoom-in; }