/* lotus-ai.css - same layout, updated palette (less pink, more premium) */
.lotus-ai-root {
  /* palette variables — edit these to change look quickly */
  --bg: #ffffff;
  --border: #eceff3;           /* subtle neutral border */
  --accent: #8B5E6E;          /* muted mauve — primary accent */
  --accent-2: #F6EEF2;        /* soft, very light accent */
  --bubble-bot-bg: #fbf8fb;   /* pale warm background for bot */
  --bubble-bot-text: #4a3c41; /* dark mauve for bot text */
  --bubble-user-bg: #eaf7fb;  /* pale soft teal for user bubble */
  --bubble-user-text: #13414f;/* deep teal for user text */
  --input-border: #e2e6ea;
  --shadow: rgba(17, 24, 39, 0.05);

  border: 1px solid var(--border);
  background: var(--bg);
  border-radius: 14px;
  padding: 16px;
  max-width: 900px;
  margin: 28px auto;
  box-shadow: 0 6px 18px var(--shadow);
  font-family: "Inter", "Segoe UI", system-ui, Arial, sans-serif;
}

/* header */
.lotus-header {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-bottom: 12px;
}
.lotus-avatar {
  font-size: 28px;
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, var(--accent-2), #ffffff);
  border-radius: 12px;
  display:flex;align-items:center;justify-content:center;
  border: 1px solid rgba(139,94,110,0.08);
}
.lotus-title .lotus-name { font-weight: 700; color: var(--accent); }
.lotus-title .lotus-sub { font-size: 13px; color: #6f6b70; }

/* chat window */
.lotus-chat-window {
  max-height: 320px;
  overflow-y: auto;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 12px;
  border-radius: 10px;
  background: linear-gradient(180deg,#ffffff,#fbfbfd);
  border: 1px solid rgba(0,0,0,0.03);
}

/* Bubbles */
.lotus-bubble {
  max-width: 84%;
  padding: 12px 14px;
  border-radius: 14px;
  line-height: 1.45;
  font-size: 16px;
  box-shadow: 0 2px 6px rgba(12,12,12,0.03);
}
.lotus-bubble.bot {
  background: var(--bubble-bot-bg);
  color: var(--bubble-bot-text);
  align-self: flex-start;
  border-top-left-radius: 6px;
  border: 1px solid rgba(139,94,110,0.04);
}
.lotus-bubble.user {
  background: var(--bubble-user-bg);
  color: var(--bubble-user-text);
  align-self: flex-end;
  border-top-right-radius: 6px;
  border: 1px solid rgba(19,65,79,0.05);
}

/* loading style */
.lotus-bubble.loading { opacity: 0.85; font-style: italic; }

/* input */
.lotus-input-wrap { display:flex; gap:10px; align-items:flex-end; }
.lotus-input {
  flex: 1;
  min-height: 56px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--input-border);
  resize: vertical;
  font-size: 16px;
  transition: box-shadow .12s ease, border-color .12s ease;
}
.lotus-input:focus {
  box-shadow: 0 0 0 6px rgba(139,94,110,0.06);
  border-color: var(--accent);
}

/* button — tasteful gradient accent */
.lotus-send {
  background: linear-gradient(180deg, #8B5E6E, #6f4656);
  color: #fff;
  padding: 10px 14px;
  border-radius: 10px;
  border: none;
  cursor: pointer;
  font-weight: 700;
  min-width: 94px;
}
.lotus-send:hover {
  filter: brightness(0.95);
}
.lotus-send:disabled { opacity: 0.6; cursor: default; }

/* disclaimer */
.lotus-disclaimer {
  margin-top: 12px;
  font-size: 14px;
  color: #6b6b70;
  background: #fcfcfc;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid #f1f2f4;
}

/* small screens */
@media (max-width: 600px) {
  .lotus-ai-root {
    padding: 14px;
    margin: 18px 12px;
  }
  .lotus-chat-window {
    max-height: 260px;
    padding: 10px;
  }
  .lotus-input { min-height: 50px; font-size: 14px; }
  .lotus-send { min-width: 72px; padding: 10px 12px; }
}