/* === DIALOG-FORMULAIRE (mesure / événement) : plein écran mobile, centré desktop === */
/* En-tête et pied ÉPINGLÉS (titre + Enregistrer toujours visibles), corps scrollable entre les deux. */
/* Dialog-formulaire = carte centrée compacte partout (plus de plein écran mobile). En-tête et pied
   épinglés, corps scrollable entre les deux (max-height bornée). */
.dlg--form { padding: 1rem; }
.dlg-panel--form { width: min(480px, 100%); min-width: 0; max-width: 100%; max-height: 88vh; border-radius: var(--radius-card); border: 1px solid var(--border); padding: 0; display: flex; flex-direction: column; gap: 0; overflow: hidden; }
.dlg-head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.85rem 1.1rem; border-bottom: 1px solid var(--header-border); }
.dlg-head .dlg-title { padding-inline-end: 0; }
.dlg-head .dlg-close { position: static; }
.dlg-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 1rem 1.1rem 1.4rem; display: flex; flex-direction: column; gap: 0.9rem; }
/* Les enfants du corps ne se COMPRESSENT jamais en HAUTEUR (flex-shrink:1 par défaut écrasait la
   rangée de chips en "fine ligne" quand les champs poussaient) : le corps scrolle verticalement.
   min-width:0 en revanche indispensable, sinon un enfant à min-content large déborde en LARGEUR. */
.dlg-body > * { flex-shrink: 0; min-width: 0; max-width: 100%; }
.dlg-foot { flex: 0 0 auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.5rem; padding: 0.75rem 1.1rem calc(0.75rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--header-border); background: var(--bg-card); }
.dlg-foot .pill { flex: 1 1 8rem; white-space: nowrap; text-align: center; }
/* Desktop : redevient un dialog centré classique. */
@media (min-width: 600px) {
  .dlg--form { padding: 1rem; }
  .dlg-panel--form { width: min(480px, 100%); height: auto; max-height: 90vh; border-radius: var(--radius-card); border: 1px solid var(--border); }
  .dlg-foot .pill { flex: 0 0 auto; }
}

/* === FAB (M3) : action de création (Mesure / Événement). Connecté seulement. === */
.fab-wrap { position: fixed; inset-inline-end: 1rem; bottom: calc(4.5rem + env(safe-area-inset-bottom) + 1rem); z-index: 950; display: none; flex-direction: column; align-items: flex-end; gap: 0.6rem; }
body.authed .fab-wrap { display: flex; }
.fab { width: 56px; height: 56px; border: none; border-radius: var(--radius-pill); background: var(--accent); color: var(--on-accent); cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.45); transition: transform 0.2s ease, background-color 0.2s ease; }
.fab svg { width: 26px; height: 26px; transition: transform 0.2s ease; }
/* Libellé du FAB : masqué sur mobile (rond icône seule). */
.fab-lab { display: none; }
/* Desktop : EXTENDED FAB (icône + libellé, reco M3 grands écrans : plus découvrable). */
@media (min-width: 600px) {
  .fab-wrap { inset-inline-end: 1.5rem; bottom: 1.5rem; }
  .fab { width: auto; height: 48px; border-radius: var(--radius-pill); padding: 0 1.15rem 0 0.95rem; gap: 0.45rem; }
  .fab svg { width: 22px; height: 22px; }
  .fab-lab { display: inline; font-family: var(--font-text); font-weight: 600; font-size: 0.95rem; }
}
.fab:hover { background: var(--accent-hover); }
.fab.is-open svg { transform: rotate(45deg); } /* + devient x quand le menu est ouvert */
/* Onboarding (incrément 1) : anneau « sonar » sur le FAB jusqu'à sa 1re utilisation.
   Purement décoratif (::after transparent + pointer-events:none) : ne couvre jamais l'icône
   et ne bloque pas le clic. La classe .onb-pulse est posée/retirée en JS (setupFab). */
.fab.onb-pulse { position: relative; }
.fab.onb-pulse::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 2px solid var(--accent);
  pointer-events: none;
  animation: onb-sonar 1.6s ease-out infinite;
}
@keyframes onb-sonar {
  0%   { transform: scale(1);   opacity: 0.7; }
  100% { transform: scale(1.6); opacity: 0; }
}
/* Confort de mouvement : pas d'animation, on garde juste un anneau statique comme repère. */
@media (prefers-reduced-motion: reduce) {
  .fab.onb-pulse::after { animation: none; transform: none; opacity: 0.7; }
}
.fab-menu { display: flex; flex-direction: column; align-items: flex-end; gap: 0.5rem; }
.fab-item { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.65rem 1.1rem; border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--bg-card); color: var(--text-primary); cursor: pointer; font-family: var(--font-text); font-weight: 600; font-size: 0.92rem; box-shadow: var(--shadow-card); }
.fab-item:hover { border-color: var(--accent); color: var(--accent); }

/* === TOAST global (form-msg sorti du formulaire) === */
.form-msg.toast { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(4.5rem + env(safe-area-inset-bottom) + 1rem); z-index: 1300; max-width: min(92vw, 26rem); background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-card); padding: 0.6rem 1rem; font-size: 0.9rem; text-align: center; }
@media (min-width: 600px) { .form-msg.toast { bottom: 1.5rem; } }

/* === PARTAGE (fallback desktop) : ligne "copier le lien" + icônes réseaux === */
.share-panel { text-align: center; width: min(460px, calc(100% - 2rem)); }
.share-copy { display: flex; gap: 0.5rem; margin: 0.7rem 0 1rem; }
.share-url { flex: 1; min-width: 0; padding: 0.5rem 0.7rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--bg-secondary); color: var(--text-primary); font-size: 0.85rem; }
.share-copybtn { white-space: nowrap; }
.share-nets { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.6rem 0.4rem; justify-items: center; }
@media (max-width: 380px) { .share-nets { grid-template-columns: repeat(4, 1fr); } }
.share-net { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; background: none; border: none; cursor: pointer; padding: 0; color: var(--text-secondary); font: inherit; }
.share-net-ic { width: 2.6rem; height: 2.6rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: transform 0.12s ease; }
.share-net:hover .share-net-ic { transform: scale(1.08); }
.share-net-lbl { font-size: 0.66rem; }
.share-copyfor { display: flex; align-items: center; gap: 0.5rem; margin: 1rem 0 0.6rem; font-size: 0.68rem;
  text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-secondary); }
.share-copyfor::before, .share-copyfor::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.share-status { min-height: 1.1rem; margin-top: 0.7rem; font-size: 0.82rem; color: var(--ok); }