/* /wp-content/plugins/ai-app-switcher/public/chat.css */

/* --- Container & base --- */
.aas-chat-card {
  border:1px solid #e5e7eb; border-radius:16px; padding:8px; background:#f7f8fb;
  box-shadow:0 3px 10px rgba(0,0,0,.05);
}
#aas-chat-app {
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
    "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", "Yu Gothic", sans-serif;
}
#aas-chat-app .status { font-size:12px; color:#64748b; margin:4px 6px 8px; }
#aas-chat-app .chat {
  overflow:auto; border-radius:14px; background:#e5edf5;
  padding:10px; border:1px solid #e2e8f0;
}
#aas-chat-app .row { display:flex; align-items:flex-end; margin:8px 0; gap:8px; }

/* --- Avatar --- */
#aas-chat-app .row.ai .avatar{
  width:28px; height:28px; border-radius:50%; background:#fff; border:1px solid #e2e8f0;
  display:flex; align-items:center; justify-content:center; font-size:16px;
}

/* --- Bubbles (LINE風) --- */
#aas-chat-app .bubble{
  max-width:74%; padding:10px 12px; border-radius:16px; line-height:1.5;
  position:relative; word-break:break-word;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
}
#aas-chat-app .bubble.ai{
  background:#ffffff; color:#0f172a; border:1px solid #e2e8f0;
  border-top-left-radius:6px; /* 左側を角丸小さめでLINE風 */
}
#aas-chat-app .bubble.me{
  margin-left:auto; background:#1a73e8; color:#fff; border-top-right-radius:6px;
}

/* --- Input row --- */
#aas-chat-app .input { display:flex; gap:8px; margin-top:10px; }
#aas-chat-app .input input {
  flex:1; padding:12px 14px; border:1px solid #dbe3ef; border-radius:999px; background:#fff;
}
#aas-chat-app .input button {
  padding:12px 16px; border:0; border-radius:999px; background:#1a73e8; color:#fff; cursor:pointer;
}

/* --- Quick Replies (chips inside AI bubble) --- */
#aas-chat-app .quick-wrap{
  margin-top:8px; display:flex; gap:8px; flex-wrap:wrap;
}
#aas-chat-app .chip{
  text-align:left; padding:10px 12px; border-radius:14px; border:1px solid #d9e1ee;
  background:#f8fbff; color:#0b1220; cursor:pointer; min-width:180px; max-width:100%;
  box-shadow:0 2px 6px rgba(0,0,0,.04);
}
#aas-chat-app .chip:hover{ background:#eef6ff; }
#aas-chat-app .chip:disabled{ opacity:.6; cursor:not-allowed; }
#aas-chat-app .chip-title{ font-weight:700; margin-bottom:2px; }
#aas-chat-app .chip-sub{ font-size:12px; color:#4b5563; margin-bottom:6px; }
#aas-chat-app .chip-meta{ font-size:11px; color:#6b7280; }

/* --- Mobile --- */
@media (max-width:640px){
  #aas-chat-app .bubble{ max-width:85%; }
  #aas-chat-app .chip{ min-width:calc(50% - 6px); }
}

/* --- Intro (mobile first) --- */
#aas-chat-app .intro-only { /* チャット枠を出さない導入ビュー。余白は最低限 */
  padding: 10px;
}

#aas-chat-app .intro-actions{ margin-top:10px; }
#aas-chat-app .start-btn{
  padding:12px 16px; border:0; border-radius:999px;
  background:#1a73e8; color:#fff; cursor:pointer;
  font-weight:600; box-shadow:0 2px 6px rgba(0,0,0,.06);
}
#aas-chat-app .start-btn:hover{ filter:brightness(1.05); }
#aas-chat-app .start-btn:active{ transform:translateY(1px); }