#hospedagem-adicionais-modal {
  position: fixed;
  inset: 0;
  z-index: 100001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(0, 0, 0, .58);
  color: #172033;
  font-family: Arial, sans-serif;
}

.adicionais-card {
  width: min(980px, 96vw);
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .35);
}

.pagamento-card {
  width: min(560px, 96vw);
}

.resumo-cobranca-card { width: min(620px, 96vw); }
.resumo-cobranca-lista { display:grid; gap:8px; padding:16px 18px; overflow:auto; }
.resumo-cobranca-item { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:12px; border:1px solid #d5dde8; border-radius:8px; }
.resumo-cobranca-item strong, .resumo-cobranca-item small { display:block; }
.resumo-cobranca-item small { margin-top:4px; color:#64748b; }
.resumo-cobranca-item > span { font-weight:700; white-space:nowrap; }
.resumo-cobranca-total, .pagamento-total { display:flex; align-items:center; justify-content:space-between; padding:16px 18px; background:#eff6ff; font-size:18px; }
.resumo-cobranca-total strong, .pagamento-total strong { color:#075ca8; font-size:28px; }
.pagamento-total { border-radius:8px; }
.pix-preview button { border:0; border-radius:6px; padding:9px 12px; background:#e2e8f0; cursor:pointer; }

.adicionais-topo,
.adicionais-rodape {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid #e3e8ef;
}

.adicionais-topo strong {
  display: block;
  font-size: 20px;
}

.adicionais-topo span {
  display: block;
  margin-top: 3px;
  color: #64748b;
  font-size: 13px;
}

.adicionais-topo button {
  border: 0;
  background: transparent;
  color: #172033;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
}

.adicionais-busca {
  padding: 14px 18px 0;
}

.adicionais-busca input,
.pagamento-corpo input,
.pix-preview textarea {
  width: 100%;
  padding: 11px 12px;
  border: 1px solid #bac7d6;
  border-radius: 7px;
  font: inherit;
}

.adicionais-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 16px;
  min-height: 0;
  padding: 14px 18px;
  overflow: auto;
}

.adicionais-grid h3 {
  margin: 0 0 10px;
  font-size: 16px;
}

.adicionais-lista {
  display: grid;
  gap: 8px;
}

.adicional-resultado,
.adicional-adicionado {
  display: grid;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid #d5dde8;
  border-radius: 8px;
  background: #f8fafc;
}

.adicional-resultado {
  grid-template-columns: 1fr 72px auto;
}

.adicional-adicionado {
  grid-template-columns: 1fr 64px auto 34px;
}

.adicional-resultado strong,
.adicional-resultado small,
.adicional-adicionado strong,
.adicional-adicionado small {
  display: block;
}

.adicional-resultado small,
.adicional-adicionado small {
  margin-top: 3px;
  color: #526175;
}

.adicional-resultado input,
.adicional-adicionado input {
  width: 100%;
  padding: 7px;
  border: 1px solid #bac7d6;
  border-radius: 6px;
}

.adicional-resultado button,
.adicional-adicionado button,
.adicionais-rodape button,
.pagamento-corpo button {
  border: 0;
  border-radius: 6px;
  padding: 9px 12px;
  cursor: pointer;
}

.adicional-resultado button {
  background: #075ca8;
  color: #fff;
  font-weight: 700;
}

.adicional-adicionado button {
  background: #fee2e2;
  color: #b91c1c;
  font-size: 18px;
  line-height: 1;
}

.adicionais-vazio {
  margin: 0;
  padding: 12px;
  border: 1px dashed #bac7d6;
  border-radius: 8px;
  color: #64748b;
}

.adicionais-rodape {
  border-top: 1px solid #e3e8ef;
  border-bottom: 0;
}

.adicionais-rodape button {
  margin-left: 8px;
}

.btn-adicionais-confirmar {
  background: #075ca8;
  color: #fff;
  font-weight: 700;
}

.pagamento-corpo {
  display: grid;
  gap: 12px;
  padding: 16px 18px;
  overflow: auto;
}

.pagamento-corpo label {
  display: grid;
  gap: 6px;
  font-weight: 700;
}

.pix-preview {
  display: grid;
  justify-items: center;
  gap: 10px;
}

.pix-preview img {
  width: 220px;
  height: 220px;
  border: 1px solid #d5dde8;
  border-radius: 8px;
  padding: 8px;
}

.pix-preview textarea {
  min-height: 82px;
  font-size: 12px;
  resize: vertical;
}

@media (max-width: 760px) {
  .adicionais-grid {
    grid-template-columns: 1fr;
  }

  .adicional-resultado,
  .adicional-adicionado,
  .adicionais-rodape {
    align-items: stretch;
  }

  .adicionais-rodape {
    flex-direction: column;
  }
}