/* === Emerald Colors === */
.bg-emerald-50 { background-color: #ecfdf5; }
.bg-emerald-300 { background-color: #6ee7b7; }
.bg-emerald-500 { background-color: #10b981; }
.bg-emerald-700 { background-color: #047857; }
.bg-emerald-900 { background-color: #064e3b; }
.text-emerald-500 { color: #10b981; }
.hover\:bg-emerald-600:hover { background-color: #059669; }
.focus\:bg-emerald-700:focus { background-color: #047857; }
.active\:bg-emerald-800:active { background-color: #065f46; }

.dark .bg-emerald-700 { background-color: #065f46; }
.dark .text-emerald-400 { color: #34d399; }

/* === Cyan Colors === */
.bg-cyan-50 { background-color: #ecfeff; }
.bg-cyan-300 { background-color: #67e8f9; }
.bg-cyan-500 { background-color: #06b6d4; }
.bg-cyan-700 { background-color: #0e7490; }
.bg-cyan-900 { background-color: #164e63; }
.text-cyan-500 { color: #06b6d4; }
.hover\:bg-cyan-600:hover { background-color: #0891b2; }
.focus\:bg-cyan-700:focus { background-color: #0e7490; }
.active\:bg-cyan-800:active { background-color: #155e75; }

.dark .bg-cyan-700 { background-color: #155e75; }
.dark .text-cyan-400 { color: #22d3ee; }

/* === Blue Colors === */
.bg-blue-50 { background-color: #eff6ff; }
.bg-blue-300 { background-color: #93c5fd; }
.bg-blue-500 { background-color: #3b82f6; }
.bg-blue-700 { background-color: #1d4ed8; }
.bg-blue-900 { background-color: #1e3a8a; }
.text-blue-500 { color: #3b82f6; }
.hover\:bg-blue-600:hover { background-color: #2563eb; }
.focus\:bg-blue-700:focus { background-color: #1d4ed8; }
.active\:bg-blue-800:active { background-color: #1e40af; }

.dark .bg-blue-700 { background-color: #1e40af; }
.dark .text-blue-400 { color: #60a5fa; }

/* === Neutral Colors === */
.bg-neutral-50 { background-color: #fafafa; }
.bg-neutral-300 { background-color: #d4d4d4; }
.bg-neutral-500 { background-color: #737373; }
.bg-neutral-700 { background-color: #404040; }
.bg-neutral-900 { background-color: #171717; }
.text-neutral-500 { color: #737373; }
.hover\:bg-neutral-600:hover { background-color: #525252; }
.focus\:bg-neutral-700:focus { background-color: #404040; }
.active\:bg-neutral-800:active { background-color: #262626; }

.dark .bg-neutral-700 { background-color: #262626; }
.dark .text-neutral-400 { color: #a3a3a3; }

/* === Purple Colors === */
.peer:checked~.peer-checked\:border-purple-300 { border-color: #d8b4fe; }
.peer:checked~.peer-checked\:border-purple-500 { border-color: #a855f7; }
.peer:checked~.peer-checked\:border-purple-700 { border-color: #7e22ce; }
.peer:checked~.peer-checked\:border-purple-800 { border-color: #6b21a8; }

.bg-purple-50 { background-color: #faf5ff; }
.bg-purple-300 { background-color: #d8b4fe; }
.bg-purple-500 { background-color: #a855f7; }
.bg-purple-700 { background-color: #7e22ce; }
.bg-purple-900 { background-color: #4c1d95; }
.text-purple-500 { color: #a855f7; }
.hover\:bg-purple-600:hover { background-color: #9333ea; }
.focus\:bg-purple-700:focus { background-color: #7e22ce; }
.active\:bg-purple-800:active { background-color: #6b21a8; }

/* === Green Colors === */
.peer:checked~.peer-checked\:border-green-300 { border-color: #86efac; }
.peer:checked~.peer-checked\:border-green-500 { border-color: #249782; }
.peer:checked~.peer-checked\:border-green-700 { border-color: #15803d; }
.peer:checked~.peer-checked\:border-green-800 { border-color: #166534; }

.bg-green-50 { background-color: #f0fdf4; }
.bg-green-300 { background-color: #86efac; }
.bg-green-500 { background-color: #249782; }
.bg-green-700 { background-color: #15803d; }
.bg-green-900 { background-color: #14532d; }
.text-green-500 { color: #249782; }
.hover\:bg-green-600:hover { background-color: #1F8875; }
.focus\:bg-green-700:focus { background-color: #15803d; }
.active\:bg-green-800:active { background-color: #166534; }

/* === Orange Colors === */
.bg-orange-50 { background-color: #fff7ed; }
.bg-orange-300 { background-color: #fdba74; }
.bg-orange-500 { background-color: #f97316; }
.bg-orange-700 { background-color: #c2410c; }
.bg-orange-900 { background-color: #7c2d12; }
.text-orange-500 { color: #f97316; }
.hover\:bg-orange-600:hover { background-color: #ea580c; }
.focus\:bg-orange-700:focus { background-color: #c2410c; }
.active\:bg-orange-800:active { background-color: #9a3412; }

/* === Rose Colors === */
.bg-rose-50 { background-color: #fff1f2; }
.bg-rose-300 { background-color: #fda4af; }
.bg-rose-500 { background-color: #f43f5e; }
.bg-rose-700 { background-color: #be123c; }
.bg-rose-900 { background-color: #881337; }
.text-rose-500 { color: #f43f5e; }
.hover\:bg-rose-600:hover { background-color: #e11d48; }
.focus\:bg-rose-700:focus { background-color: #be123c; }
.active\:bg-rose-800:active { background-color: #9f1239; }

/* === Peer Checked Backgrounds === */
.peer:checked~.peer-checked\:bg-emerald-50 { background-color: #ecfdf5; }
.peer:checked~.peer-checked\:bg-cyan-50 { background-color: #ecfeff; }
.peer:checked~.peer-checked\:bg-blue-50 { background-color: #eff6ff; }
.peer:checked~.peer-checked\:bg-green-50 { background-color: #f0fdf4; }
.peer:checked~.peer-checked\:bg-purple-50 { background-color: #faf5ff; }
.peer:checked~.peer-checked\:bg-orange-50 { background-color: #fff7ed; }
.peer:checked~.peer-checked\:bg-rose-50 { background-color: #fff1f2; }

/* === Black Colors === */
.bg-black-50  { background-color: #e5e5e5; }  /* Lightest tint of black */
.bg-black-300 { background-color: #4b4b4b; }  /* Dark mid-tone */
.bg-black-500 { background-color: #262626; }  /* Base black tone */
.bg-black-700 { background-color: #171717; }  /* Darker black */
.bg-black-900 { background-color: #0a0a0a; }  /* Near-absolute black */

.text-black-500 { color: #262626; }

.hover\:bg-black-600:hover { background-color: #1f1f1f; }
.focus\:bg-black-700:focus { background-color: #171717; }
.active\:bg-black-800:active { background-color: #111111; }

.dark .bg-black-700 { background-color: #111111; }
.dark .text-black-400 { color: #3f3f3f; }

.peer:checked~.peer-checked\:bg-black-50 { background-color: #e5e5e5; }

/* === Grey Colors === */
.bg-grey-50  { background-color: #f3f4f6; }   /* Very light grey */
.bg-grey-300 { background-color: #6b7280; }   /* Strong mid grey */
.bg-grey-500 { background-color: #4b5563; }   /* Deeper grey */
.bg-grey-700 { background-color: #374151; }   /* Dark grey */
.bg-grey-900 { background-color: #1f2937; }   /* Almost black */

.text-grey-500 { color: #4b5563; }

.hover\:bg-grey-600:hover { background-color: #475569; }
.focus\:bg-grey-700:focus { background-color: #374151; }
.active\:bg-grey-800:active { background-color: #1e293b; }

.dark .bg-grey-700 { background-color: #1e293b; }
.dark .text-grey-400 { color: #9ca3af; }

.peer:checked~.peer-checked\:bg-grey-50 { background-color: #f3f4f6; }