/* ===========================================================================
   XCONTROL — дизайн-слой поверх jazzmin (AdminLTE 3 / Bootstrap 4).
   Всё строится на токенах из :root — чтобы сменить фирменный цвет,
   достаточно поменять --xc-brand и производные от него.
   =========================================================================== */

:root {
    /* Фирменные цвета (из логотипа) */
    --xc-brand: #1BAFD0;
    --xc-brand-strong: #1796B3;
    --xc-brand-soft: #E8F7FB;
    --xc-brand-contrast: #ffffff;
    --xc-red: #E8392D;
    --xc-red-strong: #CC2C21;
    --xc-red-soft: #FDECEA;

    /* Семантика */
    --xc-success: #16A34A;
    --xc-success-soft: #E7F6ED;
    --xc-warning: #D97706;
    --xc-warning-soft: #FDF3E3;
    --xc-info: var(--xc-brand);
    --xc-info-soft: var(--xc-brand-soft);
    --xc-blue: #1D4ED8;
    --xc-blue-soft: #E8EFFD;
    --xc-amber: #B45309;
    --xc-amber-soft: #FDF3E3;

    /* Поверхности */
    --xc-bg: #F4F6FA;
    --xc-surface: #FFFFFF;
    /* Вторичные кнопки. Белая кнопка на белой карточке неразличима, поэтому
       даём заливку и рамку с контрастом 3:1 к белому (минимум WCAG для UI). */
    --xc-neutral: #E6EBF2;
    --xc-neutral-hover: #D7DEE8;
    --xc-neutral-border: #8A94A3;
    --xc-surface-muted: #F9FAFC;
    --xc-sidebar: #0E1826;
    --xc-sidebar-raised: #16233A;

    /* Текст */
    --xc-text: #1F2937;
    --xc-text-muted: #6B7280;
    --xc-text-faint: #9AA3AF;
    --xc-sidebar-text: #AEBACD;

    /* Границы */
    --xc-border: #E4E8EF;
    --xc-border-strong: #D3D9E3;

    /* Тени — мягкие, многослойные */
    --xc-shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);
    --xc-shadow: 0 1px 3px rgba(16, 24, 40, .07), 0 1px 2px rgba(16, 24, 40, .04);
    --xc-shadow-md: 0 4px 12px rgba(16, 24, 40, .08), 0 2px 4px rgba(16, 24, 40, .04);
    --xc-shadow-lg: 0 12px 32px rgba(16, 24, 40, .12), 0 4px 8px rgba(16, 24, 40, .05);

    /* Геометрия */
    --xc-radius-sm: 6px;
    --xc-radius: 8px;
    --xc-radius-lg: 12px;

    --xc-focus-ring: 0 0 0 3px rgba(27, 175, 208, .25);
    --xc-transition: 140ms cubic-bezier(.4, 0, .2, 1);
}

/* ---------------------------------------------------------------- Базовое */

html {
    /* было 75% (12px) — всё выглядело сжатым; 14px даёт плотность без мелкоты */
    font-size: 87.5%;
}

body,
.wrapper {
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--xc-text);
    background-color: var(--xc-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--xc-text);
    font-weight: 600;
    letter-spacing: -.01em;
}

h1 { font-size: 1.6rem; }

a {
    color: var(--xc-brand-strong);
    transition: color var(--xc-transition);
}

a:hover,
a:focus {
    color: var(--xc-brand);
    text-decoration: none;
}

code, pre, .text-monospace {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
}

::selection {
    background: rgba(27, 175, 208, .22);
}

/* Единый фокус вместо браузерного контура */
.form-control:focus,
.btn:focus,
.custom-select:focus,
.select2-container--default .select2-selection--single:focus,
a.nav-link:focus-visible,
button:focus-visible {
    outline: none;
    box-shadow: var(--xc-focus-ring);
}

/* Аккуратный скроллбар */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--xc-border-strong) transparent;
}

*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }

*::-webkit-scrollbar-thumb {
    background: var(--xc-border-strong);
    border: 3px solid transparent;
    border-radius: 8px;
    background-clip: content-box;
}

*::-webkit-scrollbar-thumb:hover { background-color: var(--xc-text-faint); background-clip: content-box; }

/* ---------------------------------------------------------------- Сайдбар */

.main-sidebar,
.main-sidebar .sidebar,
body.sidebar-mini .main-sidebar {
    background-color: var(--xc-sidebar) !important;
}

.main-sidebar {
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, .06);
}

.main-sidebar .brand-link {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .9rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, .07) !important;
    background-color: transparent !important;
    font-weight: 650;
    letter-spacing: .02em;
    color: #fff !important;
}

/* Логотип — на белой подложке, иначе jpg тонет в тёмном сайдбаре */
.main-sidebar .brand-image {
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 2px;
    object-fit: contain;
    background: #fff;
    border-radius: var(--xc-radius-sm);
    box-shadow: var(--xc-shadow-sm);
    opacity: 1 !important;
    float: none;
}

.main-sidebar .brand-text {
    font-size: 1.05rem;
    font-weight: 650;
}

.sidebar {
    padding: 0 .6rem 1rem;
}

.nav-sidebar .nav-header {
    padding: 1.1rem .75rem .4rem;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--xc-text-faint);
}

.nav-sidebar .nav-link {
    display: flex;
    align-items: center;
    margin-bottom: 2px;
    padding: .5rem .7rem;
    border-radius: var(--xc-radius);
    color: var(--xc-sidebar-text) !important;
    font-size: .95rem;
    font-weight: 500;
    transition: background-color var(--xc-transition), color var(--xc-transition);
}

.nav-sidebar .nav-link .nav-icon {
    width: 1.5rem;
    margin-right: .35rem;
    font-size: .95rem;
    text-align: center;
    color: var(--xc-text-faint);
    transition: color var(--xc-transition);
}

.nav-sidebar .nav-link:hover {
    background-color: var(--xc-sidebar-raised) !important;
    color: #fff !important;
}

.nav-sidebar .nav-link:hover .nav-icon {
    color: var(--xc-brand);
}

.nav-sidebar .nav-link.active,
.nav-sidebar .nav-treeview .nav-link.active {
    background: linear-gradient(90deg, rgba(27, 175, 208, .22), rgba(27, 175, 208, .08)) !important;
    box-shadow: inset 3px 0 0 var(--xc-brand);
    color: #fff !important;
    font-weight: 600;
}

.nav-sidebar .nav-link.active .nav-icon,
.nav-sidebar .nav-treeview .nav-link.active .nav-icon {
    color: var(--xc-brand);
}

.nav-sidebar .nav-treeview .nav-link {
    padding-left: 1.6rem;
    font-size: .92rem;
}

.sidebar .user-panel {
    margin-bottom: .4rem;
    padding: .85rem .35rem;
    border-bottom: 1px solid rgba(255, 255, 255, .07) !important;
}

.sidebar .user-panel .info a {
    color: #fff !important;
    font-weight: 550;
}

.sidebar .form-control-sidebar {
    background: var(--xc-sidebar-raised);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: var(--xc-radius);
    color: #fff;
}

.sidebar .form-control-sidebar::placeholder { color: var(--xc-text-faint); }

/* ------------------------------------------------------------------ Шапка */

.main-header.navbar {
    min-height: 56px;
    padding: 0 .5rem;
    background-color: var(--xc-surface) !important;
    border-bottom: 1px solid var(--xc-border) !important;
    box-shadow: var(--xc-shadow-sm);
}

.main-header .nav-link {
    color: var(--xc-text-muted) !important;
    font-weight: 500;
    border-radius: var(--xc-radius);
    transition: background-color var(--xc-transition), color var(--xc-transition);
}

.main-header .nav-link:hover {
    background-color: var(--xc-surface-muted);
    color: var(--xc-text) !important;
}

.main-header .form-control-navbar {
    background: var(--xc-surface-muted);
    border: 1px solid var(--xc-border);
    border-right: 0;
    border-radius: var(--xc-radius) 0 0 var(--xc-radius);
}

.main-header .btn-navbar {
    background: var(--xc-surface-muted);
    border: 1px solid var(--xc-border);
    border-left: 0;
    border-radius: 0 var(--xc-radius) var(--xc-radius) 0;
    color: var(--xc-text-muted);
}

.dropdown-menu {
    padding: .35rem;
    border: 1px solid var(--xc-border);
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow-lg);
}

.dropdown-item {
    border-radius: var(--xc-radius-sm);
    padding: .45rem .7rem;
    font-size: .95rem;
    transition: background-color var(--xc-transition);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--xc-brand-soft);
    color: var(--xc-brand-strong);
}

/* -------------------------------------------------- Заголовок страницы */

.content-wrapper {
    background-color: var(--xc-bg) !important;
}

/* Шапка страницы: убираем «разделительную палку» и делаем крошки вторичными */
.content-wrapper > .content.border-bottom {
    margin-bottom: 0 !important;
    padding: 1.1rem 0 .9rem;
    background: var(--xc-surface);
    border-bottom: 1px solid var(--xc-border) !important;
}

.content-wrapper > .content.border-bottom h1 {
    margin: 0 !important;
    padding-right: 0 !important;
    border-right: 0 !important;
    font-size: 1.35rem;
    font-weight: 650;
}

.content-wrapper > .content.border-bottom .col-12 {
    flex-wrap: wrap;
    gap: .35rem 1rem;
}

.breadcrumb {
    margin: 0;
    padding: 0;
    background: transparent;
    font-size: .9rem;
}

.breadcrumb-item,
.breadcrumb-item a {
    color: var(--xc-text-muted);
}

.breadcrumb-item.active {
    color: var(--xc-text-faint);
}

.breadcrumb-item + .breadcrumb-item::before {
    color: var(--xc-border-strong);
    content: "/";
}

.content {
    padding: 1.25rem .5rem;
}

/* --------------------------------------------------------------- Карточки */

.card {
    margin-bottom: 1.25rem;
    background: var(--xc-surface);
    border: 1px solid var(--xc-border);
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow);
    transition: box-shadow var(--xc-transition);
}

.card:hover {
    box-shadow: var(--xc-shadow-md);
}

.card-header {
    padding: .9rem 1.15rem;
    background: transparent;
    border-bottom: 1px solid var(--xc-border);
    border-radius: var(--xc-radius-lg) var(--xc-radius-lg) 0 0 !important;
    font-weight: 600;
}

.card-header .card-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.card-body {
    padding: 1.15rem;
}

.card-footer {
    background: var(--xc-surface-muted);
    border-top: 1px solid var(--xc-border);
    border-radius: 0 0 var(--xc-radius-lg) var(--xc-radius-lg);
}

/* Цветные шапки карточек из AdminLTE смягчаем до фирменного градиента */
.card-header.bg-primary,
.card-primary:not(.card-outline) > .card-header {
    background: linear-gradient(135deg, var(--xc-brand), var(--xc-brand-strong)) !important;
    border-bottom: 0;
    color: #fff !important;
}

/* --------------------------------------------------------------- Таблицы */

.table {
    margin-bottom: 0;
    color: var(--xc-text);
}

.table thead th {
    padding: .65rem .8rem;
    background: var(--xc-surface-muted);
    border-top: 0;
    border-bottom: 1px solid var(--xc-border);
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--xc-text-muted);
    white-space: nowrap;
}

.table thead th a {
    color: inherit;
}

.table td,
.table th {
    padding: .6rem .8rem;
    border-top: 1px solid var(--xc-border);
    vertical-align: middle;
}

/* Цифры в колонках сумм должны выстраиваться в столбик */
.table td,
.table .text-right,
.field-balance, .field-_balance, .field-_price, .field-_amount,
.field-debit, .field-credit, .field-amount, .field-price {
    font-variant-numeric: tabular-nums;
}

.table-hover tbody tr {
    transition: background-color var(--xc-transition);
}

.table-hover tbody tr:hover {
    background-color: var(--xc-brand-soft);
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: var(--xc-surface-muted);
}

/* Список объектов: jazzmin кладёт #result_list в .card > .table-responsive */
.card > .table-responsive,
.card > .card-body > .table-responsive {
    border-radius: var(--xc-radius-lg);
}

#result_list {
    margin-bottom: 0;
}

#result_list thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}

#result_list tbody tr:last-child td {
    border-bottom: 0;
}

/* Строка фильтров и поиска над списком (jazzmin: #change-list-filters) */
#change-list-filters {
    padding: .85rem 1.1rem;
    margin-bottom: 1rem;
    background: var(--xc-surface);
    border: 1px solid var(--xc-border);
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow-sm);
}

#change-list-filters .form-group {
    margin-bottom: 0;
    margin-right: .5rem;
}

#changelist-search {
    gap: .5rem;
    flex-wrap: wrap;
}

#changelist-search .btn {
    white-space: nowrap;
}

.search-filter,
#change-list-filters select {
    min-width: 12rem;
}

/* Вкладки карточки объекта (клиент, пользователь) */
.nav-tabs {
    gap: .25rem;
    border-bottom: 1px solid var(--xc-border);
}

.nav-tabs .nav-link {
    padding: .55rem .9rem;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: var(--xc-radius-sm) var(--xc-radius-sm) 0 0;
    color: var(--xc-text-muted);
    font-weight: 550;
    transition: color var(--xc-transition), background-color var(--xc-transition),
        border-color var(--xc-transition);
}

.nav-tabs .nav-link:hover {
    background-color: var(--xc-surface-muted);
    border-color: transparent;
    color: var(--xc-text);
}

.nav-tabs .nav-link.active {
    background-color: transparent;
    border-bottom-color: var(--xc-brand);
    color: var(--xc-brand-strong);
}

.tab-content {
    padding-top: 1.1rem;
}

/* Чекбокс-колонка и колонка действий не должны расползаться */
.table .action-checkbox-column,
.table td.action-checkbox {
    width: 2.5rem;
    text-align: center;
}

/* ------------------------------------------------- Формы и поля ввода */

label {
    margin-bottom: .3rem;
    font-size: .9rem;
    font-weight: 550;
    color: var(--xc-text);
}

/*
   Django admin отдаёт поля со своими классами (vTextField, autonumeric-decimal)
   или вовсе без них — класса form-control на них нет, поэтому перечисляем типы
   полей явно, иначе стили до них не доходят.
*/
.content-wrapper input[type="text"],
.content-wrapper input[type="number"],
.content-wrapper input[type="email"],
.content-wrapper input[type="password"],
.content-wrapper input[type="url"],
.content-wrapper input[type="tel"],
.content-wrapper input[type="search"],
.content-wrapper input[type="date"],
.content-wrapper input[type="datetime-local"],
.content-wrapper input[type="time"],
.content-wrapper input:not([type]),
.content-wrapper select:not(.select2-hidden-accessible),
.content-wrapper textarea,
.login-box .form-control,
.form-control,
.custom-select {
    display: block;
    width: 100%;
    max-width: 34rem;
    min-height: 2.35rem;
    padding: .35rem .65rem;
    background-color: var(--xc-surface);
    border: 1px solid var(--xc-border-strong);
    border-radius: var(--xc-radius);
    color: var(--xc-text);
    font-family: inherit;
    font-size: .95rem;
    line-height: 1.5;
    transition: border-color var(--xc-transition), box-shadow var(--xc-transition),
        background-color var(--xc-transition);
}

.content-wrapper input[type="text"]:hover,
.content-wrapper input[type="number"]:hover,
.content-wrapper select:not(.select2-hidden-accessible):hover,
.content-wrapper textarea:hover,
.form-control:hover {
    border-color: var(--xc-text-faint);
}

.content-wrapper input[type="text"]:focus,
.content-wrapper input[type="number"]:focus,
.content-wrapper input[type="email"]:focus,
.content-wrapper input[type="password"]:focus,
.content-wrapper input[type="date"]:focus,
.content-wrapper input[type="search"]:focus,
.content-wrapper select:not(.select2-hidden-accessible):focus,
.content-wrapper textarea:focus,
.form-control:focus,
.custom-select:focus {
    border-color: var(--xc-brand);
    box-shadow: var(--xc-focus-ring);
    outline: none;
}

.content-wrapper input::placeholder,
.form-control::placeholder {
    color: var(--xc-text-faint);
}

.content-wrapper input:disabled,
.content-wrapper input[readonly],
.content-wrapper select:disabled,
.content-wrapper textarea[readonly],
.form-control:disabled,
.form-control[readonly] {
    background-color: var(--xc-surface-muted);
    border-color: var(--xc-border);
    color: var(--xc-text-muted);
    cursor: not-allowed;
}

/* Свой indicator вместо разнобойной нативной стрелки в разных браузерах */
.content-wrapper select:not([multiple]):not([size]):not(.select2-hidden-accessible) {
    padding-right: 2rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%236B7280' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6.5l4 4 4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .6rem center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.content-wrapper select[multiple],
.content-wrapper select[size] {
    min-height: 8rem;
    padding: .35rem;
}

.content-wrapper textarea {
    min-height: 6rem;
    max-width: 48rem;
    resize: vertical;
}

/* JSON и прочие технические поля — моноширинным, так их читать легче */
.content-wrapper textarea[name="data"],
.content-wrapper textarea[name="exception"],
.content-wrapper textarea[name="template"],
.content-wrapper textarea[name="original_text"] {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-size: .88rem;
}

/* Поле выбора файла */
.content-wrapper input[type="file"] {
    display: block;
    width: 100%;
    max-width: 34rem;
    padding: .4rem .55rem;
    background: var(--xc-surface-muted);
    border: 1px dashed var(--xc-border-strong);
    border-radius: var(--xc-radius);
    font-size: .9rem;
    color: var(--xc-text-muted);
    cursor: pointer;
    transition: border-color var(--xc-transition), background-color var(--xc-transition);
}

.content-wrapper input[type="file"]:hover {
    background: var(--xc-brand-soft);
    border-color: var(--xc-brand);
}

.content-wrapper input[type="file"]::file-selector-button {
    margin-right: .6rem;
    padding: .25rem .7rem;
    background: var(--xc-surface);
    border: 1px solid var(--xc-border-strong);
    border-radius: var(--xc-radius-sm);
    color: var(--xc-text);
    font: inherit;
    font-size: .88rem;
    cursor: pointer;
}

/* В табличных формах (инлайны, массовое добавление) поле занимает ячейку */
.content-wrapper table input[type="text"],
.content-wrapper table input[type="number"],
.content-wrapper table input[type="date"],
.content-wrapper table input[type="file"],
.content-wrapper table select:not(.select2-hidden-accessible),
.content-wrapper table textarea {
    max-width: none;
    min-width: 0;
}

.content-wrapper table textarea {
    min-height: 2.35rem;
}

.content-wrapper td,
.content-wrapper th {
    vertical-align: middle;
}

/* Поля в строке фильтров над списком — по содержимому, а не во всю ширину */
#change-list-filters input,
#change-list-filters select,
#changelist-search input,
#changelist-search select {
    display: inline-block;
    width: auto;
    max-width: none;
}

.form-control.is-invalid,
.errors .form-control,
.errors input[type="text"],
.errors select {
    border-color: var(--xc-red);
}

.help,
.help-block,
.form-text,
small.text-muted {
    display: block;
    margin-top: .25rem;
    color: var(--xc-text-muted) !important;
    font-size: .85rem;
}

.form-group {
    margin-bottom: 1rem;
}

/* Django-строка формы */
.form-row {
    padding: .35rem 0;
    border-bottom: 1px solid var(--xc-border);
}

.form-row:last-child {
    border-bottom: 0;
}

/* Значение поля, доступного только для чтения */
.content-wrapper .readonly {
    display: inline-block;
    padding: .35rem .65rem;
    background: var(--xc-surface-muted);
    border: 1px solid var(--xc-border);
    border-radius: var(--xc-radius);
    color: var(--xc-text-muted);
    min-height: 2.35rem;
}

/* Select2 под остальные поля. Ширину задаёт сам select2 — навязывать её
   нельзя, иначе разъезжается строка фильтров над списком. */
.content-wrapper .select2-container {
    max-width: 34rem;
}

.content-wrapper table .select2-container,
#change-list-filters .select2-container {
    max-width: none;
}

#change-list-filters .select2-container {
    min-width: 12rem;
}

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    min-height: 2.35rem;
    background: var(--xc-surface);
    border: 1px solid var(--xc-border-strong) !important;
    border-radius: var(--xc-radius) !important;
    transition: border-color var(--xc-transition), box-shadow var(--xc-transition);
}

.select2-container--default .select2-selection--single:hover,
.select2-container--default .select2-selection--multiple:hover {
    border-color: var(--xc-text-faint) !important;
}

.select2-container--open .select2-selection--single,
.select2-container--open .select2-selection--multiple {
    border-color: var(--xc-brand) !important;
    box-shadow: var(--xc-focus-ring);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: .65rem;
    line-height: 2.2rem;
    color: var(--xc-text);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 2.25rem;
    right: .35rem;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin-top: .3rem;
    padding: .1rem .5rem;
    background: var(--xc-brand-soft);
    border: 1px solid rgba(27, 175, 208, .3);
    border-radius: var(--xc-radius-sm);
    color: var(--xc-brand-strong);
}

.select2-dropdown {
    border: 1px solid var(--xc-border) !important;
    border-radius: var(--xc-radius-lg) !important;
    box-shadow: var(--xc-shadow-lg);
    overflow: hidden;
}

.select2-search--dropdown .select2-search__field {
    border: 1px solid var(--xc-border-strong) !important;
    border-radius: var(--xc-radius-sm);
    padding: .3rem .5rem;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--xc-brand) !important;
}

/* Чекбоксы и радио заметнее */
input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--xc-brand);
    width: 1rem;
    height: 1rem;
    min-height: 0;
    cursor: pointer;
}

/* Виджет «очистить файл», чекбоксы в строке формы */
.content-wrapper .form-row input[type="checkbox"] + label,
.content-wrapper .checkbox-row label {
    display: inline;
    margin-left: .35rem;
    font-weight: 400;
}

/* --------------------------------------------------------------- Кнопки */

.btn {
    padding: .4rem .95rem;
    border-radius: var(--xc-radius);
    font-size: .95rem;
    font-weight: 550;
    line-height: 1.5;
    transition: background-color var(--xc-transition), border-color var(--xc-transition),
        box-shadow var(--xc-transition), transform var(--xc-transition);
}

.btn:active {
    transform: translateY(1px);
}

.btn-sm {
    padding: .25rem .6rem;
    font-size: .85rem;
}

.btn-primary,
.btn-info {
    background-color: var(--xc-brand);
    border-color: var(--xc-brand);
    color: var(--xc-brand-contrast);
    box-shadow: var(--xc-shadow-sm);
}

.btn-primary:hover, .btn-primary:focus,
.btn-info:hover, .btn-info:focus {
    background-color: var(--xc-brand-strong);
    border-color: var(--xc-brand-strong);
    color: #fff;
}

.btn-success {
    background-color: var(--xc-success);
    border-color: var(--xc-success);
    box-shadow: var(--xc-shadow-sm);
}

.btn-success:hover, .btn-success:focus {
    background-color: #12833C;
    border-color: #12833C;
}

/* Красный из логотипа оставлен за опасными действиями */
.btn-danger {
    background-color: var(--xc-red);
    border-color: var(--xc-red);
    box-shadow: var(--xc-shadow-sm);
}

.btn-danger:hover, .btn-danger:focus {
    background-color: var(--xc-red-strong);
    border-color: var(--xc-red-strong);
}

.btn-warning {
    background-color: var(--xc-warning);
    border-color: var(--xc-warning);
    color: #fff;
}

.btn-warning:hover, .btn-warning:focus {
    background-color: #B45309;
    border-color: #B45309;
    color: #fff;
}

.btn-secondary,
.btn-default {
    background-color: var(--xc-neutral);
    border-color: var(--xc-neutral-border);
    color: var(--xc-text);
}

.btn-secondary:hover, .btn-secondary:focus,
.btn-default:hover, .btn-default:focus {
    background-color: var(--xc-neutral-hover);
    border-color: var(--xc-text-muted);
    color: var(--xc-text);
}

.btn-outline-primary {
    border-color: var(--xc-brand);
    color: var(--xc-brand-strong);
}

.btn-outline-primary:hover {
    background-color: var(--xc-brand);
    border-color: var(--xc-brand);
    color: #fff;
}

.btn-outline-danger {
    border-color: var(--xc-border-strong);
    color: var(--xc-red);
}

.btn-outline-danger:hover {
    background-color: var(--xc-red);
    border-color: var(--xc-red);
    color: #fff;
}

.btn-dark {
    background-color: var(--xc-sidebar-raised);
    border-color: var(--xc-sidebar-raised);
}

.btn-dark:hover, .btn-dark:focus {
    background-color: var(--xc-sidebar);
    border-color: var(--xc-sidebar);
}

/* Панель кнопок внизу формы */
#jazzy-actions,
.submit-row {
    gap: .5rem;
    padding: .9rem 0 .2rem;
    border-top: 1px solid var(--xc-border);
    background: transparent !important;
}

/* На карточке клиента .submit-row вложен в #jazzy-actions — иначе получаются
   две разделительные линии и двойной отступ сверху. */
#jazzy-actions .submit-row {
    /* по содержимому, иначе justify-content-between из шаблона разводит
       «Акт-сверку» и остальные кнопки по разным краям */
    flex: 0 0 auto;
    padding: 0;
    border-top: 0;
}

#jazzy-actions .form-group {
    margin-bottom: 0;
}

/* Часть кнопок приходит с классом form-control, часть без него — выравниваем
   их по одной высоте и базовой линии. */
#jazzy-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    margin-bottom: 0;
}

/* --------------------------------------------------------- Бейджи, статусы */

.badge {
    padding: .3rem .6rem;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .01em;
}

.badge-primary, .badge-info, .bg-info {
    background-color: var(--xc-brand-soft) !important;
    color: var(--xc-brand-strong) !important;
}

.badge-success, .bg-success {
    background-color: var(--xc-success-soft) !important;
    color: var(--xc-success) !important;
}

.badge-danger, .bg-danger {
    background-color: var(--xc-red-soft) !important;
    color: var(--xc-red-strong) !important;
}

.badge-warning, .bg-warning {
    background-color: var(--xc-warning-soft) !important;
    color: var(--xc-warning) !important;
}

.badge-secondary {
    background-color: var(--xc-surface-muted) !important;
    color: var(--xc-text-muted) !important;
}

/* Галочки «да/нет» в списках */
img[src$="icon-yes.svg"],
img[src$="icon-no.svg"] {
    width: 1rem;
    height: 1rem;
}

/* ---------------------------------------------------------- Сообщения */

.alert {
    padding: .8rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--xc-radius);
    box-shadow: var(--xc-shadow-sm);
    font-size: .95rem;
}

.alert .icon {
    margin-right: .5rem;
}

.alert-success {
    background-color: var(--xc-success-soft);
    border-color: rgba(22, 163, 74, .25);
    color: #126633;
}

.alert-danger {
    background-color: var(--xc-red-soft);
    border-color: rgba(232, 57, 45, .25);
    color: #9B2219;
}

.alert-warning {
    background-color: var(--xc-warning-soft);
    border-color: rgba(217, 119, 6, .25);
    color: #8A4B05;
}

.alert-info {
    background-color: var(--xc-brand-soft);
    border-color: rgba(27, 175, 208, .25);
    color: #10697E;
}

/* -------------------------------------------------------- Пагинация */

.pagination {
    gap: .25rem;
}

.page-link {
    min-width: 2rem;
    border: 1px solid var(--xc-border);
    border-radius: var(--xc-radius-sm) !important;
    color: var(--xc-text-muted);
    text-align: center;
    transition: background-color var(--xc-transition), color var(--xc-transition);
}

.page-link:hover {
    background-color: var(--xc-brand-soft);
    border-color: var(--xc-brand-soft);
    color: var(--xc-brand-strong);
}

.page-item.active .page-link {
    background-color: var(--xc-brand);
    border-color: var(--xc-brand);
    color: #fff;
}

.paginator {
    padding: .75rem 0 0;
    color: var(--xc-text-muted);
    font-size: .9rem;
}

/* ------------------------------------------------- Дашборд: стат-карточки */

.xc-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1rem;
}

.xc-stat-card {
    display: flex;
    flex-direction: column;
    padding: 1.1rem 1.15rem;
    background: var(--xc-surface);
    border: 1px solid var(--xc-border);
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow);
    transition: box-shadow var(--xc-transition), transform var(--xc-transition);
}

.xc-stat-card:hover {
    box-shadow: var(--xc-shadow-md);
    transform: translateY(-1px);
}

.xc-stat-card__head {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: .9rem;
}

.xc-stat-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.1rem;
    height: 2.1rem;
    flex: 0 0 auto;
    border-radius: var(--xc-radius);
    background: var(--xc-brand-soft);
    color: var(--xc-brand-strong);
    font-size: .95rem;
}

.xc-stat-card__title {
    margin: 0;
    font-size: .78rem;
    font-weight: 650;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--xc-text-muted);
}

.xc-stat-card__rows {
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

.xc-stat-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: .45rem 0;
    border-bottom: 1px dashed var(--xc-border);
}

.xc-stat-row:last-child {
    border-bottom: 0;
}

.xc-stat-row__label {
    color: var(--xc-text-muted);
    font-size: .92rem;
}

.xc-stat-row__value {
    font-size: 1.05rem;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    color: var(--xc-text);
    white-space: nowrap;
}

.xc-stat-row__value--positive { color: var(--xc-success); }
.xc-stat-row__value--negative { color: var(--xc-red-strong); }

/* Плашка проблем TMS */
.xc-alert-tile {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .85rem 1.1rem;
    margin-bottom: 1rem;
    border: 1px solid rgba(232, 57, 45, .25);
    border-left: 3px solid var(--xc-red);
    border-radius: var(--xc-radius-lg);
    background: var(--xc-red-soft);
    color: #9B2219;
    font-weight: 550;
}

.xc-alert-tile--ok {
    border-color: rgba(22, 163, 74, .25);
    border-left-color: var(--xc-success);
    background: var(--xc-success-soft);
    color: #126633;
}

.xc-alert-tile a {
    margin-left: auto;
    color: inherit;
    font-weight: 600;
    text-decoration: underline;
}

/* Панель фильтра по дате на дашборде */
.xc-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem;
    padding: .85rem 1.1rem;
    margin-bottom: 1rem;
    background: var(--xc-surface);
    border: 1px solid var(--xc-border);
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow-sm);
}

.xc-toolbar__label {
    margin: 0;
    color: var(--xc-text-muted);
    font-size: .9rem;
    font-weight: 550;
}

.xc-toolbar input[type="date"] {
    width: auto;
    min-width: 11rem;
}

/* ------------------------------- Карточка клиента: сводка по провайдерам */

.xc-client-summary {
    padding: 0;
    margin-bottom: 1.25rem;
}

.xc-provider-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.xc-provider-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: 1rem 1.15rem;
    background: var(--xc-surface);
    border: 1px solid var(--xc-border);
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow);
    overflow: hidden;
    transition: box-shadow var(--xc-transition), transform var(--xc-transition);
}

.xc-provider-card:hover {
    box-shadow: var(--xc-shadow-md);
    transform: translateY(-1px);
}

/* Полоса слева — цветом состояния: подключён или нет видно боковым зрением */
.xc-provider-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--xc-border-strong);
}

.xc-provider-card.is-connected::before {
    background: var(--xc-success);
}

.xc-provider-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
}

.xc-provider-card__name {
    font-size: .95rem;
    font-weight: 650;
    letter-spacing: .04em;
    color: var(--xc-text);
}

.xc-provider-card__amount {
    margin-top: .35rem;
    font-size: 1.5rem;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
    color: var(--xc-text);
}

.xc-provider-card__caption {
    font-size: .82rem;
    color: var(--xc-text-muted);
}

/* Индикатор подключения */
.xc-conn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .2rem .55rem;
    border-radius: 999px;
    background: var(--xc-surface-muted);
    color: var(--xc-text-muted);
    font-size: .8rem;
    font-weight: 600;
    white-space: nowrap;
}

.xc-conn__dot {
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    background: var(--xc-text-faint);
    flex: 0 0 auto;
}

.is-connected .xc-conn {
    background: var(--xc-success-soft);
    color: #126633;
}

.is-connected .xc-conn__dot {
    background: var(--xc-success);
    box-shadow: 0 0 0 3px rgba(22, 163, 74, .18);
}

/* Общий баланс — акцентная плашка под блоками провайдеров */
.xc-balance-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1.1rem 1.25rem;
    background: linear-gradient(135deg, var(--xc-brand), var(--xc-brand-strong));
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow-md);
    color: #fff;
}

.xc-balance-card__label {
    font-size: .8rem;
    font-weight: 650;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: .85;
}

.xc-balance-card__amount {
    font-size: 1.75rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
    line-height: 1.1;
}

@media (max-width: 575.98px) {
    .xc-provider-grid {
        grid-template-columns: 1fr;
    }

    .xc-balance-card__amount {
        font-size: 1.45rem;
    }
}

/* ------------------------- Итоги по дебету и кредиту в инлайне транзакций */

/*
   Итоги переносятся скриптом в ячейку строки с кнопкой «Пополнить».
   Ячейку НЕ делаем flex-контейнером: в табличной раскладке это разводило
   итоги и кнопку по разным строкам. Обычный строчный поток + запрет переноса
   держит всё в одном ряду.
*/
tr.add-row td.xc-add-row-cell {
    white-space: nowrap;
}

.xc-inline-totals[hidden] {
    display: none !important;
}

.xc-inline-totals {
    display: inline-flex;
    align-items: center;
    gap: 1.5rem;
    margin-right: 1.5rem;
    vertical-align: middle;
    white-space: nowrap;
}

.xc-inline-totals__item {
    display: inline-flex;
    align-items: baseline;
    gap: .4rem;
    white-space: nowrap;
}

.xc-inline-totals__label {
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--xc-text-muted);
}

.xc-inline-totals__value {
    font-size: 1.05rem;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
}

.xc-inline-totals__value--debit {
    color: var(--xc-success);
}

.xc-inline-totals__value--credit {
    color: var(--xc-red-strong);
}

/* На узком экране в один ряд всё равно не поместится — разрешаем перенос */
@media (max-width: 767.98px) {
    tr.add-row td.xc-add-row-cell {
        white-space: normal;
    }

    .xc-inline-totals {
        gap: .9rem;
        margin-right: .9rem;
        flex-wrap: wrap;
    }
}

/* ---------------------------------------------- Типы транзакций — бейджи */

.xc-type-badge {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin: 0;
    padding: .2rem .6rem .2rem .5rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: .01em;
    white-space: nowrap;
    vertical-align: middle;
}

/* Точка слева — чтобы тип считывался и без цвета (печать, дальтонизм) */
.xc-type-badge::before {
    content: "";
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: currentColor;
    flex: 0 0 auto;
}

.xc-type-badge--cash,
.xc-type-badge--card {
    background: var(--xc-amber-soft);
    border-color: rgba(180, 83, 9, .22);
    color: var(--xc-amber);
}

.xc-type-badge--click {
    background: var(--xc-blue-soft);
    border-color: rgba(29, 78, 216, .22);
    color: var(--xc-blue);
}

.xc-type-badge--paynet {
    background: var(--xc-success-soft);
    border-color: rgba(22, 163, 74, .22);
    color: #126633;
}

.xc-type-badge--bank {
    background: var(--xc-red-soft);
    border-color: rgba(232, 57, 45, .22);
    color: var(--xc-red-strong);
}

.xc-type-badge--default {
    background: var(--xc-surface-muted);
    border-color: var(--xc-border);
    color: var(--xc-text-muted);
}

/* Прочерк вместо бейджа у транзакций без типа */
.xc-type-empty {
    color: var(--xc-text-faint);
}

/* -------------------------------------------- Статусные бейджи «да / нет» */

.xc-status-badge {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .25rem .7rem .25rem .6rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
}

/* Значок дублирует цвет: статус читается и в ч/б, и при дальтонизме */
.xc-status-badge::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: .75rem;
}

.xc-status-badge--yes {
    background: var(--xc-success-soft);
    border-color: rgba(22, 163, 74, .25);
    color: #126633;
}

.xc-status-badge--yes::before {
    content: "\f00c";
}

.xc-status-badge--no {
    background: var(--xc-red-soft);
    border-color: rgba(232, 57, 45, .25);
    color: var(--xc-red-strong);
}

.xc-status-badge--no::before {
    content: "\f00d";
}

/* ------------------------------------------------------------ Экран входа */

body.jazzmin-login-page {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 1.5rem;
    background: radial-gradient(1200px 600px at 15% -10%, rgba(27, 175, 208, .18), transparent 60%),
        radial-gradient(900px 500px at 110% 110%, rgba(232, 57, 45, .12), transparent 55%),
        var(--xc-sidebar);
}

body.jazzmin-login-page .login-box {
    width: 100%;
    max-width: 380px;
    margin: 0;
}

body.jazzmin-login-page .login-logo {
    margin-bottom: 1.4rem;
    text-align: center;
}

body.jazzmin-login-page .login-logo img {
    width: 56px;
    height: 56px;
    padding: 4px;
    background: #fff;
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow-lg);
    object-fit: contain;
}

body.jazzmin-login-page .login-logo h1 {
    margin: .7rem 0 .2rem;
    color: #fff;
    font-size: 1.7rem;
    font-weight: 650;
    letter-spacing: .14em;
}

body.jazzmin-login-page .login-logo p {
    margin: 0;
    color: var(--xc-sidebar-text);
    font-size: .9rem;
    letter-spacing: .02em;
}

body.jazzmin-login-page .card {
    border: 0;
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow-lg);
}

body.jazzmin-login-page .card-body {
    padding: 1.6rem;
}

body.jazzmin-login-page .btn-primary {
    width: 100%;
    padding: .55rem 1rem;
    font-size: 1rem;
}

/* ----------------------------------------------------------- Подвал */

.main-footer {
    padding: .9rem 1rem;
    background: var(--xc-surface);
    border-top: 1px solid var(--xc-border) !important;
    color: var(--xc-text-muted);
    font-size: .88rem;
}

/* ----------------------------------------- Страница массового добавления */

.bulk-add-table .bulk-add-number-col {
    width: 3rem;
    color: var(--xc-text-faint);
    font-variant-numeric: tabular-nums;
    vertical-align: middle;
}

.bulk-add-table .bulk-add-actions-col {
    width: 3rem;
    vertical-align: middle;
}

.bulk-add-table td {
    vertical-align: middle;
}

.bulk-add-table td input[type="text"],
.bulk-add-table td input[type="number"],
.bulk-add-table td select,
.bulk-add-table td textarea {
    width: 100%;
}

.bulk-add-table tbody tr {
    transition: background-color var(--xc-transition);
}

.bulk-add-table tbody tr:hover {
    background-color: var(--xc-surface-muted);
}

.bulk-add-remove:disabled {
    opacity: .3;
}

/* --------------------------------------------------------- Мелочи вёрстки */

.module {
    background: transparent;
}

hr {
    border-color: var(--xc-border);
}

.text-muted {
    color: var(--xc-text-muted) !important;
}

/* Модальные окна связанных объектов (jazzmin related-modal) */
.modal-content {
    border: 0;
    border-radius: var(--xc-radius-lg);
    box-shadow: var(--xc-shadow-lg);
}

.modal-header,
.modal-footer {
    border-color: var(--xc-border);
}

/* Инлайны с пагинацией */
.inline-group {
    margin-bottom: 1.25rem;
}

.inline-group .table {
    background: var(--xc-surface);
}

.inline-group .add-row a {
    font-weight: 550;
}

@media (max-width: 767.98px) {
    .content {
        padding: 1rem .35rem;
    }

    .xc-stat-grid {
        grid-template-columns: 1fr;
    }

    .content-wrapper > .content.border-bottom h1 {
        font-size: 1.2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    * {
        transition: none !important;
    }
}