:root {
    --primary: 45 100% 51%;
    --primary-foreground: 212 58% 9%;

    --primary-50: 45 100% 95%;
    --primary-100: 45 100% 90%;
    --primary-200: 45 100% 80%;
    --primary-300: 45 100% 70%;
    --primary-400: 45 100% 60%;
    --primary-500: 45 100% 50%;
    --primary-600: 45 100% 45%;
    --primary-700: 45 100% 35%;
    --primary-800: 45 100% 25%;
    --primary-900: 45 100% 15%;
    --primary-950: 45 100% 8%;

    --secondary: 45 100% 51%;
    --secondary-50: 45 100% 95%;
    --secondary-100: 45 100% 90%;
    --secondary-200: 45 100% 80%;
    --secondary-300: 45 100% 70%;
    --secondary-400: 45 100% 60%;
    --secondary-500: 45 100% 50%;
    --secondary-600: 45 100% 45%;
    --secondary-700: 45 100% 35%;
    --secondary-800: 45 100% 25%;
    --secondary-900: 45 100% 15%;
    --secondary-950: 45 100% 8%;
}