/* Khaki Color Theme */
:root {
    --khaki: #F0E68C;
    --khaki-50: #FDFBEF;
    --khaki-100: #FAF7E0;
    --khaki-200: #F7F0C1;
    --khaki-300: #F4EAA2;
    --khaki-400: #F0E68C;  /* Base Khaki */
    --khaki-500: #D6CE7E;
    --khaki-600: #BDB670;
    --khaki-700: #A39D62;
    --khaki-800: #8A8554;
    --khaki-900: #706C46;
}

/* Text Colors */
.text-khaki-50 { color: var(--khaki-50); }
.text-khaki-100 { color: var(--khaki-100); }
.text-khaki-200 { color: var(--khaki-200); }
.text-khaki-300 { color: var(--khaki-300); }
.text-khaki-400 { color: var(--khaki-400); }
.text-khaki-500 { color: var(--khaki-500); }
.text-khaki-600 { color: var(--khaki-600); }
.text-khaki-700 { color: var(--khaki-700); }
.text-khaki-800 { color: var(--khaki-800); }
.text-khaki-900 { color: var(--khaki-900); }

/* Background Colors */
.bg-khaki-50 { background-color: var(--khaki-50); }
.bg-khaki-100 { background-color: var(--khaki-100); }
.bg-khaki-200 { background-color: var(--khaki-200); }
.bg-khaki-300 { background-color: var(--khaki-300); }
.bg-khaki-400 { background-color: var(--khaki-400); }
.bg-khaki-500 { background-color: var(--khaki-500); }
.bg-khaki-600 { background-color: var(--khaki-600); }
.bg-khaki-700 { background-color: var(--khaki-700); }
.bg-khaki-800 { background-color: var(--khaki-800); }
.bg-khaki-900 { background-color: var(--khaki-900); }

/* Border Colors */
.border-khaki-50 { border-color: var(--khaki-50); }
.border-khaki-100 { border-color: var(--khaki-100); }
.border-khaki-200 { border-color: var(--khaki-200); }
.border-khaki-300 { border-color: var(--khaki-300); }
.border-khaki-400 { border-color: var(--khaki-400); }
.border-khaki-500 { border-color: var(--khaki-500); }
.border-khaki-600 { border-color: var(--khaki-600); }
.border-khaki-700 { border-color: var(--khaki-700); }
.border-khaki-800 { border-color: var(--khaki-800); }
.border-khaki-900 { border-color: var(--khaki-900); }

/* Hover States */
.hover\:text-khaki-400:hover { color: var(--khaki-400); }
.hover\:text-khaki-500:hover { color: var(--khaki-500); }
.hover\:text-khaki-600:hover { color: var(--khaki-600); }

.hover\:bg-khaki-50:hover { background-color: var(--khaki-50); }
.hover\:bg-khaki-100:hover { background-color: var(--khaki-100); }
.hover\:bg-khaki-400:hover { background-color: var(--khaki-400); }
.hover\:bg-khaki-500:hover { background-color: var(--khaki-500); }
.hover\:bg-khaki-600:hover { background-color: var(--khaki-600); }

/* Gradients */
.bg-gradient-to-r-khaki { background-image: linear-gradient(to right, var(--khaki-400), var(--khaki-600)); }
.bg-gradient-to-br-khaki { background-image: linear-gradient(to bottom right, var(--khaki-50), var(--khaki-200)); }

/* Ring Colors */
.ring-khaki-400 { --tw-ring-color: var(--khaki-400); }
.ring-khaki-500 { --tw-ring-color: var(--khaki-500); }
.ring-khaki-600 { --tw-ring-color: var(--khaki-600); }