/* ----------------------------------------------------------
   MAGNIFIC POPUP – CUSTOM PREMIUM STYLES (Subgrafica)
   Uso global para TODOS los popups del tema
----------------------------------------------------------- */

/* =========================================
   OVERLAY + BACKGROUND
========================================= */

.mfp-fade.mfp-bg {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.mfp-fade.mfp-bg.mfp-ready {
  opacity: 1;
  background-color: #0C0C0C !important; /* fondo premium */
}

.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* =========================================
   CONTENT FADE
========================================= */

.mfp-fade .mfp-content {
  opacity: 0;
  transition: opacity 0.3s ease 0.3s;
}

.mfp-fade.mfp-ready .mfp-content {
  opacity: 1;
}

.mfp-fade.mfp-removing .mfp-content {
  opacity: 0;
  transition-delay: 0s;
}

/* =========================================
   CLOSE BUTTON (SUBGRAFICA)
   – botón premium igual al de Video Popup
   – fijo en esquina superior derecha
========================================= */

.mfp-close {
  position: fixed !important;
  top: 20px !important;
  right: 2% !important;

  width: 20px !important;
  height: 20px !important;

  background: url('https://sbgrfc.com/martin/wp-content/themes/subgrafica-theme/data/img/close_bl_2@2x.png')
              no-repeat center center !important;

  background-size: contain !important;
  border: none !important;

  color: transparent !important;
  font-size: 0 !important;

  opacity: 0.6 !important;
  padding: 0 !important;

  z-index: 9999999 !important;
  transition: opacity 0.3s ease;
}

.mfp-close:hover {
  opacity: 1 !important;
}

/* =========================================
   IFRAME CONTAINER
========================================= */

.mfp-iframe-scaler {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%; /* 16:9 */
  overflow: hidden;
}

.mfp-iframe-scaler iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: #000;
  box-shadow: 0 0 8px rgba(0,0,0,0.0) !important;
}
.mfp-figure::after {
  content: '';
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 0px rgba(0, 0, 0, 0.0);
  background: transparent;
}
/* =========================================
   Z-INDEX GLOBAL FIX
========================================= */

.mfp-bg,
.mfp-wrap {
  z-index: 999999 !important;
}

/* =========================================
   OPTIONAL – IMPROVED SHADOW (si lo deseas)
========================================= */
/*
.mfp-content {
  filter: drop-shadow(0px 4px 18px rgba(0,0,0,0.4));
}
*/