/* RELAY — Phase 2 : fixes responsives / overflow. */

/* ── Notif panel : ne sort plus de l'écran sur petit format ─ */
@media (max-width: 640px) {
  .notif-panel {
    position: fixed !important;
    top: 70px !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100vh - 90px);
    overflow-y: auto;
  }
}

/* ── Flow Overflow-to-Partner : autorise wrap + zoom adapté ─ */
@media (max-width: 720px) {
  /* Conteneur du flow : permet le wrap */
  div[style*="FLUX DE REDIRECTION"] + div,
  div[style*="flex-direction:column"] > div[style*="align-items:center"][style*="gap:6px"],
  div[style*="overflow-x:auto"][style*="flex-wrap:nowrap"] {
    flex-wrap: wrap !important;
    justify-content: center;
    row-gap: 8px;
  }
  /* Réduit la taille des "badges" du flow */
  .fb {
    padding: 6px 10px !important;
    font-size: 10px !important;
  }
  .fn > div:nth-child(2) {
    font-size: 7px !important;
  }
  .fa {
    min-width: 28px !important;
  }
}

@media (max-width: 480px) {
  /* En très petit, on accepte que les noeuds soient un peu serrés */
  .fb {
    padding: 5px 8px !important;
    font-size: 9px !important;
  }
}

/* ── Plus d'espace entre le titre et le champ "Rechercher" ── */
#view-radar > div:first-child {
  margin-bottom: 28px !important;
}

#radar-q {
  margin-top: 4px;
  padding: 11px 14px !important;
  font-size: 13px !important;
}

/* ── Sécurité globale : empêcher les rangées "nowrap" de pousser hors écran ── */
.view {
  overflow-x: hidden;
}

/* ── Topbar : la barre de nav s'enroule proprement sur tablette ── */
@media (max-width: 1024px) {
  .nav-wrap {
    flex-wrap: wrap;
  }
}

/* ── Cards qui dépassent : largeur max 100% du parent ─────── */
.card {
  max-width: 100%;
}

/* ── Tableaux admin : scroll horizontal plutôt que débordement ── */
@media (max-width: 720px) {
  table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}