/**
 * Alican Premium 1.5.2 — navigation reliability.
 * Mobile dynamic branches use native details/summary; desktop live dropdowns
 * remain WordPress menu items and need no JavaScript to become visible.
 */

/* Desktop: keep live Information/Categories/Brands dropdowns as a single level. */
@media (min-width: 981px) {
	.site-menu > .alican-live-menu-parent {
		position: relative !important;
	}

	.site-menu > .alican-live-menu-parent > .sub-menu {
		display: grid !important;
		top: calc(100% + 12px) !important;
		left: 50% !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;
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
		border: 1px solid rgba(19, 26, 18, 0.10) !important;
		border-radius: 18px !important;
		background: #fff !important;
		box-shadow: 0 22px 55px rgba(16, 28, 12, 0.14) !important;
		transform: translate(-50%, 8px) !important;
		transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease !important;
		z-index: 120 !important;
	}

	.site-menu > .alican-live-menu-parent:hover > .sub-menu,
	.site-menu > .alican-live-menu-parent:focus-within > .sub-menu {
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
		transform: translate(-50%, 0) !important;
	}

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

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

	.site-menu > .alican-live-menu-parent > .sub-menu > li > a:hover,
	.site-menu > .alican-live-menu-parent > .sub-menu > .current-menu-item > a {
		background: rgba(99, 184, 36, 0.09) !important;
		color: var(--alican-green-dark) !important;
	}

	/* Public header intentionally has only two levels. */
	.site-menu > .alican-live-menu-parent > .sub-menu .sub-menu,
	.site-menu > .alican-live-menu-parent > .sub-menu .mobile-submenu-toggle {
		display: none !important;
	}
}

@media (max-width: 980px) {
	/* Native accordion row. It works without main.js. */
	.mobile-menu > .alican-live-menu-parent {
		position: relative !important;
	}

	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details {
		display: block !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
	}

	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details > .mobile-nav-summary {
		position: relative;
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		min-height: 58px !important;
		padding: 0 54px 0 4px !important;
		list-style: none !important;
		border: 0 !important;
		background: transparent !important;
		color: var(--alican-ink) !important;
		font-family: var(--wp--preset--font-family--manrope, "Manrope", "Segoe UI", Arial, sans-serif) !important;
		font-size: 1rem !important;
		font-weight: 700 !important;
		line-height: 1.3 !important;
		letter-spacing: -0.025em !important;
		cursor: pointer !important;
		-webkit-tap-highlight-color: transparent;
	}

	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details > .mobile-nav-summary::-webkit-details-marker {
		display: none !important;
	}

	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details > .mobile-nav-summary::marker {
		display: none !important;
		content: "" !important;
	}

	.mobile-nav-summary__icon {
		position: absolute;
		top: 7px;
		right: 2px;
		display: grid;
		place-items: center;
		width: 44px;
		height: 44px;
		border: 1px solid transparent;
		border-radius: 12px;
		background: transparent;
		color: var(--alican-ink);
		transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
	}

	.mobile-nav-summary__icon::before {
		display: block;
		width: 8px;
		height: 8px;
		border-right: 1.75px solid currentColor;
		border-bottom: 1.75px solid currentColor;
		content: "";
		transform: translateY(-2px) rotate(45deg);
		transition: transform 180ms ease;
	}

	.mobile-nav-details[open] > .mobile-nav-summary {
		color: var(--alican-green-dark) !important;
	}

	.mobile-nav-details[open] > .mobile-nav-summary .mobile-nav-summary__icon {
		border-color: rgba(99, 184, 36, 0.24);
		background: rgba(99, 184, 36, 0.09);
		color: var(--alican-green-dark);
	}

	.mobile-nav-details[open] > .mobile-nav-summary .mobile-nav-summary__icon::before {
		transform: translateY(2px) rotate(225deg);
	}

	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details > .sub-menu {
		position: static !important;
		display: grid !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;
	}

	/* Browsers hide details content while closed; no JS/class toggling required. */
	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details:not([open]) > .sub-menu {
		display: none !important;
	}

	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details > .sub-menu > li {
		position: static !important;
		min-width: 0 !important;
	}

	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details > .sub-menu > li > a {
		display: flex !important;
		align-items: center !important;
		min-height: 43px !important;
		padding: 9px 11px !important;
		border-radius: 9px !important;
		color: #4f574d !important;
		font-size: 0.84rem !important;
		font-weight: 650 !important;
		line-height: 1.35 !important;
		text-decoration: none !important;
	}

	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details > .sub-menu > li > a:hover,
	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details > .sub-menu > .current-menu-item > a {
		background: #fff !important;
		color: var(--alican-green-dark) !important;
	}

	/* Do not show the old JS accordion control on native dynamic branches. */
	.mobile-menu > .alican-live-menu-parent > .mobile-submenu-toggle,
	.mobile-menu > .alican-live-menu-parent > .mobile-nav-details .mobile-submenu-toggle,
	.mobile-menu > .alican-live-menu-parent .sub-menu .sub-menu {
		display: none !important;
	}
}