/* CIPHER_MOBILE_FLEX_V6
   Corrige o historico expandido no celular.
   Preserva cabecalho, formulario e contatos.
*/

@media screen and (max-width: 600px) {

    #zion-modal-v1#zion-modal-v1 {
        height: fit-content !important;
        min-height: 0 !important;

        max-height: min(
            580px,
            calc(100dvh - 88px)
        ) !important;

        flex-direction: column !important;
        overflow: hidden !important;
    }

    #zion-modal-v1#zion-modal-v1 .zion-history {
        flex: 0 1 auto !important;

        height: auto !important;
        min-height: 0 !important;

        max-height: min(
            330px,
            42dvh
        ) !important;

        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    #zion-modal-v1#zion-modal-v1 .zion-top,
    #zion-modal-v1#zion-modal-v1 .zion-form,
    #zion-modal-v1#zion-modal-v1 .zion-links {
        flex: 0 0 auto !important;
    }
}

/* CIPHER_MOBILE_CENTRADO_V7
   Centraliza o modal abaixo da area do cabecalho.
   Nao altera o layout do site.
*/

@media screen and (max-width: 600px) {

    #zion-modal-v1#zion-modal-v1 {
        position: fixed !important;

        /* Centro da area abaixo do cabecalho */
        top: calc(50dvh + 62px) !important;

        left: 50% !important;
        right: auto !important;
        bottom: auto !important;

        transform: translate(-50%, -50%) !important;

        width: min(
            420px,
            calc(100vw - 24px)
        ) !important;

        height: fit-content !important;
        min-height: 0 !important;

        max-height: min(
            580px,
            calc(100dvh - 140px)
        ) !important;

        margin: 0 !important;
        overflow: hidden !important;
    }

    #zion-modal-v1#zion-modal-v1 .zion-history {
        flex: 0 1 auto !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: min(330px, 40dvh) !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    #zion-modal-v1#zion-modal-v1 .zion-top,
    #zion-modal-v1#zion-modal-v1 .zion-form,
    #zion-modal-v1#zion-modal-v1 .zion-links {
        flex: 0 0 auto !important;
    }
}
