/* Page de guilde : bandeau repris de la fiche perso (character.css), liste des membres ici */

.roster-band { padding-top: 40px; }

.roster-tools { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.roster-tools input, .roster-tools select {
  font: 15px/1.2 var(--modern); color: var(--text);
  background: rgba(3, 16, 26, .7); border: 1px solid rgba(198, 175, 141, .35); border-radius: 3px;
  padding: 11px 13px; box-shadow: inset 0 2px 6px rgba(0,0,0,.4);
}
.roster-tools input { flex: 1 1 260px; min-width: 0; }
.roster-tools input:focus, .roster-tools select:focus {
  outline: none; border-color: var(--sand); box-shadow: inset 0 2px 6px rgba(0,0,0,.4), 0 0 0 3px rgba(198,175,141,.25);
}
.roster-tools select option { color: var(--text); background: #0a1a26; }

/* Une ligne par membre, entièrement cliquable ; mêmes colonnes pour l'en-tête */
.roster { border: 1px solid rgba(198, 175, 141, .18); border-radius: 12px; overflow: hidden; background: rgba(3, 20, 32, .45); }
.roster-head, .member {
  display: grid; align-items: center; gap: 12px; padding: 0 16px;
  grid-template-columns: minmax(0, 2fr) 70px minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, 1.4fr) 64px;
}
.roster-head { background: rgba(0, 0, 0, .25); border-bottom: 1px solid rgba(198, 175, 141, .18); }
.roster-head button {
  display: flex; align-items: center; gap: 6px; padding: 12px 0; text-align: left; cursor: pointer;
  font: 600 11px/1 var(--modern); letter-spacing: .12em; text-transform: uppercase; color: var(--muted);
  background: none; border: 0;
}
.roster-head button:hover { color: #fff; }
.roster-head button[aria-sort="ascending"], .roster-head button[aria-sort="descending"] { color: var(--ivory); }
.roster-head button[aria-sort="ascending"]::after { content: "▲"; font-size: 8px; }
.roster-head button[aria-sort="descending"]::after { content: "▼"; font-size: 8px; }

.member { min-height: 46px; border-bottom: 1px solid rgba(198, 175, 141, .1); font-size: 14px; color: #dce6ec; transition: background .12s ease; }
.member:last-child { border-bottom: 0; }
.member:hover { background: rgba(95, 208, 224, .08); }
.member .c-name { display: flex; align-items: center; gap: 10px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.member .c-name img { flex: none; border-radius: 50%; box-shadow: 0 0 0 1px rgba(0,0,0,.6); }
.member .c-level, .member .c-gs, .roster-head .c-level, .roster-head .c-gs { font-variant-numeric: tabular-nums; }
.member .c-gs { font-weight: 700; color: #fff; }
.member .c-race, .member .c-class, .member .c-rank { color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.roster .empty { margin: 0; padding: 22px 16px; color: var(--muted); }
.roster-note { margin: 14px 0 0; font-size: 12.5px; color: var(--muted); }

@media (max-width: 760px) {
  .roster-head, .member { grid-template-columns: minmax(0, 1fr) 52px minmax(0, .9fr) 52px; gap: 10px; padding: 0 12px; }
  .roster-head .c-race, .roster-head .c-rank, .member .c-race, .member .c-rank { display: none; }
}