/**
 * Сучасне оформлення — лише при data-theme="modern".
 * Класичне (light) не змінюється.
 */
[data-theme="modern"] {
    --1c-font: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --1c-radius-sm: 6px;
    --1c-radius-md: 10px;
    --1c-radius-lg: 14px;
    --1c-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --1c-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08);
    --1c-content-gap: 16px;
    /* М'який акцент для виділення (не суцільний синій) */
    --1c-accent-subtle: #dbeafe;
    --1c-accent-subtle-text: #1e3a8a;
    --1c-accent-subtle-border: #93c5fd;
}

/* ——— Верхнє меню ——— */
[data-theme="modern"] .top-panel.top-menu {
    background: var(--1c-header-bg);
    border-bottom: 1px solid var(--1c-border);
    box-shadow: var(--1c-shadow-sm);
    padding: 0 12px 0 16px;
    gap: 8px;
}

[data-theme="modern"] .top-menu__brand {
    font-weight: 600;
    letter-spacing: -0.02em;
    border-right: none;
    padding-right: 16px;
    margin-right: 0;
}

[data-theme="modern"] .top-menu__brand:hover {
    color: var(--1c-accent);
}

[data-theme="modern"] .top-menu__link,
[data-theme="modern"] .top-menu__trigger {
    border-radius: var(--1c-radius-sm);
    font-weight: 500;
    color: var(--1c-text-secondary);
    transition: background 0.15s, color 0.15s;
}

[data-theme="modern"] .top-menu__link:hover,
[data-theme="modern"] .top-menu__link:focus,
[data-theme="modern"] .top-menu__trigger:hover,
[data-theme="modern"] .top-menu__item.open > .top-menu__trigger {
    background: var(--1c-surface-subtle);
    color: var(--1c-text);
}

[data-theme="modern"] .top-menu__dropdown {
    background: var(--1c-panel-bg);
    border: 1px solid var(--1c-border);
    border-radius: var(--1c-radius-md);
    box-shadow: var(--1c-shadow-md);
    padding: 6px;
}

[data-theme="modern"] .top-menu__dropdown a,
[data-theme="modern"] .top-menu__submenu-trigger {
    border-radius: var(--1c-radius-sm);
    padding: 8px 12px;
}

[data-theme="modern"] .top-menu__dropdown a:hover,
[data-theme="modern"] .top-menu__submenu-trigger:hover,
[data-theme="modern"] .top-menu__submenu.open > .top-menu__submenu-trigger {
    background: var(--1c-surface-subtle);
}

[data-theme="modern"] .top-menu__submenu-panel {
    border-radius: var(--1c-radius-md);
    box-shadow: var(--1c-shadow-md);
    border: 1px solid var(--1c-border);
}

[data-theme="modern"] .top-menu__logout {
    border-radius: var(--1c-radius-sm);
    font-weight: 500;
    color: var(--1c-text-secondary);
}

[data-theme="modern"] .top-menu__logout:hover {
    background: #fef2f2;
    color: var(--1c-error);
}

[data-theme="modern"] .top-menu__density,
[data-theme="modern"] .top-menu__theme {
    border-left: 1px solid var(--1c-border);
}

[data-theme="modern"] .top-menu__density select,
[data-theme="modern"] .top-menu__theme select {
    border-radius: var(--1c-radius-sm);
    border-color: var(--1c-border);
}

/* ——— Контент ——— */
[data-theme="modern"] .content-header {
    background: transparent;
    border-bottom: none;
    padding: 16px 20px 8px;
}

[data-theme="modern"] .page-title {
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--1c-text-emphasis);
}

[data-theme="modern"] .content-body {
    padding: 8px 20px 20px;
    background: var(--1c-bg);
}

[data-theme="modern"] .content-card,
[data-theme="modern"] .panel-page {
    border: 1px solid var(--1c-border);
    border-radius: var(--1c-radius-md);
    box-shadow: var(--1c-shadow-sm);
    margin-bottom: var(--1c-content-gap);
    overflow: hidden;
}

[data-theme="modern"] .content-card .panel-header,
[data-theme="modern"] .content-card > h5:first-child {
    background: var(--1c-surface-muted);
    border-bottom: 1px solid var(--1c-border);
    font-weight: 600;
    font-size: var(--1c-font-size-small);
    text-transform: none;
    letter-spacing: 0;
    padding: 10px 14px;
}

[data-theme="modern"] .content-card > .table-responsive,
[data-theme="modern"] .content-card > table,
[data-theme="modern"] .content-card > .row,
[data-theme="modern"] .content-card > div:not(.panel-header) {
    padding: 12px 14px;
}

/* ——— Панелі інструментів ——— */
[data-theme="modern"] .toolbar-1c,
[data-theme="modern"] .filter-panel-1c,
[data-theme="modern"] .toolbar {
    background: var(--1c-panel-bg);
    border: 1px solid var(--1c-border);
    border-radius: var(--1c-radius-md);
    padding: 10px 12px;
    margin-bottom: var(--1c-content-gap);
    box-shadow: var(--1c-shadow-sm);
    gap: 8px;
}

/* ——— Кнопки ——— */
[data-theme="modern"] .btn,
[data-theme="modern"] .btn-1c,
[data-theme="modern"] .btn-outline-secondary,
[data-theme="modern"] .btn-outline-primary,
[data-theme="modern"] .btn-outline-danger,
[data-theme="modern"] .btn-outline-info,
[data-theme="modern"] .btn-outline-success,
[data-theme="modern"] .btn-secondary {
    border-radius: var(--1c-radius-sm);
    border-color: var(--1c-border);
    font-weight: 500;
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}

[data-theme="modern"] .btn-primary {
    background: var(--1c-button-primary);
    border-color: var(--1c-accent-border);
    color: var(--1c-text-on-accent);
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(37, 99, 235, 0.2);
}

[data-theme="modern"] .btn-primary:hover {
    background: var(--1c-accent-border);
    border-color: #1e40af;
}

[data-theme="modern"] .btn-1c:hover,
[data-theme="modern"] .btn-outline-secondary:hover {
    background: var(--1c-surface-subtle);
    border-color: #94a3b8;
}

/* ——— Таблиці ——— */
[data-theme="modern"] .table-1c {
    border-radius: var(--1c-radius-sm);
    overflow: hidden;
}

[data-theme="modern"] .table-1c th {
    background: var(--1c-grid-header);
    border: none;
    border-bottom: 2px solid var(--1c-border);
    font-weight: 600;
    font-size: var(--1c-font-size-small);
    color: var(--1c-text-secondary);
    text-transform: none;
    letter-spacing: 0.01em;
    padding: var(--1c-table-head-padding-y) var(--1c-table-head-padding-x);
}

[data-theme="modern"] .table-1c td {
    border: none;
    border-bottom: 1px solid var(--1c-border);
    padding: var(--1c-table-cell-padding-y) var(--1c-table-cell-padding-x);
}

[data-theme="modern"] .table-1c tr:last-child td {
    border-bottom: none;
}

[data-theme="modern"] .table-1c tr:hover td {
    background: var(--1c-grid-row-hover);
}

[data-theme="modern"] .table-1c tr.selected td,
[data-theme="modern"] .table-1c tr.selected-row td {
    background: var(--1c-grid-row-selected);
    color: var(--1c-text-emphasis);
    font-weight: 600;
}

[data-theme="modern"] .table-1c tr.selected td .text-muted,
[data-theme="modern"] .table-1c tr.selected-row td .text-muted,
[data-theme="modern"] .table-1c tr.selected td .small,
[data-theme="modern"] .table-1c tr.selected-row td .small {
    color: var(--1c-text-secondary);
}

/* ——— Форми ——— */
[data-theme="modern"] .form-label {
    font-weight: 500;
    color: var(--1c-text-secondary);
    margin-bottom: 4px;
    font-size: var(--1c-font-size-small);
}

[data-theme="modern"] .form-control,
[data-theme="modern"] .form-select {
    border-radius: var(--1c-radius-sm);
    border-color: var(--1c-input-border);
    padding: var(--1c-form-padding-y) var(--1c-form-padding-x);
    transition: border-color 0.15s, box-shadow 0.15s;
}

[data-theme="modern"] .form-control:focus,
[data-theme="modern"] .form-select:focus {
    border-color: var(--1c-input-focus);
    box-shadow: 0 0 0 3px var(--1c-accent-shadow);
}

/* ——— Вкладки ——— */
[data-theme="modern"] .tabs,
[data-theme="modern"] .nav-tabs {
    border-bottom: 1px solid var(--1c-border);
    gap: 4px;
    margin-bottom: 14px;
}

[data-theme="modern"] .tab,
[data-theme="modern"] .nav-tabs .nav-link {
    border: none;
    border-radius: var(--1c-radius-sm) var(--1c-radius-sm) 0 0;
    background: transparent;
    color: var(--1c-text-secondary);
    font-weight: 500;
    margin-right: 0;
    padding: 8px 14px;
}

[data-theme="modern"] .tab.active,
[data-theme="modern"] .nav-tabs .nav-link.active {
    background: var(--1c-panel-bg);
    color: var(--1c-accent);
    border-bottom: 2px solid var(--1c-accent);
    font-weight: 600;
    margin-bottom: -1px;
}

/* ——— Модалки ——— */
[data-theme="modern"] .modal-overlay .modal-dialog,
[data-theme="modern"] .modal-dialog {
    border-radius: var(--1c-radius-lg);
    border: 1px solid var(--1c-modal-border);
    box-shadow: var(--1c-shadow-md);
    overflow: hidden;
}

[data-theme="modern"] .modal-overlay .modal-header,
[data-theme="modern"] .modal-header {
    background: var(--1c-surface-muted);
    border-bottom: 1px solid var(--1c-border);
    font-weight: 600;
}

/* ——— Панель швидких клавіш ——— */
[data-theme="modern"] .app-hotkeys-bar {
    background: var(--1c-panel-bg);
    border-top: 1px solid var(--1c-border);
    color: var(--1c-text-muted);
    font-size: var(--1c-font-size-small);
}

[data-theme="modern"] .app-hotkeys-bar__item {
    border-right-color: var(--1c-border);
}

[data-theme="modern"] .app-hotkeys-bar__item kbd {
    border-radius: 4px;
    border-color: var(--1c-border);
    background: var(--1c-surface-subtle);
    font-weight: 600;
}

/* ——— Тости ——— */
[data-theme="modern"] .toast-container .toast,
[data-theme="modern"] #toastContainer .toast {
    border-radius: var(--1c-radius-md);
    box-shadow: var(--1c-shadow-md);
}

/* ——— Сторінка входу ——— */
[data-theme="modern"] body.login-page {
    background: var(--1c-bg);
}

[data-theme="modern"] .login-desktop-bg {
    background: linear-gradient(145deg, #eff6ff 0%, #dbeafe 40%, #f1f5f9 100%);
}

[data-theme="modern"] .login-window {
    border: 1px solid var(--1c-border);
    border-radius: var(--1c-radius-lg);
    box-shadow: var(--1c-shadow-md);
    overflow: hidden;
}

[data-theme="modern"] .login-header {
    background: var(--1c-surface-muted);
    border-bottom: 1px solid var(--1c-border);
    padding: 12px 16px;
}

[data-theme="modern"] .login-header .window-title {
    font-weight: 600;
    font-size: var(--1c-font-size);
}

[data-theme="modern"] .login-body {
    padding: 24px 28px 28px;
}

[data-theme="modern"] .login-body .form-control {
    border-radius: var(--1c-radius-sm);
}

[data-theme="modern"] .login-body .btn-primary,
[data-theme="modern"] .login-body .btn-login {
    border-radius: var(--1c-radius-sm);
    background: var(--1c-accent);
    border-color: var(--1c-accent-border);
    color: var(--1c-text-on-accent);
    font-weight: 600;
}

[data-theme="modern"] .login-body .btn-primary:hover,
[data-theme="modern"] .login-body .btn-login:hover {
    background: var(--1c-accent-border);
}

/* ——— Виділення / активні стани (світло-голубий фон + темний текст) ——— */
[data-theme="modern"] .search-mode-btn.active,
[data-theme="modern"] .quick-category-btn.active,
[data-theme="modern"] .payment-method-btn.active,
[data-theme="modern"] .categories-panel .category-item.active,
[data-theme="modern"] .categories-tree-panel .category-item.active,
[data-theme="modern"] .list-group-item.active,
[data-theme="modern"] .new-sale-catalog .new-sale-table-footer .pagination button.active,
[data-theme="modern"] .products-page .pagination button.active,
[data-theme="modern"] .storage-page .pagination-1c .page-link-btn.active,
[data-theme="modern"] .logs-page .pagination button.active,
[data-theme="modern"] .sale-pay-method.active,
[data-theme="modern"] .rsb-action-method:active:not([disabled]):not(.is-disabled) {
    background: var(--1c-accent-subtle) !important;
    color: var(--1c-accent-subtle-text) !important;
    border-color: var(--1c-accent-subtle-border) !important;
    font-weight: 600;
    box-shadow: none;
}

[data-theme="modern"] .categories-panel .category-item.active,
[data-theme="modern"] .categories-tree-panel .category-item.active,
[data-theme="modern"] .list-group-item.active {
    border-left-color: var(--1c-accent) !important;
}

[data-theme="modern"] .categories-panel .category-item.active i,
[data-theme="modern"] .categories-tree-panel .category-item.active i {
    color: var(--1c-accent-subtle-text) !important;
}

[data-theme="modern"] .qty-btn:hover {
    background: var(--1c-accent-subtle);
    color: var(--1c-accent-subtle-text);
    border-color: var(--1c-accent-subtle-border);
}

[data-theme="modern"] .search-results .result-item:hover,
[data-theme="modern"] .product-search-item:hover {
    background: var(--1c-accent-subtle);
    color: var(--1c-accent-subtle-text);
}

[data-theme="modern"] .top-menu__link.active,
[data-theme="modern"] .top-menu__dropdown a.active {
    background: var(--1c-accent-subtle);
    color: var(--1c-accent-subtle-text);
}