.breadcrumb {
    font-size: 0.9rem;
    margin: 10px 15px;
}

.breadcrumb ol {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap; /* NUEVO */
    gap: .5rem;
}

.breadcrumb li {
    white-space: nowrap; /* NUEVO */
}

.breadcrumb li::after {
    content: "/";
    margin: 0 4px; /* AJUSTADO */
    color: #999;
}

.breadcrumb li.active::after {
    content: "";
}

.breadcrumb a {
    text-decoration: none;
    color: #0077cc;
}

.breadcrumb .active span {
    color: #555;
    font-weight: 600;
}

@media (max-width: 480px) {
    .breadcrumb {
        font-size: 0.8rem; /* NUEVO */
        margin: 8px 10px;
    }
}