/* styles.css — ajustes sobre Tailwind y estilos globales */

:root {
  --color-primary:    #2448A4;
  --color-secondary:  #3B5FC7;
  --color-accent:     #F59E42;
  --color-success:    #4CAF50;
  --color-bg:         #F5F7FA;
  --color-text-muted: #6C757D;
  --radius:           8px;
  --shadow:           0 2px 8px rgba(0,0,0,0.1);
}

/* Smooth scroll en el área de chat */
#chat-container {
  scroll-behavior: smooth;
}

/* Textarea crece automáticamente hasta 8 líneas */
#chat-input {
  max-height: 12rem;
  overflow-y: auto;
}

/* Burbujas de chat */
.bubble-user {
  background: var(--color-primary);
  color: #fff;
  border-radius: 1rem 1rem 0.25rem 1rem;
}

.bubble-assistant {
  background: #fff;
  color: #1a1a1a;
  border-radius: 1rem 1rem 1rem 0.25rem;
  box-shadow: var(--shadow);
}

/* Indicador de carga (tres puntos) */
.typing-indicator span {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 2px;
  background: var(--color-text-muted);
  border-radius: 50%;
  animation: bounce 1.2s infinite;
}

.typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
.typing-indicator span:nth-child(3) { animation-delay: 0.4s; }

@keyframes bounce {
  0%, 80%, 100% { transform: translateY(0); }
  40%           { transform: translateY(-6px); }
}

/* Scrollbar minimalista */
::-webkit-scrollbar       { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #c1c9d8; border-radius: 3px; }