/* Adjugé! — IMPERSONATION ADMIN (« se connecter en tant que » un membre).
   Bannière fixée en haut PENDANT une impersonation + feuille de recherche admin.
   Réutilise les patrons de feuille (.sheet-*) et de ligne (.p-row) existants.
   Couche mobile-first ; le desktop hérite des patrons partagés (la feuille est
   ajoutée aux listes de app.desktop.css). */

/* ---------- Bannière (fixée en haut, au-dessus de tout) ---------- */
#impersonation-bar {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 100000;                       /* au-dessus des headers/tabbar */
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: calc(7px + var(--sat)) 14px 7px;
  background: linear-gradient(135deg, #B45309, #92400E);  /* ambre profond, distinct du vert */
  color: #FFF8EF;
  font-size: 13px; font-weight: 700;
  box-shadow: 0 2px 10px rgba(0,0,0,0.18);
}
.imp-bar-txt {
  display: inline-flex; align-items: center; gap: 6px;
  min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.imp-bar-txt strong { font-weight: 800; }
#imp-bar-stop {
  flex: 0 0 auto;
  border: 0; border-radius: 999px;
  padding: 6px 12px;
  background: rgba(255,255,255,0.95); color: #92400E;
  font-size: 12px; font-weight: 800; cursor: pointer;
}
#imp-bar-stop:active { transform: scale(0.97); }

/* Quand la bannière est là, on pousse le contenu en flux ET le header flottant
   du feed sous elle (≈ 34px + encoche). Les autres écrans (flux normal) sont
   couverts par le padding du body. */
html.has-imp-bar body { padding-top: calc(34px + var(--sat)); }
html.has-imp-bar .float-header { top: calc(34px + var(--sat)); }

/* ---------- Feuille de recherche admin ---------- */
/* Même gabarit bottom-sheet que feedback/support (ancrée en bas, arrondie, anim
   sheetUp) + backdrop plein écran. Sans ces règles, la feuille tomberait dans le
   flux normal en BAS de page (bug). Le desktop la recentre (listes app.desktop.css). */
#impersonate-sheet {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 100%; max-width: 480px; z-index: 60;
  background: #FFFFFF; border-radius: 26px 26px 0 0;
  padding: 10px 18px calc(24px + var(--sab));
  animation: sheetUp 0.35s cubic-bezier(0.2,0.9,0.3,1) both;
  max-height: 86dvh; overflow: auto;
}
#impersonate-backdrop {
  position: fixed; inset: 0; z-index: 59; background: rgba(24,17,9,0.45);
  animation: fadeIn 0.25s ease both;
}
#impersonate-sheet .f-input { margin-top: 4px; }

#impersonate-sheet .imp-err,
.imp-err {
  display: none; margin: 8px 0 0;
  color: #B42318; font-size: 13px; font-weight: 600;
}
.imp-err:not([hidden]) { display: block; }

#impersonate-results { margin-top: 10px; display: flex; flex-direction: column; gap: 2px; }
.imp-empty {
  padding: 16px 4px; text-align: center;
  color: var(--muted, #8A8A8A); font-size: 14px;
}
.imp-row {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 10px 6px; border: 0; background: none; text-align: left; cursor: pointer;
  border-radius: 12px;
}
.imp-row:active { background: rgba(0,0,0,0.04); }
.imp-row-avatar {
  flex: 0 0 auto; width: 40px; height: 40px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  background-size: cover; background-position: center;
  font-weight: 800; color: #FFF;
}
.imp-row-txt { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.imp-row-name {
  font-size: 15px; font-weight: 700; color: var(--ink, #1A1A1A);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.imp-row-sub {
  font-size: 12.5px; color: var(--muted, #8A8A8A);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.imp-row-disabled { opacity: 0.45; cursor: not-allowed; }
.imp-row-disabled:active { background: none; }