/**
 * Yoast breadcrumbs ([wpseo_breadcrumb]).
 * The wrapper gets .ns-breadcrumbs via the wpseo_breadcrumb_output_class filter (inc/yoast-hooks.php).
 * Default is light text for the dark post hero. On a light background add the class
 * "ns-breadcrumbs-dark" to the module/row that contains the shortcode.
 */
.ns-breadcrumbs {
    --ns-breadcrumbs-color: #E5E6EA;
    --ns-breadcrumbs-color-second: #658090;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    font-family: "Nunito Sans", sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0;
    color: var(--ns-breadcrumbs-color);
}

.ns-breadcrumbs-dark .ns-breadcrumbs {
    --ns-breadcrumbs-color: #002E48;
}

.ns-breadcrumbs span {
    font: inherit;
    color: var(--ns-breadcrumbs-color);
}

.ns-breadcrumbs > span {
    padding: 0 10px;
}

.ns-breadcrumbs > span:first-child {
    padding-left: 0;
}

.ns-breadcrumbs a,
.ns-breadcrumbs a:visited {
    font: inherit;
    color: var(--ns-breadcrumbs-color-second);
    text-decoration: none;
    text-decoration-thickness: 0;
    text-underline-offset: 0;
    font-weight: 700 !important;
}

.ns-breadcrumbs a:hover,
.ns-breadcrumbs a:focus {
    font-weight: 700 !important;
    color: var(--ns-breadcrumbs-color-second);
    text-decoration: none;
}

/* BB posts (inc/ns-blog-bb-breadcrumb.php): the category is the last visible level but stays a
   link, so it takes the current-page colour instead of the muted link colour. */
.ns-breadcrumbs .ns-breadcrumbs__current a,
.ns-breadcrumbs .ns-breadcrumbs__current a:visited,
.ns-breadcrumbs .ns-breadcrumbs__current a:hover,
.ns-breadcrumbs .ns-breadcrumbs__current a:focus {
    color: var(--ns-breadcrumbs-color);
}
