@font-face {
  font-family: "layui-chat-icons";
  src: url("/static/vendor/layui-v2.13.9/layui/font/iconfont.woff2?v=293") format("woff2"),
       url("/static/vendor/layui-v2.13.9/layui/font/iconfont.woff?v=293") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* Scoped chat composer: visual-only upgrade; no event or data-flow changes. */
body.pages-chat-message .input-box.chat-input-modern {
  min-height: 64px !important;
  padding: 9px 12px 10px !important;
  gap: 8px !important;
  align-items: center !important;
  background: rgba(255, 255, 255, 0.98) !important;
  border-top: 1px solid #e6ebf2 !important;
  box-shadow: 0 -8px 24px rgba(32, 50, 76, 0.06) !important;
  backdrop-filter: blur(12px);
}

body.pages-chat-message .input-box.chat-input-modern .textbox {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 44px !important;
  padding: 4px 14px !important;
  border: 1px solid #dbe3ed !important;
  border-radius: 23px !important;
  background: #f7f9fc !important;
  box-shadow: inset 0 1px 2px rgba(37, 55, 79, 0.03), 0 3px 12px rgba(37, 55, 79, 0.05) !important;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease !important;
}

body.pages-chat-message .input-box.chat-input-modern .textbox:focus-within {
  border-color: #82aff7 !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(52, 127, 240, 0.1), 0 5px 16px rgba(37, 91, 170, 0.08) !important;
}

body.pages-chat-message .input-box.chat-input-modern .text-mode,
body.pages-chat-message .input-box.chat-input-modern .text-mode .box {
  min-height: 34px !important;
}

body.pages-chat-message .input-box.chat-input-modern textarea {
  min-height: 30px !important;
  padding: 5px 0 !important;
  overflow: hidden !important;
  resize: none !important;
  color: #222b38 !important;
  font-size: 15px !important;
  line-height: 20px !important;
}

body.pages-chat-message .input-box.chat-input-modern .uni-textarea-line,
body.pages-chat-message .input-box.chat-input-modern .uni-textarea-compute {
  scrollbar-width: none !important;
}

body.pages-chat-message .input-box.chat-input-modern uni-textarea,
body.pages-chat-message .input-box.chat-input-modern .uni-textarea-wrapper {
  width: 100% !important;
  overflow: hidden !important;
  scrollbar-width: none !important;
}

body.pages-chat-message .input-box.chat-input-modern .uni-textarea-line::-webkit-scrollbar,
body.pages-chat-message .input-box.chat-input-modern .uni-textarea-compute::-webkit-scrollbar,
body.pages-chat-message .input-box.chat-input-modern uni-textarea::-webkit-scrollbar,
body.pages-chat-message .input-box.chat-input-modern textarea::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body.pages-chat-message .input-box.chat-input-modern .textarea-placeholder {
  color: #9aa5b3 !important;
  font-size: 14px !important;
}

body.pages-chat-message .input-box.chat-input-modern .voice-switch,
body.pages-chat-message .input-box.chat-input-modern .input-action,
body.pages-chat-message .input-box.chat-input-modern .input-more {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border: 1px solid #dde5ee !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: #35445a !important;
  box-shadow: 0 3px 10px rgba(35, 54, 80, 0.08) !important;
  transition: transform 0.15s ease, border-color 0.15s ease, color 0.15s ease, background 0.15s ease !important;
}

body.pages-chat-message .input-box.chat-input-modern .voice-switch:active,
body.pages-chat-message .input-box.chat-input-modern .input-action:active,
body.pages-chat-message .input-box.chat-input-modern .input-more:active {
  transform: scale(0.94);
  border-color: #a9c7f5 !important;
  background: #eef5ff !important;
  color: #347ff0 !important;
}

body.pages-chat-message .voice-switch .yuyin,
body.pages-chat-message .input-emoji .biaoqing,
body.pages-chat-message .input-more .add {
  width: 24px !important;
  height: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: none !important;
  font-size: 0 !important;
}

body.pages-chat-message .voice-switch .yuyin::before,
body.pages-chat-message .input-emoji .biaoqing::before,
body.pages-chat-message .input-more .add::before {
  font-family: "layui-chat-icons" !important;
  font-style: normal !important;
  font-size: 23px !important;
  line-height: 1 !important;
  -webkit-font-smoothing: antialiased;
}

body.pages-chat-message .voice-switch .yuyin::before { content: "\e688" !important; }
body.pages-chat-message .input-emoji .biaoqing::before { content: "\e60c" !important; }
body.pages-chat-message .input-more .add::before { content: "\e608" !important; }

body.pages-chat-message .input-box.chat-input-modern .send:not(.hidden) {
  min-width: 62px !important;
  height: 42px !important;
  padding: 0 16px !important;
  border-radius: 21px !important;
  background: linear-gradient(135deg, #438cf7, #2f72e7) !important;
  box-shadow: 0 6px 14px rgba(47, 114, 231, 0.24) !important;
}

/* Layui icon system applied only to the attachment panel. */
body.pages-chat-message .more-layer {
  height: auto !important;
  padding: 16px 14px 24px !important;
  border-top: 1px solid #e8edf3 !important;
  background: linear-gradient(180deg, #fbfcfe 0%, #f4f7fb 100%) !important;
  box-shadow: 0 -8px 24px rgba(32, 50, 76, 0.05) !important;
}

body.pages-chat-message .more-layer .list {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 17px 8px !important;
  padding: 0 !important;
}

body.pages-chat-message .more-layer .box {
  width: 100% !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  color: #465366 !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

body.pages-chat-message .more-layer .tool-icon.feature-symbol {
  width: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid #e1e7ef !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  background-image: none !important;
  box-shadow: 0 5px 14px rgba(35, 54, 80, 0.08) !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease !important;
}

body.pages-chat-message .more-layer .box:active .tool-icon.feature-symbol {
  transform: translateY(1px) scale(0.95);
  border-color: #b9cff0 !important;
  box-shadow: 0 2px 7px rgba(35, 54, 80, 0.08) !important;
}

body.pages-chat-message .more-layer .tool-icon.feature-symbol::before {
  font-family: "layui-chat-icons" !important;
  font-style: normal !important;
  font-size: 25px !important;
  line-height: 1 !important;
  -webkit-font-smoothing: antialiased;
}

body.pages-chat-message .tool-album::before { content: "\e60d" !important; color: #4f7fe8 !important; }
body.pages-chat-message .tool-camera::before { content: "\e660" !important; color: #4f7fe8 !important; }
body.pages-chat-message .tool-redpacket::before { content: "\e659" !important; color: #ff5d66 !important; }
body.pages-chat-message .tool-transfer::before { content: "\e691" !important; color: #4c769b !important; }
body.pages-chat-message .tool-phone::before { content: "\e6dc" !important; color: #38a879 !important; }
body.pages-chat-message .tool-video::before { content: "\e6ed" !important; color: #7a6ee6 !important; }
body.pages-chat-message .tool-file::before { content: "\e621" !important; color: #596b82 !important; }
body.pages-chat-message .tool-gift::before { content: "\e627" !important; color: #f39b3d !important; }

@media (max-width: 390px) {
  body.pages-chat-message .input-box.chat-input-modern {
    padding-left: 9px !important;
    padding-right: 9px !important;
    gap: 6px !important;
  }

  body.pages-chat-message .input-box.chat-input-modern .voice-switch,
  body.pages-chat-message .input-box.chat-input-modern .input-action,
  body.pages-chat-message .input-box.chat-input-modern .input-more {
    width: 39px !important;
    height: 39px !important;
    min-width: 39px !important;
  }

  body.pages-chat-message .more-layer .tool-icon.feature-symbol {
    width: 48px !important;
    height: 48px !important;
    border-radius: 15px !important;
  }
}