/* Container */
#myai-chat, #ai-chat, [data-myai-chat]{
  box-sizing: border-box;
  width: 100%;
  max-width: 820px;
  margin: 0 auto 24px;
  display: block;
}

/* Chat window */
#ai-chat-window, .myai-window{
  height: 50vh;
  min-height: 360px;
  overflow-y: auto;
  padding: 14px;
  border: 1px solid #ddd;
  border-radius: 10px;
  background: #fff;
  line-height: 1.6;
  word-break: break-word;
}

/* Input bar */
.myai-inputbar{
  display: flex;
  gap: 8px;
  margin-top: 10px;
}
#ai-chat-input{
  flex: 1;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #ccc;
  border-radius: 8px;
}
#ai-chat-send{
  min-height: 44px;
  padding: 0 16px;
  border-radius: 8px;
  cursor: pointer;
}

/* Answer */
.ai-answer h3{ margin: 0 0 8px; }
.ai-answer p{ margin: 0 0 10px; }
.ai-answer ul, .ai-answer ol{ margin: 0 0 10px 18px; }
.ai-answer a{ text-decoration: underline; }
.ai-sources{ margin-top: 10px; font-size: 0.95em; }
.ai-sources ul{ margin: 6px 0 0 18px; }

/* Greeting */
.ai-greet{ margin-bottom:8px; color:#555; }

@media (max-width:600px){
  #myai-chat{ max-width: 100%; padding: 0 12px; }
  #ai-chat-window{ height: 60vh; min-height: 320px; }
}