/*
 * theme.css — наш слой кастомизации Bootstrap 5.
 *
 * Заменяет те `--bs-*` переменные, которые Venix переопределял, чтобы
 * после переезда на чистый Bootstrap сохранить «наш вид» (палитра,
 * типографика, радиусы).
 *
 * Загружается ПОСЛЕ base (template.css в venix / bootstrap.min.css
 * в fresh) — override базового слоя.
 *
 * Источник: блок `:root` и `[data-bs-theme=dark]` из template.css
 * (Bootstrap 5.3.7, скомпилированный с Venix-переменными). Сюда
 * перенесено только то, что отличается от дефолта чистого Bootstrap.
 *
 * Что НЕ здесь:
 *   - layout-переменные (`--bs-sidebar-*`, `--bs-topbar-*`, `--bs-footer-*`)
 *     — в `app-layout.css`;
 *   - компонентные переменные (`--bs-btn-*`, `--bs-card-*` и т.д.) —
 *     добавляются по мере аудита, если Venix-кастомизация реально нужна.
 */

/* ─── Палитра: light ──────────────────────────────────────── */
:root,
[data-bs-theme=light] {
    --app-header-bg: rgba(var(--bs-body-color-rgb), 0.04);

    /* Палитра Venix (заменяет bootstrap-дефолт) */
    --bs-blue: #5dd89e;
    --bs-indigo: #615fff;
    --bs-purple: #ad46ff;
    --bs-pink: #f6339a;
    --bs-red: #fb2c36;
    --bs-orange: #ff6900;
    --bs-yellow: #efb100;
    --bs-green: #00c951;
    --bs-teal: #00bba7;
    --bs-cyan: #00b8db;

    /* Семантические цвета */
    --bs-primary: #5dd89e;
    --bs-secondary: #ad46ff;
    --bs-success: #00c951;
    --bs-info: #00b8db;
    --bs-warning: #efb100;
    --bs-danger: #fb2c36;
    --bs-light: #f0f4f7;
    --bs-dark: #00081A;

    --bs-primary-rgb: 93, 216, 158;
    --bs-secondary-rgb: 173, 70, 255;
    --bs-success-rgb: 0, 201, 81;
    --bs-info-rgb: 0, 184, 219;
    --bs-warning-rgb: 239, 177, 0;
    --bs-danger-rgb: 251, 44, 54;
    --bs-light-rgb: 240, 244, 247;
    --bs-dark-rgb: 0, 8, 26;

    /* Subtle-фоны (bg-{color}-subtle) */
    --bs-primary-bg-subtle: #dff7ec;
    --bs-secondary-bg-subtle: #efdaff;
    --bs-success-bg-subtle: #ccf4dc;
    --bs-info-bg-subtle: #ccf1f8;
    --bs-warning-bg-subtle: #fcefcc;
    --bs-danger-bg-subtle: #fed5d7;
    --bs-light-bg-subtle: #fcfcfd;
    --bs-dark-bg-subtle: #ced4da;

    /* Subtle-бордеры (border-{color}-subtle) */
    --bs-primary-border-subtle: #beefd8;
    --bs-secondary-border-subtle: #deb5ff;
    --bs-success-border-subtle: #99e9b9;
    --bs-info-border-subtle: #99e3f1;
    --bs-warning-border-subtle: #f9e099;
    --bs-danger-border-subtle: #fdabaf;
    --bs-light-border-subtle: #f0f4f7;
    --bs-dark-border-subtle: #adb5bd;

    /* Emphasis-текст (text-{color}-emphasis) */
    --bs-primary-text-emphasis: #25563f;
    --bs-secondary-text-emphasis: #451c66;
    --bs-success-text-emphasis: #005020;
    --bs-info-text-emphasis: #004a58;
    --bs-warning-text-emphasis: #604700;
    --bs-danger-text-emphasis: #641216;
    --bs-light-text-emphasis: #4a5a6b;
    --bs-dark-text-emphasis: #4a5a6b;

    /* ─── Типографика ─── */
    --bs-font-sans-serif: "Roboto", sans-serif;
    --bs-body-font-size: 0.875rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;

    /* ─── Body ─── */
    --bs-body-color: #4a5a6b;
    --bs-body-color-rgb: 74, 90, 107;
    --bs-body-bg: #F3F5F9;
    --bs-body-bg-rgb: 243, 245, 249;
    --bs-secondary-color: rgba(74, 90, 107, 0.75);
    --bs-secondary-color-rgb: 74, 90, 107;
    --bs-tertiary-color: rgba(74, 90, 107, 0.5);
    --bs-tertiary-color-rgb: 74, 90, 107;

    /* Фоны компонентов */
    --bs-secondary-bg: #fff;
    --bs-secondary-bg-rgb: 255, 255, 255;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248, 249, 250;
    --bs-heading-color: inherit;

    /* ─── Ссылки ─── */
    --bs-link-color: #5dd89e;
    --bs-link-color-rgb: 93, 216, 158;
    --bs-link-decoration: none;
    --bs-link-hover-color: #4aad7e;
    --bs-link-hover-color-rgb: 74, 173, 126;

    /* ─── Рамки / радиусы / тени ─── */
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 8, 26, 0.175);
    --bs-border-radius: 0.325rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;

    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-box-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);

    /* ─── Формы ─── */
    --bs-focus-ring-width: 0;
    --bs-focus-ring-opacity: 0.25;
    --bs-focus-ring-color: rgba(93, 216, 158, 0.25);
    --bs-form-valid-color: #00c951;
    --bs-form-valid-border-color: #00c951;
    --bs-form-invalid-color: #fb2c36;
    --bs-form-invalid-border-color: #fb2c36;

    /* Прочее */
    --bs-code-color: #f6339a;
    --bs-highlight-color: #4a5a6b;
    --bs-highlight-bg: #fcefcc;
}

/* ─── Палитра: dark ─────────────────────────────────────── */
[data-bs-theme=dark] {
    color-scheme: dark;

    --bs-body-color: #dee2e6;
    --bs-body-color-rgb: 222, 226, 230;
    --bs-body-bg: #101014;
    --bs-body-bg-rgb: 16, 16, 20;
    --bs-emphasis-color: #fff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-secondary-color: rgba(222, 226, 230, 0.75);
    --bs-secondary-color-rgb: 222, 226, 230;
    --bs-tertiary-color: rgba(222, 226, 230, 0.5);
    --bs-tertiary-color-rgb: 222, 226, 230;
    --bs-secondary-bg: #1f2028;
    --bs-secondary-bg-rgb: 31, 32, 40;
    --bs-tertiary-bg: #1a212d;
    --bs-tertiary-bg-rgb: 26, 33, 45;

    --bs-primary-text-emphasis: #9ee8c5;
    --bs-secondary-text-emphasis: #ce90ff;
    --bs-success-text-emphasis: #66df97;
    --bs-info-text-emphasis: #66d4e9;
    --bs-warning-text-emphasis: #f5d066;
    --bs-danger-text-emphasis: #fd8086;
    --bs-light-text-emphasis: #f8f9fa;
    --bs-dark-text-emphasis: #dee2e6;

    --bs-primary-bg-subtle: #132b20;
    --bs-secondary-bg-subtle: #230e33;
    --bs-success-bg-subtle: #002810;
    --bs-info-bg-subtle: #00252c;
    --bs-warning-bg-subtle: #302300;
    --bs-danger-bg-subtle: #32090b;
    --bs-light-bg-subtle: #343a40;
    --bs-dark-bg-subtle: #1a1d20;

    --bs-primary-border-subtle: #38825f;
    --bs-secondary-border-subtle: #682a99;
    --bs-success-border-subtle: #007931;
    --bs-info-border-subtle: #006e83;
    --bs-warning-border-subtle: #8f6a00;
    --bs-danger-border-subtle: #971a20;
    --bs-light-border-subtle: #4a5a6b;
    --bs-dark-border-subtle: #343a40;

    --bs-heading-color: inherit;
    --bs-link-color: #9ee8c5;
    --bs-link-hover-color: #b1edd1;
    --bs-link-color-rgb: 158, 232, 197;
    --bs-link-hover-color-rgb: 177, 237, 209;
    --bs-code-color: #fa85c2;
    --bs-highlight-color: #dee2e6;
    --bs-highlight-bg: #604700;
    --bs-border-color: #4a5a6b;
    --bs-border-color-translucent: #323d4b;
    --bs-form-valid-color: #66df97;
    --bs-form-valid-border-color: #66df97;
    --bs-form-invalid-color: #fd8086;
    --bs-form-invalid-border-color: #fd8086;
}

/* ─── Card — Venix-стилизация ──────────────────────────────── */
.card {
    --bs-card-spacer-y: 1rem;
    --bs-card-spacer-x: 1.25rem;
    --bs-card-cap-padding-x: 1.25rem;
    --bs-card-cap-bg: var(--app-header-bg);
    --bs-card-bg: var(--bs-secondary-bg);
    --bs-card-border-width: 0;
    --bs-card-inner-border-radius: var(--bs-border-radius-lg);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
    margin-bottom: 1.25rem;
    border-radius: var(--bs-border-radius-lg);
    overflow: hidden;
}

.card-header {
    --bs-card-cap-padding-y: 0.625rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 3.5rem;
}

.card-body {
    border-radius: var(--bs-border-radius-lg);
}

.card-title {
    font-size: 15px;
    font-weight: 500;
}

/* ─── Dark: переопределения, специфичные для Venix ────────── */
/*
 * В light эти переменные = дефолт Bootstrap (`#00081A` / `#f0f4f7`),
 * в Venix-dark — инвертированы. Без этого `.text-dark` в dark-теме
 * даёт почти чёрный (не видно на #1f2028), иконки topbar выглядят
 * «выключенными».
 */
[data-bs-theme=dark] {
    --bs-light-rgb: 74, 90, 107;
    --bs-dark: #f0f4f7;
    --bs-dark-rgb: 206, 212, 218;
}

/* ═══════════════════════════════════════════════════════════════════
 * Компонентные переопределения (Venix-стилизация)
 *
 * Bootstrap 5.3.7 скомпилирован с дефолтными цветами. Venix пересобрал
 * его с нашей палитрой, поэтому в свежем bootstrap:
 *   - .btn-primary синий (#0d6efd) — не наследует --bs-primary (хардкод);
 *   - .form-control padding/font-size — дефолтные;
 *   - spacing-шкала 0.25/0.5/1/1.5/3 — дефолт (Venix = 0.3/0.6/1.2/1.8/3.6);
 *   - .dropdown-menu фон/шрифт/отступы — дефолтные;
 *   - .breadcrumb-item > a — цвет ссылки (наш зелёный) вместо body-color.
 *
 * Всё это — тут, чтобы `?bs=fresh` выглядел как `?bs=venix`.
 * ═══════════════════════════════════════════════════════════════════ */

/* ─── Ссылки без подчёркивания ─────────────────────────────── */
a,
.link-primary, .link-secondary, .link-success, .link-info,
.link-warning, .link-danger, .link-light, .link-dark,
.link-body-emphasis {
    text-decoration: none;
}
a:hover { text-decoration: none; }

/* ─── Хлебные крошки: ссылки цветом body, не зелёные ──────── */
.breadcrumb-item > a {
    color: var(--bs-body-color);
}

/* ─── Avatar sizes (Venix, в Bootstrap нет) ────────────────── */
.avatar-xs { height: 1.5rem; width: 1.5rem; }
.avatar-sm { height: 2.25rem; width: 2.25rem; }
.avatar-md { height: 3.5rem; width: 3.5rem; }
.avatar-lg { height: 4.5rem; width: 4.5rem; }
.avatar-xl { height: 6rem; width: 6rem; }
.avatar-xxl { height: 7.5rem; width: 7.5rem; }
.avatar-person { height: 42px; width: 42px; }
.avatar-title {
    align-items: center;
    color: #fff;
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
}

/* ─── Кнопки: переопределение на Venix-палитру ─────────────── */
/* Bootstrap hard-code'ит --bs-btn-bg, --bs-btn-border-color в #0d6efd
   для .btn-primary и т.д. Переопределяем на наши цвета + hover-shade
   (Bootstrap затемняет на ~7.5% для hover; сохраняем тот же подход). */

.btn-primary {
    --bs-btn-bg: #5dd89e;
    --bs-btn-border-color: #5dd89e;
    --bs-btn-hover-bg: #54c28e;
    --bs-btn-hover-border-color: #54c28e;
    --bs-btn-active-bg: #54c28e;
    --bs-btn-active-border-color: #54c28e;
    --bs-btn-focus-shadow-rgb: 117, 222, 173;
    --bs-btn-disabled-bg: #5dd89e;
    --bs-btn-disabled-border-color: #5dd89e;
}
.btn-secondary {
    --bs-btn-bg: #ad46ff;
    --bs-btn-border-color: #ad46ff;
    --bs-btn-hover-bg: #9c3fe6;
    --bs-btn-hover-border-color: #9c3fe6;
    --bs-btn-active-bg: #9c3fe6;
    --bs-btn-active-border-color: #9c3fe6;
    --bs-btn-focus-shadow-rgb: 185, 98, 255;
    --bs-btn-disabled-bg: #ad46ff;
    --bs-btn-disabled-border-color: #ad46ff;
}
.btn-success {
    --bs-btn-bg: #00c951;
    --bs-btn-border-color: #00c951;
    --bs-btn-hover-bg: #00b549;
    --bs-btn-hover-border-color: #00b549;
    --bs-btn-active-bg: #00b549;
    --bs-btn-active-border-color: #00b549;
    --bs-btn-focus-shadow-rgb: 38, 209, 107;
    --bs-btn-disabled-bg: #00c951;
    --bs-btn-disabled-border-color: #00c951;
}
.btn-info {
    --bs-btn-color: #fff;                       /* bootstrap: #000 */
    --bs-btn-bg: #00b8db;
    --bs-btn-border-color: #00b8db;
    --bs-btn-hover-color: #fff;                 /* bootstrap: #000 */
    --bs-btn-hover-bg: #00a6c5;
    --bs-btn-hover-border-color: #00a6c5;
    --bs-btn-active-color: #fff;                /* bootstrap: #000 */
    --bs-btn-active-bg: #00a6c5;
    --bs-btn-active-border-color: #00a6c5;
    --bs-btn-focus-shadow-rgb: 38, 195, 224;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #00b8db;
    --bs-btn-disabled-border-color: #00b8db;
}
.btn-warning {
    --bs-btn-color: #fff;                       /* bootstrap: #000 */
    --bs-btn-bg: #efb100;
    --bs-btn-border-color: #efb100;
    --bs-btn-hover-color: #fff;                 /* bootstrap: #000 */
    --bs-btn-hover-bg: #d79f00;
    --bs-btn-hover-border-color: #d79f00;
    --bs-btn-active-color: #fff;                /* bootstrap: #000 */
    --bs-btn-active-bg: #d79f00;
    --bs-btn-active-border-color: #d79f00;
    --bs-btn-focus-shadow-rgb: 241, 189, 38;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #efb100;
    --bs-btn-disabled-border-color: #efb100;
}
.btn-danger {
    --bs-btn-bg: #fb2c36;
    --bs-btn-border-color: #fb2c36;
    --bs-btn-hover-bg: #e22831;
    --bs-btn-hover-border-color: #e22831;
    --bs-btn-active-bg: #e22831;
    --bs-btn-active-border-color: #e22831;
    --bs-btn-focus-shadow-rgb: 252, 76, 84;
    --bs-btn-disabled-bg: #fb2c36;
    --bs-btn-disabled-border-color: #fb2c36;
}
.btn-light {
    --bs-btn-color: #000;
    --bs-btn-bg: #f0f4f7;
    --bs-btn-border-color: #f0f4f7;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #d8dcde;
    --bs-btn-hover-border-color: #d8dcde;
    --bs-btn-active-bg: #d8dcde;
    --bs-btn-active-border-color: #d8dcde;
    --bs-btn-focus-shadow-rgb: 204, 207, 210;
    --bs-btn-disabled-bg: #f0f4f7;
    --bs-btn-disabled-border-color: #f0f4f7;
}
.btn-dark {
    --bs-btn-bg: #00081A;
    --bs-btn-border-color: #00081A;
    --bs-btn-hover-bg: #1a2131;
    --bs-btn-hover-border-color: #1a2131;
    --bs-btn-active-bg: #333948;
    --bs-btn-active-border-color: #1a2131;
    --bs-btn-focus-shadow-rgb: 38, 45, 60;
    --bs-btn-disabled-bg: #00081A;
    --bs-btn-disabled-border-color: #00081A;
}

/* Outline-кнопки (цвет = var, bg прозрачный) */
.btn-outline-primary   { --bs-btn-color: #5dd89e; --bs-btn-border-color: #5dd89e; --bs-btn-hover-bg: #5dd89e; --bs-btn-hover-border-color: #5dd89e; --bs-btn-active-bg: #5dd89e; --bs-btn-active-border-color: #5dd89e; --bs-btn-focus-shadow-rgb: 93, 216, 158; --bs-btn-disabled-color: #5dd89e; --bs-btn-disabled-border-color: #5dd89e; }
.btn-outline-secondary { --bs-btn-color: #ad46ff; --bs-btn-border-color: #ad46ff; --bs-btn-hover-bg: #ad46ff; --bs-btn-hover-border-color: #ad46ff; --bs-btn-active-bg: #ad46ff; --bs-btn-active-border-color: #ad46ff; --bs-btn-focus-shadow-rgb: 173, 70, 255; --bs-btn-disabled-color: #ad46ff; --bs-btn-disabled-border-color: #ad46ff; }
.btn-outline-success   { --bs-btn-color: #00c951; --bs-btn-border-color: #00c951; --bs-btn-hover-bg: #00c951; --bs-btn-hover-border-color: #00c951; --bs-btn-active-bg: #00c951; --bs-btn-active-border-color: #00c951; --bs-btn-focus-shadow-rgb: 0, 201, 81; --bs-btn-disabled-color: #00c951; --bs-btn-disabled-border-color: #00c951; }
.btn-outline-info      { --bs-btn-color: #00b8db; --bs-btn-border-color: #00b8db; --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #00b8db; --bs-btn-hover-border-color: #00b8db; --bs-btn-active-color: #fff; --bs-btn-active-bg: #00b8db; --bs-btn-active-border-color: #00b8db; --bs-btn-focus-shadow-rgb: 0, 184, 219; --bs-btn-disabled-color: #00b8db; --bs-btn-disabled-border-color: #00b8db; }
.btn-outline-warning   { --bs-btn-color: #efb100; --bs-btn-border-color: #efb100; --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #efb100; --bs-btn-hover-border-color: #efb100; --bs-btn-active-color: #fff; --bs-btn-active-bg: #efb100; --bs-btn-active-border-color: #efb100; --bs-btn-focus-shadow-rgb: 239, 177, 0; --bs-btn-disabled-color: #efb100; --bs-btn-disabled-border-color: #efb100; }
.btn-outline-danger    { --bs-btn-color: #fb2c36; --bs-btn-border-color: #fb2c36; --bs-btn-hover-bg: #fb2c36; --bs-btn-hover-border-color: #fb2c36; --bs-btn-active-bg: #fb2c36; --bs-btn-active-border-color: #fb2c36; --bs-btn-focus-shadow-rgb: 251, 44, 54; --bs-btn-disabled-color: #fb2c36; --bs-btn-disabled-border-color: #fb2c36; }

/* Кнопка-иконка (Venix, в Bootstrap нет) */
.btn-icon.btn-sm,
.btn-group-sm > .btn-icon.btn {
    width: 1.75rem;
    height: 1.75rem;
    font-size: 0.8rem;
    padding: 0.1875rem;
    border: none;
    border-radius: 5px !important;
    color: var(--bs-secondary-color) !important;
    background-color: var(--bs-light);
}
.btn-icon.btn-sm:hover { color: var(--bs-primary) !important; background-color: rgba(93, 216, 158, 0.15) !important; }

/* ─── Form-control / form-select / form-check ──────────────── */
.form-control {
    padding: 0.47rem 0.665rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    background-color: var(--bs-secondary-bg);       /* ← ключевое: белый, не серый */
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-gray-400);
    border-radius: 0.325rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.form-control::placeholder { color: var(--bs-gray-500); opacity: 0.3; }
.form-control:focus { border-color: var(--bs-primary); box-shadow: none; }
.form-control:disabled { background-color: var(--bs-tertiary-bg); opacity: 1; }

.form-select {
    padding: 0.47rem 1.995rem 0.47rem 0.665rem;
    font-size: 0.875rem;
    color: var(--bs-body-color);
    background-color: var(--bs-secondary-bg);       /* ← то же */
    background-size: 14px 10px;
    background-position: right 0.665rem center;
    border: var(--bs-border-width) solid var(--bs-gray-400);
    border-radius: 0.325rem;
}
.form-select:focus { border-color: var(--bs-primary); box-shadow: none; }

.form-check-input { --bs-form-check-bg: var(--bs-secondary-bg); }
.form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}
.form-check-input:focus {
    border-color: var(--bs-primary);
    box-shadow: none;
}

/* ─── Spacing-шкала (Venix: 0.3/0.6/1.2/1.8/3.6) ──────────── */
/* Bootstrap: 0.25/0.5/1/1.5/3. Переопределяем базовые (без
   breakpoint'ов `-sm/md/lg/xl/xxl` — они редко используются и
   дадут ещё 60+ строк). */
.m-1 { margin: 0.3rem !important; }  .m-2 { margin: 0.6rem !important; }  .m-3 { margin: 1.2rem !important; }  .m-4 { margin: 1.8rem !important; }  .m-5 { margin: 3.6rem !important; }
.mx-1 { margin-right: 0.3rem !important; margin-left: 0.3rem !important; }  .mx-2 { margin-right: 0.6rem !important; margin-left: 0.6rem !important; }  .mx-3 { margin-right: 1.2rem !important; margin-left: 1.2rem !important; }  .mx-4 { margin-right: 1.8rem !important; margin-left: 1.8rem !important; }  .mx-5 { margin-right: 3.6rem !important; margin-left: 3.6rem !important; }
.my-1 { margin-top: 0.3rem !important; margin-bottom: 0.3rem !important; }  .my-2 { margin-top: 0.6rem !important; margin-bottom: 0.6rem !important; }  .my-3 { margin-top: 1.2rem !important; margin-bottom: 1.2rem !important; }  .my-4 { margin-top: 1.8rem !important; margin-bottom: 1.8rem !important; }  .my-5 { margin-top: 3.6rem !important; margin-bottom: 3.6rem !important; }
.mt-1 { margin-top: 0.3rem !important; }  .mt-2 { margin-top: 0.6rem !important; }  .mt-3 { margin-top: 1.2rem !important; }  .mt-4 { margin-top: 1.8rem !important; }  .mt-5 { margin-top: 3.6rem !important; }
.me-1 { margin-right: 0.3rem !important; }  .me-2 { margin-right: 0.6rem !important; }  .me-3 { margin-right: 1.2rem !important; }  .me-4 { margin-right: 1.8rem !important; }  .me-5 { margin-right: 3.6rem !important; }
.mb-1 { margin-bottom: 0.3rem !important; }  .mb-2 { margin-bottom: 0.6rem !important; }  .mb-3 { margin-bottom: 1.2rem !important; }  .mb-4 { margin-bottom: 1.8rem !important; }  .mb-5 { margin-bottom: 3.6rem !important; }
.ms-1 { margin-left: 0.3rem !important; }  .ms-2 { margin-left: 0.6rem !important; }  .ms-3 { margin-left: 1.2rem !important; }  .ms-4 { margin-left: 1.8rem !important; }  .ms-5 { margin-left: 3.6rem !important; }

.p-1 { padding: 0.3rem !important; }  .p-2 { padding: 0.6rem !important; }  .p-3 { padding: 1.2rem !important; }  .p-4 { padding: 1.8rem !important; }  .p-5 { padding: 3.6rem !important; }
.px-1 { padding-right: 0.3rem !important; padding-left: 0.3rem !important; }  .px-2 { padding-right: 0.6rem !important; padding-left: 0.6rem !important; }  .px-3 { padding-right: 1.2rem !important; padding-left: 1.2rem !important; }  .px-4 { padding-right: 1.8rem !important; padding-left: 1.8rem !important; }  .px-5 { padding-right: 3.6rem !important; padding-left: 3.6rem !important; }
.py-1 { padding-top: 0.3rem !important; padding-bottom: 0.3rem !important; }  .py-2 { padding-top: 0.6rem !important; padding-bottom: 0.6rem !important; }  .py-3 { padding-top: 1.2rem !important; padding-bottom: 1.2rem !important; }  .py-4 { padding-top: 1.8rem !important; padding-bottom: 1.8rem !important; }  .py-5 { padding-top: 3.6rem !important; padding-bottom: 3.6rem !important; }
.pt-1 { padding-top: 0.3rem !important; }  .pt-2 { padding-top: 0.6rem !important; }  .pt-3 { padding-top: 1.2rem !important; }  .pt-4 { padding-top: 1.8rem !important; }  .pt-5 { padding-top: 3.6rem !important; }
.pe-1 { padding-right: 0.3rem !important; }  .pe-2 { padding-right: 0.6rem !important; }  .pe-3 { padding-right: 1.2rem !important; }  .pe-4 { padding-right: 1.8rem !important; }  .pe-5 { padding-right: 3.6rem !important; }
.pb-1 { padding-bottom: 0.3rem !important; }  .pb-2 { padding-bottom: 0.6rem !important; }  .pb-3 { padding-bottom: 1.2rem !important; }  .pb-4 { padding-bottom: 1.8rem !important; }  .pb-5 { padding-bottom: 3.6rem !important; }
.ps-1 { padding-left: 0.3rem !important; }  .ps-2 { padding-left: 0.6rem !important; }  .ps-3 { padding-left: 1.2rem !important; }  .ps-4 { padding-left: 1.8rem !important; }  .ps-5 { padding-left: 3.6rem !important; }

.gap-1 { gap: 0.3rem !important; }  .gap-2 { gap: 0.6rem !important; }  .gap-3 { gap: 1.2rem !important; }  .gap-4 { gap: 1.8rem !important; }  .gap-5 { gap: 3.6rem !important; }

/* Негативные margin — симметрично override'ам выше (bootstrap: -0.25/-0.5/-1/-1.5/-3) */
.m-n1 { margin: -0.3rem !important; }  .m-n2 { margin: -0.6rem !important; }  .m-n3 { margin: -1.2rem !important; }  .m-n4 { margin: -1.8rem !important; }  .m-n5 { margin: -3.6rem !important; }
.mx-n1 { margin-right: -0.3rem !important; margin-left: -0.3rem !important; }  .mx-n2 { margin-right: -0.6rem !important; margin-left: -0.6rem !important; }  .mx-n3 { margin-right: -1.2rem !important; margin-left: -1.2rem !important; }  .mx-n4 { margin-right: -1.8rem !important; margin-left: -1.8rem !important; }  .mx-n5 { margin-right: -3.6rem !important; margin-left: -3.6rem !important; }
.my-n1 { margin-top: -0.3rem !important; margin-bottom: -0.3rem !important; }  .my-n2 { margin-top: -0.6rem !important; margin-bottom: -0.6rem !important; }  .my-n3 { margin-top: -1.2rem !important; margin-bottom: -1.2rem !important; }  .my-n4 { margin-top: -1.8rem !important; margin-bottom: -1.8rem !important; }  .my-n5 { margin-top: -3.6rem !important; margin-bottom: -3.6rem !important; }
.mt-n1 { margin-top: -0.3rem !important; }  .mt-n2 { margin-top: -0.6rem !important; }  .mt-n3 { margin-top: -1.2rem !important; }  .mt-n4 { margin-top: -1.8rem !important; }  .mt-n5 { margin-top: -3.6rem !important; }
.me-n1 { margin-right: -0.3rem !important; }  .me-n2 { margin-right: -0.6rem !important; }  .me-n3 { margin-right: -1.2rem !important; }  .me-n4 { margin-right: -1.8rem !important; }  .me-n5 { margin-right: -3.6rem !important; }
.mb-n1 { margin-bottom: -0.3rem !important; }  .mb-n2 { margin-bottom: -0.6rem !important; }  .mb-n3 { margin-bottom: -1.2rem !important; }  .mb-n4 { margin-bottom: -1.8rem !important; }  .mb-n5 { margin-bottom: -3.6rem !important; }
.ms-n1 { margin-left: -0.3rem !important; }  .ms-n2 { margin-left: -0.6rem !important; }  .ms-n3 { margin-left: -1.2rem !important; }  .ms-n4 { margin-left: -1.8rem !important; }  .ms-n5 { margin-left: -3.6rem !important; }

/* ─── Dropdown-menu ─────────────────────────────────────────── */
.dropdown-menu {
    --bs-dropdown-min-width: 11rem;                                    /* bootstrap: 10rem */
    --bs-dropdown-bg: var(--bs-secondary-bg);
    --bs-dropdown-border-color: var(--bs-border-color);                /* bootstrap: -translucent */
    --bs-dropdown-border-radius: 0.325rem;
    --bs-dropdown-inner-border-radius: calc(0.325rem - var(--bs-border-width));
    --bs-dropdown-divider-bg: var(--bs-border-color);                  /* bootstrap: -translucent */
    --bs-dropdown-font-size: 0.875rem;
    --bs-dropdown-link-color: var(--bs-body-color);
    --bs-dropdown-link-hover-color: var(--bs-body-color);
    --bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);
    --bs-dropdown-link-active-color: var(--bs-body-color);             /* bootstrap: #fff */
    --bs-dropdown-link-active-bg: var(--bs-tertiary-bg);               /* bootstrap: var(--bs-primary) */
    --bs-dropdown-link-disabled-color: var(--bs-body-color);           /* bootstrap: var(--bs-tertiary-color) */
    --bs-dropdown-item-padding-y: 0.4rem;
    --bs-dropdown-item-padding-x: 0.9rem;
    --bs-dropdown-header-color: inherit;                               /* bootstrap: var(--bs-secondary-color) */
    --bs-dropdown-header-padding-y: 0.5rem;
    --bs-dropdown-header-padding-x: 0.675rem;
}
/* Venix: стрелки у dropdown-toggle нет */
.dropdown-toggle::after { display: none; }

/* ─── Кастомные размеры шрифта (Venix, вне Bootstrap) ──────── */
.fs-11 { font-size: 11px !important; }
.fs-12 { font-size: 12px !important; }
.fs-13 { font-size: 13px !important; }
.fs-14 { font-size: 14px !important; }
.fs-15 { font-size: 15px !important; }
.fs-16 { font-size: 16px !important; }
.fs-17 { font-size: 17px !important; }
.fs-18 { font-size: 18px !important; }
.fs-19 { font-size: 19px !important; }
.fs-20 { font-size: 20px !important; }
.fs-22 { font-size: 22px !important; }
.fs-24 { font-size: 24px !important; }
.fs-26 { font-size: 26px !important; }
.fs-28 { font-size: 28px !important; }

/* ─── Container gutter (Venix: 1.25rem вместо bootstrap 1.5rem) ─── */
.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
    --bs-gutter-x: 1.25rem;
}

.row {
    --bs-gutter-x: 1.25rem;    /* bootstrap: 1.5rem */
}

/* ─── Заголовки (Venix пересобрал с меньшими размерами) ─────────── */
h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    margin-top: 0;
    margin-bottom: 0.6rem;                          /* bootstrap: 0.5rem */
    font-weight: 500;
    line-height: 1.2;
    color: var(--bs-heading-color);
}

h1, .h1 { font-size: calc(1.34375rem + 1.125vw); }
@media (min-width: 1200px) { h1, .h1 { font-size: 2.1875rem; } }

h2, .h2 { font-size: calc(1.3rem + 0.6vw); }
@media (min-width: 1200px) { h2, .h2 { font-size: 1.75rem; } }

h3, .h3 { font-size: calc(1.278125rem + 0.3375vw); }
@media (min-width: 1200px) { h3, .h3 { font-size: 1.53125rem; } }

h4, .h4 { font-size: calc(1.25625rem + 0.075vw); }
@media (min-width: 1200px) { h4, .h4 { font-size: 1.3125rem; } }

h5, .h5 { font-size: 1.09375rem; }
h6, .h6 { font-size: 0.875rem; }

/* ─── Dark: Venix-переопределения через html[] (специфичнее) ─────
 *
 * Bootstrap ставит dark-переменные на `[data-bs-theme=dark]` (0,1,0),
 * Venix — на `html[data-bs-theme=dark]` (0,1,1). Поэтому часть
 * переменных (border-color, gray-400, tertiary-bg) в Venix отличаются
 * от bootstrap-дефолта и требуют html-селектора. Здесь — только
 * отличия; остальное (body-color, secondary-bg, tertiary-color) уже
 * в блоке `[data-bs-theme=dark]` выше.
 */
html[data-bs-theme=dark] {
    --bs-body-color: #ced4da;                       /* bootstrap: #dee2e6 */
    --bs-tertiary-bg: #343a40;                      /* bootstrap: #1a212d */
    --bs-border-color: #343a40;                     /* bootstrap: #4a5a6b, Venix: темнее */
    --bs-gray-400: #343a40;                         /* border .form-control */
    --bs-heading-color: #ced4da;
    --bs-light: #252630 !important;
    --bs-bg-light: #2a2b34 !important;
    --bs-card-bg: #1f2028;
    --bs-noti-mentioned-bg: #2a2b34;
    --bs-topbar-search-bg: #2a2b34;
    --bs-chart-border-color: #343a40;
    --bs-event-dark: #101014;
    --bs-event-dark-color: #adb5bd;
    --bs-contact-list-header-color: #1f2028;
}

/* ─── Кнопки: базовый .btn + размеры (Venix vs bootstrap) ──── */
.btn {
    --bs-btn-padding-x: 0.95rem;                 /* bootstrap: 0.75rem */
    --bs-btn-padding-y: 0.47rem;                 /* bootstrap: 0.375rem */
    --bs-btn-font-size: 0.875rem;                /* bootstrap: 1rem */
    --bs-btn-line-height: 1.5;
    --bs-btn-border-radius: var(--bs-border-radius-sm);
}

.btn-sm, .btn-group-sm > .btn {
    --bs-btn-padding-y: 0.25rem;
    --bs-btn-padding-x: 0.5rem;
    --bs-btn-font-size: 0.765625rem;             /* bootstrap: 0.875rem */
    --bs-btn-border-radius: var(--bs-border-radius-sm);
}

.btn-lg, .btn-group-lg > .btn {
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: 1.09375rem;              /* bootstrap: 1.25rem */
    --bs-btn-border-radius: var(--bs-border-radius-lg);
}

/* ─── Таблицы ──────────────────────────────────────────────── */
.table {
    --bs-table-color: var(--bs-body-color);                         /* bootstrap: emphasis */
    --bs-table-bg: var(--bs-secondary-bg);                          /* bootstrap: body-bg (серый) */
    --bs-table-border-color: var(--bs-border-color);
    --bs-table-striped-color: var(--bs-body-color);
    --bs-table-striped-bg: rgba(var(--bs-emphasis-color-rgb), 0.02);/* bootstrap: 0.05 */
    --bs-table-active-color: var(--bs-body-color);
    --bs-table-active-bg: rgba(var(--bs-emphasis-color-rgb), 0.05); /* bootstrap: 0.1 */
    --bs-table-hover-color: var(--bs-body-color);
    --bs-table-hover-bg: rgba(243, 245, 249, 0.5);                  /* bootstrap: emphasis 0.075 */
    margin-bottom: 1.2rem;                                          /* bootstrap: 1rem */
}

/* Последняя строка без нижнего бордера (Venix) */
.table tbody tr:last-child td {
    border-bottom: none;
}

/* Dark-режим для table-light (Venix) */
html[data-bs-theme=dark] .table-light {
    --bs-table-color: #ffffff;
    --bs-table-bg: #2a2b34;
    --bs-table-border-color: #ced4da;
    --bs-table-striped-bg: #363845;
    --bs-table-striped-color: #ffffff;
    --bs-table-active-bg: #ced4da;
    --bs-table-active-color: #ffffff;
    --bs-table-hover-bg: #3b3d4a;
    --bs-table-hover-color: #ffffff;
}

/* ─── Checkbox / Radio ─────────────────────────────────────── */
.form-check {
    display: block;
    min-height: 1.3125rem;                /* bootstrap: 1.5rem */
    padding-left: 1.612em;                /* bootstrap: 1.5em */
    margin-bottom: 0;                     /* bootstrap: 0.125rem */
}
.form-check .form-check-input {
    float: left;
    margin-left: -1.612em;                /* bootstrap: -1.5em */
}

.form-check-input {
    --bs-form-check-bg: var(--bs-secondary-bg);   /* bootstrap: body-bg */
    flex-shrink: 0;
    width: 1.112em;                       /* bootstrap: 1em */
    height: 1.112em;
    margin-top: 0.194em;                  /* bootstrap: 0.25em */
    vertical-align: top;
    appearance: none;
    background-color: var(--bs-form-check-bg);
    background-image: var(--bs-form-check-bg-image);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: var(--bs-border-width) solid var(--bs-border-color-translucent);
    print-color-adjust: exact;
}

/* Bootstrap hard-code'ит #0d6efd (не через --bs-primary) в этих состояниях */
.form-check-input:checked {
    background-color: #5dd89e;
    border-color: #5dd89e;
}
.form-check-input[type=checkbox]:indeterminate {
    background-color: #5dd89e;
    border-color: #5dd89e;
}

.form-check-input:focus {
    border-color: var(--bs-primary);
    outline: 0;
    box-shadow: 0 0 0 0 rgba(93, 216, 158, 0.25);    /* bootstrap: 0.25rem синяя */
}

/* Switch: focus-ring (Bootstrap даёт синий кружок, Venix — прозрачный) */
.form-switch .form-check-input:focus {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='none'/%3e%3c/svg%3e");
}

/* ─── Select-sm / Select-lg (font-size, radius) ───────────── */
.form-select-sm {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 0.5rem;
    font-size: 0.765625rem;               /* bootstrap: 0.875rem */
    border-radius: 0.25rem;               /* bootstrap: var(--bs-border-radius-sm) */
}
.form-select-lg {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    font-size: 1.09375rem;                /* bootstrap: 1.25rem */
    border-radius: 0.5rem;                /* bootstrap: var(--bs-border-radius-lg) */
}

/* ─── Alerts ───────────────────────────────────────────────── */
.alert {
    --bs-alert-padding-y: 0.9rem;             /* bootstrap: 1rem */
    --bs-alert-padding-x: 1.2rem;             /* bootstrap: 1rem */
    --bs-alert-margin-bottom: 1rem;
    --bs-alert-border-radius: var(--bs-border-radius);
}

.alert-dismissible {
    padding-right: 3.6rem;                    /* bootstrap: 3rem */
}
.alert-dismissible .btn-close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    padding: 1.125rem 1.2rem;                 /* bootstrap: 1.25rem 1rem */
}

/* ─── Admin layout (community/admin/*) ─────────────────────── */
.admin-container .admin-sidebar .nav-link {
    border-radius: 0.375rem;
    padding: 0.55rem 0.8rem;
    position: relative;
    display: flex;
    align-items: center;
    font-weight: 500;
}
.admin-container .admin-sidebar .nav-link:hover,
.admin-container .admin-sidebar .nav-link.active {
    color: var(--bs-primary);
}
.admin-container .admin-sidebar .nav-link.active {
    background-color: rgba(93, 216, 158, 0.1);
}
.admin-container .admin-content {
    width: 100%;
}

@media (min-width: 992px) {
    .admin-sidebar {
        min-width: 17rem;
    }
}
@media (min-width: 767px) and (max-width: 1023.98px) {
    .admin-sidebar {
        float: none;
        min-width: 17rem;
    }
    .admin-content {
        margin: 0;
    }
}
@media (max-width: 568px) {
    .admin-sidebar {
        float: none;
        width: 100%;
    }
}

/* ─── bg-light / bg-dark: цвет из CSS-переменной, не из -rgb ─────
 *
 * Bootstrap: `.bg-light { background: rgba(var(--bs-light-rgb), 1) }`.
 *   В dark-теме `--bs-light-rgb` = `240, 244, 247` (из bootstrap) — светлый.
 *   У Venix `--bs-light` в dark = `#252630` (тёмный), но `-rgb` НЕ меняется.
 *   → в `bg-light` (badge «Есть места», «Опубликовано») в dark-теме
 *     bootstrap даёт светлый фон вместо тёмного.
 *
 * Venix: `.bg-light { background: var(--bs-light) }` — читает `--bs-light`
 *   напрямую. В light `#f0f4f7`, в dark `#252630`. Работает везде.
 */
.bg-light {
    background-color: var(--bs-light) !important;
}

/* Симметрично для bg-dark. Bootstrap: rgba(var(--bs-dark-rgb), 1).
 * Через переменные `.bg-dark` в light `#00081A`, в dark `#ced4da` —
 * совпадает с Venix (там `.bg-dark` не переопределён, но переменные
 * `--bs-dark-rgb` правильные, так что явный override не нужен).
 *
 * Оставляем только `.bg-light` — там баг из-за расхождения
 * `--bs-light` vs `--bs-light-rgb` в dark.
 */

/* ─── Color / Range inputs — минимальная высота ────────────── */
/*
 * Bootstrap `.form-control-color` даёт height ≈ 38px (calc с 0.94rem
 * padding). Venix форсирует 39px — выравнивает с соседними input'ами
 * в формах (у которых height = 1.5em + 0.94rem + 2px = 38.04px, но
 * color-picker часто «съезжает» на пиксель из-за пипетки браузера).
 *
 * `.form-range` (Bootstrap) — 16px (height: 1rem). Если используется
 * на `.form-control` — тоже 39px.
 */
input.form-control[type=color],
input.form-control[type=range] {
    min-height: 39px;
}

/* ─── col-form-label: выравнивание по padding input'а ─────── */
/*
 * `.col-form-label` — label в горизонтальной форме. Bootstrap: 0.375rem,
 * Venix: 0.47rem (совпадает с `.form-control` padding-y). Без этого
 * label «съезжает» относительно input'а в горизонтальных формах.
 * `line-height` в bootstrap тоже 1.5 — совпадает, не трогаем.
 */
.col-form-label {
    padding-top: calc(0.47rem + var(--bs-border-width));
    padding-bottom: calc(0.47rem + var(--bs-border-width));
    margin-bottom: 0;
    font-size: inherit;
    line-height: 1.5;
}

.col-form-label-lg {
    padding-top: calc(0.5rem + var(--bs-border-width));
    padding-bottom: calc(0.5rem + var(--bs-border-width));
    font-size: 1.09375rem;               /* bootstrap: 1.25rem */
}

.col-form-label-sm {
    padding-top: calc(0.25rem + var(--bs-border-width));
    padding-bottom: calc(0.25rem + var(--bs-border-width));
    font-size: 0.765625rem;              /* bootstrap: 0.875rem */
}

/* ─── Nav / Tabs ───────────────────────────────────────────── */
.nav {
    --bs-nav-link-padding-x: 1rem;
    --bs-nav-link-padding-y: 0.5rem;
    --bs-nav-link-font-weight: ;
    --bs-nav-link-color: var(--bs-body-color);            /* bootstrap: link-color (зелёный) */
    --bs-nav-link-hover-color: var(--bs-link-hover-color);
    --bs-nav-link-disabled-color: var(--bs-secondary-color);
}

.nav-link {
    display: block;
    padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
    font-weight: var(--bs-nav-link-font-weight);
    color: var(--bs-nav-link-color);
    background: none;
    border: 0;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
.nav-link:hover, .nav-link:focus {
    color: var(--bs-nav-link-hover-color);
}
.nav-link:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0 rgba(93, 216, 158, 0.25);        /* bootstrap: 0.25rem синяя */
}

.nav-underline {
    --bs-nav-underline-gap: 1rem;
    --bs-nav-underline-border-width: 0.125rem;
    --bs-nav-underline-link-active-color: var(--bs-primary);  /* bootstrap: emphasis */
    gap: var(--bs-nav-underline-gap);
}
.nav-underline .nav-link {
    padding-right: 0;
    padding-left: 0;
    border-bottom: var(--bs-nav-underline-border-width) solid transparent;
}
.nav-underline .nav-link:hover, .nav-underline .nav-link:focus {
    border-bottom-color: currentcolor;
}
.nav-underline .nav-link.active, .nav-underline .show > .nav-link {
    font-weight: 700;
    color: var(--bs-nav-underline-link-active-color);
    border-bottom-color: currentcolor;
}

/* Venix-кастом: подчёркивание табов в карточках (см. _common/_tabs.html.twig) */
.nav-tabs-custom {
    border-bottom: 2px solid #f0f4f7;
}

/* ─── Modal ────────────────────────────────────────────────── */
/*
 * Bootstrap: --bs-modal-padding 1rem, --bs-modal-bg = body-bg (серый),
 * header-padding 1rem, color не задан.
 * Venix: padding 1.2rem, bg = secondary-bg (белый), header 1.2rem,
 * color = body-color. Остальные переменные (radius, footer-gap,
 * border-color, box-shadow) — совпадают.
 */
.modal {
    --bs-modal-padding: 1.2rem;
    --bs-modal-color: var(--bs-body-color);
    --bs-modal-bg: var(--bs-secondary-bg);
    --bs-modal-header-padding-x: 1.2rem;
    --bs-modal-header-padding-y: 1.2rem;
    --bs-modal-header-padding: 1.2rem 1.2rem;
}

.modal-title {
    margin-top: 0;
}

/* ═══════════════════════════════════════════════════════════════════
 * Auth pages (login, ya_auth_token)
 *
 * Venix-блок, в bootstrap отсутствует. Если не перенести — в fresh
 * логин «голый»: фон без картинки, форма не отцентрирована,
 * saprator без линий.
 *
 * Путь `../images/bg-2.png` — относительно `assets/css/` → `assets/images/`.
 * Если файла нет — фон не покажется (asset, не CSS).
 * ═══════════════════════════════════════════════════════════════════ */

/* ─── Общий фон страницы (bg-2.png) ─────────────────────────── */
.body-color {
    background-image: url("../images/bg-2-Kba9JEJ.png");
    background-size: cover;
    background-position: center center;
    display: flex;
    justify-content: center;
}

/* ─── Account page ──────────────────────────────────────────── */
.account-page {
    align-items: center;
    display: flex;
    background: var(--bs-body-bg);
}
.account-page .account-page-bg {
    background-size: cover;
    background-position: center center;
    min-height: 890px;
    display: flex;
    justify-content: center;
}
.account-page .account-page-bg .auth-image {
    max-width: 800px;
    margin: auto;
}
.account-page .login-pattern {
    align-items: center;
    display: flex;
    position: relative;
}

/* ─── Заголовок auth-секции ─────────────────────────────────── */
.auth-title-section h3,
.auth-title-section .h3 {
    font-size: 25px;
}

/* ─── Кнопки соц-логина ─────────────────────────────────────── */
.header-box {
    background-color: #5dd89e;
}
.auth-button a {
    color: #00081A;
    font-weight: 500;
    border: 1px solid var(--bs-gray-400);
}

/* ─── Saprator — «─── или ───» ──────────────────────────────── */
.saprator {
    position: relative;
    text-align: center;
}
.saprator::before {
    content: "";
    position: absolute;
    left: 0;
    width: 110px;
    top: 50%;
    height: 1px;
    background: #e5eaef;
}
.saprator::after {
    content: "";
    position: absolute;
    right: 0;
    width: 110px;
    top: 50%;
    height: 1px;
    background: #e5eaef;
}

/* ─── Auth marketing-блок (отзывы, лид) ─────────────────────── */
.auth-user-review {
    color: var(--bs-body-bg);
    text-align: center;
    padding: 0 1.75rem;
    margin: 0 auto;
}
.auth-user-review .carousel-images {
    margin: 0 auto;
    max-width: 400px;
}
.auth-user-review .prelead {
    margin: 0 auto;
    font-size: 1.125rem;
    text-align: center;
    max-width: 600px;
}

/* ─── Логотип в auth (dark-mode переключение) ──────────────── */
.auth-brand span.logo-lg {
    display: block;
}
.auth-brand .logo-light {
    display: none;
}

/* ─── Input group ──────────────────────────────────────────── */
/*
 * Bootstrap `.input-group-text` — padding 0.375/0.75, font-size 1rem,
 * border-color: --bs-border-color. Venix выравнивает с .form-control:
 * padding 0.47/0.665, font-size 0.875, border-color: --bs-gray-400.
 * Без этого префикс/суффикс инпута «выше» и «крупнее» инпута.
 */
.input-group-text {
    padding: 0.47rem 0.665rem;
    font-size: 0.875rem;
    border-color: var(--bs-gray-400);
}

/* Размерные варианты: Bootstrap даёт 1.25rem / 0.875rem, Venix — меньше */
.input-group-lg > .form-control,
.input-group-lg > .form-select,
.input-group-lg > .input-group-text,
.input-group-lg > .btn {
    font-size: 1.09375rem;
}

.input-group-sm > .form-control,
.input-group-sm > .form-select,
.input-group-sm > .input-group-text,
.input-group-sm > .btn {
    font-size: 0.765625rem;
}