/* Visor táctil de imágenes para combos y promociones. */
.quote-combo-card-shell{
  position:relative;
  display:flex;
  min-width:0;
  min-height:0;
}
.quote-combo-card-shell > .quote-combo-card{
  width:100%;
  height:100%;
}
.quote-combo-card .quote-family-img-wrap-catalog img{
  -webkit-user-drag:none;
  -webkit-touch-callout:none;
  user-select:none;
}
.promotion-image-zoom-button{
  position:absolute;
  z-index:6;
  top:13px;
  right:13px;
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  padding:0;
  border:1px solid rgba(255,255,255,.78);
  border-radius:50%;
  color:#fff;
  background:rgba(2,27,31,.78);
  box-shadow:0 7px 18px rgba(0,0,0,.28);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  cursor:zoom-in;
}
.promotion-image-zoom-button svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.promotion-image-zoom-button:active{transform:scale(.94)}
.promotion-image-zoom-button:focus-visible{
  outline:3px solid rgba(126,232,255,.74);
  outline-offset:2px;
}
.promotion-image-viewer-hint{
  display:flex;
  align-items:center;
  gap:7px;
  margin:7px 0 2px;
  color:#c8e8e8;
  font-size:11.5px;
  font-weight:750;
  line-height:1.35;
}

html.promotion-image-viewer-open,
body.promotion-image-viewer-open{
  overflow:hidden !important;
  overscroll-behavior:none;
}
.promotion-image-viewer[hidden]{display:none !important}
.promotion-image-viewer{
  position:fixed;
  inset:0;
  z-index:400000;
  display:grid;
  place-items:center;
  padding:0;
  color:#fff;
  background:rgba(0,8,10,.96);
  -webkit-tap-highlight-color:transparent;
}
.promotion-image-viewer__dialog{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  background:#030b0d;
}
.promotion-image-viewer__head{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  min-height:64px;
  padding:calc(10px + env(safe-area-inset-top, 0px)) 14px 10px;
  border-bottom:1px solid rgba(255,255,255,.1);
  background:rgba(2,17,20,.92);
}
.promotion-image-viewer__title{
  min-width:0;
  overflow:hidden;
  color:#f7ffff;
  font-size:15px;
  font-weight:900;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.promotion-image-viewer__close{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  padding:0;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  color:#fff;
  background:rgba(255,255,255,.1);
  font-size:27px;
  font-weight:500;
  line-height:1;
  cursor:pointer;
}
.promotion-image-viewer__close:focus-visible{
  outline:3px solid rgba(126,232,255,.7);
  outline-offset:2px;
}
.promotion-image-viewer__stage{
  position:relative;
  min-width:0;
  min-height:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  touch-action:none;
  cursor:grab;
  user-select:none;
}
.promotion-image-viewer__stage.is-dragging{cursor:grabbing}
.promotion-image-viewer__image{
  display:block;
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  transform:translate3d(0,0,0) scale(1);
  transform-origin:center center;
  will-change:transform;
  -webkit-user-drag:none;
  -webkit-touch-callout:none;
  user-select:none;
}
.promotion-image-viewer__image.is-animating{
  transition:transform .2s ease;
}
.promotion-image-viewer__help{
  min-height:48px;
  margin:0;
  padding:11px 16px calc(11px + env(safe-area-inset-bottom, 0px));
  border-top:1px solid rgba(255,255,255,.1);
  color:#c7dcdf;
  background:rgba(2,17,20,.92);
  font-size:11.5px;
  font-weight:700;
  line-height:1.35;
  text-align:center;
}
@media(max-width:430px){
  .promotion-image-zoom-button{top:11px;right:11px;width:33px;height:33px}
  .promotion-image-zoom-button svg{width:18px;height:18px}
}
@media(prefers-reduced-motion:reduce){
  .promotion-image-viewer__image.is-animating{transition:none}
  .promotion-image-zoom-button:active{transform:none}
}
