/**
 * UN Menu — header navigation / utility widget (modes: menu / account / cart).
 * Reproduces the main-nav look from the design tokens: text #000000B3 at rest,
 * brand rose on hover + active item, on both text and the bottom-border underline
 * (transparent at rest → no layout shift). Account mode adds a white dropdown
 * panel; cart mode adds a live count. Elementor style controls override defaults.
 */

.un-menu {
	font-family: var(--un-font-body);
}

.un-menu__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.un-menu__item {
	display: flex;
}

.un-menu__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: var(--un-fs-m);
	line-height: 1.2;
	color: var(--un-text);
	text-decoration: none;
	padding-top: 6px;
	padding-bottom: 6px;
	border-bottom: 2px solid transparent;
	background: none;
	transition: color 0.15s ease, border-color 0.15s ease;
}
.un-menu__link:hover,
.un-menu__link:focus {
	color: var(--un-rose);
	border-bottom-color: var(--un-rose);
	outline: none;
}
.un-menu__link.is-active {
	color: var(--un-rose);
	border-bottom-color: var(--un-rose);
}

.un-menu__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: var(--un-rose);
}
.un-menu__icon svg {
	width: 16px;
	height: 16px;
	fill: currentColor; /* follow the icon `color` so hover/active colour works */
}
.un-menu__icon i {
	font-size: 16px;
	line-height: 1;
}

/* ---- Trigger (account mode) ---- */
.un-menu__trigger {
	border-left: 0;
	border-right: 0;
	border-top: 0;
	font-family: inherit;
	cursor: pointer;
}
.un-menu__caret {
	width: 10px;
	height: 6px;
	flex-shrink: 0;
	transition: transform 0.15s ease;
}
.un-menu__item--has-panel {
	position: relative;
}
.un-menu__item--has-panel:hover .un-menu__caret,
.un-menu__item--has-panel:focus-within .un-menu__caret {
	transform: rotate(180deg);
}

/* ---- Dropdown panel (account mode) ---- */
.un-menu__panel {
	position: absolute;
	top: 100%;
	right: 0;
	min-width: 200px;
	padding: 6px;
	background: var(--un-white);
	border: 1px solid var(--un-border);
	border-radius: var(--un-radius);
	box-shadow: var(--un-shadow-2);
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(4px);
	transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
}
.un-menu__item--has-panel:hover .un-menu__panel,
.un-menu__item--has-panel:focus-within .un-menu__panel {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.un-menu__panel-list {
	margin: 0;
	padding: 0;
	list-style: none;
}
/* Panel links: vertical, no underline, soft hover fill */
.un-menu__panel .un-menu__link {
	display: flex;
	width: 100%;
	padding: 9px 12px;
	border-bottom: 0;
	border-radius: var(--un-radius);
}
.un-menu__panel .un-menu__link:hover,
.un-menu__panel .un-menu__link:focus {
	background: var(--un-bg-soft);
	color: var(--un-black);
}

/* ---- Cart count (cart mode) ---- */
.un-menu__cart-count {
	font-variant-numeric: tabular-nums;
	line-height: 1;
}