/* mw-app-switcher v2.0.1. Vendor beside mw-app-switcher.js in public/vendor/mw-suite/v2/. APPROVED ARCHITECTURE (2026-09-25) · local build, not deployed.
   COL palette (SUITE-PARITY §2): navy ink #0B1220, cobalt #315CFF / #1D3ED0, gold #F2B84B,
   cream #FFFDF8, bone #F3F0E8. Override any --mw-sw-* property in your own stylesheet. */

mw-app-switcher {
  --mw-sw-ink: #0b1220;
  --mw-sw-muted: #4a5468;
  --mw-sw-paper: #fffdf8;
  --mw-sw-bone: #f3f0e8;
  --mw-sw-line: #ddd8cb;
  --mw-sw-accent: #1d3ed0;
  --mw-sw-accent-soft: #e6ebff;
  --mw-sw-gold: #f2b84b;
  --mw-sw-gold-soft: #fdf1d8;
  --mw-sw-focus: #f2b84b;
  --mw-sw-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  /* G23: where the panel opens. data-align="end" (below) anchors it to the end edge. */
  --mw-sw-panel-inset-start: 0;
  --mw-sw-panel-inset-end: auto;
  display: inline-block;
  font-family: var(--mw-sw-font);
  color: var(--mw-sw-ink);
}

mw-app-switcher[data-align="end"] {
  --mw-sw-panel-inset-start: auto;
  --mw-sw-panel-inset-end: 0;
}

/* G23: dark follows the system unless the app pins data-theme="light"; data-theme="dark" always
   wins. Other themes (for example a black "Founder" theme) override --mw-sw-* in the app's CSS. */
@media (prefers-color-scheme: dark) {
  mw-app-switcher:not([data-theme="light"]) {
    --mw-sw-ink: #f3f0e8;
    --mw-sw-muted: #aab3c5;
    --mw-sw-paper: #111a2e;
    --mw-sw-bone: #1a2540;
    --mw-sw-line: #2b3858;
    --mw-sw-accent: #8ea6ff;
    --mw-sw-accent-soft: #1d2a52;
    --mw-sw-gold-soft: #3a2f16;
  }
}
mw-app-switcher[data-theme="dark"] {
  --mw-sw-ink: #f3f0e8;
  --mw-sw-muted: #aab3c5;
  --mw-sw-paper: #111a2e;
  --mw-sw-bone: #1a2540;
  --mw-sw-line: #2b3858;
  --mw-sw-accent: #8ea6ff;
  --mw-sw-accent-soft: #1d2a52;
  --mw-sw-gold-soft: #3a2f16;
}

.mw-sw { position: relative; }

.mw-sw-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  padding: 0 0.9rem 0 0.75rem;
  border: 1px solid var(--mw-sw-line);
  border-radius: 999px;
  background: var(--mw-sw-bone);
  color: var(--mw-sw-ink);
  font: 600 0.95rem/1 var(--mw-sw-font);
  cursor: pointer;
}
.mw-sw-button:hover { border-color: var(--mw-sw-accent); }
.mw-sw-button:focus-visible,
.mw-sw-entry:focus-visible,
.mw-sw-foot-link:focus-visible {
  outline: 3px solid var(--mw-sw-focus);
  outline-offset: 2px;
}

.mw-sw-grid {
  width: 14px;
  height: 14px;
  background:
    radial-gradient(circle, currentColor 1.6px, transparent 1.9px) 0 0 / 7px 7px;
}
.mw-sw-caret {
  width: 0.5rem;
  height: 0.5rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform 150ms ease;
}
.mw-sw-button[aria-expanded="true"] .mw-sw-caret { transform: translateY(2px) rotate(-135deg); }

.mw-sw-panel {
  position: absolute;
  top: calc(100% + 8px);
  inset-inline-start: var(--mw-sw-panel-inset-start);
  inset-inline-end: var(--mw-sw-panel-inset-end);
  z-index: 1000;
  width: min(360px, calc(100vw - 32px));
  padding: 0.5rem;
  border: 1px solid var(--mw-sw-line);
  border-radius: 14px;
  background: var(--mw-sw-paper);
  box-shadow: 0 12px 32px rgb(11 18 32 / 0.16);
}
.mw-sw-panel[hidden] { display: none; }

.mw-sw-head { padding: 0.6rem 0.75rem 0.5rem; }
.mw-sw-suite {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mw-sw-muted);
}
.mw-sw-church { margin: 0.2rem 0 0; font-size: 1rem; font-weight: 700; }

.mw-sw-list { list-style: none; margin: 0; padding: 0; }
.mw-sw-item + .mw-sw-item { margin-top: 2px; }

.mw-sw-entry {
  display: grid;
  grid-template-columns: 32px 1fr auto;
  align-items: center;
  gap: 0.75rem;
  min-height: 52px;
  padding: 0.5rem 0.75rem;
  border-radius: 10px;
  color: inherit;
  text-decoration: none;
}
a.mw-sw-entry:hover { background: var(--mw-sw-bone); }
.mw-sw-entry[aria-current="page"] { background: var(--mw-sw-accent-soft); }

.mw-sw-mark {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--mw-sw-accent);
}
.mw-sw-mark[data-app="maximize"] { background: #315cff; }
.mw-sw-mark[data-app="sl360"] { background: #f2b84b; }
.mw-sw-mark[data-app="org-design-studio"] { background: #0b1220; box-shadow: inset 0 0 0 2px #315cff; }
.mw-sw-mark[data-app="csm"] { background: #1d3ed0; box-shadow: inset 0 0 0 2px #f2b84b; }
.mw-sw-item[data-state="add"] .mw-sw-mark,
.mw-sw-item[data-state="ask_admin"] .mw-sw-mark,
.mw-sw-item[data-state="invite_only"] .mw-sw-mark { opacity: 0.45; }

.mw-sw-words { display: flex; flex-direction: column; min-width: 0; }
.mw-sw-name { font-weight: 650; font-size: 0.95rem; }
.mw-sw-desc { font-size: 0.82rem; color: var(--mw-sw-muted); }

.mw-sw-badge {
  font-size: 0.78rem;
  font-weight: 650;
  white-space: nowrap;
  color: var(--mw-sw-muted);
}
.mw-sw-badge-open { color: var(--mw-sw-accent); }
.mw-sw-badge-add {
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  background: var(--mw-sw-gold-soft);
  color: var(--mw-sw-ink);
}
.mw-sw-badge-request,
.mw-sw-badge-ask_admin,
.mw-sw-badge-invite_only { max-width: 9rem; white-space: normal; text-align: end; font-weight: 500; }

.mw-sw-foot {
  display: flex;
  flex-direction: column;
  margin-top: 0.4rem;
  padding: 0.5rem 0.25rem 0.25rem;
  border-top: 1px solid var(--mw-sw-line);
}
.mw-sw-foot-label { margin: 0.25rem 0.5rem; font-size: 0.75rem; color: var(--mw-sw-muted); }
.mw-sw-foot-link {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 0.5rem;
  border-radius: 8px;
  color: var(--mw-sw-accent);
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
}
.mw-sw-foot-link:hover { background: var(--mw-sw-bone); }

@media (prefers-reduced-motion: reduce) {
  .mw-sw-caret { transition: none; }
}
