/* =================================================================
 * Project overrides поверх Metronic style.bundle.css.
 * Загружается ПОСЛЕДНИМ в includes/admin_common.php.
 * См. docs/metronic-migration-plan.md §3.3 и §17.6.6.
 * ================================================================= */

/* === Hebrew font fallback (Stage 1 — постоянно) ===
   Inter не покрывает иврит. Heebo подключаем условно в header.php когда $cur_lang === 'he'. */
:root {
    --bs-font-sans-serif: "Inter", "Heebo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
[dir="rtl"] body {
    font-family: "Heebo", "Inter", system-ui, sans-serif;
}

/* === Sidebar legacy / external badges (уйдёт вместе с sb_sidebar_legacy.css в Stage 5) === */
.menu-link .legacy-badge {
    font-size: .65rem;
    padding: 1px 6px;
}
.menu-item--external .menu-icon::after {
    content: "↗";
    opacity: .6;
    margin-inline-start: 4px;
}

/* === Keenicons arrow RTL flip (§8.1 — для ki-arrow-right в legacy-надписях) === */
[dir="rtl"] .ki-arrow-right { transform: scaleX(-1); }
[dir="rtl"] .ki-arrow-left  { transform: scaleX(-1); }

/* === BRIDGE: z-index magnific-popup (уйдёт в Stage 5 вместе с magnific) === */
.mfp-bg   { z-index: 1090; }
.mfp-wrap { z-index: 1091; }

/* === BRIDGE: legacy .u-hidden утилита (уйдёт в Stage 5 вместе с utilities.css) === */
.u-hidden { display: none; }

/* === Skip-link visible at focus (§17.6.2) === */
.visually-hidden-focusable:focus-visible {
    z-index: 9999 !important;
}

/* === Login error alert visibility (sb_login.js контракт) ===
   sb_login.js toggles класс .login-alert--hidden на #login_error_box
   (showError / hideError). Раньше rule был в sb_login.css (удалён в PR-2.0). */
.login-alert--hidden {
    display: none !important;
}

/* =================================================================
 * Legacy utility .u-hidden (PR-2.1c) — был в utilities.css, удалён в PR-2.0.
 * Возвращаем БЕЗ !important, потому что legacy jQuery .show()/.hide()
 * управляет видимостью через inline style — !important сломал бы их.
 * Удалим вместе с sb_leads.js refactor в Stage 5.
 * ================================================================= */
.u-hidden {
    display: none;
}

/* Bug B (2026-05): bespoke modal shell `.modal[data-lead-modal] .modal__*`
 * удалён — edit/transfer/product/cancel модалки переведены на нативный
 * bootstrap.Modal (как create/payment/comments/files/dnc). `.u-hidden`
 * НЕ удаляем — используется широко (client/* tabs, forms, dropzone). */

/* =================================================================
 * Legacy .info__* / .default-switch shim (PR-5.2).
 *
 * profile/* (14 tab files) и client/* используют legacy BEM-структуру
 * .info__tabs__nav / .info__tab / .info__block с JS-контрактами:
 * [data-tab-group], [data-tab-id], [data-tab-btn], [data-dropdown-parent],
 * [data-dropdown-btn], [data-dropdown-body], [data-dropdown-arrow],
 * [data-dropdown-for], [data-dropdown-id], [data-dropdown-opened],
 * data-fields-container, data-info-tab-mob-*.
 *
 * Минимальный визуальный shim — Metronic card-look для блоков,
 * BS5 nav-tabs-look для tab-nav. Полная миграция profile/client в Stage 6.
 * ================================================================= */
.info__tabs__nav {
    display: flex;
    border-bottom: 1px solid var(--bs-border-color, #e1e3ea);
    margin-bottom: 1.25rem;
    overflow-x: auto;
}
.info__tabs__nav-flex {
    display: flex;
    gap: 0.25rem;
    flex-wrap: nowrap;
}
.info__tabs__nav-item {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    color: var(--bs-gray-700, #4b5675);
    border-bottom: 2px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    transition: color 0.15s, border-color 0.15s;
}
.info__tabs__nav-item:hover {
    color: var(--bs-primary, #1b84ff);
}
.info__tabs__nav-item.active {
    color: var(--bs-primary, #1b84ff);
    border-bottom-color: var(--bs-primary, #1b84ff);
    font-weight: 600;
}
.info__tab {
    display: none;
}
.info__tab.tab-active,
.info__tab.u-block {
    display: block;
}
.info__tab.u-hidden {
    display: none;
}
.info__tab__blocks {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.info__block {
    background: var(--bs-card-bg, #fff);
    border: 1px solid var(--bs-card-border-color, #f1f1f4);
    border-radius: 0.625rem;
    overflow: hidden;
}
.info__block-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--bs-card-border-color, #f1f1f4);
    cursor: pointer;
}
.info__block-title {
    font-weight: 600;
    color: var(--bs-gray-900, #181c32);
    font-size: 1rem;
}
.info__block-main {
    padding: 1.25rem;
}
.info__block-main.u-hidden {
    display: none;
}
.info__block-main.u-block {
    display: block;
}
.info__block-wrap {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}
.info__block-wrap:last-child {
    margin-bottom: 0;
}
.info__block-wrap > .field {
    margin-bottom: 0;
}

/* Tab inner with optional TOC sidebar (client/profile) */
.info__tab-inner {
    display: grid;
    grid-template-columns: 1fr 200px;
    gap: 1.5rem;
    align-items: start;
}
@media (max-width: 991px) {
    .info__tab-inner { grid-template-columns: 1fr; }
}
.info__tab__contents {
    position: sticky;
    top: 1rem;
}
.info__tab__contents-block {
    background: var(--bs-card-bg, #fff);
    border: 1px solid var(--bs-card-border-color, #f1f1f4);
    border-radius: 0.625rem;
    padding: 1rem;
}
.info__tab__contents-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.info__tab__contents-item {
    color: var(--bs-gray-700, #4b5675);
    text-decoration: none;
    padding: 0.25rem 0;
    font-size: 0.9rem;
    border-left: 2px solid transparent;
    padding-left: 0.5rem;
    transition: color 0.15s, border-color 0.15s;
}
.info__tab__contents-item:hover {
    color: var(--bs-primary, #1b84ff);
    border-left-color: var(--bs-primary, #1b84ff);
}
[dir="rtl"] .info__tab__contents-item {
    border-left: 0;
    border-right: 2px solid transparent;
    padding-left: 0;
    padding-right: 0.5rem;
}
[dir="rtl"] .info__tab__contents-item:hover {
    border-right-color: var(--bs-primary, #1b84ff);
}

/* Mobile tab nav (client/profile) — hide by default on desktop */
.info__tab__mob-current,
.info__tab__mob__menu,
.mob-shown {
    display: block;
}
.info__tab__mob-current {
    display: none;
}
@media (max-width: 991px) {
    .info__tab__mob-current {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.75rem 1rem;
        background: var(--bs-light, #f9f9f9);
        border-radius: 0.5rem;
        margin-bottom: 1rem;
        cursor: pointer;
    }
    .info__tab__mob__menu.hidden { display: none; }
}

/* mobnav / mobmenu — bottom bar on mobile only */
.mobnav,
.mobmenu {
    display: none;
}
@media (max-width: 767px) {
    .mobnav {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1030;
        background: #fff;
        border-top: 1px solid var(--bs-border-color, #e1e3ea);
    }
    .mobnav-flex {
        display: flex;
        justify-content: space-around;
        padding: 0.5rem 0;
    }
    .mobnav__item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.25rem;
        font-size: 0.7rem;
        color: var(--bs-gray-600, #78829d);
        cursor: pointer;
    }
    .mobmenu:not(.hidden) {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1040;
        background: #fff;
        overflow-y: auto;
    }
    .mobmenu-header {
        display: flex;
        justify-content: flex-end;
        padding: 1rem;
    }
    .mobmenu-list .mobmenu__item {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        padding: 1rem 1.5rem;
        border-bottom: 1px solid var(--bs-border-color, #e1e3ea);
        cursor: pointer;
    }
    .mobmenu__item.active {
        background: var(--bs-light-primary, #f1faff);
        color: var(--bs-primary, #1b84ff);
    }
}

/* Dropdown arrow rotate by data-dropdown-opened (JS-controlled) */
[data-dropdown-arrow] {
    transition: transform 0.2s;
}
[data-dropdown-opened="false"] [data-dropdown-arrow] {
    transform: rotate(-90deg);
}

/* Legacy .default-switch shim — map to BS5 form-switch styling */
.default-switch-wrap {
    display: inline-block;
}
.default-switch {
    position: relative;
    width: 2.5em;
    height: 1.25em;
}
.default-switch-checkbox {
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}
.default-switch-label {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--bs-gray-300, #c4c5d2);
    border-radius: 999px;
    cursor: pointer;
    transition: background-color 0.15s;
}
.default-switch-checkbox:checked + .default-switch-label {
    background-color: var(--bs-primary, #1b84ff);
}
.default-switch-circle {
    display: block;
    position: absolute;
    top: 2px;
    left: 2px;
    width: calc(1.25em - 4px);
    height: calc(1.25em - 4px);
    background: #fff;
    border-radius: 50%;
    transition: transform 0.15s;
}
.default-switch-checkbox:checked + .default-switch-label .default-switch-circle {
    transform: translateX(calc(1.25em));
}

/* Legacy .default-checkbox shim */
.default-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}
.default-checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}
.default-checkbox-btn {
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    border: 1px solid var(--bs-gray-400, #b1b3c0);
    border-radius: 0.25rem;
    background: #fff;
    flex-shrink: 0;
    position: relative;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}
.default-checkbox input:checked ~ .default-checkbox-label .default-checkbox-btn,
.default-checkbox input:checked + .default-checkbox-label .default-checkbox-btn {
    background: var(--bs-primary, #1b84ff);
    border-color: var(--bs-primary, #1b84ff);
}
.default-checkbox input:checked ~ .default-checkbox-label .default-checkbox-btn::after,
.default-checkbox input:checked + .default-checkbox-label .default-checkbox-btn::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M4 8l3 3 5-7'/%3e%3c/svg%3e");
    background-size: 80% 80%;
    background-position: center;
    background-repeat: no-repeat;
}

/* Legacy .field-row-flex (event create form) */
.field-row-flex {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* =================================================================
 * Legacy .default-table shim (Stage 6).
 * Используется в client/* sub-templates (payment/table.php, tasks/row.php,
 * service_requests/application_menu.php, etc.) и в legacy warning.php. Минимальная
 * Metronic-table-look — .table.table-row-bordered.table-row-dashed.
 * ================================================================= */
.default-table-wrapper {
    overflow-x: auto;
    margin-bottom: 1rem;
}
.default-table {
    width: 100%;
    margin-bottom: 0;
    color: var(--bs-gray-900, #181c32);
    vertical-align: middle;
    border-collapse: collapse;
}
.default-table th,
.default-table td {
    padding: 0.75rem;
    border-top: 1px dashed var(--bs-border-color, #e1e3ea);
    text-align: start;
    vertical-align: middle;
}
.default-table thead th {
    border-top: 0;
    border-bottom: 1px solid var(--bs-border-color, #e1e3ea);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.75rem;
    color: var(--bs-gray-500, #99a1b7);
    letter-spacing: 0.05em;
}
.default-table .table-cell {
    /* table-cell — обёртка из legacy, оставляем inline-block чтобы не ломать flex layouts внутри */
    min-height: 1.5rem;
}

/* =================================================================
 * Legacy magnific-popup .popup shim (Stage 6).
 * .popup.mfp-with-anim.mfp-hide управляется magnific-popup плагином
 * (lib/magnific-popup.css всё ещё подключается через plugins.bundle.css).
 * Здесь — fallback styling для popup-inner/body/text/btns/btn если magnific
 * не загружен или для inline rendering.
 * ================================================================= */
.popup .popup-inner {
    background: #fff;
    border-radius: 0.625rem;
    padding: 1.5rem;
    max-width: 720px;
    margin: 1.5rem auto;
}
.popup .popup-body {
    padding: 0;
}
.popup .popup-text {
    font-weight: 600;
    font-size: 1.125rem;
    color: var(--bs-gray-900, #181c32);
    margin-bottom: 1rem;
}
.popup .popup-btns {
    display: flex;
    gap: 0.5rem;
    margin-top: 1rem;
    flex-wrap: wrap;
}
.popup-btn {
    /* legacy popup-btn class — minimal padding/look */
    padding: 0.55rem 1rem;
}

/* =================================================================
 * Legacy .warning-block (dead-code в client/warning.php, но на случай) */
.warning-block {
    background: var(--bs-light-warning, #fff8dd);
    border: 1px solid var(--bs-warning, #f6c000);
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
}
.warning-block-text {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: 500;
}
.warning-block-dropdown {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px dashed var(--bs-warning, #f6c000);
}

/* =================================================================
 * Legacy .field/.field-input shim (PR-5.1).
 *
 * src/Support/ui_helpers.php → getFildInput/getFildSelect/getFildInfo
 * генерируют HTML с легаси-классами .field/.field-title/.field-input-wrap/
 * .field-input/.field-select/.field-link/.field-actions. JS-контракты:
 * [data-field], [data-field-save], [data-field-copy], [data-field-edit].
 *
 * Используется в profile/* (12 tabs), users/create.php, knowledge_categories.
 * Полная миграция полей вместе с client/* в Stage 6.
 * ================================================================= */
.field {
    margin-bottom: 1rem;
    position: relative;
}
.field-title {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: var(--bs-gray-700, #4b5675);
    font-size: 0.95rem;
}
.field-input-wrap {
    position: relative;
}
.field-input {
    display: block;
    width: 100%;
    padding: 0.55rem 0.75rem;
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--bs-gray-900, #181c32);
    background-color: var(--bs-input-bg, #fff);
    background-clip: padding-box;
    border: 1px solid var(--bs-input-border-color, #dbdfe9);
    border-radius: 0.475rem;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.field-input:focus {
    border-color: var(--bs-primary, #1b84ff);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(27, 132, 255, 0.15);
}
.field-select {
    display: block;
    width: 100%;
    padding: 0.55rem 2.25rem 0.55rem 0.75rem;
    font-size: 0.95rem;
    color: var(--bs-gray-900, #181c32);
    background-color: var(--bs-input-bg, #fff);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
    border: 1px solid var(--bs-input-border-color, #dbdfe9);
    border-radius: 0.475rem;
    appearance: none;
}
.field-link {
    color: var(--bs-gray-900, #181c32);
    text-decoration: none;
}
.field-link:hover {
    color: var(--bs-primary, #1b84ff);
}
.field-actions {
    position: absolute;
    top: 0;
    inset-inline-end: 0.5rem;
    height: 100%;
    display: flex;
    align-items: center;
}
.field-actions-flex {
    display: flex;
    gap: 0.5rem;
}
.field-actions-option {
    width: 24px;
    height: 24px;
    cursor: pointer;
    color: var(--bs-gray-500, #99a1b7);
    display: flex;
    align-items: center;
    justify-content: center;
}
.field-actions-option:hover {
    color: var(--bs-primary, #1b84ff);
}
.field-input-save {
    display: none;
    cursor: pointer;
}
.field-input-save.active,
.field.is-edited .field-input-save {
    display: inline-flex;
}

/* =================================================================
 * Applications custom modal shell (PR-3.4).
 *
 * sb_applications.js использует HTML hidden-атрибут (m.hidden = true/false),
 * не bootstrap.Modal. Контракт: .modal-overlay#modal-{create,edit}-application,
 * .modal-window, .modal-header, .modal-close[data-dismiss="modal"], .modal-footer.
 * Cleanup в Stage 5 при переходе sb_applications.js на bootstrap.Modal API.
 * ================================================================= */
.modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 1055;
    overflow-y: auto;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 1.75rem 1rem;
}
.modal-overlay[hidden] {
    display: none;
}
.modal-overlay .modal-window {
    position: relative;
    width: 100%;
    max-width: 720px;
    background: var(--bs-modal-bg, #fff);
    border-radius: 0.475rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    padding: 1.25rem;
}
.modal-overlay .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #eff2f5;
}
.modal-overlay .modal-footer {
    padding-top: 1rem;
    margin-top: 1rem;
    border-top: 1px solid #eff2f5;
}

/* =================================================================
 * Potential table sticky-cols (PR-3.4).
 *
 * data-sticky-cols на .table указывает количество "примороженных" слева
 * колонок. JS sb_potential.js полагается на .sticky-col class + CSS.
 * Минимальная реализация — sticky positioning.
 * Cleanup в Stage 5 при общем refactor potential.
 * ================================================================= */
.table .sticky-col {
    position: sticky;
    inset-inline-start: 0;
    background: var(--bs-card-bg, #fff);
    z-index: 1;
}

/* Sticky-колонки potential «как в медицине» (зеркало sb_leads.css:92-109 /
 * sb_medical.css:67-90). Офсеты left/right + .potential-sticky-edge ставит
 * sb_potential.js (initStickyColumns) по data-sticky-cols. Scoped на
 * [data-potential-results] — глобальный .table .sticky-col (mortgage) не трогаем. */
[data-potential-results] .table-responsive { overflow-x: auto; }
[data-potential-results] table[data-sticky-cols] .sticky-col {
    position: sticky;
    z-index: 2;
    background-color: #fff;
    /* BS5.3 красит фон ячейки inset-тенью (--bs-table-bg-state); форсим белый. */
    --bs-table-bg-state: #fff;
}
[data-potential-results] table[data-sticky-cols] thead .sticky-col {
    z-index: 3;
    background-color: #fff;
}
[data-potential-results] table[data-sticky-cols] .sticky-col.potential-sticky-edge {
    box-shadow: 2px 0 6px -3px rgba(0, 0, 0, 0.25);
}
[dir="rtl"] [data-potential-results] table[data-sticky-cols] .sticky-col.potential-sticky-edge {
    box-shadow: -2px 0 6px -3px rgba(0, 0, 0, 0.25);
}

/* =================================================================
 * Per-row статус potential «как в /leads/» — цветная пилюля-дропдаун.
 * Цвета фона/точек — inline из $colorStatusArray (table.php), здесь только
 * layout пилюли/меню + кружочки + галочка активного. Зеркало sb_leads.css.
 * ================================================================= */
[data-potential-results] .potential-status-cell { border-radius: 4px; padding: 2px 4px; min-width: 170px; }
[data-potential-results] .potential-status-toggle {
    width: 100%;
    text-align: start;
    padding: .15rem .4rem;
    color: #181c32;
    background: transparent;
    border: 0;
}
[data-potential-results] .potential-status-toggle::after { margin-inline-start: auto; }
[data-potential-results] .potential-status-menu {
    --bs-dropdown-min-width: 11rem;
    --bs-dropdown-font-size: .85rem;
    --bs-dropdown-padding-y: .25rem;
    --bs-dropdown-item-padding-y: .3rem;
    --bs-dropdown-item-padding-x: .6rem;
}
[data-potential-results] .potential-status-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: #181c32;
    cursor: pointer;
    border-radius: 4px;
    line-height: 1.25;
}
[data-potential-results] .potential-status-dot {
    flex: 0 0 auto;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15);
}
[data-potential-results] .potential-status-menu .dropdown-item:hover,
[data-potential-results] .potential-status-menu .dropdown-item:focus {
    background-color: #f4f6fa;
    color: #181c32;
}
[data-potential-results] .potential-status-menu .dropdown-item.active,
[data-potential-results] .potential-status-menu .dropdown-item.active:hover {
    background-color: #e9edf5;
    color: #181c32;
    font-weight: 600;
}
[data-potential-results] .potential-status-menu .dropdown-item.active .potential-status-opt-label::before {
    content: "\2713";
    margin-inline-end: .35rem;
    font-weight: 700;
}

/* =================================================================
 * Dashboard knowledge-search dropdown (PR-2.3).
 *
 * sb_dashboard.js toggles класс .is-open на #knowledge_search_result для
 * показа/скрытия выпадающего списка предложений. Раньше rule был в
 * sb_dashboard.css (удалён в PR-2.3). Контракт: .is-open → display:block.
 * ================================================================= */
.dashboard__knowledge-result {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    inset-inline-start: 0;
    inset-inline-end: 0;
    margin: 0;
    padding: 0.5rem 0;
    background: #fff;
    border: 1px solid var(--bs-border-color, #e1e3ea);
    border-radius: 0.475rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.075);
    max-height: 320px;
    overflow-y: auto;
    z-index: 30;
}
.dashboard__knowledge-result.is-open {
    display: block;
}
.dashboard__knowledge-result li,
.dashboard__knowledge-result a {
    display: block;
    padding: 0.5rem 1rem;
    color: var(--bs-gray-900, #181c32);
    text-decoration: none;
    font-size: 0.95rem;
    line-height: 1.4;
}
.dashboard__knowledge-result a:hover,
.dashboard__knowledge-result li:hover {
    background: var(--bs-light, #f1f4f9);
}

/* =================================================================
 * Sidebar containment fix (PR-1.3 hot-fix).
 *
 * KTScroll-skript на #kt_app_sidebar_wrapper переключает inner
 * #kt_app_sidebar_menu в position:fixed с inline width, рассчитанной
 * не от sidebar (280px), а от что-то типа кэшированного viewport-width
 * → menu и его .menu-sub-accordion children растягиваются за пределы
 * sidebar.app-sidebar и накладываются поверх #kt_app_header.
 *
 * Симптомы: click на header dropdown ловится sidebar-аккордеоном
 * ("subtree intercepts pointer events from .menu-accordion").
 *
 * Fix: жёстко ограничить ширину inner menu = ширине родителя.
 * overflow:hidden на #kt_app_sidebar — defense-in-depth.
 * ================================================================= */
#kt_app_sidebar {
    overflow: hidden;
}
#kt_app_sidebar_menu {
    width: 100% !important;
    max-width: 100%;
    position: relative !important;
}

/* =================================================================
 * RTL layout overrides (план §17.3).
 *
 * Metronic v8.3.3 demo39 distribution не содержит готового RTL CSS bundle
 * (только webpack-плагин в tools/webpack/plugins/rtl/, который требует пересборки).
 * style.bundle.css использует physical свойства (left/right), не logical
 * (inset-inline-*), поэтому RTL НЕ авто-флипается.
 *
 * Здесь — минимальный набор override-ов, чтобы:
 *   - sidebar выехал к правому краю в RTL,
 *   - wrapper отступал справа (а не слева),
 *   - footer сдвигался от sidebar в RTL (push-footer).
 *
 * Header теперь full-width across the top (push-header снят, sidebar
 * автоматически уходит на top: var(--bs-app-header-height) по stock-правилу
 * style.bundle.css:49004), поэтому header RTL override больше не нужен.
 *
 * Триггеры: те же атрибуты body, что и Metronic-stock, плюс [dir="rtl"]
 * на <html>. Specificity точно совпадает со stock-rule (5 атрибут-селекторов)
 * + [dir="rtl"] для перебивания. См. style.bundle.css:48942 / 49014.
 * ================================================================= */
[dir="rtl"] [data-kt-app-sidebar-fixed="true"] .app-sidebar {
    left: auto;
    right: 0;
}
/* Только ≥lg: stock-правила wrapper/footer в бандле живут внутри
 * @media (min-width: 992px) — без этого условия margin-right: 280px
 * оставался и на mobile (сайдбар в drawer за экраном), сжимая весь
 * контент до (viewport − 280px). См. docs/qa/mobile-rtl-audit-2026-07.md BUG-001. */
@media (min-width: 992px) {
    [dir="rtl"] [data-kt-app-sidebar-enabled="true"][data-kt-app-sidebar-fixed="true"] .app-wrapper {
        margin-left: 0;
        margin-right: calc(var(--bs-app-sidebar-width) + var(--bs-app-sidebar-gap-start, 0px) + var(--bs-app-sidebar-gap-end, 0px));
    }
    [dir="rtl"] [data-kt-app-sidebar-fixed="true"][data-kt-app-sidebar-push-footer="true"] .app-footer {
        left: 0;
        right: calc(var(--bs-app-sidebar-width) + var(--bs-app-sidebar-gap-start, 0px) + var(--bs-app-sidebar-gap-end, 0px));
    }
}

/* ─── RTL: дропдаун пользователя в шапке (#kt_header_user_menu_toggle) ─────────
 * Бандл — LTR-сборка: physical me-* и .menu-icon margin-right не флипаются под
 * dir=rtl, из-за чего в иврите аватар/иконки/языковой бейдж едут не на ту сторону.
 * Скоуп строго под user-menu, чтобы не задеть остальной .me-*/.menu по всему app.
 * (Плейсменты дропдаунов зеркалятся в top_menu.php через $isRtl.) */
[dir="rtl"] #kt_header_user_menu_toggle .me-5 { margin-right: 0 !important; margin-left: 1.25rem !important; }
[dir="rtl"] #kt_header_user_menu_toggle .me-3 { margin-right: 0 !important; margin-left: 0.75rem !important; }
[dir="rtl"] #kt_header_user_menu_toggle .me-2 { margin-right: 0 !important; margin-left: 0.5rem !important; }
[dir="rtl"] #kt_header_user_menu_toggle .menu-item .menu-link .menu-icon {
    margin-right: 0;
    margin-left: 0.5rem;
}
/* Языковой бейдж (.position-absolute.end-0) в пункте «Язык» — прижать к левому краю. */
[dir="rtl"] #kt_header_user_menu_toggle .menu-title .position-absolute.end-0 {
    right: auto !important;
    left: 0 !important;
}

/* ─── RTL: айтемы дропдаунов уведомлений/комментариев/сообщений ────────────────
 * Айтемы рендерятся в sb_admin.js с физическими классами (ps-2 pe-9, end-0, me-2,
 * me-3). Бандл — LTR-сборка: .end-0 = right:0 (не флипается) → крестик удаления и
 * иконка оказываются не на той стороне. Скоуп — три списочных контейнера. */
[dir="rtl"] #notifications .position-relative,
[dir="rtl"] #comments-hand-ass .position-relative,
[dir="rtl"] #message_notifications_list .position-relative {
    padding-right: 0.5rem !important;  /* было ps-2 */
    padding-left: 2.25rem !important;  /* было pe-9 — резерв под крестик слева */
}
[dir="rtl"] #notifications .position-absolute.end-0,
[dir="rtl"] #comments-hand-ass .position-absolute.end-0,
[dir="rtl"] #message_notifications_list .position-absolute.end-0 {
    right: auto !important;
    left: 0 !important;
    margin-right: 0 !important;        /* было me-2 */
    margin-left: 0.5rem !important;
}
[dir="rtl"] #notifications .symbol.me-3,
[dir="rtl"] #comments-hand-ass .symbol.me-3,
[dir="rtl"] #message_notifications_list .symbol.me-3 {
    margin-right: 0 !important;
    margin-left: 0.75rem !important;   /* иконка справа в RTL */
}

/* ─── Knowledge create/edit shim (Stage 7 PR-7.1) ─────────────────────────
 * .youtube-inputs / .youtube-link_input / .add-youtube-link — used by sb_knowledge.js
 *   to add/remove dynamic YouTube link inputs in article forms.
 * .permitions-row / .permition-details — radio-group + nested detail blocks
 *   driven by .checkbox-perm change handler.
 * Old layout relied on default block flow + utilities.css; here we restore
 * minimal spacing so fields don't visually collide.
 * ──────────────────────────────────────────────────────────────────────── */
.youtube-inputs {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.youtube-inputs .add-youtube-link {
    align-self: flex-start;
    color: var(--bs-primary, #1b84ff);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
}
.youtube-inputs .add-youtube-link:hover {
    opacity: 0.75;
}
.youtube-link_input {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.youtube-link_input .field-input {
    flex: 1;
}
.permitions-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    margin: 0.5rem 0 0.75rem;
}
.permition-details {
    margin-top: 0.75rem;
}
.cursor-pointer {
    cursor: pointer;
}

/*
 * Глобальный cursor:pointer для интерактивных UI-элементов CRM.
 * Этот файл (custom.css) грузится последним на каждой admin-странице, поэтому
 * правила применяются единообразно во всех модулях (включая «Календарь курсов»).
 * .btn в Bootstrap 5 уже имеет cursor:pointer — здесь добиваем формы/чекбоксы/
 * радио/свитчи/селекты и явно помеченные кликабельные элементы.
 */
.form-check-input,
.form-check-label,
.form-select,
select,
input[type="radio"],
input[type="checkbox"],
.form-switch .form-check-input,
[role="button"],
.clickable {
    cursor: pointer;
}
/* Заблокированные контролы — обычный курсор */
.form-check-input:disabled,
.form-check-input[disabled],
.form-select:disabled,
select:disabled,
input[type="radio"]:disabled,
input[type="checkbox"]:disabled {
    cursor: default;
}

/* =================================================================
 * allowed_ips / blocked_ips: .invalid-feedback в однострочной toolbar-форме
 * (row align-items-end) не должен раздвигать строку при показе ошибки.
 * Десктоп (≥768px) — позиционируем сообщение абсолютно под полем (соседние
 * колонки и кнопка не сдвигаются); мобильный (поля стекаются) — обычный поток.
 * ================================================================= */
@media (min-width: 768px) {
    .ip-toolbar-field { position: relative; }
    .ip-toolbar-field > .invalid-feedback {
        position: absolute;
        top: 100%;
        inset-inline: 0;        /* RTL-safe */
        margin-top: 0.15rem;
    }
}

/* =================================================================
 *  Волна 5 — RTL/mobile хвосты аудита (docs/qa/mobile-rtl-audit-2026-07.md).
 *  Финальную проверку overflow/tap-target-инвариантов даёт `npm run test:audit`
 *  (нужен vhost 7souls_new.loc + БД) — здесь аддитивные mobile-only правила по
 *  подтверждённым селекторам, без риска регрессии на desktop.
 * ================================================================= */

/* BUG-008: остаточный горизонтальный overflow на mobile. Гасим точечно у
 * подтверждённых виновников: pagination-goto (+130px), select2 (+107px). */
@media (max-width: 991px) {
    .pagination-goto {
        flex-wrap: wrap;
        max-width: 100%;
    }
    .pagination-goto input,
    .pagination-goto .form-control {
        max-width: 5rem;
    }
    /* Select2 не должен раздвигать страницу шире viewport. */
    .select2-container {
        max-width: 100% !important;
    }
    .select2-container .select2-selection--single,
    .select2-container .select2-selection--multiple {
        max-width: 100%;
    }
}

/* BUG-010: tap-targets ≥40px на mobile (чекбоксы строк, пагинация, сортировка).
 * Аддитивно — увеличиваем hit-area, не трогая desktop-вёрстку. */
@media (max-width: 991px) {
    .page-link {
        min-width: 40px;
        min-height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .form-check-input {
        min-width: 1.25rem;
        min-height: 1.25rem;
    }
    .leads-sort-link,
    .offers-sort-link,
    .potential-sort-link {
        min-height: 40px;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }
}