/**
 * dream-sports-rail.r1.css
 * Shared Sports left-rail structural contract for all Dream-theme tenants.
 *
 * Structure/layout only — colors via theme tokens (--side-nav-*).
 * No hostname / tenant branches.
 *
 * Fixes:
 * - app-side-bar width:0 (child was position:fixed escaping flow)
 * - nav inline width:99.8% header/row drift
 * - .sideW min-width:17.4vw overflow
 * - absolute arrow without reserved row padding
 * - fragile header text-align:right + absolute ellipsis
 */

/* ── Host column + sticky participation ───────────────────────── */
@media screen and (min-width: 992px) {
  html body .app-body > .sidebar.showDesktop,
  html body .app-body > .sidebar.hideDekstop.showDesktop,
  html body .app-body > .sidebar {
    width: 100%;
    max-width: 17.5vw;
    min-width: 0;
    box-sizing: border-box;
    overflow: visible;
  }

  html body app-side-bar {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    position: relative !important;
  }

  html body app-side-bar .sidebar {
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: calc(100vh - 70px) !important;
    box-sizing: border-box !important;
    border-right: 1px solid var(--side-nav-link-border, #d2d6e2);
    background: var(--side-nav-bg, #fff);
  }
}

/* ── Nav shell: kill 99.8% inline drift ────────────────────────── */
html body app-side-bar .sidebar-nav,
html body app-side-bar nav.sidebar-nav.apply-scroll {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

html body app-side-bar .sideW {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: block !important;
}

html body app-side-bar ul.nav {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  box-sizing: border-box !important;
}

html body app-side-bar .scrollNav {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

/* ── Header contract ──────────────────────────────────────────── */
html body app-side-bar .top-head-sport {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 26.5px !important;
  line-height: 26.5px !important;
  box-sizing: border-box !important;
  padding: 0 10px 0 12px !important;
  margin: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  background: var(--side-nav-top-bar-bg, #0d0d0d) !important;
  color: var(--side-nav-top-text-color, #fff) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

html body app-side-bar .top-head-sport ul {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

html body app-side-bar .top-head-sport li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

html body app-side-bar .top-head-sport a {
  color: var(--side-nav-top-text-color, #fff) !important;
  text-decoration: none !important;
  position: static !important;
  top: auto !important;
}

html body app-side-bar .path-back {
  position: static !important;
  left: auto !important;
  top: auto !important;
  height: auto !important;
  line-height: 1 !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
}

/* ── Row contract ─────────────────────────────────────────────── */
html body app-side-bar .nav-item.nav-dropdown {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  position: relative !important;
  list-style: none !important;
}

html body app-side-bar .nav-link.nav-dropdown-toggle,
html body app-side-bar a.nav-dropdown-toggle {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 30px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 6px 36px 6px 16px !important; /* reserve arrow lane */
  box-sizing: border-box !important;
  position: relative !important;
  overflow: hidden !important;
  text-decoration: none !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--side-nav-text-color, #223869) !important;
  background: transparent !important;
  border-bottom: 1px solid var(--side-nav-link-border, #d2d6e2) !important;
}

html body app-side-bar .nav-dropdown-toggle > span {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.3 !important;
}

/* Arrow: absolute but inside reserved padding lane */
html body app-side-bar .nav-dropdown-toggle:before {
  content: "\f054" !important;
  font-family: FontAwesome, "Font Awesome 5 Free" !important;
  font-weight: 900 !important;
  position: absolute !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  right: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 17px !important;
  height: 17px !important;
  min-width: 17px !important;
  max-width: 17px !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 17px !important;
  text-align: center !important;
  border-radius: 4px !important;
  box-sizing: border-box !important;
  color: #fff !important;
  background: var(--side-nav-icon-color, #28a745) !important;
  border: 1px solid var(--side-nav-icon-color, #28a745) !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

html body app-side-bar .nav-item.open > .nav-dropdown-toggle:before,
html body app-side-bar .nav-dropdown.open > .nav-dropdown-toggle:before {
  content: "\f078" !important;
}

html body app-side-bar .nav-dropdown-toggle:hover {
  background: var(--side-nav-hover-bg, #f0f4f8) !important;
  color: var(--side-nav-hover-text-color, #2789ce) !important;
}

html body app-side-bar .nav-link.active {
  color: #2789ce !important;
  background: #e8f4fc !important;
  font-weight: 700 !important;
}

/* Nested competition menus keep readable indent without breaking row width */
html body app-side-bar .nav-link1 {
  margin-left: 0 !important;
  padding-left: 24px !important;
}

/* Mobile: rail hidden by Dream theme — do not force-show */
@media only screen and (max-width: 991px) {
  html body .app-body > .sidebar.hideDekstop,
  html body app-side-bar .sidebar {
    /* leave Dream hideDekstop / mobile rules in charge */
  }
}