.highlight-favorite-team {
  position: relative;
  display: inline-block;
  font-weight: bold;
}
.highlight-favorite-team.winner {
  background-color: rgba(15, 234, 131, 0.2);
}
.highlight-favorite-team.loser {
  background-color: rgba(255, 0, 0, 0.08);
}
.winner-label {
  font-size: 11px;
  font-weight: bold;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
  padding: 0;
  background: none;
  border-radius: 0;
}
.badge-winner::before {
  content: "🏆";
  margin-right: 4px;
}
.badge-loser::before {
  content: "❌";
  margin-right: 4px;
}
.team-name-original {
  display: inline;
}
.tip-label {
  display: inline-block;
  font-size: 10px;
  font-weight: bold;
  color: #fff;
  padding: 2px 6px;
  border-radius: 10px;
  margin-left: 6px;
  text-transform: uppercase;
  line-height: 1;
  vertical-align: middle;
}

/* Existing tip classes */
.tip-1 { background-color: #007bff; }
.tip-x { background-color: #6f42c1; }
.tip-2 { background-color: #fd7e14; }
.tip-1x { background-color: #0dcaf0; }
.tip-x2 { background-color: #6610f2; }
.tip-12 { background-color: #6c757d; }
.tip-gg { background-color: #198754; }
.tip-ngg { background-color: #dc3545; }
.tip-over15 { background-color: #28a745; }
.tip-over25 { background-color: #20c997; }
.tip-under35 { background-color: #ffc107; }
.tip-psf1 { background-color: #17a2b8; }
.tip-psfx { background-color: #e83e8c; }
.tip-psf2 { background-color: #ff851b; }

/* D/E */
.tip-de-1_1 { background-color: #e6194b; }
.tip-de-1_x { background-color: #3cb44b; }
.tip-de-1_2 { background-color: #ffe119; }
.tip-de-x-1 { background-color: #0082c8; }
.tip-de-x-x { background-color: #f58231; }
.tip-de-x-2 { background-color: #911eb4; }
.tip-de-2-1 { background-color: #46f0f0; }
.tip-de-2-x { background-color: #f032e6; }
.tip-de-2-2 { background-color: #d2f53c; }

/* Total goles */
.tip-total-goles-mas-de-0_5   { background-color: #fabebe; }
.tip-total-goles-mas-de-1_5   { background-color: #008080; }
.tip-total-goles-mas-de-2_5   { background-color: #e6beff; }
.tip-total-goles-mas-de-3_5   { background-color: #aa6e28; }
.tip-total-goles-menos-de-0_5 { background-color: #fffac8; }
.tip-total-goles-menos-de-1_5 { background-color: #800000; }
.tip-total-goles-menos-de-2_5 { background-color: #aaffc3; }
.tip-total-goles-menos-de-3_5 { background-color: #808000; }

/* Total 1er tiempo */
.tip-total-1er-tiempo-mas-de-0_5   { background-color: #ffd8b1; }
.tip-total-1er-tiempo-mas-de-1_5   { background-color: #e6beff; }
.tip-total-1er-tiempo-menos-de-0_5 { background-color: #9a6324; }
.tip-total-1er-tiempo-menos-de-1_5 { background-color: #fffac8; }

/* Total 2º tiempo */
.tip-total-2-tiempo-mas-de-0_5   { background-color: #800000; }
.tip-total-2-tiempo-mas-de-1_5   { background-color: #aaffc3; }
.tip-total-2-tiempo-menos-de-0_5 { background-color: #808000; }
.tip-total-2-tiempo-menos-de-1_5 { background-color: #e6194b; }

/* AM */
.tip-am-sí { background-color: #3cb44b; }
.tip-am-no { background-color: #e6194b; }

/* Marca primero */
.tip-marca-primero-1       { background-color: #ffe119; }
.tip-marca-primero-2       { background-color: #4363d8; }
.tip-marca-primero-ninguno { background-color: #9a6324; }

/* Marca último */
.tip-marca-ultimo-1       { background-color: #46f0f0; }
.tip-marca-ultimo-2       { background-color: #f032e6; }
.tip-marca-ultimo-ninguno { background-color: #fabebe; }

/* 1/2 marca en ambos tiempos */
.tip-1-marca-en-ambos-tiempos-sí { background-color: #0082c8; }
.tip-1-marca-en-ambos-tiempos-no { background-color: #f58231; }
.tip-2-marca-en-ambos-tiempos-sí { background-color: #911eb4; }
.tip-2-marca-en-ambos-tiempos-no { background-color: #46f0f0; }

/* Córners */
.tip-total-corners-mas-de-8_5    { background-color: #dcbeff; }
.tip-total-corners-mas-de-9_5    { background-color: #228b22; }
.tip-total-corners-menos-de-8_5  { background-color: #ff4500; }
.tip-total-corners-menos-de-9_5  { background-color: #2e8b57; }
.tip-corners-1-mas-de-4_5        { background-color: #ff1493; }
.tip-corners-2-mas-de-4_5        { background-color: #1e90ff; }
.tip-primer-corner-1             { background-color: #b22222; }
.tip-primer-corner-2             { background-color: #2f4f4f; }

/* Tarjetas */
.tip-total-tarjetas-mas-de-3_5    { background-color: #8b0000; }
.tip-total-tarjetas-mas-de-4_5    { background-color: #9400d3; }
.tip-total-tarjetas-menos-de-3_5  { background-color: #ff6347; }
.tip-total-tarjetas-menos-de-4_5  { background-color: #7fff00; }

/* Roja */
.tip-roja-sí { background-color: #ff0000; }
.tip-roja-no { background-color: #006400; }

/* Goleadores */
.tip-primer-goleador-1              { background-color: #ff8c00; }
.tip-primer-goleador-2              { background-color: #483d8b; }
.tip-anota-en-cualquier-momento-1   { background-color: #00ced1; }
.tip-anota-en-cualquier-momento-2   { background-color: #ffb6c1; }

/* HA */
.tip-ha-1_-0_25 { background-color: #20b2aa; }
.tip-ha-1_-0_5  { background-color: #87cefa; }
.tip-ha-1_-0_75 { background-color: #f0e68c; }
.tip-ha-2_+0_25 { background-color: #dda0dd; }
.tip-ha-2_+0_5  { background-color: #ffdead; }
.tip-ha-2_+0_75 { background-color: #98fb98; }

/* HE */
.tip-he-1_-1 { background-color: #afeeee; }
.tip-he-1_-2 { background-color: #ffe4e1; }
.tip-he-2_+1 { background-color: #e0ffff; }
.tip-he-2_+2 { background-color: #fafad2; }

/* Progress & Legend styling */
.prediction-progress {
  margin-bottom: 10px;
  padding: 6px 10px;
  background: #f3f3f3;
  border-radius: 6px;
  font-family: Arial, sans-serif;
  font-size: 13px;
}
.progress-bar-bg {
  background: #ddd;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 5px;
}
.progress-bar-fill {
  background: linear-gradient(to right, #0fea83, #2cbf9e);
  height: 100%;
  width: 0;
  transition: width 0.4s ease-in-out;
}
.progress-bar-text {
  text-align: center;
  font-weight: bold;
  color: #333;
}
.prediction-legend,
.prediction-tips-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin: 6px 0;
  font-size: 13px;
  font-family: Arial, sans-serif;
  color: #444;
}
.legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.legend-icon {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.legend-green { background-color: rgba(15, 234, 131, 0.8); }
.legend-red   { background-color: rgba(255, 0, 0,   0.3); }

/* Responsive tweaks for mobile */
@media (max-width: 600px) {
  .prediction-tips-legend {
    flex-direction: column;
    gap: 8px;
  }
  .prediction-legend {
    flex-direction: column;
    gap: 8px;
  }
}