/* Gutenberg Styler for FluentCart — customer dashboard nav additions.
   Colours come from FluentCart's own dashboard variables, so the nav keeps
   following the store's palette instead of drifting from it. */

.gsfc-nav-item.gsfc-separator {
	pointer-events: none;
	cursor: default;
}

.gsfc-nav-item.gsfc-separator > a,
a.gsfc-nav-item.gsfc-separator {
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	display: block;
	padding: 16px 0 6px;
	margin: 6px 0 0;
	border-top: 1px solid var(--fct-customer-dashboard-border-color, rgba(0, 0, 0, .08));
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--fct-customer-dashboard-sub-title-color, #6b7280);
	background: none;
	opacity: 1;
}

.gsfc-nav-item.gsfc-separator:first-child > a,
a.gsfc-nav-item.gsfc-separator:first-child {
	border-top: 0;
	padding-top: 4px;
	margin-top: 0;
}

/* The separator has no icon, so pull its text back into line with the others. */
.gsfc-nav-item.gsfc-separator svg,
.gsfc-nav-item.gsfc-separator img {
	display: none;
}

/* A new-window item gets a small outward arrow, drawn in the current text
   colour so it inherits hover and active states. */
a.gsfc-target-blank::after,
.gsfc-target-blank > a::after {
	content: "";
	display: inline-block;
	width: .62em;
	height: .62em;
	margin-left: .45em;
	vertical-align: baseline;
	border: 1.5px solid currentColor;
	border-left-width: 0;
	border-bottom-width: 0;
	transform: rotate(45deg) translateY(.1em);
	opacity: .55;
}