/* mc2-ui app-switcher v3.1.0 — UNICA FONTE CANONICA. Copie vendored nelle app.
   Usa esclusivamente variabili canoniche --mc2-*. MAI valori grezzi.
   Trigger icona sola in alto a sinistra; pannello griglia di icone stile home.
   Nomi, descrizioni e stati restano in aria-label e testo screen-reader. */

.mc2-switcher { position: relative; display: inline-flex; margin: 0; flex: none; }

.mc2-switcher-trigger {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; min-height: 32px; padding: 0;
  font-size: var(--mc2-type-size-label); font-weight: 600;
  color: var(--mc2-color-fg-muted); background: var(--mc2-color-bg-surface);
  border: 1px solid var(--mc2-color-border-subtle); border-radius: 6px;
  cursor: pointer; white-space: nowrap;
}
.mc2-switcher-trigger:hover { background: var(--mc2-color-bg-raised); color: var(--mc2-color-fg-default); }
.mc2-switcher-trigger:focus-visible {
  outline: 2px solid var(--mc2-color-focus-ring); outline-offset: 2px;
}
.mc2-switcher-trigger[aria-expanded="true"] {
  background: var(--mc2-color-primary-subtle); color: var(--mc2-color-primary-base);
}
.mc2-switcher-trigger svg { width: 16px; height: 16px; flex: none; }

.mc2-switcher-panel {
  position: absolute; top: calc(100% + var(--mc2-space-2)); left: 0;
  width: max-content; max-width: min(420px, calc(100vw - 24px));
  max-height: min(70vh, 560px); overflow: auto;
  background: var(--mc2-color-bg-raised); border: 1px solid var(--mc2-color-border-default);
  border-radius: 12px; box-shadow: 0 4px 12px rgba(10, 37, 64, 0.16);
  padding: var(--mc2-space-3); z-index: var(--mc2-z-dropdown);
}
.mc2-switcher-panel[hidden] { display: none; }
/* Titolo solo per screen reader: la griglia mostra icone + subtext. */
.mc2-switcher-title {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.mc2-switcher-grid {
  display: grid; grid-template-columns: repeat(4, auto); gap: var(--mc2-space-3);
  margin: 0; padding: 0; list-style: none; justify-content: start;
}
/* Voce: icona piatta + nome come subtext. Niente bordi wrapper, niente gradienti. */
.mc2-switcher-item {
  display: flex; flex-direction: column; align-items: center; gap: var(--mc2-space-2);
  padding: var(--mc2-space-1); text-decoration: none; color: inherit; border-radius: 6px;
}
.mc2-switcher-item:hover .mc2-switcher-icon { filter: brightness(1.08); }
.mc2-switcher-item:focus-visible {
  outline: 2px solid var(--mc2-color-focus-ring); outline-offset: 2px;
}
.mc2-switcher-icon {
  width: 64px; height: 64px; border-radius: 16px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 28px; font-weight: 700;
  background: var(--mc2-color-neutral-300);
  color: var(--mc2-color-fg-inverse);
}
.mc2-switcher-icon.is-database { background: var(--mc2-color-secondary-base); }
.mc2-switcher-icon.is-rocket { background: var(--mc2-color-primary-base); }
.mc2-switcher-icon.is-grid { background: var(--mc2-color-neutral-500); }
.mc2-switcher-item[aria-current="page"] .mc2-switcher-icon {
  box-shadow: 0 0 0 3px var(--mc2-color-bg-raised), 0 0 0 5px var(--mc2-color-primary-base);
}
.mc2-switcher-item.is-disabled { cursor: not-allowed; opacity: 0.55; }
.mc2-switcher-name {
  font-size: var(--mc2-type-size-caption); font-weight: 600;
  color: var(--mc2-color-fg-default); text-align: center; white-space: nowrap;
}
.mc2-switcher-empty { color: var(--mc2-color-fg-muted); text-align: center; padding: var(--mc2-space-4); }

@media (max-width: 640px) {
  .mc2-switcher-grid { display: flex; flex-wrap: wrap; justify-content: center; }
  .mc2-switcher-panel {
    position: fixed; top: var(--mc2-header-height); left: 0; right: 0;
    width: auto; max-height: calc(100vh - var(--mc2-header-height));
    border-radius: 0; border-left: none; border-right: none;
  }
}
@media (max-width: 767px), (pointer: coarse) {
  .mc2-switcher-trigger { width: 44px; min-height: 44px; }
}