// Turret
@import './turret.less';

// Theme
@import './theme.less';

// Turret Overrides
@import './turret/button.less';
@import './turret/button-group.less';
@import './turret/control.less';
@import './turret/definition-list.less';
@import './turret/fieldset.less';
@import './turret/input.less';
@import './turret/inputs-inline.less';
@import './turret/input-group.less';

// Template
@import './template/login.less';
@import './template/sidebar.less';
@import './template/main.less';
@import './template/content.less';
@import './template/footer.less';
@import './template/footer-bar.less';
@import './template/edit.less';
@import './template/bulkhead.less';
@import './template/finder.less';
@import './template/panel.less';
@import './template/modal.less';
@import './template/preview.less';
@import './template/standalone.less';

// Components
@import './components/alert.less';
@import './components/breadcrumbs.less';
@import './components/card.less';
@import './components/caret.less';
@import './components/cell.less';
@import './components/checkbox.less';
@import './components/data-table.less';
@import './components/datetime.less';
@import './components/draggable.less';
@import './components/dropdown.less';
@import './components/filedrop.less';
@import './components/form-input.less';
@import './components/gallery.less';
@import './components/list.less';
@import './components/media.less';
@import './components/message.less';
@import './components/meter.less';
@import './components/upload-progress.less';
@import './components/icon.less';
@import './components/image.less';
@import './components/image-filter.less';
@import './components/progress.less';
@import './components/sections.less';
@import './components/separator.less';
@import './components/status.less';
@import './components/tile.less';
@import './components/toolbar.less';
@import './components/color-card.less';
@import './components/slider.less';
@import './components/switch.less';
@import './components/swatch.less';
@import './components/tabs.less';
@import './components/tooltip.less';
@import './components/tree.less';
@import './components/well.less';
@import './components/table.less';

// Fixed Data Table
@import './lib/fixed-data-table-base.less';
@import './lib/fixed-data-table.less';

// React Virtualized
@import './lib/react-virtualized.less';

// React Color Picker
@import './lib/react-color.less';

// Redactor
@import './redactor.less';

// Z Index
@import './zindex.less';

/*
 * Temp
 */

textarea {
	max-width: 100%;
	.transition(none);
}

.button + .button,
button + button,
.input + .input,
input + input,
.input + .select,
input + .select,
.select + .input,
.select + input,
.select + .select,
.input + .button,
.input + button,
.select + .button,
.select + button,
.dropdown + .button,
.button + .dropdown,
.dropdown + .dropdown,
.dropup + .button,
.button + .dropup,
.dropup + .dropup,
.button-group + .button,
.button + .button-group,
.button-group + .button-group,
input + .button-group,
.button-group + input {
	margin-left: @margin-xsmall;
}

.cell-list + button,
.cell-list + .button-group {
	margin-top: @gutter;
}

input[readonly],
textarea[readonly],
select[readonly] {
	background-color: @grey-100;
}

.button-group {
	vertical-align: top;
}

.trancate() {
	.truncate();
}

.button-group .button-group.dropdown:last-child .button,
.button-group .button-group.dropup:last-child .button {
	border-top-right-radius: @border-radius !important;
	border-bottom-right-radius: @border-radius !important;
}

.button-group .button-group:not(:last-child) .button-group.dropdown .button,
.button-group .button-group:not(:last-child) .button-group.dropup .button {
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
}

.media > canvas {
	display: block;
	.cover();
	width: 100% !important;
	height: 100% !important;
}

blockquote {
	position: relative;

	&:before {
		position: absolute;
		top: 0;
		left: 0;
		content: '“';
		.bold-font();
		.font-size(3.6);
		color: @mid-grey;
		line-height: 1;
	}
}

/*
 * Mixins
 */

.uppercase() {
	letter-spacing: 0.1rem;
	text-transform: uppercase;
}

/*
 * General
 */

html,
body {
	min-height: 100%;
}

body {
	.clearfix();

	@media @small-down {
		padding-bottom: @height-xlarge;
	}
}

@media @small-down {
	body.sidebar-is-open {
		overflow: hidden;

		.sidebar {
			transform: translateX(0);
		}

		.main,
		.footer-bar {
			transform: translateX(240px);
		}
	}
}

.spacer {
	display: inline-block;
	width: 10px;
}

/*
 * Tags input overrides
 */

.react-tagsinput {
	margin: 0.8rem 0;
}

.react-tagsinput-tag {
	display: inline-block;
	margin: 0.2rem;
	padding: (@padding-xsmall / 2) @padding-xsmall;
	.font-size(@font-size-small);
	color: @white;
	background: @primary;
	border: none;
	border-radius: @border-radius;
}

.react-tagsinput-remove {
	margin-left: @margin-xsmall;
	font-size: 10px;
	color: @white;
	cursor: pointer;
	vertical-align: middle;

	&:before {
		content: '✕';
	}
}

.react-tagsinput-input {
}

/*
 * Tags input overrides
 */

.loader {
	position: relative;
	width: 20px;
}

.loader-center {
	.square(80px);
	.center();
	background-color: @white;
	border-radius: 100%;
	.spinner {
		.center();
	}
}

.inputs-inline .status {
	margin-right: 0;
	margin-left: @margin-xsmall;
}

/*
 * Autosuggest overrides
 */

.dropdown-menu.open {
	overflow: auto;
}

.autosuggest-container {
	position: relative;
	flex: 1 1 auto;

	.spinner {
		position: absolute;
		top: 1.8rem;
		right: @margin-small;
	}
}

.flex-auto {
	flex: auto;
}

/**
 * Allows google maps autosuggest to appear on top of modals
 */
.pac-container {
	z-index: 999999 !important;
}

/**
 * Fix Selects so arrow does not cover select text
 */

.select select {
	padding-right: @input-height;
}

.select.select-xsmall select {
	padding-right: @input-xsmall-height;
}

.select.select-small select {
	padding-right: @input-small-height;
}

.select.select-medium select {
	padding-right: @input-height;
}

.select.select-large select {
	padding-right: @input-large-height;
}

.select.select-xlarge select {
	padding-right: @input-xlarge-height;
}

select:disabled {
	cursor: default;
}

.background-grey-000 {
	background-color: @grey-000;
}

.background-grey-100 {
	background-color: @grey-100;
}

.background-grey-200 {
	background-color: @grey-200;
}

.background-grey-300 {
	background-color: @grey-300;
}

.background-grey-400 {
	background-color: @grey-400;
}

.background-grey-500 {
	background-color: @grey-500;
}

.background-grey-600 {
	background-color: @grey-600;
}

.background-grey-700 {
	background-color: @grey-700;
}

.background-grey-800 {
	background-color: @grey-800;
}

.background-grey-900 {
	background-color: @grey-900;
}