/* HM ORIGENS - CIPHER MOBILE FIX V4 */

/* Celulares, incluindo iOS em tela cheia */
@media (max-width: 600px) {

    #zion-modal-v1.zion-modal {

        --cipher-safe-top: max(
            62px,
            calc(env(safe-area-inset-top, 0px) + 12px)
        );

        --cipher-safe-bottom: max(
            14px,
            calc(env(safe-area-inset-bottom, 0px) + 8px)
        );

        position: fixed !important;

        inset: auto !important;

        top: calc(
            var(--cipher-c3-top, 0px)
            + var(--cipher-safe-top)
        ) !important;

        left: 10px !important;
        right: 10px !important;
        bottom: auto !important;

        transform: none !important;
        margin: 0 !important;

        width: calc(100vw - 20px) !important;

        height: min(
            620px,
            calc(
                var(--cipher-c3-height, 100dvh)
                - var(--cipher-safe-top)
                - var(--cipher-safe-bottom)
            )
        ) !important;

        max-height: none !important;
        min-height: 0 !important;

        overflow: hidden !important;
        border-radius: 16px;
    }

    #zion-modal-v1.zion-modal[open] {
        display: flex !important;
        flex-direction: column !important;
    }

    /* Cabecalho protegido da barra de status */

    #zion-modal-v1 .zion-top {
        flex: 0 0 auto !important;
        align-items: center;
        gap: 10px;
        padding: 11px 12px;
        min-height: 70px;
        box-sizing: border-box;
    }

    #zion-modal-v1 .zion-top > div {
        min-width: 0;
        flex: 1 1 auto;
    }

    #zion-modal-v1 .zion-top strong {
        font-size: 15px;
        line-height: 1.25;
    }

    #zion-modal-v1 .zion-top small {
        font-size: 11px;
        line-height: 1.35;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    #zion-modal-v1 .zion-close {
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        display: grid;
        place-items: center;
        padding: 0;
        font-size: 26px;
        line-height: 1;
        border-radius: 10px;
    }

    /* Historico rola, rodape fica disponivel */

    #zion-modal-v1 .zion-history {
        min-height: 0 !important;
        flex: 1 1 0 !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        padding: 12px 10px;
    }

    #zion-modal-v1 .zion-form {
        flex: 0 0 auto !important;
        display: flex;
        gap: 8px;
        padding: 9px 10px;
    }

    #zion-modal-v1 .zion-form input {
        min-width: 0;
        min-height: 44px;
        flex: 1 1 auto;
        font-size: 16px;
    }

    #zion-modal-v1 .zion-form button {
        flex: 0 0 auto;
        min-height: 44px;
        padding: 8px 13px;
    }

    #zion-modal-v1 .zion-links {
        flex: 0 0 auto !important;
        padding: 8px 10px 12px;
        gap: 16px;
    }

    #zion-modal-v1 .zion-links a {
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
    }

    /* Sem perguntas prontas */

    #zion-modal-v1 .zion-shortcuts,
    #zion-modal-v1 .zion-catalog {
        display: none !important;
    }
}

/* Tablet */
@media (min-width: 601px) and (max-width: 1100px) {

    #zion-modal-v1.zion-modal {
        width: min(510px, calc(100vw - 36px)) !important;
        max-height: calc(100dvh - 60px) !important;
        overflow: hidden !important;
    }

    #zion-modal-v1 .zion-history {
        min-height: 0;
        overflow-y: auto;
    }
}