:root,
body,
html,
#matrixchat,
.mx_MatrixChat,
.mx_LoggedInView {
  --neco-bg: #0b1118;
  --neco-bg-2: #101722;
  --neco-bg-3: #121b26;
  --neco-border: rgba(160, 180, 210, 0.14);
  --neco-border-2: rgba(160, 180, 210, 0.10);
  --neco-text: #eaf0f7;
  --neco-text-2: #9fb0c8;
  --neco-accent: #5ec8ff;
}

html,
body,
#matrixchat,
.mx_MatrixChat,
.mx_LoggedInView {
  background: linear-gradient(180deg, #060913, #0b1118 45%, #101722) !important;
  color: var(--neco-text) !important;
}

/* базовые панели */
.mx_SpacePanel,
.mx_LeftPanel,
.mx_RoomView,
.mx_RightPanel,
.mx_SearchBox,
.mx_SearchBox_container,
.mx_SearchBar,
.mx_RoomHeader,
.mx_PinnedMessagesBar,
.mx_PinnedMessagesBar_message,
.mx_PinnedEventTile,
.mx_RoomPinnedHeader,
.mx_ReadPinnedMessagesButton,
.mx_MessageComposer,
.mx_BasicMessageComposer,
.mx_SendMessageComposer,
.mx_EditMessageComposer,
.mx_ReplyPreview,
.mx_Dialog,
.mx_ContextMenu,
.mx_UserMenu_contextMenu,
.mx_QuickSettingsButton_menu,
.mx_BaseCard,
.mx_RoomSummaryCard,
.mx_ThreadPanel {
  background: var(--neco-bg-2) !important;
  border: 1px solid var(--neco-border) !important;
  box-shadow: none !important;
  color: var(--neco-text) !important;
}

/* радиусы без лома верстки */
.mx_LeftPanel,
.mx_RoomView,
.mx_RightPanel {
  border-radius: 24px !important;
}

.mx_SearchBox,
.mx_SearchBox_container,
.mx_SearchBar,
.mx_RoomHeader,
.mx_PinnedMessagesBar,
.mx_MessageComposer,
.mx_BasicMessageComposer,
.mx_SendMessageComposer,
.mx_EditMessageComposer,
.mx_ReplyPreview,
.mx_Dialog,
.mx_ContextMenu,
.mx_UserMenu_contextMenu,
.mx_QuickSettingsButton_menu,
.mx_BaseCard,
.mx_RoomSummaryCard,
.mx_ThreadPanel,
.mx_RoomTile,
.mx_EntityTile,
.mx_SpaceButton,
.mx_SpaceButton_home {
  border-radius: 18px !important;
}

/* левая самая панель */
.mx_SpacePanel,
.mx_SpacePanel .mx_AutoHideScrollbar,
.mx_SpacePanel .mx_AutoHideScrollbar_offset,
.mx_SpacePanel .mx_AutoHideScrollbar_wrapper {
  background: #0b1118 !important;
  border: none !important;
  box-shadow: none !important;
}

/* кнопки слева */
.mx_SpaceButton,
.mx_SpaceButton_home,
.mx_SpacePanel .mx_AccessibleButton {
  background: transparent !important;
  border: 1px solid var(--neco-border-2) !important;
  box-shadow: none !important;
  outline: none !important;
}

.mx_SpaceButton:hover,
.mx_SpaceButton_home:hover,
.mx_SpacePanel .mx_AccessibleButton:hover {
  background: rgba(255,255,255,0.04) !important;
}

.mx_SpaceButton_active,
.mx_SpaceButton_selected,
.mx_SpacePanel .mx_AccessibleButton[aria-current="page"] {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid var(--neco-border) !important;
  box-shadow: none !important;
}

/* убить белое кольцо у домика */
.mx_SpaceButton::before,
.mx_SpaceButton::after,
.mx_SpaceButton_home::before,
.mx_SpaceButton_home::after,
.mx_SpacePanel .mx_AccessibleButton::before,
.mx_SpacePanel .mx_AccessibleButton::after,
.mx_SpaceButton > div::before,
.mx_SpaceButton > div::after,
.mx_SpaceButton_home > div::before,
.mx_SpaceButton_home > div::after {
  content: none !important;
  display: none !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  background: transparent !important;
}

/* список комнат */
.mx_LeftPanel,
.mx_LeftPanel_wrapper,
.mx_LeftPanel_roomListContainer,
.mx_RoomList,
.mx_RoomSublist,
.mx_RoomSublist_tiles,
.mx_LeftPanel_stickyHeaders {
  background: var(--neco-bg) !important;
}

.mx_RoomTile,
.mx_EntityTile {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--neco-text) !important;
}

.mx_RoomTile:hover,
.mx_EntityTile:hover {
  background: rgba(255,255,255,0.04) !important;
  border-color: var(--neco-border-2) !important;
}

.mx_RoomTile_selected,
.mx_RoomTile_current,
.mx_RoomTile.mx_RoomTile_selected {
  background: rgba(255,255,255,0.08) !important;
  border-color: var(--neco-border) !important;
  box-shadow: none !important;
}

.mx_RoomTile_name,
.mx_RoomHeader_name,
.mx_EventTile_content,
.mx_MTextBody,
.mx_Dialog_title,
.mx_BaseCard {
  color: var(--neco-text) !important;
}

.mx_RoomTile_preview,
.mx_RoomHeader_subtitle,
.mx_MessageTimestamp,
.mx_EventTile_senderDetails,
.mx_PinnedMessagesBar {
  color: var(--neco-text-2) !important;
}

/* закреп сверху */
.mx_PinnedMessagesBar,
.mx_PinnedMessagesBar_message,
.mx_PinnedEventTile,
.mx_PinnedEventsBar,
.mx_RoomPinnedHeader,
.mx_ReadPinnedMessagesButton,
.mx_RoomView_auxPanel {
  background: var(--neco-bg-3) !important;
  color: var(--neco-text) !important;
}

/* НЕ ломаем таймлайн */
.mx_EventTile,
.mx_EventTile_line,
.mx_EventTile_content,
.mx_MTextBody,
.mx_MNoticeBody,
.mx_ReactionsRow,
.mx_ReplyPreview,
.mx_EventTile_relation {
  position: static !important;
  transform: none !important;
  min-height: 0 !important;
  max-height: none !important;
  box-sizing: border-box !important;
}

.mx_EventTile,
.mx_EventTile_line {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* вложения / файловые карточки */
.mx_MFileBody,
.mx_FileBody,
.mx_EventTile_relation {
  background: #121b26 !important;
  border: 1px solid var(--neco-border-2) !important;
  border-radius: 14px !important;
}

/* КОМПОЗЕР: делаем компактным */
.mx_MessageComposer_wrapper {
  padding-top: 6px !important;
  margin-top: 0 !important;
}

.mx_MessageComposer,
.mx_BasicMessageComposer,
.mx_SendMessageComposer,
.mx_EditMessageComposer {
  min-height: 0 !important;
  max-height: none !important;
  padding: 6px 10px !important;
}

.mx_BasicMessageComposer_input,
.mx_BasicMessageComposer textarea,
.mx_SendMessageComposer textarea,
.mx_EditMessageComposer textarea,
.mx_MessageComposer textarea {
  min-height: 22px !important;
  max-height: 120px !important;
  line-height: 1.35 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* кнопки в композере */
.mx_MessageComposer button,
.mx_BasicMessageComposer button,
.mx_SendMessageComposer button,
.mx_EditMessageComposer button {
  min-height: 34px !important;
  min-width: 34px !important;
  border-radius: 14px !important;
}

/* поиск и пилюли */
.mx_SearchBox,
.mx_SearchBox_container,
.mx_SearchBar,
.mx_FilterDropdown,
.mx_RoomList_header .mx_AccessibleButton,
.mx_RoomSublist_header .mx_AccessibleButton {
  background: #111923 !important;
  border: 1px solid var(--neco-border-2) !important;
}

/* primary buttons */
.mx_AccessibleButton_kind_primary,
.mx_Login_submit,
.mx_Dialog_primary,
.mx_FormButton_primary {
  background: linear-gradient(180deg, #79ddff, #56b7f1) !important;
  color: #06121c !important;
  border: none !important;
  box-shadow: none !important;
}

/* mobile */
@media (max-width: 768px) {
  .mx_LeftPanel,
  .mx_RoomView,
  .mx_RightPanel {
    border-radius: 0 !important;
    margin: 0 !important;
  }

  .mx_MessageComposer,
  .mx_BasicMessageComposer,
  .mx_SendMessageComposer,
  .mx_EditMessageComposer {
    border-radius: 16px !important;
  }

  .mx_MessageComposer textarea,
  .mx_BasicMessageComposer textarea,
  .mx_SendMessageComposer textarea,
  .mx_EditMessageComposer textarea {
    max-height: 96px !important;
  }
}