/* =====================================================================
   Ticopa Hub · rediseño «Marcador» (r17) · 3) Piezas
   a) piezas nuevas (prefijo mc-) para las pantallas nuevas;
   b) las piezas que ya existen (.card, botones, pestañas, tablas, ventanas, campos) con el estilo nuevo.
   Solo presentación: no cambia ninguna lógica ni permiso.
   ===================================================================== */

/* ---------- a) Piezas nuevas ---------- */
.mc-pantalla { display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr); }
.mc-pantalla > * { min-width: 0; }
.mc-d1, .mc-d2, .mc-d3 { font-family: var(--f-display); font-weight: 800; line-height: .95; letter-spacing: .005em; margin: 0; color: var(--texto); }
.mc-d1 { font-size: clamp(44px, 9vw, 84px); }
.mc-d2 { font-size: clamp(34px, 6vw, 52px); }
.mc-d3 { font-size: 28px; }
.mc-t-sec { font: 700 20px/1.2 var(--f-datos); display: flex; align-items: center; gap: 12px; margin: 0; color: var(--texto); }
.mc-t-sec .mc-mas { margin-left: auto; font: 600 15px var(--f-texto); color: var(--violeta-texto); min-height: 44px; display: inline-flex; align-items: center; }
@media (min-width: 1024px) { .mc-t-sec { font-size: 22px; } }
.mc-suave { color: var(--suave); margin: 0; }
.mc-tenue { color: var(--tenue); }
.mc-chico { font-size: 14px; }
.mc-vacio { color: var(--tenue); padding: 24px 0; text-align: center; font: 500 15px var(--f-datos); }
.mc-cabecera { position: relative; overflow: hidden; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 24px 16px; border-radius: var(--r-l); border: 1px solid var(--linea-fuerte); background: linear-gradient(120deg, #221c66 0%, #16134a 55%, #3a0f33 120%); }
.mc-cabecera::after { content: ""; position: absolute; right: -40px; top: 0; bottom: 0; width: 46%; background: linear-gradient(105deg, transparent 0 18%, rgba(255, 45, 85, .18) 18% 22%, transparent 22% 30%, rgba(139, 92, 246, .22) 30% 34%, transparent 34%); pointer-events: none; }
.mc-cabecera > * { position: relative; z-index: 1; }
.mc-cabecera p { margin-top: 8px; max-width: 60ch; }
@media (min-width: 1024px) { .mc-cabecera { padding: 32px; } }
.mc-migas { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font: 600 14px var(--f-datos); color: var(--tenue); }
.mc-migas a { color: var(--suave); min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }

.mc-btn { display: inline-flex !important; align-items: center; justify-content: center; gap: 8px; min-height: var(--toque); padding: 0 24px !important; border-radius: var(--r-m) !important; font: 700 16px var(--f-datos) !important; letter-spacing: .01em !important; text-transform: none !important; text-decoration: none !important; white-space: nowrap; border: 1px solid transparent !important; cursor: pointer; box-shadow: none !important; text-shadow: none !important; width: auto; }
.mc-btn-rojo { background: var(--rojo) !important; color: var(--tinta) !important; }
.mc-btn-rojo:hover { background: #ff4a6c !important; }
.mc-btn-violeta { background: var(--violeta-boton) !important; color: #fff !important; }
.mc-btn-violeta:hover { background: #7f53f5 !important; }
.mc-btn-linea { border-color: var(--linea-fuerte) !important; color: var(--texto) !important; background: transparent !important; }
.mc-btn-linea:hover { background: var(--sup-2) !important; }
.mc-btn-texto { padding: 0 12px !important; color: var(--violeta-texto) !important; background: transparent !important; }
.mc-btn-texto:hover { background: var(--sup-1) !important; }
.mc-btn-peq { padding: 0 14px !important; font-size: 14px !important; }
.mc-btn[disabled] { background: var(--sup-2) !important; color: var(--tenue) !important; border-color: var(--linea) !important; cursor: not-allowed; }
.mc-chip, .mc-chip:hover { box-shadow: none !important; }
.mc-fila-btn { display: flex; flex-wrap: wrap; gap: 8px; }

.mc-est { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 13px; font: 700 13px var(--f-datos); white-space: nowrap; border: 1px solid; color: var(--suave); border-color: var(--linea-fuerte); }
.mc-est::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.est-vivo, .mc-est-vivo { color: var(--rojo-texto); border-color: rgba(255, 45, 85, .5); background: rgba(255, 45, 85, .1); }
.est-ok, .mc-est-ok { color: var(--ok); border-color: rgba(32, 232, 155, .4); background: rgba(32, 232, 155, .08); }
.est-espera, .mc-est-espera { color: var(--espera); border-color: rgba(245, 197, 66, .4); background: rgba(245, 197, 66, .08); }
.est-info, .mc-est-info { color: var(--info); border-color: rgba(0, 212, 255, .4); background: rgba(0, 212, 255, .08); }
.est-neutro { color: var(--suave); border-color: var(--linea-fuerte); }
.mc-etq { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 4px; background: var(--sup-3); color: var(--suave); font: 600 12px var(--f-datos); }
.mc-etq-nuevo { background: var(--rojo); color: var(--tinta); }

.mc-tarjeta { background: var(--sup-1); border: 1px solid var(--linea); border-radius: var(--r-l); padding: 16px; color: var(--texto); }
.mc-tarjeta-enlace { display: flex; gap: 14px; align-items: center; text-decoration: none !important; color: inherit; }
.mc-tarjeta-enlace:hover { border-color: var(--linea-fuerte); background: #181646; }
.mc-rejilla { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .mc-rejilla.mc-c2, .mc-rejilla.mc-c3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .mc-rejilla.mc-c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.mc-pila { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
.mc-torneo img { width: 56px; height: 56px; object-fit: contain; border-radius: var(--r-m); background: var(--sup-2); flex: none; padding: 4px; }
.mc-torneo h3 { font: 700 18px/1.2 var(--f-datos); margin: 6px 0 2px; overflow-wrap: anywhere; }
.mc-torneo > div { min-width: 0; }

.mc-chips { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; min-width: 0; }
.mc-chip { flex: none !important; text-transform: none !important; letter-spacing: 0 !important; min-height: 40px; padding: 0 16px; display: inline-flex; align-items: center; gap: 6px; border-radius: 20px; border: 1px solid var(--linea-fuerte); color: var(--suave); background: transparent; font: 600 14px var(--f-datos); white-space: nowrap; cursor: pointer; }
.mc-chip[aria-pressed="true"] { background: var(--texto); color: var(--noche); border-color: var(--texto); }
.mc-chip b { opacity: .7; }
.mc-filtros { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; }
.mc-buscar { height: 44px; min-width: 0; flex: 1 1 240px; max-width: 360px; border-radius: var(--r-m); border: 1px solid var(--linea-fuerte); background: var(--noche); color: var(--texto); padding: 0 12px; font: 500 16px var(--f-texto); }
.mc-aviso { border: 1px solid rgba(245, 197, 66, .45); background: rgba(245, 197, 66, .08); color: #ffe39a; border-radius: var(--r-m); padding: 12px 14px; margin: 0; }

/* Mini marcador (listas de resultados) */
.mc-lista { padding: 4px 16px; display: grid; }
.mc-lista > * + * { border-top: 1px solid var(--linea); }
.mc-partido { padding: 6px 0; }
.mc-mini { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 8px; min-height: 56px; color: var(--texto); text-decoration: none !important; }
.mc-eq { display: flex; align-items: center; gap: 8px; font: 600 15px/1.15 var(--f-datos); min-width: 0; }
.mc-eq span { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.mc-eq.mc-v { justify-content: flex-end; text-align: right; }
.mc-escudo-p { width: 26px; height: 26px; object-fit: contain; flex: none; }
.mc-res { display: flex; align-items: stretch; font: 800 24px/1 var(--f-display); }
.mc-res b { display: grid; place-items: center; min-width: 32px; height: 36px; font-weight: 800; }
.mc-res b:first-of-type { border-radius: 6px 0 0 6px; clip-path: polygon(0 0, 100% 0, calc(100% - 6px) 100%, 0 100%); background: #3a2d86; }
.mc-res b:last-of-type { border-radius: 0 6px 6px 0; clip-path: polygon(6px 0, 100% 0, 100% 100%, 0 100%); background: #6a1a3d; margin-left: -2px; }
.mc-res.mc-hora b { min-width: 0; padding: 0 10px; background: var(--sup-3) !important; clip-path: none; border-radius: 6px; font-size: 20px; margin: 0; }
.mc-partido-pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; padding: 0 0 6px; }
.mc-dia { display: grid; gap: 10px; }
@media (max-width: 420px) { .mc-eq { font-size: 14px; } }

/* Ganchos de IA, El 11 y herramientas (tarjetas destacadas) */
.mc-ia { position: relative; overflow: hidden; border-radius: var(--r-l); padding: 24px; border: 1px solid var(--violeta); color: var(--texto);
  background: radial-gradient(120% 140% at 100% 0%, rgba(255, 45, 85, .22), transparent 55%), linear-gradient(160deg, #241d6b, #15123d 70%); }
.mc-ia::before { content: ""; position: absolute; inset: 0; opacity: .16; background-image: linear-gradient(var(--violeta) 1px, transparent 1px), linear-gradient(90deg, var(--violeta) 1px, transparent 1px); background-size: 28px 28px; -webkit-mask-image: linear-gradient(200deg, #000, transparent 60%); mask-image: linear-gradient(200deg, #000, transparent 60%); pointer-events: none; }
.mc-ia > * { position: relative; }
.mc-ia h3 { font: 800 30px/1 var(--f-display); margin: 8px 0; }
.mc-ia p { color: var(--suave); max-width: 52ch; margin: 0 0 12px; }

/* ---------- b) Piezas que ya existen ---------- */
.card, .glass-panel, .ticopa-modal-box, .modal-content {
  background: var(--sup-1) !important;
  border: 1px solid var(--linea) !important;
  border-radius: var(--r-l) !important;
  box-shadow: none !important;
  color: var(--texto);
}
.navbar.glass-panel { border-radius: 0 !important; }
.card:hover { box-shadow: none !important; }
.neon-text { text-shadow: none !important; color: var(--texto) !important; font-family: var(--f-display) !important; }

/* Botones: rojo (acción principal), violeta, línea */
.hero-btn, .btn-primary {
  min-height: var(--toque); border-radius: var(--r-m) !important; border: 1px solid transparent !important;
  font: 700 15px var(--f-datos) !important; letter-spacing: .02em !important; box-shadow: none !important; text-shadow: none !important;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer;
}
.hero-btn:not([style*="background"]), .btn-primary:not([style*="background"]) { background: var(--rojo) !important; color: var(--tinta) !important; }
.hero-btn:hover, .btn-primary:hover { filter: brightness(1.08); transform: none !important; }
.hero-btn[style*="var(--gold)"], .btn-primary[style*="var(--gold)"], .hero-btn[style*="var(--primary)"], .btn-primary[style*="var(--primary)"] { background: var(--rojo) !important; color: var(--tinta) !important; }
.hero-btn[style*="var(--secondary)"] { background: var(--violeta-boton) !important; color: #fff !important; }
.btn-secondary {
  min-height: 40px; border-radius: var(--r-m) !important; background: transparent !important; color: var(--texto) !important;
  border: 1px solid var(--linea-fuerte) !important; font: 700 14px var(--f-datos) !important; letter-spacing: .01em !important; box-shadow: none !important;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer;
}
.btn-secondary:hover { background: var(--sup-2) !important; color: var(--texto) !important; }
.btn-danger { border-radius: var(--r-m) !important; background: rgba(255, 107, 107, .12) !important; color: var(--error) !important; border: 1px solid rgba(255, 107, 107, .45) !important; font: 700 14px var(--f-datos) !important; min-height: 40px; }
button[disabled].hero-btn, button[disabled].btn-primary, button[disabled].btn-secondary { background: var(--sup-2) !important; color: var(--tenue) !important; border-color: var(--linea) !important; cursor: not-allowed; }

/* Pestañas: subrayado rojo */
.nav-tabs, .liga-tabs-wrap, .club-nav-full { background: transparent !important; border-bottom: 1px solid var(--linea) !important; }
.tab-btn {
  background: transparent !important; border: 0 !important; border-bottom: 3px solid transparent !important; border-radius: 0 !important;
  color: var(--suave) !important; font: 600 15px var(--f-datos) !important; letter-spacing: .01em !important; text-transform: none !important;
  min-height: var(--toque); padding: 0 12px !important; box-shadow: none !important;
}
.tab-btn:hover { color: var(--texto) !important; background: transparent !important; }
.tab-btn.activo, .tab-btn.active { color: var(--texto) !important; border-bottom-color: var(--rojo) !important; background: transparent !important; }
.filtro-btn {
  min-height: 40px; border-radius: 20px !important; border: 1px solid var(--linea-fuerte) !important; background: transparent !important;
  color: var(--suave) !important; font: 600 14px var(--f-datos) !important; padding: 0 16px !important; text-transform: none !important; letter-spacing: 0 !important;
}
.filtro-btn.activo, .filtro-btn.active { background: var(--texto) !important; color: var(--noche) !important; border-color: var(--texto) !important; }

/* Campos */
.search-input, .filtro-select, input[type="text"], input[type="number"], input[type="email"], input[type="tel"], input[type="password"], input[type="date"], input[type="time"], select, textarea {
  border-radius: var(--r-m) !important; border: 1px solid var(--linea-fuerte) !important; background-color: var(--noche) !important; color: var(--texto) !important;
  font-family: var(--f-texto) !important;
}
.search-input:focus, select:focus, textarea:focus, input:focus { border-color: var(--violeta) !important; box-shadow: 0 0 0 3px rgba(139, 92, 246, .25) !important; outline: none; }
label { font-family: var(--f-datos); }

/* Tablas */
.table-responsive { border-radius: var(--r-l); }
.pro-table, table.tabla-posiciones, .table-responsive > table { border-collapse: collapse; font: 500 15px var(--f-datos); font-variant-numeric: tabular-nums; }
.pro-table th, .table-responsive > table th { background: transparent !important; color: var(--tenue) !important; font: 600 13px var(--f-datos) !important; letter-spacing: .02em !important; text-transform: none !important; border-bottom: 1px solid var(--linea) !important; }
.pro-table td, .table-responsive > table td { border-bottom: 1px solid rgba(47, 43, 112, .6) !important; }
.pro-table tbody tr:hover, .table-responsive > table tbody tr:hover { background: rgba(139, 92, 246, .08) !important; }

/* Ventanas */
.ticopa-modal-overlay, .modal { background: rgba(7, 6, 26, .78) !important; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.ticopa-modal-box h3, .modal-content h2 { font-family: var(--f-display) !important; font-weight: 800 !important; font-size: 28px !important; letter-spacing: .01em !important; color: var(--texto) !important; text-shadow: none !important; }
.close-modal { min-width: 44px; min-height: 44px; display: inline-grid; place-items: center; color: var(--suave) !important; }

/* Cargando */
.loader-ring { border-color: var(--sup-3) !important; border-top-color: var(--rojo) !important; }
.loader-text { font-family: var(--f-datos) !important; color: var(--suave) !important; letter-spacing: .04em; }
.ticopa-global-loader { background: var(--noche) !important; }
.ticopa-loader-dots i { background: var(--rojo) !important; }

/* Avisos (toast) */
.ticopa-toast, #ticopa-error-suave { border-radius: var(--r-m) !important; background: var(--sup-2) !important; border-color: var(--linea-fuerte) !important; color: var(--texto) !important; }

/* Títulos pintados en el código con colores neón: pasan a texto del sistema */
#tabla-contenedor h1, #tabla-contenedor h2 { letter-spacing: .01em; }
[style*="color:var(--gold)"], [style*="color: var(--gold)"] { color: var(--espera); }
[style*="font-family:'Orbitron'"], [style*="font-family: 'Orbitron'"], [style*="font-family:Orbitron"] { letter-spacing: .02em !important; }

/* Futuro: lugar reservado (membresía de varios niveles); clases listas, sin usar hoy */
.futuro { position: relative; border: 2px dashed var(--linea-fuerte) !important; background: repeating-linear-gradient(135deg, rgba(139, 92, 246, .05) 0 10px, transparent 10px 20px) !important; }
.futuro-tag { position: absolute; top: -12px; right: 12px; background: var(--noche); border: 1px solid var(--linea-fuerte); color: var(--suave); font: 700 12px var(--f-datos); padding: 2px 8px; border-radius: 4px; }
.nivel { display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 8px; border-radius: 4px; font: 800 12px var(--f-datos); letter-spacing: .04em; }
.nivel-1 { color: var(--violeta-texto); border: 1px solid var(--violeta); }
.nivel-2 { background: var(--violeta-boton); color: #fff; }
.nivel-3 { background: linear-gradient(100deg, var(--violeta-boton) 0 55%, var(--rojo) 55%); color: #fff; }
.bloqueo-suave { position: relative; overflow: hidden; border-radius: var(--r-m); }
.bloqueo-suave > .detras { filter: blur(5px); opacity: .55; pointer-events: none; }
.bloqueo-suave > .encima { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 8px; text-align: center; padding: 16px; background: rgba(11, 10, 36, .55); }
/* Las hojas viejas pintan todos los botones: las piezas nuevas mandan */
.mc-chip { border: 1px solid var(--linea-fuerte) !important; color: var(--suave) !important; background: transparent !important; border-radius: 20px !important; font: 600 14px var(--f-datos) !important; min-height: 40px !important; padding: 0 16px !important; }
.mc-chip[aria-pressed="true"] { background: var(--texto) !important; color: var(--noche) !important; border-color: var(--texto) !important; }

/* Colores «semánticos» de los botones (el Hub los pone solo, según el texto del botón).
   Antes: verde, amarillo y celeste con brillo. Ahora: acción positiva en violeta, borrar/rechazar en rojo de error,
   el resto con línea. Los colores de estado (ok, espera, info) quedan solo para insignias. */
html body :is(.ticopa-action-success, .semantic-accept, .semantic-save, .semantic-add, .semantic-generate, .semantic-verify, .semantic-login, .semantic-import):not(.tab-btn):not(.filtro-btn):not(.mc-btn) {
  background: var(--violeta-boton) !important; border-color: var(--violeta-boton) !important; color: #fff !important; box-shadow: none !important; text-shadow: none !important;
}
html body :is(.ticopa-action-danger, .btn-danger, .semantic-delete, .semantic-remove, .semantic-reject, .semantic-cancel, .semantic-logout, .semantic-low):not(.tab-btn):not(.filtro-btn):not(.mc-btn) {
  background: rgba(255, 107, 107, .10) !important; border-color: rgba(255, 107, 107, .55) !important; color: var(--error) !important; box-shadow: none !important;
}
html body :is(.ticopa-action-warning, .semantic-edit, .semantic-pending, .semantic-export, .semantic-calendar, .semantic-warning, .ticopa-action-info, .semantic-view, .semantic-search, .semantic-filter, .semantic-refresh, .semantic-info):not(.tab-btn):not(.filtro-btn):not(.mc-btn) {
  background: transparent !important; border-color: var(--linea-fuerte) !important; color: var(--texto) !important; box-shadow: none !important;
}
html body :is(.ticopa-action-warning, .semantic-edit, .semantic-pending, .semantic-export, .semantic-calendar, .semantic-warning, .ticopa-action-info, .semantic-view, .semantic-search, .semantic-filter, .semantic-refresh, .semantic-info):not(.tab-btn):not(.filtro-btn):not(.mc-btn):hover { background: var(--sup-2) !important; }
html body .hero-btn.ticopa-action:not([class*="semantic-"]):not([class*="ticopa-action-"]) { background: var(--rojo) !important; color: var(--tinta) !important; }
html body .hero-btn.ticopa-action-neutral, html body .ticopa-action-neutral:not(.tab-btn):not(.filtro-btn):not(.mc-btn) { box-shadow: none !important; }
html body .hero-btn.ticopa-action-neutral { background: var(--rojo) !important; color: var(--tinta) !important; border-color: var(--rojo) !important; }
.ticopa-ui-icon { color: inherit; }
/* Pestañas y filtros: nunca con los colores semánticos */
html body .tab-btn[class*="ticopa-action-"], html body .tab-btn[class*="semantic-"] { background: transparent !important; color: var(--suave) !important; box-shadow: none !important; }
html body .tab-btn.activo[class*="ticopa-action-"], html body .tab-btn.activo[class*="semantic-"] { color: var(--texto) !important; }
html body .filtro-btn[class*="ticopa-action-"]:not(.activo):not(.active), html body .filtro-btn[class*="semantic-"]:not(.activo):not(.active) { background: transparent !important; color: var(--suave) !important; border-color: var(--linea-fuerte) !important; box-shadow: none !important; }
/* Insignias de estado del Hub */
:is(.status-success, .estado-aprobado) { color: var(--ok) !important; }
/* Inicio: marca de WO bajo el marcador de un resultado por no presentación (el resultado sigue siendo el 1-0 / 3-0 del reglamento). No mueve el marcador: así quedan alineados con los demás. */
.mc-res { position: relative; }
.mc-res .mc-wo { position: absolute; left: 50%; bottom: -9px; transform: translateX(-50%); padding: 2px 5px; border-radius: 4px; font: 800 10px/1 var(--f-display); font-style: normal; letter-spacing: .06em; color: #ffcf5a; background: var(--sup-1, #14113a); border: 1px solid currentColor; white-space: nowrap; }

/* r17 fix4: nombre de la liga o torneo en cada resultado del Inicio (fila de arriba, chica) */
.mc-mini > .mc-mini-liga { grid-column: 1 / -1; justify-self: center; margin-top: 6px; font: 700 11px/1.2 var(--f-datos); letter-spacing: .05em; text-transform: uppercase; color: var(--tenue, #9792c8); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mc-sin-proximo { margin: 0; padding: 12px 0; }