﻿body {
    background: rgb(248,248,248);
}

.container {
    background: rgb(248,248,248);
}

.category-group-title {
    font-weight: bold;
    font-size: 1rem;
    margin-top: 1.5rem;
    margin-bottom: .2rem;
    color: #6c757d;
    border-left: 3px solid #e9ecef;
    padding-left: .7rem;
    letter-spacing: .08em;
    background: none;
}

/* 分类小项美化，灰色方案 */
.category-link {
    color: #49515a;
    border-radius: 2em 0 0 2em;
    transition: all .18s cubic-bezier(.4,0,.2,1);
    font-size: 1rem;
    margin-bottom: 2px;
    padding: .55em 1.4em .55em 2.2em;
    background: none;
    position: relative;
    font-weight: 500;
    min-width: 62px;
    display: block;
    box-shadow: none;
}

    .category-link::before { /* 这里你可以自定义图标 */
        content: '🥗';
        margin-right: .7em;
        font-size: 1.1rem;
    }

    .category-link.active, .category-link:focus {
        color: #fff !important;
        background: linear-gradient(90deg, #acd2f2 65%, #89b8e3 100%);
        box-shadow: 0 2px 10px #95bcd375;
        font-weight: bold;
        border-left: 5px solid #1e90ff;
    }

    .category-link:hover:not(.active) {
        color: #34648F !important;
        background: linear-gradient(90deg, #eaf3fa 65%, #e2f1ff 100%);
        border-left: 5px solid #aedcff;
        font-weight: 600;
        box-shadow: 0 1px 7px #e2e9f380;
    }

/* 卡片阴影和柔和色，灰色调 */
.card {
    border: none;
    border-radius: 1.3rem;
    box-shadow: 0 2px 12px rgba(120,130,150,.13);
    background: linear-gradient(135deg, #fbfbfb 85%, #ededed 100%);
    transition: transform .14s, box-shadow .13s;
}

    .card:hover {
        transform: scale(1.02);
        box-shadow: 0 8px 25px rgba(120,130,150,0.16);
    }

.card-img-top {
    border-radius: 1.3rem 1.3rem 0 0;
    background: #dde1e5;
    object-fit: cover;
}

.card-title {
    font-size: 1.13rem;
    color: #49515a;
    font-family: "Microsoft YaHei",微软雅黑,sans-serif;
    font-weight: bold;
}

.card-text {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 4.8em;
}

.card-subtitle {
    font-size: .97rem;
    margin-top: 4px;
    color: #8b939b;
}

.pagination .page-link {
    border-radius: 1em;
    color: #49515a;
    background: transparent;
    font-weight: 600;
}

.pagination .page-item.active .page-link {
    color: #fff;
    background: #6c757d;
    border: none;
    box-shadow: 0 2px 8px #ced4da80;
}

::-webkit-scrollbar-thumb {
    background: #e4e7ea;
    border-radius: 1em;
}

::-webkit-scrollbar {
    width: 6px;
}
