/*
RosterCap V2.98.2 — workspace-shared.css

Owns:
- responsive workspace navigation presentation
- shared workspace-shell overrides

Navigation behavior is owned by js/app.js.
Sport terminology/configuration is owned by js/features/sport-foundation.js.

Load immediately after workspace.css.
*/

/* Desktop keeps the established segmented navigation. */
.workspace-page-select-shell {
  display:none;
}

/*
At compact widths, use one native page selector instead of forcing variable
page names into fixed-width tabs. This is especially important now that the
development page can be called Minors or Development depending on the sport.
*/
@media (max-width:900px) {
  /* Preserve the app's explicit hidden state. */
  #workspaceNav.hidden {
    display:none !important;
  }

  #workspaceNav:not(.hidden) {
    display:flex !important;
    align-items:center;
    justify-content:flex-start;
    width:100%;
    min-width:0;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  #workspaceNav:not(.hidden) > .nav-tab {
    display:none !important;
  }

  .workspace-page-select-shell {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:6px;
    width:min(172px,100%);
    min-width:0;
    margin:0;
  }

  .workspace-page-select-label {
    color:var(--muted);
    font-size:.50rem;
    font-weight:900;
    letter-spacing:.07em;
    line-height:1;
    text-transform:uppercase;
    white-space:nowrap;
  }

  #workspacePageSelect {
    width:100%;
    max-width:148px;
    min-width:0;
    min-height:30px;
    padding:4px 8px;
    border:1px solid var(--border);
    border-radius:8px;
    color:var(--text);
    background:rgba(15,29,40,.92);
    color-scheme:dark;
    font:inherit;
    font-size:.67rem;
    font-weight:850;
    line-height:1.1;
    text-align:left;
    text-align-last:left;
  }

  #workspacePageSelect option {
    text-align:left;
  }

  #workspacePageSelect:focus-visible {
    outline:2px solid rgba(50,173,255,.38);
    outline-offset:2px;
  }
}

@media (max-width:430px) {
  .workspace-page-select-shell {
    grid-template-columns:1fr;
    gap:0;
    width:min(150px,100%);
  }

  .workspace-page-select-label {
    display:none;
  }

  #workspacePageSelect {
    max-width:150px;
    min-height:29px;
    padding:4px 7px;
    font-size:.63rem;
    text-align:left;
    text-align-last:left;
  }
}