/* Menu « Message » d'une activité — messageButton(), fonctions_evenement.php.
 *
 * Rendu à deux endroits : le planning (une instance PAR LIGNE, déclencheur en
 * enveloppe) et le hero de la fiche activité (bouton bleu « Message »).
 *
 * ⚠️ CETTE FEUILLE NE REDÉFINIT PAS LE MENU, elle le complète.
 * `css/dashboard-modern.css` (bloc « P2.4 Dropdowns (generic) ») pose déjà, en
 * !important sous `body.eb-has-topbar-v2`, le cadre, le rayon, l'ombre, le
 * padding des entrées, le survol et le focus de TOUS les menus du produit.
 * Rejouer ces valeurs ici, c'est ouvrir un deuxième jeu de constantes qui
 * divergera. On n'ajoute donc que ce qui manque : la gouttière d'icônes, les
 * intitulés de famille, et l'état « indisponible ».
 *
 * Le vocabulaire visuel est celui du menu « Exporter » (write_export_menu() /
 * `.eb-export-menu`, même feuille) : c'est le précédent maison pour un menu
 * d'actions à icônes, et les deux se croisent sur les mêmes écrans.
 *
 * Les rares valeurs posées ici sans !important (padding, rayon) servent de
 * repli : elles s'appliquent si la page n'a pas la barre V2, et se font battre
 * par les règles génériques quand elle l'a.
 */

.eb-msgmenu {
    /* !important : main.css impose `.dropdown-menu { min-width:100px !important }`
       à tous les menus, que la spécificité seule ne peut pas battre. Même
       raison que `.eb-export-menu` (dashboard-modern.css). */
    min-width: 232px !important;
    max-width: calc(100vw - 24px);
}

/* Intitulé de famille (« Envoyer », « Exporter »), repris à l'identique de
   `.eb-export-menu-title`. Rendu seulement quand le menu porte VRAIMENT les
   deux familles (cf. $groupe dans messageButton()) : sur un menu à deux
   entrées, deux en-têtes coûteraient plus de hauteur qu'ils n'apporteraient
   de lisibilité. */
.eb-msgmenu .eb-msgmenu-title {
    padding: 6px 10px 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--eb-text-muted, #94a3b8);
    white-space: nowrap;
    pointer-events: none;
}

.eb-msgmenu .eb-msgmenu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    border: 0;
    background: none;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
    /* Replis, battus par les règles génériques quand la barre V2 est là. */
    padding: 8px 12px;
    border-radius: 6px;
    color: var(--eb-text, #0f172a);
}

/* Largeur FIXE : c'est la gouttière d'icônes qui aligne les libellés. Sans
   elle, une icône plus large que sa voisine (fa-file-csv contre fa-ticket)
   décale sa seule ligne. Avant, deux entrées sur cinq portaient une icône et
   les trois autres commençaient ailleurs : le bord gauche du menu était en
   dents de scie. */
.eb-msgmenu .eb-msgmenu-ico {
    flex: 0 0 18px;
    width: 18px;
    font-size: 13px;
    text-align: center;
    color: var(--eb-text-secondary, #64748b);
}

.eb-msgmenu .eb-msgmenu-txt {
    flex: 1 1 auto;
    min-width: 0;
}

/* Au survol, la règle générique passe TOUTE la ligne en --eb-primary : l'icône
   doit suivre, sinon elle reste grise au milieu d'une ligne bleue. */
@media (hover: hover) {
    .eb-msgmenu .eb-msgmenu-item:hover:not(.eb-msgmenu-item--off) .eb-msgmenu-ico {
        color: inherit;
    }
}
.eb-msgmenu .eb-msgmenu-item:focus .eb-msgmenu-ico {
    color: inherit;
}

/* Contrepartie du passage de <a> sans href (jamais focusable) à <button> : le
   focus clavier doit se voir. Même traitement que `.eb-export-item`. */
.eb-msgmenu .eb-msgmenu-item:focus-visible {
    outline: 2px solid var(--eb-primary, #2563eb);
    outline-offset: -2px;
}

/* Indisponible. L'ancien rendu peignait un bandeau plein
   (`background-color: var(--bkg-color16) !important`) : sur fond clair il se
   lisait comme « entrée sélectionnée », l'inverse du message. On estompe, on
   garde le curseur d'interdit, et le POURQUOI part dans l'info-bulle — deux
   raisons distinctes, jusqu'ici indiscernables : aucun inscrit à qui écrire,
   ou pas la permission d'écrire.
   ⚠️ !important obligatoire : le survol générique de dashboard-modern.css en
   est pourvu, et repeindrait la ligne en bleu au passage de la souris. */
.eb-msgmenu .eb-msgmenu-item--off,
.eb-msgmenu .eb-msgmenu-item--off:hover,
.eb-msgmenu .eb-msgmenu-item--off:focus,
.eb-msgmenu .eb-msgmenu-item--off:active {
    background: transparent !important;
    color: var(--eb-text-muted, #94a3b8) !important;
    cursor: not-allowed;
}
.eb-msgmenu .eb-msgmenu-item--off .eb-msgmenu-ico {
    color: var(--eb-text-muted, #94a3b8) !important;
    opacity: 0.65;
}

/* PAS de variante bottom-sheet mobile ici, et c'est délibéré : sous 768 px ce
   menu N'EXISTE PAS. Dans le planning son déclencheur porte `hide_mobile` ;
   sur la fiche activité, mesure à 375 px — aucun `.eb-msgmenu` dans le DOM, le
   hero ne rend pas le bouton. Écrire des règles `@media (max-width: 767.98px)`
   pour ce menu serait styler quelque chose que personne ne voit. Le jour où le
   bouton sera rendu sur mobile, la classe `eb-action-sheet` posée sur le <ul>
   suffit à le faire monter en bottom-sheet (css/eb-action-sheet.css).
   --------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------
   Variante « simple » : une seule option disponible, donc pas de menu. Le
   bouton n'affiche que l'enveloppe, et l'unique lien lui est superposé,
   invisible.

   Ces règles étaient émises en <style> inline PAR messageButton(), donc
   RÉPÉTÉES dans chaque ligne du planning pour un contenu rigoureusement
   identique. Dans la liste, css/evenement_choice.css masque carrément ces
   enfants (`.simple.alert-icon > span, > a { display:none }`) ; ce qui suit
   couvre la fiche activité.
   --------------------------------------------------------------------------- */
.simple a {
    position: relative;
    z-index: 100;
    bottom: 19px;
    transform: rotate(90deg);
    opacity: 0;
}
.simple a trad {
    font-size: 7px;
}
/* Enveloppe barrée : l'unique option n'est pas disponible. */
.simple.eb-msgbtn--off i {
    cursor: not-allowed;
    opacity: 50%;
}
