/* --- Fix n8n embedded chat layout (wide input + inline send button) --- */

/* Ensure the wrapper takes the full container width */
.n8n-chat-input-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.5rem !important;
  width: 100% !important;
  flex-wrap: nowrap !important; /* keep on one line */
}

/* Make the text input (or textarea) stretch wider */
.n8n-chat-input-wrapper input,
.n8n-chat-input-wrapper textarea {
  flex: 1 1 100% !important;
  width: 100% !important;
  min-width: 0 !important;       /* fixes flex overflow */
  box-sizing: border-box;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem !important;
  font-size: 1rem;
  background-color: #1a1a1a;     /* matches your black theme */
  color: #fff;
  border: 1px solid #333;
}

/* Keep send button inline on the right */
.n8n-chat-input-wrapper button {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 0.5rem !important;
  padding: 0.6rem 1rem !important;
  font-size: 1rem;
  border-radius: 0.5rem;
  background-color: #ff0066;
  color: #fff;
  border: none;
  cursor: pointer;
}

/* Optional hover for the button */
.n8n-chat-input-wrapper button:hover {
  background-color: #ff3388;
}

/* Center the whole chat box, wider than before */
#n8n-embed {
  width: 100%;
  max-width: 640px;  /* was 480px → wider chat box */
  margin: 0 auto;
  padding: 1rem;
}

#n8n-embed {
  max-width: 720px;
}