/* ==================================================
   CONFIGURAÇÕES GLOBAIS (SAFE)
   ================================================== */

/* Barra de rolagem sempre visível */
html {
  *overflow-y: scroll;
}

/* Mantém Bootstrap intacto */
body {
  background: #f5f6fa;
  overflow-anchor: none;
}

/* Variáveis do projeto */
:root {
  --roxo: #430e69;
  --azul: #0095bf;
  /* Variável azul */
  --grad-faq: linear-gradient(135deg, #430e69, #0095bf);
  --grad-procedimentos: linear-gradient(135deg, #0095bf, #430e69);
}

/* ==================================================
   CORREÇÕES ESTRUTURAIS (BUG REAL)
   ================================================== */

/* Evita colapso de margem entre sections */
section::before {
  content: "";
  display: table;
}

/* Correção definitiva de âncoras com navbar fixa */
#consulta,
#faq,
#section4 {
  position: relative;
}

#consulta::before,
#faq::before,
#section4::before {
  content: "";
  display: block;
  height: 90px;
  margin-top: -90px;
  visibility: hidden;
  pointer-events: none;
}

@media (max-width: 768px) {
  #consulta::before,
  #faq::before,
  #section4::before {
    height: 120px;
    margin-top: -120px;
  }
}

/* ==================================================
   AJUSTES BOOTSTRAP (SEM SIDE EFFECTS)
   ================================================== */

/* Remove espaço extra do h2 dentro do accordion */
.accordion-item > h2 {
  margin: 0 !important;
}

/* Transição estável do collapse (evita travadas) */
.collapse {
  transition: height 0.35s ease;
}

/* ==================================================
   CONFIGURAÇÕES CAMPO PESQUISA – VERSÃO FINAL PREMIUM
   ================================================== */

/* Destaque do termo encontrado */
.faq-highlight {
  background: linear-gradient(120deg, #ffe066 0%, #ffec99 100%);
  color: #000;
  padding: 2px 4px;
  border-radius: 4px;
  font-weight: 600;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
}

/* Container do campo de busca */
.faq-search-wrapper {
  position: relative;
  margin-bottom: 12px;
}

/* Lupa dentro do círculo */
.faq-search-wrapper i {
  position: absolute;
  top: 50%;
  left: 8px;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  background-color: #0096db; /* azul inicial */
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  pointer-events: none;
  transition:
    transform 0.25s ease,
    background-color 0.25s ease;
}

/* Lupa ao focar no input */
.faq-search-wrapper:focus-within i {
  background-color: #430e69; /* muda para roxo */
  transform: translateY(-50%) scale(1.08); /* leve zoom */
}

/* Campo de pesquisa */
#faqSearch {
  width: 100%;
  padding: 12px 12px 12px 54px; /* espaço para a lupa */
  border-radius: 30px;
  border: 1px solid #0096db;
  font-size: 0.95rem;
  color: #0096db; /* texto azul inicial */
  font-family: "Inter", "Poppins", sans-serif;
  font-weight: 500;
  transition:
    all 0.25s ease,
    color 0.25s ease;
}

/* Placeholder azul inicial */
#faqSearch::placeholder {
  color: #0096db; /* texto do placeholder azul */
  font-weight: 400;
  opacity: 1;
}

/* Input em foco */
#faqSearch:focus {
  border-color: #430e69; /* borda roxa */
  color: #430e69; /* texto roxo sólido */
  outline: none;
  box-shadow: 0 4px 10px rgba(67, 14, 105, 0.15); /* sombra leve */
}

/* Placeholder em foco (roxo sólido) */
#faqSearch:focus::placeholder {
  color: #430e69;
  opacity: 1;
}

/* Items do FAQ */
.faq-item {
  transition: background-color 0.3s ease;
}

.faq-item.match {
  background-color: #fff8e1;
  border-radius: 6px;
}

/* Ajustes responsivos para mobile */
@media (max-width: 480px) {
  .faq-search-wrapper i {
    width: 30px;
    height: 30px;
    font-size: 0.9rem;
  }
  #faqSearch {
    padding-left: 48px; /* menor espaço para lupa menor */
  }
}

/* ==================================================
   ACCORDION – BASE (FAQ + PROCEDIMENTOS)
   ================================================== */

/* Accordion Dúvidas (FAQ) */
#accordionFaq .accordion-item {
  margin-bottom: 14px;
  border-radius: 14px;
  overflow: hidden;
  border: none;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}

/* Cabeçalho do FAQ */
.accordion-button {
  width: 100%;
  padding: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 1.05rem;
  font-weight: 600;
  text-align: left;
  color: #fff !important;
  background: var(--grad-faq) !important;
  border: none;
}

.accordion-button:hover {
  background: linear-gradient(135deg, #5b1a8a, #00a5d9) !important;
}

.accordion-button:focus {
  outline: none;
  box-shadow: none;
}

/* Ícone (seta) - Ajuste do tamanho */
.accordion-button svg {
  width: 16px;
  /* Reduzido o tamanho da seta */
  height: 16px;
  fill: #fff;
  transition: transform 0.35s ease;
}

button[aria-expanded="true"] svg {
  transform: rotate(180deg);
}

/* Corpo do FAQ */
#accordionFaq .accordion-body {
  padding: 22px 22px 22px 28px;
  background: #ffffff;
  border-left: 3px solid var(--roxo);
  /* Linha roxa no FAQ */

  max-height: 380px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* ==================================================
   FAQ – ESTILO ESPECÍFICO
   ================================================== */

/* Linha vertical roxa apenas no FAQ */
#accordionFaq .accordion-body {
  border-left-color: var(--roxo);
}

/* Textos internos */
.faq-question {
  margin-top: 18px;
  font-weight: 600;
  color: var(--roxo);
}

.faq-answer {
  margin-bottom: 14px;
}

/* Títulos apenas no FAQ */
#faq h1,
#faq h2 {
  color: var(--roxo);
  text-align: center;
}

/* ==================================================
   PROCEDIMENTOS – ESTILO ESPECÍFICO
   ================================================== */

/* Ajuste do accordion de Procedimentos para ter a mesma margem que o FAQ */
#accordionProcedimentos .accordion-item {
  margin-bottom: 14px;
  /* Margem igual ao FAQ */
  border-radius: 14px;
  overflow: hidden;
  border: none;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}

/* Gradiente invertido do cabeçalho do Procedimentos */
#accordionProcedimentos .accordion-button {
  background: var(--grad-procedimentos) !important;
}

#accordionProcedimentos .accordion-button:hover {
  background: linear-gradient(135deg, #00a5d9, #5b1a8a) !important;
}

/* Ícone (seta) - Ajuste do tamanho */
#accordionProcedimentos .accordion-button svg {
  width: 16px;
  /* Tamanho da seta ajustado para Procedimentos também */
  height: 16px;
  fill: #fff;
  transition: transform 0.35s ease;
}

button[aria-expanded="true"] svg {
  transform: rotate(180deg);
}

/* Corpo do Procedimentos com linha azul */
#accordionProcedimentos .accordion-body {
  padding: 22px 22px 22px 28px;
  background: #ffffff;
  border-left: 3px solid var(--azul);
  /* Linha azul para Procedimentos */

  max-height: 380px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Títulos apenas nos Procedimentos */
#section4 h1,
#section4 h2 {
  color: var(--roxo);
  text-align: center;
}

/* ==================================================
   JUMBOTRON (SAFE)
   ================================================== */

.jumbotron {
  margin-bottom: 0;
  padding-top: 3rem;
  padding-bottom: 3rem;
}

/* ==================================================
   ANIMAÇÃO SUAVE DO CONTEÚDO (FAQ + PROCEDIMENTOS)
   ================================================== */

.accordion-collapse .accordion-body {
  opacity: 0;
  transform: translateY(-6px);
  transition:
    opacity 1.9s cubic-bezier(0.22, 1, 0.36, 1),
    transform 1.9s cubic-bezier(0.22, 1, 0.36, 1);
}

.accordion-collapse.show .accordion-body {
  opacity: 1;
  transform: translateY(0);
}

/* ==================================================
   DESACELERA A ABERTURA REAL DO ACCORDION (BOOTSTRAP)
   ================================================== */

.collapse {
  transition: height 0.9s ease !important;
}