/* Color Utilities */


.bg-primary { background-color: var(--primary-color); }
.bg-secondary { background-color: var(--secondary-color); }
.bg-terciary { background-color: var(--terciary-color) }

/* Background Colors */
.bg-transparent { background-color: transparent; }

.bg-black { background-color: #000; }

.bg-white { background-color: #fff; }

/* Red Colors */
.bg-red-50 { background-color: #fef2f2; }

.bg-red-100 { background-color: #fee2e2; }

.bg-red-200 { background-color: #fecaca; }

.bg-red-300 { background-color: #fca5a5; }

.bg-red-400 { background-color: #f87171; }

.bg-red-500 { background-color: #ef4444; }

.bg-red-600 { background-color: #dc2626; }

.bg-red-700 { background-color: #b91c1c; }

.bg-red-800 { background-color: #991b1b; }

.bg-red-900 { background-color: #7f1d1d; }

/* Blue Colors */
.bg-blue-50 { background-color: #eff6ff; }

.bg-blue-100 { background-color: #dbeafe; }

.bg-blue-200 { background-color: #bfdbfe; }

.bg-blue-300 { background-color: #93c5fd; }

.bg-blue-400 { background-color: #60a5fa; }

.bg-blue-500 { background-color: #3b82f6; }

.bg-blue-600 { background-color: #2563eb; }

.bg-blue-700 { background-color: #1d4ed8; }

.bg-blue-800 { background-color: #1e40af; }

.bg-blue-900 { background-color: #1e3a8a; }

/* Yellow Colors */
.bg-yellow-50 { background-color: #fefce8; }

.bg-yellow-100 { background-color: #fef9c3; }

.bg-yellow-200 { background-color: #fef08a; }

.bg-yellow-300 { background-color: #fde047; }

.bg-yellow-400 { background-color: #facc15; }

.bg-yellow-500 { background-color: #eab308; }

.bg-yellow-600 { background-color: #ca8a04; }

.bg-yellow-700 { background-color: #a16207; }

.bg-yellow-800 { background-color: #854d0e; }

.bg-yellow-900 { background-color: #713f12; }