function renderizarCalendario(fechaDeseada) {
    const container = document.getElementById('calendario-mundial');
    let html = '';

    partidosData.forEach(dia => {
      if (fechaDeseada) {
if (fechaDeseada == "") {fechaFiltro = dia.id;} else {fechaFiltro = fechaDeseada;}
} else {fechaFiltro = dia.id;}
      if (fechaFiltro == dia.id) {
              html += `<div class="jornada" id="${dia.id}">
                    <p class="cabecera">${dia.fecha}</p>`;
              
              dia.encuentros.forEach(p => {
                  const infoLocal = paisesMaestro[p.local] || { nombre: p.local, flag: 'un', url: '#' };
                  const infoVisitante = paisesMaestro[p.visitante] || { nombre: p.visitante, flag: 'un', url: '#' };

                  html += `
                      <div class="cont-partido" data-estado="${p.estado}">
                          <div class="partido">
                              <a class="local" href="${infoLocal.url}">
                                  <p>${infoLocal.nombre}</p>
                                  <span class="fi fi-${infoLocal.flag}"></span>
                              </a>
                              
                              <div class="info-partido">
                                  <div class="hora">${p.hora}</div>
                                  <a class="marcador" href="${p.urlMarcador}">
                                      <span>${p.marcador}</span>
                                  </a>
                              </div>

                              <a class="visitante" href="${infoVisitante.url}">
                                  <span class="fi fi-${infoVisitante.flag}"></span>
                                  <p>${infoVisitante.nombre}</p>
                              </a>
                          </div>
                      </div>`;
              });
        }
        html += `</div>`;
    });

    container.innerHTML = html;
}