:root {
    /* Base Colors */
    --color-neutral-50: #ffffff;
    --color-neutral-100: #f2f2f2;
    --color-neutral-200: #d9d9d9;
    --color-neutral-300: #bfbfbf;
    --color-neutral-400: #a6a6a6;
    --color-neutral-500: #8c8c8c;
    --color-neutral-600: #737373;
    --color-neutral-700: #595959;
    --color-neutral-800: #404040;
    --color-neutral-900: #262626;
    --color-neutral-950: #1a1a1a;

    /* Primary */
    --color-primary-50: #ccebdb;
    --color-primary-100: #aadec3;
    --color-primary-200: #80cda5;
    --color-primary-300: #55bc88;
    --color-primary-400: #2aac6a;
    --color-primary-500: #009b4c;
    --color-primary-600: #00813f;
    --color-primary-700: #006733;
    --color-primary-800: #004d26;
    --color-primary-900: #003419;
    --color-primary-950: #001f0f;

    /* Secondary */
    --color-secondary-50: #fff6cc;
    --color-secondary-100: #fef0aa;
    --color-secondary-200: #fee880;
    --color-secondary-300: #fee055;
    --color-secondary-400: #fdd92a;
    --color-secondary-500: #fdd100;
    --color-secondary-600: #d3ae00;
    --color-secondary-700: #a98b00;
    --color-secondary-800: #7e6800;
    --color-secondary-900: #544600;
    --color-secondary-950: #332a00;


    /* Info */
    --color-info-50: #eef8ff;
    --color-info-100: #d9eeff;
    --color-info-200: #bce2ff;
    --color-info-300: #8ed0ff;
    --color-info-400: #59b5ff;
    --color-info-500: #2d92ff;
    --color-info-600: #1b75f5;
    --color-info-700: #145fe1;
    --color-info-800: #174cb6;
    --color-info-900: #19438f;
    --color-info-950: #142a57;

    /* Warning */
    --color-warning-50: #fffbeb;
    --color-warning-100: #fff4c6;
    --color-warning-200: #ffe688;
    --color-warning-300: #ffd44a;
    --color-warning-400: #ffbc14;
    --color-warning-500: #f99e07;
    --color-warning-600: #dd7602;
    --color-warning-700: #b75206;
    --color-warning-800: #943e0c;
    --color-warning-900: #7a330d;
    --color-warning-950: #461a02;

    /* Danger */
    --color-danger-50: #fff0f1;
    --color-danger-100: #ffe2e4;
    --color-danger-200: #ffcad0;
    --color-danger-300: #ff9fa9;
    --color-danger-400: #ff697c;
    --color-danger-500: #ff304f;
    --color-danger-600: #ed113c;
    --color-danger-700: #c80833;
    --color-danger-800: #a80932;
    --color-danger-900: #8f0c31;
    --color-danger-950: #500115;

    /* Success */
    --color-success-50: #f3fcf1;
    --color-success-100: #e0fade;
    --color-success-200: #c5f2c0;
    --color-success-300: #94e78e;
    --color-success-400: #5dd355;
    --color-success-500: #33ab2b;
    --color-success-600: #289821;
    --color-success-700: #22781d;
    --color-success-800: #205f1c;
    --color-success-900: #1b4e19;
    --color-success-950: #082b08;

    --rounded-none: 0;
    --rounded-sm: 0.125rem;
    --rounded: 0.25rem;
    --rounded-md: 0.375rem;
    --rounded-lg: 0.5rem;
    --rounded-xl: 0.75rem;
    --rounded-2xl: 1rem;
    --rounded-3xl: 1.5rem;
    --rounded-full: 9999px;

    --rounded-button: var(--rounded);
    --rounded-input: var(--rounded);
    --rounded-card: var(--rounded-md);
}

/* Button primary overrides to use new brand colors */
html body .btn-primary,
html body .btn-primary[data-trigger=hover].dropdown-toggle:not(.show) {
    background-color: var(--color-primary-500) !important;
    border-color: var(--color-primary-500) !important;
    color: #fff !important;
}

html body .btn-primary:hover,
html body .btn-primary[data-trigger=hover].show.dropdown-toggle:hover {
    background-color: var(--color-primary-600) !important;
    border-color: var(--color-primary-600) !important;
    color: #fff !important;
}

html body .btn-check:focus + .btn-primary,
html body .btn-primary:focus,
html body .btn-primary.focus {
    background-color: var(--color-primary-600) !important;
    border-color: var(--color-primary-600) !important;
    color: #fff !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 155, 76, 0.4) !important;
}

html body .btn-check:checked + .btn-primary,
html body .btn-check:active + .btn-primary,
html body .btn-primary:active,
html body .btn-primary.active,
html body .btn-primary.show.dropdown-toggle,
html body .show > .btn-primary.dropdown-toggle {
    background-color: var(--color-primary-700) !important;
    border-color: var(--color-primary-700) !important;
    color: #fff !important;
}

html body .btn-check:checked + .btn-primary:focus,
html body .btn-check:active + .btn-primary:focus,
html body .btn-primary:active:focus,
html body .btn-primary.active:focus,
html body .btn-primary.show.dropdown-toggle:focus,
html body .show > .btn-primary.dropdown-toggle:focus {
    background-color: var(--color-primary-700) !important;
    border-color: var(--color-primary-700) !important;
    color: #fff !important;
    box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 155, 76, 0.4) !important;
}

html body .btn-primary.disabled,
html body .btn-primary:disabled {
    background-color: var(--color-primary-300) !important;
    border-color: var(--color-primary-300) !important;
    color: #fff !important;
}

/* Link overrides to use primary brand color instead of legacy blue */
/* html body a {
    color: var(--color-primary-500);
}

html body a:hover,
html body a:focus,
html body a:active {
    color: var(--color-primary-600) !important;
} */