/* style.css - layout limpo, responsivo */

/* reset mínimo */
* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: Arial, Helvetica, sans-serif;
  color: #222;
  background: #fff;
}

/* cabeçalho */
.header {
  background: #ffffff;
  padding: 18px 12px;
  text-align: center;
  border-bottom: 1px solid #e6e6e6;
}
.header .logo {
  display: inline-block;
  max-width: 240px;
  margin-bottom: 8px;
}
.header h1 {
  font-size: 22px;
  margin: 6px 0 0;
  font-weight: 700;
  letter-spacing: 0.5px;
}
.header p {
  margin-top: 6px;
  color: #666;
}

/* menu com ícones */
.nav {
  display:flex;
  justify-content:center;
  gap:30px;
  padding:14px 10px;
  align-items:center;
}
.nav a {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  text-decoration:none;
  color:#333;
  font-size:14px;
}
.nav .icon {
  font-size:26px; /* ícone pequeno e clean */
  background:transparent;
}

/* container principal */
.container {
  max-width: 1100px;
  margin: 18px auto;
  padding: 0 14px;
}

/* seção Visualizar Nota */
.card {
  background: #fff;
  border-radius: 3px;
  padding: 16px;
  box-shadow: 0 0 0 rgba(0,0,0,0); /* mantem clean */
}

/* captcha area */
.form-row {
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:flex-end;
  margin-bottom: 10px;
}
.captcha-display {
  font-family: monospace;
  font-size: 28px;
  letter-spacing:6px;
  color:#111;
  user-select: none;
}
.captcha-input {
  padding:10px 12px;
  width:220px;
  border:1px solid #ddd;
  border-radius:4px;
  font-size:16px;
}
.btn-green {
  background:#28a745;
  color:#fff;
  border:0;
  padding:12px 18px;
  border-radius:6px;
  cursor:pointer;
  font-weight:600;
  display:inline-flex;
  gap:8px;
  align-items:center;
}
.btn-gray {
  background:#6c757d;
  color:#fff;
  border:0;
  padding:10px 14px;
  border-radius:6px;
  cursor:pointer;
}

/* wrapper do PDF */
.pdf-frame-wrapper {
  width:100%;
  display:flex;
  justify-content:center;
  padding-top:12px;
}

/* iframe para mostrar o PDF - responsivo e centralizado */
.pdf-frame {
  width:100%;
  max-width:1000px; /* limita largura em desktops */
  height:80vh; /* ocupa a maior parte da tela */
  border: 1px solid #ddd;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

/* botão imprimir (aparece acima do PDF) */
.print-actions {
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:10px;
}

/* rodapé */
.footer {
  margin-top:28px;
  border-top:1px solid #eee;
  padding:14px;
  text-align:center;
  color:#666;
  font-size:13px;
}

/* responsividade */
@media (max-width:600px){
  .nav { gap:18px; }
  .nav a { font-size:13px; }
  .captcha-input { width:140px; }
  .pdf-frame { height:70vh; }
}