:root {
    /* Override the main CSS variables used by the application */
    --primary: #3C7843;
    --secondary: #2d2d2d;
    --accent: #eeeeee;

    /* Additional color variants for compatibility */
    --color-primary: #3C7843;
    --color-primary-rgb: 60, 120, 67;
    --color-secondary: #2d2d2d;
    --color-secondary-rgb: 45, 45, 45;
    --color-accent: #eeeeee;
    --color-accent-rgb: 238, 238, 238;

    /* Tailwind-compatible variables */
    --color-primary-50: color-mix(in srgb, #3C7843 10%, white);
    --color-primary-100: color-mix(in srgb, #3C7843 20%, white);
    --color-primary-200: color-mix(in srgb, #3C7843 30%, white);
    --color-primary-300: color-mix(in srgb, #3C7843 40%, white);
    --color-primary-400: color-mix(in srgb, #3C7843 60%, white);
    --color-primary-500: #3C7843;
    --color-primary-600: color-mix(in srgb, #3C7843 80%, black);
    --color-primary-700: color-mix(in srgb, #3C7843 70%, black);
    --color-primary-800: color-mix(in srgb, #3C7843 60%, black);
    --color-primary-900: color-mix(in srgb, #3C7843 50%, black);
}