/* 通用「暂无数据」空状态样式，与 empty-state.js 配套。
   全站只保留这一套外观，各频道不要再各写一份空状态样式。
   注意不要用 .empty 作为类名：platform.css / commerce.css 里的
   `.empty a{background:...!important;color:#fff!important}` 会吃掉链接样式。 */
.gr-empty {
    padding: 34px 22px;
    text-align: center;
    background: #f8f9fb;
    border: 1px dashed #dfe4ea;
    border-radius: 10px;
    color: #65738a
}

.gr-empty b {
    display: block;
    font-size: 17px;
    color: #303b4d
}

.gr-empty p {
    margin: 8px 0 0;
    font-size: 14px;
    color: #7b8491
}

.gr-empty-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 16px
}

.gr-empty-actions a {
    display: inline-block;
    padding: 10px 18px;
    border: 1px solid #d8dee6;
    border-radius: 8px;
    background: #fff;
    color: #3c4658;
    font-weight: 700;
    text-decoration: none
}

.gr-empty-actions a:hover {
    border-color: #e3262e;
    color: #d72229
}

.gr-empty-actions a.primary {
    background: #e3262e;
    border-color: #e3262e;
    color: #fff
}

.gr-empty.compact {
    padding: 20px 16px
}

@media (max-width:520px) {
    .gr-empty-actions {
        flex-direction: column
    }

    .gr-empty-actions a {
        display: block
    }
}