/*
 * WHT desktop dropdown contract.
 * Reference: the Málaga City Wine Tasting header.
 */
@media (min-width: 1200px) {
	:where(
		.wht-home-unified-header__group,
		.wht-home-code-menu-group,
		[class^="wht-"][class*="-header__menu-group"]
	) {
		position: relative;
		display: inline-flex;
		align-items: center;
	}

	:where(
		.wht-home-unified-header__group > button,
		.wht-home-code-menu-button,
		[class^="wht-"][class*="-header__menu-button"]
	) {
		appearance: none;
		display: inline-flex;
		min-height: 36px;
		align-items: center;
		justify-content: center;
		gap: 7px;
		border: 0 !important;
		border-radius: 0 !important;
		padding: 0.52em 0.72em !important;
		background: transparent;
		box-shadow: none !important;
		color: #fffaf0 !important;
		-webkit-text-fill-color: #fffaf0 !important;
		font-family: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
		font-size: 0.9rem !important;
		font-weight: 650 !important;
		line-height: 1.2 !important;
		letter-spacing: 0 !important;
		text-decoration: none !important;
		text-transform: none !important;
		white-space: nowrap;
		cursor: pointer;
		transition: background-color 160ms ease, color 160ms ease;
	}

	:where(
		.wht-home-unified-header__group:hover > button,
		.wht-home-unified-header__group:focus-within > button,
		.wht-home-unified-header__group.is-open > button,
		.wht-home-code-menu-group:hover > .wht-home-code-menu-button,
		.wht-home-code-menu-group:focus-within > .wht-home-code-menu-button,
		.wht-home-code-menu-group.is-open > .wht-home-code-menu-button,
		[class^="wht-"][class*="-header__menu-group"]:hover > [class*="-header__menu-button"],
		[class^="wht-"][class*="-header__menu-group"]:focus-within > [class*="-header__menu-button"],
		[class^="wht-"][class*="-header__menu-group"].is-open > [class*="-header__menu-button"]
	) {
		background: #045cb4 !important;
		color: #fffaf0 !important;
	}

	:where(
		.wht-home-unified-header__group > button,
		.wht-home-code-menu-button,
		[class^="wht-"][class*="-header__menu-button"]
	)::after {
		display: block !important;
		flex: 0 0 auto;
		width: 6px !important;
		height: 6px !important;
		margin: 0 !important;
		border-top: 0;
		border-left: 0;
		border-right: 1px solid currentColor;
		border-bottom: 1px solid currentColor;
		content: "";
		transform: translateY(-2px) rotate(45deg) !important;
	}

	:where(
		.wht-home-unified-header__submenu,
		.wht-home-code-submenu,
		[class^="wht-"][class*="-header__submenu"]
	) {
		position: absolute;
		top: 100%;
		left: 0 !important;
		z-index: 9999;
		width: min(368px, calc(100vw - 32px)) !important;
		min-width: min(306px, calc(100vw - 32px)) !important;
		max-width: calc(100vw - 32px) !important;
		gap: 1px;
		margin: 0 !important;
		border: 1px solid rgba(255, 250, 240, 0.16) !important;
		border-radius: 8px !important;
		padding: 8px !important;
		background: rgba(7, 22, 36, 0.96) !important;
		box-shadow: 0 18px 42px rgba(0, 0, 0, 0.2) !important;
		box-sizing: border-box;
		list-style: none;
		overflow: hidden;
	}

	.wht-home-unified-header__group:hover > .wht-home-unified-header__submenu,
	.wht-home-unified-header__group:focus-within > .wht-home-unified-header__submenu,
	.wht-home-unified-header__group.is-open > .wht-home-unified-header__submenu {
		display: grid !important;
	}

	:where(
		.wht-home-unified-header__group:has(> button[aria-controls*="private"]) > .wht-home-unified-header__submenu,
		.wht-home-code-private-menu-group > .wht-home-code-submenu,
		[class^="wht-"][class*="-header__menu-group--private"] > [class*="-header__submenu"]
	) {
		width: min(224px, calc(100vw - 32px)) !important;
		min-width: min(212px, calc(100vw - 32px)) !important;
	}

	:where(
		.wht-home-unified-header__submenu,
		.wht-home-code-submenu,
		[class^="wht-"][class*="-header__submenu"]
	) > li {
		min-width: 0;
		margin: 0 !important;
		padding: 0 !important;
	}

	:where(
		.wht-home-unified-header__submenu,
		.wht-home-code-submenu,
		[class^="wht-"][class*="-header__submenu"]
	) > li > a {
		display: block;
		width: 100%;
		border: 0 !important;
		border-radius: 8px !important;
		padding: 8px 10px !important;
		background: transparent;
		box-shadow: none !important;
		color: #fffaf0 !important;
		-webkit-text-fill-color: #fffaf0 !important;
		font-family: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
		font-size: 13.12px !important;
		font-weight: 500 !important;
		line-height: 17.3184px !important;
		letter-spacing: 0 !important;
		text-decoration: none !important;
		text-decoration-line: none !important;
		text-transform: none !important;
		white-space: normal !important;
		overflow-wrap: break-word;
	}

	body.wht-home-code-page #wht-home-tours-submenu#wht-home-tours-submenu > li > a,
	body.wht-home-code-page #wht-home-private-submenu#wht-home-private-submenu > li > a {
		font-size: 13.12px !important;
		line-height: 17.3184px !important;
	}

	:where(
		.wht-home-unified-header__submenu,
		.wht-home-code-submenu,
		[class^="wht-"][class*="-header__submenu"]
	) > li > a:hover,
	:where(
		.wht-home-unified-header__submenu,
		.wht-home-code-submenu,
		[class^="wht-"][class*="-header__submenu"]
	) > li > a:focus-visible {
		background: rgba(255, 250, 240, 0.1) !important;
		color: #fffaf0 !important;
	}
}