/* ✅ CORREÇÃO CRÍTICA: Forçar overflow correto no dropdown de sugestões */
/* Este arquivo deve ser carregado por último para sobrepor todos os conflitos */

/* ✅ ESPECIFICIDADE MÁXIMA: Targeting específico do ID searchSuggestions */
html body div.search-box-modular[data-context="index"] div#searchSuggestions,
html body div.search-box-modular[data-context="index"] #searchSuggestions.visible,
html body .search-box-modular[data-context="index"] #searchSuggestions[style*="display: block"],
body .search-box-modular[data-context="index"] #searchSuggestions,
.search-box-modular[data-context="index"] #searchSuggestions,
#searchSuggestions.search-suggestions,
div#searchSuggestions.search-suggestions {
  /* ✅ ALTURA VARIÁVEL COM LIMITE MÁXIMO */
  height: auto !important; /* Altura automática baseada no conteúdo */
  max-height: 240px !important; /* Limite máximo para 5 sugestões */
  min-height: auto !important; /* Sem altura mínima forçada */
  
  /* ✅ OVERFLOW FORÇADO - Múltiplas declarações para garantir */
  overflow: auto hidden !important; /* Shorthand mais específico */
  overflow-y: auto !important;
  overflow-x: hidden !important;
  
  /* ✅ GARANTIR QUE O ELEMENTO PODE ROLAR */
  -webkit-overflow-scrolling: touch !important; /* iOS smooth scroll */
  scrollbar-width: thin !important; /* Firefox */
  
  /* ✅ BOX MODEL CORRETO */
  box-sizing: border-box !important;
  
  /* ✅ FORÇAR REFLOW PARA APLICAR MUDANÇAS */
  contain: layout style !important;
  will-change: scroll-position !important;
}

/* ✅ ESPECIFICIDADE MÁXIMA: Múltiplos seletores para garantir precedência CLASSE */
html body div.search-box-modular[data-context="index"] div.search-suggestions,
html body div.search-box-modular[data-context="index"] .search-suggestions.visible,
html body .search-box-modular[data-context="index"] .search-suggestions[style*="display: block"],
body .search-box-modular[data-context="index"] .search-suggestions,
.search-box-modular[data-context="index"] .search-suggestions {
  /* ✅ ALTURA VARIÁVEL COM LIMITE MÁXIMO */
  height: auto !important; /* Altura automática baseada no conteúdo */
  max-height: 240px !important; /* Limite máximo para 5 sugestões */
  min-height: auto !important; /* Sem altura mínima forçada */
  
  /* ✅ OVERFLOW FORÇADO - Múltiplas declarações para garantir */
  overflow: auto hidden !important; /* Shorthand mais específico */
  overflow-y: auto !important;
  overflow-x: hidden !important;
  
  /* ✅ GARANTIR QUE O ELEMENTO PODE ROLAR */
  -webkit-overflow-scrolling: touch !important; /* iOS smooth scroll */
  scrollbar-width: thin !important; /* Firefox */
  
  /* ✅ BOX MODEL CORRETO */
  box-sizing: border-box !important;
  
  /* ✅ FORÇAR REFLOW PARA APLICAR MUDANÇAS */
  contain: layout style !important;
  will-change: scroll-position !important;
  
  /* ✅ INTEGRAÇÃO VISUAL PERFEITA NO INDEX - ALTA ESPECIFICIDADE */
  border: 1px solid var(--search-border-color, rgb(244, 111, 9)) !important; /* Borda laranja */
  border-top: none !important; /* Remover borda superior para continuidade */
  background: var(--search-background, rgb(255, 255, 255)) !important; /* Background consistente */
  border-top-left-radius: 0 !important; /* Remover raios superiores */
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: var(--search-border-radius, 0.5rem) !important; /* Raios inferiores */
  border-bottom-right-radius: var(--search-border-radius, 0.5rem) !important;
  box-shadow: none !important; /* Sem sombra para evitar diferença visual */
}

/* ✅ FALLBACK: Regra com ainda mais especificidade usando atributos */
html body div[class*="search-box-modular"][data-context="index"] div[class*="search-suggestions"] {
  height: auto !important;
  max-height: 240px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  
  /* ✅ INTEGRAÇÃO VISUAL FALLBACK */
  border: 1px solid rgb(244, 111, 9) !important;
  border-top: none !important;
  background: rgb(255, 255, 255) !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: var(--search-border-radius, 30px) !important;
  border-bottom-right-radius: var(--search-border-radius, 30px) !important;
  box-shadow: none !important;
}

/* ✅ OVERRIDE AGRESSIVO: Reset de qualquer overflow visible herdado */
.search-box-modular[data-context="index"] .search-suggestions * {
  /* Não herdar overflow visible dos pais */
}

/* ✅ FORÇA MÁXIMA: Targeting por ID específico no INDEX com bordas laranjas */
html body [data-context="index"] #searchSuggestions,
html body .search-box-modular[data-context="index"] #searchSuggestions,
#searchSuggestions {
  border: 1px solid rgb(244, 111, 9) !important;
  border-top: 0px solid transparent !important;
  background: rgb(255, 255, 255) !important;
  border-top-left-radius: 0px !important;
  border-top-right-radius: 0px !important;
  border-bottom-left-radius: var(--search-border-radius, 30px) !important;
  border-bottom-right-radius: var(--search-border-radius, 30px) !important;
  box-shadow: none !important;
}

/* ✅ SUPER ESPECÍFICO: Forçar com todos os possíveis seletores */
[data-context="index"] #searchSuggestions.search-suggestions,
.search-box-modular[data-context="index"] div#searchSuggestions.search-suggestions,
html body div.search-box-modular[data-context="index"] div#searchSuggestions.search-suggestions {
  border-left: 1px solid rgb(244, 111, 9) !important;
  border-right: 1px solid rgb(244, 111, 9) !important;
  border-bottom: 1px solid rgb(244, 111, 9) !important;
  border-top: none !important;
  border-top-width: 0px !important;
  border-top-style: none !important;
  border-top-color: transparent !important;
  background-color: rgb(255, 255, 255) !important;
}

/* ✅ CONTINUIDADE VISUAL INDEX: Remover cantos inferiores da caixa quando dropdown visível */
html body div.search-box-modular[data-context="index"].dropdown-attached .search-input-wrapper,
.search-box-modular[data-context="index"].dropdown-attached .search-input-wrapper {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom-color: transparent !important;
  box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.1) !important;
}

/* ✅ FORÇAR SCROLL EM WEBKIT */
.search-box-modular[data-context="index"] .search-suggestions::-webkit-scrollbar {
  width: 6px !important;
  display: block !important;
}

.search-box-modular[data-context="index"] .search-suggestions::-webkit-scrollbar-track {
  background: transparent !important;
}

.search-box-modular[data-context="index"] .search-suggestions::-webkit-scrollbar-thumb {
  background: #ccc !important;
  border-radius: 3px !important;
}

.search-box-modular[data-context="index"] .search-suggestions::-webkit-scrollbar-thumb:hover {
  background: #999 !important;
}