/*!
 * Copyright 2022 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
// Widget
@widget-background-color: @background;
@widget-text-color: @normal-text-color;
@widget-border-color: darken(@background, 12%);
@widget-gradient: null;
@widget-shadow: 0 4px 10px 4px rgba(0, 0, 0, 0.2);


// Component
@component-bg: @widget-background-color;
@component-text: @widget-text-color;
@component-border: @widget-border-color;


// Hover
@hover-bg: @hover-background;
@hover-text: @hover-text-color;
@hover-border: @hover-border-color;

// Focus
@focus-shadow: @focused-shadow;

// Selected
@selected-bg: @selected-background;
@selected-text: @selected-text-color;
@selected-border: @selected-border-color;


// Button
@button-text-color: lighten(@hover-text-color, 8%);
@button-background-color: @normal-background;
@button-border-color: lighten(@hover-text-color, 8%);
@button-gradient: null;
@button-shadow: null;

@button-hover-text-color: @button-text-color;
@button-hover-background-color: @hover-background;
@button-hover-border-color: @button-border-color;
@button-hover-gradient: null;
@button-hover-shadow: null;

@button-active-background: @accent-hover-background;
@button-active-text-color: @inversed-text-color;
@button-active-border-color: @selected-background;
@button-active-gradient: null;
@button-active-shadow: null;

@button-focused-border-color: @accent;
@button-focused-shadow: null;
@button-focused-active-shadow: null;

// Primary button
@primary-text-color: @inversed-text-color;
@primary-background-color: @accent;
@primary-border-color: @accent;
@primary-gradient: null;
@primary-shadow: null;

@primary-hover-text-color: @primary-text-color;
@primary-hover-background-color: lighten(@accent, 4%);
@primary-hover-border-color: @primary-hover-background-color;
@primary-hover-gradient: null;
@primary-hover-shadow: null;

@primary-active-text-color: @primary-text-color;
@primary-active-background-color: @accent-hover-background;
@primary-active-border-color: @accent-hover-background;
@primary-active-gradient: null;
@primary-active-shadow: null;

@primary-focused-border-color: multiply(@accent, #dbdbdb);
@primary-focused-shadow: null;
@primary-focused-active-shadow: null;

@primary-disabled-text-color: @selected-text-color;
@primary-disabled-background-color: lighten(@accent, 18%);
@primary-disabled-border-color: lighten(@accent, 18%);
@primary-disabled-gradient: null;


// Input new
@input-text: @component-text;
@input-bg: @component-bg;
@input-border: @button-border-color;
@input-shadow: null;

@input-hover-text: @input-text;
@input-hover-bg: @input-bg;
@input-hover-border: @button-hover-border-color;
@input-hover-shadow: null;

@input-focus-text: @input-text;
@input-focus-bg: @input-bg;
@input-focus-border: lighten(@hover-text-color, 8%);
@input-focus-shadow: @focused-shadow;

@input-placeholder-text: rgba( @input-text, .5 );
@input-placeholder-opacity: 1;

@input-invalid-border: @error;
@input-invalid-shadow: null;


// List

@kendo-list-bg: @component-bg;
@kendo-list-text: @component-text;
@kendo-list-border: @component-text;

@kendo-list-item-bg: null;
@kendo-list-item-text: null;

@kendo-list-item-hover-bg: @hover-bg;
@kendo-list-item-hover-text: @hover-text;

@kendo-list-item-selected-bg: @selected-bg;
@kendo-list-item-selected-text: @selected-text;

@kendo-list-item-focus-bg: null;
@kendo-list-item-focus-text: null;
@kendo-list-item-focus-shadow: none;


// Slider

@kendo-slider-track-bg: @component-border;
@kendo-slider-track-border: null;
@kendo-slider-selection-bg: @primary;

@kendo-slider-thumb-bg: @primary;
@kendo-slider-thumb-border: @primary;

@kendo-slider-thumb-hover-bg: shade( @primary, 8% );
@kendo-slider-thumb-hover-border: shade( @primary, 8% );

@kendo-slider-thumb-active-bg: shade( @primary, 12% );
@kendo-slider-thumb-active-border: shade( @primary, 12% );

@kendo-slider-thumb-focus-shadow: @focus-shadow;


// Generic
@sprite-image: url('@{image-folder}/sprite.png');
@inversed-text-color: contrast(@accent);
@accent-hover-background: multiply(@accent, #e5e5e5);
@link-text-color: #00acc1;
@popups-shadow: 0 0px 6px 1px rgba(0, 0, 0, 0.2);
@tabs-normal-bg: #081421;
@tabs-normal-gradient: "#303553 0%, #072138 100%";
@tabs-hover-bg: #081421;
@tabs-hover-gradient: "#202333 0%, #081421 100%";
@secondary-border-color: darken(@base, 12%);
@secondary-widget-background-color: darken(@widget-background-color, 2%);
@disabled-text-color: darken(@base, 23%);
@disabled-border-color: darken(@base, 6%);
@disabled-background-color: @widget-background-color;
@disabled-gradient: none;
@header-background-color: @accent;
@header-text-color: contrast(@accent);
@inputs-border-radius: 3px;
@input-validation-error: darken(@error, 25%);
@column-highlight-background-color: darken(@background, 4%);
@scheduler-nonwork-background-color: darken(@background, 2%);
@cell-border-color: transparent;
@focused-shadow: none;
@default-icon-opacity: 1;
@hover-background-color: @hover-background;
@hover-border-color: @hover-background;
@scheduler-background-color: @background;


// Notification
@notification-border-radius: @border-radius;

@notification-info-bg: @info;
@notification-info-text: contrast(@info);
@notification-info-border: @info;

@notification-success-bg: @success;
@notification-success-text: contrast(@success);
@notification-success-border: @success;

@notification-warning-bg: @warning;
@notification-warning-text: contrast(@warning);
@notification-warning-border: @warning;

@notification-error-bg: @error;
@notification-error-text: contrast(@error);
@notification-error-border: @error;

@notification-gradient: null;


// Link
@link-text: @link-text-color;
@link-hovered-text: contrast(@base, darken(@link-text, 4), lighten(@link-text, 4), .5);


// Toolbar
@toolbar-bg: @widget-background-color;
@toolbar-text: @normal-text-color;
@toolbar-border: @widget-border-color;
@toolbar-gradient: @widget-gradient;
@toolbar-shadow: null;


// Menu
@menu-bg: @base;
@menu-text: @component-text;
@menu-border: @base;
@menu-gradient: null;

@menu-item-bg: null;
@menu-item-text:  @link-text-color;
@menu-item-border: null;
@menu-item-gradient: null;

@menu-item-hover-bg:  @accent-hover-background;
@menu-item-hover-text:  @normal-text-color;
@menu-item-hover-border: @hover-border-color;
@menu-item-hover-gradient: null;

@menu-item-expanded-bg: null;
@menu-item-expanded-text: @component-text;
@menu-item-expanded-border: null;
@menu-item-expanded-gradient: null;

@menu-item-focus-shadow: @focused-shadow;

@menu-scroll-button-bg: @component-bg;
@menu-scroll-button-text: @component-text;
@menu-scroll-button-border: @component-border;
@menu-scroll-button-gradient: null;

@menu-scroll-button-hover-bg: null;
@menu-scroll-button-hover-text: @link-hovered-text;
@menu-scroll-button-hover-border: null;
@menu-scroll-button-hover-gradient: null;

// Menu Popup
@menu-popup-bg: @component-bg;
@menu-popup-text: @header-background-color;
@menu-popup-border: @component-border;
@menu-popup-gradient: null;

@menu-popup-item-bg: null;
@menu-popup-item-text: @normal-text-color;
@menu-popup-item-border: null;
@menu-popup-item-gradient: null;

@menu-popup-item-hover-bg: @kendo-list-item-hover-bg;
@menu-popup-item-hover-text: @kendo-list-item-hover-text;
@menu-popup-item-hover-border: null;
@menu-popup-item-hover-gradient: null;

@menu-popup-item-expanded-bg: @selected-background-color;
@menu-popup-item-expanded-text: @selected-text-color;
@menu-popup-item-expanded-border: null;
@menu-popup-item-expanded-gradient: null;

@menu-popup-item-focus-shadow: @menu-item-focus-shadow;

// Treeview

/// Background color of the treeview component.
/// @group treeview
@kendo-treeview-bg: null;
/// Text color of the treeview component.
/// @group treeview
@kendo-treeview-text: @component-text;
/// Border color of the treeview component.
/// @group treeview
@kendo-treeview-border: null;

/// Background color of hovered treeview items.
/// @group treeview
@kendo-treeview-item-hover-bg: @hover-bg;
/// Text color of hovered treeview items.
/// @group treeview
@kendo-treeview-item-hover-text: @hover-text;
/// Border color of hovered treeview items.
/// @group treeview
@kendo-treeview-item-hover-border: null;
/// Background gradient of hovered treeview items.
/// @group treeview
@kendo-treeview-item-hover-gradient: null;

/// Background color of selected treeview items.
/// @group treeview
@kendo-treeview-item-selected-bg: @selected-bg;
/// Text color of selected treeview items.
/// @group treeview
@kendo-treeview-item-selected-text: @selected-text;
/// Border color of selected treeview items.
/// @group treeview
@kendo-treeview-item-selected-border: null;
/// Background gradient of selected treeview items.
/// @group treeview
@kendo-treeview-item-selected-gradient: null;

/// Border color of focused treeview items.
/// @group treeview
@kendo-treeview-item-focus-border: @input-focus-border;
/// Box shadow of focused treeview items.
/// @group treeview
@kendo-treeview-item-focus-shadow: inset 0 0 0 1px darken(@widget-border-color, 35%);

/// Background color of treeview icons.
/// @group treeview
@kendo-treeview-icon-bg: transparent;


// Avatar
@avatar-bg: @accent;
@avatar-text: contrast( @avatar-bg );


// Cards
@card-bg: @component-bg;
@card-text: @component-text;
@card-border: @component-border;

@card-focus-bg: null;
@card-focus-text: null;
@card-focus-border: null;
@card-focus-shadow: 0 3px 4px 0 rgba(black, .06);

@card-header-bg: @header-background-color;
@card-header-text: contrast(@card-header-bg);
@card-header-border: @card-border;

@card-footer-bg: @header-background-color;
@card-footer-text: @header-text-color;
@card-footer-border: @card-border;

@card-primary: @accent;
@card-primary-bg: mix( white, @card-primary, 70%);
@card-primary-text: mix(black, @card-primary);
@card-primary-border: mix(white, @card-primary);

@card-error: darken(@error, 30%);
@card-error-bg: mix( white, @card-error, 70%);
@card-error-text: mix(black, @card-error);
@card-error-border: mix(white, @card-error);

@card-warning: darken(@warning, 30%);
@card-warning-bg: mix( white, @card-warning, 70%);
@card-warning-text: mix(black, @card-warning);
@card-warning-border: mix(white, @card-warning);

@card-success: darken(@success, 30%);
@card-success-bg: mix( white, @card-success, 70%);
@card-success-text: mix(black, @card-success);
@card-success-border: mix(white, @card-success);

@card-info: darken(@info, 30%);
@card-info-bg: mix( white, @card-info, 70%);
@card-info-text: mix(black, @card-info);
@card-info-border: mix(white, @card-info);

@card-focus-callout-box-shadow-n: 1px -1px 4px 0 rgba(black, .06);
@card-focus-callout-box-shadow-e: 2px -1px 4px 0 rgba(black, .06);
@card-focus-callout-box-shadow-s: 2px -2px 4px 0 rgba(black, .06);
@card-focus-callout-box-shadow-w: 2px -1px 4px 0 rgba(black, .06);


//TileLayout
@tilelayout-bg: darken(@background, 4%);

@tilelayout-hint-bg: rgba(255, 255, 255, .2);
@tilelayout-hint-border: @component-border;
@tilelayout-card-focus-shadow: 0 0 4px 2px rgba(contrast(@tilelayout-bg), 0.3);


// Chat
@chat-bg: @component-bg;
@chat-text: @component-text;
@chat-border: @component-border;

@chat-bubble-bg: @button-background-color;
@chat-bubble-text: @button-text-color;
@chat-bubble-border: @chat-bubble-bg;

@chat-alt-bubble-bg: @accent;
@chat-alt-bubble-text: contrast(@accent);
@chat-alt-bubble-border: @chat-alt-bubble-bg;

@chat-quick-reply-color: @accent;


// Grid
@grid-bg: @component-bg;
@grid-text: @component-text;
@grid-border: @component-border;

@grid-header-bg: @secondary-widget-background-color;
@grid-header-text: lighten(@hover-text-color, 8%);
@grid-header-border: @grid-border;
@grid-header-gradient: null;

@grid-alt-bg: @grid-bg;
@grid-alt-text: @grid-text;
@grid-alt-border: @grid-border;

@grid-hover-bg: @hover-background;
@grid-hover-text: @grid-text;
@grid-hover-border: @grid-border;
@grid-hover-gradient: null;

@grid-selected-bg: lighten(@info, 22%);
@grid-selected-text: @grid-text;
@grid-selected-border: @grid-border;
@grid-selected-gradient: null;

@grid-sticky-border: darken(@grid-border, 30%);

@grid-selected-hover-bg: lighten(@info, 17%);

// Calendar
@calendar-bg: @component-bg;
@calendar-text: @component-text;
@calendar-border: @component-border;

@calendar-header-bg: @header-background-color;
@calendar-header-text: @header-text-color;
@calendar-header-border: @calendar-border;
@calendar-header-gradient: none;

@calendar-header-cell-bg: @calendar-bg;
@calendar-header-cell-text: #9ca3a6;
@calendar-header-cell-border: @calendar-border;

@calendar-week-cell-bg: contrast(@calendar-bg, lighten(@calendar-bg, 4), darken(@calendar-bg, 4), .5);
@calendar-week-cell-text: @calendar-header-cell-text;
@calendar-week-cell-border: @calendar-header-cell-border;

@calendar-weekend-cell-bg: transparent;
@calendar-weekend-cell-text: null;
@calendar-weekend-cell-border: null;

@calendar-othermonth-cell-bg: null;
@calendar-othermonth-cell-text: @disabled-text-color;
@calendar-othermonth-cell-border: null;

@calendar-cell-hovered-bg: @button-hover-background-color;
@calendar-cell-hovered-text: @button-hover-text-color;
@calendar-cell-hovered-border: @button-hover-border-color;

@calendar-cell-selected-bg: lighten(@info, 22%);
@calendar-cell-selected-text: @link-text;
@calendar-cell-selected-border: lighten(@info, 22%);

@calendar-cell-focused-shadow: inset 0 0 0 1px lighten(@hover-text-color, 8%);


// Timepicker
@time-list-highlight-color: @widget-border-color;
@time-list-focused-bg: rgba(contrast(@background), .04);
@time-list-title-focus: contrast(@background);


// Window
@window-border-radius: @border-radius;
@window-action-border-radius: @border-radius;

@window-bg: @component-bg;
@window-text: @component-text;
@window-border: @component-border;
@window-shadow: 1px 1px 7px 1px rgba(contrast(@window-bg), .12);
@window-focus-shadow: 1px 1px 7px 1px rgba(contrast(@window-bg), .25);

@window-titlebar-bg: @header-background-color;
@window-titlebar-text: @header-text-color;
@window-titlebar-border: @secondary-border-color;
@window-titlebar-gradient: false;


// Dialog


// Tooltip
@tooltip-border-radius: @inputs-border-radius;
@tooltip-shadow: @widget-shadow;

@tooltip-bg: @widget-background-color;
@tooltip-text: @normal-text-color;
@tooltip-border: @widget-border-color;


// ScrollView

@scrollview-bg: @component-bg;
@scrollview-text: @component-text;
@scrollview-border: @component-border;

@scrollview-pagebutton-bg: @button-background-color;
@scrollview-pagebutton-border: @button-border-color;
@scrollview-pagebutton-primary-bg: @primary-background-color;
@scrollview-pagebutton-primary-border: @primary-border-color;
@scrollview-pagebutton-shadow: 0 0 0 2px rgba(0, 0, 0, .13);

@scrollview-navigation-color: white;
@scrollview-navigation-icon-shadow: rgba(0, 0, 0, .3) 0 0 15px;
@scrollview-navigation-bg: rgba(0, 0, 0, 0);
@scrollview-navigation-default-opacity: .7;
@scrollview-navigation-hover-opacity: 1;
@scrollview-navigation-hover-span-bg: transparent;
@scrollview-arrow-tap-highlight-color: transparent;

@scrollview-light-bg: rgba(255, 255, 255, .2);
@scrollview-dark-bg: rgba(0, 0, 0, .2);


// Switch
@switch-container-shadow: null;
@switch-container-hovered-shadow: null;
@switch-container-focused-shadow: null;

@switch-on-bg: @normal-background;
@switch-on-text: @primary-background-color;
@switch-on-border: darken(@base, 12%);
@switch-on-gradient: null;
@switch-on-shadow: null;
@switch-on-focused-shadow: null;

@switch-on-focused-bg: @switch-on-bg;
@switch-on-focused-text: @switch-on-text;
@switch-on-focused-border: @button-border-color;
@switch-on-focused-gradient: @switch-on-gradient;

@switch-on-hovered-bg: @switch-on-bg;
@switch-on-hovered-text: @switch-on-text;
@switch-on-hovered-border: @switch-on-border;
@switch-on-hovered-gradient: null;

@switch-on-handle-bg: @primary-background-color;
@switch-on-handle-text: @switch-on-text;
@switch-on-handle-border: @primary-border-color;
@switch-on-handle-gradient: @primary-gradient;
@switch-on-handle-shadow: null;

@switch-on-handle-focused-bg: @switch-on-handle-bg;
@switch-on-handle-focused-text: @switch-on-handle-text;
@switch-on-handle-focused-border: multiply(@primary-background-color, #e5e5e5);
@switch-on-handle-focused-gradient: @switch-on-handle-gradient;

@switch-on-handle-hovered-bg: @switch-on-handle-focused-border;
@switch-on-handle-hovered-text: @switch-on-text;
@switch-on-handle-hovered-border: @switch-on-handle-focused-border;
@switch-on-handle-hovered-gradient: @primary-hover-gradient;

@switch-off-bg: @switch-on-bg;
@switch-off-text: @normal-text-color;
@switch-off-border: @switch-on-border;
@switch-off-gradient: null;
@switch-off-shadow: null;
@switch-off-focused-shadow: @switch-on-focused-shadow;

@switch-off-focused-bg: @switch-off-bg;
@switch-off-focused-text: @switch-off-text;
@switch-off-focused-border: @button-border-color;
@switch-off-focused-gradient: @switch-off-gradient;

@switch-off-hovered-bg: @switch-off-bg;
@switch-off-hovered-text: @switch-off-text;
@switch-off-hovered-border: @switch-on-hovered-border;
@switch-off-hovered-gradient: null;

@switch-off-handle-bg: @button-background-color;
@switch-off-handle-text: @switch-off-text;
@switch-off-handle-border: @button-border-color;
@switch-off-handle-gradient: @button-gradient;
@switch-off-handle-shadow: null;

@switch-off-handle-focused-bg: @switch-off-handle-bg;
@switch-off-handle-focused-text: @switch-off-handle-text;
@switch-off-handle-focused-border: @button-focused-border-color;
@switch-off-handle-focused-gradient: @switch-off-handle-gradient;

@switch-off-handle-hovered-bg: @button-hover-background-color;
@switch-off-handle-hovered-text: @switch-off-text;
@switch-off-handle-hovered-border: @button-hover-border-color;
@switch-off-handle-hovered-gradient: @button-hover-gradient;


// PDF viewer
@pdf-viewer-bg: null;
@pdf-viewer-text: null;
@pdf-viewer-border: null;

@pdf-viewer-canvas-bg: @chat-bg;
@pdf-viewer-canvas-text: null;
@pdf-viewer-canvas-border: null;

@pdf-viewer-page-bg: white;
@pdf-viewer-page-text: @component-text;
@pdf-viewer-page-border: @component-border;
@pdf-viewer-page-shadow: 0 0 15px @pdf-viewer-page-border;

@pdf-viewer-toolbar-button-bg: @button-text-color;

@pdf-viewer-search-highlight-bg: darken(@background, 70%);


// Adaptive Common
@adaptive-content-bg: darken(@background, 2%);
@adaptive-content-text: @accent;

@adaptive-menu-bg: @accent;
@adaptive-menu-text: @selected-text-color;

@adaptive-menu-clear-text: @accent;

@adaptive-menu-item-border: darken(@background, 12%);

@adaptive-menu-title-text: @normal-text-color;


// Adaptive Grid
@adaptive-grid-sort-text: @accent;

// Adaptive Scheduler
@adaptive-scheduler-current-text: @normal-text-color;
@adaptive-scheduler-base-text: inherit;


// Drawer
@drawer-text:  @widget-text-color;
@drawer-bg: @widget-background-color;
@drawer-border: @widget-border-color;

@drawer-scrollbar-color: rgba(156, 156, 156, 0.7);
@drawer-scrollbar-bg: #dedede;
@drawer-scrollbar-hovered-color: rgba(156, 156, 156, 1);

@drawer-hovered-text: @hover-text-color;
@drawer-hovered-bg: @hover-background;
@drawer-hovered-gradient: @hover-gradient;

@drawer-focused-bg: @drawer-bg;
@drawer-focused-shadow: inset 0 0 0 1px @accent;

@drawer-selected-text: @selected-text-color;
@drawer-selected-bg: @selected-background;
@drawer-selected-hover-bg: contrast(@background, lighten(@selected-background, 5%), darken(@selected-background, 5%), 0.5);
@drawer-selected-hover-text: @selected-text-color;


// Rating
@rating-icon-text: @widget-border-color;
@rating-icon-selected-text: @accent;
@rating-icon-hover-text: @accent;
@rating-icon-focused-text: @accent;

@rating-icon-focused-shadow: 0 2px 3.6px rgba(0, 0, 0, .1);
@rating-icon-focused-selected-shadow: 0 2px 3.6px fade(@accent, 50);


// Spreadsheet
@spreadsheet-insert-image-dialog-preview-overlay: inset 0 0 0 2000px rgba(0,0,0, 0.5);
@spreadsheet-insert-image-dialog-hovered-text: #fff;

@spreadsheet-drawing-handle-bg: @spreadsheet-selection-border;
@spreadsheet-drawing-handle-border-color: #fff;
@spreadsheet-drawing-handle-border-radius: 50%;
@spreadsheet-drawing-handle-outline: @spreadsheet-selection-border;

@spreadsheet-drawing-anchor-bg:  @spreadsheet-selection-background;


// Filter
@filter-preview-field-text: @accent;


// Timeline
@timeline-track-arrow-disabled-text: @disabled-text-color;
@timeline-track-arrow-disabled-bg: @disabled-background-color;
@timeline-track-arrow-disabled-border: @disabled-border-color;

@timeline-track-bg: @button-background-color;
@timeline-track-border-color: @button-border-color;

@timeline-track-item-focus-shadow: 0 3px 4px 0 rgba(@primary, .4);

@timeline-flag-background: @accent;
@timeline-flag-text: contrast(@accent);

@timeline-circle-color: @accent;


// Breadcrumb
@breadcrumb-focused-shadow: @focused-shadow;

@breadcrumb-link-text: @link-text;
@breadcrumb-link-bg: transparent;
@breadcrumb-link-border: transparent;

@breadcrumb-link-hovered-text: @link-hovered-text;
@breadcrumb-link-hovered-bg: rgba(0,0,0, 0.08);
@breadcrumb-link-hovered-border: transparent;

@breadcrumb-link-focused-text: @link-text;
@breadcrumb-link-focused-bg: false;
@breadcrumb-link-focused-border: false;
@breadcrumb-link-focused-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);

@breadcrumb-root-link-text: @button-text-color;
@breadcrumb-root-link-bg: false;
@breadcrumb-root-link-border: false;

@breadcrumb-root-link-hovered-text: false;
@breadcrumb-root-link-hovered-bg: @breadcrumb-link-hovered-bg;
@breadcrumb-root-link-hovered-border: false;

@breadcrumb-root-link-focused-text: false;
@breadcrumb-root-link-focused-bg: false;
@breadcrumb-root-link-focused-border: false;
@breadcrumb-root-link-focused-shadow: @breadcrumb-link-focused-shadow;

// Listgroup
@listgroup-border-radius: @border-radius;

@listgroup-bg: @component-bg;
@listgroup-text: @component-text;
@listgroup-border: @component-border;


// Badge
@badge-secondary-bg: darken(@normal-background, 5%);
@badge-secondary-text: @normal-text-color;
@badge-secondary-border: @badge-secondary-bg;

@badge-primary-bg: @primary-background-color;
@badge-primary-text: @primary-text-color;
@badge-primary-border: @badge-primary-bg;

@badge-info-bg: darken(@info, 30%);
@badge-info-text: contrast( @badge-info-bg );
@badge-info-border: @badge-info-bg;

@badge-success-bg: darken(@success, 30%);
@badge-success-text: contrast( @badge-success-bg );
@badge-success-border: @badge-success-bg;

@badge-warning-bg: darken(@warning, 30%);
@badge-warning-text: contrast( @badge-warning-bg );
@badge-warning-border: @badge-warning-bg;

@badge-error-bg: darken(@error, 30%);
@badge-error-text: contrast( @badge-error-bg );
@badge-error-border: @badge-error-bg;

//Checkboxes
@checkbox-icon-size: 12px;
// @checkbox-size: @icon-size;
@checkbox-radius: @border-radius;
@checkbox-border-width: 1px;
// @checkbox-line-height: (@checkbox-size + @checkbox-border-width);

@checkbox-bg: @input-bg;
@checkbox-text: @input-text;
@checkbox-border: @input-border;
@checkbox-hovered-bg: @checkbox-bg;
@checkbox-hovered-text: @accent;
@checkbox-hovered-border: @input-hover-border;
@checkbox-checked-bg: @accent;
@checkbox-checked-text: @checkbox-bg;
@checkbox-checked-border: @accent;
@checkbox-indeterminate-bg: @checkbox-bg;
@checkbox-indeterminate-text: @checkbox-checked-bg;
@checkbox-indeterminate-border: @checkbox-border;
@checkbox-focused-border: @checkbox-hovered-border;
@checkbox-focused-shadow: 0 0 0 2px rgba(0, 0, 0, .06);
@checkbox-focused-checked-border: @checkbox-checked-border;
@checkbox-focused-checked-shadow: 0 0 0 2px rgba(@accent, .3);
@checkbox-disabled-bg: null;
@checkbox-disabled-text: null;
@checkbox-disabled-border: null;
@checkbox-disabled-checked-bg: null;
@checkbox-disabled-checked-text: null;
@checkbox-disabled-checked-border: null;
@checkbox-invalid-bg: null;
@checkbox-invalid-text: null;
@checkbox-invalid-border: @checkbox-border;


//Radio Buttons
@radio-icon-size: 12px;
// @radio-size: @icon-size;
@radio-radius: 50%;
@radio-border-width: 1px;
// @radio-line-height: calc(@radio-size + @radio-border-width);

@radio-bg: @checkbox-bg;
@radio-text: @checkbox-text;
@radio-border: @checkbox-border;
@radio-hovered-bg: @checkbox-hovered-bg;
@radio-hovered-text: @checkbox-hovered-text;
@radio-hovered-border: @checkbox-hovered-border;
@radio-checked-bg: @checkbox-checked-bg;
@radio-checked-text: @checkbox-checked-text;
@radio-checked-border: @checkbox-checked-border;
@radio-indeterminate-bg: @radio-checked-bg;
@radio-indeterminate-text: @radio-checked-text;
@radio-indeterminate-border: @radio-checked-border;
@radio-focused-border: @checkbox-hovered-border;
@radio-focused-shadow: @checkbox-focused-shadow;
@radio-focused-checked-border: @checkbox-checked-border;
@radio-focused-checked-shadow: @checkbox-focused-checked-shadow;
@radio-disabled-bg: null;
@radio-disabled-text: null;
@radio-disabled-border: null;
@radio-disabled-checked-bg: null;
@radio-disabled-checked-text: null;
@radio-disabled-checked-border: null;


// FileManager
@filemanager-bg: false;
@filemanager-text: false;
@filemanager-border: false;

@filemanager-toolbar-bg: false;
@filemanager-toolbar-text: false;
@filemanager-toolbar-border: @widget-border-color;

@filemanager-navigation-bg: false;
@filemanager-navigation-text: false;
@filemanager-navigation-border: @widget-border-color;

@filemanager-breadcrumb-bg: @base;
@filemanager-breadcrumb-text: false;
@filemanager-breadcrumb-border: @widget-border-color;

@filemanager-listview-bg: false;
@filemanager-listview-text: false;
@filemanager-listview-border: false;

@filemanager-listview-item-bg: false;
@filemanager-listview-item-text: false;
@filemanager-listview-item-border: false;

@filemanager-listview-item-icon-bg: false;
@filemanager-listview-item-icon-text: mix(@normal-text-color, @base, 41.5%);
@filemanager-listview-item-icon-border: false;
@filemanager-listview-item-icon-selected-bg: false;
@filemanager-listview-item-icon-selected-text: @widget-text-color;
@filemanager-listview-item-icon-selected-border: false;

@filemanager-grid-bg: false;
@filemanager-grid-text: false;
@filemanager-grid-border: false;

@filemanager-preview-bg: false;
@filemanager-preview-text: false;
@filemanager-preview-border: @widget-border-color;

@filemanager-preview-icon-bg: false;
@filemanager-preview-icon-text: mix(@normal-text-color, @base, 41.5%);
@filemanager-preview-icon-border: false;

@filemanager-drag-hint-bg: @accent;
@filemanager-drag-hint-text: contrast(@filemanager-drag-hint-bg);
@filemanager-drag-hint-border: false;

@filemanager-drag-hint-icon-bg: false;
@filemanager-drag-hint-icon-text: contrast(@filemanager-drag-hint-bg);
@filemanager-drag-hint-icon-border: false;

@filemanager-view-dropzone-hovered-text: inherit;
@filemanager-view-dropzone-hovered-bg: inherit;
@filemanager-view-dropzone-hovered-border: false;


// Stepper
@stepper-bg: false;
@stepper-text: false;
@stepper-border: false;

@stepper-indicator-bg: @component-bg;
@stepper-indicator-text: @component-text;
@stepper-indicator-border: @component-border;

@stepper-indicator-hover-bg: darken( @stepper-indicator-bg, 10% );
@stepper-indicator-hover-text: false;
@stepper-indicator-hover-border: false;

@stepper-indicator-disabled-bg: @stepper-indicator-bg;
@stepper-indicator-disabled-text: mix(@stepper-indicator-text, #ffffff, 60%);
@stepper-indicator-disabled-border: @stepper-indicator-border;

@stepper-indicator-done-bg: @accent;
@stepper-indicator-done-text: contrast( @stepper-indicator-done-bg );
@stepper-indicator-done-border: @stepper-indicator-done-bg;

@stepper-indicator-done-hover-bg: darken( @stepper-indicator-done-bg, 10% );
@stepper-indicator-done-hover-text: false;
@stepper-indicator-done-hover-border: false;

@stepper-indicator-done-disabled-bg: mix( @stepper-indicator-done-bg, @component-bg, 60%);
@stepper-indicator-done-disabled-text: contrast( @stepper-indicator-done-bg );
@stepper-indicator-done-disabled-border: @stepper-indicator-done-disabled-bg;

@stepper-indicator-current-bg: @stepper-indicator-done-bg;
@stepper-indicator-current-text: @stepper-indicator-done-text;
@stepper-indicator-current-border: @stepper-indicator-done-border;

@stepper-indicator-current-hover-bg: @stepper-indicator-done-hover-bg;
@stepper-indicator-current-hover-text: @stepper-indicator-done-hover-text;
@stepper-indicator-current-hover-border: @stepper-indicator-done-hover-border;

@stepper-indicator-current-disabled-bg: @stepper-indicator-done-disabled-bg;
@stepper-indicator-current-disabled-text: @stepper-indicator-done-disabled-text;
@stepper-indicator-current-disabled-border: @stepper-indicator-done-disabled-border;

@stepper-label-text: @component-text;
@stepper-label-success-text: darken(@success, 30%);
@stepper-label-error-text: darken(@error, 30%);
@stepper-label-disabled-text: mix(@component-text, #ffffff, 60%);


// Wizard
@wizard-focused-shadow: inset 0 0 0 2px @widget-border-color;
@wizard-step-border-focused: #656565;


// Appbar
@appbar-box-shadow: 0px 1px 1px rgba(0, 0, 0, .16);
@appbar-bottom-box-shadow:  0px -1px 1px rgba(0, 0, 0, .16);


//Gantt
@event-text-color: @inversed-text-color;
@gantt-task-selected-bg: lighten(@info, 4%);
@gantt-task-completed-selected-bg: darken(@info, 21%);
@gantt-summary-completed-selected-bg: lighten(@info, 22%);

@gantt-delayed-advanced-text: #FFFFFF;

@gantt-planned-bg: @primary;
@gantt-planned-border: @gantt-planned-bg;
@gantt-planned-tooltip-text: #FFFFFF;

@gantt-delayed-bg: @error;
@gantt-delayed-bg-lighter: tint(@gantt-delayed-bg, 20);
@gantt-delayed-tooltip-text: #FFFFFF;

@gantt-advanced-bg: @success;
@gantt-advanced-bg-lighter: tint(@gantt-advanced-bg, 20);

@gantt-task-offset-border: @gantt-delayed-bg;
@gantt-task-offset-text: #000000;


// ImageEditor
@imageeditor-bg: @component-bg;
@imageeditor-text: @component-text;
@imageeditor-border: @component-border;

@imageeditor-content-bg: darken(@component-bg, 22.5%);
@imageeditor-content-text: false;
@imageeditor-content-border: false;

@imageeditor-action-pane-text: false;
@imageeditor-action-pane-bg: @component-bg;
@imageeditor-action-pane-border: @component-border;

@imageeditor-crop-text: false;
@imageeditor-crop-bg: false;
@imageeditor-crop-border: white;

@imageeditor-resize-handle-text: false;
@imageeditor-resize-handle-bg: false;
@imageeditor-resize-handle-border: white;

@imageeditor-crop-overlay-bg: rgba(black, 0.3);


// Expansion panel
@expander-bg: @component-bg;
@expander-text: @component-text;
@expander-border: @component-border;

@expander-header-bg: @expander-bg;
@expander-header-text: @expander-text;
@expander-header-border: @expander-text;

@expander-title-text: @primary;

@expander-header-sub-title-opacity: .65;

@expander-header-hover-bg: null;
@expander-header-focused-bg: null;
@expander-header-focused-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13);


// FloatingActionButton
@fab-shadow: 0 4px 5px rgba(0, 0, 0, .14), 0 1px 10px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .2);
@fab-focus-shadow: 0 1px 10px rgba(#000000, .22), 0 4px 5px rgba(#000000, .24), 0 2px 4px rgba(#000000, .2);
@fab-disabled-shadow:  0 4px 5px rgba(0, 0, 0, .06), 0 1px 10px rgba(0, 0, 0, .06), 0 2px 4px rgba(0, 0, 0, .08);

@fab-item-text: @component-text;
@fab-item-bg: @component-bg;
@fab-item-border: @component-border;

@fab-item-icon-text: contrast( #ebebeb );
@fab-item-icon-bg: #ebebeb;
@fab-item-icon-border: #ebebeb;

@fab-item-shadow: @fab-shadow;
@fab-item-focus-shadow: @fab-focus-shadow;
@fab-item-disabled-shadow: @fab-disabled-shadow;


// ActionSheet
@actionsheet-padding-x: null;
@actionsheet-padding-y: null;
@actionsheet-bg: @component-bg;
@actionsheet-text: @component-text;
@actionsheet-border: @component-border;
@actionsheet-shadow: 0 8px 10px -5px rgba(0, 0, 0, .2), 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12);

@actionsheet-border-width: 0px;
@actionsheet-border-radius: 0px;

// Action sheet header
@actionsheet-header-bg: null;
@actionsheet-header-text: null;
@actionsheet-header-border: null;
@actionsheet-header-gradient: null;
@actionsheet-header-shadow: null;

// Action sheet item
@actionsheet-item-hover-bg: @hover-background;
@actionsheet-item-hover-text: null;
@actionsheet-item-hover-border: null;
@actionsheet-item-hover-gradient: null;
@actionsheet-item-hover-shadow: null;

@actionsheet-item-focus-bg: null;
@actionsheet-item-focus-text: null;
@actionsheet-item-focus-border: null;
@actionsheet-item-focus-gradient: null;
@actionsheet-item-focus-shadow: @focused-shadow;

@actionsheet-item-disabled-bg: null;
@actionsheet-item-disabled-text: null;
@actionsheet-item-disabled-border: null;
@actionsheet-item-disabled-gradient: null;
@actionsheet-item-disabled-shadow: null;


// BottomNavigation
@bottom-nav-flat-bg: @background;
@bottom-nav-flat-text: @component-text;
@bottom-nav-flat-border: @component-border;

// TabStrip
@tabstrip-content-border-focused: #656565;


// TaskBoard
@taskboard-bg: null;
@taskboard-text: null;
@taskboard-border: null;

@taskboard-toolbar-bg: null;
@taskboard-toolbar-text: null;
@taskboard-toolbar-border: null;

@taskboard-column-bg: @secondary-widget-background-color;
@taskboard-column-text: null;
@taskboard-column-border: transparent;

@taskboard-column-focus-bg: null;
@taskboard-column-focus-text: null;
@taskboard-column-focus-border: shade( @component-border, 20% );

@taskboard-column-header-text: @component-text;

@taskboard-pane-bg: @component-bg;
@taskboard-pane-text: @component-text;
@taskboard-pane-border: @component-border;

@taskboard-card-bg: @card-bg;
@taskboard-card-text: @card-text;
@taskboard-card-border: @card-border;

@taskboard-card-header-bg: @taskboard-card-bg;
@taskboard-card-header-text: @taskboard-card-text;
@taskboard-card-header-border: null;

@taskboard-card-title-text: @primary;
@taskboard-card-title-focus-text: darken( @primary, 13% );
@taskboard-card-title-hover-text: lighten( @primary, 13% );

@taskboard-card-footer-bg: @taskboard-card-bg;
@taskboard-card-footer-text: null;
@taskboard-card-footer-border: null;

@taskboard-card-focus-border: shade( @taskboard-card-border, 18% );
@taskboard-card-hover-border: shade( @taskboard-card-border, 10% );

@taskboard-card-selected-text: @taskboard-card-text;
@taskboard-card-selected-bg: @taskboard-card-bg;
@taskboard-card-selected-border: lighten( @primary, 13% );

@taskboard-drag-placeholder-bg: rgba(255, 255, 255, .2);
@taskboard-drag-placeholder-border: @component-border;


// Scheduler
@scheduler-yearview-calendar-bg: @scheduler-background-color;

@scheduler-yearview-month-header-text: @component-text;

@scheduler-yearview-indicator-bg: @primary;
@scheduler-yearview-indicator-selected-bg: contrast(@primary);

@scheduler-tooltip-bg: null;
@scheduler-tooltip-day-text: @link-text-color;


// Captcha
@captcha-bg: @component-bg;
@captcha-text: @component-text;
@captcha-border: @component-border;


// Popover
@popover-bg: @component-bg;
@popover-text: @component-text;
@popover-border: @component-border;
@popover-shadow: @window-shadow;

@popover-header-bg: @popover-bg;
@popover-header-text: @popover-text;
@popover-header-border: @popover-border;

@popover-callout-bg: @popover-bg;
@popover-callout-border: @popover-border;

@popover-callout-shadow-n: @card-focus-callout-box-shadow-n;
@popover-callout-shadow-e: @card-focus-callout-box-shadow-e;
@popover-callout-shadow-s: @card-focus-callout-box-shadow-s;
@popover-callout-shadow-w: @card-focus-callout-box-shadow-w;


// Orgchart
@orgchart-bg: @component-bg;
@orgchart-text: @component-text;
@orgchart-border: @component-border;

@orgchart-node-group-bg: @secondary-widget-background-color;
@orgchart-node-group-text: @component-text;
@orgchart-node-group-border: @component-border;

@orgchart-node-group-focus-border: @card-focus-border;
@orgchart-node-group-focus-shadow: @card-focus-shadow;

@orgchart-card-focus-shadow: @card-focus-shadow;

@orgchart-line-fill: @component-border;


// PivotGrid
@pivotgrid-bg: @component-bg;
@pivotgrid-text: @component-text;
@pivotgrid-border: @component-border;

@pivotgrid-alt-border: shade(@pivotgrid-border, 20%);

@pivotgrid-headers-bg: @background;
@pivotgrid-headers-text: @pivotgrid-text;
@pivotgrid-headers-border: @component-border;

@pivotgrid-total-bg: shade( @pivotgrid-bg, 10% );
@pivotgrid-total-text: @header-text-color;
@pivotgrid-total-border: @component-border;

@pivotgrid-hover-bg: darken(@pivotgrid-bg, 7%);
@pivotgrid-hover-text: null;
@pivotgrid-hover-border: null;

@pivotgrid-selected-bg: rgba(@selected-background-color, .25);
@pivotgrid-selected-text: null;
@pivotgrid-selected-border: null;

@pivotgrid-focus-shadow: inset 0 0 0 1px @accent;

// PivotGrid Configurator
@pivotgrid-configurator-bg: @component-bg;
@pivotgrid-configurator-text: @component-text;
@pivotgrid-configurator-border: @component-border;

@pivotgrid-configurator-header-bg: null;
@pivotgrid-configurator-header-text: @header-text-color;
@pivotgrid-configurator-header-border: null;

@pivotgrid-configurator-end-shadow: -3px 0px 6px rgba(0, 0, 0, .16);
@pivotgrid-configurator-start-shadow: 3px 0px 6px rgba(0, 0, 0, .16);
@pivotgrid-configurator-top-shadow: 0px -3px 6px rgba(0, 0, 0, .16);
@pivotgrid-configurator-bottom-shadow: 0px 3px 6px rgba(0, 0, 0, .16);

// PivotGrid Calculated Field
@pivotgrid-calculated-field-bg: @component-bg;
@pivotgrid-calculated-field-text: @component-text;
@pivotgrid-calculated-field-border: @component-border;

@pivotgrid-calculated-field-header-bg: null;
@pivotgrid-calculated-field-header-text: @header-text-color;
@pivotgrid-calculated-field-header-border: null;


// Chip
@chip-base-bg: @button-text-color;

@chip-solid-bg: rgba( @chip-base-bg, .08 );
@chip-solid-text: @chip-base-bg;
@chip-solid-border: rgba( @chip-base-bg, .3 );

@chip-solid-hover-bg: rgba( @chip-base-bg, .16 );
@chip-solid-hover-text: null;
@chip-solid-hover-border: null;

@chip-solid-focus-bg: @chip-solid-bg;
@chip-solid-focus-shadow: 0 0 0 2px rgba( @chip-base-bg, .16 );

@chip-solid-selected-bg: rgba( @chip-base-bg, .24 );
@chip-solid-selected-text: null;
@chip-solid-selected-border: null;

@chip-solid-success-bg: rgba( @success, .08 );
@chip-solid-success-text: @success;
@chip-solid-success-border: rgba( @success, .3 );

@chip-solid-success-hover-bg: rgba( @success, .16 );
@chip-solid-success-hover-text: null;
@chip-solid-success-hover-border: null;

@chip-solid-success-focus-bg: null;
@chip-solid-success-focus-text: null;
@chip-solid-success-focus-border: null;

@chip-solid-success-selected-bg: rgba( @success, .24 );
@chip-solid-success-selected-text: null;
@chip-solid-success-selected-border: null;

@chip-solid-warning-bg: rgba( @warning, .08 );
@chip-solid-warning-text: @warning;
@chip-solid-warning-border: rgba( @warning, .3 );

@chip-solid-warning-hover-bg: rgba( @warning, .16 );
@chip-solid-warning-hover-text: null;
@chip-solid-warning-hover-border: null;

@chip-solid-warning-focus-bg: null;
@chip-solid-warning-focus-text: null;
@chip-solid-warning-focus-border: null;

@chip-solid-warning-selected-bg: rgba( @warning, .24 );
@chip-solid-warning-selected-text: null;
@chip-solid-warning-selected-border: null;

@chip-solid-error-bg: rgba( @error, .08 );
@chip-solid-error-text: @error;
@chip-solid-error-border: rgba( @error, .3 );

@chip-solid-error-hover-bg: rgba( @error, .16 );
@chip-solid-error-hover-text: null;
@chip-solid-error-hover-border: null;

@chip-solid-error-focus-bg: null;
@chip-solid-error-focus-text: null;
@chip-solid-error-focus-border: null;

@chip-solid-error-selected-bg: rgba( @error, .24 );
@chip-solid-error-selected-text: null;
@chip-solid-error-selected-border: null;

@chip-solid-info-bg: rgba( @info, .08 );
@chip-solid-info-text: @info;
@chip-solid-info-border: rgba( @info, .3 );

@chip-solid-info-hover-bg: rgba( @info, .16 );
@chip-solid-info-hover-text: null;
@chip-solid-info-hover-border: null;

@chip-solid-info-focus-bg: null;
@chip-solid-info-focus-text: null;
@chip-solid-info-focus-border: null;

@chip-solid-info-selected-bg: rgba( @info, .24 );
@chip-solid-info-selected-text: null;
@chip-solid-info-selected-border: null;

@chip-outline-bg: @component-bg;
@chip-outline-text: @chip-base-bg;
@chip-outline-border: @chip-base-bg;

@chip-outline-hover-bg: @chip-base-bg;
@chip-outline-hover-text: contrast( @chip-outline-hover-bg );
@chip-outline-hover-border: null;

@chip-outline-focus-bg: null;
@chip-outline-focus-text: null;
@chip-outline-focus-border: null;
@chip-outline-focus-shadow: 0 0 0 2px rgba( @chip-base-bg, .08 );

@chip-outline-selected-bg: @chip-outline-hover-bg;
@chip-outline-selected-text: @chip-outline-hover-text;

@chip-outline-success-bg: null;
@chip-outline-success-text: @success;
@chip-outline-success-border: @success;

@chip-outline-success-hover-bg: @success;
@chip-outline-success-hover-text: contrast( @chip-outline-success-hover-bg );
@chip-outline-success-hover-border: null;

@chip-outline-success-focus-bg: nul;
@chip-outline-success-focus-text: null;
@chip-outline-success-focus-border: null;

@chip-outline-success-selected-bg: @chip-outline-success-hover-bg;
@chip-outline-success-selected-text: @chip-outline-success-hover-text;
@chip-outline-success-selected-border: null;

@chip-outline-warning-bg: null;
@chip-outline-warning-text: @warning;
@chip-outline-warning-border: @warning;

@chip-outline-warning-hover-bg: @warning;
@chip-outline-warning-hover-text: contrast( @chip-outline-warning-hover-bg );
@chip-outline-warning-hover-border: null;

@chip-outline-warning-focus-bg: nul;
@chip-outline-warning-focus-text: null;
@chip-outline-warning-focus-border: null;

@chip-outline-warning-selected-bg: @chip-outline-warning-hover-bg;
@chip-outline-warning-selected-text: @chip-outline-warning-hover-text;
@chip-outline-warning-selected-border: null;

@chip-outline-error-bg: null;
@chip-outline-error-text: @error;
@chip-outline-error-border: @error;

@chip-outline-error-hover-bg: @error;
@chip-outline-error-hover-text: contrast( @chip-outline-error-hover-bg );
@chip-outline-error-hover-border: null;

@chip-outline-error-focus-bg: nul;
@chip-outline-error-focus-text: null;
@chip-outline-error-focus-border: null;

@chip-outline-error-selected-bg: @chip-outline-error-hover-bg;
@chip-outline-error-selected-text: @chip-outline-error-hover-text;
@chip-outline-error-selected-border: null;

@chip-outline-info-bg: null;
@chip-outline-info-text: @info;
@chip-outline-info-border: @info;

@chip-outline-info-hover-bg: @info;
@chip-outline-info-hover-text: contrast( @chip-outline-info-hover-bg );
@chip-outline-info-hover-border: null;

@chip-outline-info-focus-bg: nul;
@chip-outline-info-focus-text: null;
@chip-outline-info-focus-border: null;

@chip-outline-info-selected-bg: @chip-outline-info-hover-bg;
@chip-outline-info-selected-text: @chip-outline-info-hover-text;
@chip-outline-info-selected-border: null;

@chip-multiple-selected-icon-bg: rgba( black, .44 );
@chip-multiple-selected-icon-text: #ffffff;

@chip-primary-focus-shadow: 0 0 0 2px rgba( @primary, .16 );
@chip-secondary-focus-shadow: 0 0 0 2px rgba( @secondary, .16 );
@chip-info-focus-shadow: 0 0 0 2px rgba( @info, .16 );
@chip-success-focus-shadow: 0 0 0 2px rgba( @success, .16 );
@chip-warning-focus-shadow: 0 0 0 2px rgba( @warning, .16 );
@chip-error-focus-shadow: 0 0 0 2px rgba( @error, .16 );


// Panelbar
@panelbar-bg: @component-bg;
@panelbar-text: @component-text;
@panelbar-border: @component-border;

@panelbar-header-bg: @panelbar-bg;
@panelbar-header-text: @panelbar-text;
@panelbar-header-border: null;
@panelbar-header-gradient: null;

@panelbar-header-hovered-bg: shade( @panelbar-header-bg, 5% );
@panelbar-header-hovered-text: null;
@panelbar-header-hovered-border: null;
@panelbar-header-hovered-gradient: null;

@panelbar-header-focused-bg: null;
@panelbar-header-focused-text: null;
@panelbar-header-focused-border: null;
@panelbar-header-focused-gradient: null;
@panelbar-header-focused-shadow: inset 0 0 0 1px @accent;

@panelbar-header-hovered-focused-bg: null;
@panelbar-header-hovered-focused-text: null;
@panelbar-header-hovered-focused-border: null;
@panelbar-header-hovered-focused-gradient: null;

@panelbar-header-selected-bg: @panelbar-header-bg;
@panelbar-header-selected-text: @accent;
@panelbar-header-selected-border: null;
@panelbar-header-selected-gradient: null;

@panelbar-header-selected-hovered-bg: shade( @panelbar-header-selected-bg, 10% );
@panelbar-header-selected-hovered-text: null;
@panelbar-header-selected-hovered-border: null;
@panelbar-header-selected-hovered-gradient: null;

@panelbar-header-selected-focused-bg: null;
@panelbar-header-selected-focused-text: null;
@panelbar-header-selected-focused-border: null;
@panelbar-header-selected-focused-gradient: null;

@panelbar-header-selected-hovered-focused-bg: null;
@panelbar-header-selected-hovered-focused-text: null;
@panelbar-header-selected-hovered-focused-border: null;
@panelbar-header-selected-hovered-focused-gradient: null;

@panelbar-item-hovered-bg: shade( @panelbar-bg, 5% );
@panelbar-item-hovered-text: null;
@panelbar-item-hovered-border: null;
@panelbar-item-hovered-gradient: null;

@panelbar-item-focused-bg: null;
@panelbar-item-focused-text: null;
@panelbar-item-focused-border: null;
@panelbar-item-focused-gradient: null;
@panelbar-item-focused-shadow: inset 0 0 0 1px @accent;

@panelbar-item-hovered-focused-bg: null;
@panelbar-item-hovered-focused-text: null;
@panelbar-item-hovered-focused-border: null;
@panelbar-item-hovered-focused-gradient: null;

@panelbar-item-selected-bg: fadeout(@info, 75%);
@panelbar-item-selected-text: @component-text;
@panelbar-item-selected-border: null;
@panelbar-item-selected-gradient: null;

@panelbar-item-selected-hovered-bg: shade( @panelbar-item-selected-bg, 10% );
@panelbar-item-selected-hovered-text: null;
@panelbar-item-selected-hovered-border: null;
@panelbar-item-selected-hovered-gradient: null;

@panelbar-item-selected-focused-bg: null;
@panelbar-item-selected-focused-text: null;
@panelbar-item-selected-focused-border: null;
@panelbar-item-selected-focused-gradient: null;

@panelbar-item-selected-hovered-focused-bg: null;
@panelbar-item-selected-hovered-focused-text: null;
@panelbar-item-selected-hovered-focused-border: null;
@panelbar-item-selected-hovered-focused-gradient: null;


// ColorPalette
@colorpalette-tile-focus-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .5 );
@colorpalette-tile-hover-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .8 );
@colorpalette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, 1 );


// ColorGradient
@gradient-transparent-to-black: rgba( black, 0), black;
@gradient-transparent-to-white: rgba( white, 0), white;
@gradient-black-to-transparent: black, rgba( black, 0);
@gradient-white-to-transparent: white, rgba( white, 0);
@gradient-rainbow: #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000;

@colorgradient-bg: @component-bg;
@colorgradient-text: @component-text;
@colorgradient-border: @component-border;

@colorgradient-focus-border: null;
@colorgradient-focus-shadow: 1px 1px 7px 1px rgba(0, 0, 0, .3);

@colorgradient-draghandle-bg: transparent;
@colorgradient-draghandle-text: null;
@colorgradient-draghandle-border: rgba( white, .8);
@colorgradient-draghandle-shadow: 0 1px 4px rgba(0, 0, 0, .5);
@colorgradient-draghandle-focus-shadow: 0 1px 4px black;
@colorgradient-draghandle-hover-shadow: @colorgradient-draghandle-focus-shadow;

@colorgradient-input-label-text: @disabled-text-color;


// Color Preview
@color-preview-bg: null;
@color-preview-text: null;
@color-preview-border: @component-border;
@color-preview-hover-border: @hover-border-color;

@color-preview-no-color-bg: white;
@color-preview-no-color-text: @error;
@color-preview-no-color-border: null;


// ColorEditor/FlatColorPicker
@coloreditor-bg: @component-bg;
@coloreditor-text: @component-text;
@coloreditor-border: @component-border;

@coloreditor-focus-border: null;
@coloreditor-focus-shadow: 1px 1px 7px 1px rgba(0, 0, 0, .3);


// Kendo skin

@theme-name: ~"nova";

@import "common/mixins.less";
@import "mixins/gradients.less";
@import "mixins/border-radius.less";
@import "themes/type.less";
@import "Default/button/_theme.less";
@import "Default/input/_theme.less";
@import "Default/menu/_theme.less";
@import "Default/dropdowngrid/_theme.less";
@import "Default/daterangepicker/_theme.less";
@import "Default/avatar/_theme.less";
@import "Default/card/_theme.less";
@import "Default/tilelayout/_theme.less";
@import "Default/chat/_theme.less";
@import "Default/calendar/_theme.less";
@import "Default/multiviewcalendar/_theme.less";
@import "Default/pdf-viewer/_theme.less";
@import "Default/scrollview/_theme.less";
@import "Default/switch/_theme.less";
@import "common/adaptive/_theme.less";
@import "Default/filter/_theme.less";
@import "Default/drawer/_theme.less";
@import "Default/rating/_theme.less";
@import "Default/timeline/_theme.less";
@import "Default/breadcrumb/_theme.less";
@import "Default/listgroup/_theme.less";
@import "Default/listbox/_theme.less";
@import "Default/list/_theme.less";
@import "Default/slider/_theme.less";
@import "Default/messagebox/_theme.less";
@import "Default/badge/_theme.less";
@import "Default/checkbox/_theme.less";
@import "Default/radio/_theme.less";
@import "Default/filemanager/_theme.less";
@import "Default/toolbar/_theme.less";
@import "Default/window/_theme.less";
@import "Default/dialog/_theme.less";
@import "Default/stepper/_theme.less";
@import "Default/forms/_theme.less";
@import "Default/tooltip/_theme.less";
@import "Default/treeview/_theme.less";
@import "Default/wizard/_theme.less";
@import "Default/textarea/_theme.less";
@import "Default/appbar/_theme.less";
@import "Default/loader/_theme.less";
@import "Default/gantt/_theme.less";
@import "Default/imageeditor/_theme.less";
@import "Default/expansion-panel/_theme.less";
@import "Default/floatingactionbutton/_theme.less";
@import "Default/action-sheet/_theme.less";
@import "Default/bottom-navigation/_theme.less";
@import "Default/searchbox/_theme.less";
@import "Default/skeleton/_theme.less";
@import "Default/taskboard/_theme.less";
@import "Default/scheduler/_theme.less";
@import "Default/captcha/_theme.less";
@import "Default/popover/_theme.less";
@import "Default/orgchart/_theme.less";
@import "Default/pivotgrid/_theme.less";
@import "Default/chip/_theme.less";
@import "Default/panelbar/_theme.less";
@import "Default/colorpicker/_theme.less";

// Menu
.k-menu:not(.k-context-menu) .k-link {
    .fill( @text: @menu-text );
}
.k-menu-link.k-link.k-state-active,
.k-menu-link.k-link.k-active {
    color: white;
    background-color: #ff4350;
}
.k-menu-horizontal .k-menu-link {
    border-width: 0;
}

// Main colors
.k-splitbar .k-resize-handle {
    background-color: @normal-text-color;
}

.k-in,
.k-item {
    border-color: transparent;
}

.k-block,
.k-widget {
    background-color: @background;
}

.k-block,
.k-widget,
.k-group,
.k-content,
.k-header,
.k-filter-row > th,
.k-separator,
.k-toolbar,
.k-group-footer td,
.k-grid-footer,
.k-footer-template td,
.k-state-default,
.k-state-disabled,
.k-grid-header,
.k-grid-header-wrap,
.k-grid-header-locked,
.k-grid-footer-locked,
.k-grid-content-locked,
.k-grid td,
.k-grid td.k-state-selected,
.k-grid td.k-selected,
.k-grid-footer-wrap,
.k-grouping-header,
.k-grouping-header .k-group-indicator,
.k-panel > .k-item > .k-link,
.k-treemap-tile,
.k-splitbar,
.k-dropzone-active,
.k-upload-files,
.k-upload .k-action-buttons {
    border-color: @widget-border-color;
}

.k-group,
.k-toolbar,
.k-grouping-header,
.k-group-footer td,
.k-grid-footer,
.k-footer-template td,
.k-widget .k-status,
.k-dropzone-hovered,
.k-popup {
    background-color: @widget-background-color;
}

.k-mediaplayer-toolbar {
    background: fade(@widget-background-color, 85%);
}

.k-header,
.k-menu,
.k-tabstrip,
.k-drag-clue,
.k-grid-header,
.k-grouping-header,
.k-state-highlight:not(.k-panelbar-item) {
    color: contrast( @accent );
    background-color: @accent;
    border-color: @accent;
}

.k-block,
.k-widget,
.k-popup,
.k-content,
.k-toolbar,
.k-dropdown .k-input {
    color: @normal-text-color;
}

.k-popup,
.k-grid .k-filter-options,
.k-time-popup {
    .box-shadow(@popups-shadow);
}

.k-content,
.k-panel > li.k-item {
    background-color: @background;
}

.k-alt,
.k-separator,
.k-resource.k-alt,
.k-pivot-layout > tbody > tr:first-child > td:first-child {
    background-color: @background;
}

.k-input-label {
    color: @input-text;
}

.k-text-error {
    color: @error;
}

.k-state-selected,
.k-selected {
    background-color: fadeout(@info, 75%);
}

.k-state-focused,
.k-focus {
    box-shadow: inset 0 0 0 1px darken(@widget-border-color, 35%);
}

.k-state-hover,
.k-hover,
.k-splitbar-horizontal-hover,
.k-splitbar-vertical-hover,
.k-filebrowser-dropzone {
    color: @hover-text-color;
    background-color: @hover-background;
    border-color: @hover-background;
}

.k-state-disabled,
.k-state-disabled .k-link,
.k-dropzone em {
    color: @disabled-text-color;
}

// Border radius
.k-block,
.k-drag-clue,
.k-touch-scrollbar,
.k-inline-block,
.k-grid .k-filter-options,
.k-grouping-header .k-group-indicator,
.k-editor-inline {
    border-radius: @border-radius;
}

.k-hr {
    border-color: @widget-border-color;
}


// Default icons opacity
.k-button .k-image
 {
    opacity: .4;
}

.k-primary .k-icon,
.k-state-active .k-icon,
.k-active .k-icon,
.k-button:active .k-icon,
.k-drag-clue .k-icon,
.k-group-indicator .k-icon,
.k-grid-content .k-button:active .k-icon,
.k-splitbar.k-state-focused .k-icon,
.k-splitbar.k-focus .k-icon,
.k-gantt-toolbar .k-icon {
    opacity: 1;
}

.k-state-disabled .k-icon,
.k-state-disabled .k-button .k-icon,
.k-button.k-state-disabled .k-icon,
.k-button.k-disabled .k-icon {
    opacity: .7;
}

// Loading indicator
.k-i-loading {
    background-image: url('@{image-folder}/loading.gif');
}

.k-loading-image { background-image: url('@{image-folder}/loading-image.gif'); }
.k-loading-color { background-color: @background; }

.k-quality-list {
    margin-left: -25px !important;
}

// Inputs

.k-nodata {
    color: @disabled-text-color;
}

// Notification
@import "themes/notification.less";

// Tooltip
.k-chart-crosshair-tooltip,
.k-chart-shared-tooltip {
    color: @normal-text-color;
    background-color: @widget-background-color;
    border-color: @widget-border-color;
    .box-shadow(@widget-shadow);
}

// Splitter
.k-splitbar {
    background: @widget-background-color;
    border-color: @widget-background-color;
}

.k-splitbar.k-state-focused,
.k-splitbar.k-focus {
    background-color: @selected-background;
    border-color: @selected-background;
}

// PanelBar
.k-panelbar > .k-item > .k-link,
.k-panelbar > .k-item {
    color: @component-text;

}

.k-panelbar > .k-panelbar-header > .k-link {
    color: @accent;
}



// TabStrip
.k-tabstrip {
    background-color: @widget-background-color;
}

.k-tabstrip-items-wrapper,
.k-tabstrip-items {
    color: contrast( @tabs-normal-bg );
    .composite-background(@tabs-normal-gradient);
    background-color: @tabs-normal-bg;
}

.k-tabstrip-items {
    .k-item {
        color: @inversed-text-color;
        border-color: transparent;
    }

    .k-item.k-state-hover,
    .k-item.k-hover,
    .k-item.k-state-selected,
    .k-item.k-selected {
        border-top-color: @normal-text-color;
        .composite-background(@tabs-hover-gradient);
        background-color: @tabs-hover-bg;
    }
}

.k-tabstrip-left > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-state-active,
.k-tabstrip-left > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-active {
    border-right-color: @selected-background;
}

.k-tabstrip-right > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-state-active,
.k-tabstrip-right > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-active {
    border-left-color: @selected-background;
}

.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items .k-item.k-state-active,
.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items .k-item.k-active {
    .composite-background(@tabs-hover-gradient);
    border-bottom-color: @selected-background;
}

.k-tabstrip-bottom > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-state-active,
.k-tabstrip-bottom > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-active {
    border-top-color: @selected-background;
}

.k-tabstrip .k-content:focus,
.k-tabstrip .k-content.k-state-focused,
.k-tabstrip .k-content.k-focus {
    outline-color: @tabstrip-content-border-focused;
}

// ProgressbBar
.k-progressbar {
    background: darken(@widget-background-color, 20%);
    border-color: darken(@widget-background-color, 20%);

    .k-item {
        border-color: @widget-border-color;
    }
}

.k-progressbar {
    .k-state-selected,
    .k-selected {
        background-color: @selected-background;
    }
}

.k-progressbar-horizontal {
    .k-state-selected,
    .k-selected {
        border-top-color: @selected-background;
        border-bottom-color: @selected-background;
        border-left-color: darken(@normal-background, 12%);
        border-right-color: darken(@normal-background, 12%);
    }

    .k-state-selected.k-first,
    .k-selected.k-first {
        border-left-color: @selected-background;
    }

    .k-state-selected.k-last,
    .k-selected.k-last {
        border-right-color: @selected-background;
    }
}

.k-progressbar-vertical {
    .k-state-selected,
    .k-selected {
        border-left-color: @selected-background;
        border-right-color: @selected-background;
        border-top-color: darken(@normal-background, 12%);
        border-bottom-color: darken(@normal-background, 12%);
    }

    > .k-complete {
        border-top-color: @selected-background;
        border-bottom-color: @selected-background;
    }

    .k-state-selected.k-first,
    .k-selected.k-first {
        border-top-color: @selected-background;
    }

    .k-state-selected.k-last,
    .k-selected.k-last {
        border-bottom-color: @selected-background;
    }
}

// Grid
.k-grid-header,
.k-grid-header .k-header,
.k-grid-footer,
.k-grid-footer td,
.k-scheduler-agenda .k-scheduler-header {
    background-color: @secondary-widget-background-color;
    border-color: @widget-border-color;
}

.k-grid-header .k-header .k-link,
.k-grid-header .k-header,
.k-grid-header .k-link,
.k-grid-header .k-link:link,
.k-scheduler-agenda .k-scheduler-header,
.k-scheduler-agendaview .k-scheduler-datecolumn {
    color: lighten(@hover-text-color, 8%);
}

.k-grid .k-alt {
    background-color: @widget-background-color;
}

.k-grid tr:hover {
    background-color: @hover-background;
}

.k-grid-header th.k-state-focused,
.k-grid-header th.k-focus,
.k-grid td.k-state-focused,
.k-grid td.k-focus {
    box-shadow: inset 0 0 0 1px darken(@widget-border-color, 27%);
}

.k-grid .k-button {
    color: @accent;
    border-color: transparent;
    background-color: @normal-background;
}

.k-grid .k-button-icontext .k-icon,
.k-edit-form-container .k-edit-buttons .k-button-icontext .k-icon  {
    display: none;
}

.k-grid .k-button-icontext {
    background-color: transparent;
}

.k-grid .k-primary {
    color: @inversed-text-color;
    background-color: @accent;
}

.k-grid .k-button:active,
.k-grid .k-button-icontext:active  {
    color: @inversed-text-color;
    background-color: @selected-background;
    border-color: @selected-background;
}

.k-grouping-header .k-group-indicator{
    color: @inversed-text-color;
    background-color: @accent-hover-background;
    border-color: @accent-hover-background;
}

.k-group-indicator .k-link {
    color: @inversed-text-color;
}

.k-grid .k-grouping-header {
    .fill(
        @toolbar-text,
        inherit,
        inherit
    );
}

.k-grouping-row {
    background-color: @secondary-widget-background-color;
    font-weight: bold;
}

.k-group-cell {
    background-color: @secondary-widget-background-color;
}

.k-edit-form-container :not(.k-button-group) > .k-button {
    color: @normal-text-color;
    background: transparent;
    border-color: transparent;
}

.k-edit-form-container :not(.k-button-group) > .k-primary {
    color: @accent;
}

.k-column-menu,
.k-column-menu .k-item,
.k-grid-columnmenu-popup,
.k-columnmenu-item-wrapper {
    border-color: @secondary-border-color;
}

.k-column-menu-group-header-text {
    color: @normal-text-color;
    border-color: @normal-text-color;
}

.k-grid td.k-state-selected,
.k-grid td.k-selected,
.k-grid tr.k-state-selected > td,
.k-grid tr.k-selected > td {
    border-color: fadeout(@widget-border-color, 20%);
}

.k-grid tr.k-state-selected,
.k-grid tr.k-selected,
.k-grid td.k-state-selected,
.k-grid td.k-selected,
.k-grid td.k-state-selected.k-state-focused,
.k-grid td.k-state-selected.k-focus,
.k-grid td.k-selected.k-state-focused,
.k-grid td.k-selected.k-focus {
    background-color: lighten(@info, 22%);
}

.k-grid td.k-state-selected:hover,
.k-grid td.k-selected:hover,
.k-grid tr.k-state-selected:hover td,
.k-grid tr.k-selected:hover td,
.k-grid td.k-grid-content-sticky.k-state-selected:hover,
.k-grid td.k-grid-content-sticky.k-selected:hover {
    background-color: @grid-selected-hover-bg;
}

.k-grid tr:hover .k-state-focused.k-state-selected,
.k-grid tr:hover .k-focus.k-state-selected,
.k-grid tr:hover .k-state-focused.k-selected,
.k-grid tr:hover .k-focus.k-selected,
.k-grid tr.k-state-selected:hover td.k-state-focused,
.k-grid tr.k-state-selected:hover td.k-focus,
.k-grid tr.k-selected:hover td.k-state-focused,
.k-grid tr.k-selected:hover td.k-focus {
    box-shadow: inset 0 0 0 1px darken(@widget-border-color, 35%);
}

.k-grid .k-state-selected:hover .k-group-cell,
.k-grid .k-selected:hover .k-group-cell {
    background-color: @secondary-widget-background-color;
}

.k-marquee-color {
    background-color: desaturate(@info, 8%);
}

// PivotGrid
.k-alt,
.k-grid.k-alt {
    color: @widget-text-color;
    background-color: @secondary-widget-background-color;
    border-color: @widget-border-color;
}

.k-grid-footer td,
.k-pivot-rowheaders .k-grid-footer {
    font-weight: bold;
}

.k-grid .k-filter-row:hover,
.k-pivot-rowheaders .k-grid tr:hover {
    background: none;
}

// Pager
.k-pager-wrap {
    border-color: @widget-border-color;
    color: @normal-text-color;
    background-color: @secondary-widget-background-color;

    .k-link {
        border-color: transparent;
        background-color: transparent;
        box-shadow: none;
    }
    .k-link:hover {
        color: @hover-text-color;
    }
    .k-link.k-state-disabled,
    .k-link.k-disabled {
        color: inherit;
    }
    .k-link:focus {
        .box-shadow( inset 0 0 0 1px darken(@widget-border-color, 35%) );
    }

    .k-pager-numbers .k-link {
        color: @normal-text-color;
    }
    .k-pager-numbers .k-link:hover {
        border-top-color: @widget-border-color;
    }
    .k-pager-numbers .k-state-selected,
    .k-pager-numbers .k-selected,
    .k-pager-numbers .k-state-selected:hover,
    .k-pager-numbers .k-selected:hover {
        border-top-color: @selected-background;
        color: @selected-background;
        background: none;
    }

    .k-pager-info {
        color: lighten(@hover-text-color, 8%);
    }

}

// Drop Hint
.k-drop-hint-line {
    background-color: @accent;
}

.k-drop-hint-h {
    .k-drop-hint-start {
        border-left-color: @accent;
    }

    .k-drop-hint-end {
        border-right-color: @accent;
    }
}

.k-drop-hint-v {
    .k-drop-hint-start {
        border-top-color: @accent;
    }

    .k-drop-hint-end {
        border-bottom-color: @accent;
    }
}



// Scheduler
.k-scheduler th,
.k-scheduler tr,
.k-scheduler td {
    border-color: @widget-border-color;
}

.k-scheduler-table td.k-state-selected,
.k-scheduler-table td.k-selected {
    background-color: lighten(@info, 22%);
}

.k-gantt > .k-header li {
    border-color: @accent;
}

.k-event,
.k-task-complete {
    color: @inversed-text-color;
    background: darken(@info, 21%);
    border-color: darken(@info, 21%);
}

.k-event.k-state-selected,
.k-event.k-selected {
    .box-shadow(0 0 0 2px @normal-text-color);
}

.k-scheduler-table .k-nonwork-hour,
.k-scheduler-dayview .k-today.k-nonwork-hour,
.k-scheduler-timelineview .k-today.k-nonwork-hour
{
    background-color: @scheduler-nonwork-background-color;
}

.k-scheduler-table .k-today,
.k-today > .k-scheduler-datecolumn,
.k-today > .k-scheduler-groupcolumn
{
    background-color: @column-highlight-background-color;
}

.k-scheduler-header .k-today {
    background: transparent;
}

table:not(.k-scheduler-dayview) .k-scheduler-header-wrap .k-today {
    color: @selected-background;
}

// Gantt
.k-gantt .k-treelist,
.k-gantt .k-treelist .k-alt,
.k-gantt .k-header.k-nonwork-hour,
.k-gantt .k-treelist .k-alt,
.k-gantt .k-header.k-nonwork-hour {
    background-color: @secondary-widget-background-color;
}

.k-gantt .k-treelist .k-state-selected,
.k-gantt .k-treelist .k-selected,
.k-gantt .k-treelist .k-state-selected td,
.k-gantt .k-treelist .k-selected td,
.k-gantt .k-treelist .k-alt.k-state-selected,
.k-gantt .k-treelist .k-alt.k-selected,
.k-gantt .k-treelist .k-alt.k-state-selected > td,
.k-gantt .k-treelist .k-alt.k-selected > td {
    background-color: lighten(@info, 22%);
}

.k-gantt-toolbar {
    border-color: @secondary-widget-background-color;
}

.k-gantt .k-task-draghandle {
    border-color: darken(@info, 21%);
}

.k-task-dot:after {
    background-color: lighten(@hover-text-color, 8%);
    border-color: lighten(@hover-text-color, 8%);
}

.k-task-dot:hover:after {
    background-color: @normal-text-color;
    border-color: @normal-text-color;
}

.k-task-summary {
    background: darken(@normal-background, 12%);
}

.k-task-milestone {
    background-color: lighten(@success, 5%);
}

.k-task-summary-complete {
    background: @normal-text-color;
}

.k-state-selected.k-task-summary,
.k-selected.k-task-summary {
    background: lighten(@info, 4%);
}

.k-state-selected.k-task-milestone,
.k-selected.k-task-milestone,
.k-state-selected .k-task-summary-complete,
.k-selected .k-task-summary-complete {
    background-color: lighten(@info, 22%);
    border-color: lighten(@info, 22%);
}

.k-task-single {
    color: @inversed-text-color;
    background-color: lighten(@info, 4%);
    border-color: lighten(@info, 4%);
}

.k-state-selected.k-task-single,
.k-selected.k-task-single {
    border-color: @accent;
}

.k-gantt-line {
    background-color: @normal-text-color;
    color: @normal-text-color;
}

.k-state-selected.k-gantt-line,
.k-selected.k-gantt-line {
    background-color: @accent;
    color: @accent;
}

.k-resource {
    background-color: @widget-background-color;
}

// Editor
.k-filebrowser .k-header {
    color: @widget-text-color;
    background-color: @widget-background-color;
    border-color: @widget-border-color;
}

// Upload
.k-file,
.k-upload {
    background-color: @widget-background-color;
    border-color: @widget-border-color;
}

.k-dropzone .k-upload-status {
    color: lighten(@hover-text-color, 8%);
}
.k-file .k-upload-status {
    color: @normal-text-color;
}

.k-file-progress .k-progress {
    background-color: @info;
}

.k-file-success {

    .k-file-validation-message,
    .k-upload-pct {
        color: @success;
    }

    .k-progress {
        background-color: @success;
    }
}

.k-file-error,
.k-file-invalid {

    .k-file-validation-message,
    .k-upload-pct {
        color: @error;
    }

    .k-progress {
        background-color: @accent;
    }
}

.k-file-extension-wrapper,
.k-multiple-files-extension-wrapper,
.k-file-group-wrapper,
.k-multiple-files-group-wrapper,
.k-file-invalid-group-wrapper {
    color: @disabled-text-color;
    border-color: @disabled-text-color;
}

.k-file-extension-wrapper:before,
.k-multiple-files-extension-wrapper:before {
    background-color: @widget-background-color;
    border-color: transparent transparent @disabled-text-color @disabled-text-color;
}

.k-multiple-files-extension-wrapper:after {
    border-top-color: @disabled-text-color;
    border-left-color: @disabled-text-color;
}

.k-file-size,
.k-file-information,
.k-file-validation-message {
    color: @disabled-text-color;
}


// Rating
.k-rating.k-state-focused,
.k-rating.k-focus {
    .box-shadow(none);
}

// Stock Chart
.k-chart .k-mask {
    background-color: @widget-background-color;
    opacity: 0.68;
}

.k-chart .k-selection {
    border-color: @widget-border-color;
}

.k-chart .k-handle {
    width: 15px;
    height: 15px;
    border-width: 1px;
    border-style: solid;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.k-chart .k-left-handle {
    left: -8px;
}

.k-chart .k-right-handle {
    right: -8px;
}

.k-chart .k-handle:hover {
    background-color: @hover-background;
}

.k-chart .k-navigator-hint .k-tooltip {
    border: @widget-border-color;
   .box-shadow(@popups-shadow);
    background: @widget-background-color;
    color: @normal-text-color;
}

.k-chart .k-navigator-hint .k-scroll {
    background: @base;
    height: 4px;
}

// Map
.k-map {
    border-color: @widget-border-color;
    color: @widget-text-color;
    background-color: @widget-background-color;


    // Controls
    .k-navigator {
        border-color: @button-border-color;
        color: @button-text-color;
        background-color: @button-background-color;
        background-position: 50% 50%;
        .composite-background(@button-gradient);
    }
    .k-zoom-control {}


    // Attribution
    .k-attribution {}


    // Marker
    .k-marker {
        color: @accent;
    }
}

@import "themes/spreadsheet.less";

@spreadsheet-selection-border: #26c6da;
@spreadsheet-selection-background: fadeout(@spreadsheet-selection-border, 80%);

@active-header-text: contrast(@accent);
@inactive-header-text: contrast(@accent);

.k-spreadsheet {
    .k-spreadsheet-quick-access-toolbar {
        .k-button {
            box-shadow: none;
            color: @active-header-text;
            border-radius: 0;
            line-height: 2.6em;
            height: calc(3.1em + 2px); // IE centering icon fix
            width: 3em;

            &:hover {
                .composite-background(@tabs-hover-gradient);
                border-color: saturate(@normal-text-color, 7%);
            }
        }
    }
}

.k-spreadsheet-sheets-bar,
.k-spreadsheet-sheets-items {
    color: @inactive-header-text;
    .composite-background(@tabs-normal-gradient);
}

.k-spreadsheet-sheets-items,
.k-spreadsheet-tabstrip {

    .k-item.k-state-hover,
    .k-item.k-hover,
    .k-item.k-state-active,
    .k-item.k-active,
    .k-item.k-state-focused,
    .k-item.k-focus {
        background-color: transparent;

        .k-link {
            color: @active-header-text;
        }
    }

    .k-state-active .k-link,
    .k-active .k-link {
        color: @active-header-text;
    }
}

@spreadsheet-page-orientation-border-color: lighten(@hover-text-color, 8%);

.k-rtl {
    .k-grid-header .k-header:first-child,
    .k-filter-row th:first-child,
    .k-grid tbody td:first-child,
    .k-grid tfoot td:first-child {
        border-left-width: 0;
    }
}

// Timepicker infinite
// Timepicker header
.k-time-header {

    .k-time-now {
        color: @accent;
        background: transparent;

        &:hover,
        &:focus {
            color: @link-hovered-text;
        }
    }
}

// Timepicker content
.k-time-list-wrapper {
    background-color: @widget-background-color;

    .k-title {
        .fill(
            @disabled-text-color,
            @header-background-color,
            @widget-border-color,
        );

        background: @widget-background-color;
    }

    &.k-state-focused,
    &.k-focus {
        .k-title {
            color: @time-list-title-focus;
            opacity: 1;
        }

        &::before,
        &::after {
            background-color: @time-list-focused-bg;
        }
    }
}

.k-time-list {
    &::before,
    &::after {
        @shadow-size: 3em;
        box-shadow: 0 0 @shadow-size (@shadow-size / 2) @widget-background-color;
    }

    .k-item:hover {
        color: @accent;
    }
}

.k-time-container {
    background: transparent;
}

.k-time-highlight {
    background-color: @component-bg;
    border-color: @time-list-highlight-color;
}

.k-datetime-container {
    .k-date-tab {

        .k-datetime-buttongroup,
        .k-datetime-selector {
            background-color: @component-bg;
        }
    }
}

.k-grid-header {
    .k-i-sort-asc-sm,
    .k-i-sort-desc-sm,
    .k-i-sort-asc-sm:hover,
    .k-i-sort-desc-sm:hover,
    .k-sort-order {
        color: @accent;
        opacity: 1;
        margin-bottom: -1px;
    }
}

.k-menu-scroll-button {
    border-width: 0;
    box-shadow: none;
    border-color: @widget-border-color;
    background-color: @base;
}

.k-menu-scroll-wrapper.horizontal {
    .k-scroll-left { border-right-width: 1px; }
    .k-scroll-right { border-left-width: 1px; }
}
.k-menu-scroll-wrapper.vertical {
    .k-scroll-up { border-bottom-width: 1px; }
    .k-scroll-down { border-top-width: 1px; }
}


// Scheduler other month
.k-scheduler .k-other-month .k-nav-day {
    opacity: .6;
}


.k-calendar {

    .k-header,
    .k-footer {
        text-transform: uppercase;
    }

    table .k-link {
        color: @link-text;
    }
    .k-other-month .k-link {
        color:inherit;
    }

    td.k-state-focused,
    td.k-focus {
        box-shadow: none;
    }
}


// Editor
.k-window-content.editorToolbarWindow {
    color: @toolbar-text;
    background-color: @toolbar-bg;
}

// Grid Sticky columns
.k-master-row {
    .k-grid-content-sticky {
        background-color: @grid-bg;
    }

    &.k-alt .k-grid-content-sticky {
        background-color: @grid-alt-bg;
    }

    &.k-state-selected .k-grid-content-sticky,
    &.k-selected .k-grid-content-sticky {
        .composite-background(@grid-selected-gradient);
        background-color: @grid-selected-bg;
        background-position: 50% 50%;
    }

    &:hover .k-grid-content-sticky,
    &.k-state-hover .k-grid-content-sticky,
    &.k-hover .k-grid-content-sticky {
        .composite-background(@grid-hover-gradient);
        background-color: @grid-hover-bg;
    }

    &.k-state-selected:hover .k-grid-content-sticky,
    &.k-selected:hover .k-grid-content-sticky,
    &.k-state-selected.k-state-hover .k-grid-content-sticky,
    &.k-state-selected.k-hover .k-grid-content-sticky,
    &.k-selected.k-state-hover .k-grid-content-sticky,
    &.k-selected.k-hover .k-grid-content-sticky {
        background-color: @grid-selected-hover-bg;
        .composite-background(none);
    }

    td.k-grid-content-sticky.k-state-selected,
    td.k-grid-content-sticky.k-selected {
        background-color: lighten(@info, 22%);
    }
}

.k-grouping-row {
    .k-grid-content-sticky {
        background-color: @secondary-widget-background-color;
    }

    &:hover .k-grid-content-sticky,
    &.k-state-hover .k-grid-content-sticky,
    &.k-hover .k-grid-content-sticky {
        .composite-background(@grid-hover-gradient);
        background-color: @grid-hover-bg;
    }
}

.k-grid-header .k-grid-header-sticky,
.k-master-row .k-grid-content-sticky,
.k-grouping-row .k-grid-content-sticky,
.k-footer-template .k-grid-footer-sticky {
    border-left-color: @grid-sticky-border;
    border-right-color: @grid-sticky-border;
}

.k-grid-header .k-filter-row .k-grid-header-sticky {
    background-color: @secondary-widget-background-color;
}

// Locked columns
.k-grid-header-locked,
.k-grid-content-locked,
.k-grid-header-locked .k-header,
.k-grid-content-locked td {
    border-left-color: @grid-sticky-border;
    border-right-color: @grid-sticky-border;
}

// Grid Multi Filter Select All Checkbox
.k-check-all-wrap {
    border-color: @widget-border-color;
}
