/* ============================================================
   盒子主题 - 首页顶部轮播卡片区（header-slider-card）样式覆写
   ------------------------------------------------------------
   父主题结构（Zibll）：
     .header-slider-container
       └ .header-slider-card
           └ .flex.jse.flex-row.gutters-5.flex-col-sm-2
               └ .flex1 > a.main-color > .icon-cover-card.zib-widget
                   ├ .icon-cover-icon   (左侧圆形图标)
                   └ .icon-cover-desc   (右侧 标题 + 描述/跑马灯)

   本文件只覆写表现层，不改父主题功能逻辑。
   父主题 .icon-cover-card 自带白底/圆角/阴影，这里用更高优先级覆盖。
   ============================================================ */

/* ---------- 0. 容器与卡片行间距 ---------- */
.header-slider-card {
    margin-top: 14px;
}
.header-slider-card .flex.jse.flex-row.gutters-5 {
    gap: 12px;               /* 卡片之间的间距，原父主题为 gutters-5(5px) */
}

/* ---------- 1. 单张白卡 ---------- */
.header-slider-card .icon-cover-card {
    background: #fff;
    border: 1px solid #eef0f2;
    border-radius: 12px;      /* 圆角，父主题默认 6px 左右 */
    box-shadow: 0 2px 12px rgba(0, 0, 0, .06);
    padding: 14px 16px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

/* 暗黑模式下的卡片底色 */
body.dark-theme .header-slider-card .icon-cover-card {
    background: #2b2d31;
    border-color: #383b40;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .25);
}

/* ---------- 2. hover 上浮 ---------- */
.header-slider-card .icon-cover-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .14);
    border-color: var(--theme-color, #8fb107);
}

/* ---------- 3. 左侧图标圆形 ---------- */
.header-slider-card .icon-cover-icon {
    font-size: 22px;
    width: 46px;
    height: 46px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ---------- 4. 右侧文字 ---------- */
.header-slider-card .icon-cover-desc {
    min-width: 0;            /* 配合 text-ellipsis 防止溢出 */
}
.header-slider-card .icon-cover-desc .font-bold {
    font-size: 15px;
    line-height: 1.3;
}
.header-slider-card .icon-cover-desc .muted-color {
    font-size: 12px;
    opacity: .72;
    line-height: 1.4;
}

/* ---------- 5. 标题后的 badge（HOT / 2025 等）微调 ---------- */
.header-slider-card .icon-cover-desc .font-bold badge,
.header-slider-card .icon-cover-desc .font-bold .menu-item-badge {
    font-size: 10px;
    padding: 1px 5px;
    vertical-align: middle;
}