/*.active {*/
/*    background: #ffffff12;*/
/*}*/

/* Цвет выделения ЛК: переопределение фиолетового на золотой #eac485 */
:root, :root.dark, .dark, html, html.dark {
	--primary: 35, 89, 157 !important;
}
/* Тёмный фон страницы (убирает белую вспышку при загрузке/переходе) */
html, body {
	background-color: #1b253b !important;
}

/* --- Все поля input при фокусе: без box-shadow, border-color как на скрине (#C8A870), transition 0.3s --- */
.form-input,
.layout-wrapper input:not([type=hidden]):not([type=range]):not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=image]),
.layout-wrapper textarea {
	transition: border-color 0.3s, box-shadow 0.3s;
}
.form-input:focus,
.layout-wrapper input:not([type=hidden]):not([type=range]):not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=image]):focus,
.layout-wrapper textarea:focus {
	box-shadow: none !important;
	border-color: #C8A870;
}
.dark .form-input:focus,
.dark .layout-wrapper input:not([type=hidden]):not([type=range]):not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=image]):focus,
.dark .layout-wrapper textarea:focus {
	border-color: #C8A870;
}

/* --- Титулы страниц ЛК (донат, рейтинг и т.д.): Ice kingdom Cyrillic Bold, uppercase, цвет #eac485 --- */
.panel-page-title,
.donate-page-title {
	font-family: "Ice kingdom Cyrillic Bold", "Times New Roman", Times, serif;
	text-transform: uppercase;
	color: #eac485;
}
.panel-page-title *,
.donate-page-title * {
	font-family: inherit;
	text-transform: inherit;
	color: inherit;
}

/* --- Верхняя панель (Контакты, Промокоды и т.д.) — фиксированная, контент прокручивается под неё --- */
.layout-wrapper .layout-page .layout-navigation {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 50;
    left: 0;
}
@media (min-width: 1024px) {
    .layout-wrapper .layout-page .layout-navigation {
        left: 4.75rem;
    }
    /* При ширине 1024–1279px сайдбар = 4.5rem; шапку прижимаем к нему, без зазора */
    .layout-wrapper:not(.layout-wrapper-short) .layout-page .layout-navigation {
        left: 5.75rem;
    }
}
@media (min-width: 1024px) and (max-width: 1279px) {
    .layout-wrapper:not(.layout-wrapper-short) .layout-page .layout-navigation {
        left: 4.5rem;
    }
	.layout-menu .menu-heading {
		gap: 0rem;
		padding: 6px 0 18px 0;
	}
}
@media (min-width: 1280px) {
    .layout-wrapper:not(.layout-wrapper-short) .layout-page .layout-navigation {
        left: 15rem;
    }
}
.layout-wrapper .layout-page .layout-content {
    padding-top: 3.5rem;
	padding-top: 5.7rem;
}

/* --- Кнопка «Свернуть меню» в верхней панели (перед Контакты), скрыта при ширине < 1240px --- */
.header-collapse-menu-btn {
    display: none;
    width: 2.5rem;
    height: 2.5rem;
    min-width: 2.7rem;
    padding: 0;
    border-radius: 2px;
}
.header-collapse-menu-btn:focus {
	box-shadow: none;
}
@media (min-width: 1280px) {
    .header-collapse-menu-btn {
        display: inline-flex;
    }
}
@media (max-width: 1279px) {
    .header-collapse-menu-btn {
        display: none !important;
    }
}

@media (min-width: 1280px) {
    .product-store {
        grid-template-columns: repeat(4, 1fr)!important;
    }
}
.text-2xl {
    font-size: 30px!important;
}

:is(.dark .btn-ava) {
    background: linear-gradient(135deg, #303d5e, #111e30) !important;
    box-shadow: none !important;
}
:is(.dark .bg-ava) {
    background: #242239!important;
    background: #1b253b!important;
	border: 1px solid #415172;
}
/* Кнопка пользователя в шапке — без тени, с бордером как у RU/Выход; при аватаре фон = картинка */
.btn-ava {
    box-shadow: none !important;
}
/* Обёртка карточки пользователя — на всю высоту блока шапки */
.nav-user-card-wrapper {
    align-self: stretch;
    display: flex;
	border-left: 1px solid #415172;
    border-right: 1px solid #415172;
    margin: -16px 0 -17px 0;
}
/* Карточка пользователя в шапке: кнопка на всю высоту, бордеры слева/справа, фон чуть отличается */
.nav-user-card-btn {
    height: 100%;
    min-height: 100%;
    padding: 0 1rem;
    border: none;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(0, 0, 0, 0.12);
    box-shadow: none !important;
    cursor: pointer;
    transition: background 0.2s ease;
}
.nav-user-card-btn:hover {
    background: rgba(0, 0, 0, 0.2);
}
.layout-navigation .nav-user-card-btn__avatar {
    width: 2.5rem;
    height: 2.5rem;
    min-width: 2.5rem;
    min-height: 2.5rem;
    object-fit: cover;
}
.layout-navigation .nav-user-card-btn__avatar--letter {
    background: linear-gradient(135deg, #303d5e, #111e30);
    color: #e4e6eb;
    font-size: 1rem;
    font-weight: 600;
}
.layout-navigation .nav-user-card-btn__name {
    color: #fff;
    font-size: 0.9375rem;
    line-height: 1.3;
}
.layout-navigation .nav-user-card-btn__email {
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.8125rem;
    line-height: 1.25;
}
.dark .layout-navigation .nav-user-card-btn {
    border-left-color: rgba(255, 255, 255, 0.06);
    border-right-color: rgba(255, 255, 255, 0.06);
    background: rgba(0, 0, 0, 0.25);
}
.dark .layout-navigation .nav-user-card-btn:hover {
    background: rgba(0, 0, 0, 0.35);
}
.dark .layout-navigation .nav-user-card-btn__name {
    color: #e4e6eb;
}
.dark .layout-navigation .nav-user-card-btn__email {
    color: rgba(228, 230, 235, 0.75);
}
/* Кнопка пользователя (круглая, старая) — оставляем для совместимости, если где-то ещё используется */
.layout-navigation .btn-user:not(.nav-user-card-btn) {
    border: 1px solid rgba(65, 81, 114, 0.9);
    box-shadow: none !important;
    overflow: hidden;
    position: relative;
    margin-right: 2px;
}
.layout-navigation .btn-user:not(.nav-user-card-btn):hover {
    box-shadow: 0 0 12px 2px rgba(255, 255, 255, 0.25) !important;
}
.dark .layout-navigation .btn-user:not(.nav-user-card-btn) .btn-ava:not(.btn-ava--img) {
    background: linear-gradient(135deg, #303d5e, #111e30) !important;
}
.layout-navigation .btn-user .btn-ava {
    width: 2.5rem;
    height: 2.5rem;
    min-width: 2.5rem;
    min-height: 2.5rem;
}
.text-xs1 {
    font-size: 14px!important;;
}
.bgs-ava:hover {
    background: rgba(0, 0, 0, 0.04) !important;
}
:is(.dark .bgs-ava:hover) {
    background: #333057!important;
    background: #303c57!important;
}
.scl__item > img {
    margin-top: 6px;
    width: 40px;
    height: 40px;
}
.scl__item{
    min-width: 50px;
    padding: 0 5px;
}
/* В мини-меню селектор сервера не показываем */
._is-minimized .select-server {
    display: none !important;
}
._is-minimized .status-s {
    display: none!important;
}
._is-minimized .status-mini {
    display: block!important;
}
._is-minimized .divider {
    display: none!important;
}
/* Только элемент с классом closclos скрывать в мини-меню */
.layout-menu._is-minimized .closclos {
    display: none !important;
}

/* При раскрытом меню — селект на полную ширину */
.layout-menu:not(._is-minimized) .select-server {
    overflow: visible;
}
.layout-menu:not(._is-minimized) .select-server > div {
    min-width: 200px;
    overflow: visible;
}

/* Подсказки сайдбара при свёрнутом меню — ближе к кнопкам */
body:has(.layout-wrapper-short) .tippy-box[data-placement="right"] {
    margin-left: -22px;
}
/* Тултип от кружка сервера — отступ как у пунктов меню, не заходить на иконку */
body:has(.layout-wrapper-short) .tippy-box[data-placement="right"].server-item-tooltip {
    margin-left: 48px !important;
}

/* --- Мини-серверы (кружки): активный 100% размер и видимость, остальные 90%, оффлайн — свой цвет заливки, ховер --- */
.layout-menu #server-info .status-mini-item {
    opacity: 0.7;
    transform: scale(0.9);
    transition: opacity 0.2s ease, filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.layout-menu #server-info .status-mini-item.status-mini-item--active {
    opacity: 1;
    transform: scale(1);
}
/* Оффлайн-серверы — заливка другим цветом (серый/приглушённый) */
.layout-menu #server-info .status-mini-item.status-mini-item--offline .radial-progress,
.layout-menu #server-info .status-mini-item.status-mini-item--offline [class*="radial-progress"] {
    color: #64748b;
}
.layout-menu #server-info .status-mini-item.status-mini-item--offline .radial-progress::before,
.layout-menu #server-info .status-mini-item.status-mini-item--offline [class*="radial-progress"]::before {
    background: radial-gradient(farthest-side, #64748b 98%, rgba(0,0,0,0)) top/var(--thickness, 4px) var(--thickness, 4px) no-repeat, conic-gradient(#64748b calc(var(--value) * 1%), #0000 0) !important;
    -webkit-mask: radial-gradient(farthest-side, rgba(0,0,0,0) calc(99% - var(--thickness, 4px)), #000 calc(100% - var(--thickness, 4px)));
    mask: radial-gradient(farthest-side, rgba(0,0,0,0) calc(99% - var(--thickness, 4px)), #000 calc(100% - var(--thickness, 4px)));
}
.layout-menu #server-info .status-mini-item.status-mini-item--offline .radial-progress::after,
.layout-menu #server-info .status-mini-item.status-mini-item--offline [class*="radial-progress"]::after {
    background-color: #64748b !important;
}
.layout-menu #server-info .status-mini-item.status-mini-item--offline {
    filter: brightness(0.95);
}
.layout-menu #server-info .status-mini-item.status-mini-item--offline.status-mini-item--active {
    opacity: 1;
    transform: scale(1);
    filter: brightness(1);
}
.layout-menu #server-info .status-mini-item:hover {
    opacity: 1;
    filter: brightness(1.1);
    transform: scale(1.05);
}
.layout-menu #server-info .status-mini-item.status-mini-item--active:hover {
    transform: scale(1.05);
}
.layout-menu #server-info .status-mini-item.status-mini-item--offline:hover {
    filter: brightness(1.05);
}

.ratting-badge {
    background-color: #222;
    color: #fff;
    box-shadow: 0 0 5px -2px;
}
:is(.dark .ratting-badge){
    background-color: #222;
    color: #fff;
    box-shadow: 0 0 5px -2px;
    font-family: f2;
}
.ratting-block-top {
    /* box-shadow: 0 0 7px -3px; */
}
:is(.dark .ratting-block-top){
    /* box-shadow: 0 0 7px -3px; */
}
.toast-success{
    background: #1d4144 !important;
    background: #38896f !important;
    color: #fff!important;
    box-shadow: 0 0 5px -2px #ffffff !important;
}
.toast-error{
    background: #401313!important;
    background: #a75050!important;
    color: #fff!important;
    box-shadow: 0 0 5px -2px #ffffff !important;
}

/* --- Логотип в сайдбаре: в мини-режиме показывать только мини-логотип --- */
/* 1) Когда меню свёрнуто по кнопке (класс _is-minimized) */
.layout-menu._is-minimized .menu-heading-logo-inner #logo-lk,
.layout-menu._is-minimized .menu-heading-logo #logo-lk {
    display: none !important;
}
.layout-menu._is-minimized .menu-heading-logo-inner .logo-lk-mini-link,
.layout-menu._is-minimized .menu-heading-logo .logo-lk-mini-link {
    display: flex !important;
}
.layout-menu._is-minimized .menu-heading-logo-inner {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
}
.layout-menu._is-minimized .menu-heading-logo-inner .logo-lk-mini-link {
    margin-left: -18px;
    margin-bottom: -5px;
}

/* 2) Когда окно сужено (1024px–1279px): сайдбар уже узкий без _is-minimized — тоже показываем мини-логотип */
@media (min-width: 1024px) and (max-width: 1279px) {
    .layout-menu .menu-heading-logo-inner #logo-lk,
    .layout-menu .menu-heading-logo #logo-lk {
        display: none !important;
    }
    .layout-menu .menu-heading-logo-inner .logo-lk-mini-link,
    .layout-menu .menu-heading-logo .logo-lk-mini-link {
        display: flex !important;
    }
    .layout-menu .menu-heading-logo-inner {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 100% !important;
    }
    .layout-menu .menu-heading-logo-inner .logo-lk-mini-link {
        margin-left: -18px;
        margin-bottom: -5px;
    }
}

/* --- Мобильная версия (< 1024px): без фона у сайдбара, шапка под menu-heading, открытое меню под шапкой --- */
@media (max-width: 1023px) {
    .layout-menu {
        background-color: transparent !important;
    }
    .layout-wrapper .layout-page .layout-navigation {
        top: 4.5rem;
    }
    .layout-menu .menu._is-opened {
        position: fixed !important;
        top: 9.21rem !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        z-index: 45;
		padding: 0.5rem 0 10rem 0;
    }
	.layout-menu .menu-heading {
		padding: 0.2rem 1.5rem;
		border-bottom: 1px solid #415172;
	}
	.layout-menu .menu {
		padding: 0;
	}

	/* В открытом меню на мобильной — обычный вид серверов и селектора, не мини */
	.layout-menu .menu._is-opened .select-server {
		display: block !important;
	}
	.layout-menu .menu._is-opened .status-s {
		display: block !important;
	}
	.layout-menu .menu._is-opened .status-mini {
		display: none !important;
	}
	.layout-menu .menu._is-opened .menu .divider,
	.layout-menu .menu._is-opened .divider {
		display: block !important;
	}
	.layout-menu .menu._is-opened .select-server > div {
		min-width: 200px;
		overflow: visible;
	}
	.layout-menu .menu._is-opened .select-server {
		overflow: visible;
	}
	/* В карточках серверов — полная полоса прогресса, не компактная */
	.layout-menu .menu._is-opened .ss--status-sss {
		display: block !important;
	}
	.layout-menu .menu._is-opened .ss--status-ss {
		display: none !important;
	}
}

/* --- В попапах «Промокоды» / «Создать аккаунт» / «Отправить монеты» — у grid убираем верхний отступ --- */
.modal-template[data-modal-name="send_promo_form"] .grid.grid-cols-12.gap-6,
.modal-template[data-modal-name="send-donate-to-game"] .grid.grid-cols-12.gap-6,
.modal-template[data-modal-name="modal-register"] .grid.grid-cols-12.gap-6 {
	margin-top: 0 !important;
}

/* --- Иконка донат-монет справа в поле «Кол-во» (модалка «Отправить Монеты»): размер инпута и border-radius не меняем --- */
.modal-template .donate-qty-with-icon {
	position: relative;
}
.modal-template .donate-qty-with-icon .donate-qty-coin-icon {
	position: absolute;
    right: 0px;
    top: 71%;
    transform: translateY(-50%);
    height: 40px;
    width: auto;
    pointer-events: none;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border: 1px solid #415172;
}
.modal-template .donate-qty-with-icon .moonshine-field input[type="number"] {
	padding-right: 36px;
}

/* --- Поле «Кол-во» на странице пополнения: блок [иконка + название валюты] | инпут | блок «+N Бонус» --- */
.donate-create-qty-row {
	display: flex;
	align-items: stretch;
	flex-wrap: nowrap;
	border: 1px solid rgba(65, 81, 114, 0.9);
	border-radius: 6px;
	overflow: hidden;
	background: rgb(27 37 59);
}
.dark .donate-create-qty-row {
	border-color: #415172;
}
.donate-create-qty-left {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 12px;
	min-width: 0;
	border-right: 1px solid rgba(65, 81, 114, 0.9);
	background: rgb(27 37 59);
}
.dark .donate-create-qty-left {
	border-right-color: #415172;
}
.donate-create-qty-left .donate-create-qty-coin-icon {
	position: static;
	margin-left: -13px;
	transform: none;
	height: 40px;
	width: auto;
	border: none;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    /* border: 1px solid #415172; */
}
.donate-create-qty-currency-name {
	font-size: 14px;
	font-weight: 500;
	color: var(--color-text-main, #e5ecf8);
	white-space: nowrap;
	padding: 2px 0 0 2px;
}
.donate-create-qty-input-wrap {
	flex: 1;
	min-width: 0;
	display: flex;
	align-items: stretch;
}
.donate-create-qty-input-wrap input[type="number"]#coin {
	padding-left: 14px;
	padding-right: 14px;
	padding-top: 9px;
	border: 1px solid transparent;
	border-radius: 0;
	background: transparent;
	width: 100%;
	transition: border-color 0.3s, box-shadow 0.3s;
}
.donate-create-qty-input-wrap input[type="number"]#coin:focus {
	outline: none;
	box-shadow: none !important;
	border-color: #C8A870;
}
.donate-create-qty-bonus-wrap {
	display: flex;
	align-items: center;
	/* padding: 0 12px; */
	/* border-left: 1px solid rgba(65, 81, 114, 0.9); */
}
.dark .donate-create-qty-bonus-wrap {
	/* border-left-color: #415172; */
}
.donate-create-qty-row .donate-create-qty-bonus-badge {
	margin: 0;
	border-radius: 0;
	border: none;
	box-shadow: none;
}

/* --- Поле «Ник персонажа» для гостей: иконка слева, разделитель, отступ для ввода --- */
.donate-char-with-icon {
	position: relative;
	display: flex;
	align-items: center;
}
.donate-char-with-icon .donate-char-icon {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-sub, #94a3c2);
	pointer-events: none;
	border-right: 1px solid rgba(65, 81, 114, 0.9);
}
.donate-char-with-icon input#recipient {
	padding-left: 54px;
}
.donate-char-with-icon input[name="char_name"] {
	padding-left: 54px;
}
.dark .donate-char-with-icon .donate-char-icon {
	color: #e5ecf8;
	border-right-color: #415172;
}

/* --- Ползунок в модалке «Отправить Монеты»: синхронно с irs--round из ion.rangeSlider.css --- */
/* Заполненная область: #eac485 через linear-gradient и --range-pct (задаётся Alpine @input/x-init). Бегунок по центру дорожки: margin-top -10px. */
.modal-template .modal input[type="range"].donate-transfer-range {
	accent-color: #eac485;
	--range-pct: 0%;
}
.modal-template .modal input[type="range"].donate-transfer-range::-webkit-slider-runnable-track {
	height: 6px;
	border-radius: 2px;
	background: linear-gradient(to right, #eac485 0%, #eac485 var(--range-pct, 0%), #1b253b var(--range-pct, 0%), #1b253b 100%);
}
.modal-template .modal input[type="range"].donate-transfer-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 24px;
	height: 24px;
	border-radius: 24px;
	background-color: #fff;
	border: 4px solid #eac485;
	cursor: pointer;
	margin-top: -6px;
	box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3);
	transition: background 0.2s ease;
}
.modal-template .modal input[type="range"].donate-transfer-range::-webkit-slider-thumb:hover {
	background-color: #f0f6ff;
}
.modal-template .modal input[type="range"].donate-transfer-range::-webkit-slider-thumb:active {
	background-color: #e8efff;
}
.modal-template .modal input[type="range"].donate-transfer-range::-moz-range-track {
	height: 4px;
	border-radius: 4px;
	background: linear-gradient(to right, #eac485 0%, #eac485 var(--range-pct, 0%), #1b253b var(--range-pct, 0%), #1b253b 100%);
}
.modal-template .modal input[type="range"].donate-transfer-range::-moz-range-thumb {
	width: 24px;
	height: 24px;
	border-radius: 24px;
	background-color: #fff;
	border: 4px solid #eac485;
	cursor: pointer;
	box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3);
	transition: background 0.2s ease;
}
.modal-template .modal input[type="range"].donate-transfer-range::-moz-range-thumb:hover {
	background-color: #f0f6ff;
}
.modal-template .modal input[type="range"].donate-transfer-range::-moz-range-thumb:active {
	background-color: #e8efff;
}
.dark .modal-template .modal input[type="range"].donate-transfer-range::-webkit-slider-runnable-track {
	background: linear-gradient(to right, #eac485 0%, #eac485 var(--range-pct, 0%), #1b253b var(--range-pct, 0%), #1b253b 100%);
}
.dark .modal-template .modal input[type="range"].donate-transfer-range::-webkit-slider-thumb {
	background-color: #fff;
	border-color: #eac485;
}
.dark .modal-template .modal input[type="range"].donate-transfer-range::-webkit-slider-thumb:hover {
	background-color: #f0f6ff;
}
.dark .modal-template .modal input[type="range"].donate-transfer-range::-moz-range-track {
	background: linear-gradient(to right, #eac485 0%, #eac485 var(--range-pct, 0%), #1b253b var(--range-pct, 0%), #1b253b 100%);
}
.dark .modal-template .modal input[type="range"].donate-transfer-range::-moz-range-thumb {
	background-color: #fff;
	border-color: #eac485;
}
.dark .modal-template .modal input[type="range"].donate-transfer-range::-moz-range-thumb:hover {
	background-color: #f0f6ff;
}

.dark\:bg-gray-800:is(.dark *) {
	background-color: #ffffff00 !important;
}

/* Убираем фон у блоков рейтинга только на странице статистики */
.box.space-elements {
	/* background: none !important; */
}
/* Если нужно убрать фон ещё и у дочерних блоков с тёмным фоном (например, у колонок с dark:bg-gray-800), можно добавить в тот же файл: */
.layout-content .box.space-elements {
    /* background: none !important; */
}
tr.dark\:text-gray-300.text-gray-600.bg-gray-600:hover {
    background-color: #252f47;
}
.dark\:bg-gray-800:is(.dark *) {
    border: 1px solid #4a5a79;
}
.auth_upp {
	padding: 10px 10px 10px 10px;
    background-color: #364564;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.grid.grid-cols-12.gap-6 {
    margin-top: 0px;
}
select#field--3 {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
input#field--4 {
    margin-top: -4px;
}
a.inline-flex.items-center.gap-1.max-w-full.hover\:text-primary {
    /* font-weight: 700; */
    padding-right: 3px;
}
.form-label {
    padding-left: 2px;
    /* margin-top: 18px; */
}
/* Цвет выделения активной вкладки (Пароль, Авторизация и т.д.): задаётся здесь и в MoonShineLayout::theme() primary */
.tabs-vertical>.tabs-list .tabs-button._is-active:is(.dark *) {
    color: rgb(234 196 133);
    border-right: 3px solid #eac485;
    background-color: transparent;
}

.rating-tabs-wrapper {
    background: #2e3b57b3;
    border-radius: 10px;
}
.rating-tabs-nav {
	padding: 15px 0 0 0;
    margin: 0 0 0 20px;
    gap: 0;
	position: relative;
    z-index: 1;
}
button.rating-tab.px-4.py-2.rounded-t.text-sm.font-medium.transition-colors.rating-tab-active.bg-gray-200.dark\:bg-gray-700.text-gray-900.dark\:text-gray-100.border.border-b-0.border-gray-300.dark\:border-gray-600 {
    background-color: #28334e;
    color: #fff;
    font-weight: 400;
}
button.rating-tab.px-4.py-2.rounded-t.text-sm.font-medium.transition-colors.text-gray-600.dark\:text-gray-400.hover\:bg-gray-100.dark\:hover\:bg-gray-800.border.border-transparent {
    border: 1px solid transparent;
	font-weight: 400;
}
button.rating-tab:hover.px-4.py-2.rounded-t.text-sm.font-medium.transition-colors.text-gray-600.dark\:text-gray-400.hover\:bg-gray-100.dark\:hover\:bg-gray-800.border.border-transparent {
    background: none;
    color: #fff;
	font-weight: 400;
}
.rating-tabs-panels {
    margin: -21px 0 0 0;
}

/* Карточки дашборда (Аккаунты / Персонажи / Баланс): левый край, крупный шрифт, иконки белые по центру */
.report-card .report-card-body-left {
    justify-content: flex-start;
    padding-left: 0.5rem;
}
.report-card .report-card-title-large {
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.4;
}
.report-card .report-card-heading-white {
    display: flex;
    align-items: center;
    color: #fff;
    flex-shrink: 0;
}
.report-card .report-card-heading-white svg,
.report-card .report-card-heading-white img {
    color: #fff;
    fill: #fff;
}
.dark .report-card .report-card-heading-white {
    color: #e4e6eb;
	padding: 6px 0 0 0;
}
.dark .report-card .report-card-heading-white svg,
.dark .report-card .report-card-heading-white img {
    color: #e4e6eb;
    fill: #e4e6eb;
}
.flex.items-center.gap-2.report-card-title-line {
    margin-top: -6px;
}
p.text-xs1.text-gray-900.dark\:text-white {
    font-weight: 700;
}

/* Анимация dropdown-user: контент выезжает сверху при появлении, уезжает вверх при скрытии (анимация только у внутреннего блока — окно уже на месте) */
@keyframes dropdown-user-slide-in {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes dropdown-user-slide-out {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(-10px);
    }
}
#dropdown-user .dropdown-user-inner {
    transform-origin: top;
}
#dropdown-user:not(.hidden) .dropdown-user-inner:not(.dropdown-user-closing) {
    animation: dropdown-user-slide-in 0.2s ease-out;
}
#dropdown-user .dropdown-user-inner.dropdown-user-closing {
    animation: dropdown-user-slide-out 0.25s ease-in forwards;
}

.dropdown-user-inner .px-4.py-3 {
    border-bottom: 1px solid #415172;
}

/* Имя пользователя в выпадающем меню — в одну строку без переноса */
#dropdown-user .dropdown-user__name {
    white-space: nowrap;
	padding-top: 5px;
}

/* Ссылка «Привяжите почту!» — тонкий шрифт, розово-красный (дублируем в style.css для приоритета) */
#dropdown-user .dropdown-user__link-email {
    font-weight: 300 !important;
    color: #e11d48 !important;
}
#dropdown-user .dropdown-user__link-email:hover {
    color: #be123c !important;
}
.dark #dropdown-user .dropdown-user__link-email {
    color: #fb7185 !important;
}
.dark #dropdown-user .dropdown-user__link-email:hover {
    color: #fda4af !important;
}

/* Модалка «Реферальная программа» — фиксированная ширина и мин. высота, не прыгает при смене вкладок */
.referral-modal-content {
    width: 680px;
    min-width: 680px;
    min-height: 500px;
    box-sizing: border-box;
}
.referral-modal-content .tabs-content,
.referral-modal-content .tabs-body {
    max-width: 100%;
    overflow-wrap: break-word;
}
.referral-modal-content input[readonly] {
    max-width: 100%;
    min-width: 0;
}
.modal.referral-program-modal .modal-dialog {
    min-width: 680px;
}
.modal.referral-program-modal .modal-body {
    min-height: 535px;
    box-sizing: border-box;
}

/* --- История авторизаций (таблица на странице «Редактировать профиль») --- */
.login-history-section {
    /* background: #1e3a5f; */
    border-radius: 8px;
    /* padding: 1rem; */
    margin: 0;
}
.login-history-title {
    color: #fff;
    margin: 0 0 1rem 3px;
    font-size: 1rem;
}
.login-history-table-wrap {
    overflow-x: auto;
	border-radius: 7px;
}
.login-history-table {
    width: 100%;
    border-collapse: collapse;
    color: #e2e8f0;
	border: 1px solid #415172;
}
.login-history-thead {
    /* заголовок таблицы */
	border: 1px solid #415172;
}
.login-history-thead-row {
    background: #1d253c;
}
.login-history-th {
    padding: 10px 25px 10px 25px;
    text-align: left;
    font-weight: 600;
    color: #fff;
	border: 1px solid #415172;
}
th.login-history-th:first-child {
    /* padding-left: 10px; */
}
td.login-history-td.login-history-td--ip {
    color: #ffabda;
}
.login-history-tbody {
    /* тело таблицы */
}
.login-history-tbody-row {
    background: #293350;
    border-bottom: 1px solid #415172;
}
.login-history-td {
    padding: 10px 25px 10px 25px;
    color: #e2e8f0;
	border: 1px solid #415172;
}
.login-history-td--date {
    white-space: nowrap;
}
.login-history-country {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.login-history-flag {
    width: 20px;
    height: 14px;
    object-fit: cover;
    vertical-align: middle;
}
.login-history-flag-emoji {
    font-size: 1rem;
    line-height: 1;
    display: none; /* показывается через onerror у img, если картинки флага нет */
}
.login-history-tag {
    display: inline-block;
    padding: 0.35rem 0.5rem 0.2rem 0.5rem;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
}
.login-history-tag--os {
    background: #1170e4;
    color: #fff;
}
.login-history-tag--device {
    background: #09ad95;
    color: #fff;
}
.login-history-empty {
    color: #94a3b8;
    margin: 0;
}

.max-w-lg {
    max-width: 30rem;
}
.oauth-btn {
	border-radius: 5px;
	font-size: 14px;
	padding: 0px 20px 0 15px;
}
.oauth-block-below {
    padding-bottom: 10px;
}
p.mb-3.text-amber-600.dark\:text-amber-400.text-sm {
    display: inline-block;
    text-transform: lowercase;
    color: #eb7a7a;
}
p.mb-2.text-amber-600.dark\:text-amber-400.text-sm {
    display: inline-block;
    text-transform: lowercase;
    color: #eb7a7a;
}
p.mb-1.font-mono.text-sm {
    display: inline-block;
}