/**
 * MC Breadcrumbs for Divi — Frontend styles
 * Manocolor Estudio · manocolor.com
 */

/* ── Base ─────────────────────────────────────────────────────────────────── */
.mcb-breadcrumbs { font-size: 0.875rem; line-height: 1.6; }

.mcb-breadcrumbs__list {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem;
}
.mcb-breadcrumbs__item { display: flex; align-items: center; gap: 0.25rem; }
.mcb-breadcrumbs__item a { color: #2271b1; text-decoration: none; transition: opacity .15s; }
.mcb-breadcrumbs__item a:hover { text-decoration: underline; opacity: .8; }
.mcb-breadcrumbs__item--current span { color: #646970; }
.mcb-breadcrumbs__sep { color: #aaa; user-select: none; flex-shrink: 0; }

/* ── Style: Classic ───────────────────────────────────────────────────────── */
/* Links subrayados, separador visible, página actual en negrita */
.mcb-breadcrumbs--classic .mcb-breadcrumbs__item a {
    text-decoration: underline;
    text-underline-offset: 3px;
}
.mcb-breadcrumbs--classic .mcb-breadcrumbs__item--current span {
    font-weight: 600;
    color: #1d2327;
}
.mcb-breadcrumbs--classic .mcb-breadcrumbs__sep {
    font-weight: 300;
    color: #ccc;
}

/* ── Style: Modern ────────────────────────────────────────────────────────── */
/* Pills / badges redondeados con fondo suave */
.mcb-breadcrumbs--modern .mcb-breadcrumbs__list { gap: 0.4rem; }
.mcb-breadcrumbs--modern .mcb-breadcrumbs__item a,
.mcb-breadcrumbs--modern .mcb-breadcrumbs__item--current span {
    background: rgba(0,0,0,0.06);
    padding: 3px 12px;
    border-radius: 20px;
    font-size: 0.82rem;
}
.mcb-breadcrumbs--modern .mcb-breadcrumbs__item a:hover { opacity: .75; text-decoration: none; }
.mcb-breadcrumbs--modern .mcb-breadcrumbs__sep { margin: 0 1px; opacity: .4; }

/* ── Style: Minimal ───────────────────────────────────────────────────────── */
/* Todo en mayúsculas pequeñas, muy espaciado, tono apagado */
.mcb-breadcrumbs--minimal .mcb-breadcrumbs__list { gap: 0.1rem; letter-spacing: 0.06em; }
.mcb-breadcrumbs--minimal .mcb-breadcrumbs__item a {
    text-transform: uppercase;
    font-size: 0.72rem;
    opacity: .5;
    font-weight: 500;
}
.mcb-breadcrumbs--minimal .mcb-breadcrumbs__item a:hover { opacity: .9; text-decoration: none; }
.mcb-breadcrumbs--minimal .mcb-breadcrumbs__sep {
    font-size: 0.6rem;
    opacity: .25;
    margin: 0 3px;
}
.mcb-breadcrumbs--minimal .mcb-breadcrumbs__item--current span {
    text-transform: uppercase;
    font-size: 0.72rem;
    font-weight: 700;
    opacity: .9;
}

/* ── Style: Bold ──────────────────────────────────────────────────────────── */
/* Cuadrado de color dominante antes de cada ítem */
.mcb-breadcrumbs--bold .mcb-breadcrumbs__list { gap: 0.5rem; align-items: center; }
.mcb-breadcrumbs--bold .mcb-breadcrumbs__item { gap: 0.4rem; }

/* El cuadrado de color — se inyecta como pseudo-elemento */
.mcb-breadcrumbs--bold .mcb-breadcrumbs__item a::before,
.mcb-breadcrumbs--bold .mcb-breadcrumbs__item--current span::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    background: var(--mcb-accent, #2271b1);
    border-radius: 2px;
    margin-right: 5px;
    vertical-align: middle;
    flex-shrink: 0;
}
.mcb-breadcrumbs--bold .mcb-breadcrumbs__item a {
    font-weight: 600;
    font-size: 0.875rem;
}
.mcb-breadcrumbs--bold .mcb-breadcrumbs__item--current span {
    font-weight: 700;
    font-size: 0.875rem;
}
.mcb-breadcrumbs--bold .mcb-breadcrumbs__item--current span::before {
    opacity: .35;
}
.mcb-breadcrumbs--bold .mcb-breadcrumbs__sep {
    opacity: .3;
    font-size: 0.75rem;
}

/* ── Alineaciones Divi ────────────────────────────────────────────────────── */
.mcb-breadcrumbs.et_pb_text_align_center .mcb-breadcrumbs__list { justify-content: center; }
.mcb-breadcrumbs.et_pb_text_align_right  .mcb-breadcrumbs__list { justify-content: flex-end; }
