/* Historial de pagos/cobros: visor de comprobantes exclusivo para telefono.
   Las imagenes usan su proporcion real y dejan de ocupar un lienzo de 94vh.
   Los PDF conservan el alto completo porque necesitan un area de lectura. */
@media (max-width: 539px) {
    html body .rv-cxp-proof-modal:not([hidden]) {
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        padding: 10px !important;
        padding:
            max(10px, env(safe-area-inset-top, 0px))
            max(10px, env(safe-area-inset-right, 0px))
            max(10px, env(safe-area-inset-bottom, 0px))
            max(10px, env(safe-area-inset-left, 0px)) !important;
    }

    html body .rv-cxp-proof-modal:not([hidden]) > .rv-cxp-proof-dialog,
    html body.pv-has-open-modal .rv-cxp-proof-modal:not([hidden]) > .rv-cxp-proof-dialog {
        width: 100% !important;
        max-width: 430px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: calc(var(--pv-modal-viewport-height, 100dvh) - 20px) !important;
        grid-template-rows: auto auto auto !important;
        overflow: hidden !important;
        border-radius: 19px !important;
    }

    html body .rv-cxp-proof-head {
        gap: 10px !important;
        padding: 11px 12px !important;
    }

    html body .rv-cxp-proof-head-icon {
        width: 36px !important;
        height: 36px !important;
        flex-basis: 36px !important;
        border-radius: 11px !important;
    }

    html body .rv-cxp-proof-head-icon svg {
        width: 17px !important;
        height: 17px !important;
    }

    html body .rv-cxp-proof-head-copy span {
        margin-bottom: 2px !important;
        font-size: 7.5px !important;
    }

    html body .rv-cxp-proof-head-copy strong {
        font-size: 12px !important;
    }

    html body .rv-cxp-proof-close {
        width: 36px !important;
        height: 36px !important;
        flex-basis: 36px !important;
        border-color: #d9dfea !important;
        border-radius: 11px !important;
        background: #fff !important;
        color: #7042f1 !important;
        box-shadow: 0 4px 12px rgba(65, 46, 128, .08) !important;
        font-size: 22px !important;
        line-height: 1 !important;
    }

    html body .rv-cxp-proof-stage {
        box-sizing: border-box !important;
        width: 100% !important;
        min-height: 0 !important;
        max-height: calc(var(--pv-modal-viewport-height, 100dvh) - 148px) !important;
        padding: 12px !important;
        overflow: auto !important;
        background: #eef1f6 !important;
        overscroll-behavior: contain !important;
    }

    html body .rv-cxp-proof-stage > img[data-pv-proof-image]:not([hidden]) {
        display: block !important;
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: calc(var(--pv-modal-viewport-height, 100dvh) - 172px) !important;
        margin: auto !important;
        object-fit: contain !important;
        border-radius: 11px !important;
        background: #fff !important;
        box-shadow: 0 10px 28px rgba(20, 28, 48, .16) !important;
    }

    html body .rv-cxp-proof-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 10px !important;
    }

    html body .rv-cxp-proof-download,
    html body .rv-cxp-proof-back {
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 0 9px !important;
        border-radius: 10px !important;
        font-size: 9px !important;
        text-align: center !important;
    }

    /* Un PDF si requiere el alto util completo. Esta regla tambien cubre
       archivos que el navegador no puede convertir a una imagen directa. */
    html body .rv-cxp-proof-modal:not([hidden]) > .rv-cxp-proof-dialog:has(.rv-cxp-proof-stage > iframe:not([hidden])):not(.pv-mobile-proof-image),
    html body.pv-has-open-modal .rv-cxp-proof-modal:not([hidden]) > .rv-cxp-proof-dialog:has(.rv-cxp-proof-stage > iframe:not([hidden])):not(.pv-mobile-proof-image) {
        height: calc(var(--pv-modal-viewport-height, 100dvh) - 20px) !important;
        grid-template-rows: auto minmax(0, 1fr) auto !important;
    }

    html body .rv-cxp-proof-dialog:has(.rv-cxp-proof-stage > iframe:not([hidden])):not(.pv-mobile-proof-image) .rv-cxp-proof-stage {
        max-height: none !important;
        padding: 8px !important;
        overflow: hidden !important;
    }

    html body .rv-cxp-proof-dialog:has(.rv-cxp-proof-stage > iframe:not([hidden])):not(.pv-mobile-proof-image) .rv-cxp-proof-stage > iframe {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        border-radius: 10px !important;
    }
}
