@use 'sass:meta';

// overrides for most of FVTT's default color variables, mainly useful for retheming them with e.g. a dark theme.
@mixin colors {
	--color-text-hyperlink: var(--ironsworn-color-warm);
	--color-shadow-primary: var(--ironsworn-color-cool);
	--color-shadow-highlight: var(--ironsworn-color-warm);
	--color-border-highlight: var(--ironsworn-color-warm);
	--color-border-highlight-alt: var(--ironsworn-color-cool);
	--color-shadow-dark: var(--ironsworn-color-dark);
	--color-underline-header: var(--ironsworn-color-fg-cool);
	--color-underline-active: var(--ironsworn-color-fg-warm);
	--color-text-light-highlight: var(--ironsworn-color-light);
	--color-text-light-heading: var(--ironsworn-color-light);
	--color-text-light-primary: var(--ironsworn-color-scale-90);
	--color-text-dark-primary: var(--ironsworn-color-scale-10);
	--color-text-dark-secondary: var(--ironsworn-color-scale-30);
	--color-text-dark-header: var(--ironsworn-color-scale-20);
	--color-text-dark-inactive: var(--ironsworn-color-scale-50);
	--color-border-light-tertiary: var(--color-text-dark-inactive);
	--color-underline-inactive: var(--color-text-dark-inactive);
	--color-border-light-primary: var(--ironsworn-color-light);
	--color-border-light-highlight: var(--ironsworn-color-light);
	--color-border-light-secondary: var(--ironsworn-color-scale-90);
	--color-border-light-1: var(--ironsworn-color-scale-80);
	--color-border-light-2: var(--ironsworn-color-scale-60);
	--color-border-dark: #000;
	--color-border-dark-primary: var(--color-text-dark-primary);
	--color-border-dark-secondary: var(--color-text-dark-header);
	--color-border-dark-tertiary: var(--color-text-dark-inactive);
	--color-border-dark-1: var(--ironsworn-color-scale-10);
	--color-border-dark-2: var(--ironsworn-color-scale-10);
	--color-border-dark-3: var(--ironsworn-color-scale-20);
	--color-border-dark-4: var(--ironsworn-color-scale-30);
	--color-border-dark-5: var(--ironsworn-color-scale-40);

	// --color-text-*-* are purposely omitted for the time being; I suspect they're pure grey on purpose.

	// TODO: danger, warning (etc) colours
}

@mixin ui {
	@include meta.load-css('style:fvtt/app');
	@include meta.load-css('style:fvtt/dialog');
	@include meta.load-css('style:fvtt/clickable');
	@include meta.load-css('style:fvtt/settings');
	@include meta.load-css('style:fvtt/sidebar');
	@include meta.load-css('style:fvtt/tooltip');
	@include meta.load-css('style:fvtt/nue');
	@include meta.load-css('style:fvtt/journal');
	@include meta.load-css('style:inputs');
	@include meta.load-css('style:editor');

	.chat-message {
		background: var(--ironsworn-color-bg);
	}
}
