/*
 * Topbar Login dropdown (IBDICWP-76) - see inc/login-dropdown.php.
 *
 * Every rule is scoped to the Login menu's own classes (.login-trigger,
 * .login-product, #submenu-login), so nothing else on any page is touched.
 * style.css is linked after wp_head() and so loads after this file: these
 * selectors win on specificity over its generic .dropdown / .login rules,
 * not on order.
 */

/* ── Desktop ─────────────────────────────────────────────────────────── */

/* Anchors the menu to the right edge of Login + Contact Us, as in the design. */
.nav-actions {
	position: relative;
}

.nav-actions .login-trigger .login {
	gap: 8px;
	background: none;
	font-family: inherit;
	cursor: pointer;
}

.nav-actions .login-trigger .login-dropdown {
	top: calc(100% + 16px);
	left: auto;
	right: 0;
	transform: none;
	width: 220px;
	padding: 4px 0;
	background: #fff;
	border-radius: 8px;
}

.nav-actions .login-dropdown .login-product {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 14px 16px;
	border-bottom: 1px solid #ececec;
	text-decoration: none;
	color: #1f1f1f;
	font-size: 12px;
	font-weight: 500;
}

.nav-actions .login-dropdown .login-product:last-child {
	border-bottom: none;
}

.nav-actions .login-dropdown .login-product:hover {
	background: #f5f8fd;
	color: #1d6dd0;
}

/* ── Shared by desktop and drawer ────────────────────────────────────── */

.login-product img {
	width: 20px;
	height: 20px;
	object-fit: contain;
	flex-shrink: 0;
}

/* Stand-in for an item with no icon, so its name lines up with the others. */
.login-product .login-product-noicon {
	display: block;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

.login-product span {
	flex: 1;
}

.login-product .login-product-chevron {
	color: #5f5f5f;
	flex-shrink: 0;
}

/* Greyed out: an item whose link is not set yet (empty 'url' in
   inc/login-dropdown.php). It is a <span>, so it cannot be clicked anyway;
   this only makes that visible. */
.login-product.is-disabled {
	cursor: not-allowed;
}

.nav-actions .login-dropdown .login-product.is-disabled,
.nav-actions .login-dropdown .login-product.is-disabled:hover,
#submenu-login .login-product--drawer.is-disabled {
	color: #a8a8a8;
	background: #fff;
}

.login-product.is-disabled img {
	filter: grayscale(1);
	opacity: .45;
}

.login-product.is-disabled .login-product-chevron {
	color: #cfcfcf;
}

/* ── Mobile drawer Login pane (matches the drawer's own link rows) ───── */

#submenu-login .login-product--drawer {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 26px 24px;
	background: #fff;
	border-bottom: 1px solid #eee;
	text-decoration: none;
	color: #1D6DD0;
	font-family: Manrope;
	font-size: 14px;
	font-weight: 500;
}