/* KG/Claude 10/2/2026 UserIdentity26: the "Switch League" menu in the page header (all league types). Palette tokens only (cssPalette26.css).
   The panel is white; every logo sits in a fixed 52px tile, so a logo can never run into a league name. */
.lsw { position: relative; display: inline-block; margin: 5px 0; text-align: left; font-family: var(--sw-font-sans); }
.lsw *, .lsw *::before, .lsw *::after { box-sizing: border-box; }

/* the button: a white pill that reads on any header art */
.lsw .lsw-btn {
  display: inline-flex; align-items: center; gap: 7px; margin: 0; padding: 6px 11px 6px 10px; cursor: pointer;
  font: 700 13px/1.2 var(--sw-font-sans); letter-spacing: .01em;
  color: var(--sw-navy); background: var(--sw-surface);
  border: 1px solid var(--sw-line-strong); border-radius: var(--sw-radius-pill);
  box-shadow: 0 1px 3px color-mix(in srgb, var(--sw-ink) 35%, transparent);
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
.lsw .lsw-btn:hover { border-color: var(--sw-theme, var(--sw-blue)); box-shadow: 0 2px 8px color-mix(in srgb, var(--sw-ink) 30%, transparent); }
.lsw .lsw-btn:active { transform: translateY(1px); }
.lsw .lsw-btn:focus { outline: none; }
.lsw .lsw-btn:focus-visible { box-shadow: var(--sw-focus); }
.lsw .lsw-btn-ico { display: inline-flex; color: var(--sw-theme, var(--sw-blue)); }
.lsw .lsw-caret { display: inline-flex; color: var(--sw-muted); transition: transform .2s ease; }
.lsw.is-open .lsw-caret { transform: rotate(180deg); }
.lsw.is-open .lsw-btn { border-color: var(--sw-theme, var(--sw-blue)); }

/* the panel */
.lsw .lsw-panel {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 1000;
  width: 360px; max-width: calc(100vw - 24px); overflow: hidden; text-align: left;
  background: var(--sw-surface); color: var(--sw-ink);
  border: 1px solid var(--sw-line-strong); border-radius: 14px;
  box-shadow: 0 14px 34px color-mix(in srgb, var(--sw-ink) 28%, transparent), 0 2px 6px color-mix(in srgb, var(--sw-ink) 12%, transparent);
  transform-origin: top right;
}
.lsw .lsw-panel[hidden] { display: none; }
.lsw.is-open .lsw-panel { animation: lsw-in .16s ease-out; }
@keyframes lsw-in { from { opacity: 0; transform: translateY(-6px) scale(.97); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .lsw.is-open .lsw-panel { animation: none; } .lsw .lsw-caret { transition: none; } }

.lsw .lsw-head {
  padding: 11px 16px 9px; font: 700 11px/1 var(--sw-font-sans); letter-spacing: .09em; text-transform: uppercase;
  color: var(--sw-muted); background: var(--sw-panel); border-bottom: 1px solid var(--sw-line);
}
.lsw .lsw-list { max-height: min(58vh, 420px); overflow-y: auto; padding: 6px; overscroll-behavior: contain; }

/* one league */
.lsw .lsw-item {
  position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto 16px; align-items: center; gap: 0 12px;
  padding: 7px 10px; border-radius: 12px; text-decoration: none; color: var(--sw-ink); cursor: pointer;
  transition: background .12s;
}
.lsw .lsw-item:hover, .lsw .lsw-item:focus { background: var(--sw-panel); color: var(--sw-ink); text-decoration: none; outline: none; }
.lsw .lsw-item:focus-visible { box-shadow: var(--sw-focus); }
.lsw .lsw-item.is-current { background: var(--sw-theme-tint, var(--sw-blue-tint)); }
.lsw .lsw-item.is-current::before {
  content: ""; position: absolute; left: 0; top: 11px; bottom: 11px; width: 3px; border-radius: 0 3px 3px 0; background: var(--sw-theme, var(--sw-blue));
}

/* the logo tile: a fixed square, the logo is contained inside it */
.lsw .lsw-logo {
  position: relative; display: grid; place-items: center; width: 52px; height: 52px; overflow: hidden;
  background: var(--sw-surface); border: 1px solid var(--sw-line); border-radius: 12px;
}
.lsw .lsw-logo::before {
  content: attr(data-i); font: 700 20px/1 var(--sw-font-cond); color: var(--sw-muted);
}
.lsw .lsw-logo .lsw-img {
  position: absolute; inset: 0; width: 100%; height: 100%; padding: 2px; object-fit: contain; background: var(--sw-surface);
}

.lsw .lsw-name {
  min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  font: 700 14px/1.25 var(--sw-font-sans); color: var(--sw-ink);
}
.lsw .lsw-kind {
  justify-self: end; width: 70px; padding: 2px 0; text-align: center; border-radius: var(--sw-radius-pill); white-space: nowrap; /* one width for every type */
  font: 700 10px/1.5 var(--sw-font-sans); letter-spacing: .04em; text-transform: uppercase;
  color: var(--sw-muted); background: var(--sw-panel); border: 1px solid var(--sw-line);
}
.lsw .lsw-item.is-current .lsw-kind { background: var(--sw-surface); }
.lsw .lsw-kind:empty { display: none; }
.lsw .lsw-tick { display: inline-flex; justify-content: center; color: var(--sw-theme, var(--sw-blue)); visibility: hidden; }
.lsw .lsw-item.is-current .lsw-tick { visibility: visible; }

/* "No leagues yet" shows only when the list holds nothing else */
.lsw .lsw-empty { display: none; padding: 16px 14px; text-align: center; color: var(--sw-muted); font-size: 13px; }
.lsw .lsw-list > .lsw-empty:first-child { display: block; }

.lsw .lsw-foot {
  display: block; padding: 11px 16px; text-align: center; text-decoration: none;
  font: 700 13px/1.2 var(--sw-font-sans); color: var(--sw-theme, var(--sw-blue)); background: var(--sw-panel); border-top: 1px solid var(--sw-line);
}
.lsw .lsw-foot:hover, .lsw .lsw-foot:focus { background: var(--sw-theme-tint, var(--sw-blue-tint)); color: var(--sw-theme-dark, var(--sw-blue-dark)); text-decoration: none; outline: none; }
.lsw .lsw-foot:focus-visible { box-shadow: var(--sw-focus); }