/* =====================================================================
   NEVER — исправления и чат (как в standart)
   Подключается последним (tpl/head.tpl), поэтому перекрывает старые правила.
   ===================================================================== */

/* ---------- Код и таблицы в сообщениях чата и форума: не рвать слова посередине ---------- */
.with_code table tr td {
  word-break: normal;
}

/* ---------- Общие заголовки блоков ---------- */
.block_card_header_left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

/* =====================================================================
   ЧАТ
   ===================================================================== */
.never_chat {
  padding: 16px 14px 14px;
}

#chat #drop_zone {
  position: relative;
  width: 100%;
  font-family: inherit;
}

#chat #drop_zone > #drop_mask {
  position: absolute;
  inset: 0;
  z-index: 7;
  display: none;
  margin: 0;
}

#chat #drop_zone.loader {
  background: none;
  opacity: .5;
}

#chat #drop_zone.hover,
#chat #drop_zone.error {
  display: block;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

#chat #drop_zone.hover #chat_messages,
#chat #drop_zone.error #chat_messages {
  height: 60vh;
}

#chat #drop_zone.hover:after,
#chat #drop_zone.error:after {
  position: absolute;
  inset: 0;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  border-radius: 14px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  text-align: center;
  outline: 2px dashed currentColor;
  outline-offset: -8px;
}

#chat #drop_zone.hover:after {
  content: "Отпустите изображение, чтобы отправить его в чат";
  background: rgba(23, 5, 31, .92);
  color: #ff4fb8;
}

#chat #drop_zone.error:after {
  content: "Не удалось загрузить файл";
  background: rgba(40, 6, 14, .92);
  color: #ff5c7a;
}

/* ---------- Лента сообщений ---------- */
#chat #chat_messages {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  height: 60vh;
  min-height: 320px;
  max-height: 640px;
  margin-top: 14px;
  padding-right: 4px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 79, 184, .45) transparent;
}

#chat #chat_messages::-webkit-scrollbar {
  width: 4px;
  height: 0;
  background: transparent;
}

#chat #chat_messages::-webkit-scrollbar-thumb {
  background: rgba(255, 79, 184, .45);
  border-radius: 4px;
}

#chat #chat_messages > .loader {
  margin: auto;
}

#chat #chat_messages .chat_message,
#chat #chat_messages .pin_chat_message {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  flex-shrink: 0;
  padding: 0;
  border: 0;
  overflow: visible;
}

#chat #chat_messages .pin_chat_message {
  padding: 10px;
  border-radius: 14px;
  background: rgba(255, 79, 184, .1);
  border: 1px solid rgba(255, 79, 184, .35);
}

/* аватар + рамка */
#chat #chat_messages .chat_message > a.chat_avatar,
#chat #chat_messages .pin_chat_message > a.chat_avatar {
  position: relative;
  display: block;
  float: none;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  margin: 0;
}

#chat #chat_messages .chat_avatar > img:first-child,
#chat #chat_messages .pin_chat_message .user_img {
  display: block;
  float: none;
  width: 38px;
  height: 38px;
  padding: 0;
  margin: 0;
  border-radius: 50%;
  object-fit: cover;
  background: #2a0b33;
}

#chat #chat_messages .chat_avatar .usersframechat {
  position: absolute;
  top: -5px;
  left: -4px !important;
  width: 46px !important;
  height: 47px !important;
  max-width: none;
  margin: 0 !important;
  border-radius: 0 !important;
  pointer-events: none;
}

/* тело сообщения */
#chat #chat_messages .chat_message .message,
#chat #chat_messages .pin_chat_message .message {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  float: none;
  margin: 0;
  overflow: visible;
  font-size: 13px;
  line-height: 1.4;
}

#chat #chat_messages .chat_message .message .info,
#chat #chat_messages .pin_chat_message .message .info {
  display: flex;
  align-items: center;
  gap: 6px;
  height: auto;
  min-height: 20px;
  margin: 0 0 4px;
  padding: 0 !important;
  line-height: 18px;
}

#chat #chat_messages .message .info .author {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1 1 auto;
  min-width: 0;
  float: none;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

#chat #chat_messages .message .info .author .author_login {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

#chat #chat_messages .message .info .author .chat_badges {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  margin: 0;
}

#chat #chat_messages .message .info .author .chat_badges img {
  width: 16px;
  height: 16px;
}

#chat #chat_messages .message .info .date {
  position: static;
  flex: 0 0 auto;
  float: none;
  width: auto;
  height: auto;
  font-size: 11px;
  font-weight: 400;
  line-height: 18px;
  color: #c9a9cc;
  background: none;
  right: auto;
}

#chat #chat_messages .message .info .pin_badge {
  color: #ff4fb8;
  font-size: 15px;
}

/* кнопки модерации */
#chat #chat_messages .chat_message_actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  opacity: .55;
  transition: opacity .15s ease;
}

#chat #chat_messages .chat_message:hover .chat_message_actions,
#chat #chat_messages .pin_chat_message:hover .chat_message_actions {
  opacity: 1;
}

@media (hover: none) {
  #chat #chat_messages .chat_message_actions {
    opacity: 1;
  }
}

#chat #chat_messages .chat_message_actions .edit_message,
#chat #chat_messages .chat_message_actions .dell_message,
#chat #chat_messages .chat_message_actions .pin_message {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  font-size: 13px;
  color: #ffffff;
  background: rgba(255, 79, 184, .2);
  cursor: pointer;
  transition: background .15s ease;
}

#chat #chat_messages .chat_message_actions .edit_message:hover,
#chat #chat_messages .chat_message_actions .pin_message:hover {
  background: #8c5cff;
}

#chat #chat_messages .chat_message_actions .dell_message:hover {
  background: #ff3b6b;
}

/* пузырь с текстом */
#chat #chat_messages .chat_message .message .with_code,
#chat #chat_messages .pin_chat_message .message .with_code {
  display: block;
  width: fit-content;
  max-width: 100%;
  padding: 8px 12px;
  border-radius: 4px 14px 14px 14px;
  border: 1px solid transparent;
  font-size: 13px;
  line-height: 1.45;
  color: #ffffff;
  word-break: normal;
  overflow-wrap: anywhere;
}

#chat #chat_messages .message .with_code img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

#chat #chat_messages .message .with_code img.g_smile {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 0;
  vertical-align: middle;
}

#chat #chat_messages .message .with_code a {
  color: #ff8fd0;
  text-decoration: underline;
}

#chat #chat_messages .message textarea {
  width: 100%;
  margin: 6px 0 0;
  min-height: 70px;
  border-radius: 10px;
  resize: vertical;
}

/* ---------- Поле ввода ---------- */
#chat .chat_input_group {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  top: 0;
  margin: 12px 0 0;
  position: relative;
}

#chat .chat_input_group .smile_input {
  position: relative;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
}

#chat .chat_input_group .smile_input input {
  width: 100%;
  height: 44px;
  margin: 0;
  padding: 0 38px 0 14px;
  line-height: normal;
  border-radius: 12px;
  font-size: 13px;
}

#chat .chat_input_group .smile_input #smile_btn {
  position: absolute;
  top: 50%;
  right: 12px;
  width: 20px;
  height: 20px;
  font-size: 18px;
  line-height: 20px;
  text-align: center;
  transform: translateY(-50%);
}

#chat .chat_input_group .chat_message_button {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  font-size: 19px;
  line-height: 1;
  color: #ffffff;
  cursor: pointer;
  outline: none;
}

#chat .chat_input_group button::before {
  content: none !important;
}

#chat .chat_auth_to_write {
  margin: 14px 0 0;
  padding: 12px;
  border-radius: 12px;
  background: rgba(255, 79, 184, .08);
  border: 1px dashed rgba(255, 79, 184, .35);
  text-align: center;
  font-size: 13px;
  color: #d9b8dc;
}

#chat .chat_auth_to_write a {
  color: #ff4fb8;
  font-weight: 700;
  cursor: pointer;
}

#passive {
  padding: 24px 0 8px;
  text-align: center;
}

#passive img {
  max-width: 110px;
  margin-bottom: 10px;
}

/* поповер смайлов */
.popover .popover-body > .smiles_box {
  width: 253px;
  max-width: 80vw;
}

/* =====================================================================
   ВЫРАВНИВАНИЕ БЛОКОВ
   ===================================================================== */

/* мониторинг: счётчик онлайна (0/0 показывается только пока нет данных) */
.info-line:empty::before {
  content: "0/0";
}

.servers_heading {
  align-items: stretch;
}

/* отступы между блоками центральной колонки одинаковые */
.center_block > .block + .block,
.center_block > .block.mt-2 {
  margin-top: 15px !important;
}

/* правая колонка: равные промежутки между баннером, кейсами и чатом */
.right_block_sticky > * + * {
  margin-top: 15px;
}

.right_block_sticky > #activity-rewards-banner:empty {
  display: none;
}

.right_block_sticky > #activity-rewards-banner:empty + * {
  margin-top: 0;
}

/* выпадающий список «Онлайн» в шапке не должен обрезаться
   (RGB-рамка ниже в mystyles.css ставит overflow: hidden всем блокам) */
.flex_online_block,
.flex_online_block_later {
  overflow: visible !important;
}

.header_right_menu {
  min-width: 0;
}

/* =====================================================================
   ОБЩИЕ ЭЛЕМЕНТЫ (страницы сайта и модулей modules_extra)
   Базовые стили GameCMS (primary/endeltrap/bootstray) синие —
   приводим их к палитре never.
   ===================================================================== */
:root {
  --never-accent: #ff4fb8;
  --never-accent-2: #ec29df;
  --never-violet: #7b2cff;
  --never-gradient: linear-gradient(135deg, #7b2cff 0%, #ec29df 55%, #ff72a8 100%);
  --never-panel: #220829;
  --never-inner: #2a0b33;
  --never-inner-2: rgba(97, 33, 89, .55);
  --never-border: rgba(236, 41, 223, .38);
  --never-border-strong: rgba(236, 41, 223, .72);
  --never-muted: #d9b8dc;
}

/* баннеры «Кейсы» / «Бонусы» в правой колонке: картинка передаётся через
   style="--card-img: url(...)", иначе её перекрывал фон темы с !important */
.block_open_cases {
  background:
    var(--card-img, none) right center / auto 100% no-repeat,
    linear-gradient(180deg, rgba(44, 13, 53, .96), rgba(23, 5, 31, .98)) !important;
}

/* иконка в заголовке страницы (toolbar) — у модулей была синей через style="" */
.toolbar__icon i,
.toolbar__icon .fa,
.toolbar__icon .bx {
  color: var(--never-accent) !important;
  font-size: 40px;
  line-height: 40px;
  text-shadow: 0 0 14px rgba(255, 79, 184, .55);
}

/* кнопки */
.btn-primary,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
  background: var(--never-gradient) !important;
  border-color: rgba(236, 41, 223, .76) !important;
  color: #ffffff !important;
  box-shadow: 0 0 14px rgba(236, 41, 223, .35);
}

.btn-primary:hover,
.btn-primary:focus {
  filter: brightness(1.1);
  box-shadow: 0 0 18px rgba(236, 41, 223, .5) !important;
}

.btn-default,
.btn-light,
.btn-outline-primary {
  background: var(--never-inner) !important;
  border: 1px solid var(--never-border) !important;
  color: #ffffff !important;
}

.btn-default:hover,
.btn-light:hover,
.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled).active {
  background: rgba(255, 79, 184, .18) !important;
  border-color: var(--never-accent) !important;
  color: #ffffff !important;
}

.btn-danger {
  background: linear-gradient(135deg, #b0124a 0%, #ff3b6b 100%) !important;
  border-color: rgba(255, 59, 107, .7) !important;
  color: #ffffff !important;
}

.btn:disabled,
.btn.disabled {
  opacity: .55;
}

/* боковое меню категорий/серверов (магазины, демо, правила, кейсы) */
.vertical-navigation {
  background: linear-gradient(180deg, rgba(44, 13, 53, .96), rgba(23, 5, 31, .98)) !important;
  border: 1px solid var(--never-border) !important;
  border-radius: 15px;
  overflow: hidden;
}

.vertical-navigation li {
  border-top-color: rgba(236, 41, 223, .16) !important;
}

.vertical-navigation li:first-child {
  border-top: 0;
}

.vertical-navigation li a {
  color: #ffffff;
}

.vertical-navigation li a:hover,
.vertical-navigation li.active a,
.vertical-navigation li a.active {
  background: linear-gradient(90deg, rgba(236, 41, 223, .35), rgba(123, 44, 255, .2)) !important;
  color: #ffffff !important;
}

/* служебные плашки */
.empty-element {
  padding: 18px;
  border-radius: 12px;
  background: rgba(255, 79, 184, .08);
  border: 1px dashed var(--never-border);
  color: var(--never-muted);
  text-align: center;
}

.block a:not(.btn):not(.header_btn):not([class*="never"]):not([class*="card"]):not(.chat_avatar):hover {
  color: var(--never-accent);
}

.text-primary {
  color: var(--never-accent) !important;
}

.bg-primary,
.badge-primary {
  background: var(--never-gradient) !important;
}

.progress {
  background: var(--never-inner);
}

.progress-bar {
  background: var(--never-gradient);
}

/* =====================================================================
   ВЕРХНЕЕ МЕНЮ (шапка)
   Раньше шапка оставалась серо-синей (#0c101a / #171b26) и не совпадала
   с фиолетово-розовыми блоками. Теперь она в той же палитре, что и левое меню.
   ===================================================================== */
.header_new {
  background:
    linear-gradient(180deg, rgba(44, 13, 53, .98) 0%, rgba(23, 5, 31, .97) 100%) !important;
  border-bottom: 1px solid rgba(236, 41, 223, .45) !important;
  box-shadow: 0 6px 26px rgba(236, 41, 223, .18), inset 0 -1px 0 rgba(255, 79, 184, .25) !important;
}

/* кнопки разделов */
.header_btn,
.header_btn_balance,
.avatar_miniprofile,
.dropdown_language .select > i {
  background: rgba(97, 33, 89, .3) !important;
  border: 1px solid rgba(236, 41, 223, .24) !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease !important;
}

.header_btn i,
.header_btn_balance i {
  color: #ff4fb8 !important;
  fill: #ff4fb8 !important;
  text-shadow: 0 0 8px rgba(255, 79, 184, .45);
  transition: color .2s ease;
}

.header_btn:hover,
.header_btn:focus-visible,
.header_btn_balance:hover,
.avatar_miniprofile:hover,
.miniprofile_menu.show-drd .avatar_miniprofile,
.dropdown_language .select > i:hover,
.dropdown_language.active .select > i {
  background: linear-gradient(135deg, rgba(123, 44, 255, .42) 0%, rgba(236, 41, 223, .42) 100%) !important;
  border-color: rgba(255, 79, 184, .85) !important;
  color: #ffffff !important;
  box-shadow: 0 0 16px rgba(236, 41, 223, .4) !important;
  opacity: 1 !important;
}

.header_btn:hover i,
.header_btn:focus-visible i,
.header_btn_balance:hover i {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* текущая страница (класс ставит скрипт в bottom.tpl) */
.header_btn.active,
.header_new .header_btn.active {
  background: linear-gradient(135deg, #7b2cff 0%, #ec29df 55%, #ff72a8 100%) !important;
  border-color: rgba(255, 114, 168, .9) !important;
  box-shadow: 0 0 18px rgba(236, 41, 223, .5) !important;
}

.header_btn.active i {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* кнопка «Пополнить» — главная кнопка шапки */
.header_btn_balance {
  background: linear-gradient(135deg, #7b2cff 0%, #ec29df 55%, #ff72a8 100%) !important;
  border-color: rgba(255, 114, 168, .8) !important;
  font-weight: 600 !important;
}

.header_btn_balance:hover {
  filter: brightness(1.1);
}

/* баланс, онлайн, язык — плашки в цвет блоков */
.header_balance_new,
.flex_online_block {
  background: linear-gradient(180deg, rgba(44, 13, 53, .96), rgba(23, 5, 31, .98)) !important;
  border: 1px solid rgba(236, 41, 223, .38) !important;
  border-radius: 12px !important;
  box-shadow: 0 0 14px rgba(236, 41, 223, .18) !important;
}

.header_balance_new_icon,
.arrow_users_top {
  background: linear-gradient(135deg, #7b2cff 0%, #ec29df 55%, #ff72a8 100%) !important;
  border: 0 !important;
  color: #ffffff !important;
  box-shadow: 0 0 12px rgba(236, 41, 223, .4) !important;
}

.dropdown_language .select > i {
  display: flex !important;
  align-items: center;
  justify-content: center;
  color: #ff4fb8 !important;
}

.dropdown_language .dropdown-menu_language {
  background: linear-gradient(180deg, #2c0d35, #17051f) !important;
  border: 1px solid rgba(236, 41, 223, .45) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .5), 0 0 16px rgba(236, 41, 223, .25) !important;
}

.dropdown_language .dropdown-menu_language li {
  color: #ffffff;
  border-radius: 8px;
}

.dropdown_language .dropdown-menu_language li:hover {
  background: rgba(255, 79, 184, .18) !important;
  color: #ffffff !important;
}

.avatar_miniprofile img {
  border: 2px solid rgba(255, 79, 184, .75) !important;
  box-shadow: 0 0 10px rgba(236, 41, 223, .45) !important;
}

.avatar_miniprofile svg path {
  stroke: #ff8fd0;
}

/* выбор языка (как в шаблоне Standart): кнопка «глобус + флаг + код», список с флагами.
   Список и флаги рисует js/lang-switch.js, основной язык — украинский */
.bsq-lang {
  position: relative;
  flex-shrink: 0;
  min-width: 46px;
  min-height: 42px;
}

.bsq-lang__btn {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  padding: 0 12px;
  border-radius: 10px;
  background: rgba(97, 33, 89, .3);
  border: 1px solid rgba(236, 41, 223, .24);
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.bsq-lang__btn:focus {
  outline: none;
}

.bsq-lang__btn:hover,
.bsq-lang__btn:focus-visible,
.bsq-lang.is-open .bsq-lang__btn {
  background: linear-gradient(135deg, rgba(123, 44, 255, .42) 0%, rgba(236, 41, 223, .42) 100%);
  border-color: rgba(255, 79, 184, .85);
  box-shadow: 0 0 16px rgba(236, 41, 223, .4);
}

.bsq-lang__globe {
  font-size: 18px;
  color: #ff4fb8;
}

.bsq-lang__flag {
  width: 26px;
  height: 18px;
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .15);
}

.bsq-lang__chev {
  font-size: 18px;
  transition: transform .2s ease;
}

.bsq-lang.is-open .bsq-lang__chev {
  transform: rotate(180deg);
}

.bsq-lang__menu {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 10600;
  width: 290px;
  max-height: 360px;
  overflow-y: auto;
  padding: 6px;
  border-radius: 14px;
  background: linear-gradient(180deg, #2c0d35, #17051f);
  border: 1px solid rgba(236, 41, 223, .45);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .6), 0 0 18px rgba(236, 41, 223, .25);
  scrollbar-width: thin;
  scrollbar-color: #ff4fb8 transparent;
}

.bsq-lang__menu::-webkit-scrollbar { width: 5px; }
.bsq-lang__menu::-webkit-scrollbar-thumb { background: #ff4fb8; border-radius: 4px; }

.bsq-lang.is-open .bsq-lang__menu {
  display: block;
}

.bsq-lang__item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 9px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #f3e6f5;
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  transition: background .15s ease;
}

.bsq-lang__item:focus {
  outline: none;
}

.bsq-lang__item img {
  flex-shrink: 0;
  width: 28px;
  height: 19px;
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .12);
}

.bsq-lang__item span {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.bsq-lang__item:hover,
.bsq-lang__item:focus-visible {
  background: rgba(255, 79, 184, .16);
}

.bsq-lang__item.is-active {
  background: linear-gradient(90deg, rgba(123, 44, 255, .5), rgba(236, 41, 223, .45));
  color: #ffffff;
}

.bsq-lang__main {
  flex-shrink: 0;
  padding: 1px 6px;
  border-radius: 6px;
  background: rgba(255, 79, 184, .2);
  font-size: 10px;
  font-weight: 700;
  color: #ff8fd0;
}

/* служебные элементы Google Переводчика */
#google_translate_element {
  display: none !important;
}

html[data-site-lang] body {
  top: 0 !important;
}

@media (max-width: 1250px) {
  .bsq-lang__btn > .bsq-lang__globe,
  .bsq-lang__btn > .bsq-lang__code {
    display: none;
  }
}

/* телефон: у кнопки только флаг, список — на всю ширину под шапкой */
@media (max-width: 991.98px) {
  .bsq-lang__btn {
    height: 42px;
    padding: 0 9px;
    gap: 4px;
  }

  .bsq-lang__btn > .bsq-lang__chev {
    display: none;
  }

  .bsq-lang__menu {
    position: fixed;
    top: 66px;
    left: 12px;
    right: 12px;
    width: auto;
    max-height: 60vh;
  }
}
/* выпадающий список «Онлайн».
   Раньше открывался только наведением мыши — по нажатию и на телефоне не показывался.
   Теперь открывается и по нажатию на кнопку (класс .show-online ставит скрипт в bottom.tpl) */
.online_prcr {
  background: linear-gradient(180deg, #2c0d35, #17051f) !important;
  border: 1px solid rgba(236, 41, 223, .45) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .5), 0 0 16px rgba(236, 41, 223, .25) !important;
  padding: 12px;
}

.online_pro .arrow_users_top {
  cursor: pointer;
}

.online_pro.show-online .online_prcr {
  display: block;
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
  z-index: 100;
}

.online_pro.show-online .arrow_users_top {
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .85), 0 0 16px rgba(236, 41, 223, .6) !important;
}

.online_prcr .right_now_online {
  background: rgba(255, 79, 184, .16);
  color: #ff8fd0;
}

.online_prcr .online_scroll {
  gap: 6px;
  max-height: 260px;
}

/* логотип — без «тусклости» при наведении, лёгкое свечение */
.header_logo:hover {
  opacity: 1 !important;
  filter: drop-shadow(0 0 8px rgba(255, 79, 184, .55));
}

/* =====================================================================
   НОУТБУКИ И ПЛАНШЕТЫ В АЛЬБОМЕ (992–1399px)
   Колонки 18% / 64% / 18% на этих ширинах слишком узкие: чат сжимался
   до ~140px, а кнопки шапки наезжали на блок онлайна и баланс.
   ===================================================================== */
@media (min-width: 992px) {
  .right_block {
    min-width: 270px;
  }

  .center_block {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
  }

  /* «Сервера» тянется, «На серверах: N/M» занимает ровно сколько нужно */
  .servers_heading .w-80 {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }

  .servers_heading .w-20 {
    flex: 0 0 auto;
    width: auto;
    min-width: 170px;
  }
}

.header_balance_new_text,
.header_btn {
  white-space: nowrap;
}

@media (min-width: 992px) and (max-width: 1299.98px) {
  .left_block {
    flex: 0 0 200px;
    width: 200px;
  }
}

@media (min-width: 992px) and (max-width: 1399.98px) {
  .header_btns {
    margin-left: 15px;
    gap: 5px;
  }

  .header_btn {
    padding: 10px 12px;
  }

  .header_btn i {
    font-size: 16px;
  }

  .header_btn span {
    display: none;
  }
}

/* =====================================================================
   ПРАВАЯ КОЛОНКА НА ПК: кейсы + чат всегда помещаются в экран,
   поле ввода и кнопка отправки всегда видны (колонка «липкая»).
   ===================================================================== */
@media (min-width: 992px) {
  .right_block_sticky {
    display: flex;
    flex-direction: column;
    /* 196px = шапка + бегущая строка + отступ: поле ввода видно сразу при открытии страницы */
    max-height: calc(100vh - 196px);
    min-height: 520px;
  }

  .right_block_sticky > * {
    flex-shrink: 0;
  }

  .right_block_sticky > .never_chat {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
  }

  .never_chat #chat,
  .never_chat #chat > form,
  .never_chat #chat #drop_zone {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
  }

  .never_chat #chat .chat_input_group,
  .never_chat #chat .chat_auth_to_write {
    flex-shrink: 0;
  }

  #chat #chat_messages {
    flex: 1 1 auto;
    height: auto;
    min-height: 220px;
    max-height: none;
  }

  #chat #drop_zone.hover #chat_messages,
  #chat #drop_zone.error #chat_messages {
    height: auto;
  }
}

/* =====================================================================
   МОБИЛЬНАЯ ВЕРСИЯ
   ===================================================================== */
@media (max-width: 991.98px) {
  .header_logo {
    min-width: 0;
    flex-shrink: 1;
  }

  .header_logo img {
    height: 44px;
    max-width: 160px;
    object-fit: contain;
  }

  .header_right_menu {
    gap: 8px;
    flex-shrink: 0;
  }
  #chat #chat_messages {
    height: 55vh;
    min-height: 300px;
  }

  .mobile-menu-bottom-item {
    flex: 1 1 0;
    min-width: 0;
    padding: 10px 2px;
  }

  /* нижнее меню телефона — в цвет шапки */
  .mobile-menu-bottom {
    background: linear-gradient(0deg, rgba(23, 5, 31, .99), rgba(44, 13, 53, .97)) !important;
    border-top: 1px solid rgba(236, 41, 223, .45) !important;
    box-shadow: 0 -6px 22px rgba(236, 41, 223, .18);
  }

  .mobile-menu-bottom-item {
    color: #d9b8dc !important;
  }

  .mobile-menu-bottom-item i,
  .mobile-menu-bottom-item span {
    color: inherit !important;
  }

  .mobile-menu-bottom-item.active,
  .mobile-menu-bottom-item:hover {
    color: #ff4fb8 !important;
  }

  .mobile-menu-bottom-item span {
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 11px;
  }
}

@media (max-width: 480px) {
  /* на узких экранах в шапке оставляем только кнопку списка онлайна */
  .flex_online_block .user_online_block {
    display: none;
  }
}