// Colors
$ColorDot                   = #7391c0;
$ColorAccent                = #5f8bc4;
$ColorHighlight             = #5f8bc4;
$ColorBackground            = #d4d4d4;
$ColorForeground            = #000;
$ColorOutline               = $ColorForeground;
$ColorGutter                = #bfc6d1;
$ColorGutterHovered         = #c5cbd6;
$ColorRaised                = #e9eaea;
$ColorRaisedPressed         = #ccd4dd;
$ColorRaisedFocused         = #cfd6dd;
$ColorRaisedHovered         = #f1f3f5;
$ColorSunken                = #e9eaea;
$ColorSunkenFocused         = #e0e6ee;
$ColorSunkenPressed         = #e0e6ee;
$ColorCalendarWeekdayHeader = #d3cac2;
$ColorCalendarWeekend       = #c2d3c4;
$ColorCalendarDay           = #d6dae2;

// Borders
$BorderOutline        = $ColorOutline                   / 1;
$BorderEngraved       = #c3c3c5 #e3e3e3 #e9e9e9 #c2c2c2 / 1;
$BorderGap            = #697c7c #566767 #566767 #697c7c / 1;
$BorderLifted         = #f9fafc #c2c8d3 #a4afc0 #f5f6f8 / 1;
$BorderLiftedFocused  = #f0f4f9 #b1baca #9aa6b7 #e4e9ee / 1;
$BorderFocused        = #5f8bc4 #5f8bc4 #5f8bc4 #5f8bc4 / 1;
$BorderTear           = $BorderEngraved;
$BorderTearFocused    = #7f94b5 #ced7e4 #ced7e4 #7f94b5 / 1;
$BorderTearPad        = #0000                           / 3;
$BorderTearPadFocused = #7391c080                       / 3;
$BorderInnerShadow    = #a4afc0                         / 1 0 0 1;
$BorderOuterShadow    = #a4afc0                         / 0 1 1 0;

*.* {
	TextColor: $ColorForeground;
	DotColor:  $ColorDot;
	Gap:       8;
}

*.Button {
	Border:  $BorderEngraved, $BorderGap, $BorderLifted;
	Padding: 4 8;
	Color:   $ColorRaised;
}

*.Button[focused] {
	Border:  $BorderEngraved, $BorderGap, $BorderLiftedFocused;
	Padding: 4 8;
	Color:   $ColorRaisedFocused;
}

*.Button[hovered] {
	Color: $ColorRaisedHovered;
}

*.Button[pressed] {
	Border:  $BorderEngraved, $BorderGap, $BorderInnerShadow;
	Padding: 5 8 4 9;
	Color:   $ColorRaisedPressed;
}

*.TextInput {
	Border:  $BorderEngraved, $BorderGap, $BorderInnerShadow;
	Padding: 5 4 4 5;
	Color:   $ColorSunken;
}

*.TextInput[focused] {
	Border: $BorderEngraved, $BorderFocused, $BorderInnerShadow;
}

*.TextView {
	Border:  $BorderEngraved, $BorderGap, $BorderInnerShadow;
	Padding: 5 4 4 5;
	Color:   $ColorSunken;
}

*.NumberInput {
	Gap: 0;
}

*.Container[sunken] {
	Border:  $BorderEngraved, $BorderGap, $BorderInnerShadow;
	Padding: 5 4 4 5;
	Color:   $ColorSunken;
}

*.Container[outer] {
	Color:   $ColorBackground;
	Padding: 8;
}

*.Container[menu] {
	Border: $BorderGap, $BorderLifted;
	Color:  $ColorBackground;
	Gap:    0;
}

*.Heading {
	Align: middle middle;
}

*.Separator {
	Border: $BorderEngraved;
}

*.Slider {
	Border: $BorderEngraved, $BorderGap, $BorderInnerShadow;
	Color:  $ColorGutter;
}

*.Slider[focused] {
	Border: $BorderEngraved, $BorderFocused, $BorderInnerShadow;
}

*.Slider[hovered] {
	Color: $ColorGutterHovered;
}

*.Slider[horizontal] {
	MinimumSize: 48 0;
}

*.Slider[vertical] {
	MinimumSize: 0 48;
}

*.SliderHandle {
	Border:      $BorderOuterShadow, $BorderGap, $BorderLifted;
	Color:       $ColorRaised;
	MinimumSize: 12;
}

*.ScrollContainer {
	Gap: 0;
}

*.Checkbox {
	Border:      $BorderEngraved, $BorderGap, $BorderInnerShadow;
	Color:       $ColorSunken;
	Padding:     0 1 1 0;
	MinimumSize: 19;
}

*.Checkbox[focused] {
	Border:  $BorderEngraved, $BorderFocused, $BorderInnerShadow;
	Color:   $ColorSunkenFocused;
	Padding: 0;
}

*.Checkbox[checked] {
	// TODO
}

*.MenuItem {
	Padding: 4;
	Gap:     4;
	Color:   #0000;
}

*.MenuItem[hovered] {
	Color: $ColorDot;
}

*.MenuItem[focused] {
	Color: $ColorDot;
}

*.File {
	Color: #0000;
}

*.File[focused] {
	Color: $ColorDot;
}

*.TearLine {
	Border: $BorderTearPad, $BorderTear;
}

*.TearLine[hovered] {
	Border: $BorderTearPadFocused, $BorderTearFocused;
}

*.TearLine[focused] {
	Border: $BorderTearPadFocused, $BorderTearFocused;
}

*.Calendar {
	Border:  $BorderOuterShadow, $BorderGap;
	Color:   $ColorRaised;
	Padding: 2;
	Gap:     2;
}

*.CalendarGrid {
	Gap: 2 2;
}

*.CalendarWeekdayHeader {
	Color:   $ColorCalendarWeekdayHeader;
	Padding: 2;
}

*.CalendarDay {
	Color:       $ColorCalendarDay;
	Padding:     2;
	MinimumSize: 32;
}

*.CalendarDay[weekend] {
	Color: $ColorCalendarWeekend;
}