/**
 * Alican Premium 1.5.1 — two-level navigation hardening.
 * Keeps WordPress top-level menu structure while rendering live Information,
 * Categories and Brands children consistently on desktop, tablet and mobile.
 */

/* Never expose a third navigation level in the public header. */
.site-menu .sub-menu .sub-menu,
.mobile-menu .sub-menu .sub-menu {
	display: none !important;
}

/* The accordion control is mobile/tablet-only. */
.site-menu .mobile-submenu-toggle {
	display: none !important;
}

@media (min-width: 981px) {
	/* One clean dropdown level — same treatment for Information/Categories/Brands. */
	.site-menu > .menu-item-has-children {
		position: relative;
	}

	.site-menu > .menu-item-has-children > .sub-menu {
		top: calc(100% + 12px) !important;
		left: 50% !important;
		display: grid !important;
		grid-template-columns: minmax(248px, 1fr) !important;
		gap: 2px !important;
		width: 292px !important;
		min-width: 292px !important;
		max-width: min(292px, calc(100vw - 32px)) !important;
		max-height: min(520px, calc(100vh - 118px)) !important;
		padding: 10px !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		border: 1px solid rgba(19, 26, 18, 0.10) !important;
		border-radius: 18px !important;
		background: rgba(255, 255, 255, 0.99) !important;
		box-shadow: 0 22px 55px rgba(16, 28, 12, 0.14) !important;
		transform: translate(-50%, 8px) !important;
	}

	.site-menu > .menu-item-has-children:hover > .sub-menu,
	.site-menu > .menu-item-has-children:focus-within > .sub-menu {
		transform: translate(-50%, 0) !important;
	}

	.site-menu > .menu-item-has-children > .sub-menu > li {
		position: static !important;
		min-width: 0 !important;
	}

	.site-menu > .menu-item-has-children > .sub-menu > li > a {
		position: relative;
		display: flex !important;
		align-items: center;
		min-height: 44px;
		padding: 10px 12px !important;
		border-radius: 10px !important;
		font-size: 0.86rem !important;
		font-weight: 650 !important;
		line-height: 1.35 !important;
	}

	/* Remove old third-level arrows left by earlier versions. */
	.site-menu > .menu-item > .sub-menu > .menu-item-has-children > a {
		padding-right: 12px !important;
	}

	.site-menu > .menu-item > .sub-menu > .menu-item-has-children > a::after {
		display: none !important;
		content: none !important;
	}
}

@media (max-width: 980px) {
	/* The drawer itself owns scrolling; submenus expand naturally inside it. */
	.mobile-navigation__panel {
		overflow-x: hidden !important;
		overflow-y: auto !important;
		overscroll-behavior: contain;
	}

	.mobile-menu {
		display: block !important;
		width: 100%;
	}

	.mobile-menu > .menu-item {
		position: relative !important;
	}

	.mobile-menu > .menu-item-has-children > a {
		padding-right: 58px !important;
	}

	/* Server-rendered toggle: no dependency on JS creating the control. */
	.mobile-menu > .menu-item-has-children > .mobile-submenu-toggle {
		position: absolute !important;
		top: 7px !important;
		right: 2px !important;
		display: grid !important;
		visibility: visible !important;
		place-items: center;
		width: 44px !important;
		height: 44px !important;
		padding: 0 !important;
		opacity: 1 !important;
		border: 1px solid transparent !important;
		border-radius: 12px !important;
		background: transparent !important;
		color: var(--alican-ink) !important;
		cursor: pointer;
		z-index: 3;
	}

	.mobile-menu > .menu-item-has-children > .mobile-submenu-toggle::before {
		display: block !important;
		width: 8px !important;
		height: 8px !important;
		border: 0 !important;
		border-right: 1.75px solid currentColor !important;
		border-bottom: 1.75px solid currentColor !important;
		content: "" !important;
		transform: translateY(-2px) rotate(45deg) !important;
		transition: transform 180ms ease !important;
	}

	.mobile-menu > .menu-item-has-children.is-submenu-open > .mobile-submenu-toggle {
		border-color: rgba(99, 184, 36, 0.24) !important;
		background: rgba(99, 184, 36, 0.09) !important;
		color: var(--alican-green-dark) !important;
	}

	.mobile-menu > .menu-item-has-children.is-submenu-open > .mobile-submenu-toggle::before {
		transform: translateY(2px) rotate(225deg) !important;
	}

	.mobile-menu > .menu-item-has-children > .sub-menu {
		position: static !important;
		display: none !important;
		grid-template-columns: 1fr !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		max-height: none !important;
		gap: 2px !important;
		margin: 0 0 12px !important;
		padding: 8px !important;
		overflow: visible !important;
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
		border: 1px solid rgba(99, 184, 36, 0.15) !important;
		border-radius: 14px !important;
		background: #f7faf5 !important;
		box-shadow: none !important;
		transform: none !important;
	}

	.mobile-menu > .menu-item-has-children.is-submenu-open > .sub-menu {
		display: grid !important;
	}

	.mobile-menu > .menu-item-has-children > .sub-menu > li {
		position: static !important;
		min-width: 0 !important;
	}

	.mobile-menu > .menu-item-has-children > .sub-menu > li > a {
		display: flex !important;
		align-items: center;
		min-height: 43px !important;
		padding: 9px 11px !important;
		border-radius: 9px !important;
		font-size: 0.84rem !important;
		font-weight: 650 !important;
		line-height: 1.35 !important;
	}

	/* No nested toggle or third-level flyout in the mobile/tablet drawer. */
	.mobile-menu .sub-menu .mobile-submenu-toggle {
		display: none !important;
	}
}
