/* widget-ux.css
 * Bloque 9 UX layer (safe overrides)
 */
.cllg-chat-widget.cllg-state-sending .cllg-chat-send,
.cllg-chat-widget.cllg-state-sending #cllg-chat-input {
  opacity: 0.7;
  pointer-events: none;
}

.cllg-chat-widget .cllg-chat-status {
  min-height: 1.2em;
}

.cllg-chat-widget.cllg-state-error .cllg-chat-status,
.cllg-chat-widget.cllg-state-blocked .cllg-chat-status {
  font-weight: 600;
}

.cllg-chat-widget.cllg-state-blocked .cllg-chat-status:before {
  content: "⛔ ";
}

/* widget-ux.css
 * UX layer (safe overrides)
 */
.cllg-chat-widget.cllg-state-sending .cllg-chat-send,
.cllg-chat-widget.cllg-state-sending #cllg-chat-input {
  opacity: 0.7;
  pointer-events: none;
}

.cllg-chat-widget .cllg-chat-status {
  min-height: 1.2em;
}

.cllg-chat-widget.cllg-state-error .cllg-chat-status,
.cllg-chat-widget.cllg-state-blocked .cllg-chat-status {
  font-weight: 600;
}

.cllg-chat-widget.cllg-state-blocked .cllg-chat-status:before {
  content: "⛔ ";
}

/* Subtle state cues (pure CSS; no extra dependencies) */
.cllg-chat-widget.cllg-state-error .cllg-chat-status{
  color: var(--cllg-danger, #ff6b6b);
}

.cllg-chat-widget.cllg-state-blocked .cllg-chat-status{
  color: var(--cllg-warn, #ffcc66);
}

.cllg-chat-widget.cllg-state-sending .cllg-chat-status:after{
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-left: 8px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.25);
  border-top-color: var(--cllg-accent, #00d3a7);
  vertical-align: -1px;
  animation: cllgSpin .8s linear infinite;
}

@keyframes cllgSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}