.admin-chat-tool {
  margin-top: 18px;
  padding: 20px;
  border: 1px solid #c9ded5;
  border-radius: 15px;
  background: #eef8f4;
}
.admin-chat-tool > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 0 16px;
}
.admin-chat-tool > header h2 { margin: 0 0 5px; }
.admin-chat-tool > header p { margin: 0; color: #687b74; font-size: 12px; }
.admin-chat-head-actions { display: flex; align-items: center; gap: 12px; }
.admin-chat-head-actions nav { display: flex; padding: 3px; border-radius: 9px; background: #dfece6; }
.admin-chat-head-actions nav button { padding: 7px 11px; border: 0; background: transparent; color: #496158; }
.admin-chat-head-actions nav button.active { background: #fff; color: #173f35; box-shadow: 0 1px 4px #173f3518; }
.admin-chat-total { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: #d7ff42; color: #173d34; }
.admin-chat-layout {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  min-height: 520px;
  overflow: hidden;
  border: 1px solid #d7e4de;
  border-radius: 12px;
  background: #fff;
}
.admin-chat-layout[hidden], .admin-chat-faq[hidden] { display: none; }
.admin-chat-layout > aside { border-right: 1px solid #e3ebe7; background: #f9fbfa; }
.admin-chat-filter { display: flex; gap: 7px; padding: 12px; border-bottom: 1px solid #e5ece8; }
.admin-chat-filter button { padding: 8px 12px; background: #edf3f0; color: #4d655d; }
.admin-chat-filter button.active { background: #173f35; color: #fff; }
.admin-chat-list { max-height: 466px; overflow: auto; }
.admin-chat-list-empty { padding: 18px; color: #7d8b86; font-size: 12px; }
.admin-chat-item { display: grid; width: 100%; gap: 6px; padding: 13px 14px; border: 0; border-bottom: 1px solid #e8eeeb; border-radius: 0; background: transparent; color: #263d36; text-align: left; }
.admin-chat-item:hover, .admin-chat-item.selected { background: #eaf7f1; }
.admin-chat-item > span { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.admin-chat-item > span b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-chat-item i { padding: 3px 6px; border-radius: 99px; background: #edf1ef; color: #66766f; font-size: 10px; font-style: normal; }
.admin-chat-item i.waiting { background: #fff0d8; color: #a35c08; }
.admin-chat-item i.open { background: #dff5e7; color: #157143; }
.admin-chat-item small { overflow: hidden; color: #65766f; text-overflow: ellipsis; white-space: nowrap; }
.admin-chat-item em { color: #8a9893; font-size: 10px; font-style: normal; }
.admin-chat-room { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-width: 0; }
.admin-chat-empty { display: grid; grid-row: 1 / -1; place-items: center; color: #89958f; }
.admin-chat-room > header { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid #e4ebe7; }
.admin-chat-room > header div { display: grid; gap: 3px; }
.admin-chat-room > header small { color: #788780; }
.admin-chat-room > header button { padding: 8px 10px; background: #fff0ed; color: #b34638; }
.admin-chat-messages { height: 390px; overflow: auto; padding: 16px; background: #f6f9f7; }
.admin-chat-message { display: grid; justify-items: start; margin: 0 0 11px; }
.admin-chat-message p { max-width: 78%; margin: 0; padding: 9px 11px; border-radius: 11px; background: #fff; line-height: 1.5; white-space: pre-wrap; }
.admin-chat-message time { margin: 3px 4px 0; color: #98a39e; font-size: 9px; }
.admin-chat-message.admin { justify-items: end; }
.admin-chat-message.admin p { background: #d7ff42; }
.admin-chat-message.bot p { background: #e5f3ff; }
.admin-chat-message.system { justify-items: center; }
.admin-chat-message.system p { background: transparent; color: #77857f; font-size: 11px; }
.admin-chat-room form { display: grid; grid-template-columns: minmax(0, 1fr) 78px; gap: 9px; padding: 12px; border-top: 1px solid #e4ebe7; }
.admin-chat-room textarea { box-sizing: border-box; width: 100%; padding: 10px; border: 1px solid #d4dfda; border-radius: 8px; resize: none; font: 13px/1.45 inherit; }
.admin-chat-room form button { background: #173f35; color: #fff; }
.admin-chat-faq { overflow: hidden; border: 1px solid #d7e4de; border-radius: 12px; background: #fff; }
.admin-chat-faq > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px; border-bottom: 1px solid #e3ebe7; }
.admin-chat-faq > header div { display: grid; gap: 4px; }
.admin-chat-faq > header small { color: #74857e; }
.admin-chat-faq > header button { background: #173f35; color: #fff; }
.admin-chat-faq-list { display: grid; gap: 12px; max-height: 620px; overflow: auto; padding: 16px; }
.admin-chat-faq-item { display: grid; grid-template-columns: 90px minmax(170px, .7fr) minmax(210px, 1fr) minmax(260px, 1.5fr) auto; align-items: center; gap: 10px; padding: 12px; border: 1px solid #dbe7e1; border-radius: 10px; background: #f8fbf9; }
.admin-chat-faq-item > b { color: #31564a; }
.admin-chat-faq-item input, .admin-chat-faq-item textarea { box-sizing: border-box; width: 100%; padding: 9px 10px; border: 1px solid #d4dfda; border-radius: 8px; background: #fff; font: 12px/1.45 inherit; }
.admin-chat-faq-item textarea { resize: vertical; }
.admin-chat-faq-item > div { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.admin-chat-faq-item > div small { max-width: 130px; color: #b3483e; }
.admin-chat-faq-item button { padding: 8px 11px; background: #173f35; color: #fff; }
.admin-chat-faq-item button.danger { background: #fff0ed; color: #b34638; }
@media (max-width: 1100px) {
  .admin-chat-faq-item { grid-template-columns: 80px 1fr 1fr; }
  .admin-chat-faq-item textarea, .admin-chat-faq-item > div { grid-column: 2 / -1; }
}
@media (max-width: 780px) {
  .admin-chat-tool > header { align-items: flex-start; flex-direction: column; }
  .admin-chat-head-actions { width: 100%; justify-content: space-between; }
  .admin-chat-layout { grid-template-columns: 1fr; }
  .admin-chat-layout > aside { border-right: 0; border-bottom: 1px solid #e3ebe7; }
  .admin-chat-list { max-height: 220px; }
  .admin-chat-messages { height: 330px; }
  .admin-chat-faq-item { grid-template-columns: 1fr; }
  .admin-chat-faq-item textarea, .admin-chat-faq-item > div { grid-column: auto; }
}