/* Páginas públicas fora do painel: compra, senha, obrigado, textos legais e contatos. */
html, body { height: auto; min-height: 100%; }
a { color: var(--verde); }
.folha { width: min(1080px, 100%); margin: 0 auto; padding-block: 18px 40px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); display: grid; gap: 18px; }
.cabeca { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 18px; border-radius: 999px; background: rgb(36 32 28 / 56%); border: 1px solid var(--linha); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.cabeca .marca { color: var(--texto); text-decoration: none; }
.cartao { padding: clamp(22px, 3.4vw, 34px); display: grid; gap: 18px; background: rgb(36 32 28 / 72%); min-width: 0; }
.cartao h1 { font-size: clamp(1.9rem, 4vw, 2.5rem); line-height: 1.12; font-weight: 500; text-wrap: balance; }
.cartao h2 { font-size: 1.12rem; font-weight: 500; }
.cartao p, .cartao li { font-size: 1rem; line-height: 1.5; }
.cartao label { font-size: .92rem; color: var(--texto); }
.cartao input:not([type="checkbox"]):not([type="radio"]), .cartao select { background: rgb(14 14 12 / 42%); font-size: 1rem; }
.cartao select option { color: #1c1a17; }

.grade-compra { display: grid; gap: 18px; align-items: start; }
.campos { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.campos .largo { grid-column: 1 / -1; }
fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 12px; min-width: 0; }
legend { padding: 0 0 10px; font-size: 1.12rem; font-weight: 500; }
.opcoes { display: grid; gap: 10px; margin: 0; padding: 0; }
.opcao { position: relative; display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; padding: 14px 16px; border-radius: 18px; border: 1px solid var(--linha); background: rgb(14 14 12 / 30%); cursor: pointer; transition: border-color .2s, background .2s; }
.opcao:has(input:checked) { border-color: var(--verde); background: rgb(211 235 180 / 13%); }
.opcao:has(input:focus-visible) { outline: 2px solid var(--verde); outline-offset: 2px; }
.opcao input { accent-color: var(--verde-2); width: 18px; height: 18px; margin: 0; }
.opcao b { font-weight: 500; font-size: 1.04rem; }
.opcao .valor { font-size: 1.1rem; font-weight: 500; white-space: nowrap; }
.opcao small { grid-column: 2 / -1; color: var(--texto-2); font-size: .88rem; line-height: 1.35; }
.itens { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.itens li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; }
.itens .icone { color: var(--verde); margin-top: 3px; }
.aceite { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: start; }
.aceite input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--verde-2); }
.pagar { background: var(--verde); color: #1f2c12; font-size: 1.08rem; font-weight: 600; padding: 16px 24px; }
.pagar:disabled { background: rgb(255 255 255 / 22%); color: var(--texto-2); }
.nota { color: var(--texto-2); font-size: .9rem !important; }

.texto-legal { gap: 14px; }
.texto-legal h2 { margin-top: 10px; }
.texto-legal ul { margin: 0; padding-left: 20px; display: grid; gap: 6px; }

.numeros-admin { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.numero { padding: 14px 16px; border-radius: 18px; background: rgb(14 14 12 / 36%); border: 1px solid rgb(255 255 255 / 14%); }
.numero b { display: block; font-size: 1.7rem; font-weight: 500; line-height: 1.1; }
.numero span { font-size: .86rem; color: var(--texto-2); }
.ferramentas { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ferramentas input { flex: 1 1 220px; width: auto; }
.tabela-rolagem { overflow-x: auto; }
.tabela-admin { width: 100%; border-collapse: collapse; font-size: .9rem; }
.tabela-admin th { text-align: left; font-weight: 500; color: var(--texto-2); }
.tabela-admin th, .tabela-admin td { padding: 9px 12px 9px 0; border-bottom: 1px solid rgb(255 255 255 / 14%); white-space: nowrap; }

@media (min-width: 860px) {
  .grade-compra { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
  .grade-compra .resumo { order: 2; position: sticky; top: 18px; }
}
@media (max-width: 520px) {
  .campos { grid-template-columns: minmax(0, 1fr); }
}