/*
 * Aside Expandable Menu - Custom Styles V2
 * Comportamento: Expandido por padrão -> Botão toggle -> Collapsed (apenas ícones)
 */

/* Estado padrão: EXPANDIDO - ícones + textos */
body.aside-enabled #kt_aside,
body #kt_aside.aside {
  width: 280px !important;
  transition: width 0.3s ease, transform 0.3s ease !important;
  overflow: hidden !important;
  overflow-y: auto !important;
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  z-index: 99999 !important; /* Muito alto para garantir que fique acima de todo conteúdo */
  background-color: #002a35 !important;
}

#kt_aside .aside-logo {
  padding-left: 1.5rem;
  overflow: hidden;
  transition: all 0.3s ease;
}

/* Textos visíveis por padrão */
#kt_aside .menu-title {
  opacity: 1;
  width: auto;
  margin-left: 0.75rem;
  white-space: nowrap;
  transition: opacity 0.3s ease, width 0.3s ease, margin 0.3s ease;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--bs-gray-800);
}

#kt_aside .menu-link {
  justify-content: flex-start;
  padding: 0.85rem 1.25rem !important;
  min-height: 48px;
  height: auto !important;
  transition: all 0.3s ease;
  align-items: center;
}

#kt_aside .menu-link.menu-center {
  flex-direction: row;
  text-align: left;
  align-items: center;
  height: auto !important;
}

/* Remover altura fixa dos itens principais do menu */
.aside-menu .menu > .menu-item > .menu-link {
  height: auto !important;
  min-height: 48px !important;
}

#kt_aside .menu-icon {
  margin-right: 0.75rem !important;
  flex-shrink: 0;
  transition: margin 0.3s ease;
}

#kt_aside .menu-icon i {
  font-size: 1.35rem;
  color: var(--bs-gray-700);
}

/* Submenus OCULTOS por padrão - só aparecem quando .show */
#kt_aside .menu-sub-dropdown {
  display: none !important;
  position: static !important;
  width: 100% !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  border: none !important;
}

/* Mostrar submenu apenas quando item tem classe .show */
#kt_aside .menu-item.show > .menu-sub-dropdown {
  display: block !important;
  animation: slideDown 0.3s ease;
}

/* Animação de slide down */
@keyframes slideDown {
  from {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
  }
  to {
    opacity: 1;
    max-height: 1000px;
  }
}

/* Estilo dos itens do submenu - MODERNIZADO */
#kt_aside .menu-sub-dropdown .menu-item {
  padding: 0 !important;
  margin: 0 0 0.25rem 0 !important;
}

#kt_aside .menu-sub-dropdown .menu-link {
  padding: 0.65rem 1rem !important;
  font-size: 0.95rem;
  min-height: 40px;
  display: flex;
  align-items: center;
  color: var(--bs-gray-700);
  border-radius: 0.375rem;
  transition: all 0.2s ease;
  font-weight: 500;
  text-decoration: none;
}

#kt_aside .menu-sub-dropdown .menu-content {
  padding: 0.5rem 1.25rem;
}

#kt_aside .menu-sub-dropdown .menu-section {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--bs-gray-600);
  font-weight: 600;
  padding: 0.5rem 0;
}

/* Remover bullets completamente - visual limpo */
#kt_aside .menu-bullet {
  display: none !important;
}

#kt_aside .menu-bullet .bullet {
  display: none !important;
}

/* Esconder setas de dropdown pois é accordion */
#kt_aside .menu-arrow {
  display: none;
}

/* ============================================ */
/* ESTADO COLLAPSED - quando botão é clicado */
/* ============================================ */

body.aside-enabled #kt_aside.aside-collapsed,
body #kt_aside.aside.aside-collapsed {
  width: 80px !important;
}

/* Esconder textos quando collapsed */
#kt_aside.aside-collapsed .menu-title {
  opacity: 0;
  width: 0;
  margin-left: 0;
  overflow: hidden;
}

/* Centralizar ícones quando collapsed */
#kt_aside.aside-collapsed .menu-link {
  justify-content: center;
  padding: 0.75rem 0.5rem !important;
  height: auto !important;
  min-height: 60px !important;
}

#kt_aside.aside-collapsed .menu-link.menu-center {
  flex-direction: column;
  text-align: center;
  height: auto !important;
}

/* Remover altura fixa quando collapsed também */
#kt_aside.aside-collapsed .aside-menu .menu > .menu-item > .menu-link {
  height: auto !important;
  min-height: 60px !important;
}

#kt_aside.aside-collapsed .menu-icon {
  margin: 0 !important;
}

#kt_aside.aside-collapsed .menu-icon i {
  font-size: 1.5rem;
}

/* Esconder submenus quando collapsed */
#kt_aside.aside-collapsed .menu-sub-dropdown {
  display: none !important;
}

/* Centralizar logo quando collapsed */
#kt_aside.aside-collapsed .aside-logo {
  text-align: center;
  padding-left: 0;
}

/* Logo switching - mostrar logo completa por padrão, ícone escondido */
#kt_aside .logo-full {
  display: block !important;
  max-width: 80% !important; /* Reduzir 20% do tamanho original */
  height: auto !important;
  transition: all 0.3s ease;
}

#kt_aside .logo-full img {
  max-width: 100% !important;
  height: auto !important;
}

#kt_aside .logo-icon {
  display: none !important;
}

/* Quando collapsed, esconder logo completa e mostrar ícone */
#kt_aside.aside-collapsed .logo-full {
  display: none !important;
}

#kt_aside.aside-collapsed .logo-icon {
  display: block !important;
}

/* Quando hover no collapsed, voltar para logo completa (também reduzida) */
#kt_aside.aside-collapsed:hover .logo-full {
  display: block !important;
  max-width: 80% !important; /* Manter redução de 20% */
  height: auto !important;
}

#kt_aside.aside-collapsed:hover .logo-icon {
  display: none !important;
}

/* Esconder bullets quando collapsed */
#kt_aside.aside-collapsed .menu-bullet {
  display: none;
}

/* ============================================ */
/* ESTILOS MODERNOS - Classes Únicas (aside-modern-*) */
/* Design Minimalista e Impactante */
/* ============================================ */

/* Container principal do menu */
.aside-modern-menu {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0.5rem 0.75rem;
}

/* Tipografia global melhorada */
.aside-modern-menu * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Item principal do menu */
.aside-modern-item {
  margin-bottom: 0.25rem;
  padding: 0;
}

/* Link principal do menu - DESIGN MODERNO DARK */
.aside-modern-link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 1rem 1.5rem;
  min-height: 56px;
  border-radius: 0.625rem;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  color: var(--aside-text-primary);
  position: relative;
  overflow: hidden;
}

/* Efeito de borda sutil à esquerda */
.aside-modern-link::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 0;
  border-radius: 0 3px 3px 0;
  transition: height 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Ícone do menu principal - MAIOR E MAIS IMPACTANTE */
.aside-modern-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 0.5rem;
  background: transparent;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.aside-modern-icon i {
  font-size: 1.5rem;
  color: var(--aside-text-secondary);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Título do menu principal - TIPOGRAFIA MELHORADA DARK */
.aside-modern-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--aside-text-light);
  white-space: nowrap;
  opacity: 1;
  letter-spacing: -0.01em;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  flex: 1;
}

/* Seta indicadora de submenu - DARK */
.aside-modern-link::after {
  content: '\f107';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  font-size: 0.875rem;
  color: var(--aside-text-tertiary);
  margin-left: auto;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Rotacionar seta quando menu aberto - DARK */
.aside-modern-item.show > .aside-modern-link::after {
  transform: rotate(-180deg);
  color: var(--aside-accent-color);
}

/* Submenu - DESIGN LIMPO E MODERNO */
.aside-modern-submenu {
  display: none;
  padding: 0.5rem 0 0.5rem 1.5rem;
  margin-top: 0.25rem;
  margin-bottom: 0.5rem;
}

/* Mostrar submenu quando item tem classe show */
.aside-modern-item.show .aside-modern-submenu {
  display: block;
  animation: slideDown 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Subitem do submenu */
.aside-modern-subitem {
  padding: 0;
  margin: 0;
  list-style: none;
}

/* Link do subitem - DESIGN CLEAN DARK */
.aside-modern-sublink {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 0.75rem;
  margin-bottom: 0.125rem;
  min-height: 36px;
  border-radius: 0.5rem;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  text-decoration: none;
  color: var(--aside-text-secondary);
  font-weight: 500;
  font-size: 0.9375rem;
  position: relative;
  width: 100%;
}

/* Título do subitem - SEM BOLINHAS DARK */
.aside-modern-subtitle {
  color: var(--aside-text-secondary);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* REMOVER todas as bolinhas */
.aside-modern-subtitle::before {
  display: none !important;
  content: none !important;
}

/* Sub-submenu (terceiro nível) */
.aside-modern-sub-submenu {
  padding-left: 1rem;
  margin-top: 0.25rem;
}

.aside-modern-sub-submenu .aside-modern-sublink {
  font-size: 0.875rem;
  padding: 0.4rem 0.65rem;
  min-height: 32px;
  color: var(--aside-text-tertiary);
}

.aside-modern-sub-submenu .aside-modern-subtitle {
  color: var(--aside-text-tertiary);
}

.aside-modern-sub-submenu .aside-modern-sublink:hover {
  color: var(--aside-text-primary);
  background-color: var(--aside-hover-bg);
}

.aside-modern-sub-submenu .aside-modern-sublink:hover .aside-modern-subtitle {
  color: var(--aside-text-primary);
}

/* Hover nos itens principais - IMPACTANTE DARK */
.aside-modern-item:hover .aside-modern-link {
  background-color: var(--aside-hover-bg-strong);
}

.aside-modern-item:hover .aside-modern-link::before {
  height: 24px;
}

.aside-modern-item:hover .aside-modern-link::after {
  color: var(--aside-accent-color);
}

.aside-modern-item:hover .aside-modern-icon {
  background-color: var(--aside-active-bg);
  transform: scale(1.05);
}

.aside-modern-item:hover .aside-modern-icon i {
  color: var(--aside-accent-color);
  transform: scale(1.05);
}

.aside-modern-item:hover .aside-modern-title {
  color: var(--aside-text-primary);
  font-weight: 700;
}

/* Item ativo/aberto - DESTAQUE FORTE DARK */
.aside-modern-item.show > .aside-modern-link,
.aside-modern-item.here > .aside-modern-link {
  background: linear-gradient(90deg, var(--aside-active-bg) 0%, var(--aside-active-bg-light) 100%);
  box-shadow: inset 3px 0 0 var(--aside-accent-color);
}

.aside-modern-item.show > .aside-modern-link::before,
.aside-modern-item.here > .aside-modern-link::before {
  height: 32px;
}

.aside-modern-item.show > .aside-modern-link .aside-modern-icon,
.aside-modern-item.here > .aside-modern-link .aside-modern-icon {
  background: linear-gradient(135deg, var(--aside-accent-color) 0%, var(--aside-accent-hover) 100%);
  box-shadow: 0 4px 12px var(--aside-badge-shadow-color);
}

.aside-modern-item.show > .aside-modern-link .aside-modern-icon i,
.aside-modern-item.here > .aside-modern-link .aside-modern-icon i {
  color: var(--aside-text-primary);
}

.aside-modern-item.show .aside-modern-title,
.aside-modern-item.here .aside-modern-title {
  color: var(--aside-text-primary);
  font-weight: 700;
}

.aside-modern-item.show > .aside-modern-link::after,
.aside-modern-item.here > .aside-modern-link::after {
  color: var(--aside-accent-color);
}

/* Hover nos subitens - CLEAN E SUTIL DARK */
.aside-modern-sublink:hover {
  background-color: var(--aside-hover-bg-strong);
  color: var(--aside-text-primary);
  padding-left: 1rem;
}

.aside-modern-sublink:hover .aside-modern-subtitle {
  color: var(--aside-text-primary);
  font-weight: 600;
}

/* Subitem ativo - DESTAQUE ELEGANTE DARK */
.aside-modern-sublink.active {
  background-color: var(--aside-active-bg);
  color: var(--aside-text-primary);
  font-weight: 700;
  border-left: 3px solid var(--aside-accent-color);
  padding-left: calc(0.75rem - 3px);
}

.aside-modern-sublink.active .aside-modern-subtitle {
  color: var(--aside-text-primary);
}

/* ============================================ */
/* COLLAPSED STATE - Classes únicas */
/* ============================================ */

/* Quando aside collapsed - esconder TODOS os textos */
#kt_aside.aside-collapsed .aside-modern-title,
#kt_aside.aside-collapsed .aside-modern-subtitle {
  opacity: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  display: none !important;
}

#kt_aside.aside-collapsed .aside-modern-link {
  justify-content: center;
  padding: 1rem 0.5rem;
  min-height: 60px;
}

#kt_aside.aside-collapsed .aside-modern-link::before {
  display: none;
}

#kt_aside.aside-collapsed .aside-modern-icon {
  margin: 0;
  width: 48px;
  height: 48px;
}

#kt_aside.aside-collapsed .aside-modern-icon i {
  font-size: 1.75rem;
}

#kt_aside.aside-collapsed .aside-modern-submenu {
  display: none !important;
}

#kt_aside.aside-collapsed .aside-modern-item {
  padding: 0 0.5rem;
  margin-bottom: 0.5rem;
}

/* Hover quando collapsed */
#kt_aside.aside-collapsed .aside-modern-item:hover .aside-modern-icon {
  transform: scale(1.1);
}

/* Remover background do ícone ativo quando collapsed */
#kt_aside.aside-collapsed .aside-modern-item.show > .aside-modern-link .aside-modern-icon,
#kt_aside.aside-collapsed .aside-modern-item.here > .aside-modern-link .aside-modern-icon {
  background: transparent !important;
  box-shadow: none !important;
}

/* Esconder seta quando collapsed */
#kt_aside.aside-collapsed .aside-modern-link::after {
  display: none;
}

/* ============================================ */
/* HOVER EXPAND - quando collapsed */
/* ============================================ */

/* Expandir aside temporariamente no hover quando collapsed */
body.aside-collapsed #kt_aside:hover,
body.aside-collapsed #kt_aside.aside:hover,
#kt_aside.aside-collapsed:hover {
  width: 280px !important;
  transition: width 0.25s ease !important;
  box-shadow: 4px 0 30px rgba(0, 0, 0, 0.3);
  z-index: 100000 !important; /* Muito alto para garantir overlay sobre todo conteúdo */
}

/* Mostrar TODOS os textos no hover quando collapsed */
body.aside-collapsed #kt_aside:hover .aside-modern-title,
body.aside-collapsed #kt_aside:hover .aside-modern-subtitle,
#kt_aside.aside-collapsed:hover .aside-modern-title,
#kt_aside.aside-collapsed:hover .aside-modern-subtitle {
  opacity: 1 !important;
  width: auto !important;
  display: block !important;
  visibility: visible !important;
  transition: opacity 0.25s ease 0.1s, width 0.25s ease !important;
}

/* Ajustar layout dos links no hover */
body.aside-collapsed #kt_aside:hover .aside-modern-link,
#kt_aside.aside-collapsed:hover .aside-modern-link {
  justify-content: flex-start !important;
  padding: 1rem 1.5rem !important;
}

body.aside-collapsed #kt_aside:hover .aside-modern-sublink,
#kt_aside.aside-collapsed:hover .aside-modern-sublink {
  justify-content: flex-start !important;
  padding: 0.5rem 0.75rem !important;
}

/* Mostrar setas no hover */
body.aside-collapsed #kt_aside:hover .aside-modern-link::after,
#kt_aside.aside-collapsed:hover .aside-modern-link::after {
  display: block !important;
  opacity: 1 !important;
}

/* Ajustar ícones no hover */
body.aside-collapsed #kt_aside:hover .aside-modern-icon,
#kt_aside.aside-collapsed:hover .aside-modern-icon {
  margin-right: 1rem !important;
  width: 40px !important;
  height: 40px !important;
}

body.aside-collapsed #kt_aside:hover .aside-modern-icon i,
#kt_aside.aside-collapsed:hover .aside-modern-icon i {
  font-size: 1.5rem !important;
}

/* Ajustar espaçamento dos itens no hover */
body.aside-collapsed #kt_aside:hover .aside-modern-item,
#kt_aside.aside-collapsed:hover .aside-modern-item {
  padding: 0 !important;
  margin-bottom: 0.25rem !important;
}

/* Mostrar submenus quando houver hover E estiver aberto */
body.aside-collapsed #kt_aside:hover .aside-modern-item.show .aside-modern-submenu,
#kt_aside.aside-collapsed:hover .aside-modern-item.show .aside-modern-submenu {
  display: block !important;
  opacity: 1 !important;
}

/* Ajustar padding do submenu no hover */
body.aside-collapsed #kt_aside:hover .aside-modern-submenu,
#kt_aside.aside-collapsed:hover .aside-modern-submenu {
  padding: 0.5rem 0 0.5rem 1.5rem !important;
}

/* ============================================ */
/* ESTILOS MODERNOS - Menu Limpo (ANTIGO - MANTER PARA COMPATIBILIDADE) */
/* ============================================ */

/* Padding e espaçamento nos submenus */
#kt_aside .menu-sub-dropdown {
  padding: 0.5rem 1rem !important;
  margin-top: 0.5rem;
}

/* Remover completamente marcadores de lista e estilos padrão */
#kt_aside ul,
#kt_aside li,
#kt_aside .menu-item,
#kt_aside .menu-sub-dropdown,
#kt_aside .menu-sub {
  list-style: none !important;
  list-style-type: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Garantir que menu-items não tenham estilo de lista */
#kt_aside .menu-item::before,
#kt_aside .menu-item::marker {
  display: none !important;
  content: none !important;
}

/* Melhorar espaçamento vertical entre menus principais */
#kt_aside .menu-item.menu-accordion {
  margin-bottom: 0.5rem;
}

/* Subitens com indicador visual sutil */
#kt_aside .menu-sub-dropdown .menu-title::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 4px;
  background-color: var(--bs-gray-400);
  border-radius: 50%;
  margin-right: 0.75rem;
  transition: all 0.2s ease;
}

/* Quando collapsed, esconder o indicador também */
#kt_aside.aside-collapsed .menu-sub-dropdown .menu-title::before {
  display: none;
}

/* ============================================ */
/* ESTADOS VISUAIS - Hover, Active, etc */
/* ============================================ */

/* Espaçamento dos itens principais */
#kt_aside .menu > .menu-item {
  margin-bottom: 0.35rem;
  padding: 0 0.5rem;
}

#kt_aside.aside-collapsed .menu > .menu-item {
  padding: 0;
  margin-bottom: 0.25rem;
}

/* Estado ativo dos itens do menu */
#kt_aside .menu-item.here > .menu-link,
#kt_aside .menu-item.show > .menu-link {
  background-color: var(--bs-primary-light, rgba(0, 123, 255, 0.1));
  color: var(--bs-primary);
  border-radius: 0.475rem;
}

#kt_aside .menu-item.here > .menu-link .menu-icon i,
#kt_aside .menu-item.show > .menu-link .menu-icon i {
  color: var(--bs-primary);
}

#kt_aside .menu-item.here .menu-title,
#kt_aside .menu-item.show .menu-title {
  color: var(--bs-primary) !important;
}

/* Hover effect nos itens do menu */
#kt_aside .menu-item:hover > .menu-link {
  background-color: var(--bs-gray-100);
  border-radius: 0.475rem;
  transition: all 0.2s ease;
}

#kt_aside .menu-item:hover .menu-icon i {
  color: var(--bs-primary);
}

/* Estado ativo dos subitens - MODERNIZADO */
#kt_aside .menu-sub-dropdown .menu-link.active {
  background-color: var(--bs-primary-light, rgba(0, 123, 255, 0.1));
  color: var(--bs-primary) !important;
  font-weight: 600;
}

#kt_aside .menu-sub-dropdown .menu-link.active .menu-title::before {
  background-color: var(--bs-primary);
  transform: scale(1.5);
}

#kt_aside .menu-sub-dropdown .menu-link:hover {
  background-color: var(--bs-gray-100);
  color: var(--bs-primary) !important;
  transform: translateX(4px);
}

#kt_aside .menu-sub-dropdown .menu-link:hover .menu-title::before {
  background-color: var(--bs-primary);
}

/* ============================================ */
/* BOTÃO TOGGLE NO HEADER */
/* ============================================ */

.aside-toggle-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 0.475rem;
  background-color: var(--bs-gray-200);
  border: 1px solid var(--bs-gray-300);
  cursor: pointer;
  transition: all 0.2s ease;
  color: var(--bs-gray-700);
  margin-right: 1rem;
  margin-left: 0.5rem;
  margin-top: auto;
  margin-bottom: auto;
  flex-shrink: 0;
  align-self: center;
}

.aside-toggle-btn:hover {
  background-color: var(--bs-primary);
  color: var(--aside-text-primary);
  border-color: var(--bs-primary);
}

.aside-toggle-btn i {
  font-size: 1.25rem;
  transition: transform 0.3s ease;
}

/* Rotacionar ícone quando collapsed */
body.aside-collapsed .aside-toggle-btn i {
  transform: rotate(180deg);
}

/* ============================================ */
/* AJUSTAR CONTEÚDO QUANDO ASIDE MUDA */
/* ============================================ */

/* Ajustar margin do wrapper baseado no tamanho do aside */
/* Wrapper margin apenas em desktop - movido para media query abaixo */
/* IMPORTANTE: não aplicar margin-left em mobile */

/* Ajustar toda a page se necessário */
body.aside-enabled .page {
  transition: margin-left 0.3s ease !important;
}

/* Remover paddings conflitantes do tema */
body.aside-fixed .wrapper,
body.aside-enabled .wrapper {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ============================================ */
/* AJUSTAR HEADER - CRÍTICO! */
/* ============================================ */

/* Sobrescrever o left do header para alinhar com nosso aside */
@media (min-width: 992px) {
  body.aside-enabled.aside-fixed.header-fixed .header,
  body.aside-enabled.header-fixed .header,
  body.aside-fixed .header,
  .header-fixed .header {
    left: 280px !important;
    right: 0 !important;
    transition: left 0.3s ease !important;
  }

  /* Quando aside collapsed, ajustar header */
  body.aside-collapsed.aside-enabled.aside-fixed.header-fixed .header,
  body.aside-collapsed.aside-enabled.header-fixed .header,
  body.aside-collapsed.aside-fixed .header,
  body.aside-collapsed .header-fixed .header {
    left: 80px !important;
  }

  /* Ajustar toolbar também */
  body.aside-enabled.toolbar-fixed .toolbar,
  body.aside-fixed.toolbar-fixed .toolbar {
    left: 280px !important;
    right: 0 !important;
    transition: left 0.3s ease !important;
  }

  body.aside-collapsed.toolbar-fixed .toolbar {
    left: 80px !important;
  }
}

/* Manter paddings internos do container do header */
.wrapper .container-fluid,
.wrapper .container {
  padding-left: 2.25rem;
  padding-right: 2.25rem;
}

/* Ajuste responsivo para paddings internos */
@media (max-width: 991.98px) {
  .wrapper .container-fluid,
  .wrapper .container {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

/* ============================================ */
/* ACCORDION BEHAVIOR */
/* ============================================ */

/* Submenus accordion */
#kt_aside .menu-accordion .menu-sub {
  display: none;
  padding-left: 1rem;
}

#kt_aside .menu-accordion.show .menu-sub {
  display: block;
}

/* Indicador visual de submenu (seta) */
#kt_aside .menu-accordion > .menu-link::after {
  content: '\f107';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  margin-left: auto;
  transition: transform 0.3s ease;
  font-size: 0.85rem;
}

#kt_aside .menu-accordion.show > .menu-link::after {
  transform: rotate(-180deg);
}

/* Esconder seta quando collapsed */
#kt_aside.aside-collapsed .menu-accordion > .menu-link::after {
  display: none;
}

/* ============================================ */
/* BOTÕES E ELEMENTOS ESPECIAIS */
/* ============================================ */

/* Botão "Show More" */
#kt_aside .menu-sub-dropdown .btn.toggle {
  padding: 0.5rem 1rem;
  margin-top: 0.5rem;
  font-size: 0.875rem;
}

/* Esconder botão "Show More" quando collapsed */
#kt_aside.aside-collapsed .btn.toggle {
  display: none;
}

/* ============================================ */
/* MOBILE - manter comportamento drawer */
/* ============================================ */

@media (max-width: 991.98px) {
  #kt_aside {
    width: 280px !important;
    position: relative !important;
  }

  #kt_aside.aside-collapsed {
    width: 280px !important;
  }

  .aside-toggle-btn {
    display: none;
  }

  .wrapper {
    margin-left: 0 !important;
  }
}

/* ============================================ */
/* AJUSTES FINAIS */
/* ============================================ */

/* Scroll suave */
#kt_aside #kt_aside_menu_wrapper {
  overflow-y: auto;
}

/* Transições suaves para todos os elementos */
#kt_aside * {
  transition-property: all;
  transition-duration: 0.3s;
  transition-timing-function: ease;
}

/* Remover transição de elementos que não precisam */
#kt_aside .bullet,
#kt_aside img {
  transition: none;
}

/* ============================================ */
/* SOBRESCREVER ESTILOS DO TEMA ORIGINAL */
/* ============================================ */

/* Garantir que aside não use larguras do tema */
body[data-kt-aside-minimize='on'] #kt_aside,
body .aside[data-kt-drawer-width] {
  width: 280px !important;
}

body[data-kt-aside-minimize='on'] #kt_aside.aside-collapsed,
body .aside.aside-collapsed[data-kt-drawer-width] {
  width: 80px !important;
}

/* Remover behaviors conflitantes */
#kt_aside[data-kt-drawer='true'] {
  position: fixed !important;
}

/* Desktop - aside sempre fixo */
@media (min-width: 992px) {
  /* CSS Variables para facilitar ajustes dinâmicos */
  :root {
    --aside-width-expanded: 280px;
    --aside-width-collapsed: 80px;
  }

  body.aside-enabled #kt_aside,
  body #kt_aside.aside {
    position: fixed !important;
    transform: none !important;
  }

  /* Aplicar margin-left APENAS em desktop */
  body.aside-enabled .wrapper,
  body.aside-fixed .wrapper,
  .wrapper#kt_wrapper {
    margin-left: var(--aside-width-expanded) !important;
    padding-left: 0 !important;
    transition: margin-left 0.3s ease !important;
    width: calc(100% - var(--aside-width-expanded)) !important;
  }

  /* Quando aside collapsed em desktop */
  body.aside-collapsed .wrapper,
  body.aside-collapsed .wrapper#kt_wrapper,
  body.aside-enabled.aside-collapsed .wrapper {
    margin-left: var(--aside-width-collapsed) !important;
    padding-left: 0 !important;
    width: calc(100% - var(--aside-width-collapsed)) !important;
  }

  /* Garantir que o conteúdo interno também se ajuste */
  body.aside-enabled #kt_content,
  body.aside-enabled #kt_content_container {
    width: 100% !important;
    max-width: 100% !important;
    transition: all 0.3s ease !important;
  }

  /* Corrigir cards e containers dentro do editor */
  body.aside-enabled .card,
  body.aside-enabled .container-fluid,
  body.aside-enabled .container-xxl {
    max-width: 100% !important;
  }

  /* Garantir que elementos com overflow visible não ultrapassem o wrapper */
  body.aside-enabled .wrapper .card,
  body.aside-enabled .wrapper .row {
    overflow-x: hidden;
  }

  /* Modais devem ignorar o aside e centralizar na tela inteira */
  body.aside-enabled .modal,
  body.aside-collapsed .modal {
    left: 0 !important;
    right: 0 !important;
    margin-left: 0 !important;
  }

  body.aside-enabled .modal-dialog,
  body.aside-collapsed .modal-dialog {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Garantir que dropdowns e tooltips fiquem dentro da área visível */
  body.aside-enabled .dropdown-menu {
    max-width: calc(100vw - var(--aside-width-expanded) - 2rem);
  }

  body.aside-collapsed .dropdown-menu {
    max-width: calc(100vw - var(--aside-width-collapsed) - 2rem);
  }

  /* Criar contexto de posicionamento para o conteúdo */
  body.aside-enabled #kt_content,
  body.aside-enabled .wrapper {
    position: relative;
    isolation: isolate; /* Cria novo stacking context */
  }

  /* Limitar elementos absolutos/fixos ao wrapper */
  body.aside-enabled .wrapper .position-fixed,
  body.aside-enabled .wrapper [style*="position: fixed"],
  body.aside-enabled .wrapper [style*="position:fixed"] {
    /* Converter para absolute para respeitar o wrapper */
    position: absolute !important;
  }

  /* Exceção: modais devem permanecer fixed */
  body.aside-enabled .modal,
  body.aside-enabled .modal-backdrop {
    position: fixed !important;
  }
}
