/* ScoreProb team page (teams-v1). Loaded after sp-league-detail.css; everything is scoped to .ld, the team parts to .tm-*. */

/* side column: one card per competition table */
.tm-side { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.tm-pos .ld-card-h h2 { display: flex; align-items: center; gap: 9px; min-width: 0; }
.tm-pos .ld-card-h h2 a { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.tm-pos .ld-card-h h2 a:hover { text-decoration: underline; }
.tm-pos .ld-card-h h2 img { width: 24px; height: 24px; object-fit: contain; flex: none; }
.tm-pos .ld-card-h h2 span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-t tbody tr { cursor: default; }
.tm-t tbody tr.tm-me td { background: var(--accent-soft); }
.tm-t tbody tr.tm-me .ld-tn { font-weight: 800; }
.tm-t .ld-team a:hover .ld-tn { text-decoration: underline; }
.tm-t .ld-c-team { min-width: 120px; }
.tm-zone { display: inline-flex; align-items: center; gap: 6px; }
.tm-foot { padding: 12px 18px 14px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; font-size: 12.5px; color: var(--muted); }

/* one line under the teams of a match row: result, competition, round */
.ld-m-c { grid-column: 2 / -1; display: flex; align-items: center; gap: 7px; min-width: 0; font-size: 12px; color: var(--muted); }
.ld-m-c .ld-f { flex: none; }
.ld-m-c > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ld-m .tm-me { font-weight: 800; }
.ld-m-h.tm-me, .ld-m-a.tm-me { color: var(--ink); }

/* competition filter above the matches */
.tm-filter { padding: 0 18px 12px; display: flex; flex-wrap: wrap; gap: 6px 8px; }
.tm-filter a { padding: 4px 11px; border-radius: 999px; border: 1px solid var(--line); font-size: 12.5px; font-weight: 600; color: var(--accent-deep); }
.tm-filter a:hover { border-color: var(--accent); }
.tm-filter a[aria-current] { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-deep); }
.tm-only { padding: 0 18px 10px; font-size: 12.5px; color: var(--muted); }
.tm-only a { color: var(--accent); font-weight: 700; }

/* info cards */
.tm-comps { display: flex; flex-direction: column; }
.tm-comps li { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; column-gap: 10px; padding: 9px 18px; border-top: 1px solid var(--line); }
.tm-comps li:first-child { border-top: 0; }
.tm-comps img, .tm-comps .ld-badge { width: 24px; height: 24px; object-fit: contain; }
.tm-comps .ld-badge { font-size: 8px; }
.tm-comp-n { min-width: 0; display: flex; flex-direction: column; }
.tm-comp-n a { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-comp-n a:hover { text-decoration: underline; }
.tm-comp-n i { font-size: 12px; color: var(--muted); }
.tm-comp-r { text-align: right; font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.tm-comp-r b { display: block; color: var(--ink); font-size: 14px; }

.tm-dl { display: flex; flex-direction: column; }
.tm-dl > div { display: grid; grid-template-columns: minmax(90px, 36%) minmax(0, 1fr); gap: 10px; padding: 9px 18px; border-top: 1px solid var(--line); font-size: 14px; }
.tm-dl > div:first-child { border-top: 0; }
.tm-dl dt { color: var(--muted); }
.tm-dl dd { font-weight: 600; overflow-wrap: anywhere; }
.tm-dl a { color: var(--accent-deep); }
.tm-dl a:hover { text-decoration: underline; }

.tm-season > :not(.ld-card-h) { margin-left: 18px; margin-right: 18px; }
.tm-season { display: flex; flex-direction: column; gap: 12px; padding-bottom: 18px; }
.tm-wdl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; text-align: center; }
.tm-wdl > div { padding: 9px 4px; border-radius: 10px; background: var(--soft); display: flex; flex-direction: column; gap: 2px; }
.tm-wdl b { font-size: 21px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.15; }
.tm-wdl span { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.tm-formrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--muted); }
.tm-formrow .ld-f { width: 22px; height: 22px; font-size: 12px; border-radius: 5px; }
.tm-formrow .ld-form { gap: 4px; }

.ld-lc[aria-current] { background: var(--accent-soft); border-color: var(--accent); }
.ld-tc { color: inherit; }
a.ld-tc:hover { border-color: var(--accent); }

@media (max-width: 760px) {
  .tm-filter, .tm-only, .tm-foot { padding-left: 14px; padding-right: 14px; }
  .tm-comps li, .tm-dl > div { padding-left: 14px; padding-right: 14px; }
  .tm-season > :not(.ld-card-h) { margin-left: 14px; margin-right: 14px; }
}

/* country page */
.tm-flag { width: 80px; height: 60px; object-fit: contain; border-radius: 6px; box-shadow: 0 0 0 1px var(--line); }
.tm-comps-wide li { grid-template-columns: 26px minmax(0, 1fr) minmax(0, 42%); }
.tm-comps-wide .tm-comp-r { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-comps-wide .tm-comp-r b { overflow: hidden; text-overflow: ellipsis; }
.tm-comp-r a:hover { text-decoration: underline; }
.tm-oc { display: inline-flex; align-items: center; gap: 7px; }
.ld-more-list > .tm-comps { border-top: 1px solid var(--line); }
@media (max-width: 760px) { .tm-flag { width: 64px; height: 48px; } .tm-comps-wide li { grid-template-columns: 26px minmax(0, 1fr) minmax(0, 38%); } }

/* v1b: on wide screens the table card sits beside the matches, so the Table tab would only duplicate Matches */
@media (min-width: 1181px) { [data-ld-tabs] a[data-tab="table"][data-tm-side] { display: none; } }
/* v1b: the next kick-off may wrap on two lines in the 2-column key facts of a phone */
@media (max-width: 640px) { .ld-kf-v.tm-kv-wrap { white-space: normal; overflow: visible; font-size: 17px; line-height: 1.25; } }
