:root {
  --chat--color-primary: #7b61ff;
  --chat--color-secondary: #5cc8ff;
  --chat--header--background: linear-gradient(90deg, #7b61ff 0%, #5cc8ff 100%);
  --chat--header--color: #ffffff;
  --chat--button--background: #5cc8ff;
  --chat--button--color: #ffffff;
  --chat--button--hover--background: #7b61ff;

  --chat--message--font-size: 14px;
  --chat--input--font-size: 14px;
}

html, body {
  margin: 0;
  padding: 0;
}

#n8n-chat {
  position: fixed !important;
  right: 24px !important;
  bottom: 24px !important;
  left: auto !important;
  top: auto !important;
  z-index: 999999 !important;

  color: #1f2937 !important;
  font-family: inherit !important;
}

#n8n-chat * {
  box-sizing: border-box;
}

/* Cabecera y textos */
#n8n-chat .chat-header,
#n8n-chat [class*="header"] {
  padding: 14px 16px !important;
}

#n8n-chat .chat-header h1,
#n8n-chat .chat-header h2,
#n8n-chat .chat-header h3,
#n8n-chat [class*="title"] {
  font-size: 18px !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}

#n8n-chat .chat-subtitle,
#n8n-chat [class*="subtitle"] {
  font-size: 13px !important;
  line-height: 1.35 !important;
  margin-top: 6px !important;
}

#n8n-chat .chat-message,
#n8n-chat .chat-message p,
#n8n-chat .chat-message-markdown,
#n8n-chat .chat-message-markdown p {
  font-size: 14px !important;
  line-height: 1.45 !important;
  color: #1f2937 !important;
}

/* Input y envío */
#n8n-chat .chat-inputs,
#n8n-chat [class*="input"] {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px !important;
}

#n8n-chat textarea,
#n8n-chat input[type="text"] {
  width: 100% !important;
  min-height: 48px !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 12px !important;
  outline: none !important;
}

#n8n-chat textarea::placeholder,
#n8n-chat input::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

#n8n-chat .chat-input-send-button,
#n8n-chat button[type="submit"] {
  min-width: 44px !important;
  min-height: 44px !important;
  border-radius: 12px !important;
  background: #5cc8ff !important;
  color: #ffffff !important;
  border: none !important;
}

/* Tema oscuro del sitio padre */
.dark #n8n-chat,
[data-theme="dark"] #n8n-chat {
  color: #e5e7eb !important;
}

.dark #n8n-chat textarea,
.dark #n8n-chat input[type="text"],
[data-theme="dark"] #n8n-chat textarea,
[data-theme="dark"] #n8n-chat input[type="text"] {
  color: #e5e7eb !important;
  -webkit-text-fill-color: #e5e7eb !important;
  background: #111827 !important;
  border-color: #374151 !important;
}

.dark #n8n-chat textarea::placeholder,
.dark #n8n-chat input::placeholder,
[data-theme="dark"] #n8n-chat textarea::placeholder,
[data-theme="dark"] #n8n-chat input::placeholder {
  color: #9ca3af !important;
  opacity: 1 !important;
}

.dark #n8n-chat .chat-message,
.dark #n8n-chat .chat-message p,
.dark #n8n-chat .chat-message-markdown,
.dark #n8n-chat .chat-message-markdown p,
[data-theme="dark"] #n8n-chat .chat-message,
[data-theme="dark"] #n8n-chat .chat-message p,
[data-theme="dark"] #n8n-chat .chat-message-markdown,
[data-theme="dark"] #n8n-chat .chat-message-markdown p {
  color: #e5e7eb !important;
}
/* Normalizar markdown dentro del chat */
#n8n-chat .chat-message h1,
#n8n-chat .chat-message h2,
#n8n-chat .chat-message h3,
#n8n-chat .chat-message h4,
#n8n-chat .chat-message h5,
#n8n-chat .chat-message h6,
#n8n-chat .chat-message-markdown h1,
#n8n-chat .chat-message-markdown h2,
#n8n-chat .chat-message-markdown h3,
#n8n-chat .chat-message-markdown h4,
#n8n-chat .chat-message-markdown h5,
#n8n-chat .chat-message-markdown h6 {
  font-size: 14px !important;
  line-height: 1.45 !important;
  margin: 0 0 8px 0 !important;
  font-weight: 600 !important;
  color: inherit !important;
}

#n8n-chat .chat-message p,
#n8n-chat .chat-message-markdown p,
#n8n-chat .chat-message li,
#n8n-chat .chat-message-markdown li {
  font-size: 14px !important;
  line-height: 1.45 !important;
  margin: 0 0 8px 0 !important;
}

#n8n-chat .chat-message strong,
#n8n-chat .chat-message-markdown strong {
  font-weight: 600 !important;
}

#n8n-chat .chat-message code,
#n8n-chat .chat-message-markdown code {
  font-size: 13px !important;
  padding: 2px 4px !important;
}