/* 🐕🦌💕 聊天室 — 输入区域 */

.input-area {
  padding: 10px 14px 14px;
  border-top: 1px solid rgba(180,160,130,0.12);
  background: var(--bg-glass);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  z-index: 10; flex-shrink: 0;
}
.input-row { display: flex; gap: 8px; align-items: flex-end; }
.input-row textarea {
  flex: 1; padding: 9px 15px;
  border: 1px solid rgba(180,160,130,0.2); border-radius: 20px;
  background: rgba(255,255,255,0.5); font: 15px var(--font);
  color: var(--text-primary); resize: none; line-height: 1.6;
  outline: none; max-height: 120px; overflow-y: auto;
  transition: border-color 0.2s;
}
.input-row textarea:focus { border-color: rgba(180,160,130,0.45); }
.input-row textarea::-webkit-scrollbar { display: none; }
.input-row textarea { -ms-overflow-style: none; scrollbar-width: none; }
textarea::placeholder { color: rgba(150,130,100,0.35); }

/* Tool tags */
.input-area > .tool-tags {
  display: flex; flex-wrap: wrap; gap: 4px; padding: 0 4px;
  margin-bottom: 10px;
}
.tool-tags:empty { display: none; }
.tool-tag {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 3px 10px; background: rgba(180,160,130,0.15);
  border: 1px solid rgba(180,160,130,0.25); border-radius: 14px;
  font-size: 12px; color: var(--text-secondary); cursor: pointer;
  transition: all 0.2s;
}
.tool-tag:hover { background: rgba(200,100,100,0.1); border-color: rgba(200,100,100,0.2); }
.tool-tag .remove { font-size: 10px; opacity: 0.5; margin-left: 2px; }

/* Tool menu */
.tool-menu {
  position: absolute; bottom: 100%; left: 0; right: 0;
  background: rgba(255,252,248,0.98); border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 -4px 16px rgba(0,0,0,0.08);
  padding: 8px; display: none; z-index: 20;
  backdrop-filter: blur(10px);
}
.tool-menu.show { display: flex; flex-wrap: wrap; gap: 4px; }
.tool-menu-item {
  padding: 6px 14px; background: rgba(180,160,130,0.08);
  border: 1px solid rgba(180,160,130,0.15); border-radius: 16px;
  cursor: pointer; font: 13px var(--font); color: var(--text-primary);
  transition: all 0.2s;
}
.tool-menu-item:hover { background: rgba(180,160,130,0.2); }
.tool-menu-item.active { background: rgba(180,160,130,0.25); border-color: rgba(180,160,130,0.4); }

/* Send & Attach buttons */
.btn-send {
  width: 40px; height: 40px; border-radius: 50%; border: none;
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  font-size: 17px; transition: all 0.2s; box-shadow: var(--shadow-soft);
  flex-shrink: 0;
}
.btn-send:disabled {
  background: rgba(180,160,130,0.15); box-shadow: none; cursor: default;
}
.btn-attach {
  background: none; border: none; cursor: pointer;
  font-size: 20px; padding: 6px; opacity: 0.5;
  transition: opacity 0.2s; flex-shrink: 0;
  align-self: center;
}
.btn-attach:hover { opacity: 0.8; }

@media (max-width: 600px) {
  .input-area { padding: 10px 12px 14px; }
}