/**
 * 顶部多功能组件 — 搜索叠加区定位与手机端布局
 */

/* 整体相对背景图垂直居中，略向下偏移（补偿顶栏与底部卡片视觉重心） */
.header-slider-container .header-slider-search {
    top: 50% !important;
    transform: translateY(calc(-50% + 36px)) !important;
}

/* 有底部图标卡片时再多下移一点 */
.header-slider-container[class*="card-"] .header-slider-search {
    transform: translateY(calc(-50% + 44px)) !important;
}

@media (max-width: 768px) {
    .header-slider-container .slide-header.new-swiper {
        --m-height: 460px !important;
    }

    .header-slider-container .header-slider-search {
        top: 50% !important;
        transform: translateY(calc(-50% + 28px)) !important;
        padding: 0 12px 8px;
        font-size: 12px;
    }

    .header-slider-container[class*="card-"] .header-slider-search {
        transform: translateY(calc(-50% + 22px)) !important;
    }

    .header-slider-container .header-slider-search-more.before {
        margin-bottom: 0.65em;
    }

    .header-slider-container .header-slider-card {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 6px;
        margin-top: 0 !important;
        z-index: 3;
        padding: 0 8px;
    }

    .header-slider-container .header-slider-card .icon-cover-desc .mt6 {
        display: none;
    }

    .header-slider-container .header-slider-card .icon-cover-card {
        padding: 8px !important;
    }

    .header-slider-container .header-slider-card .em12 {
        font-size: 11px;
    }

    .coolo-hs-extra {
        padding: 0 6px;
    }

    .coolo-hs-extra .em16 {
        font-size: 14px;
        line-height: 1.35;
    }

    .coolo-hs-extra .coolo-hs-sub {
        font-size: 11px;
        line-height: 1.45;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .coolo-hs-extra .coolo-hs-btns {
        margin-top: 8px;
        margin-bottom: 4px;
        gap: 8px;
    }

    .coolo-hs-extra .coolo-hs-btns .but {
        padding: 0.38em 0.75em;
        font-size: 12px;
    }

    .coolo-hs-extra .coolo-hs-btns .padding-lg {
        padding: 0.38em 0.75em !important;
    }

    .coolo-hs-extra .coolo-hs-tip {
        font-size: 10px;
        line-height: 1.35;
        margin-top: 6px !important;
        margin-bottom: 0;
    }

    .coolo-hs-extra .mb10 {
        margin-bottom: 6px !important;
    }

    .coolo-hs-extra .mb6 {
        margin-bottom: 4px !important;
    }
}

@media (max-width: 480px) {
    .header-slider-container .slide-header.new-swiper {
        --m-height: 500px !important;
    }

    .coolo-hs-extra .coolo-hs-tip {
        display: none;
    }

    .header-slider-container .header-slider-search {
        transform: translateY(calc(-50% + 24px)) !important;
    }
}