body {
    font-family: "Nunito Sans", sans-serif;
    font-optical-sizing: auto;
    font-variation-settings:
            "wdth" 100,
            "YTLC" 500;
}

input::placeholder {
    opacity: 0.4 !important;
}

.form-check-input {
    width: 1.5rem;
    height: 1.5rem;
}
/*.fw-bold,*/
/*.fw-bolder {*/
/*    font-variation-settings:*/
/*        "wdth" 100,*/
/*        "YTLC" 500;*/
/*}*/

.app-sidebar .menu > .menu-item.here > .menu-link {
    background-color: rgba(var(--bs-dark-rgb)) !important;
}
.app-sidebar .menu > .menu-item > .menu-link,
.app-sidebar .menu > .menu-item > .menu-link .menu-icon, .app-sidebar .menu > .menu-item > .menu-link .menu-icon .svg-icon, .app-sidebar .menu > .menu-item > .menu-link .menu-icon i,
.app-sidebar .menu > .menu-item > .menu-link .menu-title
{
    color: var(--bs-dark);
}

@media (min-width: 992px) {
    [data-kt-app-sidebar-fixed=true] .app-sidebar {
        top: -15px;
        z-index: unset;
    }
}

.btn-primary, .btn-primary * {
    color: var(--bs-text-white) !important;
}

.page-item.active .page-link {
    color: var(--bs-text-white) !important;
}
/* ── Сайдбар: цвета пунктов ───────────────────────────────────────────────────
   Три причины, почему цвета заданы здесь и так подробно:

   1. Metronic красит подпункты правилом
      «.app-sidebar .menu .menu-item > .menu-link .menu-title» с --bs-gray-500 и
      специфичностью (0,5,0). Любое правило короче проигрывает, поэтому ниже все
      селекторы доведены до (0,6,0) и опираются на то, что custom.css грузится
      последним.
   2. Metronic красит .here/.active только при классах .menu-state-bg /
      .menu-here-bg / .menu-active-bg на обёртке меню — у сайдбара их нет.
   3. Токены темы здесь не работают: brand.css объявляет --bs-dark в блоке
      «:root, [data-bs-theme=light]» и не переопределяет его в тёмной теме, а при
      равной специфичности побеждает более поздний файл. Значит --bs-dark почти
      чёрный в ОБЕИХ темах, и парный --bs-dark-inverse (#1E2129 у Metronic в
      тёмной) — тоже. Поэтому цвета заданы литералами.

   Фон сайдбара: bg-light-primary + текстура img_2.png (opacity .4) поверх.
   В светлой теме получается кремовый — нужен тёмный текст; в тёмной
   средне-коричневый — тёмный текст на нём тонет, нужен светлый. */

/* Пункты верхнего уровня, тёмная тема (в светлой цвет задан правилом выше). */
[data-bs-theme="dark"] .app-sidebar .menu > .menu-item > .menu-link,
[data-bs-theme="dark"] .app-sidebar .menu > .menu-item > .menu-link .menu-icon,
[data-bs-theme="dark"] .app-sidebar .menu > .menu-item > .menu-link .menu-icon i,
[data-bs-theme="dark"] .app-sidebar .menu > .menu-item > .menu-link .menu-title {
    color: #F3EDE1;
}

/* Активный раздел: чёрная плашка (правило выше) — текст всегда белый. */
.app-sidebar .menu > .menu-item.here > .menu-link,
.app-sidebar .menu > .menu-item.here > .menu-link .menu-icon,
.app-sidebar .menu > .menu-item.here > .menu-link .menu-icon i,
.app-sidebar .menu > .menu-item.here > .menu-link .menu-title,
[data-bs-theme="dark"] .app-sidebar .menu > .menu-item.here > .menu-link .menu-icon i,
[data-bs-theme="dark"] .app-sidebar .menu > .menu-item.here > .menu-link .menu-title {
    color: #fff;
}
/* Шеврон аккордеона — CSS-маска: красится фоном, а не цветом текста. */
.app-sidebar .menu > .menu-item.here > .menu-link .menu-arrow:after {
    background-color: #fff;
}

/* Подпункты раскрывающегося раздела. */
.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link,
.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link .menu-icon i,
.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link .menu-title {
    color: #4A423B;
}
[data-bs-theme="dark"] .app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link,
[data-bs-theme="dark"] .app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link .menu-icon i,
[data-bs-theme="dark"] .app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link .menu-title {
    color: #E2DACB;
}

.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link:hover {
    background-color: rgba(255, 255, 255, 0.35);
}
[data-bs-theme="dark"] .app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link:hover {
    background-color: rgba(255, 255, 255, 0.12);
}

/* Активный подпункт — золотая плашка с тёмным текстом: читается на кремовом и на
   коричневом одинаково, а золотой ТЕКСТ на текстуре сайдбара сливался бы. */
.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link.active,
[data-bs-theme="dark"] .app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link.active {
    background-color: var(--bs-primary);
}
.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link.active,
.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link.active .menu-icon i,
.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link.active .menu-title,
[data-bs-theme="dark"] .app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link.active .menu-icon i,
[data-bs-theme="dark"] .app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link.active .menu-title {
    color: #231F20;
}
.app-sidebar .menu .menu-sub-accordion .menu-item > .menu-link.active .menu-title {
    font-weight: 700;
}

/* Подпись пользователя в подвале сайдбара: text-gray-500/800 на этом фоне тоже
   не читались — ни в светлой теме, ни в тёмной. */
.app-sidebar-footer .text-gray-500 { color: #6B6155 !important; }
.app-sidebar-footer .text-gray-800 { color: #231F20 !important; }
[data-bs-theme="dark"] .app-sidebar-footer .text-gray-500 { color: #C9C0B0 !important; }
[data-bs-theme="dark"] .app-sidebar-footer .text-gray-800 { color: #F3EDE1 !important; }

/* ── Фирменная «П»-скобка брендбука ──────────────────────────────────────────
   Стилеобразующий элемент, до сих пор объявлявшийся заново в каждом шаблоне
   компонента. Страницы раздела «Финансы» берут её отсюда. */
.ps-bracket { position: relative; padding-left: 18px; }
.ps-bracket::before {
    content: ""; position: absolute; left: 0; top: 2px; bottom: 2px; width: 6px;
    border: 3px solid var(--bs-primary); border-right: 0; border-radius: 3px 0 0 3px;
}
