/*
 * ============================================================
 *  PARCHE SAFARI — Off-canvas Journals
 *  Objetivo: corregir textos e imágenes no visibles en Safari.
 *  NO modifica los estilos existentes (funcionales en Chrome).
 *
 *  @supports (-webkit-hyphens: none) identifica Safari (desktop
 *  + iOS) de forma precisa. Chrome, Edge y Firefox NO coinciden.
 * ============================================================
 */

@supports (-webkit-hyphens: none) {

    /* ----------------------------------------------------------
       1. Fix: inset:0 no soportado en Safari < 14.5.
          El backdrop usa inset:0; sin este fix no cubre la
          pantalla completa y no captura los taps de cierre.
       ---------------------------------------------------------- */
    #rwOffcanvasBackdrop,
    .rw-offcanvas-backdrop {
        top:    0 !important;
        right:  0 !important;
        bottom: 0 !important;
        left:   0 !important;
    }

    /* ----------------------------------------------------------
       2. Fix principal: Safari no propaga visibility:visible a
          nodos inyectados via innerHTML cuando el padre tenía
          visibility:hidden. Forzamos visible en todos los hijos
          del offcanvas cuando está abierto.
       ---------------------------------------------------------- */
    #rwOffcanvas.rw-offcanvas--open,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__header,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__title,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__body,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__content-inner,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__meta-row,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__meta-col,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__details,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__descripcion,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__imagen-wrapper,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__imagen,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__imagen img,
    #rwOffcanvas.rw-offcanvas--open p,
    #rwOffcanvas.rw-offcanvas--open span,
    #rwOffcanvas.rw-offcanvas--open a,
    #rwOffcanvas.rw-offcanvas--open strong,
    #rwOffcanvas.rw-offcanvas--open em {
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* ----------------------------------------------------------
       3. Fix: Safari bug con flex-column + overflow:hidden padre
          + hijos con min-height:0 → el contenido queda invisible.
          translateZ(0) fuerza un nuevo layer de composición y
          obliga a Safari a renderizar el contenido correctamente.
       ---------------------------------------------------------- */
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__body,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__content-inner,
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__details {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        /* Asegurar que occupe espacio real en el layout */
        -webkit-flex: 1 1 auto;
        flex: 1 1 auto;
        min-height: 0;
        min-height: -webkit-fill-available;
    }

    /* ----------------------------------------------------------
       4. Fix: overflow-y:auto a veces falla en Safari para
          crear un contexto de apilamiento correcto. Usamos
          scroll + -webkit-overflow-scrolling:touch para
          asegurar scroll inercial y renderizado del contenido.
       ---------------------------------------------------------- */
    #rwOffcanvas .rw-offcanvas__details {
        overflow-y: scroll !important;
        -webkit-overflow-scrolling: touch !important;
    }

    /* ----------------------------------------------------------
       5. Fix: imágenes dentro del offcanvas.
          Safari puede bloquear imágenes en elementos con
          visibility:hidden recién cambiado a visible.
       ---------------------------------------------------------- */
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__imagen img {
        display:    block !important;
        max-width:  100% !important;
        height:     auto !important;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }

    /* ----------------------------------------------------------
       6. Fix menor: close button
       ---------------------------------------------------------- */
    #rwOffcanvas.rw-offcanvas--open .rw-offcanvas__close,
    #rwOffcanvas.rw-offcanvas--open .close-icon {
        visibility: visible !important;
        opacity: 1 !important;
    }
}