.system-foundry-ironsworn {
	// typography
	--ironsworn-word-spacing-sm: 0.02em;
	--ironsworn-letter-spacing-sm: 0.02em;

	// SVG widgets
	--ironsworn-widget-stroke-width: 1;
	--ironsworn-clock-fill-opacity-hover: 0.6;

	// Shapes
	--ironsworn-hexagon-aspect-ratio: calc(sqrt(3) / 2);

	// Border radius and corners
	--ironsworn-border-radius-sm: 2px;
	--ironsworn-border-radius-md: 3px;
	--ironsworn-border-radius-lg: 5px;

	// Border width
	--ironsworn-border-width-md: 1px;
	--ironsworn-border-width-lg: 2px;

	// Standard spacers for margin, padding, gap
	--ironsworn-spacer-xs: 2px;
	--ironsworn-spacer-sm: 3px;
	--ironsworn-spacer-md: 5px;
	--ironsworn-spacer-lg: 7px;
	--ironsworn-spacer-xl: 10px;

	// Range input elements
	--ironsworn-range-height: 20px;

	// range slider thumb
	--ironsworn-range-thumb-bg-color: var(--ironsworn-color-fg);
	--ironsworn-range-thumb-border-color: var(--ironsworn-color-cool-50);
	--ironsworn-range-thumb-border-width: var(--ironsworn-border-width-md);
	--ironsworn-range-thumb-border-radius: 2px;
	--ironsworn-range-thumb-bg-color-focus: var(--ironsworn-color-fg);
	--ironsworn-range-thumb-border-color-focus: var(--ironsworn-color-warm-90);
	--ironsworn-range-thumb-height: 12px;
	--ironsworn-range-thumb-width: 12px;

	// range slider track
	--ironsworn-range-track-height: 6px;
	--ironsworn-range-track-border-radius: calc(
		var(--ironsworn-range-track-height) / 2
	);
	--ironsworn-range-track-border-width: var(--ironsworn-border-width-md);
	--ironsworn-range-track-bg-color: var(--ironsworn-color-fg-20);
	--ironsworn-range-track-border-color: var(--ironsworn-color-fg-20);
	--ironsworn-range-track-bg-color-focus: var(--ironsworn-color-warm-20);
	--ironsworn-range-track-border-color-focus: var(--ironsworn-color-cool-50);
	--ironsworn-range-box-shadow: 1px 1px 1px var(--color-shadow-dark),
		0 0 1px #0d0d0d;

	// Width for custom slider widgets
	--ironsworn-vertical-slider-width: 50px;

	// Icon sizing
	--ironsworn-icon-size: 1em;

	// Line height for text. Relative line height is preferred, without units.
	--ironsworn-line-height-lg: 2;
	--ironsworn-line-height-md: 1.5;
	--ironsworn-line-height-sm: 1.25;
	--ironsworn-line-height-xs: 1;
	--ironsworn-line-height: var(--ironsworn-line-height-md);

	// z-index presets to keep them consistent throughout.
	// FIXME: FVTT may have its own set of z-indices. If so, we ought to use those instead.
	--ironsworn-z-index-highest: 100;
	--ironsworn-z-index-higher: 75;
	--ironsworn-z-index-high: 25;
	--ironsworn-z-index-low: -1;
	--ironsworn-z-index-lower: -2;
	--ironsworn-z-index-lowest: -3;

	// This could be inset, but for some reason certain states don't inherit this properly, creating an annoying 'pop' in the input hover animation.
	--ironsworn-input-border-style: solid;

	// Transitions
	--ironsworn-transition-duration: 0.5s;
	--ironsworn-transition-timing-function: ease;
	// for later use as a mixin to scope transitions to colors effects only.
	--ironsworn-transition-property-color: background-color, border-color,
		box-shadow, caret-color, color, column-rule-color, filter, opacity,
		outline-color, text-decoration-color, fill-opacity, fill-color, stroke;
	--ironsworn-transition-timing: var(--ironsworn-transition-duration)
		var(--ironsworn-transition-timing-function);
	--ironsworn-transition: all 0.5s ease;

	// FontAwesome
	--fa-display: inline-block;
	--fa-invert: var(--ironsworn-color-bg);

	// Ironsworn colors

	// original sample from PDF: #c9181a
	--ironsworn-color-red-light: hsl(355deg 100% 65%);
	--ironsworn-color-red: hsl(7deg 78% 51%);
	--ironsworn-color-red-dark: hsl(357deg 100% 28%);

	// original sample from PDF: #8c1d81
	--ironsworn-color-purple-light: hsl(298deg 72% 62%);
	--ironsworn-color-purple: hsl(299deg 59% 45%);
	--ironsworn-color-purple-dark: hsl(296deg 100% 23%);

	// original sample from PDF: #35a9e0
	--ironsworn-color-blue-light: hsl(191deg 100% 50%);
	--ironsworn-color-blue: hsl(199deg 100% 47%);
	--ironsworn-color-blue-dark: hsl(214deg 100% 45%);
	--ironsworn-color-legacy-quests: var(--ironsworn-color-red);
	--ironsworn-color-legacy-bonds: var(--ironsworn-color-purple);
	--ironsworn-color-legacy-discoveries: var(--ironsworn-color-blue);
	--ironsworn-color-danger: var(--ironsworn-color-red);
	--ironsworn-color-danger-inverted: hsl(0deg 0% 100%);
	--ironsworn-color-success: var(--ironsworn-color-blue);
	--ironsworn-color-warning: hsl(55deg 100% 50%);
	--ironsworn-tab-transition: fade;

	--starforged-asset-ability-bullet-checked: url('/assets/misc/hex-checkbox-checked.svg');
	--starforged-asset-ability-bullet-unchecked: url('/assets/misc/hex-checkbox-unchecked.svg');
	--starforged-asset-deco: url('/assets/misc/hex-deco.svg');
}
