/*
 * GSPORTS: shared design tokens and Bootstrap 5 dark-theme overrides.
 * Used by both the player website and the admin panel.
 */
:root,
[data-bs-theme="dark"] {
  --arena-bg: #0b0d12;
  --arena-surface: #141821;
  --arena-surface-2: #1b2130;
  --arena-border: #262e40;
  --arena-text: #f2f5fa;
  --arena-muted: #9aa6bd;
  --arena-accent: #22d3ee;      /* cyan */
  --arena-accent-2: #3b82f6;    /* blue */
  --arena-accent-ink: #04141a;
  --arena-success: #34d399;
  --arena-warning: #fbbf24;
  --arena-danger: #f87171;
  --arena-radius: 14px;

  --bs-body-bg: var(--arena-bg);
  --bs-body-color: var(--arena-text);
  --bs-secondary-color: var(--arena-muted);
  --bs-border-color: var(--arena-border);
  --bs-primary: var(--arena-accent);
  --bs-primary-rgb: 34, 211, 238;
  --bs-link-color: var(--arena-accent);
  --bs-link-color-rgb: 34, 211, 238;
  --bs-link-hover-color: #67e8f9;
  --bs-tertiary-bg: var(--arena-surface-2);
  --bs-secondary-bg: var(--arena-surface);
  --bs-font-sans-serif: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}

body { background: var(--arena-bg); color: var(--arena-text); -webkit-font-smoothing: antialiased; }

/* Visible keyboard focus everywhere (accessibility). */
:focus-visible { outline: 2px solid var(--arena-accent); outline-offset: 2px; }
.btn:focus-visible, .form-control:focus, .form-select:focus { box-shadow: 0 0 0 .2rem rgba(34, 211, 238, .35); border-color: var(--arena-accent); }

.text-muted, .form-text { color: var(--arena-muted) !important; }
.text-accent { color: var(--arena-accent) !important; }

.btn-primary {
  --bs-btn-bg: var(--arena-accent); --bs-btn-border-color: var(--arena-accent); --bs-btn-color: var(--arena-accent-ink);
  --bs-btn-hover-bg: #67e8f9; --bs-btn-hover-border-color: #67e8f9; --bs-btn-hover-color: var(--arena-accent-ink);
  --bs-btn-active-bg: #06b6d4; --bs-btn-active-border-color: #06b6d4; --bs-btn-active-color: var(--arena-accent-ink);
  --bs-btn-disabled-bg: #155e75; --bs-btn-disabled-border-color: #155e75; --bs-btn-disabled-color: #cbd5e1;
  font-weight: 600;
}
.btn-outline-primary {
  --bs-btn-color: var(--arena-accent); --bs-btn-border-color: var(--arena-accent);
  --bs-btn-hover-bg: var(--arena-accent); --bs-btn-hover-border-color: var(--arena-accent); --bs-btn-hover-color: var(--arena-accent-ink);
  --bs-btn-active-bg: var(--arena-accent); --bs-btn-active-color: var(--arena-accent-ink);
}

.card, .arena-card {
  background: var(--arena-surface);
  border: 1px solid var(--arena-border);
  border-radius: var(--arena-radius);
  color: var(--arena-text);
}
.card-header { background: transparent; border-bottom-color: var(--arena-border); }

.form-control, .form-select {
  background-color: var(--arena-surface-2); border-color: var(--arena-border); color: var(--arena-text);
}
.form-control::placeholder { color: #6b778d; }
.form-control:disabled, .form-control[readonly] { background-color: #121621; }
.form-label { font-weight: 500; }
.invalid-feedback { color: var(--arena-danger); }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--arena-danger); }

.table {
  --bs-table-bg: transparent; --bs-table-color: var(--arena-text); --bs-table-border-color: var(--arena-border);
  --bs-table-hover-bg: rgba(34, 211, 238, .05); --bs-table-hover-color: var(--arena-text);
  --bs-table-striped-bg: rgba(255, 255, 255, .02);
  margin-bottom: 0;
}
.table > thead th { color: var(--arena-muted); font-weight: 600; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.table td { vertical-align: middle; }

.alert { border-radius: 12px; }
.modal-content { background: var(--arena-surface); border: 1px solid var(--arena-border); }
.dropdown-menu { background: var(--arena-surface-2); border-color: var(--arena-border); }
.pagination { --bs-pagination-bg: var(--arena-surface); --bs-pagination-border-color: var(--arena-border); --bs-pagination-color: var(--arena-text);
  --bs-pagination-active-bg: var(--arena-accent); --bs-pagination-active-border-color: var(--arena-accent); --bs-pagination-active-color: var(--arena-accent-ink);
  --bs-pagination-disabled-bg: var(--arena-surface); --bs-pagination-disabled-color: #556; --bs-pagination-hover-bg: var(--arena-surface-2); --bs-pagination-hover-color: var(--arena-text); }

/* Status badges */
.status-badge {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .75rem; font-weight: 600; padding: .25rem .6rem; border-radius: 999px;
  border: 1px solid currentColor; white-space: nowrap; line-height: 1.2;
}
.status-badge::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; }
.status-neutral { color: #a3aec4; background: rgba(163, 174, 196, .08); }
.status-info    { color: var(--arena-accent); background: rgba(34, 211, 238, .08); }
.status-success { color: var(--arena-success); background: rgba(52, 211, 153, .08); }
.status-warning { color: var(--arena-warning); background: rgba(251, 191, 36, .08); }
.status-danger  { color: var(--arena-danger); background: rgba(248, 113, 113, .08); }
.status-live    { color: #fb7185; background: rgba(251, 113, 133, .1); }
.status-live::before { animation: arena-pulse 1.4s infinite; }
@keyframes arena-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .status-live::before { animation: none; } }

.empty-state { text-align: center; padding: 3rem 1rem; color: var(--arena-muted); }
.empty-state .bi { font-size: 2.25rem; display: block; margin-bottom: .75rem; color: #475569; }

.mono { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; }
.visually-hidden-focusable:focus { position: static !important; }
