/* ===== OVERLAY ===== */

#fc-popup-overlay {

  position: fixed;

  inset: 0;

  /* Fondo más oscuro para destacar el popup */
  background: rgba(0, 0, 0, .60);

  /* Un poco más de desenfoque */
  backdrop-filter: blur(2px);

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 999999;

  opacity: 0;

  visibility: hidden;

  transition: opacity .3s ease, visibility .3s ease;

}


/* Activo */

#fc-popup-overlay.active {

  opacity: 1;

  visibility: visible;

}


/* ===== CONTENIDO ===== */

.fc-popup-content {

  position: relative;

  /* Más grande en PC */
  max-width: 800px;

  /* Mantiene el comportamiento responsive */
  width: 90%;

  border-radius: 18px;

  overflow: hidden;

  box-shadow: 0 25px 60px rgba(0, 0, 0, .4);

  animation: popupFadeIn .4s ease;

}


/* Imagen */

.fc-popup-content img {

  width: 100%;

  height: auto;

  display: block;

}



/* ===== BOTÓN CERRAR ===== */

.fc-popup-close {

  position: absolute;

  top: 10px;

  right: 12px;

  width: 36px;

  height: 36px;

  border-radius: 50%;

  border: 2px solid rgba(255, 255, 255, .85);

  background: rgba(255, 255, 255, .92);

  color: #9c0000;

  font-size: 35px;

  font-weight: 500;

  line-height: 32px;

  text-align: center;

  cursor: pointer;

  box-shadow: 0 3px 12px rgba(0, 0, 0, .18);

  transition: all .2s ease;

}


/* Efecto al pasar el mouse */

.fc-popup-close:hover {

  background: #ffffff;

  color: #750000;

  transform: scale(1.08);

  box-shadow: 0 4px 15px rgba(0, 0, 0, .25);

}


/* Al hacer clic */

.fc-popup-close:active {

  transform: scale(.96);

}


/* ===== ANIMACIÓN ===== */

@keyframes popupFadeIn {

  from {

    transform: translateY(20px);

    opacity: 0;

  }

  to {

    transform: translateY(0);

    opacity: 1;

  }

}


/* ===== RESPONSIVE MÓVIL ===== */

@media (max-width: 576px) {

  .fc-popup-content {

    /* En celular conserva prácticamente todo el ancho disponible */

    width: 95%;

    max-width: 95%;

    border-radius: 14px;

  }

  .fc-popup-close {

    width: 32px;

    height: 32px;

    top: 8px;

    right: 8px;

    font-size: 18px;

    line-height: 28px;

  }

}