/* ══════════════════════════════════════
   PANEL ADMIN — Paraná Campaña
   CSS Completo — todas las variables incluidas
   ══════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Inter:wght@400;500;600;700&display=swap');

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:15px; }
body { font-family:'Inter',Arial,sans-serif; background:#F0F2F8; color:#111; -webkit-font-smoothing:antialiased; min-height:100vh; }

/* ─── VARIABLES COMPLETAS ─── */
:root {
  /* Paleta principal */
  --azul:         #0060D0;
  --azul-d:       #0048A8;
  --cel:          #00AAFF;
  --verde:        #16A34A;
  --verde-d:      #15803D;
  --verde-oscuro: #0C2A18;
  --rojo:         #DC2626;
  --dorado:       #D97706;
  --negro:        #0A1628;
  --blanco:       #FFFFFF;
  --gris-100:     #F8FAFF;
  --gris-200:     #E2E8F4;
  --gris-400:     #94A3B8;
  --gris-600:     #475569;

  /* Tipografía */
  --font-display: 'Barlow Condensed','Arial Narrow',sans-serif;
  --font-body:    'Inter',Arial,sans-serif;

  /* Espaciado */
  --sp-1:.25rem; --sp-2:.5rem;  --sp-3:.75rem; --sp-4:1rem;
  --sp-5:1.25rem;--sp-6:1.5rem; --sp-8:2rem;   --sp-10:2.5rem;

  /* Bordes */
  --r-sm:4px; --r-md:8px; --r-lg:12px; --r-xl:16px; --r-2xl:20px; --r-full:9999px;

  /* Sombras */
  --sombra-sm:  0 1px 4px rgba(0,0,0,.08);
  --sombra-md:  0 4px 16px rgba(0,0,0,.12);
  --sombra-lg:  0 8px 32px rgba(0,0,0,.18);

  /* Admin layout */
  --sidebar-bg:  #0A1628;
  --sidebar-w:   240px;
  --topbar-h:    58px;
  --borde:       #E2E8F4;
  --card:        #FFFFFF;
}

/* ─── LAYOUT ─── */
.admin-layout  { display:flex; min-height:100vh; }
.admin-main    { flex:1; margin-left:var(--sidebar-w); display:flex; flex-direction:column; min-height:100vh; transition:.25s; }
.admin-content { padding:1.5rem; flex:1; }

/* ─── SIDEBAR ─── */
.sidebar {
  position:fixed; top:0; left:0; width:var(--sidebar-w); height:100vh;
  background:var(--sidebar-bg); color:#fff;
  display:flex; flex-direction:column; z-index:200;
  overflow-y:auto; overflow-x:hidden; transition:.25s;
  box-shadow:2px 0 12px rgba(0,0,0,.2);
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.15) transparent;
}
.sidebar::-webkit-scrollbar { width:4px; }
.sidebar::-webkit-scrollbar-thumb { background:rgba(255,255,255,.15); border-radius:4px; }
.sidebar-logo {
  padding:1.2rem 1.25rem 1rem;
  font-family:var(--font-display);
  font-size:1.3rem; font-weight:900; letter-spacing:-.02em;
  color:#fff; border-bottom:1px solid rgba(255,255,255,.08);
  flex-shrink:0; display:flex; align-items:center; gap:.5rem;
}
.sidebar-logo span { color:var(--cel); }
.sidebar-nav { flex:1; padding:.5rem 0 1rem; overflow-y:auto; overflow-x:hidden; }
.sidebar-nav a {
  display:flex; align-items:center; gap:.55rem;
  padding:.5rem 1.25rem; font-size:.82rem; font-weight:500;
  color:rgba(255,255,255,.55); text-decoration:none;
  transition:.12s; border-left:3px solid transparent;
}
.sidebar-nav a:hover { color:#fff; background:rgba(255,255,255,.06); }
.sidebar-nav a.activo { color:#fff; background:rgba(0,170,255,.12); border-left-color:var(--cel); }
.grupo-titulo {
  font-size:.65rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.2); padding:.85rem 1.25rem .3rem;
}
.sidebar-user {
  padding:1rem 1.25rem; border-top:1px solid rgba(255,255,255,.08);
  font-size:.82rem; color:#fff; flex-shrink:0;
  position:sticky; bottom:0; background:var(--sidebar-bg);
}
.sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:199; }

/* ─── TOPBAR ─── */
.admin-topbar {
  position:sticky; top:0; z-index:100;
  background:#fff; border-bottom:1px solid var(--borde);
  height:var(--topbar-h); display:flex; align-items:center;
  justify-content:space-between; padding:0 1.5rem;
  box-shadow:0 1px 6px rgba(0,0,0,.06);
}
.admin-topbar h1 { font-size:1.1rem; font-weight:700; color:#111; }

/* ─── BOTONES ─── */
.btn {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.5rem 1rem; border-radius:var(--r-md);
  font-size:.82rem; font-weight:600; cursor:pointer;
  border:none; text-decoration:none; transition:.15s; line-height:1;
  font-family:var(--font-body); white-space:nowrap;
}
.btn-verde   { background:var(--verde);   color:#fff; }
.btn-verde:hover  { background:var(--verde-d); }
.btn-azul    { background:var(--azul);    color:#fff; }
.btn-azul:hover   { background:var(--azul-d); }
.btn-cel     { background:var(--cel);     color:#fff; }
.btn-cel:hover    { background:#0090DD; }
.btn-rojo    { background:var(--rojo);    color:#fff; }
.btn-rojo:hover   { background:#B91C1C; }
.btn-dorado  { background:var(--dorado);  color:#fff; }
.btn-dorado:hover { background:#B45309; }
.btn-outline { background:transparent; color:#374151; border:1.5px solid var(--borde); }
.btn-outline:hover{ background:#F8FAFF; border-color:#CBD5E1; }
.btn-danger  { background:#FEF2F2; color:var(--rojo); border:1px solid #FECACA; }
.btn-danger:hover { background:#FEE2E2; }
.btn-sm   { padding:.35rem .7rem; font-size:.76rem; }
.btn-xs   { padding:.2rem  .5rem; font-size:.7rem; }
.btn-bloque { display:flex; align-items:center; justify-content:center; width:100%; padding:.65rem 1rem; }

/* ─── STATS ─── */
.stats-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:1rem; margin-bottom:2rem;
}
.stat-card {
  background:var(--card); border:1px solid var(--borde); border-radius:var(--r-xl);
  padding:1.1rem 1.2rem; box-shadow:var(--sombra-sm);
  transition:.15s;
}
.stat-card:hover { box-shadow:var(--sombra-md); transform:translateY(-1px); }
.stat-numero { font-size:2rem; font-weight:800; color:var(--azul); line-height:1; margin-bottom:.3rem; font-family:var(--font-display); }
.stat-label  { font-size:.78rem; font-weight:600; color:var(--gris-400); }

/* ─── CARDS ─── */
.card {
  background:var(--card); border:1px solid var(--borde); border-radius:var(--r-xl);
  padding:1.25rem; box-shadow:var(--sombra-sm); margin-bottom:1.25rem;
}
.card-titulo {
  font-size:.95rem; font-weight:700; color:#111;
  margin-bottom:1rem; display:flex; align-items:center;
  justify-content:space-between; gap:.75rem;
  font-family:var(--font-display);
}
.card-titulo a { font-family:var(--font-body); font-size:.75rem; font-weight:600; color:var(--azul); text-decoration:none; }

/* ─── TABLAS ─── */
.tabla-admin { width:100%; border-collapse:collapse; font-size:.82rem; }
.tabla-admin th {
  font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gris-400); border-bottom:2px solid var(--borde);
  padding:.55rem .75rem; text-align:left; background:#F8FAFF;
  white-space:nowrap;
}
.tabla-admin td {
  padding:.65rem .75rem; border-bottom:1px solid #F1F5FB;
  vertical-align:middle; color:#111;
}
.tabla-admin tr:last-child td { border:none; }
.tabla-admin tr:hover td { background:#FAFBFF; }
.tabla-admin a { color:var(--azul); text-decoration:none; font-weight:500; }
.tabla-admin a:hover { text-decoration:underline; }

/* ─── FORMULARIOS ─── */
.form-group   { margin-bottom:1.1rem; }
.form-label   { display:block; font-size:.8rem; font-weight:600; color:#374151; margin-bottom:.35rem; }
.form-control {
  width:100%; padding:.55rem .9rem; border:1.5px solid #CBD5E1; border-radius:var(--r-md);
  font-size:.85rem; font-family:var(--font-body); color:#111; background:#fff; transition:.15s;
}
.form-control:focus { outline:none; border-color:var(--cel); box-shadow:0 0 0 3px rgba(0,170,255,.1); }
.form-control:disabled { background:#F8FAFF; color:var(--gris-400); }
textarea.form-control { resize:vertical; min-height:100px; }
select.form-control   { cursor:pointer; }
.form-hint  { font-size:.73rem; color:var(--gris-400); margin-top:.3rem; }
.form-row   { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1rem; }
.form-check { display:flex; align-items:center; gap:.5rem; cursor:pointer; font-size:.83rem; }
.form-check input { width:16px; height:16px; cursor:pointer; accent-color:var(--cel); }
/* compatibilidad: input y select sin clase .form-control también */
.form-group input:not([type=checkbox]):not([type=radio]):not([type=file]),
.form-group select,
.form-group textarea {
  width:100%; padding:.55rem .9rem; border:1.5px solid #CBD5E1; border-radius:var(--r-md);
  font-size:.85rem; font-family:var(--font-body); color:#111; background:#fff; transition:.15s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline:none; border-color:var(--cel); box-shadow:0 0 0 3px rgba(0,170,255,.1);
}
.form-group label { display:block; font-size:.8rem; font-weight:600; color:#374151; margin-bottom:.35rem; }

/* ─── ALERTAS ─── */
.alerta { padding:.75rem 1rem; border-radius:var(--r-md); font-size:.85rem; font-weight:600; margin-bottom:1.25rem; display:flex; align-items:center; gap:.5rem; }
.alerta-exito { background:#DCFCE7; color:#15803D; border:1px solid #BBF7D0; }
.alerta-error { background:#FEE2E2; color:#B91C1C; border:1px solid #FECACA; }
.alerta-info  { background:#DBEAFE; color:#1D4ED8; border:1px solid #BFDBFE; }
.alerta-warn  { background:#FEF9C3; color:#854D0E; border:1px solid #FEF08A; }

/* ─── BADGES ─── */
.badge {
  display:inline-flex; align-items:center; padding:.2rem .6rem;
  border-radius:var(--r-sm); font-size:.7rem; font-weight:700; letter-spacing:.04em;
  text-transform:uppercase; white-space:nowrap;
}
.badge-verde  { background:#DCFCE7; color:#15803D; }
.badge-rojo   { background:#FEE2E2; color:#B91C1C; }
.badge-azul   { background:#DBEAFE; color:#1D4ED8; }
.badge-dorado { background:#FEF9C3; color:#854D0E; }
.badge-gris   { background:#F1F5F9; color:#475569; }
.badge-vivo, .badge-en_vivo { background:var(--rojo); color:#fff; animation:pulse-b 1.3s infinite; }
@keyframes pulse-b { 0%,100%{opacity:1}50%{opacity:.65} }
.badge-premium    { background:#FEF9C3; color:#854D0E; }
.badge-radio-vivo { background:var(--rojo); color:#fff; padding:.1rem .5rem; border-radius:var(--r-full); font-size:.67rem; font-weight:800; vertical-align:middle; }

/* ─── ESTADO CHIPS (partidos) ─── */
.estado-chip {
  display:inline-flex; align-items:center; gap:.3rem;
  padding:.25rem .65rem; border-radius:var(--r-full);
  font-size:.7rem; font-weight:700; letter-spacing:.05em;
}
.estado-programado  { background:#F1F5F9; color:#475569; }
.estado-en_curso    { background:#FEE2E2; color:#B91C1C; animation:pulse-b 1.3s infinite; }
.estado-finalizado  { background:#DCFCE7; color:#15803D; }
.estado-suspendido, .estado-postergado { background:#FEF9C3; color:#854D0E; }

/* ─── STREAM CARD ADMIN ─── */
.stream-card { background:var(--negro); border-radius:var(--r-xl); overflow:hidden; border:1px solid rgba(255,255,255,.08); transition:.15s; }
.stream-card:hover { border-color:rgba(0,170,255,.35); box-shadow:0 4px 20px rgba(0,0,0,.35); }
.stream-card-thumb { position:relative; overflow:hidden; background:#111; display:flex; align-items:center; justify-content:center; }
.stream-card-body  { padding:.9rem 1rem; }
.stream-card-titulo{ font-weight:700; font-size:.95rem; color:#fff; line-height:1.3; margin-bottom:.25rem; }
.stream-card-meta  { font-size:.75rem; color:rgba(255,255,255,.4); }

/* ─── BADGE-ESTADO (stream/transmision) ─── */
.badge-estado {
  display:inline-flex; align-items:center; gap:.3rem;
  padding:.2rem .65rem; border-radius:var(--r-full);
  font-size:.7rem; font-weight:800; letter-spacing:.06em;
}
.badge-proximo     { background:rgba(255,255,255,.12); color:rgba(255,255,255,.7); }

/* ─── VIVO MARCADOR ─── */
.vivo-marcador { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:1rem; text-align:center; padding:1.5rem 0; }
.vivo-equipo   { font-family:var(--font-display); font-size:1.4rem; font-weight:900; color:#fff; }
.vivo-score    { font-family:var(--font-display); font-size:4rem; font-weight:900; color:#fff; line-height:1; }

/* ─── EVENTO FEED (panel vivo) ─── */
.evento-feed  { display:flex; flex-direction:column; gap:.5rem; }
.evento-item  { display:flex; align-items:center; gap:.75rem; padding:.5rem .75rem; border-radius:var(--r-md); background:rgba(255,255,255,.05); font-size:.82rem; }
.evento-icono { font-size:1.2rem; flex-shrink:0; }
.evento-minuto{ font-family:var(--font-display); font-size:1rem; font-weight:800; color:var(--cel); min-width:32px; text-align:center; flex-shrink:0; }
.evento-desc  { flex:1; color:#fff; font-weight:500; }

/* ─── GRIDS ─── */
.grid-2    { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.grid-3    { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; }
.grid-dash { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; margin-top:1.5rem; }

/* ─── IMAGEN UPLOAD ─── */
.img-preview      { width:80px; height:60px; object-fit:cover; border-radius:var(--r-md); border:1px solid var(--borde); }
.escudo-preview   { width:48px; height:48px; object-fit:contain; border-radius:50%; border:1px solid var(--borde); }
.foto-overlay { position:absolute; inset:0; background:rgba(0,0,0,.45); opacity:0; transition:.2s; display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:#fff; border-radius:inherit; }

/* ─── SCROLLBAR ─── */
::-webkit-scrollbar { width:5px; height:5px; }
::-webkit-scrollbar-track { background:#F1F5F9; }
::-webkit-scrollbar-thumb { background:#CBD5E1; border-radius:4px; }

/* ─── SECCION TITULO (admin) ─── */
.seccion-titulo { font-size:.95rem; font-weight:700; color:#111; margin-bottom:1rem; padding-bottom:.5rem; border-bottom:2px solid var(--borde); }

/* ──────────────────────────────────────
   LOGIN PAGE
   ────────────────────────────────────── */
.login-page {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(ellipse at 60% 40%, #0F2A52 0%, #050D1A 70%);
  position:relative; overflow:hidden;
}
.login-page::before {
  content:''; position:absolute; inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2300AAFF' fill-opacity='0.04'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  opacity:.5;
}
.login-card {
  background:rgba(255,255,255,.97); border-radius:20px; padding:2.5rem;
  width:100%; max-width:400px; position:relative; z-index:1;
  box-shadow:0 20px 60px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.1);
}
.login-logo {
  font-family:var(--font-display); font-size:1.9rem; font-weight:900;
  color:#0060D0; text-align:center; margin-bottom:.4rem;
  display:flex; align-items:center; justify-content:center; gap:.5rem;
}
.login-logo span { color:#00AAFF; }
.login-logo .login-sub { font-family:var(--font-body); font-size:.8rem; font-weight:400; color:var(--gris-400); display:block; text-align:center; margin-bottom:1.5rem; }

/* ──────────────────────────────────────
   RESPONSIVE
   ────────────────────────────────────── */
@media(max-width:1200px) {
  :root { --sidebar-w: 210px; }
}
@media(max-width:1024px) {
  :root { --sidebar-w: 190px; }
  .grupo-titulo { font-size:.6rem; }
  .sidebar-nav a { font-size:.78rem; padding:.45rem 1rem; }
}
@media(max-width:900px) {
  .sidebar { transform:translateX(-100%); }
  .sidebar.abierto { transform:translateX(0); }
  .sidebar.abierto ~ .sidebar-overlay { display:block; }
  .admin-main { margin-left:0 !important; }
  .grid-2,.grid-3,.grid-dash { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .admin-content { padding:1rem; }
  .tabla-admin { font-size:.75rem; }
  .tabla-admin th,.tabla-admin td { padding:.4rem .5rem; }
}
@media(max-width:600px) {
  .stats-grid { grid-template-columns:repeat(2,1fr); gap:.6rem; }
  .admin-topbar { padding:0 .75rem; }
  .admin-topbar h1 { font-size:.9rem; }
  .admin-topbar .btn { display:none; }
  .admin-topbar .btn:first-of-type { display:inline-flex; }
  .stat-numero { font-size:1.5rem; }
  .tabla-admin th:nth-child(n+4):not(:last-child) { display:none; }
  .tabla-admin td:nth-child(n+4):not(:last-child) { display:none; }
}

/* ──────────────────────────────────────
   SIDEBAR TOGGLE SCRIPT STYLES
   ────────────────────────────────────── */
#sidebarToggle { background:none; border:none; cursor:pointer; font-size:1.3rem; color:#374151; padding:.25rem; }