/* Portal do Hálito — ICH visual refresh v1.0
   Escopo: moderniza somente o corpo do teste.
   Header, footer, lógica do formulário e bloco de autoria permanecem intactos.
*/

:root {
  --ich-bg: #f4f8fb;
  --ich-surface: #ffffff;
  --ich-surface-soft: #f8fbfd;
  --ich-border: #dbe7ef;
  --ich-border-strong: #c7d8e4;
  --ich-navy: #003060;
  --ich-blue: #1A6B8A;
  --ich-turquoise: #00A0B0;
  --ich-turquoise-bright: #2DCCD3;
  --ich-text: #16324a;
  --ich-muted: #5b7083;
  --ich-shadow: 0 10px 28px rgba(0, 48, 96, .07);
}

/* Fundo geral da página */
body {
  background: var(--ich-bg);
}

/* Área principal antiga do teste */
body > .container,
body > .container-fluid {
  background: transparent;
}

/* Breadcrumb */
.breadcrumb {
  background: transparent;
  padding-left: 0;
  padding-right: 0;
  margin-top: 1rem;
  margin-bottom: .75rem;
  color: var(--ich-muted);
}

/* Título */
.page-header,
h1:first-of-type {
  border-bottom: 0;
}

.page-header h1,
.page-header h2,
h1 {
  color: var(--ich-navy);
  font-weight: 700;
  letter-spacing: -.02em;
}

/* Bloco principal do formulário */
form[action*="teste-consequencias"],
form:has(.calcular-teste-psico) {
  background: var(--ich-surface);
  border: 1px solid var(--ich-border);
  border-radius: 18px;
  box-shadow: var(--ich-shadow);
  padding: 1.5rem 1.5rem .75rem;
  margin-top: 1.25rem;
  margin-bottom: 2rem;
}

/* Títulos e textos dentro do teste */
form[action*="teste-consequencias"] h2,
form[action*="teste-consequencias"] h3,
form:has(.calcular-teste-psico) h2,
form:has(.calcular-teste-psico) h3 {
  color: var(--ich-navy);
  font-weight: 700;
}

form[action*="teste-consequencias"] p,
form:has(.calcular-teste-psico) p {
  color: var(--ich-text);
  line-height: 1.65;
}

/* Cada linha/pergunta */
form[action*="teste-consequencias"] .row,
form:has(.calcular-teste-psico) .row {
  margin-left: 0;
  margin-right: 0;
}

/* Perguntas: transforma linhas em cartões discretos */
form[action*="teste-consequencias"] .row:not(:last-child),
form:has(.calcular-teste-psico) .row:not(:last-child) {
  border-bottom: 0;
}

form[action*="teste-consequencias"] .form-group,
form:has(.calcular-teste-psico) .form-group {
  margin-bottom: 0;
}

form[action*="teste-consequencias"] hr,
form:has(.calcular-teste-psico) hr {
  border: 0;
  margin: .4rem 0;
}

/* Captura os blocos de pergunta, comuns no layout legado */
form[action*="teste-consequencias"] .col-md-12,
form:has(.calcular-teste-psico) .col-md-12 {
  background: var(--ich-surface-soft);
  border: 1px solid var(--ich-border);
  border-radius: 12px;
  padding: 1rem 1rem;
  margin-bottom: .65rem;
}

/* Evita "card dentro de card" em áreas de cadastro/finalização */
form[action*="teste-consequencias"] .col-md-12 .col-md-12,
form:has(.calcular-teste-psico) .col-md-12 .col-md-12 {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin-bottom: 0;
}

/* Botões Sim / Não */
form[action*="teste-consequencias"] .btn,
form:has(.calcular-teste-psico) .btn {
  min-height: 40px;
  border-radius: 9px;
  border-color: var(--ich-border-strong);
  font-weight: 600;
  transition: .18s ease;
}

form[action*="teste-consequencias"] .btn-default,
form:has(.calcular-teste-psico) .btn-default {
  background: #fff;
  color: var(--ich-navy);
}

form[action*="teste-consequencias"] .btn-default:hover,
form[action*="teste-consequencias"] .btn-default:focus,
form:has(.calcular-teste-psico) .btn-default:hover,
form:has(.calcular-teste-psico) .btn-default:focus {
  background: #eef8fa;
  border-color: var(--ich-turquoise);
  color: var(--ich-navy);
}

/* Estado selecionado dos radios/botões Bootstrap */
form[action*="teste-consequencias"] .btn-default.active,
form[action*="teste-consequencias"] .btn-default:active,
form:has(.calcular-teste-psico) .btn-default.active,
form:has(.calcular-teste-psico) .btn-default:active {
  background: var(--ich-navy);
  border-color: var(--ich-navy);
  color: #fff;
  box-shadow: none;
}

/* Campos de identificação */
form[action*="teste-consequencias"] input.form-control,
form[action*="teste-consequencias"] select.form-control,
form[action*="teste-consequencias"] textarea.form-control,
form:has(.calcular-teste-psico) input.form-control,
form:has(.calcular-teste-psico) select.form-control,
form:has(.calcular-teste-psico) textarea.form-control {
  min-height: 44px;
  border: 1px solid var(--ich-border-strong);
  border-radius: 9px;
  box-shadow: none;
  background: #fff;
}

form[action*="teste-consequencias"] input.form-control:focus,
form[action*="teste-consequencias"] select.form-control:focus,
form[action*="teste-consequencias"] textarea.form-control:focus,
form:has(.calcular-teste-psico) input.form-control:focus,
form:has(.calcular-teste-psico) select.form-control:focus,
form:has(.calcular-teste-psico) textarea.form-control:focus {
  border-color: var(--ich-turquoise);
  box-shadow: 0 0 0 3px rgba(0,160,176,.12);
}

/* Botão principal de envio/cálculo */
.calcular-teste-psico,
form[action*="teste-consequencias"] .btn-success,
form:has(.calcular-teste-psico) .btn-success {
  background: var(--ich-turquoise);
  border-color: var(--ich-turquoise);
  color: #fff;
  border-radius: 999px;
  padding: .7rem 1.25rem;
  font-weight: 700;
}

.calcular-teste-psico:hover,
.calcular-teste-psico:focus,
form[action*="teste-consequencias"] .btn-success:hover,
form:has(.calcular-teste-psico) .btn-success:hover {
  background: var(--ich-navy);
  border-color: var(--ich-navy);
  color: #fff;
}

/* Botão refazer */
form[action*="teste-consequencias"] .btn-warning,
form:has(.calcular-teste-psico) .btn-warning {
  background: #fff;
  color: var(--ich-navy);
  border: 1px solid var(--ich-border-strong);
  border-radius: 999px;
  padding: .7rem 1.1rem;
}

/* Mensagem de sucesso */
.mensagens-sucesso {
  border: 1px solid rgba(0,160,176,.35);
  border-radius: 12px;
  background: #eefafb;
  color: var(--ich-navy);
  padding: 1rem 1.1rem;
  margin: 1rem 0;
}

/* Referências: menos "soltas" no fundo branco */
.references,
.referencias,
.bibliografia {
  background: var(--ich-surface);
  border: 1px solid var(--ich-border);
  border-radius: 14px;
  padding: 1rem 1.25rem;
  margin: 1.5rem 0 2rem;
}

/* Dá respiro entre conteúdo legado e novo bloco de autoria */
.ph-author-profile-shell {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

/* Desktop */
@media (min-width: 992px) {
  form[action*="teste-consequencias"],
  form:has(.calcular-teste-psico) {
    padding: 2rem 2rem 1rem;
  }

  form[action*="teste-consequencias"] .btn-group,
  form:has(.calcular-teste-psico) .btn-group {
    display: inline-flex;
    gap: .35rem;
  }
}

/* Mobile */
@media (max-width: 767px) {
  body > .container,
  body > .container-fluid {
    padding-left: 14px;
    padding-right: 14px;
  }

  form[action*="teste-consequencias"],
  form:has(.calcular-teste-psico) {
    padding: 1rem .85rem .5rem;
    border-radius: 14px;
  }

  form[action*="teste-consequencias"] .col-md-12,
  form:has(.calcular-teste-psico) .col-md-12 {
    padding: .9rem .8rem;
  }

  form[action*="teste-consequencias"] .btn-group,
  form:has(.calcular-teste-psico) .btn-group {
    margin-top: .7rem;
  }

  form[action*="teste-consequencias"] .btn,
  form:has(.calcular-teste-psico) .btn {
    min-width: 62px;
    min-height: 42px;
  }

  .calcular-teste-psico {
    width: 100%;
  }
}

/* ICH — ajustes visuais finais */

/* Título e textos introdutórios da página */
.interno-header {
    text-align: center;
}

.interno-header h3,
.interno-header p {
    text-align: center;
}

/* Título e subtítulo internos do teste */
.test-psico > .row:first-child > .col-md-12 {
    text-align: center;
}

.test-psico > .row:first-child h3,
.test-psico > .row:first-child h4 {
    text-align: center;
}

/* Não desenhar os containers das mensagens enquanto estiverem ocultas */
.test-psico .row.scrollto:has(.mensagens-erro.hide),
.test-psico .row:has(> .col-md-12 > .mensagens-sucesso.hide) {
    display: none;
}

/* ICH — redução dos espaços verticais entre blocos */
.ph-author-profile-shell {
    margin-top: 0.75rem !important;
    margin-bottom: 0.75rem !important;
}

.test-psico {
    margin-bottom: 0.75rem !important;
}

.ph-author-profile {
    padding-bottom: 0 !important;
}

.ph-author-profile__notice {
    margin-bottom: 0.75rem !important;
}

.ph-global-footer {
    margin-top: 0 !important;
}

.ph-global-footer__search-band {
    margin-top: 0 !important;
}

/* ICH — correção da âncora de rolagem após envio
   Mantém os espaços vazios invisíveis sem remover .scrollto do documento. */

.test-psico .row.scrollto:has(.mensagens-erro.hide),
.test-psico .row:has(> .col-md-12 > .mensagens-sucesso.hide) {
    display: block !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.test-psico .row.scrollto:has(.mensagens-erro.hide) > .col-md-12,
.test-psico .row:has(> .col-md-12 > .mensagens-sucesso.hide) > .col-md-12 {
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

/* ICH — ajuste fino da rolagem e destaque do resultado */

/* Compensa o cabeçalho fixo quando o JS rola até .scrollto */
.test-psico .scrollto {
    scroll-margin-top: 150px !important;
}

/* Destaque maior para a mensagem de resultado */
.mensagens-sucesso {
    background: #dff7f8 !important;
    border: 2px solid #00A0B0 !important;
    color: #003060 !important;
    border-radius: 14px !important;
    padding: 1.25rem 1.35rem !important;
    font-size: 1.08em !important;
    line-height: 1.55 !important;
    box-shadow: 0 8px 22px rgba(0, 48, 96, .10) !important;
}

/* Dá um pouco mais de presença ao número da pontuação */
.mensagens-sucesso strong {
    color: #003060 !important;
    font-size: 1.15em !important;
}

/* ICH — posicionamento preciso da mensagem após envio */
.test-psico .scrollto {
    position: relative !important;
    top: -230px !important;
    margin-bottom: -230px !important;
}

/* ICH — rolagem agora controlada pela mensagem efetivamente visível */
.test-psico .scrollto {
    position: static !important;
    top: auto !important;
    margin-bottom: 0 !important;
    scroll-margin-top: 0 !important;
}

/* Avisos de preenchimento mais evidentes */
.mensagens-erro,
.mensagens-erro-top {
    background: #fff2f0 !important;
    border: 2px solid #b42318 !important;
    color: #7a271a !important;
    border-radius: 14px !important;
    padding: 1.15rem 1.3rem !important;
    font-weight: 600 !important;
    box-shadow: 0 8px 22px rgba(122, 39, 26, .10) !important;
}

/* ICH — centralização dos botões Sim/Não somente no mobile */
@media (max-width: 767px) {

    .test-psico .col-md-2.col-xs-12.text-right {
        text-align: center !important;
    }

    .test-psico .btn-group.btn-toggle {
        display: inline-flex !important;
        justify-content: center !important;
        margin-top: 0.8rem !important;
        margin-bottom: 0.35rem !important;
    }
}

/* ICH — acabamento dos botões Refazer / Enviar */

/* Remove os ícones antigos quebrados do Bootstrap */
.reset-teste-psico .glyphicon,
.calcular-teste-psico .glyphicon {
    display: none !important;
}

/* Refazer Teste */
.reset-teste-psico {
    background: #ffffff !important;
    color: #003060 !important;
    border: 1px solid #b9cedd !important;
    border-radius: 12px !important;
    padding: 0.8rem 1.25rem !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.reset-teste-psico:hover,
.reset-teste-psico:focus {
    background: #f3f8fb !important;
    border-color: #1A6B8A !important;
}

/* Enviar */
.calcular-teste-psico {
    background: #00A0B0 !important;
    color: #ffffff !important;
    border: 1px solid #00A0B0 !important;
    border-radius: 12px !important;
    padding: 0.8rem 1.5rem !important;
    font-weight: 700 !important;
    box-shadow: 0 6px 16px rgba(0,48,96,.10) !important;
}

.calcular-teste-psico:hover,
.calcular-teste-psico:focus {
    background: #003060 !important;
    border-color: #003060 !important;
}

/* Mobile */
@media (max-width: 767px) {

    .test-psico .row[style*="margin-top: 30px"] {
        display: flex !important;
        gap: 0.75rem !important;
        align-items: stretch !important;
    }

    .test-psico .row[style*="margin-top: 30px"] > .col-xs-6 {
        width: 50% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .reset-teste-psico,
    .calcular-teste-psico {
        width: 100% !important;
        min-height: 52px !important;
        font-size: 1rem !important;
        white-space: nowrap !important;
    }
}