:root {
  --asa-menu-width: 236px;
  --asa-menu-green-950: #003a1f;
  --asa-menu-green-900: #004925;
  --asa-menu-green-800: #075f30;
  --asa-menu-lime: #50d968;
  --asa-menu-text: #ffffff;
}

html { min-width: 0; }
body.asa-shell-active {
  padding-left: var(--asa-menu-width) !important;
  transition: padding-left 180ms ease !important;
}
body.asa-shell-active.asa-menu-collapsed { padding-left: 0 !important; }

/* Neutraliza somente o menu antigo. O restante da pagina permanece intacto. */
body.asa-shell-active .app { grid-template-columns: minmax(0, 1fr) !important; }
body.asa-shell-active .layout { grid-template-columns: minmax(0, 1fr) !important; }
body.asa-shell-active .app > aside.sidebar,
body.asa-shell-active .layout > aside.sidebar { display: none !important; }
body.asa-shell-active #sidebar-overlay,
body.asa-shell-active #overlay,
body.asa-shell-active .sidebar-overlay { display: none !important; }
body.asa-shell-active #mobile-menu,
body.asa-shell-active #menu { display: none !important; }

/* Evita navegacao duplicada nas paginas que tinham menu superior proprio. */
body.asa-page-eventos.asa-shell-active .app-nav,
body.asa-page-relatorios.asa-shell-active > .topbar,
body.asa-page-asaplay-gestao.asa-shell-active > .top,
body.asa-page-asaplay-automacao.asa-shell-active .page > .topbar,
body.asa-page-asaplay-upload.asa-shell-active .page > .top,
body.asa-page-evento-hamburguer-celular.asa-shell-active .quick-nav { display: none !important; }

.asa-menu-v3 {
  position: fixed;
  z-index: 10000;
  inset: 0 auto 0 0;
  width: var(--asa-menu-width);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  color: var(--asa-menu-text);
  background:
    radial-gradient(circle at 112% 88%, transparent 0 82px, rgba(255,255,255,.045) 83px 84px, transparent 85px 121px, rgba(255,255,255,.025) 122px 123px, transparent 124px),
    repeating-linear-gradient(125deg, rgba(255,255,255,.024) 0 1px, transparent 1px 31px),
    linear-gradient(180deg, #076333 0%, #00542b 48%, #003a1f 100%);
  box-shadow: 8px 0 25px rgba(0,39,20,.13);
  transform: translateX(0);
  transition: transform 180ms ease;
  font-family: Inter, Manrope, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body.asa-menu-collapsed .asa-menu-v3 {
  transform: translateX(-105%);
  pointer-events: none;
}

.asa-menu-v3__head {
  position: relative;
  flex: 0 0 auto;
  min-height: 84px;
  padding: 18px 47px 14px 18px;
  border-bottom: 1px solid rgba(255,255,255,.09);
}
.asa-menu-v3__brand { display: block; color: #fff; text-decoration: none; line-height: 1; }
.asa-menu-v3__wordmark { display: flex; align-items: baseline; font-size: 20px; font-weight: 950; letter-spacing: -.055em; }
.asa-menu-v3__wordmark .delta { color: var(--asa-menu-lime); }
.asa-menu-v3__wordmark small { margin-left: 5px; color: #fff; font-size: 7.5px; font-weight: 900; letter-spacing: -.02em; }
.asa-menu-v3__subbrand { display: block; margin-top: 9px; color: rgba(255,255,255,.50); font-size: 8px; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }

.asa-menu-v3__collapse {
  position: absolute;
  top: 17px;
  right: 10px;
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 10px;
  background: rgba(255,255,255,.10);
  color: #fff;
  cursor: pointer;
  transition: background 140ms ease, transform 140ms ease;
}
.asa-menu-v3__collapse:hover { background: rgba(255,255,255,.18); }
.asa-menu-v3__collapse:active { transform: scale(.96); }
.asa-menu-v3__collapse svg { width: 17px; height: 17px; }

.asa-menu-v3__nav {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 9px 10px 8px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.asa-menu-v3__nav::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }
.asa-menu-v3__group + .asa-menu-v3__group { margin-top: 6px; }
.asa-menu-v3__label {
  margin: 0;
  padding: 7px 9px 4px;
  color: rgba(255,255,255,.48);
  font-size: 7.5px;
  font-weight: 900;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.asa-menu-v3__item {
  display: flex;
  min-height: 37px;
  align-items: center;
  gap: 10px;
  margin: 1px 0;
  padding: 0 10px;
  border-radius: 11px;
  color: rgba(255,255,255,.82);
  text-decoration: none;
  font-size: 11.5px;
  font-weight: 760;
  transition: background 140ms ease, color 140ms ease;
}
.asa-menu-v3__item:hover { background: rgba(255,255,255,.08); color: #fff; }
.asa-menu-v3__item.active { background: #fff; color: var(--asa-menu-green-800); box-shadow: 0 8px 20px rgba(0,0,0,.11); }
.asa-menu-v3__item.is-disabled { opacity: .52; cursor: default; }
.asa-menu-v3__item.is-disabled:hover { background: transparent; color: rgba(255,255,255,.82); }
.asa-menu-v3__icon { width: 17px; height: 17px; display: grid; place-items: center; flex: 0 0 17px; }
.asa-menu-v3__icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.asa-menu-v3__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.asa-menu-v3__footer { flex: 0 0 auto; padding: 8px 10px 10px; border-top: 1px solid rgba(255,255,255,.09); }
.asa-menu-v3__user {
  display: grid;
  grid-template-columns: 36px minmax(0,1fr) 31px;
  align-items: center;
  gap: 8px;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 13px;
  background: rgba(255,255,255,.07);
}
.asa-menu-v3__avatar { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; background: var(--asa-menu-lime); color: var(--asa-menu-green-950); font-size: 11px; font-weight: 900; }
.asa-menu-v3__user-copy { min-width: 0; }
.asa-menu-v3__user-copy strong, .asa-menu-v3__user-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asa-menu-v3__user-copy strong { font-size: 10.5px; font-weight: 850; }
.asa-menu-v3__user-copy span { margin-top: 2px; color: rgba(255,255,255,.55); font-size: 8.5px; }
.asa-menu-v3__logout { width: 31px; height: 31px; display: grid; place-items: center; border: 0; border-radius: 9px; background: transparent; color: rgba(255,255,255,.66); cursor: pointer; }
.asa-menu-v3__logout:hover { background: rgba(255,255,255,.09); color: #fff; }
.asa-menu-v3__logout svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.asa-menu-v3-open {
  position: fixed;
  z-index: 10001;
  left: 10px;
  top: 14px;
  width: 42px;
  height: 42px;
  display: none;
  place-items: center;
  border: 1px solid rgba(4,78,41,.18);
  border-radius: 12px;
  background: #fff;
  color: var(--asa-menu-green-800);
  box-shadow: 0 9px 24px rgba(0,59,31,.16);
  cursor: pointer;
}
.asa-menu-v3-open svg { width: 19px; height: 19px; }
body.asa-shell-active.asa-menu-collapsed .asa-menu-v3-open { display: grid; }

.asa-menu-v3-overlay { position: fixed; z-index: 9999; inset: 0; display: none; background: rgba(0,32,17,.46); }

@media (max-height: 780px) and (min-width: 901px) {
  .asa-menu-v3__head { min-height: 72px; padding-top: 13px; padding-bottom: 10px; }
  .asa-menu-v3__collapse { top: 12px; }
  .asa-menu-v3__subbrand { margin-top: 6px; }
  .asa-menu-v3__nav { padding-top: 5px; padding-bottom: 5px; }
  .asa-menu-v3__group + .asa-menu-v3__group { margin-top: 3px; }
  .asa-menu-v3__label { padding-top: 4px; padding-bottom: 2px; }
  .asa-menu-v3__item { min-height: 32px; }
  .asa-menu-v3__footer { padding-top: 6px; padding-bottom: 6px; }
}

@media (max-width: 900px) {
  body.asa-shell-active,
  body.asa-shell-active.asa-menu-collapsed { padding-left: 0 !important; }
  .asa-menu-v3 { width: min(268px, 88vw); transform: translateX(-105%); box-shadow: 16px 0 40px rgba(0,30,16,.28); }
  body.asa-menu-mobile-open .asa-menu-v3 { transform: translateX(0); pointer-events: auto; }
  body.asa-shell-active .asa-menu-v3-open { display: grid; }
  body.asa-menu-mobile-open .asa-menu-v3-open { display: none; }
  body.asa-menu-mobile-open .asa-menu-v3-overlay { display: block; }
  body.asa-menu-mobile-open { overflow: hidden; }
  .asa-menu-v3__collapse svg { transform: rotate(180deg); }
}
