/* ============================================================================
   refonte-lots/zzzz-annuaire.css  —  ÉCRAN « Annuaire » (annuaire.php)
   ----------------------------------------------------------------------------
   RÔLE : couche additive chargée EN DERNIER. Densifie les fiches membres de
   l'annuaire en LIGNES horizontales (avatar / identité / code) fidèles à la
   maquette 27, charte sombre, sans débordement <=768px. N'ajoute AUCUNE classe :
   utilise uniquement les classes réelles de annuaire.php (.anu-*).
   ROLLBACK : supprimer ce fichier (ou retirer son inclusion). 100% réversible.
   NE TOUCHE PAS au Gardien ni à Étincelles (aucune règle les ciblant).
   ============================================================================ */

@media (max-width: 768px), (pointer: coarse) and (max-width: 1366px), (display-mode: standalone) and (max-width: 1366px) {

  /* --- Cadre général : marge latérale confortable comme la maquette --------- */
  html.apprefonte .anu-wrap { padding: 8px 14px 40px !important; }

  /* --- Titre en blanc cassé (charte) ---------------------------------------- */
  html.apprefonte .anu-head h1 { color: #F6F0DF !important; }
  html.apprefonte .anu-sub    { color: #9FB0C6 !important; }
  /* Note admin : vert hors-charte -> cyan d'information */
  html.apprefonte .anu-admin  { color: #35D7D1 !important; }

  /* --- Recherche : champ haut, surface sombre, anti-zoom iOS (16px) ---------- */
  html.apprefonte .anu-search { gap: 8px !important; margin: 14px 0 12px !important; }
  html.apprefonte .anu-search-in input {
    background: #0D2233 !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 14px !important;
    color: #F6F0DF !important;
    font-size: 16px !important;
    min-height: 52px;
    padding: 11px 12px 11px 38px !important;
  }
  html.apprefonte .anu-search-in svg { color: #9FB0C6 !important; }
  html.apprefonte .anu-btn {
    background: #35D7D1 !important; color: #071624 !important;
    border-radius: 14px !important; min-height: 52px; font-size: 15px !important;
  }

  /* --- Ligne « (ne pas) apparaître dans l'annuaire » = carte-interrupteur ---- */
  html.apprefonte .anu-selfrow {
    background: #0D2233 !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 14px !important;
    padding: 14px 16px !important;
    justify-content: space-between !important;
    align-items: center !important;
    min-height: 56px; box-sizing: border-box;
    margin: 0 0 16px !important;
  }
  html.apprefonte .anu-check { color: #F6F0DF !important; font-size: 15px !important; }
  html.apprefonte .anu-check input { width: 20px; height: 20px; accent-color: #FFB65A; }
  html.apprefonte .anu-msg { color: #35D7D1 !important; }

  /* --- Compteur en ambre (accent maquette) ---------------------------------- */
  html.apprefonte .anu-count {
    color: #FFB65A !important; font-size: 17px !important; font-weight: 700;
    margin: 0 0 14px !important;
  }

  /* ==========================================================================
     LIGNES-MEMBRES DENSES (cœur de l'écart maquette)
     La grille auto-fill devient UNE colonne ; chaque .anu-card passe de fiche
     verticale centrée -> LIGNE horizontale : avatar (gauche, 2 rangs) /
     identité empilée (nom + meta) / code membre à droite.
     ====================================================================== */
  html.apprefonte .anu-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  html.apprefonte .anu-card {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas:
      "av name code"
      "av meta code";
    column-gap: 14px; row-gap: 2px;
    align-items: center;
    text-align: left !important;
    min-height: 72px; box-sizing: border-box;
    padding: 12px 14px !important;
    background: #0D2233 !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 16px !important;
  }
  html.apprefonte .anu-card:hover {
    border-color: rgba(53,215,209,.45) !important;
    background: #0D2233 !important;
  }

  html.apprefonte .anu-card .anu-av   { grid-area: av;   align-self: center; margin: 0; }
  html.apprefonte .anu-card .anu-name { grid-area: name; align-self: end;   margin: 0; }
  html.apprefonte .anu-card .anu-meta { grid-area: meta; align-self: start; margin: 0; }
  html.apprefonte .anu-card .anu-code { grid-area: code; align-self: center; margin: 0; }

  /* Identité : nom plus lisible en blanc cassé, meta en gris doux, tronqués */
  html.apprefonte .anu-card .anu-name {
    font-size: 17px !important; font-weight: 700; color: #F6F0DF !important;
  }
  html.apprefonte .anu-card .anu-meta { font-size: 13px !important; color: #9FB0C6 !important; }

  /* Code membre en pastille sombre à droite (maquette) */
  html.apprefonte .anu-card .anu-code {
    font-size: 12.5px !important; color: #9FB0C6 !important;
    background: #071624 !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 10px; padding: 7px 10px; white-space: nowrap;
  }

  /* --- État vide -------------------------------------------------------------- */
  html.apprefonte .anu-empty { color: #9FB0C6 !important; }

}
/* fin @media — le bureau (>768px) reste 100% intact */