/* ─────────────────────────────────────────────────────────────────────────
   Meta Squad — the top 1K's template, drawn on a pitch.

   The pitch itself is the site's own (.pitch-view and friends, from
   style.css), so this only adds the wrapper, the header and the ownership
   badge that distinguishes a Meta Squad shirt from the user's own.
   ───────────────────────────────────────────────────────────────────────── */

.meta-squad-section { margin-bottom: 26px; }

.meta-squad-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}

.meta-squad-title {
  font-size: 0.75rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--text-muted);
}

.meta-squad-facts {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 0.78rem;
  color: var(--text-secondary, #c0a8c8);
}

.meta-squad-facts span { white-space: nowrap; }
.meta-squad-facts span:first-child { color: var(--pl-green, #00ff87); font-weight: 800; }

/* Reads as a caveat, not an error: an over-budget template is information,
   not a fault. */
.meta-squad-note {
  font-size: 0.76rem;
  line-height: 1.5;
  color: var(--text-muted);
  margin-bottom: 10px;
}

.meta-squad-blocked {
  margin-top: 10px;
  font-size: 0.74rem;
  line-height: 1.55;
  color: var(--text-muted);
}

.meta-squad-blocked strong { color: var(--text-secondary, #c0a8c8); }

/* ── Ownership badge ──────────────────────────────────────────────────
   Centred over the shirt, just under the price.

   Bottom-left was the obvious spot and it was wrong: it landed on top of the
   fixture line, so a card read "79% EW (A)" instead of "NEW (A)". The corners
   are taken — price top-right, captain armband top-left — and the white body
   holds the numbers, which leaves the shirt itself as the only clear space. */
.meta-own-badge {
  position: absolute;
  top: 22px;
  left: 50%;
  transform: translateX(-50%);
  /* Above .player-card-body, which sits at z-index 10. That rule bites even
     though the body is position:static, because .player-card is a flexbox and
     z-index applies to flex items — at z-index 3 the badge was in the DOM,
     correctly placed, and painted underneath the white body. */
  z-index: 12;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 0.6rem;
  font-weight: 900;
  color: #06130c;
  background: var(--pl-green, #00ff87);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
  pointer-events: none;
}

@media (prefers-contrast: more) {
  .meta-own-badge { outline: 1px solid #06130c; }
}
