/* Estados: vacíos, cargas, errores, avisos y pistas. */
.cq-pista { margin-top: var(--cq-space-4); padding: var(--cq-space-4); border: 1px dashed var(--cq-ai); border-radius: var(--cq-radius-card); background: var(--cq-surface); color: var(--cq-ink); box-shadow: var(--cq-shadow-sm); }
.cq-pista .cq-button { align-self: flex-end; }
@media (prefers-reduced-motion: reduce) {
  .cq-pista, .cq-pista * { animation: none; transition: none; }
}
.cq-empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--cq-space-4); padding-block: var(--cq-space-7); }
.cq-empty > .cq-icono { color: var(--cq-ink-2); width: var(--cq-space-6); height: var(--cq-space-6); }
.cq-cargando { padding-block: var(--cq-space-6); }
.cq-error { color: var(--cq-bad); }
[data-theme="light"] .cq-error,
[data-theme="light"] .cq-toast--error { color: color-mix(in srgb, var(--cq-bad) 85%, var(--cq-ink)); }
.cq-pensando { display: flex; align-items: center; gap: var(--cq-space-3); color: var(--cq-ai); }
.cq-punto { width: var(--cq-space-2); height: var(--cq-space-2); border-radius: var(--cq-radius-pill); background: var(--cq-ai); flex-shrink: 0; }
.cq-pasos-ayuda { margin: 0; padding-left: var(--cq-space-5); }
.cq-pasos-ayuda li + li { margin-top: var(--cq-space-3); }
.cq-aviso--error { flex-direction: row; align-items: flex-start; gap: var(--cq-space-2); padding: var(--cq-space-3); border: 1px solid var(--cq-bad); border-radius: var(--cq-radius-control); background: var(--cq-bad-tint); }
.cq-aviso--error:focus { outline: none; box-shadow: var(--cq-focus-ring); }
.cq-aviso--error > .cq-icono { color: var(--cq-bad); }
.cq-aviso__titulo { font-weight: 500; }
.cq-aviso__lista { margin: var(--cq-space-1) 0 0; padding-left: var(--cq-space-4); }

/* Bloque E (TASK-230): errores en su lugar, sin conexión, borrador y espera. */
.cq-aviso--error .cq-grupo { gap: var(--cq-space-2); min-width: 0; }
.cq-aviso--error .cq-acciones { flex-wrap: wrap; }
.cq-aviso--error > .cq-icono, .cq-banda-conexion > .cq-icono, .cq-banda-borrador > .cq-icono { flex-shrink: 0; margin-top: var(--cq-space-1); }
.cq-propuesta__error:empty { display: none; }
.cq-propuesta--fallida { border-style: solid; border-color: var(--cq-bad); }

/* Banda de conexión: en el flujo, al inicio de main, pegada arriba mientras se desplaza. */
.cq-banda-conexion { font-family: var(--cq-font-ui); position: sticky; top: 0; z-index: 1; display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--cq-space-3); padding: var(--cq-space-3) var(--cq-space-4); border-bottom: 1px solid var(--cq-warn); background: var(--cq-warn-tint); color: var(--cq-ink); }
.cq-banda-conexion > .cq-icono { color: var(--cq-warn); }
.cq-banda-conexion > .cq-grupo { flex: 1 1 calc(var(--cq-touch) * 5); gap: var(--cq-space-1); }
.cq-banda-conexion > .cq-button { align-self: center; }
[data-theme="light"] .cq-banda-conexion > .cq-icono { color: color-mix(in srgb, var(--cq-warn) 60%, var(--cq-ink)); }

/* Borrador recuperable y estado junto a Guardar. */
.cq-banda-borrador { font-family: var(--cq-font-ui); font-size: var(--cq-text-14); display: flex; align-items: flex-start; gap: var(--cq-space-3); padding: var(--cq-space-3) var(--cq-space-4); border: 1px solid var(--cq-accent); border-radius: var(--cq-radius-card); background: var(--cq-accent-tint); color: var(--cq-ink); }
.cq-banda-borrador > .cq-icono { color: var(--cq-ink-2); }
.cq-banda-borrador > .cq-grupo { gap: var(--cq-space-2); min-width: 0; }
.cq-estado-borrador { color: var(--cq-ink-2); }
.cq-estado-borrador--sin-copia { color: var(--cq-bad); }
[data-theme="light"] .cq-estado-borrador--sin-copia { color: color-mix(in srgb, var(--cq-bad) 85%, var(--cq-ink)); }

/* Espera de una propuesta: tiempo en cifras tabulares para que no salte. */
.cq-espera__tiempo { color: var(--cq-ink-2); font-variant-numeric: tabular-nums; }
.cq-espera__tiempo:empty { display: none; }

/* Un error en el mensaje breve se queda hasta cerrarlo: su botón sí recibe el puntero. */
.cq-toast--error.cq-toast--visible { display: flex; align-items: center; gap: var(--cq-space-2); pointer-events: auto; padding-inline-end: var(--cq-space-1); }
.cq-toast__cerrar { display: inline-grid; place-items: center; flex-shrink: 0; min-width: var(--cq-touch); min-height: var(--cq-touch); padding: 0; border: 0; border-radius: var(--cq-radius-control); background: transparent; color: inherit; cursor: pointer; }
.cq-toast__cerrar:focus-visible { outline: none; box-shadow: var(--cq-focus-ring); }

.cq-reingreso .cq-grupo { gap: var(--cq-space-3); }
