/* ==========================================================
   Torneo de Soga — estilos públicos y de admin
   Mobile-first. Paleta: azul ayuntamiento (#2771BA) + blanco,
   con acentos de cuerda y madera.
   ========================================================== */

.soga, .soga-admin .soga-cuadro-wrap {
    --soga-azul: #2771BA;
    --soga-azul-oscuro: #1B5A98;
    --soga-azul-claro: #E9F2FB;
    --soga-cuerda: #B47A3C;
    --soga-cuerda-oscura: #8C5A26;
    --soga-cuerda-clara: #C48B4C;
    --soga-madera: #F8F1E6;
    --soga-madera-borde: #DDCDB3;
    --soga-tinta: #26211A;
    --soga-tinta-suave: #6E6252;
    --soga-conector: #C9AB82;
    --soga-verde: #2E7D32;
    --soga-rojo: #C62828;
    --soga-radio: 10px;
    --soga-sombra: 0 1px 3px rgba(38, 33, 26, .08), 0 4px 14px rgba(38, 33, 26, .06);
    --soga-rope: repeating-linear-gradient(-45deg, var(--soga-cuerda-clara) 0 6px, var(--soga-cuerda-oscura) 6px 9px);

    color: var(--soga-tinta);
    font-size: 16px;
    line-height: 1.4;
    -webkit-text-size-adjust: 100%;
}

.soga *, .soga *::before, .soga *::after { box-sizing: border-box; }

/* ----------------------------------------------------------
   Barra de navegación entre páginas del plugin
   ---------------------------------------------------------- */
.soga-nav {
    display: flex; gap: 6px; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 0 16px; padding: 0 0 4px;
    scrollbar-width: none;
}
.soga-nav::-webkit-scrollbar { display: none; }
.soga-nav-item {
    flex: 0 0 auto; white-space: nowrap; background: #fff; border: 2px solid var(--soga-madera-borde); border-radius: 999px;
    padding: 7px 14px; font-weight: 700; font-size: .9em; color: var(--soga-tinta); text-decoration: none;
}
a.soga-nav-item:hover { border-color: var(--soga-azul); color: var(--soga-azul); text-decoration: none; }
.soga-nav-actual { background: var(--soga-azul); border-color: var(--soga-azul); color: #fff; }

/* ----------------------------------------------------------
   Indicador "en directo"
   ---------------------------------------------------------- */
.soga-directo {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: .8em; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
    color: var(--soga-rojo); background: #fff; border: 1px solid #F3C9C9; border-radius: 999px;
    padding: 6px 14px 6px 10px; margin: 0 0 14px;
}
.soga-directo-punto {
    width: 10px; height: 10px; border-radius: 50%; background: var(--soga-rojo);
    animation: soga-pulso 1.4s ease-in-out infinite;
}
#soga-estado { text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--soga-tinta-suave); }
@keyframes soga-pulso {
    0%, 100% { box-shadow: 0 0 0 0 rgba(198, 40, 40, .45); }
    60%      { box-shadow: 0 0 0 7px rgba(198, 40, 40, 0); }
}
@keyframes soga-aparece {
    from { opacity: .35; transform: translateY(4px); }
    to   { opacity: 1;   transform: none; }
}
.soga-actualizado { animation: soga-aparece .5s ease-out; }

/* ----------------------------------------------------------
   Antes del sorteo
   ---------------------------------------------------------- */
.soga-espera {
    text-align: center; background: #fff; border: 1px solid var(--soga-madera-borde);
    border-top: 6px solid var(--soga-azul); border-radius: var(--soga-radio);
    padding: 28px 20px; box-shadow: var(--soga-sombra);
}
.soga-espera-icono { font-size: 2.6em; line-height: 1; margin-bottom: 8px; }
.soga-espera-titulo { font-size: 1.25em; font-weight: 800; margin: 0 0 6px; color: var(--soga-azul); }
.soga-espera-texto { margin: 0; color: var(--soga-tinta-suave); }

/* ----------------------------------------------------------
   En juego ahora
   ---------------------------------------------------------- */
.soga-ahora { margin: 0 0 22px; }
.soga-ahora-titulo {
    display: flex; align-items: center; gap: 8px;
    font-weight: 800; font-size: .85em; text-transform: uppercase; letter-spacing: .1em;
    color: var(--soga-azul); margin: 0 0 14px;
}
.soga-ahora-titulo::before {
    content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--soga-azul);
    animation: soga-pulso-azul 1.4s ease-in-out infinite;
}
@keyframes soga-pulso-azul {
    0%, 100% { box-shadow: 0 0 0 0 rgba(39, 113, 186, .45); }
    60%      { box-shadow: 0 0 0 7px rgba(39, 113, 186, 0); }
}
.soga-ahora-lista { display: grid; gap: 14px; grid-template-columns: 1fr; }
.soga-vs {
    position: relative; text-align: center;
    background: linear-gradient(165deg, #fff 40%, var(--soga-azul-claro));
    border: 2px solid var(--soga-azul); border-radius: var(--soga-radio);
    padding: 18px 16px 16px; box-shadow: var(--soga-sombra);
}
.soga-vs-ronda {
    position: absolute; top: -12px; left: 50%; transform: translateX(-50%); white-space: nowrap;
    background: var(--soga-azul); color: #fff; font-size: .7em; font-weight: 700;
    text-transform: uppercase; letter-spacing: .1em; padding: 4px 14px; border-radius: 999px;
}
.soga-vs-eq { font-size: 1.3em; font-weight: 800; line-height: 1.2; padding: 6px 0; word-break: break-word; }
.soga-vs-sep {
    display: flex; align-items: center; gap: 12px; margin: 4px 0;
    color: var(--soga-cuerda-oscura); font-weight: 800; font-style: italic; font-size: .85em; text-transform: uppercase;
}
.soga-vs-sep::before, .soga-vs-sep::after {
    content: ""; flex: 1; height: 5px; border-radius: 3px; background: var(--soga-rope);
}

/* ----------------------------------------------------------
   Podio
   ---------------------------------------------------------- */
.soga-podio {
    position: relative; overflow: hidden; color: #fff;
    background: linear-gradient(135deg, var(--soga-azul), var(--soga-azul-oscuro));
    border-radius: var(--soga-radio); padding: 18px 20px 24px; margin: 0 0 22px; box-shadow: var(--soga-sombra);
}
.soga-podio::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 7px; background: var(--soga-rope); }
.soga-podio-campeon { font-size: 1.45em; line-height: 1.15; }
.soga-podio-etq { display: block; font-size: .55em; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; opacity: .85; margin-bottom: 2px; }
.soga-podio-puesto {
    display: inline-block; margin: 12px 10px 0 0; font-weight: 600; font-size: .95em;
    background: rgba(255, 255, 255, .16); padding: 4px 12px; border-radius: 999px;
}
.soga-modo { color: var(--soga-tinta-suave); font-style: italic; font-size: .9em; margin: 0 0 14px; }

/* ----------------------------------------------------------
   Cuadro — móvil: rondas apiladas
   ---------------------------------------------------------- */
.soga-cuadro { display: flex; flex-direction: column; gap: 20px; }
.soga-ronda { display: flex; flex-direction: column; }
/* En móvil el 3er puesto va antes de la final (orden de juego) */
.soga-ronda-tercer { order: 1; }
.soga-ronda-final  { order: 2; }
.soga-ronda-titulo {
    position: relative; display: flex; justify-content: space-between; align-items: center; gap: 10px;
    background: var(--soga-azul); color: #fff; font-weight: 700; text-transform: uppercase; letter-spacing: .07em;
    font-size: .85em; padding: 9px 14px; border-radius: var(--soga-radio) var(--soga-radio) 0 0;
}
.soga-ronda-titulo::after { content: ""; position: absolute; left: 0; right: 0; bottom: -5px; height: 5px; background: var(--soga-rope); }
.soga-ronda-estado {
    font-size: .8em; font-weight: 600; letter-spacing: .03em; text-transform: none;
    background: rgba(255, 255, 255, .18); padding: 2px 9px; border-radius: 999px; white-space: nowrap;
}
.soga-ronda-enjuego .soga-ronda-estado { background: #fff; color: var(--soga-azul); }
.soga-ronda-pendiente .soga-ronda-titulo { background: #7A93AD; }
.soga-ronda-terminada .soga-ronda-titulo { background: var(--soga-azul-oscuro); }
.soga-ronda-tercer .soga-ronda-titulo { background: var(--soga-cuerda-oscura); }
.soga-ronda-partidos { display: flex; flex-direction: column; gap: 10px; padding: 16px 0 0; }

.soga-partido {
    display: flex; align-items: stretch; overflow: hidden;
    background: #fff; border: 1px solid var(--soga-madera-borde); border-left: 5px solid var(--soga-cuerda);
    border-radius: 8px; padding: 4px 12px 4px 0; box-shadow: var(--soga-sombra);
}
.soga-partido-cuerpo { flex: 1; min-width: 0; padding-left: 12px; }
/* Número de enfrentamiento (orden de juego) */
.soga-num {
    flex: 0 0 auto; min-width: 30px; margin: -4px 0; padding: 0 4px;
    display: flex; align-items: center; justify-content: center;
    background: var(--soga-madera); border-right: 1px solid var(--soga-madera-borde);
    color: var(--soga-azul); font-weight: 800; font-size: .9em; font-variant-numeric: tabular-nums;
}
.soga-decidido { background: var(--soga-madera); }
.soga-decidido .soga-num { background: #EFE4D2; }
.soga-listo { border-left-color: var(--soga-azul); box-shadow: 0 0 0 3px rgba(39, 113, 186, .18), var(--soga-sombra); }
.soga-listo .soga-num { background: var(--soga-azul); color: #fff; }
/* Exento: una sola línea "Equipo ✔ · exento" */
.soga-bye { opacity: .75; }
.soga-bye .soga-partido-cuerpo { display: flex; align-items: center; gap: 10px; }
.soga-bye .soga-equipo { flex: 1; padding: 6px 0; }
.soga-bye .soga-equipo + .soga-equipo { flex: 0 0 auto; border-top: 0; font-size: .85em; }
.soga-equipo {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 9px 0; font-weight: 600; font-size: 1.05em; line-height: 1.25;
}
.soga-equipo + .soga-equipo { border-top: 1px dashed var(--soga-madera-borde); }
.soga-eq-nombre { word-break: break-word; }
.soga-ganador .soga-eq-nombre { color: var(--soga-azul); font-weight: 800; }
.soga-ganador .soga-eq-nombre::after { content: " ✔"; }
.soga-perdedor .soga-eq-nombre { opacity: .5; text-decoration: line-through; font-weight: 500; }
.soga-pendiente { color: #A99A80; font-style: italic; font-weight: 400; }
.soga-resultado { font-size: .8em; color: var(--soga-tinta-suave); text-align: right; padding: 0 0 6px; margin-top: -3px; }

/* En móvil las rondas terminadas se compactan */
.soga-ronda-terminada .soga-partido { padding: 2px 12px 2px 0; }
.soga-ronda-terminada .soga-num { margin: -2px 0; }
.soga-ronda-terminada .soga-equipo { padding: 6px 0; font-size: .95em; }
.soga-desliza { display: none; }

/* ----------------------------------------------------------
   Cuadro — escritorio: columnas con conectores
   ---------------------------------------------------------- */
/* Modo árbol: lo activa la clase .soga-modo-arbol en un ancestro (el JS la pone según ancho/preferencia;
   por defecto el HTML ya la lleva, así sin JS —o en wp-admin— se ve el árbol con scroll horizontal). */
.soga-modo-arbol .soga-cuadro { flex-direction: row; gap: 32px; overflow-x: auto; align-items: stretch; padding: 8px 4px 16px; -webkit-overflow-scrolling: touch; }
.soga-modo-arbol .soga-ronda { flex: 0 0 230px; }
.soga-modo-arbol .soga-ronda-tercer, .soga-modo-arbol .soga-ronda-final { order: 0; } /* orden del DOM: los conectores lo necesitan */
.soga-modo-arbol .soga-ronda-titulo { justify-content: center; height: 40px; }
.soga-modo-arbol .soga-ronda-estado { display: none; }
.soga-modo-arbol .soga-ronda-partidos { flex: 1; gap: 0; padding-top: 14px; }
.soga-modo-arbol .soga-slot { position: relative; flex: 1; display: flex; align-items: center; padding: 8px 0; }
.soga-modo-arbol .soga-slot > .soga-partido { width: 100%; }
.soga-modo-arbol .soga-ronda-terminada .soga-partido { padding: 4px 12px 4px 0; }
.soga-modo-arbol .soga-ronda-terminada .soga-num { margin: -4px 0; }
.soga-modo-arbol .soga-ronda-terminada .soga-equipo { padding: 9px 0; font-size: 1em; }

/* Conectores: salida a la derecha (par/impar se unen) y entrada por la izquierda */
.soga-modo-arbol .soga-ronda-salida .soga-slot::after {
    content: ""; position: absolute; right: -16px; width: 16px; height: 50%;
    border: 0 solid var(--soga-conector);
}
.soga-modo-arbol .soga-ronda-salida .soga-slot:nth-child(odd)::after  { top: 50%;    border-top-width: 2px;    border-right-width: 2px; border-top-right-radius: 8px; }
.soga-modo-arbol .soga-ronda-salida .soga-slot:nth-child(even)::after { bottom: 50%; border-bottom-width: 2px; border-right-width: 2px; border-bottom-right-radius: 8px; }
.soga-modo-arbol .soga-ronda-entrada .soga-slot::before {
    content: ""; position: absolute; left: -16px; top: 50%; width: 16px;
    border-top: 2px solid var(--soga-conector);
}
.soga-modo-arbol .soga-desliza { display: block; font-size: .8em; color: var(--soga-tinta-suave); text-align: right; margin: 0; }
@media (max-width: 759px) { .soga-modo-arbol .soga-ronda { flex-basis: 210px; } }

/* Botón Árbol / Lista */
.soga-directo-fila { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 14px; }
.soga-directo-fila .soga-directo { margin: 0; }
.soga-vista-btn {
    margin-left: auto; background: #fff; border: 2px solid var(--soga-madera-borde); border-radius: 999px;
    padding: 6px 14px; font-family: inherit; font-weight: 700; font-size: .85em; color: var(--soga-tinta); cursor: pointer;
}
.soga-vista-btn:hover { border-color: var(--soga-azul); color: var(--soga-azul); }

/* Parpadeo de lo que acaba de cambiar (ganador marcado, hueco que se rellena) */
@keyframes soga-flash {
    0%, 100% { box-shadow: var(--soga-sombra); }
    30%, 70%  { box-shadow: 0 0 0 5px rgba(239, 108, 0, .75); background-color: #FFF3E0; }
}
.soga-cambio { animation: soga-flash 1.1s ease-in-out 3; }
.soga-pantalla .soga-cambio { animation: soga-flash 1s ease-in-out 6; }
.soga-pantalla .soga-vs.soga-cambio, .soga-pantalla .soga-podio.soga-cambio { animation-iteration-count: 6; }

/* ----------------------------------------------------------
   Controles de admin dentro del cuadro
   ---------------------------------------------------------- */
.soga-form-gana { display: flex; gap: 4px; align-items: center; flex-shrink: 0; }
.soga-form-gana input[type=text] { width: 56px; text-align: center; }
.soga-form-corregir { text-align: right; padding-bottom: 4px; }
.soga-form-corregir .button-link { color: var(--soga-rojo); font-size: .8em; }

/* ----------------------------------------------------------
   Inscripción
   ---------------------------------------------------------- */
.soga-form-insc {
    background: #fff; border: 1px solid var(--soga-madera-borde); border-top: 6px solid var(--soga-azul);
    border-radius: var(--soga-radio); padding: 20px 18px; box-shadow: var(--soga-sombra); max-width: 560px;
}
.soga-form-insc p { margin: 0 0 14px; }
.soga-campo label { display: block; font-weight: 700; font-size: .9em; margin-bottom: 5px; }
.soga-campo label small { font-weight: 400; color: var(--soga-tinta-suave); }
.soga-form-insc input[type=text], .soga-form-insc input[type=number] {
    width: 100%; padding: 12px 14px; font-size: 16px; /* 16px evita el zoom automático en iOS */
    border: 1px solid var(--soga-madera-borde); border-radius: 8px; background: var(--soga-madera); color: var(--soga-tinta);
    font-family: inherit; box-sizing: border-box;
}
.soga-form-insc input[type=text]:focus, .soga-form-insc input[type=number]:focus {
    outline: none; border-color: var(--soga-azul); background: #fff; box-shadow: 0 0 0 3px rgba(39, 113, 186, .2);
}
.soga-participantes { border: 0; padding: 0; margin: 0 0 6px; }
.soga-participantes legend {
    font-weight: 800; font-size: .8em; text-transform: uppercase; letter-spacing: .1em; color: var(--soga-cuerda-oscura);
    padding: 0; margin-bottom: 10px;
}
.soga-participantes-grid { display: grid; grid-template-columns: 1fr; gap: 0 14px; }
.soga-web { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }
.soga-boton {
    display: block; width: 100%; background: var(--soga-azul); color: #fff; border: none; cursor: pointer;
    padding: 14px 24px; border-radius: 8px; font-size: 1.05em; font-weight: 700; transition: background .15s;
}
.soga-boton:hover, .soga-boton:focus { background: var(--soga-azul-oscuro); color: #fff; }
.soga-ok, .soga-error, .soga-aviso { padding: 12px 16px; border-radius: 8px; margin: 0 0 16px; }
.soga-ok    { background: #E8F5E9; border-left: 5px solid var(--soga-verde); }
.soga-error { background: #FDECEA; border-left: 5px solid var(--soga-rojo); }
.soga-aviso { background: var(--soga-madera); border-left: 5px solid var(--soga-cuerda); font-style: italic; }

.soga-inscritos { margin-top: 26px; }
.soga-inscritos h3 { display: flex; align-items: center; gap: 10px; font-size: 1.1em; margin: 0 0 12px; }
.soga-contador {
    background: var(--soga-azul); color: #fff; font-size: .8em; font-weight: 700;
    min-width: 26px; height: 26px; padding: 0 8px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center;
}
.soga-inscritos ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 8px; }
.soga-inscritos li {
    list-style: none; margin: 0; /* los temas (Divi) fuerzan viñetas en li */
    background: #fff; border: 1px solid var(--soga-madera-borde); border-left: 5px solid var(--soga-cuerda);
    border-radius: 8px; padding: 10px 14px; font-weight: 600;
}

/* En el admin las columnas van más anchas para que quepan los botones "Gana" */
.soga-admin .soga-cuadro-wrap { font-size: 14px; }
.soga-admin .soga-ronda { flex-basis: 300px; }

@media (min-width: 560px) {
    .soga-participantes-grid { grid-template-columns: 1fr 1fr; }
    .soga-boton { width: auto; }
    .soga-inscritos ul { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
    .soga-ahora-lista { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
}

/* ----------------------------------------------------------
   Modo organizador (controles táctiles en la página pública)
   ---------------------------------------------------------- */
.soga-barra-gestion {
    position: sticky; top: env(safe-area-inset-top, 0px); z-index: 30;
    display: flex; flex-wrap: wrap; align-items: center; gap: 2px 12px;
    background: var(--soga-tinta); color: #fff; padding: 10px 14px; border-radius: 8px; margin: 0 0 14px;
    font-weight: 700; font-size: .9em; box-shadow: var(--soga-sombra);
}
.soga-barra-txt { flex: 1 1 100%; font-weight: 400; font-size: .85em; opacity: .8; }
.soga-barra-salir { margin-left: auto; color: #fff; opacity: .7; font-weight: 400; font-size: .85em; text-decoration: underline; }
.soga-barra-salir:hover { color: #fff; opacity: 1; }

.soga-btn {
    display: block; width: 100%; border: 0; border-radius: 8px; padding: 14px 16px; cursor: pointer;
    font-family: inherit; font-size: 1.05em; font-weight: 700; line-height: 1.2; text-align: center;
    transition: background .15s, transform .05s;
}
.soga-btn:active { transform: scale(.98); }
.soga-btn-gana, .soga-btn-primario { background: var(--soga-azul); color: #fff; }
.soga-btn-gana:hover, .soga-btn-primario:hover, .soga-btn-gana:active, .soga-btn-primario:active { background: var(--soga-azul-oscuro); color: #fff; }
.soga-btn-secundario { background: #fff; color: var(--soga-tinta); border: 2px solid var(--soga-madera-borde); }
.soga-btn-secundario:hover { border-color: var(--soga-cuerda); }
.soga-btn[disabled], .soga-enviando { opacity: .5; cursor: wait; transform: none; }

.soga-vs-control { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--soga-madera-borde); }
.soga-vs-resultado {
    width: 100%; padding: 10px 12px; margin: 0 0 10px; font-size: 16px; text-align: center;
    border: 1px solid var(--soga-madera-borde); border-radius: 8px; background: #fff; color: var(--soga-tinta);
}
.soga-vs-resultado:focus { outline: none; border-color: var(--soga-azul); box-shadow: 0 0 0 3px rgba(39, 113, 186, .2); }
.soga-vs-botones { display: grid; gap: 8px; grid-template-columns: 1fr; }
.soga-btn-corregir {
    display: block; margin: 0 0 0 auto; padding: 4px 0 8px; background: none; border: 0; cursor: pointer;
    color: var(--soga-rojo); font-family: inherit; font-size: .8em; text-decoration: underline;
}
.soga-espera-control { display: grid; gap: 10px; margin-top: 20px; text-align: left; }
.soga-espera-control .soga-espera-texto { text-align: center; font-size: .9em; }

.soga-toast {
    position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%) translateY(20px);
    max-width: 90vw; padding: 12px 20px; border-radius: 999px; z-index: 1000;
    background: var(--soga-tinta); color: #fff; font-weight: 600; text-align: center;
    box-shadow: 0 6px 24px rgba(0, 0, 0, .25); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s;
}
.soga-toast-visible { opacity: 1; transform: translateX(-50%) translateY(0); }
.soga-toast-error { background: var(--soga-rojo); }

@media (min-width: 560px) {
    .soga-vs-botones { grid-template-columns: 1fr 1fr; }
    .soga-barra-txt { flex: 1 1 auto; }
}

/* Cronómetro del organizador */
.soga-crono { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 0 0 12px; padding: 10px; border-radius: 8px; background: var(--soga-madera); }
.soga-crono-tiempo { flex: 1 1 100%; text-align: center; font-size: 2em; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1; color: var(--soga-tinta-suave); }
.soga-crono-activo .soga-crono-tiempo { color: var(--soga-azul); }
.soga-crono-fin { background: #FFF3E0; animation: soga-flash 1s ease-in-out 3; }
.soga-crono-fin .soga-crono-tiempo { color: #EF6C00; font-size: 1.6em; }
.soga-crono-btn { background: #fff; border: 2px solid var(--soga-madera-borde); border-radius: 999px; padding: 8px 14px; font-family: inherit; font-weight: 700; font-size: .9em; color: var(--soga-tinta); cursor: pointer; }
.soga-crono-btn:hover { border-color: var(--soga-azul); color: var(--soga-azul); }
.soga-crono-parar { border-color: var(--soga-rojo); color: var(--soga-rojo); }
.soga-modo a, .soga-normas-enlace a { color: var(--soga-azul); font-weight: 700; text-decoration: underline; }

/* Botón "Seguir el torneo en directo" en el bloque de inscripción */
.soga-boton-directo {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 10px;
    background: linear-gradient(135deg, var(--soga-azul), var(--soga-azul-oscuro)); color: #fff; text-decoration: none;
    border-radius: var(--soga-radio); padding: 16px 20px; margin: 0 0 16px; font-size: 1.15em; font-weight: 800;
    box-shadow: var(--soga-sombra); position: relative; overflow: hidden;
}
.soga-boton-directo::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background: var(--soga-rope); }
.soga-boton-directo:hover, .soga-boton-directo:focus { color: #fff; text-decoration: none; filter: brightness(1.08); }
.soga-boton-directo .soga-directo-punto { background: #fff; animation-name: soga-pulso-blanco; }
.soga-boton-directo small { flex: 1 1 100%; text-align: center; font-weight: 500; font-size: .7em; opacity: .85; }
@keyframes soga-pulso-blanco {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); }
    60%      { box-shadow: 0 0 0 7px rgba(255, 255, 255, 0); }
}
.soga-normas-enlace { font-size: .95em; }

/* Resultados rápidos, incomparecencia, quitar equipo, reiniciar */
.soga-vs-rapidos { display: flex; gap: 6px; justify-content: center; margin: -4px 0 10px; }
.soga-btn-rapido {
    background: #fff; border: 1px solid var(--soga-madera-borde); border-radius: 999px; padding: 4px 14px;
    font-family: inherit; font-weight: 700; font-size: .9em; color: var(--soga-tinta); cursor: pointer;
}
.soga-btn-rapido:hover { border-color: var(--soga-azul); color: var(--soga-azul); }
.soga-vs-nopresenta { margin-top: 10px; font-size: .8em; color: var(--soga-tinta-suave); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: center; }
.soga-vs-nopresenta button {
    background: none; border: 1px dashed var(--soga-madera-borde); border-radius: 999px; padding: 3px 10px;
    font-family: inherit; font-size: 1em; color: var(--soga-rojo); cursor: pointer;
}
.soga-espera-equipos { margin-top: 18px; text-align: left; }
.soga-espera-sub { font-weight: 800; font-size: .8em; text-transform: uppercase; letter-spacing: .1em; color: var(--soga-cuerda-oscura); margin: 0 0 8px; }
.soga-espera-equipos ul { list-style: none; margin: 0; padding: 0; }
.soga-espera-equipos li {
    list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 10px;
    padding: 8px 0; border-bottom: 1px dashed var(--soga-madera-borde); font-weight: 600;
}
.soga-btn-quitar, .soga-btn-peligro {
    background: none; border: 0; cursor: pointer; font-family: inherit; color: var(--soga-rojo); text-decoration: underline; font-size: .85em;
}
.soga-gestion-pie { text-align: right; margin: 12px 0 0; }

/* "En juego ahora" conjunto de una sesión (varias categorías a la vez) */
.soga-ahora-global { padding-bottom: 18px; margin-bottom: 20px; border-bottom: 2px dashed var(--soga-madera-borde); }

/* ----------------------------------------------------------
   Panel de gestión en la web ([soga_panel]): estilos para el HTML del panel de WP
   ---------------------------------------------------------- */
.soga-panel { font-size: 15px; }
.soga-panel .soga-panel-titulo { font-size: 1.4em; font-weight: 800; color: var(--soga-azul); margin: 0 0 8px; }
.soga-panel .wrap { margin: 0; }
.soga-panel h1 { font-size: 1.45em; font-weight: 800; color: var(--soga-azul); margin: 0 0 12px; line-height: 1.2; }
.soga-panel h1 small { font-weight: 500; color: var(--soga-tinta-suave); font-size: .7em; }
.soga-panel h2 { font-size: 1.1em; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--soga-cuerda-oscura); margin: 26px 0 10px; padding-bottom: 6px; border-bottom: 3px solid var(--soga-cuerda); }
.soga-panel h3 { font-size: 1em; font-weight: 800; margin: 18px 0 8px; }
.soga-panel hr { border: 0; border-top: 1px dashed var(--soga-madera-borde); margin: 22px 0; }
.soga-panel p { margin: 0 0 10px; }
.soga-panel .description { color: var(--soga-tinta-suave); font-size: .88em; margin: 4px 0 0; }
.soga-panel code { background: var(--soga-madera); padding: 2px 6px; border-radius: 4px; font-size: .9em; }
.soga-panel .soga-admin-estado { display: inline-block; font-size: .55em; font-weight: 700; vertical-align: middle; background: var(--soga-azul-claro); color: var(--soga-azul-oscuro); padding: 4px 10px; border-radius: 999px; margin-left: 6px; }
.soga-panel .notice { padding: 12px 16px; border-radius: 8px; margin: 0 0 14px; border-left: 5px solid var(--soga-azul); background: var(--soga-azul-claro); }
.soga-panel .notice-success { border-left-color: var(--soga-verde); background: #E8F5E9; }
.soga-panel .notice-error { border-left-color: var(--soga-rojo); background: #FDECEA; }
.soga-panel .notice p { margin: 0; }
.soga-panel .soga-enlaces { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }

/* Botones (clases de WP) */
.soga-panel .button, .soga-panel .button-link, .soga-panel .button-link-delete {
    display: inline-block; border: 2px solid var(--soga-madera-borde); background: #fff; color: var(--soga-tinta);
    border-radius: 8px; padding: 9px 14px; font-family: inherit; font-size: .95em; font-weight: 700; line-height: 1.2;
    cursor: pointer; text-decoration: none; margin: 2px 4px 2px 0;
}
.soga-panel .button-primary { background: var(--soga-azul); border-color: var(--soga-azul); color: #fff; }
.soga-panel .button-primary:hover { background: var(--soga-azul-oscuro); color: #fff; }
.soga-panel .button-hero { padding: 14px 22px; font-size: 1.1em; }
.soga-panel .button-small { padding: 6px 10px; font-size: .85em; }
.soga-panel .button-link, .soga-panel .button-link-delete { border-color: transparent; background: none; text-decoration: underline; padding-left: 4px; padding-right: 4px; }
.soga-panel .button-link-delete { color: var(--soga-rojo); }
.soga-panel .button[disabled] { opacity: .5; cursor: not-allowed; }

/* Formularios */
.soga-panel .form-table { width: 100%; border-collapse: collapse; }
.soga-panel .form-table th, .soga-panel .form-table td { display: block; padding: 0; text-align: left; }
.soga-panel .form-table th { font-weight: 800; font-size: .9em; margin: 14px 0 6px; }
.soga-panel .form-table td { margin-bottom: 4px; }
.soga-panel input[type=text], .soga-panel input[type=number], .soga-panel input[type=url], .soga-panel input[type=email],
.soga-panel input[type=datetime-local], .soga-panel input[type=password], .soga-panel select, .soga-panel textarea {
    font-family: inherit; font-size: 16px; padding: 10px 12px; border: 1px solid var(--soga-madera-borde); border-radius: 8px;
    background: var(--soga-madera); color: var(--soga-tinta); max-width: 100%; box-sizing: border-box; margin: 2px 4px 6px 0;
}
.soga-panel .regular-text, .soga-panel .large-text, .soga-panel textarea { width: 100%; }
.soga-panel .small-text { width: 80px; }
.soga-panel input:focus, .soga-panel select:focus, .soga-panel textarea:focus { outline: none; border-color: var(--soga-azul); background: #fff; box-shadow: 0 0 0 3px rgba(39, 113, 186, .2); }
.soga-panel input[type=checkbox] { width: 20px; height: 20px; vertical-align: middle; margin-right: 6px; }
.soga-panel form[style*="inline"] { display: inline-block !important; margin-left: 0 !important; }

/* Tablas: en móvil cada fila es una tarjeta */
.soga-panel table.widefat { width: 100%; max-width: 100% !important; border-collapse: collapse; margin: 0 0 10px; }
.soga-panel table.widefat th { text-align: left; font-size: .8em; text-transform: uppercase; letter-spacing: .06em; color: var(--soga-tinta-suave); padding: 6px 8px; }
.soga-panel table.widefat td { padding: 8px; vertical-align: middle; }
.soga-panel table.widefat tbody tr { background: #fff; border: 1px solid var(--soga-madera-borde); border-left: 5px solid var(--soga-cuerda); }
.soga-panel table.widefat td:first-child { font-size: 1.05em; }
@media (max-width: 700px) {
    .soga-panel table.widefat thead { display: none; }
    .soga-panel table.widefat tbody tr { display: block; border-radius: 8px; margin: 0 0 10px; padding: 8px 10px; box-shadow: var(--soga-sombra); }
    .soga-panel table.widefat td { display: block; padding: 3px 0; border: 0; white-space: normal !important; }
    .soga-panel table.widefat td:empty { display: none; }
    .soga-panel table.widefat td[data-label]::before { content: attr(data-label) ": "; font-weight: 700; font-size: .8em; text-transform: uppercase; letter-spacing: .04em; color: var(--soga-tinta-suave); }
}
.soga-nowrap { white-space: nowrap; display: inline-block; margin: 2px 0; }
@media (min-width: 701px) {
}
@media (min-width: 701px) {
    .soga-panel .form-table th, .soga-panel .form-table td { display: table-cell; padding: 10px 12px 10px 0; vertical-align: top; }
    .soga-panel .form-table th { width: 200px; margin: 0; }
}
/* Login del panel */
.soga-panel-login form { background: #fff; border: 1px solid var(--soga-madera-borde); border-top: 6px solid var(--soga-azul); border-radius: var(--soga-radio); padding: 20px; max-width: 420px; box-shadow: var(--soga-sombra); }
.soga-panel-login label { display: block; font-weight: 700; font-size: .9em; margin: 0 0 4px; }
.soga-panel-login input[type=text], .soga-panel-login input[type=password] { width: 100%; }
.soga-panel-login .login-remember label { font-weight: 400; }
.soga-panel-login input[type=submit] { background: var(--soga-azul); color: #fff; border: 0; border-radius: 8px; padding: 12px 22px; font-weight: 700; font-size: 1em; cursor: pointer; width: 100%; }
.soga-panel-login input[type=submit]:hover { background: var(--soga-azul-oscuro); }

/* ----------------------------------------------------------
   Pestañas (varias categorías) y título de torneo
   ---------------------------------------------------------- */
.soga-tabs { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 16px; padding-bottom: 4px; }
.soga-tab {
    flex: 0 0 auto; background: #fff; border: 2px solid var(--soga-madera-borde); border-radius: 999px;
    padding: 8px 16px; font-family: inherit; font-weight: 700; font-size: .95em; color: var(--soga-tinta); cursor: pointer;
}
.soga-tab-activa { background: var(--soga-azul); border-color: var(--soga-azul); color: #fff; }
.soga-tabs ~ .soga-torneo { display: none; }
.soga-tabs ~ .soga-torneo.soga-torneo-activo { display: block; }
.soga-torneo-titulo { font-size: 1.3em; font-weight: 800; margin: 0 0 12px; color: var(--soga-azul); }
.soga-torneo-titulo small { font-weight: 500; color: var(--soga-tinta-suave); font-size: .7em; }

/* ----------------------------------------------------------
   Sigue a tu equipo
   ---------------------------------------------------------- */
.soga-seguir { margin: 0 0 18px; }
.soga-seguir label { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.soga-seguir-etq { font-weight: 800; font-size: .85em; text-transform: uppercase; letter-spacing: .08em; color: var(--soga-cuerda-oscura); }
.soga-seguir-sel {
    flex: 1; min-width: 200px; padding: 10px 12px; font-size: 16px; font-family: inherit;
    border: 1px solid var(--soga-madera-borde); border-radius: 8px; background: #fff; color: var(--soga-tinta);
}
.soga-seguir-banner {
    margin-top: 10px; padding: 12px 16px; border-radius: 8px; font-weight: 700;
    background: var(--soga-azul-claro); border-left: 5px solid var(--soga-azul); color: var(--soga-azul-oscuro);
}
.soga-seguir-ya  { background: #FFF3E0; border-left-color: #EF6C00; color: #7A3E00; animation: soga-aparece .5s ease-out; }
.soga-seguir-oro { background: linear-gradient(135deg, var(--soga-azul), var(--soga-azul-oscuro)); border-left-color: var(--soga-cuerda); color: #fff; }
.soga-vs.soga-mio { border-color: #EF6C00; box-shadow: 0 0 0 4px rgba(239, 108, 0, .25), var(--soga-sombra); }
.soga-partido.soga-mio-cuadro { border-left-color: #EF6C00; }
.soga-partido.soga-mio-cuadro .soga-num { background: #EF6C00; color: #fff; }

/* Turno en "En juego ahora" */
.soga-vs-turno {
    position: absolute; top: 10px; right: 10px; font-size: .7em; font-weight: 800; text-transform: uppercase; letter-spacing: .06em;
    background: #EF6C00; color: #fff; padding: 3px 9px; border-radius: 999px;
}
.soga-vs-turno-2 { background: var(--soga-cuerda); }
.soga-vs-siguiente { border-width: 3px; }
.soga-podio-fin { font-size: .7em; font-weight: 800; text-transform: uppercase; letter-spacing: .14em; opacity: .8; margin-bottom: 6px; }

/* ----------------------------------------------------------
   Inscripción: categoría, contacto, privacidad, plazo
   ---------------------------------------------------------- */
.soga-form-insc select {
    width: 100%; padding: 12px 14px; font-size: 16px; font-family: inherit;
    border: 1px solid var(--soga-madera-borde); border-radius: 8px; background: var(--soga-madera); color: var(--soga-tinta);
}
.soga-plazo { background: var(--soga-azul-claro); border-left: 5px solid var(--soga-azul); padding: 10px 14px; border-radius: 8px; font-size: .95em; }
.soga-requisitos { font-weight: 700; color: var(--soga-cuerda-oscura); font-size: .95em; }
.soga-normas { background: var(--soga-madera); border-left: 5px solid var(--soga-cuerda); padding: 10px 14px; border-radius: 8px; font-size: .92em; white-space: pre-line; }
.soga-participante-fila { display: flex; gap: 8px; }
.soga-participante-fila input { flex: 1; min-width: 0; }
.soga-form-insc .soga-sexo { flex: 0 0 auto; width: auto; padding: 10px 8px; }
.soga-form-insc .soga-anio { flex: 0 0 96px; width: 96px; padding: 10px 8px; }
.soga-form-insc [hidden] { display: none !important; }
.soga-privacidad label { display: flex; gap: 10px; align-items: flex-start; font-size: .92em; line-height: 1.35; cursor: pointer; }
.soga-privacidad input { margin-top: 3px; flex: 0 0 auto; width: 18px; height: 18px; }
.soga-privacidad small { display: block; margin: 6px 0 0 28px; color: var(--soga-tinta-suave); }
.soga-privacidad a { color: var(--soga-azul); text-decoration: underline; }
.soga-inscritos h3 small { font-weight: 400; color: var(--soga-tinta-suave); font-size: .8em; }

/* ----------------------------------------------------------
   Palmarés
   ---------------------------------------------------------- */
.soga-edicion { margin: 0 0 22px; }
.soga-edicion-titulo {
    font-size: 1.1em; font-weight: 800; color: #fff; background: var(--soga-azul); display: inline-block;
    padding: 6px 16px; border-radius: 999px; margin: 0 0 12px;
}
.soga-palmares-fila {
    display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; background: #fff;
    border: 1px solid var(--soga-madera-borde); border-left: 5px solid var(--soga-cuerda); border-radius: 8px;
    padding: 12px 16px; margin: 0 0 8px; box-shadow: var(--soga-sombra);
}
.soga-palmares-cat { flex: 1 1 100%; font-weight: 800; font-size: .8em; text-transform: uppercase; letter-spacing: .08em; color: var(--soga-cuerda-oscura); }
.soga-palmares-puesto { font-weight: 600; }
.soga-palmares-oro { font-weight: 800; color: var(--soga-azul); font-size: 1.1em; }
@media (min-width: 560px) { .soga-palmares-cat { flex: 0 0 140px; } }

/* ----------------------------------------------------------
   Modo pantalla grande (proyector / TV): [soga_cuadro pantalla="1"]
   ---------------------------------------------------------- */
.soga-pantalla { font-size: 22px; }
.soga-pantalla .soga-directo { font-size: .7em; }
.soga-pantalla .soga-vs-eq { font-size: 1.6em; }
.soga-pantalla .soga-ahora-lista { grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); }
.soga-pantalla .soga-podio-campeon { font-size: 2em; }
.soga-pantalla .soga-seguir, .soga-pantalla .soga-desliza { display: none; }

/* ----------------------------------------------------------
   Impresión: cuadro limpio para colgar
   ---------------------------------------------------------- */
@media print {
    .soga-barra-gestion, .soga-directo, .soga-seguir, .soga-toast, .soga-desliza, .soga-vs-control,
    .soga-btn-corregir, .soga-gestion-pie, .soga-tabs, .soga-form-gana, .soga-form-corregir { display: none !important; }
    .soga-tabs ~ .soga-torneo { display: block !important; page-break-after: always; }
    .soga-cuadro { flex-direction: column; overflow: visible; }
    .soga-partido, .soga-vs, .soga-podio { box-shadow: none; break-inside: avoid; }
    .soga-podio { color: #000; background: none; border: 2px solid #000; }
}
