@import "../bootstrap/less/variables.less";

//======================================================//
//                 VARIABLES EXO PLATFORM               //
//======================================================//

// Base color

@baseColor:                 #000000; // text color , border color, and other UI elements..

// Background color
@baseBackground: #ffffff; // default background , background for content display....

// Primary Color
@primaryColor: #578dc9;

// Background primary color
@primaryBackground:		#f0f0f0; // main background such as , header popup background, tab items...

// Icon color

@colorIconDefault: @primaryColor;
@colorIconExtra: @primaryColor; //#626262;
@colorIconPrimary: @primaryColor;
@colorIconOrange: #ff9916;
@colorIconSecondary:@baseBackground;
@sizeIcon24x24: 22px;
@sizeIcon12x12: 10px;
@sizeIcon64x64: 60px;
@sizeIcon32x32: 30px;
@sizeIconDefault: 18px;
@compressedFilesIconColor: #717272;

// Other base colors

@darkBlue: #295f9b;
@baseGreyColor: #e1e8ee;
@secondarySkinColor: #476a9c;
@tertiaryColor: #385989;
@secondaryBackground: #476a9c;
@lightWhite: #ffffff;
@secondaryColor: #000000;
@darkGrey: #4d5466;
@lightGrey: #f2f2f2;
@disableBackground: @lightGrey;
@lightYellow: #ffd800;
@darkYellow: #ffb441;
@backgroundSuccesNotification: #6ccbae;
@backgroundWarningNotification: #ffca7a;
@colorWarningNotification: #905904;
@backgroundInfoNotification: #89afd9;
@backgroundErrorNotification: #d07b7b;
@borderSuccesNotification: #2eb58c;
@borderWarningNotification: #ffb441;
@borderInfoNotification: #476a9c;
@borderErrorNotification: #bc4343;
@borderErrorInput: #cb6d6d;

// Image Patch
// -------------------------
@base-images-path: 			"/eXoSkin/skin/images";
@images-path: 			"@{base-images-path}/themes/default";

// Font icon path
@font-path: 			"/eXoSkin/skin/fonts";

@header-popup-bg: #484848;
@header-popup-title: #c1c1c1;
// Accent colors
// -------------------------
@errorColor:        @borderErrorNotification;		  // border error
@errorColorLight:	@backgroundErrorNotification;	  // background error

@warningColor:      @borderWarningNotification;		  // border warning
@warningColorLight: @backgroundWarningNotification;	  // background warning

@infoColor: 	    @borderInfoNotification;          // border info
@infoColorLight:    @backgroundInfoNotification;	  // background info

@successColor:      @borderSuccesNotification;        // border success
@successColorLight: @backgroundSuccesNotification;    // background success

// Scaffolding
// -------------------------
@bodyBackground: @baseBackground;
@sidebarBackground: @secondarySkinColor;
@contentBackground:  @baseBackground	url("@{images-path}/ShareImages/Background/texture.png") repeat left top;
@textColor: @baseColorDark;				// #333333
@textMediumColor: @baseColorMedium; 					// #808080
@textLightColor: @baseColorLight;				// #999999


// Links
// -------------------------
@linkColor:             @primaryColor;			// Special title, text, hover, press, hyper-link or selected link
@linkColorHover:        @primaryColor;

// Component Variables
// -------------------------

// Define common padding and margin size
// Currenly only use for the box
@gutterSizeBase: 			10px;
@gutterSizeXLarge: 			20px;
@gutterSizeLarge: 			15px;
@gutterSizeSmall: 			5px;


// Tables
// -------------------------
@tableBackground:                   transparent; 				// overall background-color
@tableBackgroundAccent: #f6f7fa;
@tableBackgroundHover: @primaryBackgroundHover; 	// for hover
@tableBorder:                       @borderColor; 				// table and cell border


// Buttons
// -------------------------
@btnColor: @darkGrey;
@btnBorder: @baseGreyColor;
@btnDisableColor: #c6c6c6;

@btnPrimaryColor: @lightWhite;
@btnPrimaryBackground:              @primaryColor;
@btnPrimaryBackgroundHighlight:     @primaryColor;
@btnPrimaryBorder: 					@primaryColor;

@paddingXLarge:         9px 15px;
@paddingLarge:          4px 10px;
@paddingDefault:		3px 10px;
@paddingSmall:          2px 10px;
@paddingMini:           0 10px;

// Forms
// -------------------------
@inputColor: @baseColorDark;
@inputDisableColor: @textLightColor;
@inputBackground: @baseBackground;
@inputBorder:                   	@borderColor;
@inputBorderRadius:             	@baseBorderRadius;
@inputDisabledBackground: @primaryBackgroundHover;
@formActionsBackground: @primaryBackground;
// Input placeholder text color
// -------------------------
@placeholderText:         @textLightColor;

@inputFocusColor:               	@inputColor;
@inputFocusBorder:              	lighten(@infoColor, 30%);
@inputFocusShadow:              	lighten(@infoColor, 40%);

@inputHeight:                   	@baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border

@uiCheckboxCheckedBorder: @baseBackground;
@uiCheckboxBackground: @primaryColor;

@uiRadioCheckedColor: @baseBackground;
@uiRadioCheckedBackground: @baseGreyColor;
@uiRadioCheckedDisabledBackground: @baseColorLight;

@uiCheckboxCheckedDisabledBorder: @baseColorLight;
@formReadOnyBackground: @primaryBackgroundHover;
@formReadOnyColor: @baseColorDark;


// Dropdowns
// -------------------------
@dropdownBorder: @baseBackground;
@dropdownBackground: @baseBackground;
@dropdownLinkBackgroundHover: @primaryColor;
@dropdownLinkColor: @textColor;
@dropdownLinkColorHover: #fff;
@dropdownLinkColorActive:       #fff;
@dropdownDividerTop:            @borderColor;

// Typography
// -------------------------
@fontFamily: Helvetica, arial, sans-serif;
@sansFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif;
@sansBoldFontFamily :   "Helvetica Neue Bold" , Helvetica, Lucida, Arial, sans-serif;
@serifFontFamily:       Georgia, "Times New Roman", Times, serif;
@monoFontFamily:        Monaco, Menlo, Consolas, "Courier New", monospace;

@baseFontSize:          14px;
@baseFontFamily:        @fontFamily;
@baseLineHeight:        20px;
@altFontFamily:         @serifFontFamily;

@headingsFontWeight:    bold;



// Component sizing
// -------------------------
// Based on 14px font-size and 20px line-height
@fontsizeXlarge:		16px;
@fontSizeLarge:         14px;
@fontSizeSmall:         12px;
@fontSizeMini:          11px;

@baseBorderRadius:      3px;
@borderRadiusLarge:     3px;
@borderRadiusSmall:     3px;


// COMPONENT VARIABLES
// --------------------------------------------------


// Z-index master list
// -------------------------
// Used for a bird's eye view of components dependent on the z-axis
// Try to avoid customizing these :)
@zindexDropdown:          1040;
@zindexPopover:           1030;
@zindexTooltip:           1030;
@zindexFixedNavbar:       1030;
@zindexModalBackdrop:     1040;
@zindexModal:             1050;



// Hr border color
// -------------------------
@hrBorder: @primaryBackgroundLight;


// Horizontal forms & lists
// -------------------------
@horizontalComponentOffset:       180px;


// Wells
// -------------------------
@wellBackground: @primaryBackgroundLight;


// Navbar
// -------------------------
@navbarCollapseWidth:             979px;
@navbarCollapseDesktopWidth:      @navbarCollapseWidth + 1;

@navbarHeight: 58px;
@navbarBackgroundHighlight:       #ffffff;
@navbarBackground:                darken(@navbarBackgroundHighlight, 5%);
@navbarBorder:                    darken(@navbarBackground, 12%);

@navbarText:                      #777;
@navbarLinkColor:                 #777;
@navbarLinkColorHover: @baseColorDark;
@navbarLinkColorActive: @baseColorMedium;
@navbarLinkBackgroundHover:       transparent;
@navbarLinkBackgroundActive:      darken(@navbarBackground, 5%);

@navbarBrandColor:                @navbarLinkColor;

// Inverted navbar
@navbarInverseBackground:                #111111;
@navbarInverseBackgroundHighlight:       #222222;
@navbarInverseBorder:                    #252525;

@navbarInverseText:                      @textLightColor;
@navbarInverseLinkColor:                 @textLightColor;
@navbarInverseLinkColorHover: @baseBackground;
@navbarInverseLinkColorActive:           @navbarInverseLinkColorHover;
@navbarInverseLinkBackgroundHover:       transparent;
@navbarInverseLinkBackgroundActive:      @navbarInverseBackground;

@navbarInverseSearchBackground:          lighten(@navbarInverseBackground, 25%);
@navbarInverseSearchBackgroundFocus: @baseBackground;
@navbarInverseSearchBorder:              @navbarInverseBackground;
@navbarInverseSearchPlaceholderColor:    #ccc;

@navbarInverseBrandColor:                @navbarInverseLinkColor;


// Pagination
// -------------------------
@paginationBackground: @baseBackground;
@paginationBorder:                    	@borderColor;
@paginationActiveBackground: @primaryBackgroundLight;


// Hero unit
// -------------------------
@heroUnitBackground: #476a9c;
@heroUnitHeadingColor: @baseBackground;
@heroUnitLeadColor:       inherit;


// Form states and alerts
// -------------------------
@warningText:             #333333;
@warningBackground: @warningColorLight;
@warningBorder: @warningColor;

@errorText:               #333333;
@errorBackground: @errorColorLight;
@errorBorder: @errorColor;

@successText:             #333333;
@successBackground: @successColorLight;
@successBorder: @successColor;

@infoText:                #333333;
@infoBackground: @infoColorLight;
@infoBorder: @infoColor;


// Tooltips and popovers
// -------------------------
@tooltipColor:            #fff;
@tooltipBackground:       #000;
@tooltipArrowColor:       @tooltipBackground;

@popoverBackground: @baseBackground;
@popoverArrowWidth:       10px;
@popoverArrowColor:       @popoverBackground;
@popoverTitleBackground:  darken(@popoverBackground, 3%);




// Special enhancement for popovers
@popoverArrowOuterWidth:  @popoverArrowWidth + 1;
@popoverArrowOuterColor:  @borderColor;


// GRID
// --------------------------------------------------


// Default 940px grid
// -------------------------
@gridColumns:             12;
@gridColumnWidth:         60px;
@gridGutterWidth:         20px;
@gridRowWidth:            (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));

// 1200px min
@gridColumnWidth1200:     70px;
@gridGutterWidth1200:     30px;
@gridRowWidth1200:        (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1));

// 768px-979px
@gridColumnWidth768:      42px;
@gridGutterWidth768:      20px;
@gridRowWidth768:         (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1));


// Fluid grid
// -------------------------
@fluidGridColumnWidth:    percentage(@gridColumnWidth/@gridRowWidth);
@fluidGridGutterWidth:    percentage(@gridGutterWidth/@gridRowWidth);

// 1200px min
@fluidGridColumnWidth1200:     percentage(@gridColumnWidth1200/@gridRowWidth1200);
@fluidGridGutterWidth1200:     percentage(@gridGutterWidth1200/@gridRowWidth1200);

// 768px-979px
@fluidGridColumnWidth768:      percentage(@gridColumnWidth768/@gridRowWidth768);
@fluidGridGutterWidth768:      percentage(@gridGutterWidth768/@gridRowWidth768);


// Breadcrumbs
// -------------------------
@breadcrumbColor: @baseColorDark;
@breadcrumbHoverColor: 			@primaryColor;
@breadcrumbActiveColor: 		@primaryColor;

// Calendar Component
// -------------------------
@calComponentWidth:						225px;
@calComponentWidthTitleColor: @baseBackground;
@calComponentDayColor:					@textColor;
@calComponentOtherMonthColor:			@textLightColor;
@calComponentDayHoverBackground: @primaryBackground;
@calComponentDaySelectedBackground:		@primaryColor;
@calComponentDaySelectedColor: @baseBackground;
@calComponentDayTodayBackground: 		@primaryColor;
@calComponentDayTodayColor: @baseBackground;
@calComponentCurrentWeekBackground: @baseBackground;
@calComponentCurrentWeekBorder: 		@borderColor;
@calComponentTimeInputBoxBackground: #578dc9;
@calComponentTimeInputColor: 			@textColor;
@calComponentTimeInputBackground: @baseBackground;
@calComponentTimeInputBorder: 			@borderColor;
@calComponentTimeInputTorcusBorder: 	@primaryLightColor;

// Label Badges
// -------------------------
@labelColor: @baseBackground;
@labelBackground: @baseColorLight;
@labelHoverBackground: 					@primaryLightColor;

// Popup
@uiPopupBackground: @baseBackground;
@uiPopupBorder: 						@borderColor;
@uiPopupHeaderBackground: #f2f2f2;
@uiPopupHeaderBorder: 0px solid  @primaryBackground;
@uiPopupTitleColor: 					@textColor;
@uiPopupContentBackground: @baseBackground;
@popupMessageColor: 					@textColor;

@multipleMessageBackground: @primaryBackgroundLight;
@multipleMessageBorder: 				@borderColor;

// Tabs Normal
// -------------------------
@tabNormalLinkColor: 					@textColor;
@tabNormalLinkBorder: 					@borderColor;
@tabNormalLinkBackground: #f0f4f7;

@tabNormalActiveLinkBorder: 			@borderColor;
@tabNormalActiveLinkBackground: @primaryColor;

@tabNormalContentBackground: @baseBackground;
@tabNormalContentBorder: 				@borderColor;

// Tabs GrayInPage
// -------------------------
@tabGrayInPageNavBackground: @primaryBackgroundHover;
@tabGrayInPageNavBorder: 					@borderColor;
@tabGrayInPageActiveLinkStartBackground: @baseBackground;
@tabGrayInPageActiveLinkMiddleBackground: @primaryBackground;
@tabGrayInPageActiveLinkEndBackground: 		@tabGrayInPageActiveLinkMiddleBackground;
@tabGrayInPageContentBackground: @primaryBackground;

@tabGrayInPageLinkColor: 				@textColor;
@tabGrayInPageLinkBorder: @primaryBackground;
@tabGrayInPageHoverLinkColor: @primaryBackground;
@tabGrayInPageHoverLinkBorder: 			@borderColor;
@tabGrayInPageCaretColor: @baseColorMedium;
@tabGrayInPageHoverCaretColor: 			@primaryLightColor;

// Tab Container
// -------------------------
@tabContainerBackground: @baseColorLight;
@tabContainerLinkColor: @baseBackground;
@tabContainerActiveLinkBackground:  	@primaryLightColor;
@tabContainerActiveLinkColor: @baseBackground;

// Toolbar
// -------------------------
@toolbarDarkStartBackground:			#2D3138;;
@toolbarDarkEndBackground:				#2D3138;;
@toolbarDarkBorder: 					#2D3138;;
@toolbarDarkLinkColor: @baseBackground;
@toolbarDarkLinkHoverColor: @baseBackground;
@toolbarDarkBackgroundHover: #3f3f3f;

@toolbarLightStartBackground:			@baseBackground;
@toolbarLightEndBackground:				@baseBackground;
@toolbarLightBorder: 					@baseBackground;
@toolbarLightLinkColor: 				@primaryColor;
@toolbarLightLinkHoverColor: 			#4d5466;
@toolbarLightBackgroundHover:           @baseBackground;

//UIBox

@uiBoxBg : @baseBackground;
@uiBoxBorder : @borderColor;
@uiBoxHeadBg : @primaryBackground;
@uiBoxGray: @primaryBackground;

// Quote
@quoteBorder: #a8b3c5;
@quoteBackgound: none;
@quoteBackgoundForum: #eff4fa;
@quoteBorderForum: #aac5e3;

@quotecolor: @textColor;

@quotePrimaryBorder: 					lighten(@primaryColor, 40%);


// UIMention
@uiMentionColor: @baseBackground;
@uiMentionBorder: @infoColor;
@uiMentionBackground: @mentionBackground;

//@paddingXLarge:         10px 15px;
//@paddingLarge:          4px 10px;
//@paddingSmall:          2px 10px;
//@paddingMini:           0 10px;

// Global Loading
@globalLoadingBackground: #808080;
@globalLoadingBorder: #333;
@globalLoadingColor: #fff;

// navigation left
@plfNavigationTitleColor: @primaryColor;
@plfNavigationBgBorderLeft :@primaryLightColor;
@plfNavigationBorderLeft: @lightWhite;
@plfNavigationColor: @baseColorMedium;
@plfNavigationBgSelected : @baseBackground;
@plfNavigationBorderSelected: @borderColor;
@plfNavigationColorSelected: @baseColorMedium;
@plfNavigationColorHover:  @linkColorHover;

// notification
@notifcationUnreadBackground: #e3ecf6;

// -------------------------Color  generation formula -------------------------//

//Return true if base color is darker ( this is default skin)
.setColor (@a) when (lightness(@a) < 50%) {
  @baseColorDark:       lighten(@baseColor, 20%); // #333333 Default color for all title, text, text input, label
  @baseColorMedium:         lighten(@baseColor, 50%); // #808080 Navigation text color, special purpose in use
  @baseColorLight:        lighten(@baseColor, 60%); // #999999 Default @baseColorMedium color for small text, sub title, text field explanation
@borderColor: @baseGreyColor;
  @primaryBackgroundHover:  darken(@primaryBackground, 4%);
  @primaryBackgroundLight:  lighten(@primaryBackground, 3%);
  @revealBackgroundHover:  lighten(@baseColor, 98%);
  @revealBackgroundSelected: lighten(spin(@primaryColor, -10%), 52%);
  @primaryDarkColor:    darken(@primaryColor, 10.5%);   //#224469
  @primaryLightColor:   lighten(@primaryColor, 18.5%);    //#578dc9
  // button primary
  @btnBackground:            @baseBackground;
  @btnBackgroundHighlight:  @primaryBackground;

  @dropdownArrowRight:  darken(@baseBackground, 20%);   // #aac5e3
  @quotePrimaryBackground:        lighten(@quotePrimaryBorder, 18%);  // #aac5e3
}

//Return true if base color is lighter
.setColor (@a) when (lightness(@a) >= 50%) {
  @baseColorLight:        darken(@baseColor, 20%);
  @baseColorMedium:         lighten(@baseColor, 50%);
  @baseColorDark:       lighten(@baseColor, 60%);
@borderColor: @baseGreyColor;
  @primaryBackgroundLight:  lighten(@primaryBackground, 4%);
  @primaryBackgroundHover : darken(@primaryBackground, 3%);
  @revealBackgroundHover:  darken(@baseColor, 98%);
  @revealBackgroundSelected: darken(spin(@primaryColor, -10%), 52%);
  @primaryLightColor:   lighten(@primaryColor, 10.5%);    //#224469
  @primaryDarkColor :   darken(@primaryColor, 18.5%);   //#578dc9
  // button primary
  @btnBackground:           @primaryBackground;
  @btnBackgroundHighlight: @baseBackground;
  @dropdownArrowRight:  lighten(@baseBackground, 90%);
  @quotePrimaryBackground:        darken(@primaryColor, 10%); // #aac5e3
}
.setColor(@baseColor);

/* default btn */
@btnBackgroundColor: @baseBackground;
@btnBackgroundImage: none;
@btnHoverBackgroundColor: @baseGreyColor;
@btnDisableBackground: #f2f2f2;

/* primary btn */
@btnPrimaryHoverBackgroundColor: #476a9c;
@btnPrimaryHoverBackgroundPosition: 0 -45px;
@btnPrimaryDisableHoverBackground: #476a9c;
@btnPrimaryDisableBackground: #afc9e5;

/* btn group */
@btnGroupActiveBackground: inherit;
@btnGroupActiveColor: @baseBackground;
@btnGroupActiveBorderColor: @primaryColor;
@btnGroupBackground: #f0f4f7;
@btnGroupHoverBackgroundColor: @btnHoverBackgroundColor;

/* dropdown */
@dropdownMenuBorderColor: @baseBackground;
@dropdownEndColor: @primaryColor;

/* btn dropdown */
@btnDropdownImage: none;
@btnDropdownBackground: @baseGreyColor;

/* btn-primary dropdown */
@btnPrimaryDropdownBackground: @primaryColor;

/* btn group dropdown */
@btnGroupDropdownBackground: @baseGreyColor;
@btnGroupOpenDropdownBackground: @baseGreyColor;

/* switchBtnHandle */
@switchBtnHandleStartColor: #b5bdc6;
@switchBtnHandleEndColor: #b5bdc6;

/* switchBtnLabelOff */
@uiSwitchOffColor: #e1e8ee;
@switchBtnLabelOffStartColor: @uiSwitchOffColor;
@switchBtnLabelOffStartColor: @uiSwitchOffColor;

/* switchBtnLabelOn */
@uiSwitchOnColor: #89afd9;
@switchBtnLabelOnStartColor: @uiSwitchOnColor;
@switchBtnLabelOnStartColor: @uiSwitchOnColor;

/* uiradio */
@uiRadioCheckedBeforeBackground: @primaryColor;
@uiRadioCheckedAfterBackground: @baseBackground;

/* uicheckbox */
@uiCheckboxCheckedBackground: @primaryColor;

/* uiSwitcher */
@uiSwitcherBackground: #d8dadd;
@uiSwitcherOnBackground: @primaryColor;
@uiSwitcherOffBackground: #9ea6b2;

/* input-append btn */
@inputAppendBtnBackground: @primaryColor;

/* Tags and mention */
@mentionBackground: @primaryColor;
@mentionPadding: 2px 20px 0 5px;
@mentionColor: @lightWhite;
@mentionBorder: none;
@mentionRemovePositionRight: 6px;
@removeMentionColor: @secondarySkinColor;
@removeMentionTop: 2px;
@removeTagColor: @removeMentionColor;

/* Thumbnail */
@ThumbnailMargin: 45px 0 0 40px;
@ThumbnailView-DownloadColor: transparent;
@ColorThumbnailBackground: rgba(0,0,0,0.4);
@ThumbnailView-DownloadFloat: left;
@ThumbnailView-DownloadDisplay: inline-block;
@ThumbnailView-DownloadWidth: 22px;
@ThumbnailView-DownloadHeight: 22px;
@ThumbnailView-Download-IconsColor: @baseBackground;
@ThumbnailView-DownloadMarginRight: 15px;
@ThumbnailView-DownloadMarginLeft: -5px;

/* popover  */
@popoverBorder: none;

/* */
@tiptipBorder: 1px none @baseGreyColor;

/* alerts  */
@linkInAlertColor: @baseBackground;                   // link in the alert
@linkInAlertTextDecoration: underline;                // underline link in the alert

/* progress bar */
@progressBarBorderRadius: 0;
@progressBarIconBackground: #e1e8ee;
@progressBarIconBackgroundImage: none;

/*  tabs  */
@tabNormalLinkBorderTop: none;
@tabNormalLinkBorderRight: none;
@tabNormalLinkBorderBottom: 2px solid #f0f4f7;
@tabNormalLinkBorderLeft: 2px solid @baseGreyColor;
@tabNormalLinkHoverBorderTop: none;
@tabNormalLinkHoverBorderRight: @tabNormalLinkBorderRight;
@tabNormalLinkHoverBorderBottom: 1px solid #f8f8f8;
@tabNormalLinkHoverBorderLeft: none;
@tabNormalActiveLinkColor: @baseBackground;
@tabContentBorder: 2px solid @baseGreyColor;

/* tables */
@tableThBackground: #f6f7fa;
@tableRadius: 0px;

/*  popup   */
@uiIconCloseFontSize: 12px;
@uiPopupHeaderBoxShadow: none;
@popupTitleFontSize: 18px;
@uiActionBorderBorderTop: none;
@uiActionBorderMarginTop: 30px;
@uiIconCloseColor: #333333;
@uiPopupHeaderMarginBottom: 7px;

/* pagination */
@pageIteratorStartColor: @baseBackground;
@pageIteratorEndColor: @baseBackground;
@pageIteratorHoverBackground: @baseGreyColor;
@pageIteratorColor: @baseBackground;
@pageIteratorBackgroundPosition: 0 -30px;
@pageIteratorActiveBackground: @primaryColor;
@pageIteratorMargin: 4px;

/* Badge */
@badgeDefaultBackground: @baseGreyColor;

/* uiBox */
@weekListBackground: #578dc9;
@calComponentTodayBackground: #578dc9;
@uicalendarComponentTitleBackground: #578dc9;
@uiCalendarComponentTitleBackground: #578dc9;
@uiMiniCalendarTitleBackground: #578dc9;
@uiMiniCalendarTodayBackground: #eceaea;
@uiMiniCalendarCurrentWeekBackground: @baseBackground;
@uiMiniCalendarBorder: none;
@uicalendarComponentBorder: none;

/* Alert */
@alertBorder: 1px;
@alertSuccessColor: #084130;
@alertErrorColor: #771414;
@alertInfoColor: #193e67;
@alertWarningColor: #8f5804;
@alertWarningIconColor: #b46f05;


/* Left bar */
@margin: 57px;

/* The background of drop area when a file is dragged into it */
@dropFileAreaBackgroundOnDragEnter: #e6e6e6;

// Other variables
@commentBackgroundColor: #f2f5f8;
@uiTreeEmptyColor: @lightWhite;
@uiIconRefreshColor: @primaryColor;
@toolbarContainerDarkColor: @lightWhite;
@uiPageIteratorActiveColor: @lightWhite;
@btnGroupColor: @lightWhite;
@uiActionBarBtnColor: @lightWhite;
@inputAppendColor: @lightWhite;
@selectOptionColor: @lightWhite;
@heroUnitColor: @lightWhite;
@jumbotronColor: @lightWhite;
@calendarWeekListColor: @lightWhite;
@calendarTitleColor: @lightWhite;
@companyNavigationPortletColor: @lightWhite;
@navItemColor: @lightWhite;
@boxLoadMoreColor: @lightWhite;
@activityStreamCommentBtnColor: @lightWhite;
@itemSelectorColor: @lightWhite;
@tableColor: @darkGrey;
@popupHeaderColor: @darkGrey;
@toolbarContainerLightColor: @darkGrey;
@dropdownMenuColor: @darkGrey;
@treeIconColor: @darkGrey;
@uiPageIteratorColor: @darkGrey;
@popupHeaderBackground: @lightGrey;
@rightBodyContainerBackground: @lightGrey;
@activityStreamBackground: @baseBackground;
@toggeleInvisibleColor: @baseGreyColor;
@likeButtonColor: #c6c6c6;
@controlGroupErrorColor: #bc4343;
@controlGroupSuccessColor: #2eb58c;
@calendarColor: #333333;
@navigationPortletBackground: @tertiaryColor;
@btnAllActivitiesColor: @tertiaryColor;
@offlineColor: #a8b3c5;
@toolbarLightIconColor:           #a8b3c5;
@toolbarLightIconHoverColor:      @primaryColor;
@colorIconSecondaryHover:@primaryColor;
@sizeSideBarIcon: 20px;
@headingColor: #4d5466;
@plfNavigationBgBorderLeft: @lightWhite;
@badgePrimaryColor : #ff5335;
@paddingBadgeDefault-mini : 0;
@widthBadgeDefault-mini : 20px;
@heightBadgeDefault-mini : 20px;
@textAlignBadgeDefault-mini : center;
@borderRadiusBadgeDefault-mini : 50%;
@lineHeightBadgeDefault-mini : 20px;
@btnPrimaryDropdownBackgroundImage: none;
@btnGroupDropdownToggeleBackground: @baseGreyColor;
@uiCheckboxDisabledBackground: #999;
@chatBubbleBackground: #edf3ff;
@chatBubbleOddBackground: #dceaf9;
@chatFileUploadPopOverBackground: #88b3d8;

@import "customVariables.less";
