/*
 * ry-lightbox.css - Estilos del lightbox moderno
 * Este archivo es cargado por functions.php solo cuando Jetpack no tiene lightbox activo.
 */

/* La mayor parte de los estilos están en style.css del tema hijo.
   Este archivo añade estilos adicionales que se cargan como hoja separada
   para mayor compatibilidad con LiteSpeed Cache (que puede combinar CSS). */

/* -------------------------------------------------------
   LIGHTBOX - Complemento
   ------------------------------------------------------- */

/* Asegurar que el overlay se superpone a todos los elementos */
.ry-lb-overlay {
    -webkit-overflow-scrolling: touch;
}

/* Fix para Safari: backdrop-filter requiere prefijo */
@supports (-webkit-backdrop-filter: blur(4px)) {
    .ry-lb-overlay {
        -webkit-backdrop-filter: blur(4px);
    }
}

/* Fix para Edge Legacy */
@supports not (backdrop-filter: blur(4px)) {
    .ry-lb-overlay {
        background: rgba(0,0,0,0.95) !important;
    }
}

/* Imagen en alta resolución */
.ry-lb-img {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: none;
}

/* Animación de entrada del wrap */
@-webkit-keyframes ry-lb-fade-in {
    from { opacity: 0; -webkit-transform: scale(0.94); transform: scale(0.94); }
    to   { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes ry-lb-fade-in {
    from { opacity: 0; transform: scale(0.94); }
    to   { opacity: 1; transform: scale(1); }
}

.ry-lb-wrap {
    -webkit-animation: ry-lb-fade-in 0.25s ease;
    animation: ry-lb-fade-in 0.25s ease;
}

/* Spinner */
@-webkit-keyframes ry-lb-spin {
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes ry-lb-spin {
    to { transform: rotate(360deg); }
}

/* Focus visible para botones del lightbox (accesibilidad) */
.ry-lb-close:focus,
.ry-lb-prev:focus,
.ry-lb-next:focus {
    outline: 3px solid #fff;
    outline-offset: 2px;
}

/* Scrollbar de miniaturas en WebKit */
.ry-lb-thumbs::-webkit-scrollbar {
    height: 4px;
}
.ry-lb-thumbs::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.1);
    border-radius: 2px;
}
.ry-lb-thumbs::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.35);
    border-radius: 2px;
}

/* Reducir animaciones para usuarios que lo prefieren */
@media (prefers-reduced-motion: reduce) {
    .ry-lb-wrap { animation: none; -webkit-animation: none; }
    .ry-lb-spinner { animation: none; -webkit-animation: none; }
    .ry-lb-img { transition: none; }
}

/* -------------------------------------------------------
   EDITOR CSS - estilos para el editor de bloques Gutenberg
   ------------------------------------------------------- */
