/* ==========================================================================
   MN: Breadcrumbs
   Muted, small trail (Home / News / Peristiwa): everything in muted tone,
   "/" separators. Works for the native trail and SEO plugin outputs
   (Yoast, Rank Math, AIOSEO).
   ========================================================================== */

.mn-breadcrumbs {
	font-size: var(--mn-text-xs);
	color: var(--mn-color-text-muted);
	margin-bottom: var(--mn-space-5);
	line-height: 1.5;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mn-breadcrumbs ol {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.mn-breadcrumbs li {
	flex-shrink: 0;
	min-width: 0;
}

.mn-breadcrumbs a {
	color: var(--mn-color-text-muted);
	font-weight: 500;
	text-decoration: none;
}

.mn-breadcrumbs a:hover {
	color: var(--mn-color-primary);
}

/* "/" separators, muted. */
.mn-breadcrumb-sep {
	margin: 0 var(--mn-space-2);
	color: var(--mn-color-text-muted);
	opacity: 0.6;
}

/* Current page: muted, slightly emphasized, ellipsis in one line.
   The li-qualified selector outranks `.mn-breadcrumbs li` (0-1-1),
   otherwise flex-shrink: 1 would lose and the title would never shrink. */
.mn-breadcrumbs li.mn-breadcrumb-current {
	color: var(--mn-color-text-muted);
	font-weight: 600;
	flex-shrink: 1;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* SEO plugin outputs: highlight their current item the same way. */
.mn-breadcrumbs .breadcrumb_last,
.mn-breadcrumbs .breadcrumb_last strong,
.mn-breadcrumbs .last-item {
	color: var(--mn-color-text-muted);
	font-weight: 600;
}

/* Rank Math wraps its trail in a paragraph. */
.mn-breadcrumbs.rank-math-breadcrumb p {
	margin: 0;
}