/*
 * Dokterin Widgets - Breadcrumb.
 */

.dps-breadcrumb {
	--dps-bc-text: #6b7280;
	--dps-bc-link: #1a75bb;
	--dps-bc-current: #1f1f1f;

	margin: 0 0 18px;
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: 0;
}

.dps-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dps-breadcrumb .dps-breadcrumb-item {
	display: inline-flex;
	align-items: center;
	min-width: 0;
	margin: 0;
	padding: 0;
	color: var( --dps-bc-text );
	list-style: none;
}

/* Separator › */
.dps-breadcrumb .dps-breadcrumb-item + .dps-breadcrumb-item::before {
	content: "";
	flex-shrink: 0;
	width: 6px;
	height: 6px;
	margin: 0 12px 0 8px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	opacity: 0.6;
	transform: rotate( 45deg );
}

.dps-breadcrumb a,
.dps-breadcrumb a:hover {
	color: var( --dps-bc-link );
	text-decoration: none !important;
}

.dps-breadcrumb a:hover span {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.dps-breadcrumb .dps-breadcrumb-item.is-current {
	color: var( --dps-bc-current );
	font-weight: 500;
}

/* Phones: one line, long titles get "…". */
@media ( max-width: 767px ) {

	.dps-breadcrumb {
		font-size: 13px;
	}

	.dps-breadcrumb ol {
		flex-wrap: nowrap;
	}

	.dps-breadcrumb .dps-breadcrumb-item {
		flex-shrink: 0;
		white-space: nowrap;
	}

	.dps-breadcrumb .dps-breadcrumb-item.is-current {
		flex-shrink: 1;
		overflow: hidden;
	}

	.dps-breadcrumb .dps-breadcrumb-item.is-current span {
		overflow: hidden;
		text-overflow: ellipsis;
	}
}
