// Global, we want all menus to look like this.
ul.dropdown-menu
	box-shadow: $dropdown-box-shadow

	> li
		&:first-child > a
			padding-top: ($dropdown-item-padding-y * 1.5)
		&:last-child > a
			padding-bottom: ($dropdown-item-padding-y * 1.5)

		> a
			padding-top: $dropdown-item-padding-y
			padding-bottom: $dropdown-item-padding-y

	.dropdown-divider
		margin: 0

	.dropdown-item:last-child
		border-bottom-left-radius: $border-radius
		border-bottom-right-radius: $border-radius

// When not in mobile, open menus on mouse hover .dropdown in the navbar.
body:not(.is-mobile)
	nav .dropdown:not(.quick-search):hover
		ul.dropdown-menu
			display: block

	nav .dropdown.large:hover
		.dropdown-menu
			@extend .d-flex

.dropdown.large.show
	@extend .d-flex

	.dropdown-menu.show
		@extend .d-flex

.dropdown-menu-tab
	display: none
	min-width: 100px


	&.show // .dropdown-menu-tab.show
		@extend .d-flex
