/*
 * theme-extra.css — оформление и раскладка темы metronic8 поверх Metronic 8.
 * Грузится последним. Конфликты с общими CSS старой темы (sbstyle.css и т.д.)
 * чинятся ЗДЕСЬ — общие файлы не меняем, их использует тема default.
 */

/* ---------- Цвета и шрифт (макеты dev/gemini) ----------
   Основной — индиго вместо красного старой темы; красный остаётся только по смыслу
   (danger: ошибки, долги, минус). Сайдбар — тёмно-синий, фон контента — светло-серый.
   Те же значения зашиты в бандлы Metronic: tests/theme/apply_brand_color.php. */
:root,
[data-bs-theme="light"] {
	--bs-primary: #4148d4;
	--bs-primary-rgb: 65, 72, 212;
	--bs-primary-active: #353bb8;
	--bs-primary-light: #eeeffd;
	--bs-primary-clarity: rgba(65, 72, 212, 0.2);
	--bs-primary-inverse: #ffffff;
	--bs-text-primary: #4148d4;
	--bs-primary-bg-subtle: #dcdefa;
	--bs-primary-border-subtle: #b9bcf1;
	--bs-primary-text-emphasis: #1b1e5a;
	--bs-link-color: #4148d4;
	--bs-link-color-rgb: 65, 72, 212;
	--bs-link-hover-color: #353bb8;
	--bs-link-hover-color-rgb: 53, 59, 184;

	--bs-success: #28a878;
	--bs-success-rgb: 40, 168, 120;
	--bs-success-active: #1f8e64;
	--bs-success-light: #e5f6ef;
	--bs-success-clarity: rgba(40, 168, 120, 0.2);
	--bs-text-success: #28a878;

	/* danger / warning / info — в той же системе (Metronic: розово-красный #F8285A, кислотно-жёлтый
	   #F6C000, фиолетовый #7239EA выбивались из палитры). Danger — только по смыслу. */
	--bs-danger: #d9434f;
	--bs-danger-rgb: 217, 67, 79;
	--bs-danger-active: #bf3540;
	--bs-danger-light: #fcecee;
	--bs-danger-clarity: rgba(217, 67, 79, 0.2);
	--bs-text-danger: #d9434f;
	--bs-danger-bg-subtle: #f7d9dc;
	--bs-danger-border-subtle: #efb4b9;
	--bs-danger-text-emphasis: #571b20;

	--bs-warning: #e2a33b;
	--bs-warning-rgb: 226, 163, 59;
	--bs-warning-active: #c98b26;
	--bs-warning-light: #fdf5e7;
	--bs-warning-clarity: rgba(226, 163, 59, 0.2);
	--bs-text-warning: #c98b26;
	--bs-warning-bg-subtle: #f9edd8;
	--bs-warning-border-subtle: #f3dab0;
	--bs-warning-text-emphasis: #5a4118;

	--bs-info: #2f8fd6;
	--bs-info-rgb: 47, 143, 214;
	--bs-info-active: #2579b8;
	--bs-info-light: #eaf4fc;
	--bs-info-clarity: rgba(47, 143, 214, 0.2);
	--bs-text-info: #2f8fd6;
	--bs-info-bg-subtle: #d5e9f7;
	--bs-info-border-subtle: #acd2ef;
	--bs-info-text-emphasis: #133956;

	--m8-sidebar-bg: #151c2e;
	--m8-sidebar-border: #232b42;
	--m8-sidebar-text: #9aa3bc;
	--m8-sidebar-hover-bg: rgba(255, 255, 255, 0.05);

	--bs-app-bg-color: #f5f7fb;
	--bs-app-blank-bg-color: #f5f7fb;
	--bs-body-bg: #ffffff;

	/* Inter — латиница и кириллица; иврит — Heebo (в Inter нет еврейских букв, грузится только для he) */
	--bs-font-sans-serif: Inter, Heebo, Helvetica, Arial, sans-serif;
}

/* Шрифт крупнее на больших мониторах (Metronic — 13px; в макетах текст заметно крупнее).
   Не ниже 1600px: на ноутбуках (1366–1440) широкие списки и так прокручиваются по горизонтали */
@media (min-width: 1600px) {
	html { font-size: 14px !important; }
}

/* ---------- Раскладка ---------- */

/* sbstyle.css делает .container-fluid колонкой — хрому темы это не нужно */
.app-header .app-container,
.app-footer .app-container { flex-direction: row; }
.m8-header-container,
.m8-footer-container { width: 100%; padding-left: 30px; padding-right: 30px; }

/* .page-wrapper шаблонов = область контента (app-main). Футер темы идёт
   следующим блоком колонки #kt_app_wrapper */
.m8-body .app-wrapper > .page-wrapper {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
	min-width: 0;
	padding: 25px 30px 30px;
}
.m8-body .app-wrapper > .page-wrapper > .container-fluid { padding-left: 0; padding-right: 0; }
@media (max-width: 991.98px) {
	.m8-header-container, .m8-footer-container { padding-left: 15px; padding-right: 15px; }
	.m8-body .app-wrapper > .page-wrapper { padding: 15px; }
}

/* Заголовок страницы (.row.page-titles в каждом шаблоне) -> тулбар Metronic.
   Без gutter: заголовок по левому краю карточек, как у partials/toolbar.php */
.m8-body .page-titles {
	background: transparent;
	box-shadow: none;
	margin: 0 0 20px;
	--bs-gutter-x: 0;
	padding: 0;
	align-items: center;
}
.m8-body .page-titles h4,
.m8-body .page-titles .text-themecolor {
	margin: 0;
	color: var(--bs-gray-900);
	font-size: 1.5rem;
	font-weight: 700;
}
.m8-body .page-titles .breadcrumb,
.m8-body .m8-breadcrumb {
	padding: 0;
	margin: 0;
	background: transparent;
	font-size: .95rem;
	font-weight: 500;
}
.m8-body .page-titles .breadcrumb-item a,
.m8-body .m8-breadcrumb .breadcrumb-item a { color: var(--bs-gray-600); }
.m8-body .page-titles .breadcrumb-item a:hover,
.m8-body .m8-breadcrumb .breadcrumb-item a:hover { color: var(--bs-primary); }
.m8-body .page-titles .breadcrumb-item.active,
.m8-body .m8-breadcrumb .breadcrumb-item.active { color: var(--bs-gray-800); }
.m8-body .page-titles .breadcrumb-item + .breadcrumb-item::before,
.m8-body .m8-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
	content: "";
	width: 5px;
	height: 2px;
	margin: 0 .6rem;
	align-self: center;
	background-color: var(--bs-gray-400);
	padding: 0;
}

.m8-body .m8-toolbar { margin-bottom: 20px !important; }
.m8-body .m8-toolbar .q_help { margin-inline-start: 12px; }

/* Карточки старых шаблонов плотнее, чем дефолт Metronic */
.m8-body .page-wrapper .card { margin-bottom: 1.5rem; }
.m8-body .page-wrapper .card > .card-body { padding: 1.5rem 1.75rem; }
.m8-body .page-wrapper .card .card-title { font-weight: 600; color: var(--bs-gray-900); }

/* ---------- iframe-режим (модалка #sbiframe_mod) ----------
   Metronic ставит html/body height:100% и flex — resizeIframe() (sbadmin.js)
   меряет body.scrollHeight и не смог бы уменьшить iframe */
html.m8-iframe,
html.m8-iframe body { height: auto; min-height: 0; display: block; }
body.iframe { background: #fff !important; }

/* ---------- Сайдбар ---------- */
/* тёмно-синий, активный пункт — индиго-«таблетка», наведение — лёгкая подсветка (макеты) */
[data-kt-app-layout=dark-sidebar] .app-sidebar { background-color: var(--m8-sidebar-bg); }
[data-kt-app-layout=dark-sidebar] .app-sidebar .app-sidebar-logo { border-bottom: 1px solid var(--m8-sidebar-border); }
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-title,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon i { color: var(--m8-sidebar-text); }
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link { border-radius: .625rem; transition: background-color .2s ease, color .2s ease; }
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link:hover:not(.active) { background-color: var(--m8-sidebar-hover-bg); }
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.here > .menu-link,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.here > .menu-link .menu-title,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.here > .menu-link .menu-icon i { color: #fff; }
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active {
	background-color: var(--bs-primary);
	box-shadow: 0 6px 16px -6px rgba(var(--bs-primary-rgb), .65);
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-title,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon i { color: #fff; }
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-bullet .bullet { background-color: #fff; }
[data-kt-app-layout=dark-sidebar] .app-sidebar .scroll-y:hover,
[data-kt-app-layout=dark-sidebar] .app-sidebar .hover-scroll-overlay-y:hover { scrollbar-color: var(--m8-sidebar-border) transparent; }
.app-sidebar-logo { position: relative; display: flex; align-items: center; height: var(--bs-app-header-height, 70px); }
.app-sidebar-logo img { max-width: 100%; }
.app-sidebar-logo .app-sidebar-logo-minimize { display: none; }
[data-kt-app-sidebar-minimize="on"] .app-sidebar:not(:hover) .app-sidebar-logo-default { display: none; }
[data-kt-app-sidebar-minimize="on"] .app-sidebar:not(:hover) .app-sidebar-logo-minimize { display: inline-block; }

/* Заголовки групп меню (Работа, Продажи, Команда, Финансы, Администрирование) */
.app-sidebar .menu .m8-menu-section { padding-top: 14px; }
.app-sidebar .menu .m8-menu-section:first-child { padding-top: 0; }
.app-sidebar .menu .m8-menu-section .menu-content { padding: 0 15px 4px; }
.app-sidebar .menu .m8-menu-section .menu-heading {
	color: #636d89;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	white-space: nowrap;
}
/* свёрнутый сайдбар: вместо подписи — тонкая черта между группами */
[data-kt-app-sidebar-minimize="on"] .app-sidebar:not(:hover) .m8-menu-section .menu-heading { visibility: hidden; }
[data-kt-app-sidebar-minimize="on"] .app-sidebar:not(:hover) .m8-menu-section .menu-content { border-top: 1px solid var(--m8-sidebar-border); padding-bottom: 0; }
.app-sidebar .menu .menu-item .menu-link .menu-icon .fa { font-size: 1.15rem; }
.app-sidebar.hide_i { display: none; }

/* ---------- Шапка: уведомления (разметка header_notif.php без изменений) ---------- */
.m8-notif { position: relative; display: flex; align-items: center; }
.m8-notif > .nav-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 40px;
	height: 40px;
	padding: 0;
	border-radius: .475rem;
	color: var(--bs-gray-700);
	font-size: 1.35rem;
}
.m8-notif > .nav-link:hover,
.m8-notif > .nav-link.show { background-color: var(--bs-gray-100); color: var(--bs-primary); }
.m8-notif > .nav-link.dropdown-toggle::after { display: none; }

/* пульсирующая точка «есть новые» */
.m8-notif .notify { position: absolute; top: 6px; right: 6px; width: 10px; height: 10px; }
.m8-notif .notify .heartbit {
	position: absolute;
	top: -8px;
	right: -8px;
	height: 26px;
	width: 26px;
	z-index: 10;
	border: 4px solid var(--bs-danger);
	border-radius: 70px;
	animation: m8-heartbit 1s ease-out infinite;
}
.m8-notif .notify .point { position: absolute; top: 0; right: 0; width: 8px; height: 8px; border-radius: 30px; background-color: var(--bs-danger); }
@keyframes m8-heartbit {
	0% { transform: scale(0); opacity: 0; }
	25% { transform: scale(.1); opacity: .1; }
	50% { transform: scale(.5); opacity: .3; }
	75% { transform: scale(.8); opacity: .5; }
	100% { transform: scale(1); opacity: 0; }
}

.m8-notif .dropdown-menu.mailbox {
	width: 360px;
	max-width: calc(100vw - 30px);
	padding: 0;
	border: 0;
	border-radius: .625rem;
	box-shadow: var(--bs-dropdown-box-shadow, 0 0 50px 0 rgba(82, 63, 105, .15));
	overflow: hidden;
}
.m8-notif .mailbox ul { padding: 0; margin: 0; }
.m8-notif .mailbox ul li { list-style: none; }
.m8-notif .mailbox .drop-title {
	padding: 1rem 1.25rem;
	font-weight: 600;
	font-size: 1.05rem;
	color: #fff;
	background: linear-gradient(to right, var(--m8-sidebar-bg) 0%, var(--bs-primary) 100%);
}
.m8-notif .mailbox .message-center { max-height: 360px; overflow: auto; position: relative; }
.m8-notif .mailbox .message-center a {
	display: flex;
	align-items: flex-start;
	gap: .85rem;
	padding: .85rem 1.25rem;
	border-bottom: 1px solid var(--bs-border-color);
	color: var(--bs-gray-800);
	text-decoration: none;
}
.m8-notif .mailbox .message-center a:hover { background: var(--bs-gray-100); }
.m8-notif .mailbox .message-center .btn-circle { flex: 0 0 38px; width: 38px; height: 38px; }
/* Metronic уменьшает иконки внутри .btn — значок в кружке был едва виден */
.m8-notif .mailbox .message-center .btn-circle i,
.m8-notif .mailbox .message-center .btn-circle .fa { font-size: 17px; line-height: 1; padding: 0; color: #fff; }
.m8-notif .mailbox .message-center .mail-contnet { flex: 1 1 auto; min-width: 0; }
.m8-notif .mailbox .message-center .mail-contnet h5 { margin: 0 0 .2rem; font-size: .95rem; font-weight: 600; color: var(--bs-gray-900); }
.m8-notif .mailbox .message-center .mail-contnet .time,
.m8-notif .mailbox .message-center .mail-contnet .mail-desc { display: block; font-size: .85rem; color: var(--bs-gray-600); margin: 1px 0; }
.m8-notif .mailbox .nav-link { display: block; padding: .75rem 1.25rem; text-align: center; color: var(--bs-gray-700); }
.m8-notif .mailbox .nav-link:hover { color: var(--bs-primary); }

/* ---------- Прелоадер (sbadmin.js показывает/прячет .preloader) ---------- */
.preloader { width: 100%; height: 100%; top: 0; left: 0; position: fixed; z-index: 99999; background: rgba(255, 255, 255, .85); }
.loader, .loader__figure { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.loader { overflow: visible; padding-top: 2em; height: 0; width: 2em; }
.loader__figure { height: 0; width: 0; box-sizing: border-box; border: 0 solid var(--bs-primary); border-radius: 50%; animation: m8-loader-figure 1.15s infinite cubic-bezier(.215, .61, .355, 1); }
.loader__label { float: left; transform: translateX(-50%); margin: .5em 0 0 50%; font-size: .875em; letter-spacing: .1em; line-height: 1.5em; color: var(--bs-primary); white-space: nowrap; animation: m8-loader-label 1.15s infinite cubic-bezier(.215, .61, .355, 1); }
@keyframes m8-loader-figure {
	0% { height: 0; width: 0; background-color: var(--bs-primary); }
	29% { background-color: var(--bs-primary); }
	30% { height: 2em; width: 2em; background-color: transparent; border-width: 1em; opacity: 1; }
	100% { height: 2em; width: 2em; border-width: 0; opacity: 0; background-color: transparent; }
}
@keyframes m8-loader-label {
	0% { opacity: .25; }
	30% { opacity: 1; }
	100% { opacity: .25; }
}

/* ---------- Модалка-iframe ---------- */
#sbiframe_mod .modal-body { padding: 0; }
#sbiframe_mod .modal-body iframe { display: block; }
#sbiframe_mod .modal-header { padding: 1rem 1.5rem; }

/* ---------- Страница входа ---------- */
body.m8-login { background-color: #fff; }
/* правая половина — фон из макета (dev/gemini): тёмно-синий, сетка-«волна» внизу справа;
   логотип и надпись макета стёрты — наши лежат поверх. Сетка у нижнего края — position bottom */
.m8-login .m8-login-aside {
	position: relative;
	overflow: hidden;
	background: #171f31 url(../img/login-aside.jpg) center bottom / cover no-repeat;
}
.m8-login .m8-login-aside > * { position: relative; z-index: 1; }
.m8-login .m8-login-aside h2 { font-weight: 600 !important; }
/* логотип целиком белый (на тёмно-синем серое «SOFT» не читается); «SB» в круге — прозрачные вырезы */
.m8-login .m8-login-aside img { filter: brightness(0) invert(1); }
.m8-login .alert-danger { border: 0; }

/* ---------- Шапка на телефоне: 5 колокольчиков + язык + пользователь ---------- */
@media (max-width: 575.98px) {
	.app-header .app-navbar-item { margin-left: 2px !important; margin-right: 0 !important; }
	/* иконки как в классике (18px): на телефоне rem у Metronic меньше (корень 12px) */
	.m8-notif > .nav-link { width: 34px; height: 34px; font-size: 18px; }
	.app-header .app-navbar-item > .btn { padding-left: .25rem !important; padding-right: .25rem !important; }
	.app-header .symbol.symbol-35px > img { width: 30px; height: 30px; }
}
@media (max-width: 479.98px) {
	.m8-mobile-logo { display: none !important; }
}

/* Невидимая «.navbar» для sb_calendar.js (высота шапки) — см. header.php темы */
.m8-navbar-height {
	position: fixed !important;
	top: 0;
	left: 0;
	width: 1px;
	height: var(--bs-app-header-height, 70px);
	padding: 0 !important;
	visibility: hidden;
	pointer-events: none;
}

/* ---------- Плотность полей и кнопок ----------
   Metronic рассчитан на просторные формы (поле 44px, шрифт 1.1rem); в CRM много полей
   в узких колонках (зарплата, фильтры, модалки) — значения обрезались. Поле ~36px. */
.m8-body .form-control,
.m8-body .form-select {
	padding: .6rem .9rem;
	font-size: 1rem;
}
.m8-body select.form-control:not([multiple]):not([size]),
.m8-body .form-select {
	padding-right: 2.4rem;
	background-position: right .8rem center;
}
[dir="rtl"] .m8-body select.form-control:not([multiple]):not([size]),
[dir="rtl"] .m8-body .form-select {
	padding-right: .9rem;
	padding-left: 2.4rem;
	background-position: left .8rem center;
}
.m8-body .input-group-text { padding: .6rem .9rem; font-size: 1rem; }
/* та же цепочка :not, что у Metronic (иначе не перебить); .btn-sm/.btn-lg не трогаем */
.m8-body .btn:not(.btn-outline):not(.btn-dashed):not(.btn-bordered):not(.border-hover):not(.border-active):not(.btn-flush):not(.btn-icon):not(.btn-hover-outline):not(.btn-sm):not(.btn-lg) {
	padding: calc(.6rem + 1px) calc(1.2rem + 1px);
	font-size: 1rem;
}
/* Metronic: .btn > i { font-size: 1rem; padding-right: .35rem } — под Keenicons. Иконки старых шрифтов
   в кнопках шаблонов, как в BS4, берут размер кнопки (на телефоне rem = 12px — «⋮» и часы в строках
   были 12px против 17–18px) и не смещаются отступом (кнопки-иконки 38×38 — значок по центру) */
.m8-body .btn > i.fa,
.m8-body .btn > i.mdi,
.m8-body .btn > i[class^="ti-"],
.m8-body .btn > i[class*=" ti-"],
.m8-body .btn > i[class^="icon-"],
.m8-body .btn > i[class*=" icon-"] {
	font-size: inherit;
	padding-left: 0;
	padding-right: 0;
}
/* хелперы sbstyle.css (.font-size-120 у кнопок «⋮» и часов в строках) — правило выше их перебивало */
.m8-body .btn.font-size-110 { font-size: 110% !important; }
.m8-body .btn.font-size-120 { font-size: 120% !important; }
.m8-body .btn.font-size-125 { font-size: 125% !important; }

/* ---------- Кнопки .btn-info («Редактировать», «Подробнее», «Создать» …) ----------
   В sbstyle.css старой темы это красный градиент, в Metronic info — фиолетовый. В теме —
   стандарт Metronic для действий: светло-серая, при наведении светлая фирменная (индиго). */
.m8-body .btn.btn-info,
.m8-body .btn-info {
	background: var(--bs-gray-100) !important;
	border-color: transparent !important;
	color: var(--bs-gray-700) !important;
	box-shadow: none !important;
}
.m8-body .btn.btn-info:hover,
.m8-body .btn.btn-info:focus,
.m8-body .btn.btn-info:active,
.m8-body .btn.btn-info.active,
.m8-body .btn.btn-info.show {
	background: var(--bs-primary-light) !important;
	color: var(--bs-primary) !important;
}
.m8-body .btn.btn-info i,
.m8-body .btn.btn-info .svg-icon {
	color: inherit !important;
}

/* ---------- Красный и оранжевый старой темы в общих CSS -> цвета темы ----------
   sbstyle.css, footable-page.css, timeline-*.css зашивают #f43e54 (бренд старой темы)
   и #fb9678 («primary» Elite). Красный остаётся только по смыслу (danger). */
.m8-body .footable .pagination li a { color: var(--bs-gray-700) !important; }
.m8-body .footable .pagination li a:hover { color: var(--bs-primary) !important; }
.m8-body .footable .pagination li.active a,
.m8-body .footable .pagination li.active a:hover {
	background: var(--bs-primary) !important;
	border-color: var(--bs-primary) !important;
	color: #fff !important;
}
.m8-body .autocomplete-selected { background: var(--bs-primary); color: #fff; }
.m8-body #sbiframe_label b { color: var(--bs-primary); }

/* Хелперы цвета sbstyle.css (Elite: зелёный #00c292, голубой #038fcd, розовый #e46a76, оранжевый #fb9678,
   чистый #f00) -> токены палитры темы */
.m8-body .color-success { color: var(--bs-success); }
.m8-body .color-blue,
.m8-body .color-info { color: var(--bs-info); }
.m8-body .color-warning { color: var(--bs-text-warning); }
.m8-body .color-danger { color: var(--bs-danger); }
.m8-body .color-primary { color: var(--bs-primary); }
.m8-body .bg-danger { background-color: var(--bs-danger) !important; }
.m8-body .bg-blue,
.m8-body .btn-blue { background: var(--bs-info); }
.m8-body .btn-blue:hover { background: var(--bs-info-active); }
.m8-body .label-info { background: var(--bs-info); }
.m8-body .bg-beige,
.m8-body .bg-beige2 { background-color: var(--bs-warning-light); }
.m8-body .bg-beige2 { color: var(--bs-warning-text-emphasis); }
.m8-body .border-b-danger { border-bottom-color: var(--bs-danger); }
.m8-body .border-b-blue { border-bottom-color: var(--bs-info); }
.m8-body .border-b-warning { border-bottom-color: var(--bs-warning); }
/* счётчики новых комментариев и точки «есть новое» — красный по смыслу, но спокойный, не #f00 */
.m8-body .my-point,
.m8-body .my-point-inline,
.m8-body .notify.new-comment .point { background: var(--bs-danger); }
.m8-body .notify.new-comment .heartbit { border-color: var(--bs-danger); }
.m8-body .notify2_s .heartbit { border-color: rgba(var(--bs-danger-rgb), .45); }
.m8-body .point2_heartbit { border-color: rgba(var(--bs-danger-rgb), .45); }
/* чат: свои сообщения — светлый индиго с тёмным текстом вместо лососевого с белым */
.m8-body .bg-my-comment { background: var(--bs-primary-light) !important; color: var(--bs-gray-900) !important; }
.m8-body .bg-my-comment a { color: var(--bs-primary); }
.m8-body .bg-other-comment { background: var(--bs-gray-100) !important; }
/* timeline (Elite) — точки этапов */
.m8-body .timeline > li > .timeline-badge.success { background-color: var(--bs-success); }

/* статус в строке списка: нижняя линия по статусу, фон — светлый индиго (макет «Проекты») */
.m8-body .border-b-primary { border-bottom-color: var(--bs-primary); }
.m8-body .border-b-success { border-bottom-color: var(--bs-success); }
.m8-body select.form-control[class*="border-b-"],
.m8-body select.form-select[class*="border-b-"] {
	background-color: var(--bs-primary-light);
	border-left-color: transparent;
	border-right-color: transparent;
	color: var(--bs-gray-900);
	font-weight: 500;
}

.m8-body #demo-show-entries,
.m8-body #demo-input-search2,
.m8-body #demo-show-entries:focus,
.m8-body #demo-input-search2:focus {
	background-image: linear-gradient(var(--bs-primary), var(--bs-primary)), linear-gradient(#e9ecef, #e9ecef);
}
.m8-body .timeline-badge.primary { background-color: var(--bs-primary); }
.m8-body .timeline-badge.success { background-color: var(--bs-success); }
.m8-body .cd-horizontal-timeline .events a { color: var(--bs-primary); }
.m8-body .cd-horizontal-timeline .filling-line,
.m8-body .cd-horizontal-timeline .events a.selected::after { background: var(--bs-primary); }
.m8-body .cd-horizontal-timeline .events a.selected::after { border-color: var(--bs-primary); }