.navbar {
    --bulma-navbar-h: 208.55deg;
    --bulma-navbar-s: 100%;
    --bulma-navbar-item-color-l: 100%;
    --bulma-navbar-item-background-l : 32.55%;
    --bulma-navbar-background-color: hsl(var(--bulma-navbar-h), var(--bulma-navbar-s), var(--bulma-navbar-item-background-l), 1);

    --bulma-link-text: white;
    --bulma-link: var(--bulma-link-text);

    --bulma-navbar-dropdown-background-color: var(--bulma-navbar-background-color);
    --bulma-navbar-dropdown-item-h: var(--bulma-navbar-h);
    --bulma-navbar-dropdown-item-s: var(--bulma-navbar-s);
    --bulma-navbar-dropdown-item-color-l: var(--bulma-navbar-item-color-l);
    --bulma-navbar-dropdown-item-background-l: var(--bulma-navbar-item-background-l);
    --bulma-navbar-dropdown-border-l: var(--bulma-navbar-item-background-l);

    --bulma-navbar-item-selected-h: 208.55deg;
    --bulma-navbar-item-selected-s: 100%;
    --bulma-navbar-item-selected-color-l: 100%;
    --bulma-navbar-item-selected-background-l : 28.55%;

    --bulma-dropdown-menu-min-width: 18rem;

    --bulma-navbar-item-img-max-height: calc(var(--bulma-navbar-height) - 0.3rem);
}
.section {
    --bulma-section-padding-desktop: 1rem 1rem;
}
.panel {
    --bulma-panel-heading-padding: 0.75em 1em;
    --bulma-panel-heading-size: 1.1em;
}
.panel.is-primary {
    --bulma-panel-h: 208.55deg;
    --bulma-panel-s: 100%;
    --bulma-panel-heading-color-l: 100%;
    --bulma-panel-heading-background-l : 32.55%;
    --bulma-panel-background-color: hsl(var(--bulma-panel-h), var(--bulma-panel-s), var(--bulma-panel-item-background-l), 1);
}
.tabs.is-primary li.is-active a {
    --bulma-tabs-link-active-color: hsl(var(--bulma-primary-h), var(--bulma-primary-s), var(--bulma-primary-l));
    --bulma-tabs-link-active-border-bottom-color: hsl(var(--bulma-primary-h), var(--bulma-primary-s), var(--bulma-primary-l));
}
:root {
    --lacme-header-warning-impersonation: 0px;
    --lacme-header-height: calc(var(--bulma-navbar-height) + var(--lacme-header-warning-impersonation));
    --lacme-body-height: calc(100% - var(--lacme-header-height));

    --lacme-store-card-network-tag-length-first-level: 2.1rem;
    --lacme-store-card-network-tag-length-second-level: 1.4rem;

    --bulma-primary-h: 208.55deg;
    --bulma-primary-s: 100%;
    --bulma-primary-l: 32.55%;
}
body {
    background-color: hsl(var(--bulma-primary-h), var(--bulma-primary-s), 98%); /* Couleur primaire */
}

@media (prefers-color-scheme: dark) {
    body {
        background-color: hsl(var(--bulma-primary-h), var(--bulma-primary-s), 12%);
    }
}

.sidenav {
    height: 100%;
    width: 18%;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: hsl(var(--bulma-primary-h), var(--bulma-primary-s), var(--bulma-primary-l), 1);
    overflow-x: hidden;
    transition: transform 0.3s ease, width 0.3s ease; /* Ajoute une transition pour l'animation */
}

.sidenav-content {
    width: 90%;
    margin: 0 auto;
}

.page-content {
    margin-left: 20%;
    padding-top: 1rem;
    transition: margin-left 0.3s ease;
}

.menu-divider {
    margin: 1rem auto;
    width: 80%;
    border-top: 1px solid white;
}

.menu-item>a {
    margin-left : 1.5rem;
    color: white;
    /* font-size: 1.5rem; */
    display: flex;
    flex-direction: row;
    column-gap: 1rem;
    align-items: start;
    align-content: center;
    height: 3rem;
}

.sidenav.is-closed .menu-item {
    display: none;
}

/* .menu-item:hover {
    transform: scale(1.1);
    transition: transform 0.2s ease-in-out;
} */

.sidenav.is-closed {
    width: 3%;
    /* transform: translateX(-50%); */
}

.page-content.is-full{
    margin-left: 3.5%;
}

.menu-item {
    /* border-bottom: 1px solid white; */
    font-size: 1.5rem;
}

/* .menu-item:first-of-type {
    border-top: 1px solid white;
} */
.menu-item-icon {
    display: flex;
    align-items: center;
    height: 100%;
}

.menu-item-icon>svg {
    display: block;
    margin: 0 auto;
}

.menu-item-label {
    flex: 1; /* Prend toute la hauteur du parent */
    display: flex;
    align-items: center; /* Centre verticalement le texte */
    height: 100%;
    width: 70%;
}

.menu-item-label>p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 90%;
}

.menu-item .menu-item {
    padding-left: 2rem; /* Décale le sous-élément vers la droite */
    font-size: 0.8rem;
    border-bottom: none;
}

.menu-item .menu-item > a > .menu-item-icon > svg {
    width: 1.5rem;
    height: 1.5rem;
}

.menu-item > a:hover {
    transform: scale(1.1); /* Applique un zoom */
    z-index: 1; /* Assure que l'élément survolé reste au-dessus des autres */
}

.menu-item.is-active {
    background-color: hsl(var(--bulma-primary-h), var(--bulma-primary-s), 25%, 1);
    /* round the corners */
    border-radius: 0.5rem;
}

.sidenav .logo {
    display: block;
}

.sidenav.is-closed .logo {
    display: none;
}

.sidenav .logo-small {
    display: none;
}

.sidenav.is-closed .logo-small {
    display: block;
}

.is-100-width {
    width: 100%;
}

.hero.is-primary {
    --bulma-hero-h: 208.55deg;
    --bulma-hero-s: 100%;
    --bulma-hero-l: 32.55%; 
}
