:root 
{
	--fonte: "Plus Jakarta Sans", sans-serif;

	--cor-sucesso: #499d71;
	--cor-alerta: #e0a800;
	--cor-erro: #eb2c2c;

	--sombra-nivel-1: 1px 1px 2px rgba(0, 0, 0, 0.10);
	--sombra-nivel-2: 2px 2px 4px rgba(0, 0, 0, 0.12);
	--sombra-nivel-3: 4px 4px 8px rgba(0, 0, 0, 0.14);
	--sombra-nivel-4: 6px 6px 12px rgba(0, 0, 0, 0.16);
	--sombra-nivel-5: 8px 8px 16px rgba(0, 0, 0, 0.18);
	--sombra-nivel-6: 12px 12px 24px rgba(0, 0, 0, 0.20);
}

*, *::before, *::after { box-sizing: border-box;  outline: none; -webkit-tap-highlight-color: transparent; }
@media (prefers-reduced-motion: no-preference) { 
    :root { scroll-behavior: smooth; }
}

html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; position: relative; height: 100%; }
body { margin: 0; padding: 0; -webkit-font-smoothing: antialiased; -webkit-print-color-adjust: exact; font-optical-sizing: auto; position: relative; height: 100%;
	   font-family: var(--fonte); font-size: 16px; background:#f3f4f6; color:#2c2c2c; }
a { text-decoration: none; transition: background ease 0.2s; color:#2c2c2c; }
button { cursor: pointer; font-family: var(--fonte); }
table { border-collapse: collapse; border-spacing: 0; }
img { max-width: 100%; display: block; margin: 0; padding: 0; }
input, textarea, select { font-family: var(--fonte); font-size:16px; background:#FFF; border-radius:4px; width:100%; }
h1 , h2, h3, h4, h5, h6, p, ul, ol, li { margin: 0; padding: 0; }
hr { height: 1px; background-color: #e5e7eb; border: none; }

/* cores */
.cor-primaria { color: var(--cor-primaria, 999); }
.bg-cor-primaria { background-color: var(--cor-primaria, 999); }

/* botoes */
.btn { margin-bottom: 0; text-align: center; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; white-space: nowrap; 
       user-select: none; text-transform: uppercase; overflow: hidden; font-size: .8rem; border-radius: 4px; border: none; padding-left: 20px; 
       padding-right: 20px; width: fit-content; gap: 5px; display: flex; justify-content: center; align-items: center; height: 50px; transition: all ease 0.2s;  opacity:1; }
.btn img { flex-shrink:0; flex-grow:0; }
.btn svg { flex-shrink:0; flex-grow:0; }
.btn:disabled { cursor:pointer; }

.btn-primario { color: #fff; background: var(--cor-primaria, var(--cor-sucesso)); box-shadow:0 2px 2px 0 rgba(0,0,0,.2), inset 0 -2px 0 0 rgba(0,0,0,.2); font-weight: 600; }
.btn-primario:hover { background-color:color-mix(in srgb, var(--cor-primaria, var(--cor-sucesso)), white 20%); }

.btn-sucesso { color: #fff; background: var(--cor-sucesso); box-shadow:0 2px 2px 0 rgba(0,0,0,.2), inset 0 -2px 0 0 rgba(0,0,0,.2); font-weight: 600; }
.btn-sucesso:hover { background-color:color-mix(in srgb, var(--cor-sucesso), white 20%); }

.btn-secundario { color: #fff; background-color: #8b8b8b; box-shadow: 0 2px 2px 0 rgba(0,0,0,.2), inset 0 -2px 0 0 rgba(0,0,0,.2); font-weight: 400; }
.btn-secundario:hover { background-color:color-mix(in srgb, #8b8b8b, white 20%); }

.btn-secundario-linha { background-color: transparent; color: #2c2c2c; border: 2px solid #8b8b8b; font-weight: 400; box-shadow: none; }
.btn-secundario-linha:hover, .btn-secundario-linha:focus { background-color: #f0f0f0; color: #747474; border-color: #747474; }

.btn-primario-linha { background-color: transparent; color: var(--cor-primaria, var(--cor-sucesso)); border: 2px solid var(--cor-primaria, var(--cor-sucesso)); font-weight: 600; box-shadow: none; transition: all 0.15s ease-in-out; /* suaviza interação */ }
.btn-primario-linha:hover,
.btn-primario-linha:focus { background-color: color-mix(in srgb, var(--cor-primaria), white 85%); color: var(--cor-primaria); border-color: var(--cor-primaria); }
.btn-primario-linha:active { background-color: color-mix(in srgb, var(--cor-primaria), white 75%); border-color: var(--cor-primaria); }

.btns-espacados { display:flex; align-items:center; justify-content:space-between; gap:15px; }
.btns-direita { display:flex; align-items:center; justify-content:flex-end; gap:15px; }
.btns-esquerda { display:flex; align-items:center; justify-content:flex-start; gap:15px; }
@media (max-width: 390px) { .btns-espacados { flex-direction:column-reverse; }}

.lkn { margin-bottom: 0; text-align: center; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; white-space: nowrap; color:#333;
       user-select: none; overflow: hidden; font-size: .9rem; border-radius: 4px; border: none; width: fit-content; display: flex; 
	   justify-content: center; align-items: center; height: 40px; transition: all ease 0.2s;  opacity:1; background:transparent; }
.lkn:hover { text-decoration:underline; }

/* loading */
.ing-spinner { width: 14px; height: 14px; border: 2px solid rgba(255,255,255,0.4); border-top-color: #fff; border-radius: 50%;
               display: inline-block; animation: spin 0.7s linear infinite; margin-right: 6px; }
@keyframes spin { to { transform: rotate(360deg); }}

/* cartão e sombras */
.cartao { background: #FFF; border-radius: 10px; padding:30px; border:1px solid #e5e7eb; }
.cartao h1 { font-size:1.5rem; display:flex; align-items:center; gap:10px; }
.cartao h2 { font-size:1.3rem; display:flex; align-items:center; gap:10px; }
.cartao h3 { font-size:1.2rem; display:flex; align-items:center; gap:10px; }
.cartao hr.divisor { width:calc(100% + 60px); margin-left:-30px; margin-top:30px; margin-bottom:30px; }
.cartao hr.divisor.lateral { width:calc(100% + 40px); margin-left:-20px; margin-bottom:20px; margin-top:20px; }
.cartao .acoes { width:calc(100% + 60px); margin-left:-30px; background:#f9fafb; border-top:1px solid #e5e7eb; 
				 display:flex; align-items:center; justify-content:space-between; padding:20px 30px; border-radius:0 0 10px 10px; margin-bottom:-30px; margin-top:30px; }
.cartao span { display: flex; align-items: center; gap: 5px; }

@media (max-width: 460px) { 
	.cartao .acoes { flex-direction:column-reverse; }
}
@media (max-width: 768px) 
{
	.cartao { padding:20px; overflow:hidden; }
	.cartao hr.divisor { width:calc(100% + 40px); margin-left:-20px;  margin-top:20px; margin-bottom:20px; }
    .cartao .acoes { width: calc(100% + 40px); margin-left: -20px; padding:15px 20px 30px 20px; }
	.cartao .acoes .btn-primario { margin-bottom:20px; }
}
.sombra-nivel-1 { box-shadow: var(--sombra-nivel-1); }
.sombra-nivel-2 { box-shadow: var(--sombra-nivel-2); }
.sombra-nivel-3 { box-shadow: var(--sombra-nivel-3); }
.sombra-nivel-4 { box-shadow: var(--sombra-nivel-4); }
.sombra-nivel-5 { box-shadow: var(--sombra-nivel-5); }
.sombra-nivel-6 { box-shadow: var(--sombra-nivel-6); }

/* overlays */
.overlay-sem-cor { width:100%; height:100%; position:fixed; top:0; left:0; z-index:1; }
.overlay-preto {  width:100%; height:100%; position:fixed; top:0; left:0; z-index:1; background:#000000bf; } 

/* altura e largura */
.hgt40 { height:40px !important; }

/* margens internas e externas */
.pd05 { padding: 5px; }
.pd10 { padding: 10px; }
.pd15 { padding: 15px; }
.pd20 { padding: 20px; }
.pd25 { padding: 25px; }
.pd30 { padding: 30px; }
.pd5 { padding-top: 5px; }
.pdT10 { padding-top: 10px; }
.pdT15 { padding-top: 15px; }
.pdT20 { padding-top: 20px; }
.pdT25 { padding-top: 25px; }
.pdT30 { padding-top: 30px; }
.pdB10 { padding-bottom: 10px; }
.pdB15 { padding-bottom: 15px; }
.pdB20 { padding-bottom: 20px; }
.pdB25 { padding-bottom: 25px; }
.pdB30 { padding-bottom: 30px; }
.pdL10 { padding-left: 10px; }
.pdL15 { padding-left: 15px; }
.pdL20 { padding-left: 20px; }
.pdL30 { padding-left: 30px; }
.pdR10 { padding-right: 10px; }
.pdR15 { padding-right: 15px; }
.pdR20 { padding-right: 20px; }
.pdR30 { padding-right: 30px; }

.mg0 { margin: 0px !important; }
.mg05 { margin: 5px; }
.mg10 { margin: 10px; }
.mg15 { margin: 15px; }
.mg20 { margin: 20px; }
.mg25 { margin: 25px; }
.mg30 { margin: 30px; }
.mgT5 { margin-top: 5px; }
.mgT10 { margin-top: 10px; }
.mgT15 { margin-top: 15px; }
.mgT20 { margin-top: 20px; }
.mgT25 { margin-top: 25px; }
.mgT30 { margin-top: 30px; }
.mgB0 { margin-bottom:0 !important; }
.mgB5 { margin-bottom: 5px; }
.mgB10 { margin-bottom: 10px; }
.mgB15 { margin-bottom: 15px; }
.mgB20 { margin-bottom: 20px; }
.mgB25 { margin-bottom: 25px; }
.mgB30 { margin-bottom: 30px; }
.mgLAuto { margin-left: auto; }
.mgRAuto { margin-right: auto; }
.mgB-dinamico { margin-bottom: clamp(10px, 2vw, 16px); }
.mgL10 { margin-left: 10px; }
.mgL15 { margin-left: 15px; }
.mgL20 { margin-left: 20px; }
.mgL25 { margin-left: 25px; }
.mgL30 { margin-left: 30px; }
.mgR10 { margin-right: 10px; }
.mgR15 { margin-right: 15px; }
.mgR20 { margin-right: 20px; }
.mgR25 { margin-right: 25px; }
.mgR30 { margin-right: 30px; }

/* posicao texto */
.texto-centralizado { text-align: center; }
.texto-direita { text-align: right; }
.texto-esquerda { text-align: left; }
.texto-riscado { text-decoration:line-through; }
.texto-sublinhado { text-decoration:underline; }

/* alinhamento texto */
.alinhar-centro { align-items:center; }
.alinhar-esquerda { align-items:flex-start; }
.alinhar-direita { align-items:flex-end; }

/* disposições */
.flx { display: flex; }
.block { display: block; }
.clmn { flex-direction:column; }
.none { display: none; }
.gap3 { gap: 3px; }
.gap5 { gap: 5px; } 
.gap10 { gap: 10px; }
.gap15 { gap: 15px; }
.gap20 { gap: 20px; }
.gap25 { gap: 25px; }
.gap30 { gap: 30px; }
.cresce { flex-grow: 1; }
.para-direita { justify-content: flex-end; }
.para-esquerda { justify-content: flex-start; }
.espacado { justify-content: space-between; } 
.centro-vertical { align-items: center; }
.centro-horizontal { justify-content:center; }
.largura-total { width:100%; }
.altura-total { height:100%; }

/* central */
.central { max-width: 80vw; width: 100%; margin: 0 auto; }
@media (min-width: 1921px) { .central { max-width: 60vw; }}
@media (max-width: 1490px) { .central { max-width: 90vw; }}
@media (max-width: 1110px) { .central { max-width: 95vw; }}

/* formulario */
.form-grid { display: grid; gap: clamp(20px, 2vw, 20px); }
.form-grid .cmp { margin: 0 !important; }
.form-grid .campo { display: flex; flex-direction: column; }
.form-grid .campo label { margin-bottom: 4px; min-height:18px; display:block; }
.form-grid .campo input, .form-grid .campo select { padding: 10px; height: 40px !important; border:1px solid #cbcbcb; border-radius: 4px; }

/* ≥ 768px vira 12 colunas */
@media (min-width: 768px) 
{
	/* grid responsivo 12 colunas */
  .form-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }

  /* utilitários de span */
  .col-1 { grid-column: span 1; }
  .col-2 { grid-column: span 2; }
  .col-3 { grid-column: span 3; }
  .col-4 { grid-column: span 4; }
  .col-5 { grid-column: span 5; }
  .col-6 { grid-column: span 6; }
  .col-7 { grid-column: span 7; }
  .col-8 { grid-column: span 8; }
  .col-9 { grid-column: span 9; }
  .col-10 { grid-column: span 10; }
  .col-11 { grid-column: span 11; }
  .col-12 { grid-column: span 12; }
}

/* sobrescreve o breakpoint para variante --lg  */
@media (min-width: 1000px) {
    .form-grid.form-grid--lg { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .form-grid.form-grid--lg .col-1  { grid-column: span 1; }
    .form-grid.form-grid--lg .col-2  { grid-column: span 2; }
    .form-grid.form-grid--lg .col-3  { grid-column: span 3; }
    .form-grid.form-grid--lg .col-4  { grid-column: span 4; }
    .form-grid.form-grid--lg .col-5  { grid-column: span 5; }
    .form-grid.form-grid--lg .col-6  { grid-column: span 6; }
    .form-grid.form-grid--lg .col-7  { grid-column: span 7; }
    .form-grid.form-grid--lg .col-8  { grid-column: span 8; }
    .form-grid.form-grid--lg .col-9  { grid-column: span 9; }
    .form-grid.form-grid--lg .col-10 { grid-column: span 10; }
    .form-grid.form-grid--lg .col-11 { grid-column: span 11; }
    .form-grid.form-grid--lg .col-12 { grid-column: span 12; }
}

/* neutraliza o grid de 768px para a variante --lg */
@media (min-width: 768px) and (max-width: 999px) {
    .form-grid.form-grid--lg { grid-template-columns: 1fr; }
    .form-grid.form-grid--lg [class*="col-"] { grid-column: span 12; }
}

/* personalização tabs */
.tabs { margin-bottom:10px; }
.tabs button { padding:10px 20px 10px 40px; color:#7a7a7a; background:url(../imagens/icone-nao-checado-cinza.svg) 10px center no-repeat #e6e6e6; 
			   border:none; border-radius:4px; margin-right:8px; font-size:1rem; text-align:left; }
.tabs button:hover { background-color:#d4d4d4; }
.tabs button.aba-ativa { background:url(../imagens/icone-check-branco.svg) 10px center no-repeat var(--cor-primaria); color:#FFF; font-weight:600; }
.tabs button.aba-ativa:hover { opacity:0.8; }

/* como funciona */
.como-funciona { background:#eff6ff; color:#2f6aec; border:1px solid #ddebfe; padding:15px; border-radius:10px; margin:20px 0; display:flex; gap:10px; font-size:15px; }
.como-funciona svg { flex-shrink:0; }

/* avisos */
.aviso { padding:15px; border-radius:10px; margin:20px 0; display:flex; gap:10px; font-size:15px; }
.aviso svg { flex-shrink:0; }
.aviso-erro { background:#ffefef; color:#ec2f2f; border:1px solid #fedddd; }
.aviso-alerta { background:#fefff3; color:#d48e12; border:1px solid #fef8dd; }
.aviso-sucesso { background:#efffef; color:#40c726; border:1px solid #ddfedd; }
.aviso-info { background:#eff6ff; color:#2f6aec; border:1px solid #ddebfe; }
.aviso a { color:inherit; }
.aviso a:hover { text-decoration:underline; }

/* pulsante */
.pulsante { -webkit-animation: pulse 0.8s infinite !important; }
@-webkit-keyframes pulse {
    0% { -moz-transform: scale(1.05); -ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); }
    70% { -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
    100% { -moz-transform: scale(1.05); -ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); }
}

/* indicator */
.indicador { width: 10px; height: 10px; display: block; border-radius: 10px; animation: indicacao 1500ms infinite; background: #10a1cf; }
@keyframes indicacao {
    0% { box-shadow: #0e8bb2 0 0 0 0; }
    75% { box-shadow: #0e8bb200 0 0 0 8px; }
}

/* girando */
.girando { animation: girar 1s linear infinite; }
@keyframes girar {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}