@charset "utf-8";

/* 首页促销弹窗：header 与 bottom-nav 之间垂直水平居中（对齐 login-overlay） */
.home-promo-overlay {
    position: fixed;
    top: var(--header-height);
    bottom: var(--nav-height);
    left: 0;
    right: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.12rem;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(0.02rem);
}

.home-promo-overlay[hidden] {
    display: none !important;
}

.home-promo-panel {
    --home-promo-overlay-h: calc(100vh - var(--header-height) - var(--nav-height));
    --home-promo-overlay-w: calc(100vw - 0.24rem);

    position: relative;
    width: min(var(--home-promo-overlay-w), 3.5rem);
    max-width: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex-shrink: 1;
    min-height: 0;
    filter: drop-shadow(0 0.04rem 0.16rem rgba(0, 0, 0, 0.35));
}

.home-promo-close {
    position: absolute;
    top: 0.04rem;
    right: 0.04rem;
    z-index: 3;
    appearance: none;
    border: 0;
    background: transparent;
    line-height: 0;
    padding: 0;
    cursor: pointer;
    width: 0.28rem;
    height: 0.28rem;
}

.home-promo-close img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.home-promo-banner {
    display: block;
    width: 100%;
    height: auto;
    max-height: calc(var(--home-promo-overlay-h) - 0.56rem);
    object-fit: contain;
}

.home-promo-btn {
    display: block;
    width: min(58%, 1.7rem);
    margin-top: 0.12rem;
    line-height: 0;
    flex-shrink: 0;
}

.home-promo-btn img {
    display: block;
    width: 100%;
    height: auto;
}

@media (min-width: 961px) {
    .home-promo-overlay {
        overflow: hidden;
    }

    .home-promo-panel {
        --home-promo-overlay-w: min(40vw, 3.5rem);
        width: var(--home-promo-overlay-w);
    }
}

@media (max-width: 960px) {
    .home-promo-overlay {
        padding: 0 0.06rem;
    }

    .home-promo-panel {
        --home-promo-overlay-w: calc(100vw - 0.12rem);
        width: min(var(--home-promo-overlay-w), 3.5rem);
    }
}