/* Módulo 12 — front-chat (Deudas y Gastos). Vanilla CSS, responsive, botones grandes. */
#section-chat { font-family: system-ui, -apple-system, "Segoe UI", sans-serif; max-width: 900px; margin: 0 auto; padding: 1rem; color: #1c1c1c; line-height: 1.45; }
#section-chat h2 { font-size: 1.6rem; margin: 0 0 .5rem; }
#section-chat h3 { font-size: 1.25rem; margin-top: 2rem; }
#section-chat h4 { margin: 1rem 0 .5rem; }
.chat-ayuda { color: #444; }
.chat-label { display: block; font-weight: 700; margin: .75rem 0 .25rem; }
#chat-texto, #chat-comparacion-q { width: 100%; box-sizing: border-box; font-size: 1rem; padding: .75rem; border: 1.5px solid #999; border-radius: 10px; }
#chat-texto { min-height: 150px; resize: vertical; }
.chat-acciones { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1rem 0; }
.btn { font-size: 1.05rem; font-weight: 700; padding: .9rem 1.4rem; border-radius: 12px; border: 2px solid #1c1c1c; background: #fff; cursor: pointer; min-height: 48px; }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn-primario { background: #1c1c1c; color: #fff; }
.btn-secundario { background: #eee; }
.btn-peligro { font-size: .9rem; padding: .5rem .9rem; min-height: 40px; border-color: #a00; color: #a00; }
.chat-mensaje { min-height: 1.5em; font-weight: 600; }
.chat-mensaje.error, .error { color: #a00; }
.chat-vacio { color: #666; font-style: italic; }
.chat-preview { border-top: 2px solid #ddd; margin-top: 1rem; }
.preview-lugar { border-bottom: 1px solid #ddd; padding-bottom: .75rem; }
.preview-fila { display: grid; grid-template-columns: 1fr 1.4fr .6fr 1fr 1fr auto; gap: .5rem; align-items: end; padding: .5rem; border-radius: 8px; }
.preview-fila label { font-size: .85rem; font-weight: 600; }
.preview-fila input, .preview-fila select { width: 100%; box-sizing: border-box; font-size: 1rem; padding: .5rem; border: 1px solid #999; border-radius: 8px; margin-top: .15rem; }
.preview-fila.es-revisar { background: #fff4d6; border: 1.5px dashed #b8860b; }
.badge-estado { font-size: .85rem; font-weight: 800; padding: .3rem .6rem; border-radius: 999px; background: #d8ecff; white-space: nowrap; }
.es-revisar .badge-estado { background: #ffe08a; }
.chat-totales { margin-top: 1rem; padding: 1rem; background: #f4f4f4; border-radius: 12px; }
.total-lugar, .chat-total-general { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; }
.chat-total-general { border-top: 2px solid #1c1c1c; margin-top: .5rem; padding-top: .5rem; font-size: 1.25rem; }
.chat-nota, .chat-cartel { color: #555; font-size: .95rem; }
.chat-cartel { background: #fff4d6; border: 1.5px solid #b8860b; border-radius: 10px; padding: .75rem 1rem; }
.chat-comparacion { margin-top: 2rem; padding: 1rem; border: 2px solid #ddd; border-radius: 12px; }
.chat-comparacion-form { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; }
.chat-comparacion-form .chat-label { flex-basis: 100%; }
#chat-comparacion-q { flex: 1 1 220px; }
.comp-fila { display: flex; gap: 1rem; align-items: center; padding: .4rem 0; border-bottom: 1px solid #eee; }
.comp-fila.es-barato { font-weight: 700; }
.comp-resumen { font-size: 1.1rem; }
.lista-guardada { border: 1.5px solid #ccc; border-radius: 12px; padding: 1rem; margin-bottom: 1rem; }
.lista-guardada header { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between; }
.lista-guardada ul { list-style: none; padding: 0; }
.lista-item { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between; padding: .4rem 0; border-bottom: 1px solid #eee; }
.lista-item.es-revisar { background: #fff4d6; }
.lista-item select { font-size: 1rem; padding: .4rem; border-radius: 8px; }
@media (max-width: 700px) {
  .preview-fila { grid-template-columns: 1fr 1fr; }
  .chat-acciones .btn, #chat-comparacion-buscar { width: 100%; }
}