/* ---------------------------------------------------------------------------
 * TEAM COLOUR STANDARD - one definition for the whole product.
 *
 *      Team A = YELEKLI (vest)      -> RED
 *      Team B = YELEKSIZ (non-vest) -> BLUE
 *      no team yet (needs review)   -> AMBER
 *
 * Why this file exists instead of Tailwind colour utilities scattered through
 * the templates: every goal row paints the team in three places at once (the
 * left band, the label text, the photo border). When each of those picks its
 * own utility class in its own ternary, they drift - on the match-23 report the
 * label read "Yeleksiz (B)" in blue while the band next to it was white, which
 * makes the operator's goal-by-goal feedback ambiguous exactly where it has to
 * be exact.
 *
 * Here the row declares WHO it belongs to once:
 *
 *      <div class="tm-band" data-team="a|b|none"> ... <span class="tm-text">
 *
 * and every tm-* class below reads that one decision through --tm-*. Band, text,
 * border and chip cannot disagree any more, and changing the venue's colours is
 * a one-line edit here.
 *
 * Hand-written on purpose: this is the one visual contract that must not depend
 * on whether static/build/tailwind.css happens to have been rebuilt.
 * ------------------------------------------------------------------------- */

:root {
    /* The identity colour itself never changes - only the text shade does, so that
       the same team reads the same on a white settings page and on the dark
       scoreboard card. */
    --team-a-strong: #ef4444;   /* red-500  */
    --team-b-strong: #3b82f6;   /* blue-500 */
    --team-none-strong: #f59e0b; /* amber-500 */

    --team-a-text:    #dc2626;  /* red-600  on a light background */
    --team-b-text:    #2563eb;  /* blue-600 */
    --team-none-text: #b45309;  /* amber-700 */
}

/* Dark app theme, and surfaces that are dark whatever the theme is (the report
   scoreboard card, the standalone dashboard/awards pages) - lighter shades so the
   text stays readable on slate-900. */
html.dark,
.tm-dark-surface {
    --team-a-text:    #f87171;  /* red-400  */
    --team-b-text:    #60a5fa;  /* blue-400 */
    --team-none-text: #fbbf24;  /* amber-400 */
}

[data-team="a"] {
    --tm-strong: var(--team-a-strong);
    --tm-text:   var(--team-a-text);
    --tm-soft:   rgba(239, 68, 68, 0.16);
}
[data-team="b"] {
    --tm-strong: var(--team-b-strong);
    --tm-text:   var(--team-b-text);
    --tm-soft:   rgba(59, 130, 246, 0.16);
}
[data-team="none"] {
    --tm-strong: var(--team-none-strong);
    --tm-text:   var(--team-none-text);
    --tm-soft:   rgba(245, 158, 11, 0.16);
}

/* The 4px identity band down the left edge of a goal row. */
.tm-band {
    border-left: 4px solid var(--tm-strong) !important;
}
/* Team name / score / stat text. */
.tm-text {
    color: var(--tm-text) !important;
}
/* Photo and avatar borders. */
.tm-ring {
    border-color: var(--tm-strong) !important;
}
/* Solid chip: the goal number badge, confirm buttons. */
.tm-chip {
    background: var(--tm-strong) !important;
    color: #fff !important;
}
.tm-chip:hover {
    filter: brightness(1.12);
}
/* Tinted background (possession bar fill, soft callouts). */
.tm-fill {
    background: var(--tm-strong) !important;
}
.tm-soft {
    background: var(--tm-soft) !important;
}

/* A row the operator marked "not a goal": still listed (so the pass can be
 * re-read and undone) but visibly out of the score. */
.tm-rejected {
    opacity: 0.55;
}
.tm-rejected .tm-band {
    border-left-color: #64748b !important;  /* slate-500 */
}
.tm-strike {
    text-decoration: line-through;
    text-decoration-thickness: 2px;
}