/* ================================================================
   EIVAD – Barre de catégories (sous-header)
   ================================================================ */

.eivad-catbar {
    background: var(--color-1, #0000cd);
    position: relative;
    z-index: 100;
}

/* Masquer la barre quand Bootscore passe en offcanvas (xl = 1200px) */
@media (max-width: 1199.98px) {
    .eivad-catbar { display: none; }
}

.eivad-catbar .container-fluid {
    padding: 0;
}

/* ── Bouton "Nos produits" injecté dans l'offcanvas Bootscore ── */
.eivad-offcanvas-btn {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .7rem 1rem;
    margin-bottom: .5rem;
    border: none;
    border-radius: .375rem;
    background: var(--color-1, #0000cd);
    color: #fff;
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s;
}
.eivad-offcanvas-btn:hover,
.eivad-offcanvas-btn:focus {
    background: var(--color-2, var(--eivad-blue));
}

/* Le bouton "Nos produits" est désormais visible dans l'offcanvas à toutes
   les tailles : sur desktop l'offcanvas est ouvert via le burger de la topbar
   (la barre catégories sous le header reste affichée en complément). */

/* ── Desktop : liste horizontale ── */
.eivad-catbar__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 0;
}

.eivad-catbar__item {
    position: relative;
}

.eivad-catbar__link {
    display: flex;
    align-items: center;
    gap: .3rem;
    padding: .5rem .85rem;
    color: #fff;
    font-size: .8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s, color .15s;
}
.eivad-catbar__link:hover,
.eivad-catbar__item.is-open > .eivad-catbar__link {
    background: rgba(255,255,255,.12);
    color: #fff;
}

.eivad-catbar__chevron {
    font-size: .55rem;
    opacity: .6;
    transition: transform .2s, opacity .2s;
}
.eivad-catbar__item.is-open > .eivad-catbar__link .eivad-catbar__chevron {
    transform: rotate(180deg);
    opacity: 1;
}

/* ── Dropdown sous-catégories ── */
.eivad-catbar__dropdown {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(6px);
    min-width: 240px;
    background: #fff;
    border-radius: .5rem;
    box-shadow: 0 10px 40px rgba(0,0,0,.15);
    opacity: 0;
    visibility: hidden;
    transition: opacity .18s ease, transform .18s ease, visibility 0s .18s;
    z-index: 10;
    padding: .5rem 0;
}
.eivad-catbar__item.is-open > .eivad-catbar__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    transition: opacity .18s ease, transform .18s ease, visibility 0s;
}

/* Flèche du dropdown */
.eivad-catbar__dropdown::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #fff;
}

/* Zone de sécurité hover (évite la fermeture entre la barre et le dropdown) */
.eivad-catbar__dropdown::after {
    content: '';
    position: absolute;
    top: -12px;
    left: 0;
    right: 0;
    height: 12px;
}

.eivad-catbar__sub {
    list-style: none;
    margin: 0;
    padding: 0;
}

.eivad-catbar__sub-link {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .45rem 1rem;
    color: #333;
    font-size: .85rem;
    font-weight: 500;
    text-decoration: none;
    transition: background .12s, padding-left .12s;
}
.eivad-catbar__sub-link:hover {
    background: rgba(50,52,121,.05);
    color: var(--color-1, #0000cd);
    padding-left: 1.15rem;
}

.eivad-catbar__sub-img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    background: #f5f5f8;
    flex-shrink: 0;
}

/* Lien "Tout voir" */
.eivad-catbar__see-all {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .5rem 1rem;
    margin-top: .25rem;
    border-top: 1px solid rgba(0,0,0,.06);
    color: var(--color-1, var(--eivad-blue));
    font-size: .78rem;
    font-weight: 600;
    text-decoration: none;
    transition: background .12s;
}
.eivad-catbar__see-all:hover {
    background: rgba(50,52,121,.04);
}
.eivad-catbar__see-all i {
    font-size: .65rem;
    transition: transform .15s;
}
.eivad-catbar__see-all:hover i {
    transform: translateX(3px);
}

/* ── Empêcher le dropdown de sortir de l'écran ── */
.eivad-catbar__item:first-child > .eivad-catbar__dropdown {
    left: 0;
    transform: translateY(6px);
}
.eivad-catbar__item:first-child.is-open > .eivad-catbar__dropdown {
    transform: translateY(0);
}
.eivad-catbar__item:first-child > .eivad-catbar__dropdown::before {
    left: 1.5rem;
    transform: none;
}

.eivad-catbar__item:last-child > .eivad-catbar__dropdown {
    left: auto;
    right: 0;
    transform: translateY(6px);
}
.eivad-catbar__item:last-child.is-open > .eivad-catbar__dropdown {
    transform: translateY(0);
}
.eivad-catbar__item:last-child > .eivad-catbar__dropdown::before {
    left: auto;
    right: 1.5rem;
    transform: none;
}