// ====================================================================================================================
// DROPDOWN MENUS
// ====================================================================================================================

@if $dropdowns {

	.dropdown {
		position: relative;
		display: inline-block;
	}

	.dropdown-toggle {
		line-height: 1em;
	}

	.dropdown-toggle:active,
	.open .dropdown-toggle {
		outline: 0;
	}

	// Dropdown arrow/caret
	// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	.caret {
		display: inline-block;
		@extend %caret !optional;

	}

	// The dropdown menu (ul)
	// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	.dropdown-menu {
		@extend %dropdown !optional;
		@include border-bottom-radius($base-border-radius);
		border-style: solid;
		border-width: $input-border;
		float: left;
		left: 0;
		list-style: none;
		margin: -$input-border 0 0 0;
		min-width: em(160px);
		position: absolute;
		top: 100%;
		z-index: $zindex-dropdown;

		&[data-content] { min-width: em(600px); }


		// Aligns the dropdown menu to right
		&.pull-right {
			right: 0;
			left: auto;
		}


		// Links list inside the dropdown
		> li > a {
			@include adjust-font-size-to($base-font-size);
			display: block;
			padding: $dropdowns-padding;
			line-height: 1em;
			clear: both;
			font-weight: normal;
			white-space: nowrap;
		}

		> li:last-child > a {
			@include border-bottom-radius($base-border-radius);
			border-bottom: 0;
		}

	}

	// Hover/Focus state
	// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	.dropdown-menu > li > a:hover,
	.dropdown-menu > li > a:focus,
	.dropdown-submenu:hover > a,
	.dropdown-submenu:focus > a {
		text-decoration: none;
	}

	// Active state
	// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	.dropdown-menu > .active > a,
	.dropdown-menu > .active > a:hover,
	.dropdown-menu > .active > a:focus {
		text-decoration: none;
		outline: 0;
	}

	// Disabled state
	// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	.dropdown-menu > .disabled > a,
	.dropdown-menu > .disabled > a:hover,
	.dropdown-menu > .disabled > a:focus {
		color: $grayLight;
	}
	// Nuke hover/focus effects
	.dropdown-menu > .disabled > a:hover,
	.dropdown-menu > .disabled > a:focus {
		text-decoration: none;
		background-color: transparent;
		background-image: none;
		cursor: default;
	}

	// Open state for the dropdown
	// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	.open {
		*z-index: $zindex-dropdown ;

		.btn.dropdown-toggle[data-toggle=dropdown] {
			@extend %dropdown-open !optional;
			@include border-bottom-radius(0);
			z-index: $zindex-dropdown + 1 !important;

			&:after {
				content: "";
				position: absolute;
				bottom: -1px; left: 0; right: 0;
				height: 2px ;
				z-index: $zindex-dropdown + 2;
			}
		}

		& > .dropdown-menu {}
	}

	// Open/Close Animations
	// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	.dropdown-menu {
		@include transition();
		opacity: 0;
		overflow: hidden;
		max-height: 0;
	}

	.open > .dropdown-menu {
		opacity: 1;
		max-height: 600px;
	}

}