/* ======= CONTENEDOR PRINCIPAL ======= */ 
.bracket { display: flex; 
  flex-wrap: wrap; 
  justify-content: center; gap: 20px; padding: 20px; background-color: #0f3619; /* fondo similar al de la imagen */ 
  color: #ffffff; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
/* ---- Nuevo layout por partido (reemplaza el uso de 3 <li>) ---- */
.round .match-wrapper {
  margin-bottom: 10px;
}

/* lista de un partido */
.match {
  background-color: #1d4d2d;
  border-radius: 8px;
  padding: 6px 8px;
  margin-bottom: 8px;
  max-width: 300px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
}

/* equipos (arriba y abajo) */
.match .team {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.match .team .name {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
}

.match .team .score {
  background-color: #ffaa00;
  color: #000;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 6px;
  min-width: 30px;
  text-align: center;
  font-size: 13px;
}

/* fila del boton Global (en medio de los dos equipos) */
.match .global-btn {
  display: flex;
  justify-content: center;
}

/* estilo pill del botón */
.match .btn-global {
  background: #ffffff;
  color: #0b6b3a;
  border: none;
  padding: 4px 10px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

.match .btn-global .globe {
  font-size: 14px;
}


/* ======= RESPONSIVE ======= */
@media screen and (max-width: 768px) {
 .match .team .score{
  width: 12px;
 }
}
.round .ulcuartos{
    margin-top: 120px;
}
.round .ulsemi{
    margin-top: 220px;
}
.round .ulfinal{
    margin-top: 320px;

}
ul {
  padding-left: 0px;
}
/* Scroll horizontal en pantallas pequeñas */
.bracket-wrapper {
  overflow-x: auto;
  white-space: nowrap;
  padding-bottom: 10px;
  border-radius: 15px;
}

/* Forzar que el .bracket no se ajuste y quede en una línea horizontal grande */
.bracket {
  display: flex;
  flex-wrap: nowrap; /* 🔑 que no salte de línea */
  min-width: max-content;
  justify-content: space-around;
}

