/* DASM Live R6.32 — mobile navigation + Teams toolbar finalisation. */
@media (max-width:760px){
  html body .tabs{position:relative!important}

  /* Reserve a slim control lane inside the primary navigation so +/- never overlaps DASM AI on non-Live tabs. */
  html body .primary-wrap{
    position:relative!important;
    padding-right:43px!important;
  }

  /* On the Live homepage there is no secondary-nav control: use the full primary-nav width. */
  html body .tabs:has(#primaryNav .tab[data-view='live'].active) .primary-wrap{
    padding-right:7px!important;
  }
  html body .tabs:has(#primaryNav .tab[data-view='live'].active) #mobileMoreBtn{
    display:none!important;
  }

  /* Secondary navigation is closed by default and appears only when the compact +/- control is opened. */
  html body #secondaryNav{
    display:none!important;
    width:100%!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:5px!important;
    margin:6px 0 0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
  }
  html body #secondaryNav.mobile-open{display:grid!important}
  html body #secondaryNav .tab{
    min-width:0!important;
    width:100%!important;
    padding:8px 2px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    font-size:0!important;
    line-height:1!important;
  }
  /* Mobile-only short labels. Desktop/tablet keep the full navigation names from NAV. */
  html body #secondaryNav .tab::after{
    display:block!important;
    font-size:10.5px!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:-.01em!important;
    color:inherit!important;
    white-space:nowrap!important;
  }
  html body #secondaryNav .tab[data-view='windows']::after{content:'Transfers'!important}
  html body #secondaryNav .tab[data-view='payouts']::after{content:'Fees'!important}
  html body #secondaryNav .tab[data-view='rules']::after{content:'Rules'!important}
  html body #secondaryNav .tab[data-view='logos']::after{content:'Logos'!important}
  html body #secondaryNav .tab[data-view='hof']::after{content:'HOF'!important}

  /* Stable +/- position: dedicated lane at the right of primary nav on non-Live tabs. */
  html body #mobileMoreBtn{
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    z-index:18!important;
    right:7px!important;
    top:15px!important;
    bottom:auto!important;
    width:30px!important;
    min-width:30px!important;
    max-width:30px!important;
    min-height:30px!important;
    height:30px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid #9fd5bf!important;
    border-radius:50%!important;
    background:#fff!important;
    color:#087052!important;
    box-shadow:0 2px 8px rgba(18,55,78,.10)!important;
    font-size:0!important;
    font-weight:950!important;
    line-height:1!important;
  }
  html body #mobileMoreBtn>span,
  html body #mobileMoreBtn>b{display:none!important}
  html body #mobileMoreBtn::after{
    content:'+'!important;
    display:block!important;
    font-size:20px!important;
    font-weight:800!important;
    line-height:1!important;
    transform:translateY(-1px)!important;
  }
  html body #mobileMoreBtn[aria-expanded='true']{
    top:15px!important;
    bottom:auto!important;
    background:#f3faf7!important;
    border-color:#84c7aa!important;
    color:#087052!important;
  }
  html body #mobileMoreBtn[aria-expanded='true']::after{
    content:'−'!important;
    font-size:21px!important;
    transform:translateY(-2px)!important;
  }
  html body #mobileMoreBtn.active{color:#0c5f50!important}
  html body #mobileMoreBtn.live-only-hidden{display:none!important}

  /* The separate desktop/tablet +/- control is intentionally not duplicated on phones. */
  html body .secondary-nav-minimise{display:none!important}

  /* Teams: exactly Season | Monthly | Club | In Play | My Teams on one row. */
  html body #view-teams .teams-toolbar{
    display:grid!important;
    grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,2fr)!important;
    grid-template-rows:40px!important;
    align-items:stretch!important;
    gap:4px!important;
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0 0 9px!important;
    padding:0!important;
  }
  html body #view-teams .teams-mode-toggle{
    grid-column:1!important;grid-row:1!important;
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:4px!important;width:100%!important;height:40px!important;
    margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;
  }
  html body #view-teams .teams-club-filter{
    grid-column:2!important;grid-row:1!important;
    width:100%!important;min-width:0!important;height:40px!important;margin:0!important;
  }
  html body #view-teams .team-actions{
    grid-column:3!important;grid-row:1!important;
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:4px!important;width:100%!important;min-width:0!important;height:40px!important;margin:0!important;
  }
  html body #view-teams .teams-mode-toggle button,
  html body #view-teams .teams-club-filter .club-picker,
  html body #view-teams .teams-club-filter .club-picker-button,
  html body #view-teams #teamsInPlay,
  html body #view-teams #teamsMine{
    width:100%!important;min-width:0!important;max-width:none!important;
    height:40px!important;min-height:40px!important;max-height:40px!important;
    margin:0!important;padding:0 3px!important;border-radius:11px!important;
    white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important;
    font-size:10px!important;font-weight:900!important;line-height:1!important;
  }
  html body #view-teams .teams-club-filter>span{display:none!important}
  html body #view-teams #teamClubPickerButton>span:not(:has(img)):not(.club-picker-selected)>b{font-size:0!important}
  html body #view-teams #teamClubPickerButton>span:not(:has(img)):not(.club-picker-selected)>b::after{content:'Club';font-size:10px!important}
  html body #view-teams #teamsInPlay{font-size:0!important}
  html body #view-teams #teamsInPlay::after{content:'In Play';font-size:10px!important;font-weight:900!important}
  html body #view-teams #teamsMine{font-size:0!important}
  html body #view-teams #teamsMine::after{content:'My Teams';font-size:10px!important;font-weight:900!important}
}