/* ============================================================
 * home-ad.css  -  通用广告位规范（首页/栏目页/列表页/详情页共用）
 * ------------------------------------------------------------
 * 适用范围：
 *   - 首页        /index/index  （顶部横幅 + 三栏格子）
 *   - 栏目首页    /category/index
 *   - 列表页      /list/index
 *   - 详情页      /show/show
 *
 * 命名空间：.home-ad-slot / .home-ad-banner / .home-ad-grid / .home-ad-cell
 * 修订：
 *   - v1.0  初版（从各模板抽取共用）
 * ============================================================ */

/* ---------- 通用广告位（与 Bootstrap/SmartAdmin4 解耦的虚线框风格） ---------- */
.home-ad-slot {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px dashed #cbd5e1;
    border-radius: 4px;
    overflow: hidden;
    text-decoration: none;
    color: #94a3b8;
    transition: border-color .2s, box-shadow .2s;
}
.home-ad-slot:hover {
    border-color: var(--theme-primary-500, #4f46e5);
    box-shadow: 0 2px 10px rgba(79, 70, 229, .08);
    text-decoration: none;
    color: #64748b;
}

/* 右上角"广告"标识 */
.home-ad-slot .ad-label {
    position: absolute;
    top: 6px;
    right: 8px;
    font-size: 10px;
    line-height: 1;
    padding: 2px 6px;
    background: rgba(148, 163, 184, .18);
    color: #94a3b8;
    border-radius: 3px;
    letter-spacing: 1px;
    z-index: 2;
    pointer-events: none;
}

/* ---------- 横幅广告（首页/栏目页/列表页/详情页通用） ---------- */
.home-ad-banner {
    width: 100%;
    height: 90px;
}

/* ---------- 三栏格子广告（首页/栏目页通用） ---------- */
.home-ad-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.home-ad-cell {
    height: 100px;
    flex-direction: column;
}
.home-ad-cell:hover { color: #64748b; }

/* ---------- 响应式：移动端单列 ---------- */
@media (max-width: 767px) {
    .home-ad-grid     { grid-template-columns: 1fr; }
    .home-ad-cell     { height: 80px; }
    .home-ad-banner   { height: 70px; }
    .home-ad-slot     { font-size: .75rem; }
    .home-ad-slot .ad-label { top: 4px; right: 6px; }
}