/* LESS Definitions */

/*Image URL*/

@base_url: "qss/gray_128";

@image_url: "@{base_url}/imgs";

@m_baseBG: 	rgb(128,128,128);

@m_base_lightH: rgb(230,230,230);

@m_base_lightV: rgb(230,230,230);

@m_base_darkH: 	rgb(64,64,64);

@m_base_darkV: 	rgb(64,64,64);

/* color adjustable by delta */

.baseBG(@dark: 0%){

	background-color: darken(@m_baseBG, @dark);

}

.baseBG(light, @light: 0%){

	background-color: lighten(@m_baseBG, @light);

}

.base_inset(@dark: 0%){

	.baseBG(@dark);

	border-style: inset;

	border-left-color: 	darken(@m_base_darkH, @dark);

	border-top-color: 	darken(@m_base_darkV, @dark);

	border-right-color: 	darken(@m_base_lightH, @dark);

	border-bottom-color: 	darken(@m_base_lightV, @dark);

}

.base_inset(light, @light: 0%){

	.baseBG(light, @light);

	border-style: inset;

	border-left-color: 	lighten(@m_base_darkH, @light);

	border-top-color: 	lighten(@m_base_darkV, @light);

	border-right-color: 	lighten(@m_base_lightH, @light);

	border-bottom-color: 	lighten(@m_base_lightV, @light);

}

.base_outset(@dark: 0%){

	.baseBG(@dark);

	border-style: outset;

	border-left-color: 	darken(@m_base_lightH, @dark);

	border-top-color: 	darken(@m_base_lightV, @dark);

	border-right-color: 	darken(@m_base_darkH, @dark);

	border-bottom-color: 	darken(@m_base_darkV, @dark);

}

.base_outset(light, @light: 0%){

	.baseBG(light, @light);

	border-style: outset;

	border-left-color: 	lighten(@m_base_lightH, @light);

	border-top-color: 	lighten(@m_base_lightV, @light);

	border-right-color: 	lighten(@m_base_darkH, @light);

	border-bottom-color: 	lighten(@m_base_darkV, @light);

}

/*set padding*/

.set_padding(@hPad: 0px, @vPad: 0px){

   	padding-left: 	@hPad;

   	padding-right: 	@hPad;

   	padding-top: 	@vPad;

   	padding-bottom: @vPad;	

}

/*set margin*/

.set_margin(@hMgn: 0px, @vMgn: 0px) {

   	margin-left: 	@hMgn;

   	margin-right: 	@hMgn;

   	margin-top: 	@vMgn;

   	margin-bottom:	@vMgn;

}

/* ------ Qt Widgets Common Difinitions ------ */

QFrame

{

	.baseBG;

	margin: 0px;

	border: 0px;

	padding: 0px;

}

QDialog

{

	.baseBG;

}

QMainWindow::separator 

{

    background: yellow;

    width: 10px; /* when vertical */

    height: 10px; /* when horizontal */

}

QToolTip, #helpTooltip

{

	border: 1px solid black;

	background-color: rgb(255,255,225);

   	padding: 2px;

 	border-radius: 2px;

} 

QTreeWidget {

	border-width: 1px;

	.base_inset;

	alternate-background-color: lighten(@m_baseBG, 5%);

}

QStatusBar {

 	background-color: rgb(192,192,192); 

	&::item { 

		border-width: 0;

	}

	& QLabel { 

		background-color: rgb(192,192,192); 

	}

	& #StatusBarLabel {

		background-color: rgb(255,255,255);

		.set_padding( 3px, 1px );

	}

}

QMenuBar

{

	background: rgb(160,160,160);

	color: black;

}

QMenu

{

	background: rgb(160,160,160);

	&::item:selected

	{

		background: rgb(0,0,128);

		color: white;	

	}

}

QToolBar

{	

	.base_outset;

	border-width: 1px;

	margin: 0px;

	padding: 0px;

	border-image: none;

	&::separator:horizontal {

	    margin_top: 1px;

	    margin_left: 2px;

	    margin_right: 2px;

		image: url("@{image_url}/bottomseparator.png");

	}

	&::separator:vertical {

		image: url("@{image_url}/separator.png");

	}

	&  QToolButton {

		.baseBG;

		/*margin: 2px 1px 1px 1px;*/

		margin: 2px;

		padding: 0px;

		border: 0px;

		border-image: none;

		&:hover {

			border-image: url("@{image_url}/over.png") 2;

		}

		&:checked, 

		&:pressed {

			border-image: url("@{image_url}/click.png") 2;

		}

		&:disabled{

			border-image: none;

		}

		&::menu-indicator

		{

			image: none;

		}

		&::menu-button {

			border-image: none;

			background-color: rgb(160,160,160);

		}

	}

	& QLabel

	{

		margin-top: 1px;

		border-width: 2;

	}

	& QToolBar

	{

	    border-width: 0px;

	}

}

QCheckBox {

	&:hover {

		.baseBG(light, 10%);

	}

	&:disabled {

		color: rgb(64,64,64);

	}

}

/* ------ Toonz Classes Difinitions ------ */

/* ------ Palette ------ */

PaletteViewer #ToolBarContainer

{

    margin: 0px;

    padding: 0px;

    & QToolBar

    {

        border: 1px;

        .base_outset();

        & QToolButton

        {

            margin: 0px;

            padding: 1px;

            border: 0px;

        }

    }

    & #keyFrameNavigator

    {

        border: 0px;

    }

}

#TabBarContainer{

	.baseBG(15%);

	& #ScrollLeftButton,

	& #ScrollRightButton{

	margin-top: 1px;

    }

}

#PaletteTabBar, 

#FxSettingsTabBar{

	.baseBG(15%);

	&::tab {

		.set_padding( 7px, 2px );

		min-width: 60px;

		border-width: 1px;

	     	border-top-left-radius: 4px;

	     	border-top-right-radius: 4px;

		.base_outset(light,20%); /* for non selected tab */

     		margin-top: 2px; /* for non selected tab */

		border-bottom-color: @m_base_lightV; /* for non selected tab */

		&:selected {

			.base_outset(light,50%);

     			margin-top: 0px;

		     	border-bottom-color: @m_baseBG; /* same as the pane color */

			/* expand/overlap to the left and right by 4px */

			margin-left: -4px;

			margin-right: -4px;

		}

		&:first:selected {

			margin-left: 0; /* the first selected tab has nothing to overlap with on the left */

		}

		&:last:selected {

			margin-right: 0; /* the last selected tab has nothing to overlap with on the right */

		}

		&:only-one {

			margin: 0; /* if there is only one tab, we don't want overlapping margins */

		} 

	}

}

#PaletteLockButton{

	&:hover{

		border-image: url("@{image_url}/over_yellow.png") 2;

	}

	&:checked{

		border-image: url("@{image_url}/click_pink.png") 2;

		&:hover{

			border-image: url("@{image_url}/over_pressed_yellow.png") 2;

		}

	}

}

#PageViewer{

	qproperty-TextColor: black;

}

/* ------ Style Editor ------ */

#StyleEditorTabBar {

	.baseBG(15%);

	&::tab{

		.set_padding( 2px, 1px );

		font-size: 12px;

		min-width: 40px;

		border-width: 1px;

	     	border-top-left-radius: 3px;

	     	border-top-right-radius: 3px;

		.base_outset(light,20%); /* for non selected tab */

		border-bottom-color: @m_base_lightV; /* for non selected tab */

		&:selected {

			.base_outset(light,50%);

		     	border-bottom-color: @m_baseBG; /* same as the pane color */

			/* expand/overlap to the left and right by 4px */

			margin-left: -2px;

			margin-right: -2px;

		}

		&:first:selected {

			margin-left: 0; /* the first selected tab has nothing to overlap with on the left */

		}

		&:last:selected {

			margin-right: 0; /* the last selected tab has nothing to overlap with on the right */

		}

		&:only-one {

			margin: 0; /* if there is only one tab, we don't want overlapping margins */

		}

	}

}

#HexagonalColorWheel {

	qproperty-BGColor: @m_baseBG;	

}

/* Customize Horizontal QSlider that have name "colorSlider"  */

#colorSlider {

	&::groove:horizontal {

		height: 20;

		border-image: none;

		border-width: 1;

		height: 1px;

	}

	&::handle:horizontal {

		width: 8px;

		margin: -8px -4px;

	}

}

#colorSliderAddButton, 

#colorSliderSubButton

{

	border-image: url("@{image_url}/colorslider_button_bg.png")2;

	padding: 0px;

	margin: 0px;

	border: 2px;

	image-position: center center;

}

#colorSliderAddButton

{

	image: url("@{image_url}/colorslider_add.png");

	&:pressed {

		image: url("@{image_url}/colorslider_add_pressed.png");

	}

}

#colorSliderSubButton

{

	image: url("@{image_url}/colorslider_sub.png");

	&:pressed {

		image: url("@{image_url}/colorslider_sub_pressed.png");

	}

}

#PlainColorPageParts

{

	border-width: 0px;

	border-bottom: 1px solid black;

	border-top: 1px solid white;

}

#colorSliderLabel, 

#colorSliderField

{

	font-size: 14px;	

}

/*---------------------------------------------------------------------------*/

/* The animated, scrollable toolbar containers */

DvScrollWidget > QPushButton {

	border-image: none;

	border: 0px solid black;

	padding: 0px;

 	border-radius: 1px;

	background-color: rgb(225,225,225);

	&:hover {

		background-color: rgb(245,245,245);

	}

	&:pressed {

		background-color: rgb(215,215,215);

	}

}

#ScrollLeftButton, 

#ScrollRightButton, 

#ScrollUpButton, 

#ScrollDownButton {

	min-width: 15px;

	max-width: 15px;

}

#ScrollLeftButton {

	image: url("@{image_url}/left_arrow_black.png");

	border-right: 1px solid black;

}

#ScrollRightButton {

	image: url("@{image_url}/right_arrow_black.png");

	border-left: 1px solid black;

}

#ScrollUpButton {

	image: url("@{image_url}/up_arrow_black.png");

	border-bottom: 1px solid black;

}

#ScrollDownButton {

	image: url("@{image_url}/down_arrow_black.png");

	border-top: 1px solid black;

}

/* ------ Viewer, Flipbook ------ */

#ViewerPanel {

	.baseBG(15%);

	& #ToolBarContainer

    {

    	border-top: 1px solid @m_base_lightV;

    	margin-top: 1px;

    	padding-top: 1px;

    }	

}

FlipBook #ToolBarContainer

{

	border-top: 1px solid @m_base_lightV;

	margin-top: 1px;

	padding-top: 1px;

}	

/* Flipbook toolbar-specific */

#ToolBarContainer

{

    & #ScrollLeftButton {

    	margin-top: 1px;

    }

    & #ScrollRightButton {

    	margin-top: 1px;

    }

}

#ViewerFpsSlider

{

	background-color: rgb(192,192,192);

	.set_margin(19px, 0px);

	border: 1px solid black;

	height: 21px;

	&::handle {

		border-image: url("@{image_url}/handle_border.png")6;

		border-width: 6px;

		image: none;

		min-width: 5px;

	}

	&::add-line {

		image: url("@{image_url}/fpssb_g_rarrow.png");

		width: 20px;

		subcontrol-position: right;

		subcontrol-origin: margin;

		margin: 0px;

		&:pressed {

			image: url("@{image_url}/fpssb_g_rarrow_pressed.png");

		}

	}

	&::sub-line {

		image: url("@{image_url}/fpssb_g_larrow.png");

		width: 20px;

		subcontrol-position: left;

		subcontrol-origin: margin;

		margin: 0px;

		&:pressed {

			image: url("@{image_url}/fpssb_g_larrow_pressed.png");

		}

	}

}

#FlipConsolePlayToolBar{

	border: none;

	& QToolButton {

	    height: 14px;

	}

}

FlipSlider {

	qproperty-PBHeight: 20;

	qproperty-PBOverlay: url("@{image_url}/flipslider.png");

	qproperty-PBMarker:  url("@{image_url}/flipmarker.png");

	qproperty-PBColorMarginLeft: 1;

	qproperty-PBColorMarginTop: 1;

	qproperty-PBColorMarginRight: 1;

	qproperty-PBColorMarginBottom: 1;

	qproperty-PBMarkerMarginLeft: 6;

	qproperty-PBMarkerMarginRight: 6;

	qproperty-baseColor: rgb(192,192,192);

	qproperty-notStartedColor: rgb(204,34,34);

	qproperty-startedColor: rgb(200,128,128);

	qproperty-finishedColor: rgb(192,192,192);

}

Ruler {

	qproperty-ParentBGColor: rgb(235,235,235);

	qproperty-ScaleColor: black;

}

#ComboViewerToolOptions{

	border: 1px;

	.base_outset;

}

/*-----------File Browser------------*/

#DirTreeView, #FunctionEditorTree, #ShortcutTree, #FxTreeView

{

	alternate-background-color: lighten(@m_baseBG, 5%);

	border-width: 1px;

	.base_inset;

	margin: 0px;

}

#DirTreeView::branch {

	&:adjoins-item {

		border-image: url("@{image_url}/tree_branch-end.png") 0;

	}

	&:has-siblings {

		border-image: url("@{image_url}/tree_vline.png") 0;

		&:adjoins-item

		{

			border-image: url("@{image_url}/tree_branch-more.png") 0;

		}

	}

	&:has-children {

		&:closed {

			border-image: none;

			image: url("@{image_url}/tree_branch-closed_nosib.png");

		}

		&:open {

			border-image: none;

			image: url("@{image_url}/tree_branch-open_nosib.png");

		} 

		&:has-siblings {

			&:closed {

				border-image: none;

				image: url("@{image_url}/tree_branch-closed.png");

			}

			&:open {

				border-image: none;

				image: url("@{image_url}/tree_branch-open.png");

			}

		}

	}

}

DvItemViewerPanel {

	qproperty-TextColor: black;

	qproperty-AlternateBackground: #8d8d8d;

	qproperty-SelectedTextColor: white;

	qproperty-FolderTextColor: blue;

	qproperty-SelectedItemBackground: rgb(0,0,128);

}

DvDirTreeView {

	qproperty-TextColor: black;

	qproperty-SelectedTextColor: white;

	qproperty-FolderTextColor: blue;

	qproperty-SelectedItemBackground: rgb(0,0,128);

	qproperty-SelectedFolderTextColor: yellow;

	alternate-background-color: lighten(@m_baseBG, 5%);

}

/*---------------------------------------------------------------------------*/ 

/* Cleanup Settings, LoadLevel, PsdSettingsPopup, FxSettingsPopup */

/*---------------------------------------------------------------------------*/

#CleanupSettingsFrame, 

#LoadLevelFrame,

#SolidLineFrame{

	border: 1px solid rgb(20,20,20);

}

#CleanupSettingsHeadLabel, 

#LoadLevelHeadLabel, 

#PsdSettingsHeadLabel, 

#PsdSettingsGroupBox::title, 

#FxSettingsPreviewShowLabel {

	color: rgb(0,0,64);

}

#PsdSettingsGroupBox {

	border: 1px solid rgb(0,0,64);

}

#FileDoesNotExistLabel {

	color: rgb(128,0,0);

}

#CleanupSettingsShowButton, 

#LoadLevelShowButton, 

#FxSettingsPreviewShowButton {

	border-width: 2px;

	padding: 0px;

	margin: 0px;

	border-image: url("@{image_url}/handle_border.png")5;

	image: url("@{image_url}/plus.png");

	image-position: center center;

	&:checked {

		image: url("@{image_url}/minus.png");

	}

}

ParamsPage {

	qproperty-TextColor: black;

}

/*----------- Xsheet ------------*/

/* XSheet scrollAreas (row, column and cell)  */

#xsheetScrollArea 

{	

	border:0px;

}

#xsheetArea, #ScrollArea, #FunctionSegmentViewer

{

	border-width: 2px;

	.base_inset;

	margin: 0px;

}

/*XsheetColumnHeader Right-click menu*/

#xsheetColumnAreaMenu_Preview {	

	background-color: rgb(230,230,120);

}

#xsheetColumnAreaMenu_Lock {

	background-color: rgb(245,245,245);	

}

#xsheetColumnAreaMenu_Camstand {

	background-color: rgb(255,164,128);	

}

#xsheetColumnAreaMenu_Preview, 

#xsheetColumnAreaMenu_Lock, 

#xsheetColumnAreaMenu_Camstand {

	&:selected {

		background-color: rgb(0,0,128);	

	}

}

/* Customize QScrollBar  vertical*/

#XsheetScrollBar {

	background-color: rgb(160,160,160);

	border: 1px solid black;

	&:vertical {

		width: 18px;

		.set_margin( 0px, 20px );

	}

	&:horizontal {

		height: 18px;

		.set_margin( 20px, 0px );

	}

	&::handle {

		border-width: 4;

		image-position: center center;

		&:vertical {

			border-image: url("@{image_url}/sb_g_vhandle.png")4;

			image: url("@{image_url}/sb_g_vline.png");

			min-height: 40px;

		}

		&:horizontal {

			border-image: url("@{image_url}/sb_g_hhandle.png")4;

			image: url("@{image_url}/sb_g_hline.png");

			min-width: 40px;

		}

	}

	/* buttons */

	&::add-line {

		subcontrol-origin: margin;

		&:vertical {

			image: url("@{image_url}/sb_g_downarrow.png");

			height: 20px;

			subcontrol-position: bottom;

			&:pressed {

				image: url("@{image_url}/sb_g_downarrow_pressed.png");

			}

		}

		&:horizontal {

			image: url("@{image_url}/sb_g_rarrow.png");

			width: 20px;

			subcontrol-position: right;

			&:pressed{

				image: url("@{image_url}/sb_g_rarrow_pressed.png");

			}

		}

	}

	&::sub-line {

		subcontrol-origin: margin;

		&:vertical {

			image: url("@{image_url}/sb_g_uparrow.png");

			height: 20px;

			subcontrol-position: top;

			&:pressed {

				image: url("@{image_url}/sb_g_uparrow_pressed.png");

			}

		}

		&:horizontal {

			image: url("@{image_url}/sb_g_larrow.png");

			width: 20px;

			subcontrol-position: left;

			&:pressed{

				image: url("@{image_url}/sb_g_larrow_pressed.png");

			}

		}

	}

	&::add-page {

		background: none;

	}

}

XsheetViewer {

	qproperty-TextColor: black;

	qproperty-BGColor: rgb(164,164,164);

	qproperty-LightLineColor: rgb(146,144,146);

	qproperty-MarkerLineColor: rgb(0, 255, 246);

	qproperty-PreviewFrameTextColor: rgb(0, 0, 255);

	qproperty-CurrentRowBgColor: rgb(210,210,210);

	qproperty-EmptyColumnHeadColor: rgb(200,200,200);

	qproperty-SelectedColumnTextColor: rgb(230, 100, 100);

	qproperty-EmptyCellColor: rgb(124,124,124);

	qproperty-NotEmptyColumnColor: rgb(164,164,164);

	qproperty-SelectedEmptyCellColor: rgb(210,210,210);

	qproperty-LevelColumnColor: rgb(127,219,127);

	qproperty-LevelColumnBorderColor: rgb(47,82,47);

	qproperty-SelectedLevelColumnColor: rgb(191,237,191);

	qproperty-VectorColumnColor: rgb(212,212,133);

	qproperty-VectorColumnBorderColor: rgb(79,79,49);

	qproperty-SelectedVectorColumnColor: rgb(234,234,194);

	qproperty-ChildColumnColor: rgb(214,154,219);

	qproperty-ChildColumnBorderColor: rgb(80,57,82);

	qproperty-SelectedChildColumnColor: rgb(235,205,237);

	qproperty-FullcolorColumnColor: rgb(154,214,219);

	qproperty-FullcolorColumnBorderColor: rgb(57,80,82);

	qproperty-SelectedFullcolorColumnColor: rgb(205,235,237);

	qproperty-FxColumnColor: rgb(130,129,93);

	qproperty-FxColumnBorderColor: rgb(48,48,35);

	qproperty-SelectedFxColumnColor: rgb(193,192,174);

	qproperty-ReferenceColumnColor: rgb(171,171,171);

	qproperty-ReferenceColumnBorderColor: rgb(62,62,62);

	qproperty-SelectedReferenceColumnColor: rgb(213,213,213);

	qproperty-PaletteColumnColor: rgb(42,171,154);

	qproperty-PaletteColumnBorderColor: rgb(15,62,56);

	qproperty-SelectedPaletteColumnColor: rgb(146,221,202);

	qproperty-ColumnHeadPastelizer: rgb(255,255,255);

	qproperty-SelectedColumnHead: rgb(190,210,240);

	qproperty-LightLightBGColor: rgb(250,250,250);

	qproperty-LightBGColor: rgb(240,240,240);

	qproperty-DarkBGColor: rgb(225,225,225);

	qproperty-DarkLineColor: rgb(150,150,150);

}

/*------- Schematic ---------*/ 

#SchematicBottomFrame

{

	margin: 0px;

	padding: 0px;

	.base_outset;

	border-width: 1px;

	border-image: none;

}

#SchematicSceneViewer

{

	background-color: rgb(55,55,55);

}

/*------ Function Editor ---------*/

#FunctionParametersPanel

{

	border: 1px solid rgb(20,20,20);

}

#FunctionEditorTree,#ShortcutTree

{

    &::branch {

    	&:adjoins-item {

    		border-image: url("@{image_url}/tree17_branch-end.png") 0;

    	}

    	&:has-siblings { 

    		border-image: url("@{image_url}/tree17_vline.png") 0;

    		&:adjoins-item {

    			border-image: url("@{image_url}/tree17_branch-more.png") 0;

    		}

    	}

    	&:has-children {

    		&:closed {

    			border-image: none;

    			image: url("@{image_url}/tree17_branch-closed_nosib.png");

    		}

    		&:open {

    			border-image: none;

    			image: url("@{image_url}/tree17_branch-open_nosib.png");

    		}

    		&:has-siblings {

    			&:closed {

    				border-image: none;

    				image: url("@{image_url}/tree17_branch-closed.png");

    			}

    			&:open {

    				border-image: none;

    				image: url("@{image_url}/tree17_branch-open.png");

    			} 

    		}

    	}

    }

}

FunctionPanel {

	qproperty-BGColor: rgb(225,225,225);

	qproperty-ValueLineColor: rgb(186,186,186);

	qproperty-FrameLineColor: rgb(210,210,210);

	qproperty-OtherCurvesColor: rgb(150,150,150);

	qproperty-RulerBackground: rgb(255,255,255);

	qproperty-TextColor: black;

	qproperty-SubColor: white;

	qproperty-SelectedColor: blue;

}

FunctionTreeView {

	qproperty-TextColor: black;

	qproperty-CurrentTextColor: red;

}

SpreadsheetViewer {

	qproperty-LightLightBGColor: rgb(124,124,124);

	qproperty-CurrentRowBgColor: rgb(210,210,210);

	qproperty-LightLineColor: rgb(146,144,146);

	qproperty-MarkerLineColor: rgb(0, 255, 246);

	qproperty-BGColor: rgb(164,164,164);

	qproperty-VerticalLineColor: rgb(0, 0, 0);

	qproperty-KeyFrameColor: rgb(219,139,54);

	qproperty-KeyFrameBorderColor: rgb(82,51,20);

	qproperty-SelectedKeyFrameColor: rgb(237,197,155);

	qproperty-InBetweenColor: rgb(194,194,176);

	qproperty-InBetweenBorderColor: rgb(72,72,65);

	qproperty-SelectedInBetweenColor: rgb(225,225,216);

	qproperty-SelectedEmptyColor: rgb(190,190,190);

	qproperty-SelectedSceneRangeEmptyColor: rgb(210,210,210);

	qproperty-TextColor: black;

	qproperty-ColumnHeaderBorderColor: rgb(46,47,46);

	qproperty-SelectedColumnTextColor: rgb(255, 0, 0);

}

#keyFrameNavigator

{

	border: 0px;

}

#ExpressionField

{

	.base_inset;

	background-color: white;

	border-width: 2px;

	margin: 0px;

}

#FunctionSegmentViewerLinkButton

{