/* Palette reprise de la charte du site : bleus #0f3b5c / #135688, doré #d4b868.

   Empilement : Divi ne déclare aucun z-index sur les sections fixes du Theme Builder
   (seulement width:100%), donc 100000 suffit à flotter au-dessus de l'en-tête.

   Position : calculée en JavaScript et appliquée en pixels sur top/left, jamais par
   bottom/right. Passer de top à bottom ne s'animerait pas, le navigateur n'interpolant
   pas entre deux propriétés différentes ; en restant sur les deux mêmes, le déplacement
   entre le haut à droite et le bas à gauche se fait en glissant. */

/* Masqué jusqu'au premier placement : le script ajoute mactus-ready sur <html> une fois
   la position calculée. Sans cela, le bouton s'afficherait à la position par défaut du CSS
   puis glisserait jusqu'à sa vraie place, ce qui se voit surtout sur écran étroit où il
   traverse toute la page. Aucune transition tant que cette classe est absente : le premier
   placement doit être instantané, seuls les déplacements ultérieurs s'animent.
   Conséquence assumée : sans JavaScript, le bouton n'apparaît pas — il serait de toute
   façon inopérant, la bulle ne pouvant pas s'ouvrir. */
.mactus-button {
    position: fixed;
    z-index: 100000;
    top: 14px;
    left: calc(100vw - 56px);
    opacity: 0;
    visibility: hidden;
    transition: none;
    width: 40px;
    height: 40px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c2a45d;
    border-radius: 50%;
    background: #0f3b5c;
    color: #f0d9a0;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(9, 34, 53, .3);
}
.mactus-ready .mactus-button {
    opacity: 1;
    visibility: visible;
    transition: opacity .3s ease,
                top .35s cubic-bezier(.22, .61, .36, 1),
                left .35s cubic-bezier(.22, .61, .36, 1),
                transform .2s ease,
                background-color .2s ease;
}
.mactus-button:hover { background: #135688; transform: scale(1.06); }
.mactus-button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.mactus-icon { width: 22px; height: 22px; display: block; }

/* Pastille signalant une actualité non lue. La bordure claire la détache du bouton,
   qui est lui-même bleu foncé, et du fond de page quel qu'il soit. */
.mactus-dot {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 13px;
    height: 13px;
    border: 2px solid #fdf7ea;
    border-radius: 50%;
    background: #c62828;
    box-shadow: 0 1px 3px rgba(9, 34, 53, .4);
}
.mactus-dot[hidden] { display: none !important; }

/* Texte réservé aux lecteurs d'écran : la pastille seule ne dit rien à qui ne la voit pas. */
.mactus-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.mactus-sr[hidden] { display: none !important; }

/* Conteneur plein écran : il ne sert qu'à capter le clic extérieur. */
.mactus-modal {
    position: fixed;
    inset: 0;
    z-index: 100000;
    opacity: 0;
    transition: opacity .25s ease;
}
.mactus-modal.is-open { opacity: 1; }
.mactus-modal[hidden] { display: none !important; }
.mactus-modal__overlay { position: absolute; inset: 0; background: transparent; }

/* Bulle ancrée au bouton, dont la position est publiée par le script. */
.mactus-modal__dialog {
    position: absolute;
    top: calc(var(--mactus-btn-top, 62px) + 52px);
    right: 16px;
    width: 330px;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - var(--mactus-btn-top, 62px) - 80px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 20px 22px;
    background: #fdf7ea;
    border: 1px solid #ddd0ac;
    border-radius: 10px;
    box-shadow: 0 10px 34px rgba(9, 34, 53, .3);
    color: #20303d;
    font-size: .875rem;
    line-height: 1.5;
    transform: translateY(-6px);
    transition: transform .25s ease;
}
.mactus-modal.is-open .mactus-modal__dialog { transform: translateY(0); }

/* Flèche pointant vers le bouton : deux triangles superposés pour figurer la bordure. */
.mactus-modal__dialog::before,
.mactus-modal__dialog::after {
    content: "";
    position: absolute;
    right: 14px;
    border: 9px solid transparent;
}
.mactus-modal__dialog::before { top: -18px; border-bottom-color: #ddd0ac; }
.mactus-modal__dialog::after { top: -17px; border-bottom-color: #fdf7ea; }

/* Bouton en bas à gauche : la bulle s'ouvre au-dessus de lui, et la flèche se retourne. */
.mactus-pos-bas .mactus-modal__dialog {
    top: auto;
    bottom: calc(100vh - var(--mactus-btn-top, 0px) + 12px);
    right: auto;
    left: 16px;
    max-height: calc(var(--mactus-btn-top, 100vh) - 24px);
    transform: translateY(6px);
}
.mactus-pos-bas .mactus-modal__dialog::before,
.mactus-pos-bas .mactus-modal__dialog::after { right: auto; left: 14px; top: auto; }
.mactus-pos-bas .mactus-modal__dialog::before { bottom: -18px; border-bottom-color: transparent; border-top-color: #ddd0ac; }
.mactus-pos-bas .mactus-modal__dialog::after { bottom: -17px; border-bottom-color: transparent; border-top-color: #fdf7ea; }

.mactus-modal__dialog h2 { margin: 0 34px 10px 0; color: #0f3b5c; font-size: 1.05rem; line-height: 1.3; }

.mactus-modal__close {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #0f3b5c;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}
.mactus-modal__close:hover { background: rgba(15, 59, 92, .1); }
.mactus-modal__close:focus-visible { outline: 2px solid #0f3b5c; outline-offset: 1px; }

/* Sélecteur portant l'élément : Divi injecte en inline
   `p:not(.has-background):last-of-type{padding-bottom:0}`, de même spécificité qu'une
   simple classe, et l'emporterait à égalité puisqu'il est écrit après cette feuille. */
.mactus-content > :first-child { margin-top: 0; }
.mactus-content > :last-child { margin-bottom: 0; }
.mactus-content p:not(.has-background) { margin: 0 0 10px; padding-bottom: 0; }
.mactus-content a { color: #135688; text-decoration: underline; }
.mactus-content img { max-width: 100%; height: auto; border-radius: 6px; }
.mactus-content ul, .mactus-content ol { margin: 0 0 10px; padding-left: 18px; }
.mactus-content li { margin-bottom: 3px; }

/* Lien présenté en bouton : classe à ajouter à la main dans l'éditeur. */
.mactus-content a.mactus-btn {
    display: inline-block;
    margin: 6px 6px 4px 0;
    padding: 8px 14px;
    border: 1px solid #0f3b5c;
    border-radius: 5px;
    background: #0f3b5c;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}
.mactus-content a.mactus-btn:hover { background: #135688; border-color: #135688; }
.mactus-content a.mactus-btn:focus-visible { outline: 2px solid #956300; outline-offset: 2px; }

@media (max-width: 600px) {
    .mactus-modal__dialog { width: auto; right: 12px; left: 12px; max-width: none; padding: 18px; }
    .mactus-pos-bas .mactus-modal__dialog { right: 12px; left: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    .mactus-button, .mactus-modal, .mactus-modal__dialog { transition: none; }
    .mactus-modal__dialog { transform: none; }
}