/* Être rappelé (inc/theme-rappel.php) : le panneau qui encapsule la modal de gf-app. Mêmes valeurs que
   le panneau du tunnel de gf-app (rappel-overlay.css) : en bas à droite, sans voile — la page reste
   lisible et cliquable —, fond #fafafa, rayon 20 ; plein écran sur téléphone (≤ 600 px). */
.gf-rappel {
    position: fixed; right: 20px; bottom: 20px; z-index: 2147483000;
    display: block; width: 25rem; max-width: calc(100vw - 40px); max-height: calc(100vh - 40px);
}
.gf-rappel[hidden] { display: none; }
.gf-rappel-boite {
    position: relative; display: flex; flex-direction: column; justify-content: center; width: 100%; max-height: calc(100vh - 40px);
    background: #fafafa; border-radius: 20px; box-shadow: 0 12px 40px 0 rgba(24, 21, 47, .18);
    overflow: hidden; animation: gf-rappel-entree .3s ease-out both;
}
@keyframes gf-rappel-entree { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.gf-rappel-fermer {
    position: absolute; top: 7px; right: 7px; z-index: 1;
    display: grid; place-items: center; width: 44px; height: 44px;
    padding: 0; border: 0; background: transparent; color: #18152f; cursor: pointer;
    transition: color .15s ease-in-out;
}
.gf-rappel-fermer svg { display: block; width: 18px; height: 18px; }
.gf-rappel-fermer:hover { color: #ff6666; }
.gf-rappel-fermer:focus-visible { outline: 2px solid #18152f; outline-offset: -6px; border-radius: 10px; }
/* La hauteur suit le contenu (annoncée par la modal) ; `max` = toute la place. */
.gf-rappel-frame { display: block; flex: none; width: 100%; height: 380px; max-height: calc(100vh - 40px); border: 0; transition: height .3s ease-out; }
.gf-rappel-plein .gf-rappel-frame { height: calc(100vh - 40px); }

/* Ouverte depuis « Aide & Contact » (header) : au milieu de l'écran, sur un voile. `:not([hidden])` pour ne pas
   l'emporter sur `.gf-rappel[hidden]`. */
.gf-rappel.gf-rappel-centre:not([hidden]) {
    top: 0; right: 0; bottom: 0; left: 0; width: auto; max-width: none; max-height: none;
    display: flex; align-items: center; justify-content: center; background: rgba(24, 21, 47, .45);
}
.gf-rappel.gf-rappel-centre .gf-rappel-boite { width: 25rem; max-width: calc(100vw - 40px); }
html.gf-rappel-ouvert:has(.gf-rappel-centre:not([hidden])) { overflow: hidden; }

@media (max-width: 600px) {
    .gf-rappel { top: 0; right: 0; bottom: 0; left: 0; width: auto; max-width: none; max-height: none; }
    .gf-rappel-boite, .gf-rappel.gf-rappel-centre .gf-rappel-boite { width: 100%; max-width: none; height: 100%; max-height: none; border-radius: 0; }
    .gf-rappel-frame { max-height: 100%; }
    html.gf-rappel-ouvert, html.gf-rappel-ouvert body { overflow: hidden; }
}
