/* Main navigation bar styling */
.menu
{
position: fixed;
top: 0;
left: 0;
width: 100%;
background-color: rgba(15, 23, 42, 0.85);
display: flex;
flex-direction: column;
z-index: 50;
}

/* Wrapper for the menu items */
.menu-container
{
display: flex;
justify-content: center;
align-items: center;
gap: 0;
height: 60px;
min-height: 60px;
}

/* Individual link/button styling */
.menu-item
{
    display: flex;
    align-items: center; /* Centre le texte verticalement */
    padding: 0 30px; /* Espace à gauche et à droite */
    height: 100%; /* Force le lien à faire TOUTE la hauteur du menu */
    color: var(--color-text);
    text-decoration: none; /* Removes underline from links */
    transition: background-color 0.3s; /* Transition fluide pour le bleu */
    white-space: nowrap; /* Empeche le texte de se casser */
}

/* Hover effect for buttons */
.menu-item:hover
{
    background-color: var(--bg-rgba-primary-20);
    color: var(--color-primary-light);
    border-bottom: 3px solid var(--color-primary-light);
}

/* Style for the currently selected page */
.menu-item.active
{
    background-color: var(--bg-rgba-primary-15);
    color: var(--color-primary-light);
    border-bottom: 3px solid var(--color-primary-light);
}