/* ==========================================================================
   Game Detail — Box score panel, butterfly chart/bars, scoring summary,
   linescore, enhanced game detail, team comparison bars
   ========================================================================== */

/* --------------------------------------------------------------------------
   Box Score Panel
   -------------------------------------------------------------------------- */

.boxscore-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 12px;
    border-bottom: 1px solid #E0E0E0;
}

.boxscore-team {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 60px;
}

.boxscore-team-logo {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.boxscore-team-abbrev {
    font-size: var(--text-xs);
    font-weight: 800;
    color: #1A1A1A;
}

.boxscore-score {
    font-size: var(--text-4xl);
    font-weight: 800;
    color: #1A1A1A;
    letter-spacing: 2px;
}

.boxscore-score-divider {
    font-size: var(--text-2xl);
    font-weight: 400;
    color: #999;
}

.boxscore-final-tag {
    font-size: var(--text-micro);
    font-weight: 700;
    text-transform: uppercase;
    color: #999;
    text-align: center;
    margin-top: 2px;
}

.boxscore-sbs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: start;
}
.boxscore-section {
    padding: 8px 0;
}

.boxscore-section-title {
    font-size: var(--text-micro);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #666;
    padding: 4px 8px;
    background: #F0F0F0;
    border-bottom: 1px solid #E0E0E0;
}

.boxscore-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-xs);
}

.boxscore-table th {
    padding: 4px 6px;
    text-align: right;
    font-size: var(--text-micro);
    font-weight: 800;
    text-transform: uppercase;
    color: #999;
    border-bottom: 1px solid #E0E0E0;
}

.boxscore-table th:first-child {
    text-align: left;
}

.boxscore-table td {
    padding: 3px 6px;
    text-align: right;
    font-weight: 500;
}

.boxscore-table td:first-child {
    text-align: left;
    font-weight: 600;
}

.boxscore-table tbody tr:nth-child(even) {
    background: #FAFAFA;
}

.boxscore-player-link {
    cursor: pointer;
    color: #1A1A1A;
    transition: color 0.1s;
}

.boxscore-player-link:hover {
    color: var(--theme-accent-secondary, #1A5276);
}

/* Box Score -- wider detail panel, clean white styling, unified scroll */
.detail-column-boxscore {
    flex: 10 !important;
    max-width: none !important;
    position: static !important;
    max-height: none !important;
    overflow-y: visible !important;
}
.detail-column-boxscore .panel {
    box-shadow: none;
    border: 1px solid #E0E0E0;
    background: #FFFFFF;
}
.detail-column-boxscore .panel-header {
    background: #FFFFFF;
    border-bottom: 1px solid #E0E0E0;
    color: #333;
}
.detail-column-boxscore .panel-body {
    background: #FFFFFF;
    padding: 0;
}

/* Box Score -- narrow split panel for non-schedule tabs */
.detail-column-boxscore-split {
    flex: 3 !important;
    min-width: 280px;
    max-width: 320px !important;
    position: sticky !important;
    top: 40px;
    max-height: calc(100vh - 52px);
    overflow-y: auto !important;
}
.detail-column-boxscore-split .panel {
    box-shadow: none;
    border: 1px solid #E0E0E0;
    background: #FFFFFF;
}
.detail-column-boxscore-split .panel-header {
    background: #FFFFFF;
    border-bottom: 1px solid #E0E0E0;
    color: #333;
}
.detail-column-boxscore-split .panel-body {
    background: #FFFFFF;
    padding: 0;
}
/* In split mode, hide the full box score tables and show a compact view */
.detail-column-boxscore-split .boxscore-sbs {
    display: none;
}
.detail-column-boxscore-split .gd-scoring-panel {
    display: none;
}
.detail-column-boxscore-split .gd-bf-rows {
    padding: 0 8px;
}
.detail-column-boxscore-split .gd-bf-header {
    margin: 0 8px;
    padding: 0 8px 4px;
}
.detail-column-boxscore-split .gd-score-header {
    padding: 12px 8px;
}
.detail-column-boxscore-split .gd-score-line {
    font-size: 22px;
    gap: 6px;
}
.detail-column-boxscore-split .gd-team-logo {
    width: 24px;
    height: 24px;
}
.detail-column-boxscore-split .gd-period-table th,
.detail-column-boxscore-split .gd-period-table td {
    padding: 3px 8px;
}

/* "Full Box Score" button in split mode */
.gd-split-actions {
    display: flex;
    justify-content: center;
    padding: 6px 8px;
    border-top: 1px solid #E8E8E8;
}
.gd-split-schedule-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: 1px solid var(--theme-border-strong);
    padding: 4px 10px;
    font-size: var(--text-micro);
    font-weight: 700;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #1A1A1A;
    transition: background 0.1s, color 0.1s;
}
.gd-split-schedule-btn:hover {
    background: #1A1A1A;
    border-color: #1A1A1A;
    color: #FFF;
}
.gd-split-schedule-btn .icon { background: currentColor; }

/* Sortable column headers */
.boxscore-sortable {
    cursor: pointer;
    user-select: none;
    transition: color 0.1s;
}
.boxscore-sortable:hover {
    color: var(--theme-accent-secondary, #1A5276);
}
.boxscore-sortable.sort-active {
    color: var(--theme-accent-secondary, #1A5276) !important;
}

/* --------------------------------------------------------------------------
   Boxscore team comparison
   -------------------------------------------------------------------------- */
.boxscore-team-compare {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: #eee;
    border: 1px solid #000;
    margin: 8px 0;
}
.boxscore-compare-row {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 8px;
    align-items: center;
    padding: 3px 8px;
    background: #fff;
}
.boxscore-compare-label {
    font-size: 8px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #666;
    min-width: 36px;
    text-align: center;
}
.boxscore-compare-val {
    font-size: var(--text-xs);
    font-weight: 900;
    color: #000;
}
.boxscore-compare-val:first-child { text-align: right; }
.boxscore-compare-val:last-child { text-align: left; }

/* ==========================================================================
   Enhanced Game Detail (M14)
   ========================================================================== */
.gd-score-header {
    padding: 20px 14px;
    text-align: center;
    background: #FFFFFF;
}
.gd-score-line {
    font-size: 28px;
    font-weight: var(--weight-black);
    color: #000;
    letter-spacing: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.gd-team-logo {
    vertical-align: middle;
}
.gd-score-status {
    font-size: var(--text-xs);
    font-weight: var(--weight-extra-bold);
    color: #555;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 4px;
}

/* Clickable team names in score header */
.gd-team-link {
    cursor: pointer;
    transition: color 0.1s;
}
.gd-team-link:hover {
    color: var(--theme-accent, #1A5276);
    text-decoration: underline;
}
.gd-team-active {
    color: var(--theme-accent, #1A5276);
}

/* Prev / Next game navigation */
.gd-game-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #E8E8E8;
}
.gd-game-nav-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: 1px solid var(--theme-border-strong);
    padding: 3px 8px;
    font-size: var(--text-micro);
    font-weight: 700;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #1A1A1A;
    transition: background 0.1s, color 0.1s;
}
.gd-game-nav-btn:hover:not(:disabled) {
    background: #1A1A1A;
    border-color: #1A1A1A;
    color: #FFF;
}
.gd-game-nav-btn:disabled {
    opacity: 0.25;
    cursor: default;
}
.gd-game-nav-btn .icon { background: currentColor; }
.gd-game-nav-label {
    font-size: var(--text-micro);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #999;
}

/* Period linescore */
.gd-period-wrap {
    display: flex;
    justify-content: center;
    padding: 8px 0 12px;
}
.gd-period-table {
    border-collapse: collapse;
    font-size: var(--text-xxs);
}
.gd-period-table th {
    font-size: 8px;
    font-weight: var(--weight-extra-bold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 4px 12px;
    color: #888;
    border-bottom: 1px solid #000;
    background: #F0F0F0;
}
.gd-period-table td {
    padding: 4px 12px;
    font-weight: var(--weight-bold);
    color: #1A1A1A;
    text-align: center;
    border-bottom: 1px solid #F0F0F0;
}
.gd-team-name {
    font-weight: var(--weight-black) !important;
    text-align: left !important;
    color: #000 !important;
    letter-spacing: 0.5px;
}
.gd-total {
    font-weight: var(--weight-black) !important;
    color: #000 !important;
    border-left: 1px solid #000;
}

/* Stat tiles */
/* Butterfly chart stat layout */
.gd-bf-header {
    display: flex;
    justify-content: space-between;
    padding: 0 12px 6px;
    margin: 0 12px;
}
.gd-bf-header-team {
    font-size: 11px;
    font-weight: var(--weight-black);
    text-transform: uppercase;
    letter-spacing: 1px;
}
.gd-bf-rows {
    padding: 0 12px;
}
.gd-bf-row {
    display: flex;
    align-items: center;
    height: 24px;
    border-bottom: 1px solid #f5f5f5;
}
.gd-bf-val {
    width: 42px;
    font-size: 11px;
    font-weight: var(--weight-bold);
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}
.gd-bf-val.left { text-align: right; padding-right: 6px; }
.gd-bf-val.right { text-align: left; padding-left: 6px; }
.gd-bf-val.win { font-weight: var(--weight-black); color: #000; }
.gd-bf-val.lose { color: #ccc; }
.gd-bf-left-bar {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    height: 10px;
}
.gd-bf-left-fill {
    height: 100%;
    border-radius: 3px 0 0 3px;
    transition: width 0.3s;
    background: #bbb;
}
.gd-bf-left-fill.fill-win { background: #1a1a1a; }
.gd-bf-label {
    width: 36px;
    text-align: center;
    font-size: 9px;
    font-weight: var(--weight-black);
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    flex-shrink: 0;
}
.gd-bf-right-bar {
    flex: 1;
    display: flex;
    justify-content: flex-start;
    height: 10px;
}
.gd-bf-right-fill {
    height: 100%;
    border-radius: 0 3px 3px 0;
    transition: width 0.3s;
    background: #bbb;
}
.gd-bf-right-fill.fill-win { background: #1a1a1a; }

/* Scoring summary */
.gd-scoring-panel {
    padding: 0;
}
.gd-section-title {
    font-size: var(--text-xxs);
    font-weight: var(--weight-extra-bold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 6px 10px;
    border-bottom: 1px solid var(--theme-border-strong);
    background: #F0F0F0;
    color: #333;
}
.gd-scoring-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-xs);
}
.gd-scoring-table thead th {
    background: #F0F0F0;
    font-size: 8px;
    font-weight: var(--weight-extra-bold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 5px 6px;
    text-align: right;
    border-bottom: 1px solid #000;
    color: #333;
    white-space: nowrap;
}
.gd-scoring-table thead th:first-child,
.gd-scoring-table thead th:nth-child(2),
.gd-scoring-table thead th:nth-child(3),
.gd-scoring-table thead th:nth-child(4) {
    text-align: left;
}
.gd-scoring-table tbody td {
    padding: 4px 6px;
    font-weight: 600;
    color: #1A1A1A;
    white-space: nowrap;
    border-bottom: 1px solid #F0F0F0;
}
.gd-scoring-table tbody td:first-child,
.gd-scoring-table tbody td:nth-child(2),
.gd-scoring-table tbody td:nth-child(3),
.gd-scoring-table tbody td:nth-child(4) {
    text-align: left;
}
.gd-scoring-table tbody td:nth-child(5) {
    text-align: right;
}
.gd-scoring-table tbody tr:nth-child(odd) td { background: #FFFFFF; }
.gd-scoring-table tbody tr:nth-child(even) td { background: #FAFAFA; }
.gd-scoring-table tbody tr:hover td { background: #F0F4FF; }

/* Team label in scoring */
.gd-team-label {
    font-weight: var(--weight-black);
    letter-spacing: 0.5px;
}

/* Strength badges */
.gd-str-badge {
    display: inline-block;
    font-size: 8px;
    font-weight: var(--weight-extra-bold);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    padding: 1px 4px;
    border: 1px solid;
}
.gd-str-ev {
    background: #F0F0F0;
    color: #555;
    border-color: #CCC;
}
.gd-str-pp {
    background: var(--theme-accent-secondary);
    color: #FFF;
    border-color: var(--theme-accent-secondary);
}
.gd-str-en {
    background: #1A1A1A;
    color: #FFF;
    border-color: #000;
}
.gd-str-sh {
    background: #555;
    color: #FFF;
    border-color: #333;
}