/* ─────────────────────────────────────────────
   HUNGRY CHAMELEONS — Admin Panel Styles
   ───────────────────────────────────────────── */

.admin-layout {
  width: 100%; max-width: 1200px; padding: 1.5rem;
  display: flex; flex-direction: column; gap: 1.25rem;
  align-self: flex-start; margin: 0 auto;
}

.admin-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 1rem;
}
.admin-header h1 { font-size: 1.5rem; }
.admin-header-actions { display: flex; gap: 0.75rem; align-items: center; }

/* ── Alert bar for flagged names ── */
.admin-alerts { display: flex; flex-direction: column; gap: 0.5rem; }
.admin-alert {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 0.6rem 1rem;
  background: rgba(255,230,0,0.1); border: 1px solid rgba(255,230,0,0.4);
  border-radius: 8px; font-size: 0.85rem;
  animation: toast-in 0.3s ease forwards;
}
.admin-alert strong { color: var(--yellow); }
.admin-alert-dismiss { background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: 1rem; }
.admin-alert-dismiss:hover { color: var(--white); }

/* ── Tabs ── */
.admin-tabs { display: flex; gap: 0; border-bottom: 2px solid rgba(74,176,255,0.2); }
.admin-tab {
  background: none; border: none; padding: 0.6rem 1.25rem;
  color: var(--text-muted); font-family: 'Orbitron', monospace;
  font-size: 0.7rem; letter-spacing: 1px; cursor: pointer;
  transition: all var(--transition); text-transform: uppercase;
  border-bottom: 2px solid transparent; margin-bottom: -2px;
}
.admin-tab:hover { color: var(--blue); }
.admin-tab.active { color: var(--blue); border-bottom-color: var(--blue); }

.admin-tab-content { display: none; }
.admin-tab-content.active { display: block; }

/* ── Filters ── */
.admin-filters {
  display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.75rem;
}
.admin-filters input[type="text"],
.admin-filters select {
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--card-border); border-radius: 6px;
  padding: 0.5rem 0.75rem; color: var(--white);
  font-family: 'Exo 2', sans-serif; font-size: 0.85rem;
  outline: none; transition: border-color var(--transition);
}
.admin-filters input[type="text"] { flex: 1; min-width: 200px; }
.admin-filters input[type="text"]:focus,
.admin-filters select:focus { border-color: var(--blue); }

/* ── Table ── */
.admin-table-wrap { overflow-x: auto; }
.admin-table {
  width: 100%; border-collapse: collapse; font-size: 0.85rem;
}
.admin-table thead tr {
  background: rgba(74,176,255,0.08);
  border-bottom: 1px solid rgba(74,176,255,0.2);
}
.admin-table th {
  padding: 0.6rem 0.75rem; text-align: left;
  font-family: 'Orbitron', monospace; font-size: 0.65rem;
  letter-spacing: 1px; color: var(--blue); white-space: nowrap;
}
.admin-table td { padding: 0.55rem 0.75rem; border-bottom: 1px solid rgba(255,255,255,0.05); }
.admin-table tr:hover td { background: rgba(255,255,255,0.03); }
.admin-table tr.banned td { opacity: 0.5; text-decoration: line-through; }
.admin-table tr.banned td:last-child { opacity: 1; text-decoration: none; }

.admin-rank { font-family: 'Orbitron', monospace; font-size: 0.8rem; color: var(--text-muted); }
.admin-rank.gold   { color: #FFD700; }
.admin-rank.silver { color: #C0C0C0; }
.admin-rank.bronze { color: #CD7F32; }

.admin-group-badge {
  display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 0.7rem;
}
.admin-group-badge.young { background: rgba(74,176,255,0.15); color: var(--blue); }
.admin-group-badge.old   { background: rgba(57,255,20,0.15);  color: var(--green); }

.admin-banned-badge {
  display: inline-block; padding: 2px 8px; border-radius: 20px;
  background: rgba(255,0,80,0.15); color: #ff5577; font-size: 0.7rem;
}
.admin-active-badge {
  display: inline-block; padding: 2px 8px; border-radius: 20px;
  background: rgba(57,255,20,0.1); color: var(--green); font-size: 0.7rem;
}

.admin-actions { display: flex; gap: 0.4rem; flex-wrap: nowrap; }
.admin-action-btn {
  background: none; border: 1px solid;
  border-radius: 4px; padding: 3px 8px;
  font-size: 0.7rem; cursor: pointer; white-space: nowrap;
  transition: all var(--transition); font-family: 'Exo 2', sans-serif;
}
.admin-action-btn.rename { border-color: var(--blue);  color: var(--blue); }
.admin-action-btn.rename:hover  { background: rgba(74,176,255,0.1); }
.admin-action-btn.remove { border-color: var(--yellow); color: var(--yellow); }
.admin-action-btn.remove:hover  { background: rgba(255,230,0,0.1); }
.admin-action-btn.ban    { border-color: #ff3355;       color: #ff5577; }
.admin-action-btn.ban:hover     { background: rgba(255,0,80,0.1); }
.admin-action-btn.unban  { border-color: var(--green);  color: var(--green); }
.admin-action-btn.unban:hover   { background: rgba(57,255,20,0.1); }

/* ── Rename inline ── */
.rename-input-row { display: flex; gap: 0.5rem; align-items: center; }
.rename-input-row input {
  background: rgba(255,255,255,0.05); border: 1px solid var(--blue);
  border-radius: 4px; padding: 4px 8px; color: var(--white);
  font-family: 'Exo 2', sans-serif; font-size: 0.85rem;
  outline: none; max-width: 140px;
}
.rename-input-row .btn-icon { font-size: 0.8rem; }

/* Scrollbar */
.admin-table-wrap::-webkit-scrollbar { height: 4px; }
.admin-table-wrap::-webkit-scrollbar-track { background: transparent; }
.admin-table-wrap::-webkit-scrollbar-thumb { background: rgba(74,176,255,0.3); border-radius: 2px; }

@media (max-width: 768px) {
  .admin-layout { padding: 1rem; }
  .admin-table th, .admin-table td { padding: 0.4rem 0.5rem; font-size: 0.8rem; }
}
