//
// Component: Dropdown
//
// ========================================================================


// Variables
// ========================================================================

@dropdown-z-index:                              (@global-z-index + 20);
@dropdown-background:                           @global-background;
@dropdown-color:                                @global-panel-color;
@dropdown-padding:                              15px;
@dropdown-width:                                240px;
@dropdown-divider-border:                       @global-border;
@dropdown-small-padding:                        15px;

@dropdown-navbar-margin:                        40px;
@dropdown-navbar-background:                    @global-background;
@dropdown-navbar-padding:						10px;
@dropdown-navbar-color:                         @global-panel-color;
@dropdown-animation:							uk-fade;
@dropdown-sidemenu-animation:					@dropdown-animation;

@dropdown-border-radius:						@global-border-radius;
@dropdown-box-shadow-size: 						@global-box-shadow-size;
@dropdown-box-shadow: 							@global-box-shadow;
@dropdown-navbar-animation:						@dropdown-animation;


// Component
// ========================================================================

.hook-dropdown() {
	border-radius: @dropdown-border-radius;
	box-shadow: inset -1px -1px 0 @global-darker-shadow, 
				inset 1px 0 0 @global-darker-shadow, 
				2px 2px 1px @global-dark-shadow,
				inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

// Modifier: `uk-dropdown-navbar`
// ========================================================================

.hook-dropdown-navbar() {

	padding: @dropdown-navbar-padding;

	.uk-nav-navbar ul a,
	.uk-nav-navbar > li > a {
		padding: 3px 10px;
		font-size: @navbar-nav-font-size;
		text-transform: @navbar-nav-text-transform;
		letter-spacing: @navbar-nav-letter-spacing;
		border-radius: @global-border-radius;
	}

	.uk-nav-header {
		padding: 7px 10px 0;
		margin-bottom: 7px;
		border-bottom: 1px dotted fade(@theme-menuitem-color, 20%);
		letter-spacing: 1px;
	}

	.uk-nav-navbar ul li a:hover,
	.uk-nav-navbar > li > a:hover,
    .uk-nav-navbar > li > a:focus,
	.uk-nav-navbar > li.uk-active > a,
	.uk-nav-navbar ul li.uk-active > a {
		background-color: @theme-menuitem-hover-background;
		color: @theme-menuitem-hover-color;
		box-shadow: inset 0 -1px 0 @global-darker-shadow, 
					inset 0 1px 0 rgba(255, 255, 255, 0.075);
	}

	.uk-nav-navbar ul li:first-child a:hover,
	.uk-nav-navbar > li:first-child > a:hover,
	.uk-nav-navbar > li:first-child > a:focus,
	.uk-nav-navbar > li.uk-active:first-child > a,
	.uk-nav-navbar ul li.uk-active:first-child > a {
	    box-shadow: inset 0 -1px 0 @global-darker-shadow;
	}
}


// Miscellaneous
// ========================================================================

.hook-dropdown-misc() {

	/* Nav in dropdown
	 ========================================================================== */

	.uk-dropdown .uk-nav { margin: 0; }

	/* button dropdown */
	.uk-button-dropdown .uk-dropdown .uk-nav {
		margin: 0 15px 0 0;
	}
}
