@use 'base-colors' as *;

:root[theme='dark'] {
	--color-foreground-primary: #{$dusk-25};
	--color-foreground-primary-inverted: #{$base-white};
	--color-foreground-secondary: #{$dusk-100};
	--color-foreground-secondary-inverted: #{$dusk-600};
	--color-foreground-tertiary: #{$dusk-400};
	--color-foreground-tertiary-inverted: #{$dusk-500};
	--color-foreground-disabled: #{$a-white-30};
	--color-foreground-disabled-alt: #{$a-white-20};
	--color-foreground-success-primary: #{$emerald-500};
	--color-foreground-success-secondary: #{$emerald-500};
	--color-foreground-success-subtle-30: #{$a-emerald-35};
	--color-foreground-warning-primary: #{$sunset-500};
	--color-foreground-warning-secondary: #{$sunset-400};
	--color-foreground-warning-subtle-30: #{$a-sunset-30};
	--color-foreground-error-primary: #{$salmon-600};
	--color-foreground-error-secondary: #{$red-400};
	--color-foreground-error-subtle-30: #{$a-salmon-50};
	--color-foreground-brand-disabled: #{$a-oisy-blue-30};
	--color-foreground-brand-primary: #{$oisy-blue-600};
	--color-foreground-brand-primary-alt: #{$oisy-blue-500};
	--color-foreground-brand-primary-inverted: #{$base-white};
	--color-foreground-brand-secondary: #{$oisy-blue-800};
	--color-foreground-brand-subtle-10: #{$a-oisy-blue-20};
	--color-foreground-brand-subtle-20: #{$a-oisy-blue-30};
	--color-foreground-brand-subtle-30: #{$a-oisy-blue-40};
	--color-foreground-brand-tertiary: #{$oisy-blue-950};
	--color-foreground-primary-inverted-alt: #{$dusk-950};
	--color-foreground-white: #{$base-white};

	--color-foreground-contact-1: #{$contact-green};
	--color-foreground-contact-2: #{$contact-blue};
	--color-foreground-contact-3: #{$contact-orange};
	--color-foreground-contact-4: #{$contact-teal};
	--color-foreground-contact-5: #{$contact-gold};
	--color-foreground-contact-6: #{$contact-red};
	--color-foreground-contact-7: #{$contact-purple};
	--color-foreground-contact-8: #{$contact-pink};
	--color-foreground-contact-9: #{$contact-indigo};

	--color-background-page: #{$dusk-950};
	--color-background-surface: #{$dusk-700};
	--color-background-modal-overlay: #{$a-dark-80};
	--color-background-primary: #{$dusk-900};
	--color-background-primary-alt: #{$a-white-20};
	--color-background-primary-inverted: #{$dusk-100};
	--color-background-primary-inverted-alt: #{$dusk-950};
	--color-background-secondary: #{$dusk-800};
	--color-background-secondary-alt: #{$a-white-30};
	--color-background-secondary-inverted: #{$dusk-200};
	--color-background-tertiary: #{$dusk-700};
	--color-background-tertiary-alt: #{$a-white-20};
	--color-background-tertiary-inverted: #{$dusk-400};
	--color-background-disabled: #{$a-white-5};
	--color-background-disabled-alt: #{$a-white-10};
	--color-background-disabled-alt2: #{$a-white-16};
	--color-background-success-primary: #{$emerald-500};
	--color-background-success-secondary: #{$sage-700};
	--color-background-success-tertiary: #{$sage-800};
	--color-background-success-subtle-10: #{$a-emerald-10};
	--color-background-success-subtle-20: #{$a-emerald-20};
	--color-background-success-subtle-30: #{$a-emerald-35};
	--color-background-success-light: #{$sage-900};
	--color-background-warning-primary: #{$sunset-500};
	--color-background-warning-secondary: #{$sunset-700};
	--color-background-warning-tertiary: #{$sunset-800};
	--color-background-warning-subtle-10: #{$a-sunset-10};
	--color-background-warning-subtle-20: #{$a-sunset-20};
	--color-background-warning-subtle-30: #{$a-sunset-30};
	--color-background-warning-light: #{$yellow-950};
	--color-background-error-primary: #{$salmon-600};
	--color-background-error-secondary: #{$salmon-900};
	--color-background-error-tertiary: #{$salmon-950};
	--color-background-error-subtle-10: #{$a-salmon-20};
	--color-background-error-subtle-20: #{$a-salmon-35};
	--color-background-error-subtle-30: #{$a-salmon-50};
	--color-background-error-light: #{$salmon-950};
	--color-background-brand-disabled: #{$a-oisy-blue-20};
	--color-background-brand-primary: #{$oisy-blue-600};
	--color-background-brand-primary-alt: #{$oisy-blue-500};
	--color-background-brand-secondary: #{$oisy-blue-800};
	--color-background-brand-subtle-5: #{$a-oisy-blue-5};
	--color-background-brand-subtle-10: #{$a-oisy-blue-20};
	--color-background-brand-subtle-20: #{$a-oisy-blue-30};
	--color-background-brand-subtle-30: #{$a-oisy-blue-40};
	--color-background-brand-tertiary: #{$oisy-blue-950};
	--color-background-brand-light: #{$oisy-blue-950};
	--color-background-brand-light-alt: #{$oisy-blue-990};
	--color-background-primary-light: #{$a-dark-30};

	--color-background-contact-1: #{$contact-green};
	--color-background-contact-2: #{$contact-blue};
	--color-background-contact-3: #{$contact-orange};
	--color-background-contact-4: #{$contact-teal};
	--color-background-contact-5: #{$contact-gold};
	--color-background-contact-6: #{$contact-red};
	--color-background-contact-7: #{$contact-purple};
	--color-background-contact-8: #{$contact-pink};
	--color-background-contact-9: #{$contact-indigo};

	--color-border-primary: #{$a-white-20};
	--color-border-primary-inverted: #{$dusk-900};
	--color-border-secondary: #{$a-white-20};
	--color-border-secondary-inverted: #{$dusk-500};
	--color-border-tertiary: #{$a-white-10};
	--color-border-tertiary-alt: #{$a-white-0};
	--color-border-tertiary-inverted: #{$dusk-600};
	--color-border-disabled: #{$a-white-5};
	--color-border-success-solid: #{$emerald-500};
	--color-border-success-solid-alt: #{$sage-700};
	--color-border-success-subtle-10: #{$a-emerald-10};
	--color-border-success-subtle-20: #{$a-emerald-20};
	--color-border-warning-solid: #{$sunset-500};
	--color-border-warning-solid-alt: #{$sunset-700};
	--color-border-warning-subtle-10: #{$a-sunset-10};
	--color-border-warning-subtle-20: #{$a-sunset-20};
	--color-border-error-solid: #{$salmon-600};
	--color-border-error-solid-alt: #{$salmon-900};
	--color-border-error-subtle-10: #{$a-salmon-20};
	--color-border-error-subtle-20: #{$a-salmon-35};
	--color-border-brand-disabled: #{$a-oisy-blue-20};
	--color-border-brand-primary: #{$oisy-blue-600};
	--color-border-brand-primary-alt: #{$oisy-blue-500};
	--color-border-brand-secondary: #{$oisy-blue-800};
	--color-border-brand-subtle-10: #{$a-oisy-blue-20};
	--color-border-brand-subtle-20: #{$a-oisy-blue-30};
	--color-border-brand-subtle-30: #{$a-oisy-blue-40};
	--color-border-brand-tertiary: #{$oisy-blue-950};

	--color-base-black: #{$base-black};
	--color-base-white: #{$base-white};

	--value-color: #{$base-white};
}
