/* ==================================================
   Color Utility Classes
   Based on company primary green: rgb(100, 167, 96)
   ================================================== */

/* Green Color Variants (Primary Brand Color) */
.bg-green-50 { background-color: #f0f9f0; }
.bg-green-100 { background-color: #dcf4db; }
.bg-green-200 { background-color: #b9e8b7; }
.bg-green-300 { background-color: #96dc93; }
.bg-green-400 { background-color: #73d06f; }
.bg-green-500 { background-color: rgb(100, 167, 96); } /* Primary brand color */
.bg-green-600 { background-color: #4a8f47; }
.bg-green-700 { background-color: #3d7a3a; }
.bg-green-800 { background-color: #2f642d; }
.bg-green-900 { background-color: #214f20; }

/* Green Text Colors */
.text-green-50 { color: #f0f9f0; }
.text-green-100 { color: #dcf4db; }
.text-green-200 { color: #b9e8b7; }
.text-green-300 { color: #96dc93; }
.text-green-400 { color: #73d06f; }
.text-green-500 { color: rgb(100, 167, 96); }
.text-green-600 { color: #4a8f47; }
.text-green-700 { color: #3d7a3a; }
.text-green-800 { color: #2f642d; }
.text-green-900 { color: #214f20; }

/* Green Border Colors */
.border-green-50 { border-color: #f0f9f0; }
.border-green-100 { border-color: #dcf4db; }
.border-green-200 { border-color: #b9e8b7; }
.border-green-300 { border-color: #96dc93; }
.border-green-400 { border-color: #73d06f; }
.border-green-500 { border-color: rgb(100, 167, 96); }
.border-green-600 { border-color: #4a8f47; }
.border-green-700 { border-color: #3d7a3a; }
.border-green-800 { border-color: #2f642d; }
.border-green-900 { border-color: #214f20; }

/* Red Color Variants (Error/Danger) */
.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; }

/* Red Text Colors */
.text-red-50 { color: #fef2f2; }
.text-red-100 { color: #fee2e2; }
.text-red-200 { color: #fecaca; }
.text-red-300 { color: #fca5a5; }
.text-red-400 { color: #f87171; }
.text-red-500 { color: #ef4444; }
.text-red-600 { color: #dc2626; }
.text-red-700 { color: #b91c1c; }
.text-red-800 { color: #991b1b; }
.text-red-900 { color: #7f1d1d; }

/* Red Border Colors */
.border-red-50 { border-color: #fef2f2; }
.border-red-100 { border-color: #fee2e2; }
.border-red-200 { border-color: #fecaca; }
.border-red-300 { border-color: #fca5a5; }
.border-red-400 { border-color: #f87171; }
.border-red-500 { border-color: #ef4444; }
.border-red-600 { border-color: #dc2626; }
.border-red-700 { border-color: #b91c1c; }
.border-red-800 { border-color: #991b1b; }
.border-red-900 { border-color: #7f1d1d; }

/* Blue Color Variants (Info/Links) */
.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; }

/* Blue Text Colors */
.text-blue-50 { color: #eff6ff; }
.text-blue-100 { color: #dbeafe; }
.text-blue-200 { color: #bfdbfe; }
.text-blue-300 { color: #93c5fd; }
.text-blue-400 { color: #60a5fa; }
.text-blue-500 { color: #3b82f6; }
.text-blue-600 { color: #2563eb; }
.text-blue-700 { color: #1d4ed8; }
.text-blue-800 { color: #1e40af; }
.text-blue-900 { color: #1e3a8a; }

/* Blue Border Colors */
.border-blue-50 { border-color: #eff6ff; }
.border-blue-100 { border-color: #dbeafe; }
.border-blue-200 { border-color: #bfdbfe; }
.border-blue-300 { border-color: #93c5fd; }
.border-blue-400 { border-color: #60a5fa; }
.border-blue-500 { border-color: #3b82f6; }
.border-blue-600 { border-color: #2563eb; }
.border-blue-700 { border-color: #1d4ed8; }
.border-blue-800 { border-color: #1e40af; }
.border-blue-900 { border-color: #1e3a8a; }

/* Yellow/Amber Color Variants (Warning) */
.bg-yellow-50 { background-color: #fffbeb; }
.bg-yellow-100 { background-color: #fef3c7; }
.bg-yellow-200 { background-color: #fde68a; }
.bg-yellow-300 { background-color: #fcd34d; }
.bg-yellow-400 { background-color: #fbbf24; }
.bg-yellow-500 { background-color: #f59e0b; }
.bg-yellow-600 { background-color: #d97706; }
.bg-yellow-700 { background-color: #b45309; }
.bg-yellow-800 { background-color: #92400e; }
.bg-yellow-900 { background-color: #78350f; }

/* Yellow Text Colors */
.text-yellow-50 { color: #fffbeb; }
.text-yellow-100 { color: #fef3c7; }
.text-yellow-200 { color: #fde68a; }
.text-yellow-300 { color: #fcd34d; }
.text-yellow-400 { color: #fbbf24; }
.text-yellow-500 { color: #f59e0b; }
.text-yellow-600 { color: #d97706; }
.text-yellow-700 { color: #b45309; }
.text-yellow-800 { color: #92400e; }
.text-yellow-900 { color: #78350f; }

/* Orange Color Variants */
.bg-orange-50 { background-color: #fff7ed; }
.bg-orange-100 { background-color: #ffedd5; }
.bg-orange-200 { background-color: #fed7aa; }
.bg-orange-300 { background-color: #fdba74; }
.bg-orange-400 { background-color: #fb923c; }
.bg-orange-500 { background-color: #f97316; }
.bg-orange-600 { background-color: #ea580c; }
.bg-orange-700 { background-color: #c2410c; }
.bg-orange-800 { background-color: #9a3412; }
.bg-orange-900 { background-color: #7c2d12; }

/* Purple Color Variants */
.bg-purple-50 { background-color: #faf5ff; }
.bg-purple-100 { background-color: #f3e8ff; }
.bg-purple-200 { background-color: #e9d5ff; }
.bg-purple-300 { background-color: #d8b4fe; }
.bg-purple-400 { background-color: #c084fc; }
.bg-purple-500 { background-color: #a855f7; }
.bg-purple-600 { background-color: #9333ea; }
.bg-purple-700 { background-color: #7c3aed; }
.bg-purple-800 { background-color: #6b21a8; }
.bg-purple-900 { background-color: #581c87; }

/* Gray Color Variants (Neutral) */
.bg-gray-50 { background-color: #f9fafb; }
.bg-gray-100 { background-color: #f3f4f6; }
.bg-gray-200 { background-color: #e5e7eb; }
.bg-gray-300 { background-color: #d1d5db; }
.bg-gray-400 { background-color: #9ca3af; }
.bg-gray-500 { background-color: #6b7280; }
.bg-gray-600 { background-color: #4b5563; }
.bg-gray-700 { background-color: #374151; }
.bg-gray-800 { background-color: #1f2937; }
.bg-gray-900 { background-color: #111827; }

/* Gray Text Colors */
.text-gray-50 { color: #f9fafb; }
.text-gray-100 { color: #f3f4f6; }
.text-gray-200 { color: #e5e7eb; }
.text-gray-300 { color: #d1d5db; }
.text-gray-400 { color: #9ca3af; }
.text-gray-500 { color: #6b7280; }
.text-gray-600 { color: #4b5563; }
.text-gray-700 { color: #374151; }
.text-gray-800 { color: #1f2937; }
.text-gray-900 { color: #111827; }

/* Gradient Backgrounds */
.bg-gradient-green { background: linear-gradient(135deg, rgb(100, 167, 96) 0%, #4a8f47 100%); }
.bg-gradient-red { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); }
.bg-gradient-blue { background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); }
.bg-gradient-purple { background: linear-gradient(135deg, #a855f7 0%, #9333ea 100%); }

/* Hover States for Backgrounds */
.hover\:bg-green-50:hover { background-color: #f0f9f0; }
.hover\:bg-green-100:hover { background-color: #dcf4db; }
.hover\:bg-green-500:hover { background-color: rgb(100, 167, 96); }
.hover\:bg-green-600:hover { background-color: #4a8f47; }
.hover\:bg-green-700:hover { background-color: #3d7a3a; }

.hover\:bg-red-50:hover { background-color: #fef2f2; }
.hover\:bg-red-100:hover { background-color: #fee2e2; }
.hover\:bg-red-500:hover { background-color: #ef4444; }
.hover\:bg-red-600:hover { background-color: #dc2626; }

.hover\:bg-blue-50:hover { background-color: #eff6ff; }
.hover\:bg-blue-100:hover { background-color: #dbeafe; }
.hover\:bg-blue-500:hover { background-color: #3b82f6; }
.hover\:bg-blue-600:hover { background-color: #2563eb; }

/* Hover States for Text */
.hover\:text-green-500:hover { color: rgb(100, 167, 96); }
.hover\:text-green-600:hover { color: #4a8f47; }
.hover\:text-green-700:hover { color: #3d7a3a; }

.hover\:text-red-500:hover { color: #ef4444; }
.hover\:text-red-600:hover { color: #dc2626; }
.hover\:text-red-700:hover { color: #b91c1c; }

.hover\:text-blue-500:hover { color: #3b82f6; }
.hover\:text-blue-600:hover { color: #2563eb; }
.hover\:text-blue-700:hover { color: #1d4ed8; }

/* Focus States */
.focus\:ring-green-500:focus { --tw-ring-color: rgb(100, 167, 96); }
.focus\:ring-red-500:focus { --tw-ring-color: #ef4444; }
.focus\:ring-blue-500:focus { --tw-ring-color: #3b82f6; }

/* Special Utility Classes */
.bg-white { background-color: #ffffff; }
.bg-black { background-color: #000000; }
.bg-transparent { background-color: transparent; }

.text-white { color: #ffffff; }
.text-black { color: #000000; }
.text-transparent { color: transparent; }

/* Ring/Outline Colors */
.ring-green-500 { --tw-ring-color: rgb(100, 167, 96); }
.ring-red-500 { --tw-ring-color: #ef4444; }
.ring-blue-500 { --tw-ring-color: #3b82f6; }

/* Shadow Colors */
.shadow-green { box-shadow: 0 4px 6px -1px rgba(100, 167, 96, 0.1), 0 2px 4px -1px rgba(100, 167, 96, 0.06); }
.shadow-red { box-shadow: 0 4px 6px -1px rgba(239, 68, 68, 0.1), 0 2px 4px -1px rgba(239, 68, 68, 0.06); }
.shadow-blue { box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.1), 0 2px 4px -1px rgba(59, 130, 246, 0.06); }

/* Background Opacity Classes */
.bg-opacity-0 { --tw-bg-opacity: 0; }
.bg-opacity-5 { --tw-bg-opacity: 0.05; }
.bg-opacity-10 { --tw-bg-opacity: 0.1; }
.bg-opacity-15 { --tw-bg-opacity: 0.15; }
.bg-opacity-20 { --tw-bg-opacity: 0.2; }
.bg-opacity-25 { --tw-bg-opacity: 0.25; }
.bg-opacity-30 { --tw-bg-opacity: 0.3; }
.bg-opacity-35 { --tw-bg-opacity: 0.35; }
.bg-opacity-40 { --tw-bg-opacity: 0.4; }
.bg-opacity-45 { --tw-bg-opacity: 0.45; }
.bg-opacity-50 { --tw-bg-opacity: 0.5; }
.bg-opacity-55 { --tw-bg-opacity: 0.55; }
.bg-opacity-60 { --tw-bg-opacity: 0.6; }
.bg-opacity-65 { --tw-bg-opacity: 0.65; }
.bg-opacity-70 { --tw-bg-opacity: 0.7; }
.bg-opacity-75 { --tw-bg-opacity: 0.75; }
.bg-opacity-80 { --tw-bg-opacity: 0.8; }
.bg-opacity-85 { --tw-bg-opacity: 0.85; }
.bg-opacity-90 { --tw-bg-opacity: 0.9; }
.bg-opacity-95 { --tw-bg-opacity: 0.95; }
.bg-opacity-100 { --tw-bg-opacity: 1; }

/* Background Opacity Support for Color Classes */
/* Green Backgrounds with Opacity Support */
.bg-green-50 { background-color: rgba(240, 249, 240, var(--tw-bg-opacity, 1)); }
.bg-green-100 { background-color: rgba(220, 244, 219, var(--tw-bg-opacity, 1)); }
.bg-green-200 { background-color: rgba(185, 232, 183, var(--tw-bg-opacity, 1)); }
.bg-green-300 { background-color: rgba(150, 220, 147, var(--tw-bg-opacity, 1)); }
.bg-green-400 { background-color: rgba(115, 208, 111, var(--tw-bg-opacity, 1)); }
.bg-green-500 { background-color: rgba(100, 167, 96, var(--tw-bg-opacity, 1)); }
.bg-green-600 { background-color: rgba(74, 143, 71, var(--tw-bg-opacity, 1)); }
.bg-green-700 { background-color: rgba(61, 122, 58, var(--tw-bg-opacity, 1)); }
.bg-green-800 { background-color: rgba(47, 100, 45, var(--tw-bg-opacity, 1)); }
.bg-green-900 { background-color: rgba(33, 79, 32, var(--tw-bg-opacity, 1)); }

/* Red Backgrounds with Opacity Support */
.bg-red-50 { background-color: rgba(254, 242, 242, var(--tw-bg-opacity, 1)); }
.bg-red-100 { background-color: rgba(254, 226, 226, var(--tw-bg-opacity, 1)); }
.bg-red-200 { background-color: rgba(254, 202, 202, var(--tw-bg-opacity, 1)); }
.bg-red-300 { background-color: rgba(252, 165, 165, var(--tw-bg-opacity, 1)); }
.bg-red-400 { background-color: rgba(248, 113, 113, var(--tw-bg-opacity, 1)); }
.bg-red-500 { background-color: rgba(239, 68, 68, var(--tw-bg-opacity, 1)); }
.bg-red-600 { background-color: rgba(220, 38, 38, var(--tw-bg-opacity, 1)); }
.bg-red-700 { background-color: rgba(185, 28, 28, var(--tw-bg-opacity, 1)); }
.bg-red-800 { background-color: rgba(153, 27, 27, var(--tw-bg-opacity, 1)); }
.bg-red-900 { background-color: rgba(127, 29, 29, var(--tw-bg-opacity, 1)); }

/* Blue Backgrounds with Opacity Support */
.bg-blue-50 { background-color: rgba(239, 246, 255, var(--tw-bg-opacity, 1)); }
.bg-blue-100 { background-color: rgba(219, 234, 254, var(--tw-bg-opacity, 1)); }
.bg-blue-200 { background-color: rgba(191, 219, 254, var(--tw-bg-opacity, 1)); }
.bg-blue-300 { background-color: rgba(147, 197, 253, var(--tw-bg-opacity, 1)); }
.bg-blue-400 { background-color: rgba(96, 165, 250, var(--tw-bg-opacity, 1)); }
.bg-blue-500 { background-color: rgba(59, 130, 246, var(--tw-bg-opacity, 1)); }
.bg-blue-600 { background-color: rgba(37, 99, 235, var(--tw-bg-opacity, 1)); }
.bg-blue-700 { background-color: rgba(29, 78, 216, var(--tw-bg-opacity, 1)); }
.bg-blue-800 { background-color: rgba(30, 64, 175, var(--tw-bg-opacity, 1)); }
.bg-blue-900 { background-color: rgba(30, 58, 138, var(--tw-bg-opacity, 1)); }

/* Yellow Backgrounds with Opacity Support */
.bg-yellow-50 { background-color: rgba(255, 251, 235, var(--tw-bg-opacity, 1)); }
.bg-yellow-100 { background-color: rgba(254, 243, 199, var(--tw-bg-opacity, 1)); }
.bg-yellow-200 { background-color: rgba(253, 230, 138, var(--tw-bg-opacity, 1)); }
.bg-yellow-300 { background-color: rgba(252, 211, 77, var(--tw-bg-opacity, 1)); }
.bg-yellow-400 { background-color: rgba(251, 191, 36, var(--tw-bg-opacity, 1)); }
.bg-yellow-500 { background-color: rgba(245, 158, 11, var(--tw-bg-opacity, 1)); }
.bg-yellow-600 { background-color: rgba(217, 119, 6, var(--tw-bg-opacity, 1)); }
.bg-yellow-700 { background-color: rgba(180, 83, 9, var(--tw-bg-opacity, 1)); }
.bg-yellow-800 { background-color: rgba(146, 64, 14, var(--tw-bg-opacity, 1)); }
.bg-yellow-900 { background-color: rgba(120, 53, 15, var(--tw-bg-opacity, 1)); }

/* Orange Backgrounds with Opacity Support */
.bg-orange-50 { background-color: rgba(255, 247, 237, var(--tw-bg-opacity, 1)); }
.bg-orange-100 { background-color: rgba(255, 237, 213, var(--tw-bg-opacity, 1)); }
.bg-orange-200 { background-color: rgba(254, 215, 170, var(--tw-bg-opacity, 1)); }
.bg-orange-300 { background-color: rgba(253, 186, 116, var(--tw-bg-opacity, 1)); }
.bg-orange-400 { background-color: rgba(251, 146, 60, var(--tw-bg-opacity, 1)); }
.bg-orange-500 { background-color: rgba(249, 115, 22, var(--tw-bg-opacity, 1)); }
.bg-orange-600 { background-color: rgba(234, 88, 12, var(--tw-bg-opacity, 1)); }
.bg-orange-700 { background-color: rgba(194, 65, 12, var(--tw-bg-opacity, 1)); }
.bg-orange-800 { background-color: rgba(154, 52, 18, var(--tw-bg-opacity, 1)); }
.bg-orange-900 { background-color: rgba(124, 45, 18, var(--tw-bg-opacity, 1)); }

/* Purple Backgrounds with Opacity Support */
.bg-purple-50 { background-color: rgba(250, 245, 255, var(--tw-bg-opacity, 1)); }
.bg-purple-100 { background-color: rgba(243, 232, 255, var(--tw-bg-opacity, 1)); }
.bg-purple-200 { background-color: rgba(233, 213, 255, var(--tw-bg-opacity, 1)); }
.bg-purple-300 { background-color: rgba(216, 180, 254, var(--tw-bg-opacity, 1)); }
.bg-purple-400 { background-color: rgba(192, 132, 252, var(--tw-bg-opacity, 1)); }
.bg-purple-500 { background-color: rgba(168, 85, 247, var(--tw-bg-opacity, 1)); }
.bg-purple-600 { background-color: rgba(147, 51, 234, var(--tw-bg-opacity, 1)); }
.bg-purple-700 { background-color: rgba(124, 58, 237, var(--tw-bg-opacity, 1)); }
.bg-purple-800 { background-color: rgba(107, 33, 168, var(--tw-bg-opacity, 1)); }
.bg-purple-900 { background-color: rgba(88, 28, 135, var(--tw-bg-opacity, 1)); }

/* Gray Backgrounds with Opacity Support */
.bg-gray-50 { background-color: rgba(249, 250, 251, var(--tw-bg-opacity, 1)); }
.bg-gray-100 { background-color: rgba(243, 244, 246, var(--tw-bg-opacity, 1)); }
.bg-gray-200 { background-color: rgba(229, 231, 235, var(--tw-bg-opacity, 1)); }
.bg-gray-300 { background-color: rgba(209, 213, 219, var(--tw-bg-opacity, 1)); }
.bg-gray-400 { background-color: rgba(156, 163, 175, var(--tw-bg-opacity, 1)); }
.bg-gray-500 { background-color: rgba(107, 114, 128, var(--tw-bg-opacity, 1)); }
.bg-gray-600 { background-color: rgba(75, 85, 99, var(--tw-bg-opacity, 1)); }
.bg-gray-700 { background-color: rgba(55, 65, 81, var(--tw-bg-opacity, 1)); }
.bg-gray-800 { background-color: rgba(31, 41, 55, var(--tw-bg-opacity, 1)); }
.bg-gray-900 { background-color: rgba(17, 24, 39, var(--tw-bg-opacity, 1)); }

/* Special Colors with Opacity Support */
.bg-white { background-color: rgba(255, 255, 255, var(--tw-bg-opacity, 1)); }
.bg-black { background-color: rgba(0, 0, 0, var(--tw-bg-opacity, 1)); }