:root{
  --primary:#023171; /* azul Super Liga BetPlay */
  --primary-700:#034599;
  --bg:#ffffff;
  --muted:#f5f5f5;
  --text:#121212;
  --accent:#FFD700;  /* opcional para resaltes */
  --radius:16px;
  --shadow:0 10px 30px rgba(0,0,0,.2);
}

/* Botón principal */
.dimayor-btn-eventos{
  appearance:none;
  background:var(--primary);
  color:#fff;
  border:none;
  padding:12px 22px;
  border-radius:12px;
  font-weight:700;
  cursor:pointer;
  transition:transform .05s ease, background .3s ease, box-shadow .3s ease;
  box-shadow:0 6px 20px rgba(2,49,113,.25);
}
.dimayor-btn-eventos:hover{ background:var(--primary-700); }
.dimayor-btn-eventos:active{ transform:translateY(1px); }

/* Modal */
.dimayor-modal{
  position:fixed; inset:0; z-index:9999;
  display:none;
}
.dimayor-modal[aria-hidden="false"]{ display:block; }
.dimayor-modal__overlay{
  position:absolute; inset:0; background:rgba(0,0,0,.6);
  opacity:0; animation:fadeIn .2s forwards;
}
.dimayor-modal__content{
  position:relative; margin:4% auto 0; width:min(920px,92vw);
  background:var(--bg); border-radius:var(--radius); box-shadow:var(--shadow);
  display:flex; flex-direction:column; max-height:88vh; overflow:hidden;
  transform:translateY(12px); animation:slideUp .25s ease forwards;
}
@keyframes fadeIn{to{opacity:1}}
@keyframes slideUp{to{transform:translateY(0)}}

.dimayor-modal__header{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 20px; background:linear-gradient(0deg, #012654, var(--primary));
  color:#fff;
}
.dimayor-modal__header h3{ margin:0; font-size:18px; }
.dimayor-modal__close{
  background:transparent; border:none; color:#fff; font-size:26px; cursor:pointer;
}

/* Tabs */
.dimayor-tabs{
  display:flex; gap:6px; padding:10px; background:var(--muted);
  border-bottom:1px solid #eaeaea;
}
.dimayor-tab{
  flex:1; background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  padding:10px 12px; font-weight:700; cursor:pointer;
  transition:box-shadow .2s, border-color .2s, color .2s, background .2s;
}
.dimayor-tab.is-active{
  border-color:var(--primary); color:var(--primary);
  box-shadow:0 4px 16px rgba(2,49,113,.15);
}

/* Panels */
.dimayor-tabs__panels{
  overflow:auto; padding:10px 12px 16px; height:100%;
}
.dimayor-tabpanel{ display:none; }
.dimayor-tabpanel.is-active{ display:block; }

/* Listados base (placeholder) */
.dimayor-list{
  display:grid; gap:10px;
}
.dimayor-card{
  border:1px solid #ececec; border-radius:12px; padding:12px;
  background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.dimayor-card__title{ font-weight:700; margin-bottom:6px; color:var(--primary); }

/* Badges de evento (ejemplo) */
.badge{ display:inline-block; padding:4px 8px; border-radius:999px; font-size:12px; border:1px solid #e5e7eb }
.badge--gol{ background:#e8f7ec; }
.badge--amarilla{ background:#fff7e6; }
.badge--roja{ background:#ffecec; }
.badge--cambio{ background:#e8f1ff; }

/* Responsive: en móvil hacemos modal "fullscreen" */
@media (max-width:768px){
  .dimayor-modal__content{
    width:100vw; height:100vh; margin:0; border-radius:0;
    max-height:100vh;
  }
  .dimayor-tabs{ position:sticky; top:0; z-index:1; }
}