/* Core palette */
:root{
  --ssc-bg:#fff; --ssc-border:#e5e7eb; --ssc-ink:#0f172a; --ssc-ink2:#475569;
  --ssc-shadow:0 10px 30px rgba(2,6,23,.06);
  --ssc-primary:#1e293b; --ssc-green:#16a34a; --ssc-amber:#f59e0b; --ssc-sky:#0ea5e9; --ssc-slate:#334155; --ssc-goal:#d61f1f;
}
html, body { height:100%; }

/* DASHBOARD */
.ssc-dashboard-wrap{ width:100vw; max-width:unset; min-height:100vh; display:flex; flex-direction:column; gap:12px; padding:10px; background:#fff; }
.ssc-dashboard-topbar{ display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; gap:12px;}
.ssc-dashboard-title{ font-size:clamp(20px,2.6vw,36px); font-weight:900; color:var(--ssc-ink); letter-spacing:.5px; }
.ssc-dashboard-fs{ background:var(--ssc-primary); color:#fff; border:none; border-radius:10px; padding:8px 12px; cursor:pointer; }

.ssc-grid.ssc-grid-tv{
  display:grid; grid-template-columns:repeat(3, 1fr); grid-auto-rows:1fr; gap:14px; flex:1;
}

.ssc-card{ background:#fff; border:1px solid var(--ssc-border); border-radius:16px; padding:8px; box-shadow:var(--ssc-shadow); display:flex; flex-direction:column; }
.ssc-card-title{
  font-weight:900; color:var(--ssc-ink); margin:4px 0 6px; text-align:center;
  font-size:clamp(28px,3.5vw,56px);  /* TÍTULO GIGANTE */
  letter-spacing:.8px;
}
.ssc-card .ssc-wrap{ box-shadow:none; border:none; padding:4px; flex:1; display:flex; flex-direction:column; }

/* ADMIN */
.ssc-admin-grid.simple{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:1200px; margin:0 auto;}
@media (max-width:1100px){ .ssc-admin-grid.simple{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:720px){ .ssc-admin-grid.simple{ grid-template-columns:1fr;} }
.ssc-admin-card{ background:var(--ssc-bg); border:1px solid var(--ssc-border); border-radius:16px; padding:14px; box-shadow:var(--ssc-shadow); }
.ssc-admin-header{ display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--ssc-border); padding-bottom:8px; margin-bottom:10px; }
.ssc-admin-title{ font-weight:800; color:var(--ssc-ink); display:flex; gap:12px; align-items:center; }
.ssc-pin-show{ font-size:14px; color:var(--ssc-ink2); background:#f1f5f9; padding:2px 8px; border-radius:999px; }
.ssc-admin-remaining{ font-family:monospace; font-size:28px; font-weight:900; color:var(--ssc-goal); }
.ssc-admin-row{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:10px; }
.ssc-admin-card input{ width:100%; padding:10px 12px; border:1px solid var(--ssc-border); border-radius:10px; background:#fff; color:#0f172a; }

.ssc-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 14px; border-radius:12px; border:none; font-weight:800; color:#fff; background:var(--ssc-primary); cursor:pointer;}
.ssc-btn.start{ background:var(--ssc-green); }
.ssc-btn.pause{ background:var(--ssc-amber); color:#111; }
.ssc-btn.resume{ background:var(--ssc-sky); }
.ssc-btn.reset{ background:var(--ssc-slate); }
.ssc-key{ background:#0f172a; color:#fff; border:1px solid #0f172a; padding:10px 16px; border-radius:12px; font-weight:800; font-size:16px; }

/* DISPLAY */
.ssc-wrap{ position:relative; background:var(--ssc-bg); border:1px solid var(--ssc-border); border-radius:18px; padding:12px; box-shadow:var(--ssc-shadow); max-width:1100px; margin:0 auto 16px;}
.ssc-topbar{ display:flex; justify-content:space-between; align-items:center; }
.ssc-clock{ color:var(--ssc-ink2); font-family:monospace; }
.ssc-fullscreen{ background:var(--ssc-primary); color:#fff; border:none; border-radius:10px; padding:8px 12px; cursor:pointer; }

.ssc-teams{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:center; margin-top:6px;}
.ssc-team{ display:flex; align-items:center; gap:8px; }
.ssc-team .ssc-name{ font-weight:800; color:var(--ssc-ink); font-size:clamp(16px,2vw,28px); }
.ssc-team .ssc-score{ font-weight:900; color:var(--ssc-goal); font-size:clamp(56px,6.5vw,110px); line-height:1; min-width:70px; text-align:center; }

.ssc-timebox{ margin-top:6px; display:flex; align-items:center; justify-content:center; border:1px solid var(--ssc-border); border-radius:18px; padding:8px 10px;}
.ssc-time-label{ color:var(--ssc-ink2); font-weight:700; margin-right:8px;}
.ssc-timer{ font-size:clamp(88px,8vw,150px); font-weight:900; color:var(--ssc-goal); letter-spacing:2px; }

/* ADS overlay a pantalla completa dentro de cada tarjeta/canal */
.ssc-ads{ position:absolute; inset:0; background:#000; display:flex; align-items:center; justify-content:center; z-index:9999; }
.ssc-ads[hidden]{ display:none !important; }
.ssc-ads .ssc-ads-inner{ position:absolute; inset:0; }
.ssc-ads iframe{ width:100%; height:100%; border:0; display:block; object-fit:cover; }

/* Ocultar en dashboard elementos redundantes */
.ssc-grid .ssc-card .ssc-topbar,
.ssc-grid .ssc-card .ssc-fullscreen,
.ssc-grid .ssc-card .ssc-time-label,
.ssc-grid .ssc-card .ssc-public-controls,
.ssc-grid .ssc-card .ssc-pin-show{ display:none !important; }

.ssc-grid .ssc-card .ssc-team .ssc-score{ font-size:clamp(56px,6.5vw,110px); }
.ssc-grid .ssc-card .ssc-timer{ font-size:clamp(88px,7.5vw,150px); }

/* FULLSCREEN */
.ssc-wrap:fullscreen, .ssc-wrap.ssc-fs{ max-width:100vw; width:100vw; height:100vh; border-radius:0; border:none; box-shadow:none; padding:14px; }
.ssc-wrap:fullscreen .ssc-timer, .ssc-wrap.ssc-fs .ssc-timer{ font-size:clamp(220px,32vw,420px); }
.ssc-wrap:fullscreen .ssc-team .ssc-score, .ssc-wrap.ssc-fs .ssc-team .ssc-score{ font-size:clamp(110px,16vw,220px); }
.ssc-wrap:fullscreen .ssc-team .ssc-name, .ssc-wrap.ssc-fs .ssc-team .ssc-name{ font-size:clamp(28px,3.5vw,58px); }
.ssc-wrap:fullscreen .ssc-topbar .ssc-fullscreen, .ssc-wrap.ssc-fs .ssc-topbar .ssc-fullscreen{ display:none; }

/* GRUPOS (DUO) */
.ssc-group-wrap{ width:100vw; min-height:100vh; display:flex; flex-direction:column; gap:12px; padding:10px; background:#fff; }
.ssc-group-topbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px; }
.ssc-group-title{ font-weight:900; font-size:clamp(20px,2.6vw,36px); }
.ssc-group-fs{ background:var(--ssc-primary); color:#fff; border:none; border-radius:10px; padding:8px 12px; cursor:pointer; }
.ssc-group-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; flex:1; }
@media (max-width: 900px){ .ssc-group-grid{ grid-template-columns:1fr; } }
.ssc-group-grid .ssc-team .ssc-score{ font-size:clamp(72px,7.5vw,130px); }
.ssc-group-grid .ssc-timer{ font-size:clamp(120px,12vw,200px); }
.ssc-group-wrap:fullscreen .ssc-group-fs{ display:none; }
.ssc-group-wrap:fullscreen .ssc-card .ssc-wrap{ border:none; box-shadow:none; }

/* Gol flash */
.ssc-goalflash{ animation: sscGoalFlash .5s ease-in-out; }
@keyframes sscGoalFlash{
  0%{ box-shadow: 0 0 0 rgba(214,31,31,0); }
  50%{ box-shadow: 0 0 60px rgba(214,31,31,.35); }
  100%{ box-shadow: 0 0 0 rgba(214,31,31,0); }
}

/* ===== DASHBOARD TV FULL ===== */
.ssc-dashboard-wrap{
  width:100vw;
  height:100vh;                 /* ocupa toda la TV */
  max-width:unset;
  padding:8px;                  /* menos padding */
  background:#fff;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.ssc-dashboard-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin:0 0 4px 0;
}
.ssc-dashboard-title{
  font-size:clamp(18px,1.7vw,24px);
  font-weight:900;
  letter-spacing:.3px;
}
.ssc-dashboard-fs{
  background:var(--ssc-primary);
  color:#fff;
  border:none;
  border-radius:10px;
  padding:6px 10px;
  cursor:pointer;
}

/* Grilla 3x2 que llena la altura disponible */
.ssc-grid.ssc-grid-tv{
  flex:1;
  height:100%;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  grid-template-rows:repeat(2, 1fr);
  gap:10px;                    /* módulos más pegados */
}

/* Tarjeta compacta */
.ssc-card{
  background:#fff;
  border:1px solid var(--ssc-border);
  border-radius:12px;          /* menos redondeo para ganar espacio */
  padding:6px;
  box-shadow:var(--ssc-shadow);
  display:flex;
  flex-direction:column;
}

/* Título de la cancha: más discreto pero legible */
.ssc-card-title{
  text-align:center;
  font-weight:900;
  color:var(--ssc-ink);
  margin:2px 0 4px;
  font-size:clamp(18px,1.8vw,26px);
  letter-spacing:.6px;
}

/* Contenido interno muy compacto */
.ssc-card .ssc-wrap{
  box-shadow:none;
  border:none;
  padding:4px;
  flex:1;
  display:flex;
  flex-direction:column;
}

/* Ocultar elementos que no se necesitan en el dashboard */
.ssc-grid .ssc-card .ssc-topbar,
.ssc-grid .ssc-card .ssc-fullscreen,
.ssc-grid .ssc-card .ssc-time-label,
.ssc-grid .ssc-card .ssc-public-controls,
.ssc-grid .ssc-card .ssc-pin-show{ display:none !important; }

/* Equipos pequeños, marcador grande pero sin robar al timer */
.ssc-grid .ssc-card .ssc-teams{
  justify-content:center;
  gap:8px;
  margin-top:2px;
}
.ssc-grid .ssc-card .ssc-team .ssc-name{
  font-size:clamp(12px,1.2vw,16px);
  font-weight:800;
}
.ssc-grid .ssc-card .ssc-team .ssc-score{
  font-size:clamp(28px,2.2vw,40px);   /* más pequeño que el timer */
  font-weight:900;
  color:var(--ssc-goal);
}

/* Caja de tiempo compacta */
.ssc-grid .ssc-card .ssc-timebox{
  border:1px solid var(--ssc-border);
  border-radius:12px;
  padding:6px 8px;
  margin-top:6px;
}

/* Timer bien protagonista y responsivo para TV 3x2 */
.ssc-grid .ssc-card .ssc-timer{
  font-size:clamp(56px,8.5vw,120px);   /* ajusta si lo quieres aún más grande/pequeño */
  font-weight:900;
  color:var(--ssc-goal);
  letter-spacing:2px;
  line-height:1;
}

/* En fullscreen, que la grilla mantenga 3x2 y rellene todo */
.ssc-dashboard-wrap:fullscreen{
  padding:8px;
  background:#fff;
}
.ssc-dashboard-wrap:fullscreen .ssc-dashboard-fs{ display:none; }

/* ====== FIX DASHBOARD MOSAICO TV (sobrescribe reglas previas) ====== */

/* El contenedor del dashboard ocupa toda la TV y no depende del tema */
.ssc-dashboard-wrap{
  width:100vw !important;
  height:100vh !important;
  max-width:unset !important;
  padding:8px !important;
  margin:0 !important;
}

/* Grilla 3x2 que SIEMPRE cabe en la pantalla */
.ssc-grid.ssc-grid-tv{
  display:grid !important;
  grid-template-columns:repeat(3, 1fr) !important;
  grid-template-rows:repeat(2, 1fr) !important;
  gap:10px !important;
  height:100% !important;
}

/* Las tarjetas y su interior no imponen tamaños “raros” */
.ssc-card{
  display:flex !important;
  flex-direction:column !important;
  padding:6px !important;
  min-height:0 !important;
}
.ssc-card .ssc-wrap{
  /* Quita el max-width heredado del display individual */
  max-width:unset !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  padding:4px !important;
  border:none !important;
  box-shadow:none !important;
}

/* Compacta cabecera y equipos en dashboard */
.ssc-card-title{
  margin:2px 0 4px !important;
  font-size:clamp(18px,1.8vw,26px) !important;
}
.ssc-grid .ssc-card .ssc-teams{ margin-top:0 !important; gap:8px !important; }
.ssc-grid .ssc-card .ssc-team .ssc-name{ font-size:clamp(12px,1.2vw,16px) !important; }
.ssc-grid .ssc-card .ssc-team .ssc-score{ font-size:clamp(24px,2vw,36px) !important; }

/* La caja del tiempo se estira y centra; el timer no rompe la tarjeta */
.ssc-grid .ssc-card .ssc-timebox{
  flex:1 1 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:6px 8px !important;
  border:1px solid var(--ssc-border) !important;
  border-radius:12px !important;
  min-height:0 !important;
}
.ssc-grid .ssc-card .ssc-timer{
  /* AJUSTA ESTA LÍNEA para más/menos grande en TV */
  font-size:clamp(48px,6.5vw,90px) !important;
  line-height:1 !important;
  letter-spacing:2px !important;
  white-space:nowrap !important;
}

/* Oculta elementos que no se usan en dashboard */
.ssc-grid .ssc-card .ssc-topbar,
.ssc-grid .ssc-card .ssc-fullscreen,
.ssc-grid .ssc-card .ssc-time-label,
.ssc-grid .ssc-card .ssc-public-controls,
.ssc-grid .ssc-card .ssc-pin-show{ display:none !important; }

/* En fullscreen sigue siendo 3x2 */
.ssc-dashboard-wrap:fullscreen .ssc-dashboard-fs{ display:none !important; }

/* (Opcional) neutraliza márgenes del tema alrededor del contenido */
.entry-content > .ssc-dashboard-wrap{ margin:0 !ificant; }

/* ====== DASHBOARD A ANCHO COMPLETO (full-bleed + ajuste TV) ====== */
.ssc-dashboard-wrap{
  width:100vw !important;
  height:100vh !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding:8px !important;
  background:#fff !important;
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
}

/* Corrige temas que imponen max-width */
.entry-content > .ssc-dashboard-wrap,
.elementor .ssc-dashboard-wrap,
.site-main .ssc-dashboard-wrap{
  max-width:100vw !important;
  padding:0 !important;
}

/* Grilla 3x2 que llena ancho y alto */
.ssc-grid.ssc-grid-tv{
  display:grid !important;
  grid-template-columns:repeat(3, 1fr) !important;
  grid-template-rows:repeat(2, 1fr) !important;
  gap:10px !important;
  width:100% !important;
  height:100% !important;
}

/* Tarjetas expanden para ocupar toda la celda */
.ssc-card{
  display:flex !important;
  flex-direction:column !important;
  padding:6px !important;
  border-radius:10px !important;
}
.ssc-card .ssc-wrap{
  max-width:unset !important;
  width:100% !important;
  height:100% !important;
  border:none !important;
  box-shadow:none !important;
  padding:4px !important;
}

/* Ajuste visual interno */
.ssc-card-title{
  margin:4px 0 !important;
  font-size:clamp(18px,2vw,28px) !important;
  text-align:center !important;
}
.ssc-grid .ssc-card .ssc-team .ssc-name{
  font-size:clamp(12px,1.3vw,18px) !important;
}
.ssc-grid .ssc-card .ssc-team .ssc-score{
  font-size:clamp(28px,2.2vw,40px) !important;
}
.ssc-grid .ssc-card .ssc-timer{
  font-size:clamp(54px,7vw,110px) !important;
  font-weight:900 !important;
  line-height:1 !important;
  color:var(--ssc-goal) !important;
}

/* Oculta lo que no se necesita en dashboard */
.ssc-grid .ssc-card .ssc-topbar,
.ssc-grid .ssc-card .ssc-fullscreen,
.ssc-grid .ssc-card .ssc-time-label,
.ssc-grid .ssc-card .ssc-public-controls,
.ssc-grid .ssc-card .ssc-pin-show{ display:none !important; }

/* En fullscreen, mantiene 3x2 y sin márgenes */
.ssc-dashboard-wrap:fullscreen{
  padding:8px !important;
  background:#fff !important;
}
.ssc-dashboard-wrap:fullscreen .ssc-dashboard-fs{ display:none !important; }

/* Responsivo: 2x3 o 1x6 si pantalla es más estrecha */
@media (max-width: 1100px){
  .ssc-grid.ssc-grid-tv{ grid-template-columns:repeat(2, 1fr) !important; }
}
@media (max-width: 700px){
  .ssc-grid.ssc-grid-tv{ grid-template-columns:1fr !important; }
}

/* --- DUO full-screen responsive --- */
.ssc-group-wrap{
  width:100vw;
  height:100vh;           /* ocupa toda la pantalla */
  max-width:unset;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:12px;
  background:#fff;
}

.ssc-group-topbar{ flex:0 0 auto; }
.ssc-group-grid{
  flex:1 1 auto;
  display:grid;
  grid-template-columns:repeat(2, 1fr); /* 2 columnas (1 por cancha) */
  grid-auto-rows:1fr;
  gap:14px;
  align-items:stretch;
}

/* Si la pantalla es muy “cuadrada”, baja a 1 columna para no cortar */
@media (max-aspect-ratio: 16/10){
  .ssc-group-grid{ grid-template-columns:1fr; }
}

.ssc-group-grid .ssc-card{ display:flex; flex-direction:column; }
.ssc-group-grid .ssc-card .ssc-wrap{
  flex:1 1 auto;
  height:100%;
  border:none;
  box-shadow:none;
  padding:8px;
}

/* Títulos grandes pero fluidos */
.ssc-group-title,
.ssc-card-title{
  font-size:clamp(20px, 3vw, 48px);
}

/* Marcadores/timer fluidos para TV */
.ssc-group-grid .ssc-team .ssc-score{ font-size:clamp(64px, 10vw, 160px); }
.ssc-group-grid .ssc-timer{ font-size:clamp(120px, 18vw, 260px); }

/* Cuando el DUO está en fullscreen, aprovecha todo sin bordes extra */
.ssc-group-wrap:fullscreen .ssc-card .ssc-wrap{
  border:none !important;
  box-shadow:none !important;
  padding:10px;
}

/* Overlay de Ads del DUO a pantalla completa */
.ssc-ads.ssc-ads-group{
  position:absolute; inset:0;
  background:#000;
  display:flex; align-items:center; justify-content:center;
  z-index:9999;
}
.ssc-ads.ssc-ads-group[hidden]{ display:none !important; }
.ssc-ads.ssc-ads-group .ssc-ads-inner{ position:absolute; inset:0; }
.ssc-ads.ssc-ads-group iframe{ width:100%; height:100%; border:0; object-fit:cover; }

/* Botón de pantalla completa sobre el overlay */
.s.c-ads-fs,
.ssc-ads-fs{
  position:absolute; right:10px; top:10px;
  background:rgba(0,0,0,.6); color:#fff; border:0; border-radius:10px;
  padding:8px 12px; cursor:pointer;
}