/* Volley Vantage Player Hub — default skin.
   Palette sampled from static/site/vv_logo.png:
     primary chromatic = teal #106068
     dominant neutrals = charcoals #505050 / #707070
   Only :root tokens and the .brand__name accent rule live here.
   All layout/component CSS is in static/css/app.css.                 */
:root {
  --bg: #f7f8f8;
  --panel: #ffffff;
  --panel2: #eef0f1;
  --text: #1a1a1a;
  --text-2: #2f3437;
  --muted: #6b7174;
  --line: #e2e5e6;
  --accent: #106068;        /* VV teal — primary brand */
  --accent-dark: #0a464c;
  --accent-light: #dceeef;
  --badge-n: #b8860b;       /* National = gold (kept semantic) */
  --badge-r: #b91c1c;       /* Red */
  --badge-b: #2f3437;       /* Black (matches dark surface) */
  --badge-c: #64748b;       /* Club */

  /* ── Surface (topbar / footer / landing hero) ──
     Default skin: light surface, dark text — clean white topbar with the
     teal accent border + teal wordmark giving it identity. */
  --surface:              #ffffff;
  --surface-text:         #1a1a1a;
  --surface-muted:        #6b7174;
  --surface-border:       #e2e5e6;
  --surface-chip-bg:       rgba(16, 96, 104, 0.08);   /* teal-tinted */
  --surface-chip-bg-hover: rgba(16, 96, 104, 0.14);
  --surface-chip-border:   rgba(16, 96, 104, 0.20);

  --surface-2: #d97706;     /* masquerade banner accent (orange — high-contrast) */
  --border: #1f2326;
}
.brand__name { color: var(--accent); }
/* ── PR2: Manual-add (walk-in) form ─────────────────────────────────────── */
.manual-add-form { display:grid; gap:16px; }
.manual-add-form__heading { margin:0 0 8px 0; font-size:16px; font-weight:600; }
.manual-add-form__group {
  border:1px solid var(--line); border-radius:8px;
  background:var(--panel2); padding:14px;
}
.manual-add-form__group > legend {
  padding:0 6px; font-size:12px; text-transform:uppercase;
  letter-spacing:0.6px; color:var(--muted);
}
.manual-add-form__row {
  display:grid; gap:10px;
  grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
  margin-bottom:8px;
}
.manual-add-form__row label { display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--muted); }
.manual-add-form__row .input { width:100%; box-sizing:border-box; }
.manual-add-form__check { display:flex; gap:6px; align-items:center; font-size:13px; }
.manual-add-form__actions { display:flex; gap:8px; }
.manual-add-form__hits { display:flex; flex-direction:column; gap:6px; margin-top:4px; }
.manual-add-form__hit-list, .manual-add-form__sibling-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.dedup-hit { display:flex; gap:10px; align-items:center; justify-content:space-between;
  padding:8px 10px; background:var(--panel); border:1px solid var(--line); border-radius:6px; font-size:13px; }
.dedup-hit__body { display:flex; flex-direction:column; gap:2px; }
.dedup-hit--matched { background:var(--accent-light); border-color:var(--accent); }
.dedup-hit--error   { color:#b91c1c; background:transparent; border:none; padding:0; }
.field-locked { background:var(--panel2) !important; opacity:0.75; cursor:not-allowed; }
.manual-add-result { background:var(--panel2); border:1px solid var(--accent);
  border-radius:8px; padding:16px; }
.manual-add-result--error { border-color:#b91c1c; color:#b91c1c; }
.manual-add-result__heading { margin:0 0 8px 0; font-size:16px; font-weight:600; }
.manual-add-result__meta { margin:8px 0; padding-left:18px; font-size:13px; color:var(--muted); }
.manual-add-result__actions { display:flex; gap:8px; margin-top:8px; }
/* ── PR3: Check-in roster + walk-in QR + photo thumb ───────────────────── */
.checkin-roster { width:100%; border-collapse:collapse; font-size:13px; }
.checkin-roster th, .checkin-roster td {
  border-bottom:1px solid var(--line); padding:8px 10px; text-align:left;
  vertical-align:middle;
}
.checkin-roster th { background:var(--panel2); font-size:11px;
  text-transform:uppercase; letter-spacing:0.6px; color:var(--muted); }
.checkin-row.is-checked-in { background:var(--accent-light); }
.checkin-row__num { font-variant-numeric:tabular-nums; font-weight:600;
  color:var(--accent-dark); }
.checkin-toggle.checkin-toggle--on { background:var(--accent);
  color:var(--surface-text, #fff); border-color:var(--accent-dark); }
.checkin-toggle-form { margin:0; }
.photo-thumb { width:40px; height:40px; border-radius:50%; object-fit:cover;
  display:inline-block; vertical-align:middle; margin-right:6px;
  background:var(--panel2); border:1px solid var(--line); }
.photo-thumb--empty { background:repeating-linear-gradient(
  45deg, var(--panel2), var(--panel2) 4px, var(--line) 4px, var(--line) 5px); }
.walkin-qr-block { display:flex; flex-direction:column; align-items:center;
  gap:6px; padding:10px; background:var(--panel); border:1px solid var(--line);
  border-radius:8px; }
.walkin-qr-block__img { width:160px; height:160px; }
.walkin-qr-block__caption { font-size:12px; color:var(--muted); text-align:center; }
.walkin-qr-block--error { color:#b91c1c; border-color:#b91c1c; padding:10px; }

/* ── PR4: import landing + previews + LeagueApps admin tab ───────────── */
.import-card { background:var(--panel2); border:1px solid var(--line);
  border-radius:8px; padding:16px; }
.import-card h2 { color:var(--text); }
.import-preview th, .import-preview td { font-size:12px; padding:6px 8px;
  vertical-align:top; }
.preview-row--create td { background:rgba(34,197,94,0.08); }
.preview-row--match  td { background:rgba(59,130,246,0.06); }
.preview-row--error  td { background:rgba(239,68,68,0.10); }

.lapps-section { margin-bottom:32px; padding-top:8px; }
.lapps-section:last-child { margin-bottom:0; }
.lapps-section h2 { color:var(--text); }

.lapps-subnav { display:flex; gap:12px; flex-wrap:wrap; font-size:12px; }
.lapps-subnav a { color:var(--accent); text-decoration:none;
  padding:3px 8px; border-radius:4px; background:var(--panel2);
  border:1px solid var(--line); }
.lapps-subnav a:hover { background:var(--accent-light); }

.mapping-table td { vertical-align:middle; }
.conflict-row--resolved td { opacity:0.55; }

/* LeagueApps snapshot diff */
.lapps-diff .diff-row--changed td { background:var(--accent-light); }
.lapps-diff .diff-row--added   td { background:rgba(40,160,90,0.12); }
.lapps-diff .diff-row--removed td { background:rgba(200,60,60,0.12); }

/* Check-in kiosk mode — chrome-free fullscreen station */
.checkin-wrap--kiosk { max-width:100%; margin:0 auto; padding:18px 28px; }
.checkin-wrap--kiosk h1 { font-size:30px; }
.checkin-wrap--kiosk .checkin-roster { font-size:18px; }
.checkin-wrap--kiosk .checkin-roster th,
.checkin-wrap--kiosk .checkin-roster td { padding:12px 14px; }

/* Roster search + filter chips */
.checkin-filters { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:12px; }
.checkin-filters #checkin-search { max-width:240px; }
.checkin-chips { display:flex; flex-wrap:wrap; gap:6px; }
.checkin-chips .chip { font-size:12px; padding:3px 10px; border-radius:12px;
  border:1px solid var(--line); background:var(--panel2); color:var(--text); cursor:pointer; }
.checkin-chips .chip--active { background:var(--accent); color:#fff; border-color:var(--accent); }
.checkin-count { margin-left:auto; font-size:12px; }

/* Roster inline detail editor */
.checkin-edit-toggle { margin-left:6px; padding:0 6px; }
.checkin-detail-row > td { background:var(--panel2); padding:14px; }
.checkin-edit-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px; margin-bottom:10px; }
.checkin-edit-grid label { display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--muted); }
.checkin-edit-actions { display:flex; gap:8px; }
.field-error { color:var(--danger, #c83c3c); font-size:11px; }