/* =========================================================
   .breadcrumbs – Breadcrumb NavXT  (version moderne)
   ========================================================= */

.breadcrumbs {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1px;
    height: 28px;
    padding: .45em 2em;
    background: rgba(255, 255, 255, .1);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, .15);
    font-size: 0; /* masque les nœuds texte " > " de NavXT */
}

/* Chaque segment */
.breadcrumbs span[property="itemListElement"] {
    display: inline-flex;
    align-items: center;
    font-size: .75rem;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    letter-spacing: .01em;
    white-space: nowrap;
}

/* Premier et dernier segment */
.breadcrumbs span[property="itemListElement"]:first-of-type {
    margin-left: 8px;
}

.breadcrumbs span[property="itemListElement"]:last-of-type {
    margin-right: 8px;
}

/* Séparateur / entre segments */
.breadcrumbs span[property="itemListElement"] + span[property="itemListElement"]::before {
    content: "/";
    margin: 0 .5em;
    color: rgba(255, 255, 255, .3);
    font-weight: 300;
    font-size: .85em;
}

/* Liens */
.breadcrumbs a {
    color: rgba(255, 255, 255, .7);
    text-decoration: none;
    position: relative;
    padding-bottom: 1px;
    transition: color .2s ease;
}

.breadcrumbs a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background: rgba(255, 255, 255, .8);
    transition: width .25s ease;
}

.breadcrumbs a:hover {
    color: #fff;
}

.breadcrumbs a:hover::after {
    width: 100%;
}

/* Home : remplace le long titre par "Accueil" */
.breadcrumbs a.home span[property="name"] {
    display: none;
}
.breadcrumbs a.home::before {
    content: "Accueil";
    font-size: .75rem;
}

/* Item courant */
.breadcrumbs .current-item {
    color: #fff;
    font-weight: 600;
    font-size: .75rem;
    font-family: "Open Sans", sans-serif;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    vertical-align: middle;
}

/* meta cachés */
.breadcrumbs meta { display: none; }

/* ---- Variante fond clair --------------------------------
   Wrapper Elementor : ajouter la classe CSS "breadcrumbs-light"
   ========================================================= */

.breadcrumbs-light .breadcrumbs,
.breadcrumbs-light.breadcrumbs {
    background: rgba(26, 46, 90, .06);
    border-color: rgba(26, 46, 90, .12);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.breadcrumbs-light .breadcrumbs a,
.breadcrumbs-light.breadcrumbs a {
    color: #1a2e5a;
}

.breadcrumbs-light .breadcrumbs a::after,
.breadcrumbs-light.breadcrumbs a::after {
    background: #1a2e5a;
}

.breadcrumbs-light .breadcrumbs a:hover,
.breadcrumbs-light.breadcrumbs a:hover {
    color: #243f7a;
}

.breadcrumbs-light .breadcrumbs span[property="itemListElement"] + span[property="itemListElement"]::before,
.breadcrumbs-light.breadcrumbs span[property="itemListElement"] + span[property="itemListElement"]::before {
    color: rgba(26, 46, 90, .3);
}

.breadcrumbs-light .breadcrumbs .current-item,
.breadcrumbs-light.breadcrumbs .current-item {
    color: #1a2e5a;
}