// mixins +++
.thm-linear-gradient-mixin(@start, @end) when (iscolor(@start)) and (iscolor(@end)) {
	background-color: mix(@start, @end, 60%) !important;
    background-image: -moz-linear-gradient(top, @start, @end) !important; // FF 3.6+
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start), to(@end)) !important; // Safari 4+, Chrome 2+
    background-image: -webkit-linear-gradient(top, @start, @end) !important; // Safari 5.1+, Chrome 10+
    background-image: -o-linear-gradient(top, @start, @end !important); // Opera 11.10
    background-image: linear-gradient(to bottom, @start, @end) !important; // Standard, IE10
    background-repeat: repeat-x !important;
    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start),argb(@end))) !important; // IE9 and down
}

.thm-border-radius(@radius) when (ispixel(@radius)) {
  -webkit-border-radius: @radius !important;
     -moz-border-radius: @radius !important;
          border-radius: @radius !important;
}

.thm-box-shadow(@shadow) {
  -webkit-box-shadow: @shadow !important;
     -moz-box-shadow: @shadow !important;
          box-shadow: @shadow !important;
}
.thm-body-background-image(@value) when (isstring(@value)) {
	background-image: url("@{base}@{value}") !important;
}
.thm-body-background-image(@value) when not (isstring(@value)) {
	background-image: @value !important;
}
.thm-rgba-background-color(@simple, @rgba) when (@rgba = false) {
	background-color: @simple !important;
}
.thm-rgba-background-color(@simple, @rgba) when not (@rgba = false) {
	background-color: @simple !important;
	background-color: @rgba !important;
}
// --- mixins

.thm-body {
	color: @main-color;
	background-color: @main-background-color;
	background-size: @main-background-size;
	.thm-body-background-image(@main-background-image);
}

.thm-loading {
	color: @loading-color !important;
	text-shadow: @loading-text-shadow !important;

	.e-spinner .e-bounce {
		background-color: @loading-color !important;
	}
}

.thm-login-desc .desc {
	color: @loading-color !important;
	text-shadow: @loading-text-shadow !important;
}

.thm-login {
	border: @login-border !important;
	.thm-rgba-background-color(@login-background-color, @login-rgba-background-color);
	.thm-linear-gradient-mixin(@login-gradient-start, @login-gradient-end);
	.thm-border-radius(@login-border-radius);
	.thm-box-shadow(@login-box-shadow);

	&.submitting-pane.submitting {
		&:before{
			background: @spinner-background;
			.thm-border-radius(@login-border-radius);
		}
		&:after{
			border-top-color: @spinner-color;
		}
	}
}

.thm-login-text {
	color: @login-color !important;

	.legend, .e-checkbox-icon, .g-ui-link, .social-button, .language-button {
		color: @login-color !important;
	}
}

.thm-powered, .thm-mobile-switcher {
	color: @powered-color;
	a {
		color: @powered-color;
		&:hover {
			color: lighten(@powered-color, 20%);
		}
	}
}

.thm-languages {
	color: @languages-color;
	.flag-name {
		color: @languages-color;
		border-color: @languages-color;
	}
}

.g-ui-menu {
	color: @dropdown-menu-color !important;
	background-color: @dropdown-menu-background-color !important;
}

.g-ui-menu .e-item > .e-link {
	color: @dropdown-menu-color !important;
	background-color: @dropdown-menu-background-color !important;

	> i {
		color: @dropdown-menu-color !important;
	}
}

.g-ui-menu .e-item.selected > .e-link {
	background-color: @dropdown-menu-selected-background-color !important;
}

.g-ui-menu .e-item > .e-link:hover, .g-ui-menu .e-item > .e-link:focus {
	color: @dropdown-menu-hover-color !important;
	background-color: @dropdown-menu-hover-background-color !important;

	> i {
		color: @dropdown-menu-hover-color !important;
	}
}

.g-ui-menu .e-item.disabled > .e-link, .g-ui-menu .e-item.disabled > .e-link:hover {
	color: @dropdown-menu-disabled-color !important;
	background-color: @dropdown-menu-background-color !important;

	> i {
		color: @dropdown-menu-disabled-color !important;
	}
}

.thm-message-list-top-toolbar, .thm-message-list-bottom-toolbar {
	.thm-rgba-background-color(@message-list-toolbar-background-color, @message-list-toolbar-rgba-background-color);
	.thm-linear-gradient-mixin(@message-list-toolbar-gradient-start, @message-list-toolbar-gradient-end);
}

.thm-folders .e-link {

	color: @folders-disabled-color !important;

	&.selectable {
		color: @folders-color !important;
	}

	&.selectable:hover {
		color: @folders-hover-color !important;
		.thm-rgba-background-color(@folders-hover-background-color, @folders-hover-rgba-background-color);
	}

	&.selectable.selected {
		color: @folders-selected-color !important;
		.thm-rgba-background-color(@folders-selected-background-color, @folders-selected-rgba-background-color);
	}

	&.focused {
		color: @folders-focused-color !important;
		.thm-rgba-background-color(@folders-focused-background-color, @folders-focused-rgba-background-color);
	}

	&.selectable.droppableHover {
		color: @folders-drop-color !important;
		.thm-rgba-background-color(@folders-drop-background-color, @folders-drop-rgba-background-color);
	}
}

.thm-settings-menu .e-item {

	.e-link {
		color: @settings-menu-disabled-color !important;
	}

	&.selectable .e-link {
		color: @settings-menu-color !important;
	}

	&.selectable:hover .e-link {
		.thm-rgba-background-color(@settings-menu-hover-background-color, @settings-menu-hover-rgba-background-color);
		color: @settings-menu-hover-color !important;
	}

	&.selectable.selected .e-link {
		.thm-rgba-background-color(@settings-menu-selected-background-color, @settings-menu-selected-rgba-background-color);
		color: @settings-menu-selected-color !important;
	}
}

.thm-message-view-background-color {
	.thm-rgba-background-color(@message-background-color, @message-rgba-background-color);
}

#rl-app{
	display: block;
}

html.no-css {

	margin: 0;
	padding: 0;
	font-family: Arial, Verdana, Geneva, sans-serif;

	body {
		margin: 0;
		padding: 0;
	}

	#rl-loading, #rl-loading-error {
		position: absolute;
		font-size: 30px;
		line-height: 130%;
		top: 50%;
		width: 100%;
		height: 65px;
		margin: 0;
		margin-top: -60px;
		background-color: transparent;
		text-align: center;
		color: #333;
	}

	.progressjs-container {
		display: none;
	}

	.thm-body {
		color: #333;
		background-color: #aaa;
		background-image: none;
	}

	.thm-loading {
		color: #333 !important;
		text-shadow: none !important;

		.e-spinner .e-bounce {
			display: none !important;
		}
	}

	.thm-login-desc .desc {
		color: #333 !important;
		text-shadow: none !important;
	}
}

// glass style
html.glass {

	@glass-color: #fff !important;
	@glass-p-color: #aaa !important;
	@glass-error-color: #f76260 !important;
	@glass-m-color: rgba(255, 255, 255, .8) !important;

	.thm-login {
		background: none !important;
		background: rgba(0, 0, 0, .5) !important;
		box-shadow: none !important;

		border: none !important;
		border: 1px solid rgba(255, 255, 255, .2) !important;

		.controls {
			.input-append .add-on i {
				color: @glass-m-color;
				text-shadow: none !important;
				outline: none !important;
				box-shadow: none !important;
			}

			input {
				border: 1px solid none !important;
				background: none !important;
				outline: none !important;
				text-shadow: none !important;
				box-shadow: none !important;

				color: @glass-color;
				border-color: @glass-m-color;

				&::-webkit-input-placeholder {
					color: @glass-color;
					text-shadow: none !important;
				}
				&::-moz-placeholder {
					color: @glass-color;
					text-shadow: none !important;
				}
				&:-moz-placeholder {
					color: @glass-color;
					text-shadow: none !important;
				}
				&:-ms-input-placeholder {
					color: @glass-color;
					text-shadow: none !important;
				}
				&:input-placeholder {
					color: @glass-color;
					text-shadow: none !important;
				}
				&:placeholder {
					color: @glass-color;
					text-shadow: none !important;
				}

				&:focus, &:hover {
					border-color: @glass-color;
				}
			}
			.btn {
				border: 1px solid none !important;
				background: none !important;
				outline: none !important;
				text-shadow: none !important;
				box-shadow: none !important;

				color: @glass-color;
				border-color: @glass-m-color;

				text-transform: uppercase;
				font-size: 13px;

				&:hover, &:active{
					border-color: @glass-color;
				}
			}

			&.error {
				.input-append .add-on i {
					color: @glass-error-color;
				}

				input {
					color: @glass-error-color;
					border-color: @glass-error-color;
				}
			}
		}
	}

	.thm-login-text {
		color: @glass-m-color;
		text-shadow: none !important;

		.legend, .e-checkbox-icon, .g-ui-link, .social-button, .language-button {
			color: @glass-m-color;
			text-shadow: none !important;
		}
	}
}