/* ============ Réseau (spec 2026-09-24-reseau-portail § 7) — styles .res-* ============
   Espace admin #/reseau (organismes, fiche, contacts, import) + section « Notifications » du profil.
   S'appuie sur les motifs du référentiel d'organismes (.org-*, css/organismes.css) et de l'écran Comptes
   (.compte-form, .cv-at-*, .cv-etat) ; jetons uniquement (aucune couleur en dur), lisible dans les deux thèmes,
   glyphes monochromes (aucun emoji). Mobile d'abord (390 px). */

.res-synthese{margin:10px 0 0; font-size:.8rem; line-height:1.5; color:var(--text-2); overflow-wrap:anywhere}

/* ---------- Filtres de la liste ---------- */
.res-filtres{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap:10px 12px; margin:12px 0 4px}
.res-filtres .auth-input{width:100%; min-width:0}
.res-filtre-q{grid-column:1 / -1}
.res-cases{display:flex; flex-wrap:wrap; align-items:center; gap:0 18px; margin:2px 0}
.res-case{min-height:44px}
.res-reinit{margin-left:auto; min-height:44px}
/* Recherche toujours visible ; les autres filtres dans un bloc que l'écran compact replie (bouton « Filtres · n »).
   En large, le bouton n'existe pas visuellement et l'espacement reste celui d'une seule grille. */
.res-filtres--q{margin-bottom:0}
.res-filtres-bloc > .res-filtres{margin-top:10px}
.res-ecran .res-filtres-bascule{display:none}

/* ---------- Pastilles vague / palier : l'accent marque la priorité (vague 1, palier 1) ---------- */
.res-vague--1, .res-palier--1{color:var(--accent); background:var(--accent-fond); border-color:var(--accent-glow); font-weight:600}
.res-vague--veille{color:var(--text-3)}

/* ---------- Fiche : champs du référentiel en lecture seule ---------- */
.res-champs{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap:10px 16px}
.res-champ{display:flex; flex-direction:column; gap:3px; min-width:0; padding:8px 0; border-top:1px solid var(--line)}
.res-champ-lib{font-size:.66rem; color:var(--text-3); letter-spacing:.06em; text-transform:uppercase}
.res-champ-val{font-size:.86rem; line-height:1.45; color:var(--text); overflow-wrap:anywhere}
.res-lien-bo{margin:0; font-size:.8rem; line-height:1.5; color:var(--text-3)}
.res-source{font-style:italic}
.res-annonce{margin:0 0 4px}

/* ---------- Contacts ---------- */
.res-ajouter{align-self:flex-start; min-height:44px}
.res-ajout, .res-edition{padding:12px 0 0; border-top:1px solid var(--line)}
.res-contacts-liste, .res-liste-contacts{display:flex; flex-direction:column; gap:8px}
.res-contact{display:flex; flex-direction:column; gap:8px; min-width:0}
.res-contact--retire{background:var(--surface-2)}
.res-contact--retire .res-contact-nom{color:var(--text-2)}
.res-contact-tete{display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; min-width:0}
.res-contact-nom{font-size:.94rem; font-weight:700; color:var(--text); overflow-wrap:anywhere}
.res-contact-fonction{margin:0; font-size:.84rem; color:var(--text-2); overflow-wrap:anywhere}
.res-contact-org{font-size:.82rem; font-weight:600; align-self:flex-start}
.res-coords{margin:0; display:flex; flex-direction:column; gap:4px}
.res-coord{display:grid; grid-template-columns:90px minmax(0, 1fr); align-items:center; gap:2px 10px; min-width:0}
.res-coord dt{font-size:.66rem; color:var(--text-3); letter-spacing:.06em; text-transform:uppercase}
.res-coord dd{margin:0; display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; min-width:0; font-size:.86rem; color:var(--text)}
.res-coord-val{overflow-wrap:anywhere; user-select:all}
.res-copier, .res-mailto{display:inline-flex; align-items:center; min-height:44px; font-size:.8rem}
.res-contact-verif{font-size:.74rem}
.res-contact-actions .compte-reset, .res-contact-actions .compte-valider, .res-contact-actions .cv-danger{min-height:44px}
.res-effacement{display:flex; flex-direction:column; gap:10px}
.res-retires > summary{min-height:44px}

/* Formulaire d'un contact */
.res-form{display:flex; flex-direction:column; gap:var(--sp-3)}
.res-form-grille{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap:12px 16px}
.res-form-grille .auth-input{width:100%; min-width:0}
.res-form .auth-input[aria-invalid="true"]{border-color:var(--crit-line); box-shadow:0 0 0 2px var(--crit-bg)}
.res-envoyer{height:48px; min-width:170px; margin-top:0; padding:0 var(--sp-4)}

/* ---------- Import ---------- */
.res-import .cv-fichier{width:100%}
.res-import-lancer{align-self:flex-start; min-width:170px; padding:0 22px}
.res-import-suivi{display:flex; flex-direction:column; gap:6px}
.res-import-barre{width:100%; height:10px; accent-color:var(--accent)}
.res-import-progression{margin:0; font-size:.8rem; color:var(--text-2)}
.res-import-rapport{display:flex; flex-direction:column; gap:10px}
.res-import-synthese{margin:0; font-size:.86rem; line-height:1.5; color:var(--text)}

/* ---------- Profil : section « Notifications » (dans Compte) ---------- */
.res-notif{margin-top:var(--sp-5)}
.res-notif-inner{display:flex; flex-direction:column; gap:12px; padding:16px 18px; border:1px solid var(--line-2); border-radius:var(--r-lg); background:var(--surface-2)}
.res-notif-phrase{margin:0}
.res-notif-reglage{gap:4px}
.res-notif-choix{align-items:flex-start; padding:6px 0}
.res-notif-choix input{margin-top:2px}
.res-notif-txt{display:flex; flex-direction:column; gap:2px; min-width:0}
.res-notif-txt strong{font-size:.88rem; font-weight:600; color:var(--text)}
.res-notif-aide{font-size:.78rem; line-height:1.4; color:var(--text-3)}
.res-notif-statut{margin-top:4px}

@media (max-width:640px){
  .res-filtres{grid-template-columns:minmax(0, 1fr) minmax(0, 1fr)}
  .res-reinit{margin-left:0}
  .res-coord{grid-template-columns:minmax(0, 1fr)}
  .res-contact-actions .compte-reset, .res-contact-actions .compte-valider, .res-contact-actions .cv-danger{flex:1 1 auto}
  .res-envoyer{flex:1 1 auto}
}

/* Écran compact (≤ 600 px, même seuil que logic.COMPACT_MAX) : K1 en ≤ 3 gestes à 390 px — la liste commence dans le premier
   écran (filtres repliés) ; la fiche met les contacts en tête (ordre du DOM, réglé par views.js, pas par `order`). */
@media (max-width:600px){
  .res-ecran .res-filtres-bascule{display:inline-flex; align-items:center; justify-content:center; min-height:44px; margin:10px 0 2px}
  .res-filtres-bloc:not(.est-ouvert){display:none}
}

/* `hidden` l'emporte toujours sur les display des classes ci-dessus. */
.res-ecran [hidden], .res-notif [hidden]{display:none !important}