/* ==========================================================================
   Cesto — tokens partilhados (backoffice, app e página ao vivo)
   Linhas de campo azul-marinho, marcador âmbar, chão claro e frio.
   ========================================================================== */
@font-face { font-family: "Barlow"; font-weight: 400; font-display: swap; src: url("../fonts/barlow-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 500; font-display: swap; src: url("../fonts/barlow-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 600; font-display: swap; src: url("../fonts/barlow-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 700; font-display: swap; src: url("../fonts/barlow-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 500; font-display: swap; src: url("../fonts/barlow-condensed-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 600; font-display: swap; src: url("../fonts/barlow-condensed-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 700; font-display: swap; src: url("../fonts/barlow-condensed-latin-700-normal.woff2") format("woff2"); }

:root {
  --navy: #14213d;        /* linhas do campo, texto principal */
  --navy-2: #22345c;
  --paint: #1f4e8c;       /* garrafão — ação principal */
  --amber: #f2a900;       /* marcador LED — pontuação e "ao vivo" */
  --floor: #f3f5f8;       /* fundo */
  --line: #d9dfe8;
  --muted: #5d6b82;
  --made: #1e8e5a;
  --miss: #d23c3c;
  --opp: #6b4fa0;         /* adversário */
  --surface: #ffffff;

  --font-body: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-score: "Barlow Condensed", "Barlow", system-ui, sans-serif;

  --bs-body-font-family: var(--font-body);
  --bs-body-color: var(--navy);
  --bs-body-bg: var(--floor);
  --bs-primary: var(--paint);
  --bs-primary-rgb: 31, 78, 140;
  --bs-link-color: var(--paint);
  --bs-link-color-rgb: 31, 78, 140;
  --bs-border-color: var(--line);
  --bs-secondary-color: var(--muted);
}

html { -webkit-text-size-adjust: 100%; }
body { font-family: var(--font-body); color: var(--navy); background: var(--floor); }

h1, h2, h3, .h1, .h2, .h3 { font-family: var(--font-score); font-weight: 700; letter-spacing: .01em; }
h4, h5, h6, .h4, .h5, .h6 { font-weight: 600; }

.num, .tabular { font-variant-numeric: tabular-nums; }
.score { font-family: var(--font-score); font-weight: 700; font-variant-numeric: tabular-nums; }
.text-muted, .text-secondary { color: var(--muted) !important; }

.btn { font-weight: 600; border-radius: 6px; }
.btn-primary { --bs-btn-bg: var(--paint); --bs-btn-border-color: var(--paint); --bs-btn-hover-bg: #183f72; --bs-btn-hover-border-color: #183f72; --bs-btn-active-bg: #143560; }
.btn-outline-primary { --bs-btn-color: var(--paint); --bs-btn-border-color: var(--paint); --bs-btn-hover-bg: var(--paint); --bs-btn-hover-border-color: var(--paint); }
.btn-amber { background: var(--amber); color: var(--navy); border: 0; }
.btn-amber:hover { background: #ffbc1f; color: var(--navy); }
.form-control, .form-select { border-radius: 6px; }
.form-control:focus, .form-select:focus { border-color: var(--paint); box-shadow: 0 0 0 .2rem rgba(31, 78, 140, .2); }
:focus-visible { outline: 3px solid var(--amber); outline-offset: 2px; }

/* Placa de marcador: o elemento distintivo — navy com dígitos âmbar */
.scoreboard { background: var(--navy); color: #fff; border-radius: 8px; }
.scoreboard .digits { font-family: var(--font-score); font-weight: 700; color: var(--amber); font-variant-numeric: tabular-nums; line-height: 1; }
.scoreboard .team-label { font-family: var(--font-score); font-weight: 600; font-size: 1rem; color: #c7d0e0; }

.live-dot { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; background: var(--miss); margin-right: .35rem; animation: pulse 1.6s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .live-dot { animation: none; } }

/* Tabelas de estatísticas */
.stat-table { font-variant-numeric: tabular-nums; font-size: .9rem; white-space: nowrap; }
.stat-table th { font-family: var(--font-score); font-weight: 600; font-size: .95rem; color: var(--muted); background: var(--floor) !important; position: sticky; top: 0; }
.stat-table td.name, .stat-table th.name { text-align: left; position: sticky; left: 0; background: var(--surface); z-index: 1; }
.stat-table th.name { z-index: 2; background: var(--floor) !important; }
.stat-table td, .stat-table th { text-align: right; padding: .35rem .5rem; }
.stat-table tfoot td { font-weight: 700; border-top: 2px solid var(--navy); }
.stat-table .lead-val { color: var(--paint); font-weight: 700; }

.chip-made { color: var(--made); }
.chip-miss { color: var(--miss); }
.badge-status { font-weight: 600; }
.badge-status.agendado { background: #e5e9f0; color: var(--muted); }
.badge-status.a_decorrer { background: var(--amber); color: var(--navy); }
.badge-status.terminado { background: var(--navy); color: #fff; }

.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; }
.panel-head { padding: .85rem 1rem; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.panel-body { padding: 1rem; }

/* Separadores segmentados (relatórios) */
.seg-tabs { display: flex; gap: .25rem; overflow-x: auto; border-bottom: 1px solid var(--line); scrollbar-width: none; }
.seg-tabs::-webkit-scrollbar { display: none; }
.seg { border: 0; background: none; padding: .55rem .85rem; font-weight: 600; color: var(--muted); border-bottom: 3px solid transparent; white-space: nowrap; margin-bottom: -1px; }
.seg:hover { color: var(--navy); }
.seg.active { color: var(--navy); border-bottom-color: var(--amber); }
.shot-chart { width: 100%; height: auto; display: block; border-radius: 6px; }
.pbp { max-height: 70vh; overflow-y: auto; }
.pbp .pbp-opp { color: var(--opp); }
.result-w { color: var(--made); font-weight: 700; }
.result-l { color: var(--miss); font-weight: 700; }
.metric .value { font-family: var(--font-score); font-weight: 700; font-size: 2.2rem; line-height: 1; }
.metric .label { color: var(--muted); font-size: .9rem; margin-top: .25rem; }
.metric { padding: 1rem 1.1rem; }
.empty { text-align: center; padding: 2.5rem 1rem; color: var(--muted); }
