#breadcrumb {
    display: flex;
    align-items: center;
    /* background-color: var(--cor-fundo); */
    /* border:2px solid #015b1d3b; */

    border-radius: 50px;

    width: fit-content;
    /* min-height: 48px; */

    /* padding-inline: 30px; */
    margin-bottom: 15px;

    ol.breadcrumb {
        display: flex;
        flex-wrap: wrap;
        gap: 30px;

        margin: 0;
        background-color: unset;

        .breadcrumb-item {
            text-align: center;
            color: var(--cor-fonte-secundaria);
        }

        .breadcrumb-item:not(:last-child) {

            &::after {
                display: inline-block;
                padding-left: 30px;
                color: var(--cor-fonte-secundaria);
                content: "/";
            }
        }
    }

    a {
        color: #0e7f00;
        text-decoration: none;
        --reversed-link-gap: min(100%, 1.35em);
        background: linear-gradient(to right, currentColor, currentColor) 0 var(--reversed-link-gap) / 0 1px no-repeat;
        background-position-x: right;
        transition: background-size .5s cubic-bezier(.3, 1, .3, 1);

        &:hover {
            background-position-x: left;
            background-size: 100% 1px;
        }
    }

    @media (prefers-color-scheme: dark) {
        a {
            color: #6EA13E;
        }
    }

    /* desabilitar css default bootstrap */
    .breadcrumb-item+.breadcrumb-item::before {
        display: none;
        padding-right: 0;
        color: transparent;
        content: "";
    }
}

@media (max-width: 768px) {
    #breadcrumb {

        ol.breadcrumb {
            gap: 10px;

            .breadcrumb-item:not(:last-child) {

                &::after {
                    padding-left: 10px;
                }
            }
        }
    }
}