/* Shared button language for every sport's live control panel.
   Neutral controls plus three accents: blue (primary), amber (yellow card), red (risk/reset). */
body.is-match-control-focus {
    --control-button-neutral: #293444;
    --control-button-neutral-border: #526176;
    --control-button-blue: #4a7eed;
    --control-button-blue-border: #3b82f6;
    --control-button-amber: #facc15;
    --control-button-red: #8b0617;
}

body.is-match-control-focus .match-control-shell :where(.football-team-command, .basketball-score-command) {
    background: #1b2430;
}

body.is-match-control-focus .match-control-shell :where(.match-team-crest, .football-team-command__crest) {
    background: #263449;
}

body.is-match-control-focus .match-control-shell .player-row.is-selected,
body.is-match-control-focus .match-control-shell .hockey-live-player-row.is-selected {
    border-color: #3b82f6;
    background: #172e4e;
    box-shadow: inset 3px 0 0 #3b82f6;
}

body.is-match-control-focus .match-control-shell :where(button, a.btn):not(:where(.player-row-main, .hockey-live-player-main, .hockey-live-ice-button)),
body.is-match-control-focus .match-focus-rail :where(button, a.btn) {
    --control-button-bg: var(--control-button-neutral);
    --control-button-border: var(--control-button-neutral-border);
    --control-button-text: #f8fafc;
    border: .5px solid var(--control-button-border) !important;
    border-radius: 3px;
    min-width: 0;
    color: var(--control-button-text) !important;
    background: var(--control-button-bg) !important;
    background-image: none !important;
    font-weight: 750;
    text-shadow: none;
    box-shadow: none;
    overflow-wrap: anywhere;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    transition: none;
}

/* The older football action rules used !important; keep their layout, but use shared colors. */
body.is-match-control-focus .match-control-shell .football-player-action-buttons .btn {
    border-color: var(--control-button-border) !important;
    color: var(--control-button-text) !important;
    background: var(--control-button-bg) !important;
}

/* Start/stop transport controls are blue; scoring and other actions stay neutral. */
body.is-match-control-focus .match-control-shell :where(
    [data-timer-action="start"], [data-timer-action="stop"],
    [data-set-action="sets_start"], #penalties-start-button
) {
    --control-button-bg: var(--control-button-blue);
    --control-button-border: var(--control-button-blue-border);
    --control-button-text: #fff;
}

/* Selected tabs and toggles retain a clear, quieter active state. */
body.is-match-control-focus .match-control-shell :where(
    .match-tool-tabs button.is-active, .team-tab.is-active, .mode-tab.is-active,
    .hockey-line-buttons .is-active, [data-set-action="serve_set"][aria-pressed="true"]
) {
    --control-button-bg: #1d437e;
    --control-button-border: var(--control-button-blue-border);
    --control-button-text: #fff;
}

/* Amber is reserved for the yellow-card action, independent of its Bootstrap class. */
body.is-match-control-focus .match-control-shell [data-player-trigger="yellow_card"] {
    --control-button-bg: var(--control-button-amber);
    --control-button-border: var(--control-button-amber);
    --control-button-text: #1b1a16;
}

/* Reset, destructive and match-ending actions use the same red treatment. */
body.is-match-control-focus .match-control-shell :where(
    .btn-danger, .btn-outline-danger, .is-reset, .is-danger, .is-finish,
    [id$="-reset-button"], [data-basketball-foul-reset], [data-fouls-reset],
    [data-timer-action="reset"], [data-timer-action="set_full_time"],
    [data-shot-clock-action^="shot_clock_reset"], [data-shot-clock-action="shot_clock_expire"],
    [data-hockey-penalty-action^="clear"], [data-player-trigger="red_card"],
    [data-goal-log-delete], #finish-match-button, #hide-all-graphics-button
),
body.is-match-control-focus .match-focus-rail #hide-all-graphics-button {
    --control-button-bg: var(--control-button-red);
    --control-button-border: #e14a5d;
    --control-button-text: #fff;
}

body.is-match-control-focus .match-control-shell :where(button, a.btn):not(:where(.player-row-main, .hockey-live-player-main, .hockey-live-ice-button)):not(:disabled):hover,
body.is-match-control-focus .match-focus-rail :where(button, a.btn):not(:disabled):hover {
    filter: brightness(1.14);
    border-color: #dbeafe !important;
}

body.is-match-control-focus .match-control-shell :where(button, a.btn):not(:where(.player-row-main, .hockey-live-player-main, .hockey-live-ice-button)):focus-visible,
body.is-match-control-focus .match-focus-rail :where(button, a.btn):focus-visible {
    outline: 3px solid #bfdbfe;
    outline-offset: 3px;
    box-shadow: 0 0 0 5px #101827 !important;
}

body.is-match-control-focus .match-control-shell button:disabled,
body.is-match-control-focus .match-focus-rail button:disabled {
    opacity: .48;
    cursor: not-allowed;
    filter: none;
}