:root {
    --morph-path-link: #52677f;
    --morph-path-link-hover: #174f9d;
    --morph-path-current: #162b46;
    --morph-path-separator: #a9b5c2;
    --morph-path-accent: #356ae6;
}

html[data-rizon-theme="dark"],
body.rizon-theme-dark {
    --morph-path-link: #aebfd7;
    --morph-path-link-hover: #ffffff;
    --morph-path-current: #f2f6fc;
    --morph-path-separator: #687e9e;
    --morph-path-accent: #76a5f7;
}

body.horizon-about-page,
body.horizon-cart-page,
body.horizon-checkout-page,
body.horizon-help-centre-page,
body.horizon-legal-page,
body.horizon-returns-page,
body.horizon-account-page {
    --morph-path-link: #b8c8de;
    --morph-path-link-hover: #ffffff;
    --morph-path-current: #ffffff;
    --morph-path-separator: #7186a6;
    --morph-path-accent: #8ab2f8;
}

html[data-rizon-theme="light"] body.horizon-about-page,
html[data-rizon-theme="light"] body.horizon-cart-page,
html[data-rizon-theme="light"] body.horizon-checkout-page,
html[data-rizon-theme="light"] body.horizon-help-centre-page,
html[data-rizon-theme="light"] body.horizon-legal-page,
html[data-rizon-theme="light"] body.horizon-returns-page,
html[data-rizon-theme="light"] body.horizon-account-page,
body.rizon-theme-light.horizon-about-page,
body.rizon-theme-light.horizon-cart-page,
body.rizon-theme-light.horizon-checkout-page,
body.rizon-theme-light.horizon-help-centre-page,
body.rizon-theme-light.horizon-legal-page,
body.rizon-theme-light.horizon-returns-page,
body.rizon-theme-light.horizon-account-page {
    --morph-path-link: #52677f;
    --morph-path-link-hover: #174f9d;
    --morph-path-current: #162b46;
    --morph-path-separator: #a9b5c2;
    --morph-path-accent: #356ae6;
}

.morph-path-shell {
    position: relative;
    z-index: 250;
    width: 100%;
    margin: 0;
    padding: 8px 0;
    background: transparent;
    border: 0;
    font-family: Inter, "Satoshi", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1;
}

.morph-path-shell *,
.morph-path-shell *::before,
.morph-path-shell *::after {
    box-sizing: border-box;
}

.morph-path {
    position: relative;
    top: auto;
    z-index: auto;
    display: block;
    width: min(1576px, calc(100vw - 96px));
    max-width: none;
    margin: 0 auto;
    overflow: visible;
    border: 0;
    background: transparent;
    color: var(--morph-path-link);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.morph-path__viewport {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

.morph-path__viewport::-webkit-scrollbar {
    display: none;
}

.morph-path__list {
    display: inline-flex;
    align-items: center;
    min-width: max-content;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.morph-path__step {
    display: inline-flex;
    align-items: center;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.morph-path__step:not(:last-child)::after {
    content: "/";
    display: inline-block;
    margin: 0 10px;
    color: var(--morph-path-separator);
    font-size: 17px;
    font-weight: 400;
    line-height: 1;
}

.morph-path__index,
.morph-path__beacon {
    display: none;
}

.morph-path__node {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    max-width: 300px;
    margin: 0;
    padding: 6px 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--morph-path-link);
    box-shadow: none;
    font-size: 12px;
    font-weight: 550;
    letter-spacing: 0;
    line-height: 1.3;
    text-decoration: none !important;
    white-space: nowrap;
    transition: color 150ms ease;
}

a.morph-path__node:hover {
    color: var(--morph-path-link-hover);
    text-decoration: underline !important;
    text-underline-offset: 4px;
}

a.morph-path__node:focus-visible {
    border-radius: 3px;
    outline: 2px solid var(--morph-path-accent);
    outline-offset: 3px;
}

.morph-path__label {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.morph-path__step.is-current .morph-path__node {
    color: var(--morph-path-current);
    font-weight: 700;
}

body:has(.morph-path-shell) .woocommerce-breadcrumb,
body:has(.morph-path-shell) .hhelp-breadcrumbs,
body:has(.morph-path-shell) .hlegal-breadcrumbs,
body:has(.morph-path-shell) .hreturns-breadcrumbs,
body:has(.morph-path-shell) .haccount-breadcrumbs {
    display: none !important;
}

@media (max-width: 920px) {
    .morph-path-shell {
        padding: 7px 0;
    }

    .morph-path {
        width: calc(100vw - 24px);
    }

    .morph-path__node {
        max-width: 180px;
        min-height: 27px;
        font-size: 11px;
    }

    .morph-path__step:not(:last-child)::after {
        margin: 0 8px;
        font-size: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .morph-path__node {
        transition: none;
    }
}
