/* React island — DM и зональный чат (Chatscope).
 * Дизайн настраивается здесь и в public/chat-island/index.jsx (placeholder, цвета пузырей).
 * Вернуть «родной» инпут/❤️ можно позже, не трогая Centrifugo. */
#chat-mount.chat-mount-layer {
  display: none;
  flex: 1 1 auto;
  min-height: 0;
  height: 0;
  flex-direction: column;
  overflow: hidden;
  background: #0a0a0e;
  position: relative;
  z-index: 1;
}

#dm-panel.dm-layout-pending #chat-mount.chat-mount-layer,
#chat-zone-view.dm-layout-pending #chat-zone-mount.chat-mount-layer {
  visibility: hidden;
  opacity: 0;
}

#dm-panel:not(.dm-layout-pending) #chat-mount.chat-mount-layer {
  height: auto;
  visibility: visible;
  opacity: 1;
  transition: opacity 0.12s ease;
}

#chat-mount .cs-main-container {
  border: none;
  background: transparent !important;
}

#chat-mount .cs-chat-container {
  background: transparent !important;
}

#chat-mount .cs-message-list,
#chat-zone-mount .cs-message-list {
  background: rgba(10, 10, 14, 0.94) !important;
}

#chat-zone-mount.chat-mount-layer {
  display: none;
  flex: 1 1 auto;
  min-height: 0;
  height: 0;
  flex-direction: column;
  overflow: hidden;
  background: #0a0a0e;
  position: relative;
  z-index: 1;
}

#chat-zone-view:not(.dm-layout-pending) #chat-zone-mount.chat-mount-layer {
  height: auto;
}

#chat-mount .cs-message-input {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.93) !important;
}

#chat-mount .cs-message--incoming .cs-message__content {
  background: rgba(255, 255, 255, 0.1) !important;
  color: rgba(255, 255, 255, 0.93) !important;
}

#chat-mount .cs-message--outgoing .cs-message__content {
  background: linear-gradient(135deg, #ff6a00, #ff2e00) !important;
  color: #fff !important;
}