/* =============================================================
   Breadcrumb Component
   Shared across all internal pages. Never shown on homepage.
   Tema Piedrangular
   ============================================================= */

.breadcrumb {
    display:        inline-flex;
    align-items:    center;
    gap:            0.625rem;           /* 10px between icon / dash / text */

    background-color: var(--color-navy, #061539);
    padding:        0.6875rem 1.375rem; /* 11px 22px — matches original pill */
    line-height:    1;

    /* typography reset */
    font-size:      0.8125rem;          /* 13px */
    font-weight:    600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color:          #ffffff;
    text-decoration: none;
}

/* ── Home icon link ─────────────────────────────────────────── */
.breadcrumb__home {
    display:         inline-flex;
    align-items:     center;
    color:           rgba(255, 255, 255, 0.70);
    text-decoration: none;
    cursor:          pointer;
    transition:      color 0.18s ease;
    flex-shrink:     0;
}

.breadcrumb__home:hover {
    color: #ffffff;
}

/* ── SVG icon ───────────────────────────────────────────────── */
.breadcrumb__icon {
    display: block;
    width:   18px;
    height:  18px;
}

/* ── Separator (em-dash) ────────────────────────────────────── */
.breadcrumb__separator {
    color:       rgba(255, 255, 255, 0.55);
    font-weight: 400;
    flex-shrink: 0;
}

/* ── Current page title ─────────────────────────────────────── */
.breadcrumb__current {
    color:          #ffffff;
    font-weight:    700;
    letter-spacing: 0.06em;
    white-space:    nowrap;
}