/* TOTOSLOTJP — Football carousel UI
   Source-matched 3-card layout.
   Existing data/API logic is untouched.
*/
.football-widget{
  width:min(780px, calc(100vw - 34px));
  max-width:780px;
  margin:0 auto 24px;
  position:relative;
  color:#fff;
}

.football-track-wrap{
  position:relative;
  overflow:hidden;
  width:100%;
}

.football-track{
  display:flex;
  flex-wrap:nowrap;
  gap:12px;
  width:100%;
  transform:translate3d(0,0,0);
  transition:transform .45s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}

.football-card{
  flex:0 0 calc((100% - 24px)/3);
  height:161px;
  min-width:0;
  padding:14px 12px 10px;
  border:0;
  border-radius:13px;
  background:repeating-linear-gradient(
    135deg,
    #242424 0,
    #242424 6px,
    #202020 6px,
    #202020 12px
  );
  text-align:center;
  overflow:hidden;
  box-sizing:border-box;
  position:relative;
}

.football-league{
  margin:0 0 7px;
  color:#fff;
  font-size:11px;
  line-height:1.1;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  text-transform:uppercase;
}

.football-time{
  margin:0 0 8px;
  color:#f7c43d;
  font-size:11px;
  line-height:1.1;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.football-match{
  display:grid;
  grid-template-columns:1fr 78px 1fr;
  align-items:start;
  gap:4px;
  min-height:75px;
}

.football-team{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:4px;
}

.football-team-logo{
  width:40px;
  height:40px;
  object-fit:contain;
  display:block;
}

.football-team-logo-empty{
  visibility:hidden;
}

.football-team-name{
  width:100%;
  color:#fff;
  font-size:11px;
  line-height:1.05;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.football-center{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
}

.football-score{
  color:#fff;
  font-size:24px;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
}

.football-bet{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:78px;
  height:34px;
  margin-top:8px;
  border-radius:7px;
  background:linear-gradient(#ffd15a,#f5b82d);
  color:#171717;
  font-size:10px;
  line-height:1;
  font-weight:900;
  text-decoration:none;
}

.football-odds{
  position:absolute;
  left:14px;
  right:14px;
  bottom:12px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:0;
  color:#f7c43d;
  font-size:9px;
  line-height:1;
  font-weight:900;
}

.football-odds span{
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.football-odds .away{
  text-align:right;
}

.football-status{
  position:absolute;
  top:10px;
  left:10px;
  padding:2px 5px;
  border-radius:4px;
  background:#e9b52f;
  color:#16110a;
  font-size:7px;
  font-weight:900;
  display:none;
}

.football-card.is-live .football-status{
  display:block;
}

.football-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:5;
  width:34px;
  height:34px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:50%;
  background:rgba(90,90,90,.5);
  color:#ddd;
  font-size:25px;
  line-height:30px;
  cursor:pointer;
  display:grid;
  place-items:center;
  padding:0;
}

.football-prev{left:2px}
.football-next{right:2px}

.football-arrow[disabled]{
  opacity:.35;
}

.football-dots{
  min-height:10px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:5px;
  margin-top:5px;
}

.football-dot{
  appearance:none;
  border:0;
  padding:0;
  width:5px;
  height:5px;
  min-width:5px;
  min-height:5px;
  border-radius:50%;
  background:#777;
  cursor:pointer;
}

.football-dot.active{
  background:#fff;
}

.football-loading,
.football-empty,
.football-error{
  width:100%;
  min-height:161px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:repeating-linear-gradient(
    135deg,
    #242424 0,
    #242424 6px,
    #202020 6px,
    #202020 12px
  );
  color:#aaa;
  font-size:11px;
  text-align:center;
}

@media(max-width:700px){
  .football-widget{
    width:calc(100vw - 20px);
    max-width:none;
    margin:0 auto 20px;
  }

  .football-track{
    gap:8px;
  }

  .football-card{
    flex:0 0 calc((100% - 8px)/2);
    height:150px;
    min-height:150px;
    padding:12px 8px 9px;
    border-radius:12px;
  }

  .football-league{
    font-size:10px;
    margin-bottom:6px;
  }

  .football-time{
    font-size:9px;
    margin-bottom:6px;
  }

  .football-match{
    grid-template-columns:1fr 62px 1fr;
    min-height:58px;
  }

  .football-team-logo{
    width:34px;
    height:34px;
  }

  .football-team-name{
    font-size:9px;
  }

  .football-score{
    font-size:23px;
  }

  .football-bet{
    width:70px;
    height:30px;
    font-size:10px;
    margin-top:6px;
  }

  .football-odds{
    left:10px;
    right:10px;
    bottom:10px;
    margin:0;
    font-size:9px;
  }

  .football-arrow{
    width:30px;
    height:30px;
    font-size:22px;
  }
}

/* Final source-match odds/pasaran row */
.football-odds{
  position:absolute;
  left:14px;
  right:14px;
  bottom:11px;
  height:15px;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:12px;
  color:#f6c33b;
  font-size:9px;
  line-height:1;
  font-weight:900;
  text-align:left;
  pointer-events:none;
}

.football-odds > span{
  display:flex;
  align-items:center;
  gap:3px;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
}

.football-odds .football-odd-away{
  justify-content:flex-end;
  text-align:right;
}

.football-odds b,
.football-odds em{
  font-style:normal;
  font-weight:900;
}

.football-odds b{color:#f6c33b}
.football-odds em{color:#fff}

@media(max-width:700px){
  .football-odds{
    left:10px;
    right:10px;
    bottom:9px;
    font-size:8px;
  }
}


/* ===== FINAL VISIBILITY / SOURCE-SCALE REPAIR ===== */
.football-widget{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  width:min(780px, calc(100% - 32px)) !important;
  max-width:780px !important;
  min-width:0 !important;
  margin:0 auto 24px !important;
  position:relative !important;
  z-index:20 !important;
}

.football-track-wrap{
  display:block !important;
  width:100% !important;
  min-height:185px !important;
  overflow:hidden !important;
  position:relative !important;
}

.football-track{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:stretch !important;
  width:100% !important;
  gap:12px !important;
  min-height:185px !important;
}

.football-card{
  flex:0 0 calc((100% - 24px)/3) !important;
  width:calc((100% - 24px)/3) !important;
  min-width:calc((100% - 24px)/3) !important;
  height:185px !important;
  min-height:185px !important;
  padding:13px 10px 10px !important;
  border-radius:12px !important;
  background:repeating-linear-gradient(
    135deg,
    #242424 0,
    #242424 6px,
    #202020 6px,
    #202020 12px
  ) !important;
  overflow:hidden !important;
  position:relative !important;
  color:#fff !important;
  box-sizing:border-box !important;
}

.football-league{
  display:block !important;
  margin:0 0 6px !important;
  height:13px !important;
  color:#fff !important;
  font-size:11px !important;
  line-height:13px !important;
  font-weight:900 !important;
}

.football-time{
  display:block !important;
  margin:0 0 8px !important;
  height:13px !important;
  color:#ffc735 !important;
  font-size:10px !important;
  line-height:13px !important;
  font-weight:900 !important;
}

.football-match{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr) !important;
  align-items:start !important;
  gap:2px !important;
  min-height:92px !important;
}

.football-team-logo{
  width:39px !important;
  height:39px !important;
  object-fit:contain !important;
  display:block !important;
  margin:0 auto 3px !important;
}

.football-team-name{
  display:block !important;
  width:100% !important;
  color:#fff !important;
  font-size:10px !important;
  line-height:12px !important;
  text-align:center !important;
  white-space:normal !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  max-height:24px !important;
}

.football-score{
  display:block !important;
  color:#fff !important;
  font-size:23px !important;
  line-height:27px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

.football-bet{
  width:72px !important;
  height:31px !important;
  margin-top:6px !important;
  border-radius:6px !important;
  background:linear-gradient(#ffd45d,#f5b62c) !important;
  color:#171717 !important;
  font-size:10px !important;
  line-height:31px !important;
  font-weight:900 !important;
}

.football-odds{
  display:grid !important;
  position:absolute !important;
  left:11px !important;
  right:11px !important;
  bottom:10px !important;
  height:14px !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
  align-items:center !important;
  color:#f6c33b !important;
  font-size:9px !important;
  line-height:14px !important;
  font-weight:900 !important;
  z-index:3 !important;
}

.football-odds > span{
  display:flex !important;
  align-items:center !important;
  min-width:0 !important;
  color:#f6c33b !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.football-odds .football-odd-home{justify-content:flex-start !important;text-align:left !important}
.football-odds .football-odd-away{justify-content:flex-end !important;text-align:right !important}
.football-odds b{color:#f6c33b !important;font-weight:900 !important}
.football-odds em{color:#fff !important;font-style:normal !important;font-weight:900 !important}

.football-arrow{
  width:31px !important;
  height:31px !important;
  top:52% !important;
  background:rgba(100,100,100,.52) !important;
  color:#ddd !important;
  border:1px solid rgba(255,255,255,.16) !important;
  z-index:10 !important;
}

.football-prev{left:1px !important}
.football-next{right:1px !important}

.football-dots{
  display:flex !important;
  min-height:10px !important;
  margin-top:5px !important;
  gap:5px !important;
  justify-content:center !important;
  align-items:center !important;
}

@media(max-width:700px){
  .football-widget{
    width:calc(100% - 20px) !important;
    max-width:none !important;
  }
  .football-track{
    gap:8px !important;
  }
  .football-card{
    flex:0 0 calc((100% - 8px)/2) !important;
    width:calc((100% - 8px)/2) !important;
    min-width:calc((100% - 8px)/2) !important;
    height:170px !important;
    min-height:170px !important;
  }
  .football-track-wrap{min-height:170px !important}
  .football-track{min-height:170px !important}
}


/* ODDS TEXT SAFETY */
.football-odds{z-index:4;min-height:15px}
.football-odds b,.football-odds em{display:inline-block}