body{
            background-color:#F2E0DD;
        }

        .recipe-background {
            background-image:
                linear-gradient(
                    rgba(255,255,255,0.8),
                    rgba(255,255,255,0.8)
                ),
                url("../images/bg1.jpg");

            background-size: 500px auto;
            background-position: top center;
            background-repeat: repeat;

            padding: 2rem;
            border-radius: 1rem;
        }
        @media (max-width: 576px) {
        .recipe-background {
        padding: 1rem;
        border-radius: 0.75rem;
         }
}

        .card-img-top{
            width:100%;
            height: 220px;;
            object-fit:cover;
        }
        @media (max-width: 576px) {
        .card-img-top {
            height: 180px;
        }
}

        ::placeholder {
            color: #c5c5c5;
            opacity: 1;
        }

        .recipe-card {
            transition:
                transform 0.2s ease,
                box-shadow 0.2s ease;

            cursor: pointer;
        }

        .recipe-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0.15) !important;
        }

        .recipe-actions {
            position: absolute;
            top: 0.75rem;
            right: 0.75rem;

            display: flex;
            gap: 0.4rem;

            opacity: 0;
            transform: translateY(-4px);

            transition:
                opacity 0.2s ease,
                transform 0.2s ease;

            z-index: 3;
        }

        .recipe-card:hover .recipe-actions {
            opacity: 1;
            transform: translateY(0);
        }
        .recipe-detail-image {
        width: 100%;
        max-height: 200px;
        object-fit: cover;
    }
    .navbar {
    min-height: 100px;
}

.special-menu-list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

.special-menu-list li {
    padding: 0.75rem 0;
    border-bottom: 1px solid #eee;
}

.special-menu-list li:last-child {
    border-bottom: none;
}

.special-menu-list li::before {
    content: "•";
    margin-right: 0.75rem;
    color: #8b8175;
}