@import "variables.less";
@import "/jui/less/mixins.less";
@import "mixins/index.less";
// import the appropriate color scheme based on header
@import "menu-@{headerstyle}.less";

.gf-menu {
	// Bottom border fixer
	&.l1 > li {
		&:hover > .item {
			.border-fixer {
				display:block;
				position: absolute;
				height: 2px;
				width: 100%;
				bottom:-2px;
				left: 0px;
				background: @menuDropBack;
				z-index:1001;
			}
		}
	}

	// Default items
	li {
		&:hover, &.active:hover {
			border: 1px solid @menuBorder;
			background: @menuDropBack;
			padding-top: 1px;
			.border-radius(@menuItemRadius);
			border-top: 0;
			.box-shadow(@menuInsetShadow);

			> .dropdown {
				left: -1px;
				top: auto;
				opacity: 1;
			}
		}

		&:hover > .item {
			color: @menuTextHover !important;
			text-shadow: 1px 1px 0 @menuTextShadow;
		}
	}

	// Parent items
	li.parent {
		&:hover {
			.border-radius(@menuItemRadius @menuItemRadius 0 0);
		}
	}

	// Dropdown styling
	.dropdown {
		ul {
			li {
				&:hover {
					border: 0;
					background: none;
					.box-shadow(none);
					padding-top: 1px;

					> .item {
						.border-radius(@menuItemRadius);
						border: 1px solid @menuBorder;
						background: @menuDropBack;
						border-top: 0;
						.box-shadow(@menuFullShadow);

						// Right border fixer
						.border-fixer {
							display:block;
							position: absolute;
							height: 100%;
							width: 2px;
							right:-1px;
							.box-shadow(@menuInsetShadow);
							top: 0px;
							background: @menuDropBack;
							z-index:1001;
						}
					}
				}

				&.parent {
					&:hover {
						> .item {
							.border-radius(@menuItemRadius 0 0 @menuItemRadius);
						}
					}
				}
			}
		}

		// Grouped styling
		.grouped {
			&.parent {
				&:hover {
					> .item {
						.border-radius(@menuItemRadius);
					}
				}
			}
		}

		// Module styling
		.modules {
			&:hover, ul li:hover {
				padding-top: 0 !important;
			}
		}
	}

	// Flyout dropdowns (3rd Level +)
	.dropdown li:hover > .flyout {
		left: 100%;
		top: 1px;
		margin-left: -6px;
		border-top: 0;
		.border-radius(0 5px 5px 5px);
		.box-shadow(@menuFullShadow);
	}
}

// RTL
body.rtl {
	li {
		&:hover, &.active:hover {
			> .dropdown {
				left: inherit;
				right: -1px;
			}
		}
	}
	.dropdown {
		ul {
			li {
				&:hover {
					> .flyout {
						left: inherit;
						right: 100%;
						.border-radius(5px 0 5px 5px);
						margin-left: auto;
						margin-right: -6px;
					}
					> .item {
						// Left border fixer
						.border-fixer {
							right: inherit;
							left: -1px;
						}
					}
				}
				&.parent {
					&:hover {
						> .item {
							.border-radius(0 @menuItemRadius @menuItemRadius 0);
						}
					}
				}
			}
		}
	}
}
