/* ============================================================
   SQUADFLOW · EFECTOS + COMPONENTES (Neon Indigo, dark-only)
   Cargar DESPUÉS de squadflow-theme.css.
   Reusa las clases que YA existen en el codebase (.sk-*, .lp-*,
   .btn-*, .card…). Las clases marcadas NUEVA requieren markup nuevo
   (ver MIGRATION.md §3).
   ============================================================ */

/* ---------- NEON GLOW SYSTEM ---------- */
@keyframes sf-pulse{0%,100%{box-shadow:0 0 0 1px rgba(184,87,255,.30),0 0 18px rgba(184,87,255,.22)}50%{box-shadow:0 0 0 1px rgba(184,87,255,.60),0 0 36px rgba(184,87,255,.45)}}
@keyframes sf-spin{to{transform:rotate(1turn)}}
.sf-pulse{animation:sf-pulse 3.4s ease-in-out infinite}
/* Borde cónico animado: envolver el elemento en <div class="sf-conic"><div>…</div></div> */
.sf-conic{position:relative;border-radius:var(--sk-radius-lg);padding:1.5px;overflow:hidden}
.sf-conic::before{content:'';position:absolute;inset:-50%;background:conic-gradient(from 0deg,transparent 0 70%,var(--sk-neon) 85%,transparent 100%);animation:sf-spin 4s linear infinite}
.sf-conic>*{position:relative;border-radius:calc(var(--sk-radius-lg) - 1.5px);background:var(--sk-surface)}

/* ---------- HERO BLOOMS / ORBITS (fondos de login, landing, cabeceras) ---------- */
.sf-hero{background:linear-gradient(135deg,var(--sk-grad-from) 0%,var(--sk-grad-to) 100%);position:relative;overflow:hidden}
.sf-hero--bloom::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 80% at 80% 10%,rgba(184,87,255,.25),transparent 60%),radial-gradient(50% 70% at 10% 90%,rgba(108,140,255,.15),transparent 60%)}
.sf-orbit{position:absolute;border:1px solid rgba(184,87,255,.18);border-radius:50%;pointer-events:none}

/* ---------- HOVER / PRESS GLOBALES ---------- */
.btn{transition:all var(--sk-dur-fast) var(--sk-ease)}
.btn:active{transform:scale(.97)}
.btn-primary{box-shadow:var(--sk-glow-sm)}
.btn-primary:hover{box-shadow:var(--sk-glow)}
.btn-outline-primary{--bs-btn-color:var(--sk-neon);--bs-btn-border-color:var(--sk-border-strong);--bs-btn-hover-bg:rgba(184,87,255,.10);--bs-btn-hover-border-color:var(--sk-neon);--bs-btn-hover-color:var(--sk-neon)}
.btn-soft{background:rgba(184,87,255,.12);color:var(--sk-accent-soft)}
.btn-soft:hover{background:rgba(184,87,255,.20);color:var(--sk-accent-soft)}
/* Botón neón (CTA principal) — NUEVA clase opcional */
.btn-neon{background:var(--sk-neon);border:1px solid var(--sk-neon);color:#fff;box-shadow:var(--sk-glow)}
.btn-neon:hover{color:#fff;box-shadow:var(--sk-glow-strong);transform:translateY(-1px)}

/* ---------- CARD (Dason .card) ---------- */
.card{box-shadow:var(--sk-shadow-card) !important;transition:border-color var(--sk-dur-fast) var(--sk-ease)}
.card:hover{border-color:var(--sk-border-strong) !important}
.player-card:hover{box-shadow:var(--sk-glow) !important;border-color:var(--sk-neon) !important;transform:translateY(-2px)}

/* ---------- SECTION HEAD (.sk-sec-head existente) ---------- */
.sk-sec-chip{background:rgba(184,87,255,.12);color:var(--sk-neon)}

/* ---------- BADGES (.sk-badge existentes) ---------- */
.sk-badge--ok{background:var(--sk-ok-bg);color:var(--sk-ok-text)}
.sk-badge--pending{background:var(--sk-pending-bg);color:var(--sk-pending-text)}
.sk-badge--danger{background:var(--sk-danger-bg);color:var(--sk-danger-text)}
.sk-badge--info{background:var(--sk-info-bg);color:var(--sk-info)}
.badge-pts{background:var(--sk-surface-3) !important;color:#fff}

/* ---------- KPI (.sk-kpi existentes) ---------- */
.sk-kpi--ok .sk-kpi__value{color:#fff}
.sk-kpi--pending .sk-kpi__value{color:#fff}
.sk-kpi--plain .sk-kpi__label{color:var(--sk-neon)}

/* ---------- PROGRESS (.sk-progress existente) ---------- */
.sk-progress{background:var(--sk-surface-3)}
.sk-progress__bar{box-shadow:0 0 8px rgba(45,212,167,.5)}

/* ---------- AVATAR (.sk-avatar existente) ---------- */
.sk-avatar{background:var(--sk-surface-3);color:var(--sk-accent-soft);border:1px solid var(--sk-border)}

/* ---------- MATCH CARD (.sk-match existente) ---------- */
.sk-match{background:linear-gradient(135deg,var(--sk-grad-from) 0%,var(--sk-grad-to) 100%);border:1px solid var(--sk-border)}
.sk-match--live{animation:sf-pulse 3.4s ease-in-out infinite}
.sk-match__meta{color:var(--sk-accent-100)}
.sk-match__vs{color:var(--sk-accent-soft)}

/* ---------- TEAM CREST (.sk-crest existente) ---------- */
.sk-crest{background:var(--sk-surface-2);border:2px solid var(--sk-accent);box-shadow:var(--sk-glow-sm)}
.sk-crest--empty{background:transparent;border:2px dashed var(--sk-accent);color:var(--sk-accent-soft);box-shadow:none}

/* ---------- LAUNCHPAD CARD (.lp-card existente) ---------- */
.lp-card{background:var(--sk-surface);border-color:var(--sk-border)}
.lp-card:hover{border-color:var(--sk-neon);color:var(--sk-text);box-shadow:var(--sk-glow);transform:translateY(-3px)}
.lp-card-icon{background:rgba(184,87,255,.12);color:var(--sk-neon)}
.lp-card-module{color:var(--sk-text-muted)}
.lp-section-title{color:var(--sk-text-muted)}

/* ---------- TABS (Bootstrap .nav-pills y .pub-tabs existentes) ---------- */
.nav-pills .nav-link,.pub-tabs .nav-link{color:var(--sk-text-muted);border-radius:999px;font-weight:600;transition:all var(--sk-dur-fast) var(--sk-ease)}
.nav-pills .nav-link.active,.pub-tabs .nav-link.active{background:var(--sk-primary);color:#fff;box-shadow:var(--sk-glow-sm)}
.nav-tabs{border-color:var(--sk-border)}
.nav-tabs .nav-link{color:var(--sk-text-muted)}
.nav-tabs .nav-link.active{background:transparent;color:var(--sk-neon);border-color:var(--sk-border) var(--sk-border) transparent}

/* ---------- TOAST (Bootstrap .toast) ---------- */
.toast{background:var(--sk-surface-2);border:1px solid var(--sk-border);border-left:3px solid var(--sk-ok);border-radius:var(--sk-radius);color:var(--sk-text);box-shadow:var(--sk-shadow-float)}
.toast--danger{border-left-color:var(--sk-danger)}
.toast--info{border-left-color:var(--sk-info)}
.toast--pending{border-left-color:var(--sk-pending)}
.toast-header{background:transparent;color:var(--sk-text);border-color:var(--sk-border)}

/* ---------- STAT BOX — NUEVA (no existe clase en el codebase) ---------- */
.sk-statbox{background:var(--sk-surface-2);border-radius:var(--sk-radius-lg);padding:18px;text-align:center}
.sk-statbox__value{font-size:2rem;font-weight:800;color:#fff;line-height:1}
.sk-statbox__label{font-size:.78rem;color:var(--sk-text-muted);text-transform:uppercase;font-weight:600;margin-top:6px;letter-spacing:.03em}
/* publico.css .stat-num queda cubierto: */
.stat-num{color:#fff !important}

/* ---------- SCORE PILL — NUEVA ---------- */
.sk-scorepill{display:inline-flex;align-items:center;gap:8px;background:var(--sk-surface-3);color:#fff;border-radius:8px;padding:2px 12px;font-weight:800;font-size:15px}
.sk-scorepill .sep{opacity:.6;font-weight:500}
.sk-scorepill--live{background:var(--sk-danger);box-shadow:0 0 14px rgba(255,93,122,.45)}

/* ---------- PLAYER CHIP (tablero táctico) — NUEVA ---------- */
.sk-playerchip{display:flex;flex-direction:column;align-items:center;gap:3px;width:58px}
.sk-playerchip__dot{width:38px;height:38px;border-radius:50%;background:var(--sk-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;border:2px solid #fff;box-shadow:var(--sk-glow-sm);box-sizing:border-box}
.sk-playerchip__name{font-size:.66rem;color:#fff;text-align:center;max-width:62px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sk-playerchip--bench .sk-playerchip__dot{background:var(--sk-surface-3);box-shadow:none}
.sk-playerchip--bench .sk-playerchip__name{color:var(--sk-text-muted)}