/* ===============================
   GENERAL / EXISTING STYLES
================================*/
table img { margin-inline: auto; }
img.custom-logo { margin-bottom: -30px; }
.unclickable > a { pointer-events: none; }

.wp-block-table.mytablestyle tbody tr { background-color: #BCBCBC; }
.wp-block-table.mytablestyle td,
.wp-block-table.mytablestyle th { border: 0; }

.entry-content-wrap { padding-bottom: 1.5rem; }

.home .wp-block-embed__wrapper:before,
.page-id-6559 .wp-block-embed__wrapper:before { padding-top: 36.85%; }

@media (max-width: 600px) { .wp-block-column { padding-bottom: 10px; } }

.header-navigation .header-menu-container ul ul li.menu-item > a {
  width: auto !important;
  white-space: nowrap;
}

.search-results .content-container.site-container,
.archive .content-container.site-container {
  background: #fff;
  box-shadow: 0 0 0 4px var(--global-palette2);
  border-radius: 13px;
  padding: 220px 5.96rem 5.96rem;
}

.custom-cell { width: 100px; height: 50px; }

/* Scrollbar */
::-webkit-scrollbar { width: 14px; }
::-webkit-scrollbar-track { background: #808080; }
::-webkit-scrollbar-thumb { background: #F3F3F4; }
::-webkit-scrollbar-thumb:hover { background: #f789e6; }

/* ===============================
   TABLE ROW HEIGHT LOCK (FINAL)
================================*/
table { table-layout: fixed; width: 100%; }

table td,
table th {
  height: 70px !important;
  max-height: 70px !important;
  padding: 12px;
  overflow: hidden;
  text-align: center;
  vertical-align: middle !important;
}

table td img {
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain;
  display: inline-block !important;
  vertical-align: middle !important;
}

/* ===============================
   DESKTOP DROPDOWNS
================================*/
.header-navigation .wp-block-navigation-item,
.entry-content .wp-block-navigation-item { position: relative; }

.header-navigation .wp-block-navigation__submenu-container,
.entry-content .wp-block-navigation__submenu-container {
  left: 50% !important;
  transform: translateX(-50%);
  width: auto !important;
  min-width: fit-content !important;
  padding: 4px !important;
}

.entry-content .wp-block-navigation__submenu-container { right: auto !important; }

.wp-block-navigation__submenu-container li { padding: 0 !important; }
.wp-block-navigation__submenu-container a {
  padding: 5px 14px !important;
  white-space: nowrap;
}

/* ===============================
   MOBILE — WEEK DROPDOWN (FINAL)
================================*/
.week-dd.mobile-only { display: none; }

@media (max-width: 782px) {

  /* Show mobile Week dropdown + keep Week centered */
  .week-dd.mobile-only{
    display: flex;
    justify-content: center !important;
    align-items: center !important;
    width: 100%;
    position: relative !important;
  }

  .week-dd__toggle{
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }

  .week-dd.mobile-only .week-dd__btn{
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
    cursor: pointer;
    font: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0 auto;
    text-align: center;
    font-size: 22px !important;
    line-height: 1.25 !important;
  }

  /* Dropdown overlays content */
  .week-dd.mobile-only .week-dd__menu{
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    display: none;
    background: #fff;
    border: 1px solid rgba(0,0,0,.15);
    width: max-content;
    max-width: calc(100vw - 32px);
    z-index: 999999 !important;

    max-height: min(55vh, 360px);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }

  .week-dd__toggle:checked ~ .week-dd__menu { display: block; }

  .week-dd__menu a{
    display: block;
    padding: 5px 14px !important;
    color: #000 !important;
    text-align: center;
    text-decoration: none !important;
    white-space: nowrap;
  }

  /* Thin outline chevron + sized for mobile */
  .week-dd.mobile-only .week-dd__btn::after{
    content: "" !important;
    display: inline-block !important;
    width: 9px !important;
    height: 9px !important;
    margin-left: 10px !important;
    border-right: 1.5px solid currentColor !important;
    border-bottom: 1.5px solid currentColor !important;
    transform: rotate(45deg);
    position: relative;
    top: -1px;
  }

  .week-dd__toggle:checked + .week-dd__btn::after{
    transform: rotate(-135deg);
    top: 1px;
  }

  /* Kill WP nav artifacts */
  .entry-content .wp-block-navigation,
  .entry-content .wp-block-navigation-submenu__toggle,
  .entry-content .wp-block-navigation__submenu-icon,
  .entry-content .wp-block-navigation__responsive-container-open,
  .entry-content .wp-block-navigation__responsive-container-close,
  .week-dd.mobile-only svg {
    display: none !important;
  }

  /* iOS bottom bar safety */
  .wp-block-navigation__responsive-container.is-menu-open {
    padding-bottom: calc(16px + env(safe-area-inset-bottom));
  }
}

/* ===============================
   TABLET / iPAD — FIX BIG GAP ABOVE FOOTER
================================*/
@media (max-width: 1366px) {
  html, body {
    height: auto !important;
    min-height: 0 !important;
  }

  #page,
  #inner-wrap,
  #content,
  #primary,
  .site,
  .site-container,
  .site-inner,
  main,
  .site-content,
  .content-area,
  .page,
  .page-content,
  .entry-content-wrap {
    height: auto !important;
    min-height: 0 !important;
  }
}

/* ===============================
   SITE-WIDE — textured grey background
================================ */

/* Base background */
body {
  background-color: #808080 !important;
  position: relative;
}

/* Texture overlay */
body::before {
  content: "";
  position: fixed;
  inset: 0;

  background-image: url("https://laxextras.com/wp-content/uploads/2026/02/LE_Background_Overlay3.png");
  background-repeat: repeat;
  background-size: 700px auto;

  opacity: 0.3;
  pointer-events: none;

  z-index: 0;
}

/* Ensure site content stays above the texture */
#inner-wrap {
  position: relative;
  z-index: 1;
}


/* =========================================================
   GLOBAL — KADENCE TABS (AUTOMATIC SITE-WIDE)
   Grey base (#808080)
   Active: pink background + WHITE text
   Inactive: #F3F3F4 text, pink on hover
   Radius: top only (13px)
========================================================= */

/* Center the pill bar reliably */
.wp-block-kadence-tabs {
  text-align: center !important;
}

/* Remove Kadence underline / bar */
.wp-block-kadence-tabs .kt-tabs-title-list::before,
.wp-block-kadence-tabs .kt-tabs-title-list::after {
  display: none !important;
}

/* Base grey tab bar */
.wp-block-kadence-tabs .kt-tabs-title-list {
  display: inline-flex !important;
  gap: 0 !important;
  padding: 6px !important;
  background: #808080 !important;

  /* TOP rounded, BOTTOM square */
  border-radius: 13px 13px 0 0 !important;

  overflow: hidden !important;

  /* centering helpers */
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center !important;
}

/* Each tab wrapper */
.wp-block-kadence-tabs .kt-tabs-title-list li {
  border-radius: 13px 13px 0 0 !important;
  overflow: hidden !important;
}

/* Tab text — INACTIVE default */
.wp-block-kadence-tabs .kt-tabs-title-list .kt-tab-title {
  background: transparent !important;
  border: 0 !important;

  /* TOP rounded, BOTTOM square */
  border-radius: 13px 13px 0 0 !important;

  padding: 10px 22px !important;
  margin: 0 !important;

  color: #ffffff !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

/* Hover — INACTIVE tabs only */
.wp-block-kadence-tabs
.kt-tabs-title-list
li:not(.kt-tab-title-active)
.kt-tab-title:hover {
  color: #f789e6 !important;
}

/* ACTIVE tab — pink background */
.wp-block-kadence-tabs .kt-tabs-title-list li.kt-tab-title-active {
  background: #f789e6 !important;

  /* TOP rounded, BOTTOM square */
  border-radius: 13px 13px 0 0 !important;
}

/* ACTIVE tab text — WHITE and stable */
.wp-block-kadence-tabs
.kt-tabs-title-list
li.kt-tab-title-active
.kt-tab-title,
.wp-block-kadence-tabs
.kt-tabs-title-list
li.kt-tab-title-active
.kt-tab-title:hover {
  color: #ffffff !important;
}
/* =====================================================
   Kadence Off-Canvas (tablet/mobile)
   - Top-aligned white panel
   - Panel height fits content
   - Dim background preserved
===================================================== */

@media (max-width: 1024px) {

  .kb-off-canvas-popup {
    display: flex !important;
    align-items: flex-start !important;  /* top aligned */
    justify-content: center !important;
  }

  .kb-off-canvas-inner-wrap {
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 40px) !important;
    overflow: auto !important;

    flex: 0 1 auto !important;
    align-self: flex-start !important;
    margin-top: 0 !important;
  }

  .kb-off-canvas-inner {
    height: auto !important;
    min-height: 0 !important;
  }
}
/* PHONE: add a controlled top gap above the first white section */
@media (max-width: 767px) {

  /* Keep wrappers from adding random extra spacing */
  body #inner-wrap .content-wrap,
  body #inner-wrap .content-container.site-container,
  body #inner-wrap #primary {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* Add the gap here (adjust 26px to taste) */
  body #inner-wrap .content-wrap {
    padding-top: 26px !important;
  }
}
@font-face {
  font-display: swap;
}
/* === Owl Carousel mobile stability fix (Blog Designer Pack) === */

.bdpp-wrap .owl-stage-outer {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.bdpp-wrap .owl-stage,
.bdpp-wrap .owl-item,
.bdpp-wrap img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.bdpp-wrap img {
  opacity: 1 !important;
  visibility: visible !important;
}
/* Accessibility: label Blog Designer Pack (Owl Carousel) arrows */
.owl-prev::before,
.owl-next::before {
  position: absolute;
  left: -9999px;
}

.owl-prev::before {
  content: "Previous slide";
}

.owl-next::before {
  content: "Next slide";
}
/* Accessibility: label Owl Carousel pagination dots */
.owl-dot::before {
  position: absolute;
  left: -9999px;
  content: "Go to slide";
}

/* Optional: label active dot more clearly */
.owl-dot.active::before {
  content: "Current slide";
}
.le-spotify-wrap { max-width: 820px; margin: 0 auto; }

.le-spotify-btn{
  width:100%;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  padding:14px 16px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  background:#fff;
  cursor:pointer;
  text-align:left;
}

.le-spotify-icon{
  font-size:20px;
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.12);
  display:flex;
  align-items:center;
  justify-content:center;
}

.le-spotify-text strong{ font-size:16px; }
.le-spotify-text{ font-size:13px; line-height:1.2; opacity:.85; }
.le-spotify-cover{
  max-height: 220px;
  overflow: hidden;
}

.le-spotify-cover img{
  width: 100%;
  height: 220px;
  object-fit: cover;
  display: block;
}
.le-spotify-text strong{
  color: #000 !important;
}
.le-spotify-text{
  font-size: 17px;   /* default was ~13px */
  line-height: 1.5;
}
/* Align status text with team names instead of logos */
#le-scores .le-game-status,
#le-scores .le-status {
  margin-left: 36px;
}
#le-scores .le-score{
  font-variant-numeric: tabular-nums;
}
/* ===============================
   SCORES — FLASH PINK ON CHANGE
================================*/
@keyframes leScoreFlash {
  0%   { background-color: rgba(247, 137, 230, 0); }
  25%  { background-color: rgba(247, 137, 230, .55); }
  100% { background-color: rgba(247, 137, 230, 0); }
}

/* apply to the element your JS marks as changed */
#le-scores .le-flash{
  animation: leScoreFlash 650ms ease-out;
  border-radius: 10px;
}
/* Make the ranking "(#5)" not bold */
#le-scores .le-teamname .le-rank-inline{
  font-weight: 400;
  font-size: 0.90em;
  margin-right: 2px;
  color: #444444;
}
#le-scores .le-rank-hash{
  font-size: 0.75em;
}
/* ===============================
   BASE
================================*/
#le-scores,
#le-scores *{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

#le-scores{
  --le-border: rgba(0,0,0,.10);
  --le-muted: rgba(0,0,0,.65);
  --le-bg: #f2f2f2;
  --le-chip: rgba(0,0,0,.06);
  --le-logo-bg: #808080; /* keep your grey */
  max-width: 920px;
  margin: 0 auto;
}

/* ===============================
   TOOLBAR
================================*/
#le-scores .le-toolbar{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:center;
  margin:12px 0 10px;
}

/* ===============================
   DATE STRIP
================================*/
#le-scores .le-datebar{
  width:100%;
  display:flex;
  justify-content:center;
}

#le-scores .le-date-strip{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:4px 2px;
  max-width:min(760px,100%);
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}

#le-scores .le-date-strip::-webkit-scrollbar{ height:6px; }
#le-scores .le-date-strip::-webkit-scrollbar-thumb{
  background:rgba(0,0,0,.10);
  border-radius:999px;
}

/* date pills */
#le-scores .le-date-pill{
  scroll-snap-align:start;
  border:1px solid var(--le-border);
  background:var(--le-bg);
  padding:8px 10px;
  border-radius:12px;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  min-width:64px;
  line-height:1.05;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
}

#le-scores .le-date-pill .dow{
  font-size:12px;
  color:var(--le-muted);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.4px;
}

#le-scores .le-date-pill .md{
  font-size:14px;
  font-weight:800;
}

#le-scores .le-date-pill.is-active{
  background:var(--le-chip);
  border-color:rgba(0,0,0,.18);
}

/* ===============================
   DATE HOVER: pink text, no shadow, no flash
================================*/

/* Hard-lock base states to beat theme button styles */
.le-live-scores #le-scores .le-date-strip .le-date-pill,
.le-live-scores #le-scores .le-date-strip .le-date-pill:hover,
.le-live-scores #le-scores .le-date-strip .le-date-pill:focus,
.le-live-scores #le-scores .le-date-strip .le-date-pill:focus-visible,
.le-live-scores #le-scores .le-date-strip .le-date-pill:active{
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}

/* Inactive pills: keep background consistent (prevents white flash) */
.le-live-scores #le-scores .le-date-strip .le-date-pill{
  background-color: var(--le-bg) !important;
}

/* Hover: keep background same, only border + text change */
.le-live-scores #le-scores .le-date-strip .le-date-pill:hover{
  background-color: var(--le-bg) !important;
  border-color: rgba(232,90,203,.45) !important;
}

/* Hover text pink */
.le-live-scores #le-scores .le-date-strip .le-date-pill:hover .dow,
.le-live-scores #le-scores .le-date-strip .le-date-pill:hover .md{
  color: #f789e6 !important;
}

/* Active pill stays locked (no hover change) */
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active,
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active:hover,
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active:focus,
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active:focus-visible,
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active:active{
  background-color: var(--le-chip) !important;
  border-color: rgba(0,0,0,.18) !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}

/* Active pill text stays normal (not pink) */
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active .dow,
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active:hover .dow{
  color: var(--le-muted) !important;
}
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active .md,
.le-live-scores #le-scores .le-date-strip .le-date-pill.is-active:hover .md{
  color: #111 !important;
}

/* ===============================
   DIVISION TABS (your final styling)
================================*/
.le-live-scores #le-scores .le-group-div{
  position: relative;
  display:flex;
  justify-content:center;
  gap: 16px;
  padding-bottom: 8px;
}

.le-live-scores #le-scores .le-group-div::after{
  content:"";
  position:absolute;
  left: 0;
  right: 0;
  bottom: 2px;
  height: 2px;
  background: rgba(0,0,0,.18);
  border-radius: 999px;
  z-index: 0;
}

.le-live-scores #le-scores .le-btn.le-div{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  border-radius: 0 !important;

  padding: 6px 2px !important;
  cursor: pointer;

  font-family: "Livermore Script ATF","Livermore Script","LivermoreScriptATF","Livermore Script ATF Regular","Livermore ATF",cursive !important;
  font-weight: 900 !important;
  font-size: 24px !important;
  color: #808080 !important;

  position: relative;
  z-index: 1;
}

.le-live-scores #le-scores .le-btn.le-div:hover{
  color: #f789e6 !important;
}

.le-live-scores #le-scores .le-btn.le-div.is-active{
  color: #f789e6 !important;
}

.le-live-scores #le-scores .le-btn.le-div.is-active::after{
  content:"";
  position:absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  height: 2px;
  border-radius: 999px;
  background: #f789e6;
  z-index: 2;
}

/* ===============================
   META
================================*/
#le-scores .le-meta{
  text-align:center;
  color:var(--le-muted);
  font-size:13px;
  margin-bottom: 14px;
}

/* ===============================
   GRID
================================*/
#le-scores .le-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

@media(max-width:700px){
  #le-scores .le-list{ grid-template-columns:1fr; }
  #le-scores .le-date-strip{ max-width:100%; }
}

/* ===============================
   CARDS / ROWS
================================*/
#le-scores .le-card{
  border:1px solid var(--le-border);
  border-radius:14px;
  padding:12px 14px;
}
/* LIVE card subtle highlight */
#le-scores .le-card.is-live {
  background: rgba(247,137,230,.06);
  animation: none;
}

#le-scores .le-status{
  font-size:13px;
  padding:0;
  border-radius:0;
  background:transparent;
  display:inline-block;
  margin-bottom:8px;
  font-weight:600;
}

/* LIVE badge */
#le-scores .le-status.is-live{
  background:transparent;
  padding:0;
  font-weight:625;
  color:#f789e6;

  display:inline-flex;
  align-items:center;
  gap:6px;
}

/* Pulsing LIVE dot */
#le-scores .le-status.is-live::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#f789e6;
  display:inline-block;
  animation: leLiveDot 1.7s ease-out infinite;
}

/* Dot animation */
@keyframes leLiveDot{
  0% { box-shadow:0 0 0 0 rgba(247,137,230,.6); }
  70% { box-shadow:0 0 0 6px rgba(247,137,230,0); }
  100% { box-shadow:0 0 0 0 rgba(247,137,230,0); }
}

#le-scores .le-rows{ display:grid; gap:8px; }
#le-scores .le-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  align-items:center;
}
#le-scores .le-team{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
#le-scores .le-logo{
  width:26px; height:26px;
  border-radius:6px;
  background:var(--le-logo-bg);
  padding:4px;
  object-fit:contain;
  flex:0 0 auto;
}
#le-scores .le-teamtext{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
#le-scores .le-rank{
  font-size:12px;
  font-weight:900;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid var(--le-border);
  background: var(--le-chip);
  line-height:1;
  flex:0 0 auto;
}
#le-scores .le-teamname{
  font-weight:600;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#le-scores .le-score{
  font-size:18px;
  font-weight:700;
  min-width:22px;
  text-align:right;
}

/* FINAL styling */
#le-scores .le-row.is-winner .le-score{ font-weight:900; }
#le-scores .le-row.is-loser .le-teamtext,
#le-scores .le-row.is-loser .le-score{ opacity:.55; }