/* Página do ticket virtual (especificação 6.4): pensada para a tela do celular, sem zoom. */
* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  padding: 16px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 18px;
  line-height: 1.4;
  color: #111;
  background: #f2f2f2;
}

main {
  max-width: 440px;
  margin: 0 auto;
  padding: 20px 16px;
  background: #fff;
  border-radius: 12px;
}

[hidden] { display: none !important; }

h1 { margin: 0; font-size: 24px; text-align: center; }
h2 { margin: 0 0 8px; font-size: 18px; }
p { margin: 0; }

.estacionamento { text-align: center; padding-bottom: 12px; border-bottom: 1px dashed #999; }
.estacionamento a { display: inline-block; margin-top: 6px; font-size: 20px; color: #0b57d0; }

.veiculo { text-align: center; padding: 16px 0 8px; }
.numero { font-size: 16px; color: #444; }
.placa { font-size: 44px; font-weight: 700; letter-spacing: 3px; margin: 4px 0; }
.modelo { font-size: 20px; }

.tempo { padding: 8px 0 16px; border-bottom: 1px dashed #999; }
.tempo div { display: flex; justify-content: space-between; align-items: baseline; padding: 4px 0; }
.rotulo { color: #444; }
.valor { font-weight: 600; }
.destaque { font-size: 24px; }

.qr { text-align: center; padding: 20px 0; border-bottom: 1px dashed #999; }
/* Preto sobre branco, com pelo menos 260 px de largura. */
.qrcode { width: 100%; min-width: 260px; max-width: 320px; margin: 0 auto; background: #fff; }
.qrcode svg { display: block; width: 100%; height: auto; }
.orientacao { margin-top: 12px; font-size: 18px; font-weight: 600; }

.precos { padding: 16px 0; }
.precos table { width: 100%; border-collapse: collapse; }
.precos td { padding: 4px 0; }
.precos td:last-child { text-align: right; font-weight: 600; white-space: nowrap; }

footer { text-align: center; color: #444; font-size: 16px; padding-top: 8px; border-top: 1px dashed #999; }

.invalido { text-align: center; font-size: 20px; font-weight: 600; padding: 40px 16px; }

.exemplos { padding-left: 20px; }
.exemplos li { margin: 12px 0; font-size: 20px; }
.exemplos a { color: #0b57d0; }