/* Fix para el lightbox - mostrar imágenes grandes y centradas */

/* Contenedor principal del lightbox */
.mfp-wrap {
    z-index: 99999 !important;
}

.mfp-container {
    padding: 0 !important;
    text-align: center !important;
}

.mfp-container:before {
    content: '' !important;
    display: inline-block !important;
    height: 100% !important;
    vertical-align: middle !important;
}

/* Contenedor de la imagen */
.mfp-image-holder .mfp-content {
    max-width: 100% !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 auto !important;
    text-align: left !important;
}

/* La figura que contiene la imagen */
.mfp-figure {
    margin: 0 !important;
    display: block !important;
}

.mfp-figure:after {
    display: none !important;
}

/* La imagen en sí */
.mfp-img {
    width: auto !important;
    height: auto !important;
    max-width: 90vw !important;
    max-height: 90vh !important;
    display: block !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Fondo del lightbox */
.mfp-bg {
    opacity: 0.95 !important;
    background: #000 !important;
}

/* Botón de cerrar */
.mfp-close {
    color: #fff !important;
    opacity: 1 !important;
}

/* Flechas de navegación */
.mfp-arrow {
    opacity: 1 !important;
}

.mfp-arrow-left {
    left: 30px !important;
}

.mfp-arrow-right {
    right: 30px !important;
}

/* Responsive para tablets */
@media (max-width: 1024px) {
    .mfp-img {
        max-width: 85vw !important;
        max-height: 85vh !important;
    }
    
    .mfp-arrow-left {
        left: 20px !important;
    }
    
    .mfp-arrow-right {
        right: 20px !important;
    }
}

/* Responsive para móviles */
@media (max-width: 768px) {
    .mfp-img {
        max-width: 95vw !important;
        max-height: 80vh !important;
    }
    
    .mfp-arrow-left {
        left: 10px !important;
    }
    
    .mfp-arrow-right {
        right: 10px !important;
    }
}