/* ==========================================================================
   root-8a5edab2--imgs.css — bloques convertidos a imagen (.xshot-img)
   El wrapper conserva su clase original (posición, márgenes, sombra, fondo);
   se anulan altura y padding porque la captura ya los incluye.
   El formulario de login NO se convierte: sigue siendo HTML real.
   ========================================================================== */

.xshot-img {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
}

.xshot-img > picture {
  display: block;
}

.xshot-img > picture > img {
  display: block;
  width: 100%;
  height: auto;
}

/* El display:block !important de .xshot-img le gana a style.display='none';
   el cierre del banner usa el atributo hidden (y este override con !important). */
.x-cookie-banner[hidden] {
  display: none !important;
}

/* ---- Cookie banner: boton de cierre real (invisible) sobre el aspa de la imagen.
   Centros calculados de la captura original: movil aspa centro a 24px del borde
   derecho y 28px del top (alto 184); desktop a 44px / 47px (alto 93).
   Los % se mantienen exactos porque el overlay escala con la imagen. ---- */
.x-cookie-banner .x-cookie-banner__close {
  position: absolute;
  right: 6.667%;        /* 360: 24/360 */
  top: 15.217%;         /* 28/184 */
  transform: translate(50%, -50%);
  background-image: none;  /* el aspa ya viene en la captura */
  z-index: 2;
}

@media (min-width: 421px) and (max-width: 767px) {
  .x-cookie-banner .x-cookie-banner__close { right: 5%; }        /* 480: 24/480 */
}

@media (min-width: 768px) and (max-width: 896px) {
  .x-cookie-banner .x-cookie-banner__close { right: 5.729%; top: 50.538%; }  /* 768 */
}

@media (min-width: 897px) and (max-width: 1024px) {
  .x-cookie-banner .x-cookie-banner__close { right: 4.297%; top: 50.538%; }  /* 1024 */
}

@media (min-width: 1025px) and (max-width: 1680px) {
  .x-cookie-banner .x-cookie-banner__close { right: 3.056%; top: 50.538%; }  /* 1440 */
}

@media (min-width: 1681px) {
  .x-cookie-banner .x-cookie-banner__close { right: 2.292%; top: 50.538%; }  /* 1920 */
}

.x-cookie-banner .x-cookie-banner__close:focus-visible {
  outline: 2px solid var(--color-link);
  outline-offset: 2px;
  border-radius: 50%;
}
