/* =======================
   AJUSTE 2026-07-23: CABECERA SIN LOGO, ANCHO COMPLETO Y CONSULTA DETALLADA
======================= */

/* Cabecera: buscador + verificador + ingreso, sin espacio reservado para logotipo. */
.header{
  grid-template-columns:minmax(260px,1fr) minmax(420px,1.25fr) minmax(248px,max-content);
  grid-template-areas:"search checker login";
  gap:10px;
  min-height:66px;
  padding:8px clamp(10px,1vw,18px);
}
.header-search{grid-area:search}
.ticket-checker{grid-area:checker}
.login-header{grid-area:login}
.logo{display:none!important}

/* El contenido utiliza todo el ancho disponible del navegador. */
.app-layout{
  width:100%;
  max-width:none;
  margin:0;
  grid-template-columns:clamp(230px,16vw,290px) minmax(0,1fr) clamp(310px,19vw,360px);
  gap:10px;
  padding:12px clamp(8px,1vw,18px);
}

/* Se eliminó el módulo superior de eventos. Las columnas quedan como inicio del panel. */
.eventos-toolbar{display:none!important}
.eventos-columnas{
  width:100%!important;
  margin:0!important;
  border-radius:9px 9px 0 0;
}
.eventos-lista{
  min-height:calc(100vh - 120px);
  padding:10px 12px 14px;
}
.eventos-mobile-ligas{display:none}

/* Posición coherente con la nueva altura de la cabecera. */
.system-banner{top:66px}
@media (min-width:921px){
  .ligas-panel,
  .betslip-panel{top:78px!important}
  .betslip-panel{
    height:calc(100vh - 90px)!important;
    height:calc(100dvh - 90px)!important;
    max-height:calc(100vh - 90px)!important;
    max-height:calc(100dvh - 90px)!important;
  }
}

/* Resultado público detallado del ticket. */
.ticket-check-result{
  max-height:min(680px,calc(100vh - 88px));
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  scrollbar-color:#7a7a7a #171717;
  padding:13px;
}
.ticket-check-result::-webkit-scrollbar{width:10px}
.ticket-check-result::-webkit-scrollbar-track{
  margin:7px 0;
  border-radius:999px;
  background:#171717;
  box-shadow:inset 0 0 0 1px #333;
}
.ticket-check-result::-webkit-scrollbar-thumb{
  min-height:46px;
  border:2px solid #171717;
  border-radius:999px;
  background:linear-gradient(180deg,#8a8a8a 0%,#565656 100%);
}
.ticket-check-result::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,#e7b634 0%,#a9750a 100%);
}
.ticket-check-message{
  margin-top:9px;
  padding-bottom:11px;
  border-bottom:1px solid #4a4a4a;
}
.ticket-check-summary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  margin-top:11px;
}
.ticket-check-summary-item{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:9px 10px;
  border:1px solid #4b4b4b;
  border-radius:6px;
  background:linear-gradient(180deg,#292929 0%,#202020 100%);
}
.ticket-check-summary-item span{
  color:#aaa;
  font-size:10px;
  line-height:1.1;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.45px;
}
.ticket-check-summary-item strong{
  min-width:0;
  color:#fff;
  font-size:13px;
  line-height:1.2;
  font-weight:900;
  overflow-wrap:anywhere;
}
.ticket-check-summary-item.is-emphasis{
  grid-column:1 / -1;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-color:#0b7810;
  background:linear-gradient(180deg,#128c18 0%,#086d0d 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15);
}
.ticket-check-summary-item.is-emphasis span,
.ticket-check-summary-item.is-emphasis strong{color:#fff}
.ticket-check-summary-item.is-emphasis strong{font-size:17px;white-space:nowrap}

.ticket-check-selection-section{
  margin-top:12px;
  padding-top:11px;
  border-top:1px solid #4a4a4a;
}
.ticket-check-selection-section-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}
.ticket-check-selection-section-heading strong{
  color:#fff;
  font-size:13px;
  font-weight:900;
}
.ticket-check-selection-section-heading span{
  color:#b8b8b8;
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}
.ticket-check-selections{display:grid;gap:8px}
.ticket-check-selection{
  min-width:0;
  padding:10px;
  border:1px solid #424242;
  border-left-width:4px;
  border-radius:7px;
  background:linear-gradient(180deg,#242424 0%,#1b1b1b 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.ticket-check-selection.status-pendiente{border-left-color:var(--yellow)}
.ticket-check-selection.status-ganado{border-left-color:#16a51d}
.ticket-check-selection.status-perdido{border-left-color:#c8322b}
.ticket-check-selection-heading{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.ticket-check-selection-identity{
  min-width:0;
  display:flex;
  align-items:center;
  gap:7px;
}
.ticket-check-selection-number{
  flex:0 0 auto;
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:5px;
  background:#444;
  color:#fff;
  font-size:11px;
  font-weight:900;
}
.ticket-check-selection-league{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#b8b8b8;
  font-size:10px;
  line-height:1.15;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.35px;
}
.ticket-check-selection-status{
  flex:0 0 auto;
  min-height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 7px;
  border-radius:4px;
  background:#555;
  color:#fff;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.35px;
}
.ticket-check-selection.status-pendiente .ticket-check-selection-status{
  background:var(--yellow);
  color:#1c1609;
}
.ticket-check-selection.status-ganado .ticket-check-selection-status{background:#0b8b11}
.ticket-check-selection.status-perdido .ticket-check-selection-status{background:#b92520}
.ticket-check-selection-match{
  display:block;
  margin-top:8px;
  color:#fff;
  font-size:13px;
  line-height:1.25;
  font-weight:900;
  overflow-wrap:anywhere;
}
.ticket-check-selection-meta{
  margin-top:4px;
  color:#aaa;
  font-size:10px;
  line-height:1.25;
  font-weight:700;
}
.ticket-check-selection-details{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr) minmax(58px,.45fr);
  gap:6px;
  margin-top:9px;
}
.ticket-check-selection-details > div{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:7px 8px;
  border:1px solid #3b3b3b;
  border-radius:5px;
  background:#181818;
}
.ticket-check-selection-details span{
  color:#929292;
  font-size:9px;
  line-height:1;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.35px;
}
.ticket-check-selection-details strong{
  color:#f4f4f4;
  font-size:11px;
  line-height:1.2;
  font-weight:850;
  overflow-wrap:anywhere;
}
.ticket-check-selection-details > div:last-child strong{
  color:var(--yellow);
  font-size:13px;
}
.ticket-check-selection-empty{
  margin:0;
  padding:12px;
  border:1px dashed #555;
  border-radius:6px;
  color:#bbb;
  font-size:11px;
  line-height:1.4;
  text-align:center;
}

@media (max-width:1440px){
  .app-layout{
    grid-template-columns:clamp(220px,18vw,270px) minmax(0,1fr) clamp(300px,22vw,330px);
    gap:9px;
    padding:10px;
  }
}

@media (max-width:1180px){
  .header{
    grid-template-columns:minmax(210px,.9fr) minmax(350px,1.2fr) minmax(215px,max-content);
    grid-template-areas:"search checker login";
    gap:8px;
    min-height:66px;
  }
  .app-layout{grid-template-columns:minmax(0,1fr) clamp(300px,29vw,330px)}
  .eventos-mobile-ligas{
    width:calc(100% - 16px);
    min-height:40px;
    margin:8px 8px 0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:7px;
  }
  .eventos-columnas{border-radius:0}
  .eventos-lista{min-height:calc(100vh - 166px)}
}

@media (max-width:920px){
  .header{
    grid-template-columns:minmax(0,.9fr) minmax(330px,1.1fr);
    grid-template-areas:
      "search checker"
      "login login";
    gap:8px 10px;
    min-height:112px;
    padding:8px 10px;
  }
  .login-header{
    width:auto;
    justify-self:end;
  }
  #login-form{width:min(100%,330px)}
  .system-banner{top:112px}
  .toast-container{top:128px}
}

@media (min-width:901px) and (max-width:920px){
  .ligas-panel,
  .betslip-panel{top:124px!important}
  .betslip-panel{
    height:calc(100vh - 136px)!important;
    height:calc(100dvh - 136px)!important;
    max-height:calc(100vh - 136px)!important;
    max-height:calc(100dvh - 136px)!important;
  }
}

@media (max-width:900px){
  .app-layout{display:block;width:100%;padding:8px}
  .eventos-lista{min-height:auto}
  .betslip-panel.activo{top:122px}
}

@media (max-width:680px){
  .header{
    position:relative;
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:
      "search"
      "checker"
      "login";
    gap:8px;
    min-height:0;
    padding:9px;
  }
  .header-search,
  .ticket-checker,
  .login-header{width:100%}
  .login-header{
    justify-self:stretch;
    flex-wrap:wrap;
  }
  #login-form{
    width:100%;
    grid-template-columns:minmax(0,1fr) auto;
    margin:0;
  }
  .ticket-check-result{
    position:static;
    max-height:min(620px,calc(100vh - 90px));
    margin-top:8px;
    box-shadow:0 8px 20px rgba(0,0,0,.38);
  }
  .ticket-check-result::before{display:none}
  .ticket-check-selection-details{
    grid-template-columns:minmax(0,1fr) minmax(0,.72fr) minmax(54px,.42fr);
  }
  .system-banner{position:relative;top:auto}
  .toast-container{top:10px}
  .betslip-panel.activo{top:10px}
}

@media (max-width:430px){
  .ticket-check-summary{grid-template-columns:1fr}
  .ticket-check-summary-item.is-emphasis{grid-column:auto}
  .ticket-check-selection-details{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .ticket-check-selection-details > div:first-child{grid-column:1 / -1}
  .ticket-check-selection-details > div:last-child strong{font-size:12px}
}

/* Ajustes finales del verificador detallado. */
.ticket-check-close{
  flex:0 0 auto;
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:1px solid #555;
  border-radius:50%;
  background:#222;
  color:#ddd;
  font-size:19px;
  line-height:1;
  font-weight:700;
}
.ticket-check-close:hover{
  border-color:#a93631;
  background:#a92823;
  color:#fff;
}
.ticket-check-selection-section{flex:1 1 auto}

/* El acceso a ligas en pantallas reducidas queda como botón compacto,
   no como reemplazo del módulo eliminado. */
@media (max-width:1180px){
  .eventos-mobile-ligas{
    width:auto!important;
    min-height:36px!important;
    margin:8px 8px 0!important;
    padding:0 13px!important;
    border-radius:6px!important;
  }
}