// out: ../../../Light/Light.qss

// -----------------------------------------------------------------------------

// LIGHT

// -----------------------------------------------------------------------------

// This inherits from NEUTRAL theme, when updating NEUTRAL make sure to check

// changes against LIGHT.

// -----------------------------------------------------------------------------

// Override

@import 'Neutral.less';

// Resource Location

@img-url: '../Default/imgs/black';

@bg:                    #DBDBDB;

@accent:                darken(@bg, 20);

@dock-bg-color:         darken(@bg, 30);

@hl-bg-color:           #a0c1dd;

@hl-text-color:         #000;

@hl-bg-color-secondary: darken(@bg, 15);

@dialogButtonFrame-bg-color: @bg;

// -----------------------------------------------------------------------------

// Tabs

// -----------------------------------------------------------------------------

@tabbar-bg-color: darken(@bg, 9);

// -----------------------------------------------------------------------------

// Menu

// -----------------------------------------------------------------------------

@menu-bg-color:                     @bg;

@menu-checkbox-text-color-selected: @text-color;

@menu-icon-checked-bg-color:        @toolbutton-bg-color-checked;

@menu-icon-checked-border-color:    @toolbutton-border-color-checked;

// -----------------------------------------------------------------------------

// Scrollbars

// -----------------------------------------------------------------------------

// Container

@scrollbar-bg-color:                darken(@bg, 5);

@scrollbar-handle-bg-color:         darken(@bg, 28);

@scrollbar-handle-bg-color-hover:   darken(@scrollbar-handle-bg-color, 10);

@scrollbar-handle-bg-color-pressed: darken(@scrollbar-handle-bg-color-hover, 15);

// -----------------------------------------------------------------------------

// Titlebars

// -----------------------------------------------------------------------------

@title-text-color:             fade(@text-color, 50);

@title-text-color-active:      @text-color;

// Title pane icon colors

@title-button-pressed-color:   darken(@hl-bg-color, 8);

@title-button-rollover-color:  darken(@title-bg-color, 20);

@title-button-freeze-color:    #e0625c;

@title-button-preview-color:   #2cb856;

// -----------------------------------------------------------------------------

// Button

// -----------------------------------------------------------------------------

@button-bg-color:              darken(@bg, 8);

@button-border-color:          darken(@button-bg-color, 15);

@button-bg-color-hover:        lighten(@button-bg-color, 5);

@button-border-color-checked:  darken(@button-bg-color-checked, 15);

@button-text-color-checked:    @text-color;

@button-bg-color-disabled:     darken(@bg, 4);

@button-border-color-disabled: darken(@button-bg-color-disabled, 10);

@button-bg-color-focus:        mix(@hl-bg-color, @button-bg-color, 70);

@button-border-color-focus:    darken(@button-bg-color-focus, 10);

// -----------------------------------------------------------------------------

// Tool Buttons

// -----------------------------------------------------------------------------

@toolbutton-border-color-checked:      darken(@toolbutton-bg-color-checked, 10);

@toolbutton-bg-color-hover:            darken(@bg, 15);

@toolbutton-lock-bg-color-checked:     @title-button-freeze-color;

@toolbutton-lock-border-color-checked: darken(@toolbutton-lock-bg-color-checked, 20);

// -----------------------------------------------------------------------------

// Textfield

// -----------------------------------------------------------------------------

@input-bg-color:           lighten(@bg, 10);

@input-text-color:         #000;

@input-border-color:       @accent;

@input-border-color-focus: saturate(darken(@hl-bg-color, 20), 20);

@input-bg-color-disabled:  lighten(@bg, 8);

// -----------------------------------------------------------------------------

// CheckBox

// -----------------------------------------------------------------------------

@checkbox-bg-color-hover:             lighten(@hl-bg-color, 10);

@checkbox-border-color-hover:         darken(@bg, 40);

@checkbox-text-color-hover:           @text-color;

@checkbox-bg-color-checked-hover:     darken(@bg, 50);

@checkbox-border-color-checked-hover: @checkbox-bg-color-checked-hover;

@checkbox-bg-color-disabled:          @bg;

// -----------------------------------------------------------------------------

// Viewer Window

// -----------------------------------------------------------------------------

// FlipSlider

@flipmarker-img:              'flipmarker_light.svg';

@flipslider-img:              'flipslider_light.svg';

@flipslider-base-color:       darken(@bg, 10);

@flipslider-notstarted-color: rgb(195, 60, 60);

@flipslider-started-color:    rgb(16, 221, 64);

// Ruler

@viewer-ruler-handle-color:      black;

@viewer-ruler-handle-drag-color: red;

// -----------------------------------------------------------------------------

// Palette Window

// -----------------------------------------------------------------------------

// All views (except list);

@palette-SelectedBorderColor:           rgb(66, 82, 100);

@palette-NumpadShortcutBgColor:         rgba(0, 0, 0, 0.15);

@palette-NumpadShortcutBorderColor:     rgb(128, 128, 128);

// List view

@palette-ListNumpadShortcutBorderColor: rgb(105, 105, 105);

// -----------------------------------------------------------------------------

// File Browser / Trees

// -----------------------------------------------------------------------------

// Trees

@tree-bg-color:     darken(@bg, 5);

@tree-bg-color-alt: lighten(@tree-bg-color, -4);

// -----------------------------------------------------------------------------

// Keyframes

// -----------------------------------------------------------------------------

@keyframe-total-color: #f8a145;

// For use in FX Settings Panels

@keyframe-inbetween-color: #e6dbb6;

@keyframe-modified-color:  rgb(243, 226, 129);

// -----------------------------------------------------------------------------

// Slider

// -----------------------------------------------------------------------------

// Single

@slider-groove-img:          'slider-groove_light.svg';

@slider-groove-img-disabled: 'slider-groove_disabled_light.svg';

@slider-handle-img:          'slider-handle_light.svg';

@slider-handle-img-disabled: 'slider-handle_disabled_light.svg';

// This one is used only for #ViewerFpsSlider

@slider-handle-bg-color:     lighten(@bg, -10);

@slider-handle-border-color: darken(@bg, 30);

// DoublePairField, IntPairField

@slider-groove-color: darken(@bg, 35);

// -----------------------------------------------------------------------------

// XSheet

// -----------------------------------------------------------------------------

// XSheet Spreadsheet Viewer

@xsheet-bg-color:                           darken(@bg, 5);

@xsheet-LightLine-color:                    rgba(0, 0, 0, 0.15);

@xsheet-VerticalLine-color:                 rgba(0, 0, 0, 0.15);

@xsheet-ColumnIconLine-color:               rgb(112, 112, 112);

@xsheet-MarkerLine-color:                   rgba(0, 0, 0, 0.3);

@xsheet-OnionSkinAreaBG-color:              darken(@bg, 10);

@xsheet-PreviewFrameText-color:             #2d42b9;

@xsheet-CurrentRowBG-color:                 saturate(lighten(fade(@hl-bg-color, 70), -8), 8);

@xsheet-VerticalLineHead-color:             rgba(0, 0, 0, 0.3);

@xsheet-SelectedColumnHead-color:           fade(black, 15);

@xsheet-FoldedColumnBG-color:               lighten(@bg, -20);

@xsheet-FoldedColumnLine-color:             darken(@bg, 40);

// Level Type Colors Adjustment

@columnBorderDesaturation:                  8;

@columnBorderDarkness:                      15;

@cellHighlightLightness:                    10;

@xsheet-EmptyCell-color:                    @xsheet-OnionSkinAreaBG-color;

@xsheet-NotEmptyColumn-color:               @xsheet-bg-color;

@xsheet-SelectedEmptyCell-color:            fade(mix(lighten(@xsheet-EmptyCell-color, -20), @cellHighlightTintColor, 80), 50);

@xsheet-LevelColumn-color:                  #9ed49e;

@xsheet-VectorColumn-color:                 #d3cf9a;

@xsheet-ChildColumn-color:                  #cca3cc;

@xsheet-FullColorColumn-color:              #b0cbdd;

@xsheet-FxColumn-color:                     #ceb694;

@xsheet-ReferenceColumn-color:              #c2c2c2;

@xsheet-PaletteColumn-color:                #a9d4ca;

@xsheet-MeshColumn-color:                   #b8a2cf;

@xsheet-SoundColumn-color:                  #aad6d6;

@xsheet-SoundTextColumn-color:              #c2c2c2;

@xsheet-ActiveCamera-color:                 #79b5ee;

@xsheet-OtherCamera-color:                  #6eb7c2;

// Orientation: Timeline

@timeline-IconLine-color:                   rgba(0, 0, 0, 0.144);

@timeline-FrameRangeMarkerLine-color:       rgba(0, 0, 0, 0.3);

// Orientation: XSheet

@xsheet-CamstandButtonBgOn-color:           rgb(255, 166, 131);

@xsheet-PreviewButtonBgOn-color:            rgb(233, 233, 127);

// -----------------------------------------------------------------------------

// Schematic Viewer

// -----------------------------------------------------------------------------

// Node Viewer

@schematic-viewer-bg-color: rgb(128, 128, 128);

// Node Type Colors Adjustment

@nodeLightness:  15;

@nodeSaturation: 15;

// -----------------------------------------------------------------------------

// Function Editor

// -----------------------------------------------------------------------------

// Function Curve Panel

@function-panel-bg-color: @schematic-viewer-bg-color;

@function-panel-OtherCurves-color: rgb(218, 218, 218);

@function-panel-Text-color: @text-color;

@function-panel-Sub-color: #fff;

@function-panel-Selected-color: #ffe033;

@function-SelectedKeyFrame-color:  mix(shade(@function-KeyFrame-color, @cellHighlightLightness), @cellHighlightTintColor, @cellHighlightTintAmount);