/* =====================================================================
   art-felx.com — MENU GLOBAL COMMUN
   Accueil, Info, Mentions légales, Invités et autres pages du site.
   Version 1.0 — 1 novembre 2026

   À charger APRÈS ../css/menu.css.
   Ce fichier ne définit volontairement AUCUNE couleur, taille,
   bordure ni police pour le BOUTON : menu.css garde son apparence.
   La page et ses galeries ne sont pas modifiées.

   Fonctionne avec les variantes existantes :
     bouton #menu-btn OU #menu-global-btn
     panneau #menu-global-dropdown, quel que soit son conteneur
     .menu-global-dropdown OU .legal-menu-panel
   Il faut conserver un script de clic, ou utiliser menu-global.js.
   ===================================================================== */

/* Le panneau déroulant ne doit pas être coupé par les conteneurs. */
.menu-float:has(.menu-global),
.test-menu-superieur,
.legal-nav,
.menu-global {
    overflow: visible;
}

/* Positionnement du panneau sous le bouton, sans modifier ce dernier. */
#menu-global-dropdown {
    position: absolute !important;
    z-index: 2500 !important;
    top: calc(100% + .45rem) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    box-sizing: border-box;
    width: min(94vw, 960px) !important;
    max-height: min(70vh, 40rem) !important;
    overflow-x: hidden;
    overflow-y: auto !important;
    overscroll-behavior: contain;

    padding: .85rem;
    border: 1px solid #9996;
    border-radius: 8px;
    background: #f9f9fb;
    color: #202020;
    box-shadow: 0 8px 20px #0002;
    text-align: left;
}

/* Le positionnement absolu est relatif au conteneur du panneau. */
.menu-global:has(> #menu-global-dropdown),
.legal-nav:has(> #menu-global-dropdown),
.test-menu-superieur:has(> #menu-global-dropdown) {
    position: relative;
}

/* Compatible avec hidden et aria-hidden des scripts existants. */
#menu-global-dropdown[hidden],
#menu-global-dropdown[aria-hidden="true"] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#menu-global-dropdown:not([hidden])[aria-hidden="false"] {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    gap: .85rem;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

#menu-global-dropdown .menu-section {
    display: block;
    min-width: 0;
}

#menu-global-dropdown .menu-titre {
    margin: 0 0 .35rem;
    font-weight: 700;
    color: inherit;
}

#menu-global-dropdown .menu-liste {
    list-style: none;
    margin: 0;
    padding: 0;
}

#menu-global-dropdown .menu-liste li {
    margin: 0;
    padding: 0;
}

#menu-global-dropdown .menu-liste a {
    display: block;
    padding: .3rem .4rem;
    border-radius: 4px;
    color: #202020;
    -webkit-text-fill-color: #202020;
    background: transparent;
    text-decoration: none;
    overflow-wrap: anywhere;
}

#menu-global-dropdown .menu-liste a:hover,
#menu-global-dropdown .menu-liste a:focus-visible {
    background: #704936 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

/* Le bouton garde entièrement son style de ../css/menu.css. */

/* Thème sombre du portail. */
html.dark-mode #menu-global-dropdown,
body.dark-mode #menu-global-dropdown {
    background: #252525 !important;
    color: #fff !important;
    border-color: #777;
}

html.dark-mode #menu-global-dropdown .menu-liste a,
body.dark-mode #menu-global-dropdown .menu-liste a {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

html.dark-mode #menu-global-dropdown .menu-liste a:hover,
html.dark-mode #menu-global-dropdown .menu-liste a:focus-visible,
body.dark-mode #menu-global-dropdown .menu-liste a:hover,
body.dark-mode #menu-global-dropdown .menu-liste a:focus-visible {
    background: #704936 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

/* Téléphone : colonnes lisibles, sans débordement. */
@media (max-width: 640px) {
    #menu-global-dropdown:not([hidden])[aria-hidden="false"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    #menu-global-dropdown { padding: .6rem; gap: .5rem; }
}

@media (max-width: 390px) {
    #menu-global-dropdown:not([hidden])[aria-hidden="false"] {
        grid-template-columns: 1fr;
    }
}

@media print {
    #menu-global-dropdown { display: none !important; }
}


/* MENU GLOBAL — LISIBILITÉ DES LIENS */

#menu-global-dropdown,
#menu-global-dropdown .menu-section,
#menu-global-dropdown ul,
#menu-global-dropdown li,
#menu-global-dropdown a {
    opacity: 1 !important;
    filter: none !important;
}

#menu-global-dropdown a,
#menu-global-dropdown a:link,
#menu-global-dropdown a:visited {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-decoration: none;
}

#menu-global-dropdown a:hover,
#menu-global-dropdown a:focus-visible {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: #414450 !important;
}