/* PhotonNodes admin panel */

.admin-side { width: 240px; background: var(--surface-deep); border-right: 1px solid var(--border); display: flex; flex-direction: column; flex-shrink: 0; }
.admin-brand { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-5) var(--space-4); font-family: var(--font-display); font-weight: 700; }
.admin-nav { flex: 1; display: flex; flex-direction: column; gap: 2px; padding: 0 var(--space-3); overflow-y: auto; }
.admin-nav button {
  background: none; border: none; text-align: left; padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md); color: var(--muted); font-size: var(--text-sm); font-weight: 500; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-2);
}
.admin-nav button:hover { background: var(--surface); color: var(--text); }
.admin-nav button.active { background: var(--accent-dim); color: var(--accent); font-weight: 600; }
.admin-nav .count { font-size: 11px; background: var(--accent); color: #06110b; border-radius: 999px; padding: 0 7px; font-weight: 700; }
.admin-side-foot { padding: var(--space-4); border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: var(--space-2); }

.admin-main { flex: 1; overflow-y: auto; padding: var(--space-6); min-width: 0; }
.admin-main h2 { font-size: var(--text-lg); margin-bottom: var(--space-5); }
.admin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--space-4); margin-bottom: var(--space-8); }
.stat-card { padding: var(--space-5); }
.stat-card .stat-num { font-size: var(--text-2xl); font-family: var(--font-display); }
.stat-card .stat-label { font-size: var(--text-xs); color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; }

.admin-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.admin-table th { text-align: left; padding: var(--space-2) var(--space-3); color: var(--muted); font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.06em; border-bottom: 1px solid var(--border); }
.admin-table td { padding: var(--space-3); border-bottom: 1px solid var(--border); vertical-align: top; }
.admin-table tr:hover td { background: var(--surface); }
.admin-table .mono { font-size: 12px; color: var(--muted); }
.table-wrap { overflow-x: auto; }

.admin-toolbar { display: flex; gap: var(--space-3); margin-bottom: var(--space-4); flex-wrap: wrap; align-items: center; }
.admin-toolbar .input { width: auto; flex: 1; min-width: 160px; }
.admin-toolbar select.input { width: auto; flex: 0; }

.status-pill { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.05em; }
.status-open, .status-new { background: rgba(251, 191, 36, 0.15); color: var(--amber); }
.status-pending, .status-reviewing { background: rgba(96, 165, 250, 0.15); color: var(--blue); }
.status-resolved, .status-accepted { background: rgba(52, 211, 153, 0.15); color: var(--green); }
.status-dismissed, .status-rejected, .status-closed, .status-banned { background: rgba(239, 68, 68, 0.15); color: var(--red); }

.form-inline { display: flex; gap: var(--space-3); flex-wrap: wrap; align-items: flex-end; }
.form-inline .form-row { flex: 1; min-width: 140px; }

.admin-section { margin-bottom: var(--space-8); }
.admin-section h3 { font-size: var(--text-base); margin-bottom: var(--space-4); }
.admin-section > .card { padding: var(--space-5); }

.auth-view { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: var(--space-6); background: radial-gradient(1200px 600px at 70% -10%, rgba(61,220,151,0.07), transparent), var(--bg); }
.auth-box { width: 100%; max-width: 420px; display: flex; flex-direction: column; gap: var(--space-5); padding: var(--space-8); }
.auth-brand { display: flex; align-items: center; gap: var(--space-3); font-family: var(--font-display); font-weight: 700; font-size: var(--text-lg); justify-content: center; }
.auth-box form { display: flex; flex-direction: column; gap: var(--space-4); }

#admin-panel { display: flex; height: 100dvh; overflow: hidden; }

@media (max-width: 760px) {
  #admin-panel { flex-direction: column; }
  .admin-side { width: 100%; flex-direction: row; align-items: center; border-right: none; border-bottom: 1px solid var(--border); }
  .admin-nav { flex-direction: row; overflow-x: auto; padding: var(--space-2); }
  .admin-brand { padding: var(--space-3) var(--space-4); }
  .admin-side-foot { border-top: none; border-left: 1px solid var(--border); flex-direction: row; align-items: center; padding: var(--space-3); }
  .admin-main { padding: var(--space-4); }
}