﻿/* Breadcrumbs: one look for every template (all use .s-mat-breadcrumbs, as <ol> or <nav><ul>). */
ol.s-mat-breadcrumbs,
.s-mat-breadcrumbs > ul,
.s-mat-breadcrumbs > .container > ul {
    list-style: none;
    width: fit-content;
    max-width: 100%;
    padding: 6px 0;
    margin: 0;
    border-radius: 999px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 4px;
    font-family: "Montserrat", "Arial", sans-serif;
    font-size: 13.5px;
    line-height: 1.4;
    color: #7b818a;
}
.s-mat-breadcrumbs li {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    margin: 0;
    padding: 0;
    font-size: inherit;
    font-weight: 500;
    color: #7b818a;
}
.s-mat-breadcrumbs li:not(:last-child)::after {
    content: "";
    font-family: inherit;
    width: 6px;
    height: 6px;
    margin: 0 10px 0 9px;
    border-top: 1.5px solid #c4c9d1;
    border-right: 1.5px solid #c4c9d1;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.s-mat-breadcrumbs a {
    color: #435065;
    font-weight: 500;
    text-decoration: none;
    border-radius: 4px;
    transition: color .15s;
}
.s-mat-breadcrumbs li:first-child a::before {
    content: "";
    display: inline-block;
    width: 13px;
    height: 13px;
    margin: 0 6px -1px 0;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 9.5V21h14V9.5'/%3E%3C/svg%3E") no-repeat center / contain;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 9.5V21h14V9.5'/%3E%3C/svg%3E") no-repeat center / contain;
    opacity: .75;
}
.s-mat-breadcrumbs a:hover { color: #6298E0; text-decoration: underline; text-underline-offset: 3px; }
.s-mat-breadcrumbs a:focus-visible { outline: 2px solid #6298E0; outline-offset: 2px; }
.s-mat-breadcrumbs li:last-child { flex: 1 1 0; }
.s-mat-breadcrumbs li:last-child > span,
.s-mat-breadcrumbs li:last-child > a > span {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #1b1c1e;
    font-weight: 600;
}

[dir="rtl"] .s-mat-breadcrumbs li:not(:last-child)::after { margin: 0 9px 0 10px; transform: rotate(-135deg); }
[dir="rtl"] .s-mat-breadcrumbs li:first-child a::before { margin: 0 0 -1px 6px; }
