.skarpere-breadcrumbs {
    --skb-bg: #f7f8fc;
    --skb-text: #5f6475;
    --skb-link: #00737f;
    --skb-border: #0b7f88;
    --skb-border-width: 0px;
    --skb-font-size: 14px;
    --skb-padding-y: 14px;
    --skb-padding-x: 30px;
    --skb-font-weight: 600;

    box-sizing: border-box;
    width: 100%;
    background: var(--skb-bg);
    border-bottom: var(--skb-border-width) solid var(--skb-border);
    color: var(--skb-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: var(--skb-font-size);
    font-weight: var(--skb-font-weight);
    line-height: 1.4;
    padding: var(--skb-padding-y) var(--skb-padding-x);
}

.skarpere-breadcrumbs *,
.skarpere-breadcrumbs *::before,
.skarpere-breadcrumbs *::after {
    box-sizing: border-box;
}

.skarpere-breadcrumbs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.skarpere-breadcrumbs__item {
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.skarpere-breadcrumbs__link {
    color: var(--skb-link);
    text-decoration: none;
}

.skarpere-breadcrumbs__link:hover,
.skarpere-breadcrumbs__link:focus {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.skarpere-breadcrumbs__separator {
    color: var(--skb-text);
    margin: 0 5px;
    opacity: 0.9;
}

.skarpere-breadcrumbs__current {
    color: var(--skb-text);
}

@media (max-width: 640px) {
    .skarpere-breadcrumbs {
        padding-left: 18px;
        padding-right: 18px;
    }
}