//
// @file
//
// Adaptation of bootstrap.less, with appropriate overrides.
//

// =============================
// = Core variables and mixins =
// =============================
@import "bootstrap/mixins.less";
@import "timely-mixins.less";
@import "bootstrap/variables.less";
@import "timely-variables.less"; // Modify this for custom colors, fonts, etc.

// =========
// = Fonts =
// =========
@import "timely-font-awesome.less";

// =============
// = Bootstrap =
// =============

// Reset
.timely { @import "bootstrap/normalize.less"; }

// Core CSS
.timely { @import "bootstrap/scaffolding.less"; }
.timely { @import "bootstrap/code.less"; }
@import "bootstrap/grid.less";
.timely { @import "bootstrap/tables.less"; }
.timely { @import "bootstrap/forms.less"; }
.timely { @import "bootstrap/buttons.less"; }
.timely { @import "bootstrap/type.less"; }

// Components
@import "bootstrap/component-animations.less";
@import "bootstrap/dropdowns.less";
@import "bootstrap/button-groups.less";
@import "bootstrap/input-groups.less";
.timely { @import "bootstrap/navs.less"; }
@import "bootstrap/labels.less";
@import "bootstrap/jumbotron.less";
@import "bootstrap/alerts.less";
@import "bootstrap/panels.less";
@import "bootstrap/wells.less";
.timely { @import "bootstrap/close.less"; }

// Components w/ JavaScript
@import "bootstrap/modals.less";
@import "bootstrap/tooltip.less";
@import "bootstrap/popovers.less";

// Utility classes
@import "bootstrap/utilities.less";

// ===========
// = Plugins =
// ===========

@import "plugins/select2.less";
@import "plugins/datepicker3.less";

// ==========================
// = Unnamespaced overrides =
// ==========================

//
// Bootstrap
//

// Popovers
.ai1ec-popover-title {
	font-family: @headings-font-family;
	font-size: @font-size-base * 1.25 !important;
}
.ai1ec-popover-content {
	border-radius: 0 0 4px 4px;
	p {
		margin: 0;
	}
}
.ai1ec-popover {
	ul.ai1ec-fa-ul {
		text-indent: -0.6em;
	}
}
// Dropdowns
ul.ai1ec-dropdown-menu {
	list-style: none;
	margin: 0;
	li {
		margin: 0;
	}
}
// Buttons
.ai1ec-btn-group > .ai1ec-btn-primary {
	z-index: 3;
}
// Modals
.ai1ec-modal {
	text-align: left;
}
.timely h4.ai1ec-modal-title {
	margin: 0;
}
.ai1ec-modal-footer {
	margin-top: 0;
}
// Collapse & accordions
.ai1ec-panel-group {
	margin-bottom: 0;
	.ai1ec-panel {
		&.ai1ec-overflow-visible {
			overflow: visible;
		}
		background-color: @body-bg;
		table {
			margin-bottom: 0;
		}
	}
}
.ai1ec-panel-heading {
	text-transform: uppercase;
	.ai1ec-fa:before {
		font-size: 1.1em;
		width: 1.25em;
		text-align: center;
	}
	a:hover {
		text-decoration: none;
	}
}

//
// Select2
//

.select2-container {
	margin-bottom: 9px;
	width: 100%;
}
.select2-choices {
	border-radius: 3px;
	.ai1ec-box-shadow( inset 0 1px 1px rgba(0,0,0,.075) );
	.select2-dropdown-open & {
		border-radius: @input-border-radius @input-border-radius 0 0;
	}
	.select2-dropdown-open.select2-drop-above & {
		border-radius: 0 0 @input-border-radius @input-border-radius;
	}
}
.select2-container-multi {
	.select2-choices {
		background-color: @input-bg;
		background-image: none;
		border-color: @input-border;
		.select2-search-field input {
			color: @text-color;
			margin: 0;
			padding: 6px 12px 4px;
			&.select2-default {
				color: @input-color-placeholder !important;
			}
		}
	}
}
.select2-drop-mask {
	z-index: @zindex-dropdown - 1;
	.ai1ec-modal-open & {
		z-index: @zindex-dropdown + @zindex-modal-background - 1;
	}
}
.select2-drop {
	background-color: @body-bg;
	border-color: rgba(82,168,236,.8);
	color: @text-color;
	font-family: @font-family-base;
	font-size: @font-size-base;
	line-height: @line-height-base;
	z-index: @zindex-dropdown;
	.ai1ec-modal-open & {
		z-index: @zindex-dropdown + @zindex-modal-background;
	}
}
.select2-results {
	margin: 4px 0;
	padding: 0;
	.select2-no-results,
	.select2-searching,
	.select2-selection-limit {
		background-color: mix( @text-color, @body-bg, 10% );
	}
}
.select2-result {
	margin: 0;
}
.timely a.select2-search-choice-close {
	.ai1ec-transition( none );
	background: url('../img/select2.png') right top no-repeat;
	left: 5px;
	top: 3px;
}
.select2-container,
.select2-drop {
	.ai1ec-color-swatch,
	.ai1ec-color-swatch-empty {
		width: 7px;
		height: 7px;
	}
}

// ========================
// = Namespaced overrides =
// ========================
.timely {
	//
	// Extra Resets
	//

	// Copied from scaffolding body reset, with additions; needed to apply to
	// .timely, not body.
	font-family: @font-family-base;
	font-size: @font-size-base;
	line-height: @line-height-base;
	color: @text-color;

	h4 {
		font-size: 14px;
		font-weight: bold;
		line-height: @line-height-base * 1.5;
	}
	hr {
		margin: 14px 0;
	}

	//
	// Forms
	//

	input[type="radio"] {
		margin: 0 3px 0 0;
	}
	input[type="checkbox"] {
		margin: -1px 3px 0 0;
	}
	textarea.ai1ec-form-control {
		height: auto;
	}
	.ai1ec-help-block {
		color: #777;
		margin-top: 2px;
		margin-bottom: 5px;
	}
	.ai1ec-form-group {
		margin-bottom: 10px;
	}
	label {
		font-weight: normal;
	}

	// Code
	pre {
		overflow: auto;
		white-space: nowrap;
	}

	//
	// Navs
	//
	.ai1ec-nav.ai1ec-nav-tabs {
		margin-bottom: @navbar-padding-vertical;
	}
	.ai1ec-tab-pane h4:first-child {
		margin-top: 0;
	}

	//
	// Close
	//
	button.ai1ec-close {
		padding: 0;
		cursor: pointer;
		background: transparent;
		border: 0;
		-webkit-appearance: none;
	}
}

// AJAX loaders
.ai1ec-loader-icon {
	background: url('../img/ajax-loader.gif') no-repeat center center;
	display: inline-block;
	height: 32px;
	width: 32px;
	vertical-align: bottom;
}
.ai1ec-loader-icon-small {
	background: url('../img/ajax-loader-small.gif') no-repeat center center;
	display: inline-block;
	height: 16px;
	width: 16px;
	vertical-align: bottom;
}

// Tooltip triggers
.ai1ec-tooltip-toggle {
	cursor: help;
	border-bottom: 1px dotted @gray-light;
}

// =======================================================================
// = Modal open status tracking (adapted from earlier ver. of Bootstrap) =
// =======================================================================
// Recalculate z-index where appropriate
.ai1ec-modal-open {
	.ai1ec-dropdown-menu {
		z-index: @zindex-dropdown + @zindex-modal-background !important;
	}
	.ai1ec-dropdown.ai1ec-open {
		*z-index: @zindex-dropdown + @zindex-modal-background !important;
	}
	.ai1ec-popover {
		z-index: @zindex-popover  + @zindex-modal-background !important;
	}
	.ai1ec-tooltip {
		z-index: @zindex-tooltip  + @zindex-modal-background !important;
	}
}

// Accordion headings custom styling
.ai1ec-panel-heading {
	font-size: 14px;
	font-weight: bold;
}

// =============================================================================
// = Category colors (should be synced with vortex/less/style.less)            =
// =============================================================================

.ai1ec-color-swatch,
.ai1ec-color-swatch-empty {
	display: inline-block;
	height: 6px;
	margin: 0 1px;
	padding: 1px;
	width: 6px;
}
.ai1ec-color-swatch {
	border-radius: 4px;
	border-color: rgba(0,0,0,0.5);
	.ai1ec-opacity( 0.8 );
}

// ============================================================================
// = Gmaps Autocomplete results (synced with interactive-frontend.less)       =
// ============================================================================

.ai1ec-geo-ac-results-not-ready {
	// Hide by default (using a hiding attribute unused by the library).
	// Only show once we have had a chance to do some markup-based styling in JS.
	visibility: hidden;
}
.ai1ec-geo-ac-results {
	img {
		float: left;
		margin-right: 5px;
	}
	.ai1ec-dropdown-menu {
		display: block;
		width: 275px;
		li {
			clear: left;
			color: @dropdown-link-color;
			cursor: pointer;
			margin: 2px 0;
			padding: 0 5px;
			&:hover {
				color: @dropdown-link-hover-color;
				background-color: @dropdown-link-hover-bg;
			}
		}
	}
	.ai1ec-modal-open & {
		z-index: @zindex-dropdown + @zindex-modal-background;
	}
}

.ai1ec-alert-highlight {
	.ai1ec-alert-variant(@background-alert-highlight; @border-alert-highlight; @text-color-alert-highlight);
	border-radius: 0px;	
	font-size: @font-size-text-highlight!important;
}

.ai1ec-btn-primary-highlight {
	//color, background, border
	.ai1ec-button-variant(@background-alert-highlight; @text-color-alert-highlight; @background-alert-highlight);	
	font-size: @font-size-text-highlight!important;

	border-color: @background-alert-highlight!important;
	color: @background-alert-highlight!important;
 	background-color: @text-color-alert-highlight!important;	

	&:hover,
  	&:focus,
  	&:active,
  	&.ai1ec-active,
  	.ai1ec-open {
  		border-color: @background-alert-highlight!important;
	    color: @background-alert-highlight!important;
    	background-color: darken(@text-color-alert-highlight, 8%)!important;
  	}
}

.ai1ec-btn-default-highlight {
	//color, background, border
	.ai1ec-button-variant(@text-color-alert-highlight; @background-alert-highlight; @text-color-alert-highlight);	
	font-size: @font-size-text-highlight!important;
	
	border-color: @text-color-alert-highlight!important;
	color: @text-color-alert-highlight!important;
    background-color: @background-alert-highlight!important;

	&:hover,
  	&:focus,
  	&:active,
  	&.ai1ec-active,
  	.ai1ec-open {
  		border-color: @text-color-alert-highlight!important;
	    color: @text-color-alert-highlight!important;
    	background-color: darken(@background-alert-highlight, 8%)!important;
  	}
}


// ===========================
// = Dashboard common styles =
// ===========================

@import "timely-admin.less";