/* Submenu VERTICAL - SOLUÇÃO DEFINITIVA com padding invisível */

/* Item do menu com dropdown */
.ns-header-main-menu ul li.has-dropdown {
  position: relative !important;
}

/* Submenu com padding-top invisível para preencher o gap */
.ns-header-main-menu ul li.has-dropdown .submenu {
  position: absolute !important;
  left: 0 !important;
  top: 100% !important;
  margin-top: -10px !important; /* Sobrepõe 10px para eliminar gap */
  padding-top: 10px !important; /* Padding invisível de 10px */
  background: transparent !important; /* Fundo transparente no padding */
  background-clip: content-box !important; /* Fundo branco só no conteúdo */
  width: 180px !important;
  z-index: 999 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  border-radius: 6px !important;
  padding-bottom: 5px !important;
  
  /* ESCONDIDO por padrão */
  display: none !important;
}

/* Adicionar fundo branco apenas no conteúdo (não no padding-top) */
.ns-header-main-menu ul li.has-dropdown .submenu::before {
  content: '' !important;
  position: absolute !important;
  top: 10px !important; /* Começa depois do padding invisível */
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: #fff !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  z-index: -1 !important;
}

/* MOSTRAR submenu quando hover no item pai */
.ns-header-main-menu ul li.has-dropdown:hover .submenu {
  display: block !important;
}

/* FORÇAR itens do submenu a ficarem VERTICAIS */
.ns-header-main-menu ul li.has-dropdown .submenu li {
  display: block !important;
  margin: 0 !important;
  position: relative !important;
  float: none !important;
  width: 100% !important;
  z-index: 1 !important; /* Acima do ::before */
}

/* Links do submenu */
.ns-header-main-menu ul li.has-dropdown .submenu li a {
  padding: 10px 18px !important;
  color: #2c3e50 !important;
  display: block !important;
  transition: all 0.2s ease !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  width: 100% !important;
  text-align: left !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Hover effect nos itens do submenu */
.ns-header-main-menu ul li.has-dropdown .submenu li:hover > a {
  background-color: #27AE60 !important;
  color: #fff !important;
  padding-left: 22px !important;
}

/* Separador entre itens */
.ns-header-main-menu ul li.has-dropdown .submenu li:not(:last-child) {
  border-bottom: 1px solid #f0f0f0 !important;
}

/* Primeiro item do submenu */
.ns-header-main-menu ul li.has-dropdown .submenu li:first-child a {
  border-radius: 6px 6px 0 0 !important;
}

/* Último item do submenu */
.ns-header-main-menu ul li.has-dropdown .submenu li:last-child a {
  border-radius: 0 0 6px 6px !important;
}
