/*
  Ajuste visual isolado do botao Sair na sidebar.
  Usa o botao React/logout ja existente; nao altera AuthProvider, token ou fluxo.
*/

html body nav.sidebar-navigation.auto-premium-sidebar {
  display: flex !important;
  flex-direction: column !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
}

html body nav.sidebar-navigation.auto-premium-sidebar > div:first-child.auto-sidebar-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-bottom: 12px !important;
}

html body nav.sidebar-navigation.auto-premium-sidebar > div:last-child {
  flex: 0 0 auto !important;
  position: sticky !important;
  bottom: 0 !important;
  z-index: 4 !important;
  display: block !important;
  margin-top: auto !important;
  padding: 12px 14px calc(14px + env(safe-area-inset-bottom)) !important;
  border-top: 1px solid rgba(153, 246, 228, .14) !important;
  background: linear-gradient(180deg, rgba(6, 43, 51, .88), rgba(6, 43, 51, .96)) !important;
  box-shadow: 0 -14px 28px rgba(2, 8, 23, .16) !important;
}

html body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button,
html body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  gap: 12px !important;
  border: 1px solid rgba(248, 113, 113, .18) !important;
  border-radius: 14px !important;
  color: #fecaca !important;
  background: rgba(127, 29, 29, .16) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

html body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button:hover,
html body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout:hover {
  color: #ffffff !important;
  background: rgba(220, 38, 38, .24) !important;
  border-color: rgba(248, 113, 113, .32) !important;
  transform: translateY(-1px) !important;
}

html body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button svg,
html body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout svg {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
}

html body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button .sidebar-label,
html body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout .sidebar-label {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
  color: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button:not(:has(> .sidebar-label))::after,
html body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout:not(:has(> .sidebar-label))::after {
  content: "Sair" !important;
  display: inline-flex !important;
  color: inherit !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

html.auto-premium-menu-collapsed body nav.sidebar-navigation.auto-premium-sidebar > div:last-child {
  padding: 12px 14px 18px !important;
}

html.auto-premium-menu-collapsed body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button,
html.auto-premium-menu-collapsed body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout {
  justify-content: center !important;
  width: 48px !important;
  min-width: 48px !important;
  padding: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html.auto-premium-menu-collapsed body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button .sidebar-label,
html.auto-premium-menu-collapsed body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout .sidebar-label,
html.auto-premium-menu-collapsed body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button::after,
html.auto-premium-menu-collapsed body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout::after {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

html.auto-premium-mobile body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button,
html.auto-premium-mobile body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout {
  width: 100% !important;
  min-width: 0 !important;
  justify-content: flex-start !important;
  padding: 0 13px !important;
}

html.auto-premium-mobile body nav.sidebar-navigation.auto-premium-sidebar > div:first-child.auto-sidebar-body {
  max-height: calc(100dvh - 84px) !important;
  padding-bottom: 14px !important;
}

html.auto-premium-mobile body nav.sidebar-navigation.auto-premium-sidebar > div:last-child {
  position: sticky !important;
  bottom: 0 !important;
}

html.auto-premium-mobile body nav.sidebar-navigation.auto-premium-sidebar .auto-sidebar-logout-button .sidebar-label,
html.auto-premium-mobile body nav.sidebar-navigation.auto-premium-sidebar .auto-mobile-logout .sidebar-label {
  display: inline-flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}
