/* Campos rotulados e simulações: nunca há envio de dados. */
.formulario{
  display:flex;
  flex-direction:column;
  gap:21px
}
.campo{
  display:flex;
  flex-direction:column;
  gap:8px
}
.campo label,.campo-legenda{
  font-size:.79rem;
  font-weight:600
}
.campo label small{
  font-weight:400;
  color:var(--muted)
}
.campo input,.campo select,.campo textarea{
  width:100%;
  min-height:50px;
  border:1px solid var(--borda);
  border-radius:12px;
  padding:12px 15px;
  background:white;
  color:var(--texto);
  font-size:.87rem;
  line-height:1.5
}
.campo textarea{
  resize:vertical;
  min-height:110px
}
.campo input::placeholder,.campo textarea::placeholder{
  color:#748271
}
.campo input[readonly],.campo textarea[readonly]{
  background:#f6f8f2;
  color:#536a58;
  cursor:default
}
.campo input:focus,.campo textarea:focus,.campo select:focus{
  border-color:var(--verde)
}
.campo .ajuda-campo{
  font-size:.69rem;
  color:var(--muted);
  margin:0
}
.campos-linha{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:19px
}
.formulario fieldset{
  border:0;
  padding:0;
  margin:0;
  min-width:0
}
.formulario legend{
  font-size:.8rem;
  font-weight:600;
  margin-bottom:12px
}
.opcoes-valor{
  display:flex;
  gap:10px;
  flex-wrap:wrap
}
.opcao-valor{
  border:1px solid var(--borda);
  border-radius:13px;
  padding:13px 18px;
  min-height:50px;
  font-size:.92rem;
  flex:1;
  text-align:center;
  background:white
}
.opcao-valor[aria-pressed=true]{
  background:var(--verde);
  border-color:var(--verde);
  color:white
}
.opcao-valor:hover{
  border-color:var(--verde)
}
.campo-valor{
  position:relative
}
.campo-valor>span{
  position:absolute;
  left:15px;
  top:14px;
  font-size:.85rem;
  color:var(--muted)
}
.campo-valor input{
  padding-left:44px
}
.checkbox-linha{
  display:flex;
  align-items:flex-start;
  gap:11px;
  font-size:.73rem;
  color:var(--muted);
  line-height:1.6
}
.checkbox-linha input{
  width:17px;
  height:17px;
  margin:3px 0 0;
  accent-color:var(--verde);
  flex:none
}
.aviso-formulario{
  font-size:.71rem;
  color:var(--muted);
  display:flex;
  align-items:flex-start;
  gap:9px;
  background:#f1f4eb;
  border-radius:11px;
  padding:13px 15px
}
.aviso-formulario .icone{
  width:17px;
  height:17px;
  flex:none;
  margin-top:2px
}
.aviso-formulario a{
  text-decoration:underline;
  text-underline-offset:3px
}
.formulario .nota{
  margin-top:0
}
.erro-campo{
  font-size:.73rem;
  color:#9d402b;
  margin:0
}
.formulario-acoes{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap
}
.preencher-exemplo{
  font-size:.71rem;
  text-decoration:underline;
  text-underline-offset:4px;
  min-height:36px
}
.botao-social{
  border:1px solid var(--borda);
  width:100%;
  background:white;
  margin-bottom:12px
}
.botao-social>span:first-child{
  font-size:1.1rem
}
.separador{
  display:flex;
  align-items:center;
  gap:15px;
  color:var(--muted);
  font-size:.7rem;
  margin:20px 0
}
.separador:before,.separador:after{
  content:"";
  height:1px;
  background:var(--borda);
  flex:1
}
.input-codigo{
  letter-spacing:.7em;
  text-align:center;
  font-size:1.4rem!important;
  font-weight:600
}
.aviso-flutuante{
  position:fixed;
  bottom:25px;
  left:50%;
  transform:translate(-50%,20px);
  max-width:min(560px,calc(100% - 32px));
  background:var(--verde);
  color:white;
  padding:15px 24px;
  border-radius:16px;
  font-size:.79rem;
  box-shadow:0 8px 30px #173f3520;
  z-index:30;
  opacity:0;
  visibility:hidden;
  transition:opacity .2s,transform .2s;
  pointer-events:none
}
.aviso-flutuante.visivel{
  opacity:1;
  transform:translate(-50%,0);
  visibility:visible
}
dialog{
  border:1px solid var(--borda);
  border-radius:25px;
  max-width:560px;
  width:calc(100% - 32px);
  padding:40px;
  color:var(--texto);
  background:var(--papel);
  box-shadow:0 20px 90px #00140f30;
  max-height:calc(100dvh - 40px);
  overflow-y:auto
}
dialog::backdrop{
  background:#08231c80;
  backdrop-filter:blur(5px)
}
dialog h2{
  font-size:1.95rem;
  padding-right:30px
}
dialog p{
  font-size:.85rem;
  margin-top:18px
}
dialog .acoes{
  margin-top:25px
}
dialog .cartao{
  margin-top:22px;
  padding:23px
}
dialog .botao{
  font-size:.78rem
}
.fechar-dialogo{
  position:absolute;
  right:16px;
  top:16px;
  width:34px;
  height:34px
}
.controle-alternar{
  width:44px;
  height:25px;
  accent-color:var(--verde)
}
