/* Food Guide Color Utilities - PASTEL VERSION */
.bg-emerald-50 {
    background-color: #ecfdf5
}

.bg-emerald-100 {
    background-color: #d1fae5
}

.bg-emerald-200 {
    background-color: #a7f3d0
}

.bg-emerald-400 {
    background-color: #34d399
}

.bg-emerald-500 {
    background-color: #10b981
}

.text-emerald-600 {
    color: #059669
}

.text-emerald-700 {
    color: #047857
}

.border-emerald-300 {
    border-color: #6ee7b7
}

.border-emerald-400 {
    border-color: #34d399
}

.bg-amber-50 {
    background-color: #fffbeb
}

.bg-amber-100 {
    background-color: #fef3c7
}

.bg-amber-200 {
    background-color: #fde68a
}

.bg-amber-400 {
    background-color: #fbbf24
}

.bg-amber-500 {
    background-color: #f59e0b
}

.text-amber-600 {
    color: #d97706
}

.text-amber-700 {
    color: #b45309
}

.border-amber-300 {
    border-color: #fcd34d
}

.border-amber-400 {
    border-color: #fbbf24
}

.bg-rose-50 {
    background-color: #fff1f2
}

.bg-rose-100 {
    background-color: #ffe4e6
}

.bg-rose-200 {
    background-color: #fecdd3
}

.bg-rose-400 {
    background-color: #fb7185
}

.bg-rose-500 {
    background-color: #f43f5e
}

.text-rose-600 {
    color: #e11d48
}

.text-rose-700 {
    color: #be123c
}

.border-rose-300 {
    border-color: #fda4af
}

.border-rose-400 {
    border-color: #fb7185
}

/* Grid cols for 4 items on desktop (768px+) */
@media (min-width:768px) {
    .md\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }
}

@media (min-width:1024px) {
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }
}

@media (min-width:640px) {
    .sm\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

/* Line clamp for card text */
.line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2
}