/**
 * Переопределение стилей Kendo UI
 * Синхронизирует компоненты Kendo с дизайн-системой CMS
 * Использует CSS переменные из themes/theme.css
 */

/* Контейнер грида - блочный элемент, а не flex, чтобы Kendo Height("auto") работал корректно */
.section-grid {
    min-height: 0;
    border: 1px solid var(--cms-grid-border-color, #dee2e6) !important;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2) !important;
}

/* Отступы секции фильтра */
.section-filter {
    margin-bottom: var(--cms-spacing-sm, 8px);
    flex-shrink: 0;
    border: 1px solid var(--cms-filter-border-color, #dee2e6);
    border-radius: var(--cms-border-radius, 4px);
    overflow: hidden;
}

.section-filter .card {
    border: none !important;
    margin-bottom: 0;
    padding: 0 !important;
}

/* Скрываем заголовок "Фильтр" */
.section-filter:not(.filter-with-header) .card-header {
    display: none !important;
}

/* Для фильтров с заголовком - показываем */
.section-filter.filter-with-header .card-header {
    display: block !important;
    background-color: var(--cms-table-header-bg, #f8f9fa);
}

.section-filter .card-body {
    padding: 0 !important;
}

/* Фон фильтра как у заголовка */
.section-filter .filter-collapse {
    background-color: var(--cms-table-header-bg, #f8f9fa);
    padding: 0.5rem;
}

/* Не форсируем flex на k-grid — пусть Kendo Height("auto") управляет layout */
.k-grid {
    min-height: 0;
    background-color: transparent !important;
    border-color: var(--cms-border-color, #dfe5eb) !important;
    color: var(--cms-text-primary, #1f2326) !important;
}

.flex-center > .k-grid {
    flex: 1;
    min-width: 0;
    width: 100%;
}

/* Синхронизация ширины заголовка и контента грида — Kendo использует отдельные таблицы */
.k-grid-header {
    background-color: var(--cms-table-header-bg, #f8f9fa) !important;
    color: var(--cms-text-primary, #1f2326) !important;
    border-color: var(--cms-border-color, #dfe5eb) !important;
}

/* Убираем внутренние полоски грида */
.k-grid-toolbar {
    border-color: var(--cms-border-color, #e8ecf0) !important;
    padding-block: 0.3rem;
    gap: 0.5rem;
}

/* Кнопка Excel в тулбаре - справа */
.k-grid-toolbar {
    display: flex !important;
    width: 100% !important;
}

.k-grid-toolbar .k-grid-excel {
  margin-left: auto !important;
}
/* Зеленая кнопка Excel (закомментировано)
.k-grid-toolbar .k-grid-excel {
    margin-left: auto !important;
    border: 1px solid #28A745 !important;
    color: #28A745 !important;
}

.k-grid-toolbar .k-grid-excel:hover {
    background-color: #28A745 !important;
    color: #ffffff !important;
}

.k-grid-toolbar .k-grid-excel .k-svg-icon,
.k-grid-toolbar .k-grid-excel .k-icon {
    color: #28A745 !important;
}

.k-grid-toolbar .k-grid-excel:hover .k-svg-icon,
.k-grid-toolbar .k-grid-excel:hover .k-icon {
    color: #ffffff !important;
}

.k-grid-toolbar .k-grid-excel .k-svg-icon path {
    fill: #28A745 !important;
}

.k-grid-toolbar .k-grid-excel:hover .k-svg-icon path {
    fill: #ffffff !important;
}
*/

.k-grid-pager {
    border-color: var(--cms-border-color, #e8ecf0) !important;
}

/* Переопределяем border-width для pager чтобы использовать правильный цвет */
.k-grid-pager {
    border-width: 1px 0 0 !important;
}

.k-grid-toolbar {
    border-width: 0 0 1px !important;
}

/* Kendo требует overflow:hidden на header-wrap для выравнивания колонок с контентом */
.k-grid-header .k-grid-header-wrap {
    overflow: hidden !important;
}

.k-grid-content {
    background-color: var(--cms-content-bg, #ffffff) !important;
    color: var(--cms-text-primary, #1f2326) !important;
}

.section-grid .k-grid-content {
    height: auto !important;
    flex: 1;
    min-height: 0;
    overflow: auto;
}

/* Иконки раскрытия иерархии (TaskScheduler и др.) */
.k-grid .k-hierarchy-cell {
    text-align: center !important;
    vertical-align: middle !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.k-grid .k-hierarchy-cell a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px;
    height: 20px;
    vertical-align: middle !important;
    line-height: 1 !important;
}

.k-grid .k-hierarchy-cell .k-svg-icon,
.k-grid .k-hierarchy-cell .k-icon {
    width: 16px !important;
    height: 16px !important;
    font-size: var(--cms-font-size-md) !important;
    color: var(--cms-text-secondary, #495057) !important;
}

.k-grid .k-hierarchy-cell .k-svg-icon svg,
.k-grid .k-hierarchy-cell .k-icon svg {
    width: 16px !important;
    height: 16px !important;
    fill: currentColor !important;
}

.k-grid .k-hierarchy-cell .k-svg-icon path,
.k-grid .k-hierarchy-cell .k-icon path {
    fill: currentColor !important;
}

/* Hover для иконок иерархии */
.k-grid .k-hierarchy-cell a:hover .k-svg-icon,
.k-grid .k-hierarchy-cell a:hover .k-icon {
    color: var(--cms-text-primary, #1f2326) !important;
}

/* Kendo Menu — делаем элементы верхнего уровня чуть темнее стандартного серого */
#mainMenu.k-menu:not(.k-context-menu) > .k-item > .k-link > .k-link-text {
    color: var(--cms-text-bold, #515151) !important;
    font-family: var(--cms-font-family) !important;
    font-size: var(--cms-font-size-sm) !important;
    font-weight: var(--cms-font-weight-semibold) !important;
}

#mainMenu.k-menu:not(.k-context-menu) > .k-item > .k-link {
    color: var(--cms-text-bold, #515151) !important;
    font-family: var(--cms-font-family) !important;
    font-size: var(--cms-font-size-sm) !important;
    font-weight: var(--cms-font-weight-semibold) !important;
    background-color: transparent !important;
}

#mainMenu.k-menu:not(.k-context-menu) > .k-item:hover > .k-link > .k-link-text,
#mainMenu.k-menu:not(.k-context-menu) > .k-item.k-state-hover > .k-link > .k-link-text {
    color: var(--cms-link-color, #0a58ca) !important;
}

/* Выпадающее подменю — используем --cms-menu-bg из темы */
#mainMenu.k-menu:not(.k-context-menu) .k-group,
#mainMenu.k-menu:not(.k-context-menu).k-menu-group,
#mainMenu .k-menu-group {
    border: 1px solid var(--cms-border-color, #dfe5eb) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
}

#mainMenu.k-menu:not(.k-context-menu) .k-group .k-item,
#mainMenu .k-menu-group .k-menu-item {
    font-size: var(--cms-font-size-sm) !important;
    font-weight: var(--cms-font-weight-bold) !important;
    font-family: var(--font-main) !important;
    color: var(--cms-text-bold, #515151) !important;
}

#mainMenu .k-menu-group .k-menu-link-text,
#mainMenu.k-menu:not(.k-context-menu) .k-group .k-item > .k-link > .k-link-text {
    color: var(--cms-text-bold, #515151) !important;
    font-family: var(--font-main) !important;
    font-size: var(--cms-font-size-sm) !important;
    font-weight: var(--cms-font-weight-bold) !important;
}

#mainMenu .k-menu-group-md .k-menu-item {
    font-size: var(--cms-font-size-sm) !important;
    line-height: var(--cms-line-height-base) !important;
    font-weight: var(--cms-font-weight-bold) !important;
    font-family: var(--font-main) !important;
}

#mainMenu.k-menu:not(.k-context-menu) .k-group .k-item:hover > .k-link > .k-link-text,
#mainMenu .k-menu-group .k-menu-item:hover .k-menu-link-text {
    color: var(--cms-link-color, #0a58ca) !important;
}

/* Переопределение яркой синей кнопки редактирования Kendo 2024+ — делаем все кнопки иконок серыми */
.k-grid .k-button-solid-primary.k-icon-button,
.k-grid .k-button-solid-secondary.k-icon-button,
.k-grid .k-button-solid-base.k-icon-button {
    background-color: var(--cms-table-header-bg, #e9ecef) !important;
    color: var(--cms-text-primary, #1f2326) !important;
    /*border: 1px solid var(--cms-filter-border-color, #dee2e6) !important;*/
    box-shadow: none !important;
}

.k-grid .k-icon-button:hover {
    background-color: var(--cms-row-hover, rgba(10, 88, 202, 0.12)) !important;
    color: var(--cms-link-color, #0a58ca) !important;
}

/* Убеждаемся, что иконки кнопок видны — форсируем тёмный fill для SVG иконок */
.k-grid .k-icon-button .k-svg-icon path {
    fill: var(--cms-text-primary, #1f2326) !important;
}

.k-grid .k-icon-button:hover .k-svg-icon path {
    fill: var(--cms-link-color, #0a58ca) !important;
}

/* Также применяем к .k-icon для иконок шрифтов */
.k-grid .k-icon-button .k-icon {
    color: var(--cms-text-primary, #1f2326) !important;
}

.k-grid .k-icon-button:hover .k-icon {
    color: var(--cms-link-color, #0a58ca) !important;
}

/* Ячейки грида */
.k-grid td, .k-grid th {
    color: var(--cms-text-primary, #1f2326) !important;
    border-color: var(--cms-border-color, #e8ecf0) !important;
    padding-block: 0.3rem !important;
    padding-inline: 0.4rem !important;
    line-height: var(--cms-line-height-sm) !important;
}

.k-grid .k-grid-header .k-table-th {
    font-weight: var(--cms-font-weight-bold) !important;
    text-align: center !important;
    color: var(--cms-text-bold, #515151) !important;
}

.k-grid .k-grid-header .k-cell-inner {
    justify-content: center !important;
}

.k-grid-pager {
    background-color: var(--cms-footer-bg, #ffffff) !important;
    color: var(--cms-text-muted, #6c757d) !important;
    font-size: var(--cms-font-size-sm) !important;
    font-family: var(--font-main) !important;
}

.k-grid-norecords {
    padding: 5px !important;
    color: var(--cms-text-muted, #6c757d) !important;
    font-size: var(--cms-font-size-sm) !important;
    font-family: var(--font-main) !important;
}

.k-window-titlebar {
    background-color: var(--cms-card-bg, #ffffff) !important;
    color: var(--cms-text-primary, #1f2326) !important;
}

.k-window,
.k-dialog {
    font-family: var(--font-main) !important;
    font-size: var(--cms-font-size-sm) !important;
}

.k-dialog,
.k-dialog .k-dialog-content {
    font-family: var(--font-main) !important;
    font-size: var(--cms-font-size-sm) !important;
}

.k-dialog .k-dialog-titlebar {
    background-color: var(--color-warning, #ffc107) !important;
    border-bottom: 1px solid var(--cms-border-color) !important;
    color: var(--cms-text-warning, #664d03) !important;
}

.k-dialog .k-dialog-title {
    font-family: var(--cms-font-family) !important;
    font-size: var(--cms-font-size-xl) !important;
    font-weight: var(--cms-font-weight-semibold) !important;
    color: var(--cms-text-warning, #664d03) !important;
    padding-block: 0 !important;
}

.k-dialog .k-button-close {
    border: none !important;
    background: none !important;
    box-shadow: none !important;
}

.k-dialog .k-dialog-content p {
    margin-bottom: 0 !important;
}

/* Kendo Popup - адаптация под темы */
.k-popup {
    background-color: var(--cms-card-bg, #ffffff) !important;
    color: var(--cms-text-primary, #1f2326) !important;
    border-color: var(--cms-border-color, #dfe5eb) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
}

.k-popup .k-item,
.k-list-container .k-list-item,
.k-popup .k-list-item {
  color: var(--cms-text-primary, #1f2326) !important;
  font-size: var(--cms-font-size-sm) !important;
  font-family: var(--font-main) !important;
}

.k-list-container .k-list-optionlabel {
  color: var(--cms-text-muted, #6c757d) !important;
  font-size: var(--cms-font-size-sm) !important;
  font-family: var(--font-main) !important;
}

.k-popup .k-item:hover,
.k-popup .k-item.k-state-hover,
.k-list-container .k-list-item:hover,
.k-list-container .k-list-item.k-state-hover,
.k-list-container .k-list-optionlabel:hover,
.k-popup .k-list-item:hover,
.k-popup .k-list-item.k-focus {
    background-color: var(--cms-row-hover, rgba(10, 88, 202, 0.12)) !important;
    color: var(--cms-link-color, #0a58ca) !important;
}

.k-dropdowntree-popup .k-treeview-leaf {
    display: flex !important;
    flex-grow: 1 !important;
    border-radius: 0 !important;
    padding-block: 6px !important;
    color: var(--cms-text-primary, #1f2326) !important;
    font-size: var(--cms-font-size-sm) !important;
    font-family: var(--font-main) !important;
}

.k-dropdowntree-popup .k-treeview-leaf:hover,
.k-dropdowntree-popup .k-treeview-leaf.k-hover {
    background-color: var(--cms-row-hover, rgba(10, 88, 202, 0.12)) !important;
    color: var(--cms-link-color, #0a58ca) !important;
}

.k-dropdowntree-popup .k-treeview-leaf.k-selected {
    background-color: var(--cms-row-hover, rgba(10, 88, 202, 0.12)) !important;
    color: var(--cms-link-color, #0a58ca) !important;
}

.k-dropdowntree-popup .k-treeview-leaf:focus,
.k-dropdowntree-popup .k-treeview-leaf.k-focus {
    box-shadow: inset 0 0 0 3px rgba(33, 37, 41, 0.15) !important;
}

/* Kendo Card - адаптация под темы */
.k-card {
    background-color: var(--cms-card-bg, #ffffff) !important;
    color: var(--cms-text-primary, #1f2326) !important;
    border-color: var(--cms-border-color, #dfe5eb) !important;
}

.k-card-header {
    border-bottom-color: var(--cms-border-color, #dfe5eb) !important;
    background-color: var(--cms-table-header-bg, #f8f9fa) !important;
    color: var(--cms-text-primary, #1f2326) !important;
}

/* Kendo Progress Bar */
.k-progressbar {
    background-color: var(--cms-table-header-bg, #f8f9fa) !important;
    border-color: var(--cms-border-color, #dfe5eb) !important;
}

.k-progressbar .k-state-selected {
    background-color: var(--cms-primary, #007bff) !important;
    color: var(--cms-text-inverse, #ffffff) !important;
}

/* Kendo TabStrip — компактные вкладки */
.k-tabstrip-items .k-link {
  padding-block: 0.25rem !important;
  padding-inline: 0.5rem !important;
}

/* Kendo Stepper */
.k-stepper {
    background-color: var(--cms-card-bg, #ffffff) !important;
    color: var(--cms-text-primary, #1f2326) !important;
}

.k-stepper .k-step-indicator {
    background-color: var(--cms-table-header-bg, #f8f9fa) !important;
    border-color: var(--cms-border-color, #dfe5eb) !important;
    color: var(--cms-text-secondary, #495057) !important;
}

.k-stepper .k-step-current .k-step-indicator {
    background-color: var(--cms-primary, #007bff) !important;
    color: var(--cms-text-inverse, #ffffff) !important;
}

.k-stepper .k-step-line {
    background-color: var(--cms-border-color, #dfe5eb) !important;
}

/* TaskScheduler Buttons */
.k-button-error {
    background-color: var(--cms-danger, #dc3545) !important;
    color: var(--cms-text-inverse, #ffffff) !important;
    border-color: var(--cms-danger, #dc3545) !important;
}

.k-button-success {
    background-color: var(--color-success, #28a745) !important;
    color: var(--cms-text-inverse, #ffffff) !important;
    border-color: var(--color-success, #28a745) !important;
}

.k-button-info {
    background-color: var(--cms-primary, #007bff) !important;
    color: var(--cms-text-inverse, #ffffff) !important;
    border-color: var(--cms-primary, #007bff) !important;
}

/* Глобальные переопределения для всех Kendo кнопок */
.k-button {
    background-color: var(--cms-card-bg, #ffffff) !important;
    color: var(--cms-text-primary, #1f2326) !important;
    border-color: var(--cms-filter-border-color, #dee2e6) !important;
    font-size: var(--cms-font-size-sm) !important;
    font-family: var(--cms-font-family) !important;
}

.k-button:hover {
    background-color: var(--cms-row-hover, rgba(10, 88, 202, 0.12)) !important;
    color: var(--cms-link-color, #0a58ca) !important;
}

.k-button-solid-base {
    background-color: var(--cms-table-header-bg, #f8f9fa) !important;
    color: var(--cms-text-primary, #1f2326) !important;
}

.k-button-solid-base:hover {
    background-color: var(--cms-row-hover, rgba(10, 88, 202, 0.12)) !important;
    color: var(--cms-link-color, #0a58ca) !important;
}

/* Kendo Menu - выпадающие элементы */
.k-menu .k-item > .k-link {
    color: var(--cms-text-primary, #1f2326) !important;
    background-color: var(--cms-card-bg, #ffffff) !important;
}

.k-menu .k-item > .k-link:hover {
    background-color: var(--cms-row-hover, rgba(10, 88, 202, 0.12)) !important;
    color: var(--cms-link-color, #0a58ca) !important;
}

.k-menu .k-group {
    background-color: var(--cms-card-bg, #ffffff) !important;
    border-color: var(--cms-border-color, #dfe5eb) !important;
}

/* Kendo Toolbar */
.k-grid-toolbar {
    background-color: var(--cms-table-header-bg, #f8f9fa) !important;
}

/* Kendo Checkbox - серый с белой галочкой */
.k-checkbox:checked, .k-checkbox.k-checked {
  border-color: var(--cms-border-color, #dfe5eb) !important;
  background-color: var(--cms-border-color, #dfe5eb) !important;
}

.k-checkbox {
  border-color: var(--cms-border-color, #dfe5eb) !important;
  background-color: var(--cms-card-bg, #ffffff) !important;
}

/* Подсветка строк */
.k-grid .k-table-alt-row {
  background-color: rgba(0, 0, 0, 0.02);
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
    .k-grid {
        overflow-x: auto;
    }

    .k-grid table {
        min-width: 600px;
    }

    .k-grid-toolbar {
        flex-wrap: wrap;
        gap: var(--cms-spacing-xs, 4px);
    }

    .k-grid-toolbar .k-button {
        margin: 0;
    }

    .k-grid-pager {
        flex-wrap: wrap;
        justify-content: center;
        gap: var(--cms-spacing-xs, 4px);
    }

    /* Kendo Window responsive */
    .k-window {
        max-width: 95vw !important;
        max-height: 90vh !important;
    }

    /* Dialog responsive */
    .k-dialog {
        max-width: 95vw !important;
        max-height: 90vh !important;
    }
}

/* Визуальный вес тени фокуса Kendo — делаем компактнее */
.k-input-solid:focus-within,
.k-input-solid.k-focus {
    box-shadow: 0 0 0 0.15rem rgba(0, 123, 255, 0.25) !important;
}