/* RESET E ESTILOS BÁSICOS */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --gol-orange: #ff7008;
  --gol-orange-light: #ff9d4f;
  --gol-orange-dark: #e05800;
  --gol-gray: #58595b;
  --gol-gray-light: #edf2f7;
  --gol-gray-dark: #2d3748;
  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.15), 0 2px 4px -1px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.15), 0 4px 6px -2px rgba(0, 0, 0, 0.1);
  --border-radius: 0.375rem;
  --transition-fast: 0.15s ease-in-out;
  --border-width: 2px;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  background: var(--gol-gray-light);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  color: var(--gol-gray-dark);
  line-height: 1.7;
}

/* CABEÇALHO E RODAPÉ */
header {
  background: white;
  color: var(--gol-gray-dark);
  padding: 0.7rem 0;
  box-shadow: var(--shadow-md);
  position: sticky;
  top: 0;
  z-index: 50;
  width: 100%;
  border-bottom: none;
  border-radius: 0 0 var(--border-radius) var(--border-radius);
  margin: 0 auto 0.5rem;
  max-width: 1220px;
}

header:after {
  display: none;
}

header .header-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.logo-container {
  flex-shrink: 0;
  width: 80px;
  display: flex;
  justify-content: flex-start;
}

.logo-placeholder {
  flex-shrink: 0;
  width: 80px;
  visibility: hidden;
}

.header-logo {
  height: 50px;
  margin-right: 0;
  flex-shrink: 0;
}

.header-title {
  text-align: center;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

header h1 {
  margin-bottom: 0.2rem;
  color: var(--gol-orange);
  font-weight: 700;
  font-size: 1.6rem;
  text-shadow: 0px 1px 1px rgba(0,0,0,0.1);
}

header .subtitle{
  font-size:1.0rem;
  color:var(--gol-gray);
  font-weight: 1000;
}


/* MAIN CONTENT */
main {
  max-width: 1200px;
  margin: 2rem auto;
  padding: 0 1rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* Container para componentes Next.js */
.container {
  width: 100%;
  background: white;
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-md);
  overflow: hidden;
  border: var(--border-width) solid #e0e0e0;
}

/* FIELDSET E LEGEND - MELHORIA DE VISUAL */
fieldset {
  border: var(--border-width) solid #e0e0e0;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  background: white;
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-sm);
}

legend {
  font-weight: 700;
  padding: 0 0.75rem;
  color: var(--gol-orange);
  font-size: 1.1rem;
  background-color: white;
}

/* SEÇÕES E TÍTULOS */
form section {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: var(--border-width) solid var(--gol-gray-light);
}

section h2 {
  margin-bottom: 1rem;
  font-size: 1.25rem;
  color: var(--gol-gray-dark);
  padding-left: 0.75rem;
  border-left: 4px solid var(--gol-orange);
  line-height: 1.4;
}

/* FORM GROUPS */
.form-group {
  margin-bottom: 1.25rem;
}

.form-group label {
  display: block;
  margin-bottom: 0.5rem;
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--gol-gray-dark);
}

.required {
  color: var(--gol-orange-dark);
  font-weight: bold;
  margin-left: 0.25rem;
}

/* CAMPOS DE TEXTO / SELECT / TEXTAREA */
.form-group input[type="text"],
.form-group input[type="date"],
.form-group input[type="number"],
.form-group input[type="tel"],
.form-group input[type="email"],
.form-group select,
.form-group textarea {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  padding: 0.75rem 0.9rem;
  border: var(--border-width) solid #c0c0c0;
  border-radius: var(--border-radius);
  font-size: 0.95rem;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  background-color: white;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
}

.form-group input:hover,
.form-group select:hover,
.form-group textarea:hover {
  border-color: var(--gol-gray);
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: var(--gol-orange);
  box-shadow: 0 0 0 3px rgba(255, 112, 8, 0.2);
}

/* Removendo o redimensionamento manual de textarea */
.form-group textarea {
  resize: none; 
  min-height: 60px;
  border: var(--border-width) solid #c0c0c0;
}

/* FORM ROW (FLEX) */
.form-row {
  display: flex;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.form-row .form-group {
  flex: 1;
}

/* CHECKBOX / RADIO GROUPS */
.checkbox-group {
  display: flex;
  gap: 1.25rem;
  margin-top: 0.5rem;
  flex-wrap: wrap;
}

.checkbox-group label {
  display: flex;
  align-items: center;
  font-weight: 400;
  cursor: pointer;
}

.checkbox-group input[type="checkbox"],
.checkbox-group input[type="radio"] {
  margin-right: 0.5rem;
  accent-color: var(--gol-orange);
  width: 1.1rem;
  height: 1.1rem;
  border: var(--border-width) solid var(--gol-gray);
}

.inline-label,
.inline {
  display: inline-flex;
  align-items: center;
  margin-left: 0.5rem;
  vertical-align: middle;
}

/* OBSERVAÇÕES / NOTES */
.observacao {
  margin: 0.75rem 0;
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--gol-gray-dark);
  padding: 0.9rem;
  background-color: var(--gol-gray-light);
  border-radius: var(--border-radius);
  border-left: 4px solid var(--gol-orange);
}

.note {
  font-size: 0.85rem;
  color: var(--gol-gray-dark);
  margin-top: 0.5rem;
  font-style: italic;
}

/* BOTOES */
.buttons {
  display: flex;
  gap: 1rem;
  margin-top: 1.5rem;
}

.buttons button {
  padding: 0.8rem 1.5rem;
  border: none;
  border-radius: var(--border-radius);
  cursor: pointer;
  font-weight: 600;
  font-size: 0.95rem;
  transition: all var(--transition-fast);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.buttons button:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(255, 112, 8, 0.3);
}

#btnValidar {
  background: var(--gol-gray-light);
  color: var(--gol-gray-dark);
  border: var(--border-width) solid #c0c0c0;
}

#btnValidar:hover {
  background: #e2e8f0;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

#btnEnviar {
  background: var(--gol-orange);
  color: white;
  border: var(--border-width) solid var(--gol-orange-dark);
}

#btnEnviar:hover {
  background: var(--gol-orange-dark);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

#btnGerarPDF {
  background: var(--gol-gray-dark);
  color: white;
  border: var(--border-width) solid #4a5568;
}

#btnGerarPDF:hover {
  background: #1a202c;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* MODAL */
#modal-overlay.hidden,
#email-modal-overlay.hidden {
  display: none;
}

#modal-overlay,
#email-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
  display: flex;
  justify-content: center;
  align-items: center;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

#modal-box {
  background-color: white;
  padding: 2rem;
  border-radius: var(--border-radius);
  max-width: 500px;
  width: 90%;
  box-shadow: var(--shadow-lg);
  border: var(--border-width) solid rgba(0,0,0,0.1);
}

#modal-title {
  margin-bottom: 1rem;
  color: var(--gol-orange);
  font-weight: 700;
  font-size: 1.25rem;
  border-bottom: 2px solid var(--gol-orange);
  padding-bottom: 0.5rem;
}

#modal-message {
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

#modal-close-btn {
  background-color: var(--gol-orange);
  color: white;
  padding: 0.75rem 1.25rem;
  border: none;
  cursor: pointer;
  border-radius: var(--border-radius);
  font-weight: 600;
  transition: background-color var(--transition-fast);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

#modal-close-btn:hover {
  background-color: var(--gol-orange-dark);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* AUTOEXPAND TEXTAREA */
.autoExpand {
  overflow-y: hidden;
  transition: height 0.2s ease;
}

/* CONTADOR DE CARACTERES (DISCRETO) */
.char-counter {
  font-size: 0.8rem;
  color: var(--gol-gray);
  margin-top: 0.5rem;
  text-align: right;
}

/* ANIMAÇÃO SHAKE (usada no JS) */
.shake {
  animation: shake-animation 0.5s ease;
}

@keyframes shake-animation {
  0% { transform: translate(0, 0); }
  20% { transform: translate(-5px, 0); }
  40% { transform: translate(5px, 0); }
  60% { transform: translate(-5px, 0); }
  80% { transform: translate(5px, 0); }
  100% { transform: translate(0, 0); }
}

/* Barra de Progresso */
#progressContainer {
  width: 100%;
  height: 12px;
  background-color: var(--gol-gray-light);
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid #d0d0d0;
}

#progressBar {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--gol-orange) 0%, var(--gol-orange-dark) 100%);
  transition: width 0.3s ease;
}

/* Badge Container */
.badge-container {
  margin-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
}

/* Cada medalha isolada */
.badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
  background-color: white;
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition-fast);
  border: var(--border-width) solid #e0e0e0;
}

.badge:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-md);
  border-color: var(--gol-orange-light);
}

/* Dimensões da imagem da medalha */
.badge img {
  width: 60px;
  height: 60px;
  object-fit: contain;
}

/* Texto abaixo do ícone da medalha */
.badge-label {
  display: block;
  margin-top: 0.75rem;
  font-weight: 600;
  font-size: 0.9rem;
  text-align: center;
  color: var(--gol-gray-dark);
}

.highlight-empty {
  border: 2px solid var(--gol-orange-dark) !important;
  background-color: rgba(255, 112, 8, 0.05);
}

.highlight-empty[type="radio"],
.highlight-empty[type="checkbox"] {
  outline: 3px solid var(--gol-orange-dark);
  box-shadow: 0 0 0 2px rgba(255, 112, 8, 0.3);
}

/* NAVEGAÇÃO E TABS */
.tabs-header {
  position: sticky;
  top: 6.5rem;
  background: white;
  z-index: 30;
  box-shadow: var(--shadow-md);
  padding: 0;
  border-bottom: none;
  margin: 1.5rem auto 1.5rem;
  border-radius: var(--border-radius);
  max-width: 1200px;
  overflow: hidden;
}

.tabs-nav {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
}

.tabs-nav .tabs-menu {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
  justify-content: center;
}

.tabs-nav .tabs-menu li {
  margin: 0;
}

.tabs-nav .tabs-menu li a {
  display: block;
  text-decoration: none;
  color: var(--gol-gray);
  padding: 0.6rem 1rem;
  font-weight: 500;
  font-size: 0.9rem;
  border-bottom: 3px solid transparent;
  transition: all var(--transition-fast);
  text-align: center;
}

.tabs-nav .tabs-menu li a:hover {
  color: var(--gol-orange);
  background: var(--gol-gray-light);
  border-color: var(--gol-orange-light);
}

.tabs-nav .tabs-menu li a.active {
  color: white;
  background: var(--gol-orange);
  border-color: transparent;
  font-weight: 600;
  position: relative;
}

.tabs-nav .tabs-menu li a.active::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid var(--gol-orange);
}

/* Conteúdo principal */
#mainFormContent {
  padding: 0;
  background: transparent;
}

#languageSelectorContainer {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem;
  text-align: right;
}

/* Cada seção do formulário */
form#formMedico > section {
  padding: 2rem;
  margin-bottom: 1.5rem;
  background: white;
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-md);
  border: var(--border-width) solid #e0e0e0;
  scroll-margin-top: 150px;
  transition: box-shadow var(--transition-fast), border-color var(--transition-fast);
}

form#formMedico > section:hover {
  box-shadow: var(--shadow-lg);
  border-color: #ccc;
}

form#formMedico > section:target {
  animation: highlight-section 1.5s ease-out;
}

@keyframes highlight-section {
  0% {
    background-color: rgba(255, 171, 0, 0.2);
    border-color: var(--gol-orange);
  }
  100% {
    background-color: white;
    border-color: #e0e0e0;
  }
}

/* Botão inativo */
.botao-inativo {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Evitar quebras bruscas e páginas extras quando o item é pequeno */
section, fieldset, .form-group {
  page-break-inside: avoid;
}



/* =============================== */
/*   AJUSTES PARA VERSÃO MOBILE    */
/*   (max-width: 768px)           */
/* =============================== */
@media (max-width: 768px) {
  html {
    font-size: 14px;
  }

  .form-row {
    flex-direction: column;
  }

  .buttons {
    flex-direction: column;
  }

  fieldset, section {
    padding: 1rem;
  }

  .tabs-nav .tabs-menu {
    flex-wrap: wrap;
  }

  .tabs-nav .tabs-menu li a {
    padding: 0.5rem;
  }

  header h1 {
    font-size: 1.3rem;
  }

  .header-logo {
    height: 45px;
  }
  
  .logo-container, .logo-placeholder {
    width: 65px;
  }

  #modal-box {
    width: 90%;
    max-width: 550px;
    padding: 1.5rem;
  }
}

/* =============================== */
/*   AJUSTES PARA TELAS MENORES    */
/*   (max-width: 480px)           */
/* =============================== */
@media (max-width: 480px) {
  html {
    font-size: 13px;
  }

  .tabs-nav .tabs-menu li a {
    padding: 0.4rem;
    font-size: 0.8rem;
  }

  fieldset, section {
    padding: 0.75rem;
  }

  .form-group {
    margin-bottom: 1rem;
  }

  .buttons button {
    padding: 0.75rem 1rem;
    width: 100%;
  }

  .header-content {
    flex-direction: column;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  .header-logo {
    height: 40px;
  }
  
  .logo-container {
    width: 100%;
    justify-content: center;
    margin-bottom: 10px;
  }
  
  .logo-placeholder {
    display: none;
  }
  
  .header-title {
    width: 100%;
  }
}





/* Classe utilitária já existente — continua igual */
.hidden {
  display: none !important;
}


/* ----  Modal "Condições Inaceitáveis"  --------------------- */
#modal-overlay-condicoes {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,.6);
  z-index: 999;
  display: flex;               /* centraliza a caixa */
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(4px);  /* mesmo efeito do primeiro modal */
}

#modal-box-condicoes {
  background: #fff;
  max-width: 500px;
  width: 90%;
  padding: 2rem;
  border-radius: 0.375rem;     /* --border-radius */
  border: 2px solid rgba(0,0,0,.1);
  box-shadow: 0 10px 15px -3px rgba(0,0,0,.15),
              0 4px 6px -2px rgba(0,0,0,.10);  /* --shadow-lg */
}

#modal-box-condicoes h3 {
  margin-bottom: 1rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--gol-orange);
  border-bottom: 2px solid var(--gol-orange);
  padding-bottom: .5rem;
}

#modal-box-condicoes ul { margin: 0 0 1.5rem 0; padding-left: 1.25rem; }

#modal-close-condicoes {
  background: var(--gol-orange);
  color: #fff;
  border: none;
  padding: .75rem 1.25rem;
  font-weight: 600;
  border-radius: .375rem;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0,0,0,.1);
  transition: background .15s ease-in-out;
}

#modal-close-condicoes:hover { background: var(--gol-orange-dark); }





/* -------  Assinatura Digital gov.br  ----------------------------- */
.btn-assinatura {
  background: var(--gol-orange);
  color: #fff;
  border: none;
  padding: .6rem 1.25rem;
  font-weight: 600;
  border-radius: var(--border-radius);
  cursor: pointer;
  transition: background var(--transition-fast);
}
.btn-assinatura:hover { background: var(--gol-orange-dark); }

/* Modal específico */
#modal-overlay-assinatura.hidden { display:none; }
#modal-overlay-assinatura {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 999;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}
#modal-box-assinatura {
  background:#fff; width:90%; max-width:560px;
  padding:2rem; border-radius:var(--border-radius);
  border:var(--border-width) solid rgba(0,0,0,.1);
  box-shadow: var(--shadow-lg);
}
#modal-title-assinatura {
  margin-bottom:1rem; font-size:1.25rem; font-weight:700;
  color:var(--gol-orange);
  border-bottom:2px solid var(--gol-orange); padding-bottom:.5rem;
}
.modal-scroll { max-height:60vh; overflow-y:auto; line-height:1.6; }
.modal-scroll ol { padding-left:1.2rem; }
.modal-scroll ul { padding-left:1.2rem; }
.center-link { text-align:center; margin-top:1.2rem; }
.modal-footer { text-align:right; margin-top:1.5rem; }


/* === Botão “+ Adicionar mais voos” =============================== */
/* insira após as demais regras, aproveitando as variáveis já definidas */

#addItinerarioBtn{
  /* reset da declaração inline e posicionamento coerente */
  margin: 0.75rem 0 1.25rem;
  display:inline-flex;                 /* ícone + texto alinhados */
  align-items:center;
  gap:.45rem;

  /* visual GOL */
  padding:.75rem 1.4rem;
  font:600 0.95rem/1 'Inter',sans-serif;
  background:var(--gol-orange);
  color:#fff;
  border:var(--border-width) solid var(--gol-orange-dark);
  border-radius:var(--border-radius);
  cursor:pointer;

  /* profundidade e transições */
  box-shadow:var(--shadow-sm);
  transition:
    background var(--transition-fast),
    transform   var(--transition-fast),
    box-shadow  var(--transition-fast);
}

/* estado hover (sobre‑voo) */
#addItinerarioBtn:hover{
  background:var(--gol-orange-dark);
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}

/* estado pressionado */
#addItinerarioBtn:active{
  transform:translateY(0);             /* retorno suave */
  box-shadow:var(--shadow-sm);
}

/* acessibilidade: foco pelo teclado */
#addItinerarioBtn:focus-visible{
  outline:3px solid rgba(255,112,8,.4);
  outline-offset:2px;
}

/* opcional — gera um ícone “+” consistente, dispensando o caractere no HTML */
#addItinerarioBtn::before{
  content:"+";
  font-size:1.15rem;
  line-height:1;
}


/* === Lista suspensa “Idioma” — harmonizada e ligeiramente mais robusta === */
/*  ▸ Mantém altura semelhante aos demais inputs, mas com impressão “gordinha”.
    ▸ Seta feita com bordas para acompanhar o estilo minimalista do formulário.
    ▸ Não interfere nos outros <select>.                                              */

    #languageSelectorContainer{
      position:relative;
      display:inline-block;          /* evita quebrar layout existente                */
      margin:0;                      /* segue alinhamento já usado no cabeçalho       */
    }
    
    #languageSelector{
      /* remove seta nativa para todos os navegadores */
      -webkit-appearance:none;
         -moz-appearance:none;
              appearance:none;
    
      /* “gordura” equilibrada — ligeiro aumento no padding vertical                 */
      padding:0.65rem 2.2rem 0.65rem 1rem;
    
      font:600 0.95rem/1 'Inter',sans-serif;
      color:var(--gol-gray-dark);
    
      background:#fff;
      border:var(--border-width) solid #c0c0c0;
      border-radius:var(--border-radius);
      box-shadow:inset 0 2px 4px rgba(0,0,0,0.05);
    
      cursor:pointer;
      transition:
        border-color var(--transition-fast),
        box-shadow   var(--transition-fast),
        background   var(--transition-fast);
    }
    
    /* seta customizada — pequeno “V” em SVG‑CSS (não cresce a caixa)      */
    #languageSelectorContainer::after{
      content:'';
      position:absolute;
      top:50%; right:1rem;
      width:0.45rem; height:0.45rem;
      border-right:2px solid var(--gol-gray-dark);
      border-bottom:2px solid var(--gol-gray-dark);
      transform:translateY(-60%) rotate(45deg);
      pointer-events:none;           /* não bloqueia cliques no <select>             */
      transition:border-color var(--transition-fast);
    }
    
    /* estados de interação --------------------------------------------- */
    #languageSelector:hover{
      border-color:var(--gol-gray);
    }
    
    #languageSelector:focus{
      outline:none;
      border-color:var(--gol-orange);
      box-shadow:0 0 0 3px rgba(255,112,8,.25);
    }
    
    /* refletir foco/hover também na cor da seta                            */
    #languageSelector:hover ~ #languageSelectorContainer::after,
    #languageSelector:focus ~ #languageSelectorContainer::after{  /* fallback p/ Safari */
      border-color:var(--gol-orange);
    }
    
    /* compatibilidade IE — remove seta antiga */
    #languageSelector::-ms-expand{ display:none; }
    
    /* === Reposicionamento da seta “Idioma” ============================= */
/* Use em conjunto com o bloco penúltimo (lista suspensa harmonizada) */

#languageSelectorContainer::after{
  /* desloca ligeiramente PARA BAIXO e PARA A ESQUERDA */
  top:46%;            /* ↓ move a seta para baixo          */
  right:1.45rem;      /* ← move a seta para a esquerda     */

  /* mantém o mesmo formato e rotação da seta */
  transform:translateY(-50%) rotate(45deg);
}

/* === Botão “Excluir” — compacto, não altera a altura dos campos ==== */
/* insira após o bloco do #addItinerarioBtn                           */

.removeItinerarioBtn{
  /* mantém só o recuo lateral pedido */
  margin:0 0 0 0.5rem;

  /* padding vertical reduzido → altura igual ao botão padrão original */
  padding:0.4rem 1.1rem;

  display:inline-flex;
  align-items:center;
  gap:.35rem;

  font:600 0.95rem/1 'Inter',sans-serif;
  background:var(--gol-gray-light);
  color:var(--gol-gray-dark);
  border:var(--border-width) solid #c0c0c0;
  border-radius:var(--border-radius);
  cursor:pointer;

  box-shadow:var(--shadow-sm);
  transition:
    background var(--transition-fast),
    color      var(--transition-fast),
    box-shadow var(--transition-fast),
    transform  var(--transition-fast);
}

.removeItinerarioBtn:hover{
  background:var(--gol-gray-dark);
  color:#fff;
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}

.removeItinerarioBtn:active{
  transform:translateY(0);
  box-shadow:var(--shadow-sm);
}

.removeItinerarioBtn:focus-visible{
  outline:3px solid rgba(88,89,91,.35); /* var(--gol-gray) opaco */
  outline-offset:2px;
}

/* opcional — ícone “×” */
.removeItinerarioBtn::before{
  content:"×";
  font-size:1rem;
  line-height:1;
}

/* === Botão “📖 Ver Lista Completa” — versão laranja GOL, mais alto ========= */
/* Substitui o bloco anterior do #btnVerCondicoes                              */

#btnVerCondicoes{
  /* leve afastamento de elementos adjacentes, se necessário                   */
  margin-left:0.5rem;

  /* altura um pouco maior: padding vertical idem aos principais botões        */
  padding:0.65rem 1.4rem;

  display:inline-flex;
  align-items:center;
  gap:.45rem;                            /* espaço entre ícone e texto         */

  font:600 0.95rem/1 'Inter',sans-serif;
  color:#fff;
  background:var(--gol-orange);
  border:var(--border-width) solid var(--gol-orange-dark);
  border-radius:var(--border-radius);
  cursor:pointer;

  box-shadow:var(--shadow-sm);
  transition:
    background var(--transition-fast),
    transform   var(--transition-fast),
    box-shadow  var(--transition-fast);
}

/* estado hover — cor mais escura e efeito de profundidade                     */
#btnVerCondicoes:hover{
  background:var(--gol-orange-dark);
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}

/* estado ativo — retorno suave                                                */
#btnVerCondicoes:active{
  transform:translateY(0);
  box-shadow:var(--shadow-sm);
}

/* acessibilidade: foco via teclado                                            */
#btnVerCondicoes:focus-visible{
  outline:3px solid rgba(255,112,8,.35);
  outline-offset:2px;
}

/* reforço visual do texto em <strong>                                         */
#btnVerCondicoes strong{
  font-weight:700;
}


/* ============================================================= */
/*  BLOCO “📊 Progresso”  +  “Faltam X campos” – layout aprimorado */
/*  ↳ cole APÓS as regras já existentes; não altera o HTML        */
/* ============================================================= */

/* ---------- 1. Wrapper: label + barra + percentual em linha ---- */
div:has(#progressContainer){
  display:flex;                       /* coloca tudo em uma linha      */
  align-items:center;
  gap:0.75rem;

  padding:0.65rem 1rem;               /* caixinha branca com leve sombra */
  background:#fff;
  border:var(--border-width) solid #e0e0e0;
  border-radius:var(--border-radius);
  box-shadow:var(--shadow-sm);
}

/* Label “📊 Progresso:” */
div:has(#progressContainer) > label{
  font:600 0.95rem/1 'Inter',sans-serif;
  color:var(--gol-gray-dark);
  user-select:none;
}

/* ---------- 2. Barra de progresso ------------------------------ */
#progressContainer{
  flex:1;                             /* cresce para ocupar o espaço   */
  height:14px;                        /* ↑ um pouco mais alta (antes 12) */
  background:var(--gol-gray-light);
  border-radius:999px;
  overflow:hidden;
  border:1px solid #cfd8e3;

  /* remove o “empurra‑conteúdo” da versão antiga */
  margin-bottom:0 !important;         /* ← EXCLUI ou sobrescreve o antigo */
}

#progressBar{
  height:100%;
  width:0%;                           /* atualizado via JS             */
  background:linear-gradient(90deg,var(--gol-orange) 0%,var(--gol-orange-dark) 100%);
  transition:width 0.35s ease;
}

/* Percentual numérico */
#progressPercent{
  min-width:3rem;                     /* reserva largura p/ não “pular” */
  text-align:right;
  font-weight:700;
  color:var(--gol-orange-dark);
}

/* ---------- 3. Aviso de campos obrigatórios pendentes ----------- */
p:has(#camposPendentes){
  margin-top:0.6rem;
  background:#fff;
  padding:0.75rem 1rem;
  border-radius:var(--border-radius);
  border-left:4px solid var(--gol-orange);
  box-shadow:var(--shadow-sm);
  font-size:0.93rem;
  color:var(--gol-gray-dark);
  line-height:1.5;
}

#camposPendentes{
  color:var(--gol-orange-dark);
  font-weight:700;
}
/* =============================================================== */
/*  “Carimbo Médico” – visual profissional seguindo a identidade GOL
/*  (cole após as regras já existentes e remova os *inline styles*
/*   do bloco #carimboPreview para evitar conflito)                */
/* =============================================================== */

/* Moldura principal ------------------------------------------------ */
#carimboPreview{
  /* tipografia de receita / carimbo */
  font-family:'Courier New',monospace;
  font-size:.92rem;
  line-height:1.35;

  /* caixa compacta */
  display:inline-block;
  min-width:260px;
  padding:1.25rem 1rem .75rem;
  max-width: 300px;    /* por exemplo, 300px de largura máxima */
  width: auto;         /* permite encolher até o mínimo */

  /* borda “carimbo” – sólida + cantos levemente arredondados */
  border:2px solid var(--gol-gray-dark);
  border-radius:4px;

  /* leve sombra para destacar sobre o formulário */
  box-shadow:0 2px 4px rgba(0,0,0,.15);

  /* fundo branco nítido */
  background:#fff;

  /* texto centralizado */
  text-align:center;
}

/* Linha de assinatura --------------------------------------------- */
#carimboLinha{
  margin-bottom:.35rem;
}

#carimboLinhaSpan{
  display:inline-block;
  border-bottom:2px solid #000;
  min-width:260px;          /* acompanha a caixa */
  max-width: 50%;
  height:0;                 /* apenas a linha    */
}

/* Nome do médico – maiúsculas, destaque --------------------------- */
#carimboNome{
  font-weight:700;
  text-transform:uppercase;
  margin-bottom:.25rem;
  letter-spacing:.5px;
  color:var(--gol-gray-dark);
}

#carimboNome,
#carimboEspecialidade,
#carimboCRM,
#carimboNomePassageiro {
  display: inline-block;       /* para respeitar max-width */
  max-width: 100%;             /* não ultrapassa o contêiner pai */
  white-space: normal;         /* permite quebra de linha */
  overflow-wrap: break-word;   /* quebra palavras longas */
  word-break: break-word;      /* compatibilidade adicional */
}

/* Especialidade / CRM --------------------------------------------- */
#carimboEspecialidade,
#carimboCRM{
  margin-bottom:.25rem;
  letter-spacing:.25px;
  color:var(--gol-gray);
  font-weight:600;
}

/* Selo “GOL” suave no fundo (opcional) ---------------------------- */
#carimboPreview::after{
  content:'GOL';
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%) rotate(-15deg);
  font:700 3rem 'Inter',sans-serif;
  color:var(--gol-orange);
  opacity:.05;              /* leve marca d’água */
  pointer-events:none;
}

/* =============================================================== */
/*  Ajustes finais – Carimbo Médico                                */
/*  ↳ Mais espaço para assinar + linha encostada no nome           */
/* =============================================================== */

/* 1 ▸ Aumenta o “teto” do carimbo para caber a assinatura */
#carimboPreview{
  padding-top:5.75rem;          /* era 1.25rem: agora há ~1,5 cm livres */
}

/* 2 ▸ Aproxima a linha do campo “Nome” */
#carimboLinha{
  margin-bottom:0.05rem;         /* era .9rem */
}

/* (As demais regras do carimbo permanecem iguais) */

/* ================================================================== */
/* 1. BANNER “Assinatura gov.br”                                       */
/* ================================================================== */

#bannerAssinaturaDigital{
  /* card destacado, mas coeso com as cores GOL */
  position:relative;
  padding:1.25rem 1.5rem 1.5rem;
  border:var(--border-width) solid #e0e0e0;
  border-left:6px solid var(--gol-orange);
  border-radius:var(--border-radius);
  background:#fff;
  box-shadow:var(--shadow-sm);
  font-size:.93rem;
  line-height:1.6;
}

#bannerAssinaturaDigital::before{
  /* ícone decorativo de “certificado” */
  content:'🔏';
  position:absolute;
  left:.75rem; top:.85rem;
  font-size:1.35rem;
  opacity:.8;
}

#bannerAssinaturaDigital p{
  margin:0;                       /* zera margens extras do <p>     */
  color:var(--gol-gray-dark);
}

#bannerAssinaturaDigital strong{
  color:var(--gol-orange-dark);
}

#bannerAssinaturaDigital .note{
  margin-top:.9rem;
  font-size:.85rem;
  background:var(--gol-gray-light);
  border-left:none;               /* remove a faixinha da classe .note */
  padding:.6rem .8rem;
  border-radius:calc(var(--border-radius) - 1px);
}


/* ================================================================== */
/* 2. BOTÃO “Assinar Agora 💻”                                         */
/*    (aprimora .btn-assinatura já existente)                          */
/* ================================================================== */

.btn-assinatura{
  display:inline-flex;
  align-items:center;
  gap:.4rem;                      /* espaço entre texto e ícone     */
  padding:.7rem 1.45rem;
  font:600 .95rem/1 'Inter',sans-serif;
  background:var(--gol-orange);
  color:#fff;
  border:var(--border-width) solid var(--gol-orange-dark);
  border-radius:var(--border-radius);
  cursor:pointer;
  box-shadow:var(--shadow-sm);
  transition:background var(--transition-fast),
             box-shadow  var(--transition-fast),
             transform   var(--transition-fast);
}

.btn-assinatura:hover{
  background:var(--gol-orange-dark);
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}

.btn-assinatura:active{
  transform:translateY(0);
  box-shadow:var(--shadow-sm);
}

.btn-assinatura:focus-visible{
  outline:3px solid rgba(255,112,8,.35);
  outline-offset:2px;
}


/* ================================================================== */
/* 3. MODAL “Assinatura Digital gov.br”                                */
/* ================================================================== */

#modal-box-assinatura{
  max-width:600px;               /* ligeiramente mais largo         */
  padding:2rem 2.25rem;
  border-radius:var(--border-radius);
  border:var(--border-width) solid rgba(0,0,0,.08);
  box-shadow:var(--shadow-lg);
}

/* Títulos internos */
#modal-box-assinatura h4{
  font-size:1.05rem;
  color:var(--gol-orange-dark);
  margin-top:1.2rem;
  margin-bottom:.4rem;
}

/* Lista numerada do passo a passo */
#modal-box-assinatura ol{
  margin-left:1.25rem;
  padding-left:.25rem;
}

#modal-box-assinatura ol li{
  margin-bottom:.6rem;
}

/* link botão dentro do modal */
.center-link .btn-assinatura{
  margin-top:.4rem;
}

/* rodapé do modal */
.modal-footer{
  margin-top:1.75rem;
  text-align:right;
}

#modal-close-assinatura{
  min-width:120px;
}


/* =========================================================== */
/*  FOOTER “GOL Linhas Aéreas” – versão robusta e responsiva    */
/*  ↳ Substitui o bloco antigo `footer { ... }` e `footer p {}` */
/* =========================================================== */

footer{
  background:linear-gradient(170deg,#27303b 0%,var(--gol-gray-dark) 100%);
  color:#f7fafc;
  padding:3rem 1rem 2.5rem;
  margin-top:3rem;
  border-top:6px solid var(--gol-orange);
  position:relative;
  text-align:center;
  overflow:hidden;                  /* garante que pseudo‑elementos não vazem */
  box-shadow:0 -6px 12px -4px rgba(0,0,0,.25);
}

/* faixinha laranja translúcida no canto inferior‑esquerdo */
footer::before{
  content:'';
  position:absolute;
  left:-20%; bottom:-50%;
  width:140%; height:140%;
  background:var(--gol-orange);
  opacity:.03;
  transform:rotate(-8deg);
}

/* título do footer */
footer p:first-child{
  font:600 1.05rem/1.3 'Inter',sans-serif;
  letter-spacing:.4px;
  margin:0 0 .35rem;
}

/* copyright / linha secundária */
footer p:last-child{
  font:500 .85rem/1.4 'Inter',sans-serif;
  opacity:.9;
  margin:0;
}

/* responsividade: reduz altura em telas pequenas */
@media(max-width:480px){
  footer{ padding:2.25rem .75rem 2rem; }
}


/* =============================================================== */
/*   1 ▸ “Concorda com os termos?”  (radios Sim/Não)                */
/* =============================================================== */

/* Caixa inteira alinhada com o restante do formulário */
.form-group:has([name="aceiteTermo"]){
  padding:1.15rem 1.25rem;
  background:#fff;
  border:var(--border-width) solid #e0e0e0;
  border-radius:var(--border-radius);
  box-shadow:var(--shadow-sm);
}

/* Título da pergunta */
.form-group:has([name="aceiteTermo"]) > label{
  font:600 .95rem/1 'Inter',sans-serif;
  color:var(--gol-gray-dark);
  margin-bottom:.65rem;
}

/* Radios em “pílulas” (chips) */
.form-group:has([name="aceiteTermo"]) .checkbox-group{
  gap:.8rem;
}

.form-group:has([name="aceiteTermo"]) .checkbox-group label{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.45rem 1.2rem;
  background:#f7fafc;
  border:var(--border-width) solid #cfd8e3;
  border-radius:50px;
  cursor:pointer;
  font-weight:600;
  transition:background var(--transition-fast),
             border-color var(--transition-fast),
             color        var(--transition-fast);
}

.form-group:has([name="aceiteTermo"]) .checkbox-group input[type="radio"]{
  accent-color:var(--gol-orange);
  width:1.1rem; height:1.1rem;
}

/* estado selecionado */
.form-group:has([name="aceiteTermo"]) .checkbox-group input[type="radio"]:checked + *{
  background:var(--gol-orange);
  border-color:var(--gol-orange-dark);
  color:#fff;
}

/* =============================================================== */
/*   2 ▸ Declaração do art. 299 (checkbox “👍 Ciente”)              */
/* =============================================================== */

/* Wrapper em grade de duas colunas */
#containerCrimeCiente{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1rem 1.25rem;
  align-items:flex-start;
  margin-top:1.25rem;
  background:#fff;
  border:var(--border-width) solid #e0e0e0;
  border-radius:var(--border-radius);
  padding:1.25rem 1.5rem;
  box-shadow:var(--shadow-sm);
}

/* Coluna do checkbox */
#crimeCiente{
  margin-top:.25rem;                 /* reduz espaço morto           */
  width:1.3rem; height:1.3rem;
  accent-color:var(--gol-orange);
  cursor:pointer;
  box-shadow:0 0 0 1px rgba(0,0,0,.15);
}

label[for="crimeCiente"]{
  font:600 .9rem/1 'Inter',sans-serif;
  margin-top:.35rem;
  user-select:none;
}

/* Texto legal (disclaimer) */
.disclaimer{
  font-size:.88rem;
  line-height:1.55;
  background:#fffbe6;
  border-left:4px solid var(--gol-orange-light);
  border-radius:calc(var(--border-radius) - 1px);
  padding:.9rem 1rem;
  color:#4a4a4a;
}

/* negrito dentro do disclaimer usa cor GOL */
.disclaimer strong{
  color:var(--gol-gray-dark);
}


/* =============================================================== */
/*  CARIMBO DO PASSAGEIRO – estilo “receituário” GOL               */
/*  ↳ substitui todos os *inline styles* do bloco HTML             */
/* =============================================================== */

/* Moldura principal --------------------------------------------- */
#carimboPassageiroContainer{
  font-family:'Courier New',monospace;
  font-size:.92rem;
  line-height:1.35;

  display:inline-block;
  min-width:260px;
  max-width: 300px;    /* por exemplo, 300px de largura máxima */
  width: auto;         /* permite encolher até o mínimo */

  /* espaço extra para a assinatura */
  padding:2.75rem 1rem .75rem;     /* ↑ mesma lógica do carimbo médico */

  background:#fff;
  border:2px solid var(--gol-gray-dark);
  border-radius:4px;
  box-shadow:0 2px 4px rgba(0,0,0,.15);
  text-align:center;
  position:relative;
}

/* Linha de assinatura ------------------------------------------- */
#carimboLinhaPassageiro{
  margin-bottom:.01rem;           /* bem perto do nome */
}

#carimboLinhaPassageiroSpan{
  display:inline-block;
  min-width:260px;
  max-width: 50%;
  border-bottom:2px solid #000;
  height:0;
}

/* Nome do passageiro -------------------------------------------- */
#carimboNomePassageiro{
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.4px;
  margin-bottom:.25rem;
  color:var(--gol-gray-dark);
}

/* CPF / Documento ----------------------------------------------- */
#carimboDocPassageiro{
  font-weight:600;
  letter-spacing:.25px;
  color:var(--gol-gray);
  margin-bottom:.2rem;
}

/* Marca d’água (opcional) --------------------------------------- */
#carimboPassageiroContainer::after{
  content:'PASSAGEIRO';
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%) rotate(-15deg);
  font:700 2.4rem 'Inter',sans-serif;
  color:var(--gol-orange);
  opacity:.05;
  pointer-events:none;
}


/* ============================================================ */
/*  Ajustes finais – Carimbo do Passageiro                      */
/*  ▸ Mais área em branco para a assinatura                      */
/*  ▸ Linha de assinatura colada ao nome                         */
/* ============================================================ */

/* 1 ▸ Sobe a moldura ↗ (mais espaço entre borda e assinatura)  */
#carimboPassageiroContainer{
  padding-top:6.25rem;      /* era 2.75rem */
}


/* =============================================================== */
/*  1 ▸ CONTÊINER “Condições Inaceitáveis”                          */
/* =============================================================== */

#condicoesAckContainer{
  margin-top:1.5rem;
  background:#fff;
  border:var(--border-width) solid #e0e0e0;
  border-radius:var(--border-radius);
  padding:1.5rem 1.75rem;
  box-shadow:var(--shadow-sm);
  text-align:center;
}

/* =============================================================== */
/*  2 ▸ Botão “📖 Ver Lista Completa”                               */
/*      (usa #btnVerCondicoes já estilizado anteriormente)          */
/* =============================================================== */

/* nenhuma alteração necessária aqui; o estilo já foi definido     */


/* =============================================================== */
/*  3 ▸ Checkbox “👍 Declaro que li…”                                */
/* =============================================================== */

#condicoesAckContainer .inline-label{
  /* layout horizontal elegante */
  display:inline-flex;
  align-items:flex-start;
  gap:.55rem;

  margin-top:1rem;
  font:600 .9rem/1.45 'Inter',sans-serif;
  color:var(--gol-gray-dark);
}

/* remove o <p>&nbsp;</p> distorcido (se não puder remover no HTML) */
#condicoesAckContainer .inline-label p{ display:none; }

#cienteCondicoes{
  width:1.3rem; height:1.3rem;
  accent-color:var(--gol-orange);
  cursor:pointer;
  box-shadow:0 0 0 1px rgba(0,0,0,.15);
}

/* =============================================================== */
/*  4 ▸ “Importante” (disclaimer)                                   */
/* =============================================================== */

#condicoesAckContainer + .disclaimer{
  margin-top:1.25rem;                  /* igual ao container        */
  font-size:.88rem;
  line-height:1.55;
  background:#fffbe6;
  border-left:4px solid var(--gol-orange-light);
  border-radius:calc(var(--border-radius) - 1px);
  padding:.9rem 1rem;
  color:#4a4a4a;
}

#condicoesAckContainer + .disclaimer strong{
  color:var(--gol-gray-dark);
}

/* =============================================================== */
/*  5 ▸ LIMPEZA DE INLINE STYLES                                   */
/* =============================================================== */
/*  ─ Remova os atributos style="..." dos elementos:
      • <div id="condicoesAckContainer ...>
      • <label class="inline-label" style="...">
      • <div class="disclaimer" style="...">
      (Os estilos acima substituem‑nos por completo.)               */


      /* ================================================================= */
/*  HEADER “MEDIF – GOL Linhas Aéreas” — refinamentos visuais         */
/*  ↳ cole AO FINAL do seu CSS existente; apenas sobrepõe detalhes    */
/* ================================================================= */

/* 1 ▸ Caixa principal — mais presença e leve acento em laranja ----- */
header{
  padding:1rem 0 .9rem;                     /* + espaço interno       */
  box-shadow:0 4px 8px rgba(0,0,0,.08);     /* sombra mais suave      */
  border-bottom:3px solid var(--gol-orange-light);
  position:sticky;                          /* já definido, reforçado */
}

/* Barra laranja em dégradé colada na base do header                 */
header::after{
  content:'';
  position:absolute;
  left:0; bottom:-3px;
  width:100%; height:4px;
  background:linear-gradient(90deg,var(--gol-orange) 0%,var(--gol-orange-dark) 100%);
  border-radius:0 0 var(--border-radius) var(--border-radius);
  display:block;                            /* sobrepõe display:none  */
}

/* 2 ▸ Conteúdo interno -------------------------------------------- */
.header-content{
  gap:1.25rem;                              /* separação mais folgada */
  position:relative;                        /* p/ empilhar ::after    */
  z-index:1;                                /* fica acima da faixa    */
}

/* 3 ▸ Logo — ligeiro aumento e micro‑animação --------------------- */
.header-logo{
  height:78px;                              /* era 60px              */
  transition:transform var(--transition-fast);
}
header:hover .header-logo{
  transform:scale(1.05);
}

/* 4 ▸ Título e subtítulo ----------------------------------------- */
header h1{
  font-size:1.7rem;                         /* +0.1rem                */
  letter-spacing:.3px;
}

/* sutil barra fina abaixo do h1 (opcional) */
.header-title::after{
  content:'';
  display:block;
  width:120px; height:3px;
  margin:.4rem auto 0;
  background:var(--gol-orange);
  border-radius:4px;
  opacity:.85;
}

header .subtitle{
  font-size:1.0rem;                         /* +0.05rem               */
  color:var(--gol-gray);
}

/* 5 ▸ Responsividade refinada ------------------------------------ */
@media(max-width:768px){
  header{ padding:.85rem 0 .75rem; }
  header h1{ font-size:1.45rem; }
  .header-logo{ height:54px; }
  .header-title::after{ width:48px; }
}

@media(max-width:480px){
  header h1{ font-size:1.35rem; }
  .header-logo{ height:48px; }
  .header-title::after{ width:40px; }
}

/* ========================================================== */
/*  “Anti‑Overlapping” — garante espaço FIXO entre             */
/*  o header e a barra de guias (.tabs-header)                */
/*  ▸ cole depois de todos os outros blocos CSS               */
/* ========================================================== */

/* 1 ▸ Define uma variável com a altura final aproximada do header */
:root{
  --header-offset: 6.6rem;    /* ≈ 86‑90 px. Ajuste se mudar o logo/padding */
}

/* 2 ▸ Usa a variável para empurrar a barra de guias sticky        */
.tabs-header{
  top: calc(var(--header-offset) + .6rem);   /* +0.6 rem de respiro */
}

/* 3 ▸ Mantém coerente em telas menores com @media queries         */
@media(max-width:768px){
  :root{ --header-offset: 5rem; }            /* header reduzido     */
}

@media(max-width:480px){
  :root{ --header-offset: 4.4rem; }          /* ainda menor         */
}

/* 4 ▸ (Opcional) Para dar um “alívio” visual, você pode              */
/*   adicionar um pequeno sombreado ao .tabs-header quando fixo.     */
.tabs-header{
  transition:box-shadow .2s ease-in-out;
}
.tabs-header.sticky-shadow{                  /* adicione via JS se quiser */
  box-shadow:0 2px 6px rgba(0,0,0,.1);
}

/* =============================================================== */
/*  GUIAS (“tabs-header”) — retoques de usabilidade e polimento GOL */
/*  ↳ cole AO FIM do CSS. Mantém TODOS espaçamentos já existentes   */
/* =============================================================== */

/* 1 ▸ Container fixo: fino traço cinza abaixo p/ separar do texto  */
.tabs-header{
  border-bottom:1px solid #e2e8f0;          /* traço discreto        */
  box-shadow:0 2px 3px rgba(0,0,0,.04);     /* micro‑sombra          */
  backdrop-filter:saturate(180%) blur(6px); /* leve efeito vidro     */
}

/* 2 ▸ Barra horizontal rola suavemente em telas estreitas          */
.tabs-nav{
  overflow-x:auto;
  scrollbar-width:none;                     /* Firefox               */
  -ms-overflow-style:none;                  /* IE/Edge antigo        */
}
.tabs-nav::-webkit-scrollbar{ display:none; }/* Chrome/Safari        */

/* 3 ▸ Ítens não quebram linha e têm snap‑scroll opcional           */
.tabs-menu{
  flex-wrap:nowrap;                         /* sempre numa linha     */
  scroll-snap-type:x proximity;
}
.tabs-menu li{ flex:0 0 auto; }

/* 4 ▸ Links: borda arredondada + transições sutis                   */
.tabs-menu li a{
  white-space:nowrap;
  border-radius:var(--border-radius) var(--border-radius) 0 0;
  transition:
    color        var(--transition-fast),
    background   var(--transition-fast),
    box-shadow   var(--transition-fast);
}

/* 5 ▸ Hover: fundo cinza claríssimo e leve sombra                  */
.tabs-menu li a:hover{
  background:rgba(0,0,0,.035);
  box-shadow:inset 0 -3px 0 var(--gol-orange-light);
}

/* 6 ▸ Ativo: cor laranja e recorte inferior em semicírculo         */
.tabs-menu li a.active{
  background:#fff;
  color:var(--gol-orange-dark);
  box-shadow:0 -2px 0 var(--gol-orange-dark);
}
.tabs-menu li a.active::after{            /* “gotinha” sob o ativo  */
  content:'';
  position:absolute; left:50%; bottom:-5px;
  transform:translateX(-50%);
  width:12px; height:4px;
  background:#fff;
  border-radius:60%;
}

/* 7 ▸ Responsivo: encolhe padding sem alterar as margens globais   */
@media(max-width:768px){
  .tabs-menu li a{ padding:.55rem .9rem; font-size:.85rem; }
}
@media(max-width:480px){
  .tabs-menu li a{ padding:.5rem .75rem; font-size:.8rem; }
}

/* 8 ▸ Idioma selector já estilizado anteriormente                  */
/*    (nenhuma alteração aqui; continua usando #languageSelector)   */

/* =============================================================== */
/*  CHECKBOXES — todos EXACTAMENTE do mesmo tamanho                 */
/*  ▸ cole no FINAL do CSS; sobrepõe qualquer largura/altura prévia */
/* =============================================================== */

:root{
  --checkbox-size: 1.35rem;        /* defina aqui o tamanho único */
}

/* regra genérica (alinha 99 % dos casos) ------------------------ */
input[type="checkbox"]{
  width     : var(--checkbox-size) !important;
  height    : var(--checkbox-size) !important;
  min-width : var(--checkbox-size) !important;
  min-height: var(--checkbox-size) !important;
}

/* reforço para elementos que tinham regras específicas --------- */
.checkbox-group input[type="checkbox"],
#crimeCiente,
#cienteCondicoes{
  width     : var(--checkbox-size) !important;
  height    : var(--checkbox-size) !important;
  min-width : var(--checkbox-size) !important;
  min-height: var(--checkbox-size) !important;
}

/* (mantém accent‑color, bordas e demais estilos já existentes)   */

/* =============================================================== */
/*  PADRONIZAÇÃO + AUMENTO SUAVE DOS BOTÕES DE OPÇÃO (RADIOS)       */
/*  ▸ cole AO FINAL do arquivo, depois das regras de checkbox       */
/* =============================================================== */

:root{
  --radio-scale: 1.25;        /* 1.25 = +25 % — ajuste a gosto       */
}

/* Universal: TODOS <input type="radio"> */
input[type="radio"]{
  /* largura/altura base (para navegadores que respeitam)            */
  width:1rem !important;
  height:1rem !important;
  min-width:1rem !important;
  min-height:1rem !important;

  /* aumento visual consistente em TODOS os navegadores              */
  transform:scale(var(--radio-scale)) !important;
  transform-origin:center;

  /* mantém cor de destaque já definida pelo tema                     */
  /* accent-color: var(--gol-orange); — já existe em regras anteriores */
}

/* ================================================================= */
/*  Radios maiores — garante TAMANHO FIXO em TODAS as fases           */
/*  (desmarcado, marcado, foco ou ativo)                              */
/*  ▸ adicione logo DEPOIS do bloco anterior que define --radio-scale */
/* ================================================================= */

/* estado normal já escalonado ------------------------------------ */
input[type="radio"]{
  transform:scale(var(--radio-scale)) !important;
  transform-origin:center;
}

/* reforço para quaisquer estados onde o UA sobrescreve transform -- */
input[type="radio"]:checked,
input[type="radio"]:focus-visible,
input[type="radio"]:active{
  transform:scale(var(--radio-scale)) !important;
  transform-origin:center;
}

/* =========================================================== */
/*  BOTÕES DA SEÇÃO 16 — acabamento “GOL” consistente           */
/*  ↳ cole no fim do CSS para sobrepor estilos anteriores       */
/* =========================================================== */

/* base: herda de .buttons button (altura, padding, radius, etc.) */
.buttons button{
  display:inline-flex;               /* ícone + texto alinhados */
  align-items:center;
  gap:.45rem;                        /* espaço entre emoji/ícone e texto */
  font:600 .95rem/1 'Inter',sans-serif;
  transition:
    background var(--transition-fast),
    color      var(--transition-fast),
    box-shadow var(--transition-fast),
    transform  var(--transition-fast);
}

/* ----------------------------------------------------------- */
/* 1 ▸ Enviar                                                  */
#btnEnviar{
  background:var(--gol-orange);
  color:#fff;
  border:var(--border-width) solid var(--gol-orange-dark);
  box-shadow:var(--shadow-sm);
}
#btnEnviar:hover{
  background:var(--gol-orange-dark);
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}
#btnEnviar:active{
  transform:translateY(0);
  box-shadow:var(--shadow-sm);
}
#btnEnviar:focus-visible{
  outline:3px solid rgba(255,112,8,.35);
  outline-offset:2px;
}

#btnMEDIFFREMEC{
  background:var(--gol-orange);
  color:#fff;
  border:var(--border-width) solid var(--gol-orange-dark);
  box-shadow:var(--shadow-sm);
}
#btnMEDIFFREMEC:hover{
  background:var(--gol-orange-dark);
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}
#btnMEDIFFREMEC:active{
  transform:translateY(0);
  box-shadow:var(--shadow-sm);
}
#btnMEDIFFREMEC:focus-visible{
  outline:3px solid rgba(255,112,8,.35);
  outline-offset:2px;
}

/* ----------------------------------------------------------- */
/* 2 ▸ Gerar PDF / Imprimir                                    */
#btnGerarPDF{
  background:var(--gol-gray-dark);
  color:#fff;
  border:var(--border-width) solid #4a5568;
  box-shadow:var(--shadow-sm);
}
#btnGerarPDF:hover:not(:disabled){
  background:#1a202c;
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}
#btnGerarPDF:disabled{
  opacity:.55;
  cursor:not-allowed;
}
#btnGerarPDF:focus-visible{
  outline:3px solid rgba(47,55,65,.35);
  outline-offset:2px;
}

/* ----------------------------------------------------------- */
/* 3 ▸ Limpar Tudo                                             */
#btnLimparTudo{
  background:#fff;
  color:#e53e3e;                             /* tom rubi — alerta */
  border:var(--border-width) solid #e53e3e;
  box-shadow:var(--shadow-sm);
}
#btnLimparTudo:hover{
  background:#ffe8e8;
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}
#btnLimparTudo:active{
  transform:translateY(0);
  box-shadow:var(--shadow-sm);
}
#btnLimparTudo:focus-visible{
  outline:3px solid rgba(229,62,62,.35);
  outline-offset:2px;
}

/* ----------------------------------------------------------- */
/* 4 ▸ Destacar Campos Não Preenchidos                         */
#btnCamposNaoPreenchidos{
  background:var(--gol-gray-light);
  color:var(--gol-orange-dark);
  border:var(--border-width) solid var(--gol-orange);
  box-shadow:var(--shadow-sm);
}
#btnCamposNaoPreenchidos:hover{
  background:#fdf2ec;                        /* laranja claríssimo */
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}
#btnCamposNaoPreenchidos:active{
  transform:translateY(0);
  box-shadow:var(--shadow-sm);
}
#btnCamposNaoPreenchidos:focus-visible{
  outline:3px solid rgba(255,112,8,.35);
  outline-offset:2px;
}
/* ---------------- CENTRAGEM DA “caixa de botões” ---------------- */
section.buttons{
  display:flex;                 /* já existia, só ajustamos */
  justify-content:center;       /* ↤↦ centraliza horizontal */
  flex-wrap:wrap;               /* quebra linha se faltar espaço */
  gap:1rem;                     /* mantém o espaçamento original */
  text-align:center;            /* garante centragem em telas muito estreitas */
}



/*═══════════════════════════════════════════════════════════════
   GOL ▸ Seletor de Idioma • EXTRA  V‑06
═══════════════════════════════════════════════════════════════*/

/* 1 ▸ Fade global de 600 ms */
html.translate-fade{opacity:0;transition:opacity .6s ease;}

/* 2 ▸ Slide‑in inicial */
@keyframes slideIn{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}
#languageSelectorContainer{transform-origin:top;animation:slideIn .12s ease-out;}


/* ──────────────────────────────────────────────────────────────────────────
   BOTÃO LEIA MAIS  –  Padronizado no tema GOL / melhorado
   • Mantém tokens:  --gol-gray-light | --gol-gray-dark | --border-width …
   • Compatível desktop + mobile, dark-mode e redução de movimento
   • Usa flex p/ alinhar ícone-texto, dá área de toque >48 px (WCAG)
   ─────────────────────────────────────────────────────────────────────── */
   #btnLeiaMais{
    display: inline-flex;           /* alinhamento ícone + texto */
    align-items: center;
    gap: .4rem;                     /* distância ícone-texto */
    min-height: 2.8rem;            /* ≥44 px → área de toque segura */
    padding: .6rem 1.4rem;
  
    background: var(--gol-gray-light, #edf2f7);
    color:      var(--gol-gray-dark,  #2d3748);
  
    border: var(--border-width, 1px) solid #c0c0c0;
    border-radius: var(--border-radius, .375rem);
  
    font: 600 .95rem/1.1 'Inter', sans-serif;
    cursor: pointer;
  
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.08));
    transition:
      background var(--transition-fast, .15s),
      transform  var(--transition-fast, .15s),
      box-shadow var(--transition-fast, .15s);
  }
  
  /* Hover / foco visível --------------------------------------------------- */
  #btnLeiaMais:hover,
  #btnLeiaMais:focus-visible{
    background: #e2e8f0;
    box-shadow: var(--shadow-md, 0 4px 6px -1px rgba(0,0,0,.15));
    transform: translateY(-2px);
  }
  
  #btnLeiaMais:focus-visible{
    outline: 3px solid rgba(255,112,8,.35); /* laranja GOL sem prejudicar contraste */
    outline-offset: 2px;
  }
  
  /* Clique (ativo) --------------------------------------------------------- */
  #btnLeiaMais:active{
    transform: translateY(0);
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(0,0,0,.08));
  }
  
  /* Dark mode – mantém contraste adequado ---------------------------------- */
  @media (prefers-color-scheme: dark){
    #btnLeiaMais{
      background: #3a3b3d;
      color: #f7fafc;
      border-color: #5a5a5a;
    }
    #btnLeiaMais:hover,
    #btnLeiaMais:focus-visible{
      background: #47484b;
    }
  }
  
  /* Reduz movimentação para quem prefere motion-safe ----------------------- */
  @media (prefers-reduced-motion: reduce){
    #btnLeiaMais{
      transition: none;
    }
    #btnLeiaMais:hover,
    #btnLeiaMais:focus-visible,
    #btnLeiaMais:active{
      transform: none;
    }
  }
  
  /* Área de toque extra para telas touch (pointer: coarse) ----------------- */
  @media (pointer: coarse){
    #btnLeiaMais{
      padding: .85rem 1.6rem;  /* aumenta finger-target */
      font-size: 1rem;
    }
  }
  

/* Alinhamento à direita para qualquer bloco .buttons.right */
.buttons.right {
  justify-content: flex-end;
}
/*───────────────  INVISÍVEL NA TELA — IMPRESSO NO PDF  ───────────────*/
.print-only { display:none !important; }

@media print {

  /* folha A4 com margens mínimas (3 mm) */
  @page { size: A4 portrait;}

   /* 2 ▸ mova o rodapé exatamente esses 10 mm para fora da área útil */
  #printSecurityFooter{
    bottom:-4.5mm !important;     /* mesmo valor, mas negativo          */
  }

  /* 3 ▸ garanta que NÃO existam outras regras de bottom depois disto  */
/* o rodapé continua fixo no fundo da folha */
   
  /* mostra só #printLayout */
  body > *:not(.print-only){ display:none !important; }


  
  

  #printLayout{
    display:table !important;
    width:100%;
    margin:0 auto;
    border-collapse:collapse;
    table-layout:fixed;
  }

  /* cabeçalho e rodapé ocupam apenas a altura do conteúdo */
  #printLayout thead tr,
  #printLayout tfoot tr{ height:auto; }

  /* células coladas nas laterais */
  #printLayout th,
  #printLayout td{
    padding:0.05rem 0.08rem;   /* vertical 0,05 rem  | horizontal 0,08 rem */
    vertical-align:top;
    overflow:hidden;
  }

  /* fonte base ≈ 8 pt antes do zoom */
  html{ font-size:60%; }
  body{ line-height:1.0; color:#000; }

  /* respiro mínimo entre blocos */
  fieldset,section,.form-group{ margin-block:0.1rem !important; }

  /* remove fundos/sombras */
  *,*::before,*::after{
    background:transparent !important;
    box-shadow:none !important;
  }
}


@media print{
  .no-print{ display:none !important; }
}

/*───────────────────────────────────────────────────────────
  1 ▸ Exibe .print-only apenas no modo impressão
───────────────────────────────────────────────────────────*/
@media print{ .print-only{ display: initial !important; } }

/*───────────────────────────────────────────────────────────
  2 ▸ Rodapé antifraude – layout “GOL” (versão compacta)
───────────────────────────────────────────────────────────*/
@media print{
  #printSecurityFooter{
    position:static;
                   /* Quiet Zone mínima   */
    


    /* CENTRALIZAÇÃO --------------------------- */
    inset-inline: 0;          /* equivale a left:0; right:0;        */
    width: 95%;               /* largura desejada                    */
    margin-inline: auto;      /* ↤↦ distribui 2,5 % de cada lado     */


    border-top:2pt solid #ff7008;
    display:flex;
    justify-content:space-between;
    gap:0mm;
    font:7pt/1.3 'Inter',sans-serif;
    background:#fff;

  

  }

  

  /* coluna A – passageiro, data, código, página ---------------------- */
  .info-area{ flex:0 0 45%; }
                 /* Quiet Zone mínima   */

  .info-area *{ margin:0; }            /* zera margens internas */
  .info-area strong{ color:#ff7008; font-weight:700; }
  .sec-code{ font-weight:700; color:#ff7008; }


  /* coluna B – assinatura / carimbo ---------------------------------- */
  .sig-area{
    flex:0 0 35%;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;          /* conteúdo interno encostado embaixo */
    align-items:center;
    margin-top:auto;                   /* ↓ faz o bloco descer dentro do rodapé */
    text-align:center;
    position:relative;
    min-height:50px;                   /* rodapé mais enxuto */
  }
  .sig-line{                           /* linha de 30 % centralizada */
    width:60%;
    border-bottom:1pt solid #000;
    margin:4mm auto 1.2mm;
  }
  .sig-hint{                           /* legenda da linha */
    position:absolute;
    top:-3.5mm; left:5%; transform:translateX(-50%);
    font-size:5.5pt; color:#666; white-space:nowrap;
  }
  .sig-name{ font-weight:700; }
  .sig-crm { margin-top:0.6mm; }



  /* nota legal (reduzida) -------------------------------------------- */
  .footer-note{
    display:block;
    margin-top:1mm;
    text-align:justify;
    font-size:6.0pt;                   /* nota menor */
    line-height:1.25;
  }
}

/*────────── Oculta o rodapé na visualização da tela ─────────*/
#printSecurityFooter{ display:none; }


/*───────────────────────────────────────────────────────────
  Rodapé antifraude – ajustes de compactação final
───────────────────────────────────────────────────────────*/
@media print{

  /* 1 ▸ remove acolchoamento da célula do rodapé e de toda a tabela */
  #printLayout{ border-collapse: collapse; }
  #printLayout tfoot td,
  #pFooter{ padding:0; }


  /* 3 ▸ área de assinatura bem junto à base */
  .sig-area{
    min-height:24px !important; 
    margin-top:auto;               /* garante “colar” no limite inferior */
  }
  .sig-line{
    margin:2.5mm auto 0.4mm !important;/* ↓ aproxima a linha do nome */
  }
  .sig-hint{                       /* ligeiro ajuste da dica */
    top:-2.4mm !important;                 /* sobe 0,2 mm */
    
  }
   /* 3 ▸ QR 55 × 55 px para liberar 5 px extra de faixa inferior */
}

/*───────────────────────────────────────────────────────────
  Compressão final do rodapé – elimina faixa branca inferior
───────────────────────────────────────────────────────────*/
@media print{

  /* 1 ▸ garante que o bloco realmente apareça */
  #printSecurityFooter{
    display:flex !important;      /* anula o display:none anterior   */
  }

  /* 2 ▸ faz o conteúdo do <tfoot> colar no limite inferior da página */
  #printLayout tfoot td{
    vertical-align:bottom !important;  /* encosta o rodapé no fim da folha */
    padding-bottom: 0 !important;       /* sem “respirar”                    */
  }

  /* 3 ▸ área de assinatura ainda menor e sem margens extras */
  .sig-area{
    min-height:24px !important;   /* ↓ de 32 px para 24 px              */
    margin:10mm !important;          /* elimina qualquer espaço eventual   */
  }
  .sig-line{
    margin:1.5mm auto 0.2mm !important; /* linha quase colada no nome   */
  }
  .sig-hint{ top:-2.0mm !important; }   /* ajusta a legenda da linha    */

  /* 4 ▸ QR ligeiramente menor libera mais faixa inferior */
  .qr-area{ flex:0 0 90px !important; height:90px !important; }

  /* 5 ▸ nota legal com respiro mínimo */
  .footer-note{ margin-top:1mm !important; }
}

/*───────────────────────────────────────────────────────────
  Rodapé – QR-Code para cima · Assinatura para baixo
───────────────────────────────────────────────────────────*/
@media print{

  /* QR-Code alinhado ao TOP do rodapé */
  .qr-area{
    align-self:flex-start !important;   /* cola no topo                   */
    margin-top:1mm !important;            /* remove respiro                 */
 
  }

}

@media print{

  /* QR sempre nítido, centrado e quadrado */
  .qr-area{
    flex:0 0 90px !important;      /* largura/altura fixas */
    aspect-ratio:1 / 1;            /* mantém proporção 1:1 */
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center top;
    padding-right:32px;                   /* Quiet Zone mínima   */
    background-color:#fff;         /* fundo branco         */
    box-shadow:0 0 0 1px #000 inset;
    display:block;
    overflow:hidden;
    break-inside:avoid;
  }
  .qr-area img{
    width:100%;
    height:100%;
    image-rendering:pixelated;
    filter:grayscale(100%);
    print-color-adjust:exact;
  }
}

@media print{
  /* força repetição do rodapé em todas as páginas */
  #printLayout tfoot{ display:table-footer-group; }
}




/* ─────────   Impressão  (quando @media print entra) ───────── */
@media print{
  #printSecurityFooter{
    background:#fff !important;  /* garante que nada sobrescreva   */
    -webkit-print-color-adjust:exact; /* Chrome / Safari / Edge     */
            print-color-adjust:exact; /* rascunho da especificação  */
  }
}


/*────────────  APROXIMA FORMULÁRIO DO RODAPÉ  ────────────*/
@media print {

  /* 1 ▸ Deixa o motor quebrar dentro dos blocos              */
  section,
  fieldset,
  .form-group{
    page-break-inside: auto !important;   /* compat Chrome/Edge */
    break-inside:     auto !important;    /* compat Firefox     */
  }

  /* 2 ▸ Zera margens/paddings inferiores que “empurram” tudo  */
  form#formMedico > section,
  fieldset{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* 3 ▸ Remove acolchoamento do corpo da tabela               */
  #printLayout tbody td{
    padding-bottom: 0 !important;
  }     

  #printSecurityFooter{
    margin-bottom: 0mm; 
    margin-top: 0mm;
  
    padding-top: 0mm;
    padding-bottom: 0mm;

    
  }


    /* 4 ▸ (opcional) se ainda houver 1-2 mm de faixa, suba o rodapé    
         — MAS deixe comentado se não precisar                 */
  /* #printSecurityFooter{ margin-bottom: -2mm; } */
}
/*  ─────────  CONTADOR DE PÁGINAS  ─────────  */
@page {
  /* 1 ▸ margens do papel (ajuste como quiser) */
  size: A4 portrait;
  margin: 17mm 12mm 6mm 12mm;   /* top  right/left  bottom */

  /* 2 ▸ margin-box onde o contador vai aparecer                *
   *    (poderia ser @top-center, @top-left, @bottom-right…)     */
  @top-right {
    content: "📄Página " counter(page) " de " counter(pages);
    font: 7pt/1 'Inter', sans-serif;

    /* 3 ▸ deslocamento DENTRO da área de margem -------------- *
     *    use MARGIN – padding não é suportado aqui             */
    margin-right: 15mm;      /* ↤  mantém 0 se não quiser recuo extra  */
    margin-top: 25mm;
  }
}

/* 4 ▸ não precisa de @media print, classes .print-only, nada disso */


/* ─────  MARCA-D’ÁGUA ANTI-RASURA (apenas impressão)  ───── */
@media print {

  /* 1 ▸ Um pseudo-elemento fixo, atrás de tudo                   */
  body::after{
    content:"GOL Linhas Aéreas";
    text-align:center;
    position:fixed;                 /* repete em toda página     */
    bottom:0%; left:50%;
    transform:translate(-10%,-100%) rotate(-35deg);
  
    font:55pt/1 'Inter',sans-serif; /* tamanho grandão/leve      */
    font-weight:800;
    color:#000;
    opacity:0.04;                   /* quase transparente        */
    letter-spacing:2px;

    z-index:-1;                     /* fica atrás do conteúdo    */
    pointer-events:none;            /* não interfere em links    */

    /* garante que o navegador leve o tom p/ o papel              */
    -webkit-print-color-adjust:exact;
            print-color-adjust:exact;
  }




 /* 2 ▸ Caso queira outra em cada canto (opcional)  */
 body[data-sec][data-dt]::before{
  content: " " attr(data-sec) "   " attr(data-dt);
  position:fixed;
  text-align:center;
  top:42%; left:50%;
  transform:translate(-50%,-50%) rotate(-35deg);
  font:80pt/1 'Inter',sans-serif;
  font-weight:900;
  color:#000;
  opacity:.06;
  pointer-events:none;
  -webkit-print-color-adjust:exact;
          print-color-adjust:exact;
}
}

.pulse {
  outline: 3px solid var(--gol-orange, #ff7008);
  transition: outline 0.3s ease-out;
}


/*─────────────────────────────────────────────────────────────
  Dropdown CID-10 – tema GOL
─────────────────────────────────────────────────────────────*/
.cid-suggestions {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: #fff;
  border: var(--border-width) solid #c0c0c0;
  border-radius: var(--border-radius);
  box-shadow: var(--shadow-md);
  max-height: 280px;               /* ativa rolagem */
  overflow-y: auto;
  z-index: 200;
}

.cid-suggestions.hidden { display: none; }

.cid-suggestions button {
  display: block;
  width: 100%;
  padding: 0.55rem 0.9rem;
  background: #fff;
  border: none;
  font: 500 0.88rem/1.4 'Inter', sans-serif;
  color: var(--gol-gray-dark);
  text-align: left;
  cursor: pointer;
  transition: background var(--transition-fast);
}

.cid-suggestions button:hover,
.cid-suggestions button:focus {
  background: var(--gol-gray-light);
}

.cid-suggestions::-webkit-scrollbar {
  width: 10px;
}

.cid-suggestions::-webkit-scrollbar-thumb {
  background: var(--gol-orange-light);
  border-radius: 6px;
}

.cid-suggestions::-webkit-scrollbar-thumb:hover {
  background: var(--gol-orange);
}

/*════════  Gestante ▸ modal exclusivo  ═══════════════════════*/
#gestante-overlay{
  position:fixed; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.6);
  z-index:998;
}
#gestante-overlay.hidden{display:none;}

#gestante-box{
  background:#fff;
  width:90%; max-width:520px;
  padding:2rem 2.25rem;
  border:var(--border-width) solid rgba(0,0,0,.1);
  border-radius:var(--border-radius);
  box-shadow:var(--shadow-lg);
  text-align:center;
}
#gestante-titulo{
  font:700 1.25rem 'Inter',sans-serif;
  color:var(--gol-orange);
  margin-bottom:1rem;
  border-bottom:2px solid var(--gol-orange);
  padding-bottom:.5rem;
}

.modal-btn-wrap{display:flex;gap:1rem;justify-content:center;}
.gestante-btn{
  padding:.75rem 1.6rem;
  font:600 .95rem 'Inter',sans-serif;
  background:var(--gol-orange);
  color:#fff;
  border:var(--border-width) solid var(--gol-orange-dark);
  border-radius:var(--border-radius);
  cursor:pointer;
  box-shadow:var(--shadow-sm);
  transition:background .15s,transform .15s,box-shadow .15s;
}
.gestante-btn:hover{background:var(--gol-orange-dark);transform:translateY(-2px);box-shadow:var(--shadow-md);}
.gestante-btn:active{transform:translateY(0);}

.gestante-disabled{opacity:.5;pointer-events:none;}      /* aba inativa */

/* flash elegante por 6 s */
@keyframes gFlash{0%,100%{background:var(--gol-orange-light);color:#fff;}
  50%{background:var(--gol-orange-dark);color:#fff;}}
.gestante-flash{animation:gFlash 1s ease-in-out 6 forwards;}

      
/* ────────────────────────────────────────────────────────────
   ▼▼▼           NOVOS AJUSTES   (inputs / caixas)         ▼▼▼
   ────────────────────────────────────────────────────────────*/

/* 1 ▸ Inputs em tabelas (Snellen, logMAR, Campo Visual)  */
table input[type="text"],
table input[type="number"],
.snellen-input,
.cv,
.calc{
  width:10.2rem;                 /* largura compacta & uniforme  */
  max-width:100%;
  
  padding:.55rem .45rem;
  font-family:inherit;
}

/* 2 ▸ Campos de resultado só-leitura – cinza claro        */
.calc{
  background:var(--gol-gray-light);
  border:var(--border-width) solid #d1d5db;
  pointer-events:none;
}

/* 3 ▸ Container “valor + grau (°)” usado no Campo Visual   */
.unit{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.unit input{
  flex:0 0 5rem;                /* evita estourar a célula      */
  margin-right:.3rem;
}
.unit span{
  font-weight:600;
  color:var(--gol-gray);
  user-select:none;
}




/*  AJUSTES FINAIS  ─  “visual GOL” CONSISTENTE
    ▸ copie / cole após o SEU styles.css inteiro                   */

/* 1 ▸ Inputs & selects dentro de tabelas ― cantos arredondados
      e mesma espessura de borda do resto do formulário           */
table input[type="text"],
table input[type="number"],
table select,
.snellen-input,
.cv,
.calc{
  border: var(--border-width) solid #c0c0c0;
  border-radius: var(--border-radius);      /* ⇠ aqui! */
  box-shadow: inset 0 2px 4px rgba(0,0,0,.05);
}

/* 2 ▸ Campos só-leitura continuam cinza claro mas com radius     */
.calc{
  background: var(--gol-gray-light);
  border: var(--border-width) solid #d1d5db;
  border-radius: var(--border-radius);
}


/* caso esteja oculto via .hidden, mantém display:none já definido
   (nenhuma regra extra necessária)                                */

   /* ▸ Modal “Aviso MEDIF / FREMEC” – reaproveita o visual GOL */
#modal-overlay-medif.hidden { display: none; }

#modal-overlay-medif {
  position: fixed; inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 999;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}

#modal-box-medif {
  background: #fff;
  width: 90%; max-width: 560px;
  padding: 2rem 2.25rem;
  border-radius: var(--border-radius);
  border: var(--border-width) solid rgba(0, 0, 0, 0.1);
  box-shadow: var(--shadow-lg);
}

#modal-title-medif {
  margin-bottom: 1rem;
  font: 700 1.25rem 'Inter', sans-serif;
  color: var(--gol-orange);
  border-bottom: 2px solid var(--gol-orange);
  padding-bottom: 0.5rem;
}

#modal-content-medif p {
  line-height: 1.6;
  color: var(--gol-gray-dark);
}


.hidden { display:none !important; }

#modal-overlay-condicoes {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.hidden { display: none; }

#modal-box {
  max-width: 780px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 24px;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}

#modal-message {
  margin: 0 0 1rem 0;
  padding-left: 1.2rem;
  max-height: 60vh;        /* rolagem interna adicional */
  overflow-y: auto;
}
#modal-message > li { margin-bottom: 0.65rem; }
#modal-message ul {
  margin-top: 0.35rem;
  padding-left: 1.2rem;
  list-style-type: disc;
}

.modal-nota {
  font-size: 0.9rem;
  line-height: 1.35;
  margin-bottom: 1rem;
}

@media print {
  /* 1) Cabeçalho e rodapé continuam em largura única */
  #printLayout thead {
    display: table-header-group !important;
    width: 100%;
    column-count: 1;
  }
  #printLayout tfoot {
    display: table-footer-group !important;
    width: 100%;
    column-count: 1;
  }

  /* 2) Corpo do documento em duas colunas */
  #printLayout tbody {
    display: block !important;
    column-count: 2;
    column-gap: 0.4rem !important;             /* ajuste o espaçamento entre colunas */
  }

  /* 3) Evita quebras indesejadas dentro de seções, fieldsets e grupos */
  #printLayout tbody section,
  #printLayout tbody fieldset,
  #printLayout tbody .form-group {
    break-inside: avoid-column;
    page-break-inside: avoid;
  }
}


/* 4) Ainda dentro do @media print, sem tocar no bloco acima */

/* 4.1) Reduz ainda mais a margem de fundo do papel */
@page {
  /* top right bottom left */
  margin: 17mm 12mm 4mm 12mm;  /* bottom agora 4mm em vez de 6mm */
}

@media print {
  /* 4.2) Zera toda margem/padding residual no container e no footer antifraude */
  #printLayout,
  #printLayout tbody,
  #printLayout tfoot,
  #printLayout tfoot td,
  #printSecurityFooter {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 4.3) Permite que o corpo (#printLayout) “encolha” até onde há conteúdo */
  #printLayout {
    height: auto !important;
  }
}


@media print {
  #printLayout tbody {
    padding: 0 !important;
    margin: 0 !important;
    -webkit-column-gap: 0 !important;
       -moz-column-gap: 0 !important;
            column-gap: 0 !important;
  }
}



@media print {
  /* Remove apenas a linha (borda) dos fieldset na impressão */
  fieldset, section, .form-group{
    border-color: transparent !important;
  }
}

@media print {
  #printLayout tbody section,
  #printLayout tbody fieldset,
  #printLayout tbody .form-group {
    margin-inline: 0 !important;
    padding-inline: 0 !important;
  }
}


@media print {
  /* Esconde o frame da barra de tradução do Google */
  .goog-te-banner-frame.skiptranslate,
  .goog-te-banner-frame,
  #goog-gt-tt,
  .goog-te-balloon-frame {
    display: none !important;
  }

  /* Remove qualquer deslocamento superior que tenha sido aplicado pelo banner */
  body {
    top: 0 !important;
    margin-top: 0 !important;
  }
}

/* coloque no seu arquivo .css ou dentro de <style> */
.poc-details            { display: none !important; }  /* oculto sempre */
.poc-details.poc-visivel{ display: block !important; } /* visível quando .poc-visivel for adicionada */




/* novo – PULMONAR --------------------------------------------------- */
.pulmo-details              { display: none !important; }
.pulmo-details.pulmo-visivel{ display: block !important; }



.mark-text {
  display: inline;
  background-color: rgba(255, 235, 59, 0.6); /* amarelo suave */
  padding: 0 2px;
  line-height: 1.2;
  will-change: transform;
  /* Opcional: sombreado suave pra dar relevo de tinta */
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
}

/* Justifica o parágrafo */
.observacao {
  text-align: justify;
}

/* Marca-texto com falhas e sem quebra de linha interna */
.mark-text {
  display: inline;                           /* acompanha o fluxo de texto */
  box-decoration-break: clone;               /* replica o background se quebrasse */
  -webkit-box-decoration-break: clone;       /* compatibilidade WebKit */
  padding: 0 2px;                            /* folga lateral */
  background-color: rgba(255, 235, 59, 0.6); /* cor base semitransparente */
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);/* relevo suave de tinta */
  background-image:
    /* falha fina no início */
    linear-gradient(
      to right,
      transparent 0%,
      transparent 8%,
      rgba(255, 235, 59, 0.6) 8%,
      rgba(255, 235, 59, 0.6) 100%
    ),
    /* falha média no meio */
    linear-gradient(
      to right,
      transparent 0%,
      transparent 45%,
      rgba(255, 235, 59, 0.6) 45%,
      rgba(255, 235, 59, 0.6) 100%
    ),
    /* falha fina mais à frente */
    linear-gradient(
      to right,
      transparent 0%,
      transparent 70%,
      rgba(255, 235, 59, 0.6) 70%,
      rgba(255, 235, 59, 0.6) 100%
    );
  background-blend-mode: normal;
}


/* curativo abre */

/* depois do reset / das variáveis */
html, body { max-width: 100%; overflow-x: clip; }

/* reforço nos cabeçalhos e no contêiner principal */
header, .tabs-header, main, footer { width: 100%; margin-inline: auto; }

/* segura qualquer lista de abas em telas menores */
.tabs-nav { max-width: 100%; overflow-x: auto; box-sizing: border-box; }

/* curativo fecha */

/* ═════ TOOLTIP (versão final) ═════ */
.js-tooltip{
  position:absolute;
  background:var(--gol-gray-dark);
  color:#fff;
  font:600 0.75rem/1.35 'Inter',sans-serif;
  font-size: 1.2rem;
  padding:.45rem .7rem;
  border-radius:.375rem;
  box-shadow:0 2px 6px rgba(0,0,0,.25);

  opacity:0; transform:scale(.85);
  transition:opacity .15s ease, transform .15s ease;
  z-index:3000; pointer-events:none;

  max-width:260px;                 /* desktop */
  white-space:normal;
  word-break:break-word;
}
@media(max-width:600px){
  .js-tooltip{ max-width:70vw; }   /* telas menores */
}
.js-tooltip.visible{ opacity:1; transform:scale(1); }

/* seta (bolha ACIMA do botão) */
.js-tooltip::after{
  content:'';
  position:absolute;
  bottom:-5px; left:50%;
  transform:translateX(-50%) rotate(45deg);
  width:10px; height:10px;
  background:var(--gol-gray-dark);
}

/* seta (bolha ABAIXO do botão) */
.js-tooltip.below::after{
  top:-5px; bottom:auto;           /* troca âncora */
}


.help-tooltip{
  position:fixed;
  background:var(--gol-gray-dark);
  color:#fff;
  font:500 1rem/1.45 'Inter',sans-serif;
  text-align:justify;
  padding:.7rem 1rem;
  border-radius:.4rem;
  box-shadow:0 3px 8px rgba(0,0,0,.25);

  /* NOVO – quebra QUALQUER palavra longa */
  overflow-wrap:anywhere;          /* ou word-break:break-word */

  max-width:360px;                 /* desktop “pré-limite”     */
  opacity:0;visibility:hidden;
  transition:opacity .15s ease;
  z-index:9999;pointer-events:none;
}
@media(max-width:600px){
  .help-tooltip{ max-width:95vw; }   /* telinhas */
}

/* ════════════════════════════════════════════════════════
   SCROLLBAR  •  Tema GOL  (15 / 11 px – round extra)
════════════════════════════════════════════════════════ */

*{
  scrollbar-width: thin;
  scrollbar-color: var(--gol-orange) var(--gol-gray-light);
}

/* Desktop / tablets */
::-webkit-scrollbar{
  width:15px;    /* +1 px em relação à versão anterior */
  height:15px;
}

/* Telas ≤ 768 px */
@media(max-width:768px){
  ::-webkit-scrollbar{
    width:11px;  /* +1 px sobre o mobile anterior */
    height:11px;
  }
}

/* Trilha */
::-webkit-scrollbar-track{
  background:var(--gol-gray-light);
  border-radius:9999px;          /* round completo */
}

/* Polegar */
::-webkit-scrollbar-thumb{
  background:linear-gradient(145deg,
              var(--gol-orange-light) 0%,
              var(--gol-orange)       100%);
  border:3px solid var(--gol-gray-light);   /* “gutter” fino         */
  border-radius:9999px;                     /* ainda mais arredondado */
  box-shadow:inset 0 0 2px rgba(0,0,0,.25);
  transition:background .2s;
}

::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(145deg,
              var(--gol-orange) 0%,
              var(--gol-orange-dark) 100%);
}
::-webkit-scrollbar-thumb:active{
  background:var(--gol-orange-dark);
}