/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */

.eb-advanced-navigation-wrapper {
	margin-bottom: 20px;
	&.preset-3 {
		.wp-block-navigation__container
			> .wp-block-navigation-item
			> *:not(.wp-block-navigation__submenu-container) {
			z-index: 1;
		}
		.wp-block-navigation__container
			> .wp-block-navigation-item.current-menu-item,
		.wp-block-navigation__container > .wp-block-navigation-item:hover {
			position: relative;

			&::before {
				content: "";
				position: absolute;
				right: 0;
				top: 50%;
				width: 100%;
				height: 70%;
				// background-color: #2673ff;
				z-index: 0;
				transform: translateY(-50%);
			}
		}
	}

	&.preset-4 {
		.wp-block-navigation__responsive-container:not(.is-menu-open) {
			.wp-block-navigation__container
				> .wp-block-navigation-item:not(:last-child) {
				position: relative;

				&::after {
					content: "";
					position: absolute;
					left: auto;
					right: 0;
					top: 50%;
					width: 1px;
					height: 10px;
					// background-color: #d9d9d9;
					transform: translateY(-50%);
				}
			}

			.wp-block-navigation__submenu-container .wp-block-navigation-item {
				border-bottom: 1px solid #e7f0ff;
			}
		}
	}
	.wp-block-navigation {
		box-shadow: 0px 22px 35px rgba(98, 103, 145, 0.15);
	}

	// .wp-block-navigation-item {
	// }

	.wp-block-navigation-item__content {
		font-size: 14px;
		line-height: 12px;
		text-decoration: none;

		&:hover {
			text-decoration: none !important;
		}
		// padding: 20px 10px;
	}

	// dropdown menu
	.wp-block-navigation__submenu-container {
		z-index: 99;
		.wp-block-navigation-item:first-child {
			border-top-left-radius: inherit;
			border-top-right-radius: inherit;
		}
		.wp-block-navigation-item:last-child {
			border-bottom-left-radius: inherit;
			border-bottom-right-radius: inherit;
		}
	}

	&.is-vertical {
		&.items-justified-center {
			.wp-block-navigation__responsive-container.is-menu-open {
				.wp-block-navigation__submenu-container {
					left: 0 !important;
					transform: none !important;
				}
			}
		}

		&.items-justified-center
			.wp-block-navigation__container
			> .wp-block-navigation-item {
			justify-content: center;

			.wp-block-navigation__submenu-container {
				left: 50%;
				transform: translateX(-50%);

				.wp-block-navigation__submenu-container {
					left: 100%;
					transform: none;
				}
			}
		}

		&.items-justified-right
			.wp-block-navigation__container
			> .wp-block-navigation-item {
			justify-content: right;
		}

		&.items-justified-left
			.wp-block-navigation__container
			> .wp-block-navigation-item {
			justify-content: left;
		}

		// &.vertical-preset-1 {
		// 	.wp-block-navigation-item:not(:last-child) {
		// 		border-bottom: 1px solid red;
		// 	}
		// }

		&.vertical-preset-2 {
			.wp-block-navigation {
				padding: 20px;
			}

			// .wp-block-navigation-item:hover,
			// .current-menu-item {
			// 	background-color: #f5f9ff;

			// 	.wp-block-navigation-item__content {
			// 		color: #2673ff;
			// 	}
			// }
		}
		.wp-block-navigation__container {
			width: 100%;

			> .wp-block-navigation-item {
				// width: 100%;
				width: -webkit-fill-available;
			}
		}
	}

	&.remove-dropdown-icon .wp-block-navigation__submenu-icon {
		display: none;
	}

	.wp-block-navigation__toggle_button_label {
		font-size: inherit;
		font-weight: inherit;
	}

	// hamburger
	.wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation__container {
		width: 100%;
	}

	// open
	.wp-block-navigation__responsive-container-open {
		opacity: 1;
	}

	// close icon
	&.close-icon-left .wp-block-navigation__responsive-container-close {
		left: 0;
		right: auto;
	}

	&.close-icon-center .wp-block-navigation__responsive-container-close {
		left: 50%;
		right: auto;
		transform: translateX(-50%);
	}

	.wp-block-navigation__responsive-container:not(.is-menu-open.is-menu-open) {
		border-radius: inherit;
	}
}
