/* Multicanais Global Mobile Download Banner */

.mc-global-download-banner {
    display: none;
}

@media (max-width: 849px) {

    .mc-global-download-banner {
        position: fixed !important;
        left: 8px !important;
        right: 8px !important;
        bottom: 8px !important;

        z-index: 99990 !important;

        display: block;
        width: auto;

        margin: 0;
        padding: 0;

        overflow: hidden;

        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: 13px;

        background: transparent;

        box-shadow:
            0 12px 34px rgba(4, 13, 27, .22),
            0 3px 10px rgba(4, 13, 27, .12);

        line-height: 0;
    }

    .mc-global-download-banner[hidden] {
        display: none !important;
    }

    .mc-global-download-banner-link {
        display: block;
        width: 100%;

        margin: 0;
        padding: 0;

        line-height: 0;
        text-decoration: none !important;
    }

    .mc-global-download-banner-link img {
        display: block;

        width: 100%;
        height: auto;

        margin: 0;
        padding: 0;

        border: 0;

        object-fit: contain;
    }

    .mc-global-download-banner-close {
        position: absolute;
        top: 6px;
        right: 6px;

        width: 28px;
        height: 28px;

        display: flex;
        align-items: center;
        justify-content: center;

        margin: 0;
        padding: 0;

        z-index: 3;

        border: 0;
        border-radius: 50%;

        background: rgba(5, 15, 28, .76);
        color: #fff;

        box-shadow: none;
        cursor: pointer;
    }

    .mc-global-download-banner-close svg {
        display: block;

        width: 15px;
        height: 15px;

        fill: none;
        stroke: currentColor;
        stroke-width: 2.2;
        stroke-linecap: round;
    }

    .mc-global-download-banner-close:active {
        transform: scale(.92);
    }
}


/* =========================================================
   GLOBAL DOWNLOAD BANNER - CLOSE BUTTON FIX
   ========================================================= */

@media (max-width: 849px) {

    /*
     * Banner 允许关闭按钮超出边界。
     */
    .mc-global-download-banner {
        overflow: visible !important;
    }

    /*
     * 图片本身继续保持圆角，
     * 避免因为 banner overflow visible 导致圆角消失。
     */
    .mc-global-download-banner-link {
        display: block !important;
        overflow: hidden !important;
        border-radius: 13px !important;
    }

    /*
     * 关闭按钮：
     * 放在 Banner 外部右上方。
     */
    .mc-global-download-banner
    .mc-global-download-banner-close {
        position: absolute !important;

        top: -38px !important;
        right: 2px !important;

        width: 30px !important;
        height: 30px !important;

        min-width: 30px !important;
        max-width: 30px !important;

        min-height: 30px !important;
        max-height: 30px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        flex: 0 0 30px !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
        border-radius: 50% !important;

        background: rgba(8, 20, 32, .90) !important;
        color: #fff !important;

        box-shadow:
            0 4px 12px rgba(0, 0, 0, .20) !important;

        font-size: 0 !important;
        line-height: 0 !important;

        transform: none !important;
        appearance: none !important;
        -webkit-appearance: none !important;

        z-index: 99999 !important;
    }

    .mc-global-download-banner
    .mc-global-download-banner-close svg {
        display: block !important;

        width: 14px !important;
        height: 14px !important;

        min-width: 14px !important;
        min-height: 14px !important;

        margin: 0 !important;
        padding: 0 !important;

        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 2.2 !important;
        stroke-linecap: round !important;

        pointer-events: none !important;
    }

    .mc-global-download-banner
    .mc-global-download-banner-close:hover,
    .mc-global-download-banner
    .mc-global-download-banner-close:focus {
        background: rgba(8, 20, 32, .96) !important;
        color: #fff !important;
    }

    .mc-global-download-banner
    .mc-global-download-banner-close:active {
        transform: scale(.92) !important;
    }
}

/* Banner close interaction fix */
@media (max-width: 849px) {

    .mc-global-download-banner {
        pointer-events: auto !important;
    }

    .mc-global-download-banner-link {
        position: relative !important;
        z-index: 1 !important;
    }

    .mc-global-download-banner
    .mc-global-download-banner-close {
        z-index: 100000 !important;

        pointer-events: auto !important;
        touch-action: manipulation !important;

        cursor: pointer !important;

        isolation: isolate !important;
    }
}