/**
 * CDS Account Nav — [cds_account_nav] header element styling.
 *
 * An outlined "pill" button (transparent, light border, white text, rounded)
 * that fills with slate (#334155) on hover — matching the site's header button
 * style. Works for both the logged-out (icon + title) and logged-in (avatar +
 * welcome) states. Sized for a dark header.
 */
.cds-accnav {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 12px 24px;
	border: 1.5px solid #1d4ed8;
	border-radius: 10px;
	background: #1d4ed8;
	color: #fff !important; /* !important: Breakdance styles anchor colours */
	text-decoration: none;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease;
}
/* Hover keeps the same colour; text stays white (Breakdance overrides a:hover). */
.cds-accnav:hover,
.cds-accnav:focus {
	background: #1d4ed8;
	border-color: #1d4ed8;
	color: #fff !important;
}
.cds-accnav:focus-visible {
	outline: 2px solid #93a2bd;
	outline-offset: 2px;
}

.cds-accnav__icon {
	width: 18px;
	height: 18px;
	object-fit: contain;
	display: block;
	flex: 0 0 auto;
}

.cds-accnav__avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #f8fafc;
	color: #0f172a;
	font-size: 12px;
	font-weight: 700;
	flex: 0 0 auto;
}

.cds-accnav__label { white-space: nowrap; color: #fff !important; }
.cds-accnav:hover .cds-accnav__label,
.cds-accnav:focus .cds-accnav__label { color: #fff !important; }
