.pago-potencial{
  position:relative;
  overflow:hidden;
  min-height:78px;
  margin-top:16px;
  padding:14px 16px;
  border:1px solid #d7ff35;
  border-radius:10px;
  background:
    radial-gradient(circle at 90% 10%, rgba(255,255,255,.22), transparent 30%),
    linear-gradient(135deg,#bfff00 0%,#8fd900 55%,#5cae00 100%);
  box-shadow:
    0 10px 24px rgba(143,217,0,.22),
    inset 0 1px 0 rgba(255,255,255,.45);
  color:#071008;
}

.pago-potencial::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 0 46%,rgba(255,255,255,.18) 50%,transparent 54% 100%);
  pointer-events:none;
}

.pago-potencial span{
  position:relative;
  z-index:1;
  display:block;
  font-size:11px;
  line-height:1;
  letter-spacing:1px;
  color:#183200;
  font-weight:900;
  text-transform:uppercase;
}

.pago-potencial strong{
  position:relative;
  z-index:1;
  display:flex;
  align-items:baseline;
  justify-content:flex-end;
  gap:4px;
  margin-left:auto;
  color:#071008;
  font-size:30px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.7px;
  text-shadow:0 1px 0 rgba(255,255,255,.3);
  white-space:nowrap;
}

.pago-potencial strong > span{
  display:inline;
  color:#071008;
  font-size:30px;
  letter-spacing:-.7px;
}

@media (max-width:720px){
  .pago-potencial{
    min-height:72px;
    padding:13px 14px;
  }

  .pago-potencial strong,
  .pago-potencial strong > span{
    font-size:27px;
  }
}

/* =======================
   DIMENSIONES ESTABLES ENTRE LIGAS
======================= */
html{
  scrollbar-gutter: stable;
  overflow-y: scroll;
}

.app-layout{
  align-items: stretch;
}

.ligas-panel,
.eventos-panel,
.betslip-panel{
  align-self: stretch;
}

.eventos-panel{
  min-height: calc(100vh - 92px);
}

.eventos-lista{
  min-height: calc(100vh - 205px);
}

@media (max-width:1180px){
  .eventos-panel{
    min-height: calc(100vh - 86px);
  }

  .eventos-lista{
    min-height: calc(100vh - 198px);
  }
}

@media (max-width:900px){
  html{
    scrollbar-gutter: auto;
    overflow-y: auto;
  }

  .eventos-panel,
  .eventos-lista{
    min-height: auto;
  }
}

/* =======================
   PANEL DE LIGAS FIJO + BÚSQUEDA NATIVA
======================= */
.ligas-panel{
  position:sticky !important;
  top:74px !important;
  max-height:none !important;
  overflow:visible !important;
  align-self:start;
}

.liga-search-wrap{
  position:relative;
  overflow:visible;
}

#buscar-liga{
  cursor:text;
  user-select:text;
}

#buscar-liga:focus{
  outline:2px solid rgba(86,102,255,.55);
  outline-offset:1px;
  border-color:#7180ff;
}

@media(max-width:1180px){
  .ligas-panel{
    position:fixed !important;
    top:0 !important;
    max-height:100vh !important;
    overflow-y:auto !important;
  }
}

/* =======================
   ENCABEZADOS CENTRADOS Y ALINEADOS CON EVENTOS
======================= */
.eventos-columnas{
  margin-left:12px;
  margin-right:12px;
  width:calc(100% - 24px);
}

.eventos-columnas span{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center !important;
  min-width:0;
}

.evento-hora{
  text-align:center;
}

@media(max-width:720px){
  .eventos-columnas{
    margin-left:0;
    margin-right:0;
    width:100%;
  }
}

/* =======================
   MEJORAS 2026: SESIÓN, ESTADOS Y ACCESIBILIDAD
======================= */
[hidden]{display:none !important}
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.login-header{position:relative;flex-wrap:wrap;justify-content:flex-end}
#login-form[hidden]{display:none!important}
#logged-in:not([hidden]){display:flex!important}
.admin-link{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 12px;
  border:1px solid #3d4860;
  border-radius:4px;
  background:#202735;
  color:#fff;
  text-decoration:none;
  font-weight:800;
}
.login-message{
  flex-basis:100%;
  min-height:14px;
  text-align:right;
  color:#ff9292;
  font-size:11px;
  font-weight:700;
}
.system-banner{
  position:sticky;
  top:60px;
  z-index:1050;
  padding:10px 16px;
  border-bottom:1px solid #8b6a21;
  background:#3a2c0f;
  color:#ffe8a6;
  text-align:center;
  font-size:13px;
  font-weight:800;
  box-shadow:0 6px 18px rgba(0,0,0,.22);
}
.toast-container{
  position:fixed;
  top:78px;
  right:16px;
  z-index:2200;
  display:grid;
  gap:10px;
  width:min(390px,calc(100vw - 32px));
  pointer-events:none;
}
.toast{
  opacity:0;
  transform:translateY(-8px);
  padding:13px 14px;
  border:1px solid #3a465a;
  border-radius:9px;
  background:#171d27;
  color:#fff;
  box-shadow:0 14px 36px rgba(0,0,0,.4);
  font-size:13px;
  line-height:1.45;
  font-weight:750;
  transition:opacity .2s ease,transform .2s ease;
}
.toast.visible{opacity:1;transform:translateY(0)}
.toast-success{border-color:#277d4b;background:#10271b}
.toast-warning{border-color:#806728;background:#2c2513;color:#ffe9a9}
.toast-error{border-color:#8d3333;background:#2b1518;color:#ffc5c5}
.toast-info{border-color:#3d4fa4;background:#171d3a;color:#d9dfff}

