/* Breadcrumb */

.breadcrumb-wrap,
.breadcrumb-wrapper {
    --breadcrumb-padding: var(--theme-breadcrumb-padding, 15px);
    --breadcrumb-gap-x: var(--theme-breadcrumb-gap-x, 30px);
    --breadcrumb-gap-y: var(--theme-breadcrumb-gap-y, 0px);
}

.breadcrumb-wrapper {
    position: relative;

    &.has-top { padding-top: var(--breadcrumb-padding, 15px); }
    &.has-bottom { padding-bottom: var(--breadcrumb-padding, 15px); }

}

.breadcrumb-wrap {

    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0 10px;


    ul.breadcrumb {
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;
        gap: var(--breadcrumb-gap-y, 0px) var(--breadcrumb-gap-x, 30px);;

        & > li {
            position: relative;

            & > a {
                display: inline-flex;
            }

            &:last-child > a {
                font-weight: 500;
            }

            i.icon {
                position: absolute;
                width: 12px;
                height: 22px;

                right: calc(-0.5 * var(--breadcrumb-gap-x));
                transform: translateX(50%);

            }

        }

    }

}