/* Файл shared_variables.css */

/* shared_variables.css */

:root {
    /* По умолчанию — для десктопа */
    --font_size__0: 8px;
    --font_size_0: 17px;
    --font_size_1: calc(var(--font_size_0) * 1.1);
    --font_size_2: calc(var(--font_size_0) * 1.2);
    --font_size_3: calc(var(--font_size_0) * 1.3);
    --font_size_10: calc(var(--font_size_0) * 2);
    --font_size_button: calc(var(--font_size_0) * 0.85);

    --bg-1: #ffff;
    --bg-2: #edf1f5;
    --card: rgba(255, 255, 255, .92);
    --page_background: #e9edf0;
    --shadow: 0 6px 14px rgba(15, 23, 42, .06);

    --border: #d7e7f2;

    --accent: #3d84c4;
    --accent-blue: #2f75b5;
    --blue-navy: #2a4d8f;

    --accent-orange-bg: #fff7e6;

    --accent-yellow-border: #f0a500;
    --accent-orange-text: #c45a15;
    --color_3: #ce612f;
    --accent-2: #d4702b;

    --accent-red: #d23f3f;
    --accent-red-bright: #ff5b5b;
    --accent-success: #2f9e66;
    --accent-success-hover: #248655;

    --text-3: #64748b;
    --text-1: #0f2a15;
    --text-2: #334155;
}


/* Мобильные устройства (до 680px) */
@media (max-width: 680px) {
    :root {
        --font_size_0: 11px;

        --font_size_3: calc(var(--font_size_0) * 1.25); /* 19,5px */
        --font_size_10: calc(var(--font_size_0) * 1.8); /* 30px */
    }
}


/* Мобильные устройства (до 768px) */
@media (max-width: 768px) {
    :root {
        --font_size_0: 13px;
        --font_size_3: calc(var(--font_size_0) * 1.2); /* 19,5px */
        --font_size_10: calc(var(--font_size_0) * 1.6); /* 30px */
    }
}


/* Очень большие экраны (десктоп/мониторы) */
@media (min-width: 2200px) {
    :root {
        --font_size_0: 18px;
    }
}
/* Файл common_layout.css */

.tab-content-item.active:has(> .management-workspace),
.tab-content-item.active:has(> .company-information-root),
.tab-content-item.active:has(> .meetings-root),
.tab-content-item.active:has(> .taxes-and-reporting-root) {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

.management-workspace,
.company-information-root,
.taxes-and-reporting-root {
    display: flex;
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    box-sizing: border-box;
}

.management-workspace > .tab-widget-container,
.company-information-root > .tab-widget-container,
.taxes-and-reporting-root > .tab-widget-container {
    flex: 1 1 auto;
    min-height: 0;
}

.tab-content .tab-content-wrapper.scrollable
> .tab-content-item.active:has(> .management-workspace),
.tab-content .tab-content-wrapper.scrollable
> .tab-content-item.active:has(> .company-information-root),
.tab-content .tab-content-wrapper.scrollable
> .tab-content-item.active:has(> .meetings-root),
.tab-content .tab-content-wrapper.scrollable
> .tab-content-item.active:has(> .taxes-and-reporting-root) {
    overflow: hidden !important;
    scrollbar-gutter: auto;
}

.house-details-card,
.company-information__card,
.company-information__documents,
.meeting-card > .house-details-card,
.question-drawer-form,
.workspace-card {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size_1);
    background: var(--bg-1);
    color: var(--blue-navy);
    box-shadow: var(--shadow);
}

.house-details-title,
.company-information__card h3,
.company-information__documents h3,
.meeting-card-title,
.workspace-card__title,
.workspace-card > h3,
.workspace-card > h2 {
    margin: 0 0 var(--font_size_0);
    color: var(--blue-navy);
    font-size: var(--font_size_3);
    font-weight: 700;
    line-height: 1.15;
}

.workspace-card__title-group {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: calc(var(--font_size__0) / 2);
    margin-bottom: var(--font_size_0);
}

.workspace-card__title-group > :last-child {
    margin-bottom: 0;
}

.workspace-card__subtitle,
.workspace-card__intro,
.workspace-card p,
.workspace-card li {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.workspace-card__intro,
.workspace-card p {
    margin-top: 0;
}

.workspace-form-grid {
    display: grid;
    gap: var(--font_size_0);
}

.workspace-form-grid--three {
    grid-template-columns: repeat(3, minmax(160px, 1fr));
}

.workspace-form-grid--two {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
}

.workspace-field,
.house-details-params,
.house-details-files,
.meeting-field,
.meeting-answers-block,
.meeting-question-list {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: var(--font_size__0);
}

.workspace-field > span,
.house-details-paramrow > span,
.company-information__field > span,
.meeting-field > span,
.meeting-answers-block > span {
    color: var(--text-3);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.workspace-input,
.workspace-select,
.workspace-textarea,
.house-details-paramrow input,
.house-details-apartmentrow input,
.company-information__field input,
.company-information__field select,
.meeting-field input,
.meeting-answer-row input {
    width: 100%;
    min-width: 0;
    height: calc(var(--font_size_10) + var(--font_size__0));
    box-sizing: border-box;
    margin: 0;
    padding: 0 var(--font_size_0);
    outline: none;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--blue-navy);
    font: inherit;
    font-size: var(--font_size_0);
}

.workspace-textarea {
    min-height: calc(var(--font_size_10) * 2.5);
    height: auto;
    padding-top: var(--font_size__0);
    padding-bottom: var(--font_size__0);
    resize: vertical;
}

.workspace-input:focus,
.workspace-select:focus,
.workspace-textarea:focus,
.house-details-paramrow input:focus,
.house-details-apartmentrow input:focus,
.company-information__field input:focus,
.company-information__field select:focus,
.company-information__field textarea:focus,
.meeting-field input:focus,
.meeting-field textarea:focus,
.meeting-answer-row input:focus {
    border-color: var(--accent);
    outline: none;
}

.workspace-card__actions,
.company-information__actions,
.company-information__row-actions,
.meetings-toolbar,
.meeting-card-actions,
.meeting-answer-row,
.meeting-question-actions,
.ndfl-rates-panel__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--font_size__0);
}

.workspace-table-wrap {
    min-width: 0;
    overflow: auto;
    scrollbar-gutter: stable;
}

.counters-toolbar button:disabled,
.counters-import-panel__submit:disabled,
.counterparty-driverbtn:disabled,
.house-details-savebtn:disabled,
.pad-btn-approve:disabled,
.pad-btn-chat:disabled,
.pad-btn-reject:disabled,
.driver_messages_send:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.check_window_table,
.personnel-hires__table,
.personnel-salary__table,
.ndfl-page__table,
.meter-readings-history-table {
    width: 100%;
    border-collapse: collapse;
}

@media (max-aspect-ratio: 1 / 1), (max-width: 900px) {
    .workspace-form-grid--three,
    .workspace-form-grid--two {
        grid-template-columns: 1fr;
    }
}

/* Файл toast.css */

.toast-stack {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.toast {
    background: #1f9d57;
    color: var(--bg-1);
    padding: 10px 14px;
    border-radius: 10px;
    box-shadow: 0 10px 25px rgba(0,0,0,.18);
    max-width: min(420px, calc(100vw - 24px));
    font-size: 14px;
    line-height: 1.25;
    will-change: transform, opacity, background-color;
}

.toast--error {
    background: var(--accent-red);
}

/* быстро и плавно выезжает/уезжает */
.toast--enter {
        animation: toast-in 180ms ease-out both, toast-blink 360ms ease-in-out 180ms 2;
    }

.toast--leave {
    animation: toast-out 180ms ease-in both;
}

@keyframes toast-in {
    from { transform: translateX(-110%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes toast-out {
    from { transform: translateX(0); opacity: 1; }
    to { transform: translateX(-110%); opacity: 0; }
}

@keyframes toast-blink {
    0% { filter: brightness(1); }
    50% { filter: brightness(1.6); }
    100% { filter: brightness(1); }
}
/* Файл DriverPanel.css */

.drawer-overlay {
    position: fixed;
    inset: 0;
    z-index: 999;
    background: var(--text-1);
    opacity: 0.15;
}

.drawer-panel {
    position: fixed;
    top: 0;
    right: 0;
    display: flex;
    width: 58%;
    max-width: 100vw;
    height: 100dvh;
    box-sizing: border-box;
    flex-direction: column;
    overflow: hidden;
    background: var(--bg-2);
    color: var(--blue-navy);
    font-size: var(--font_size_0);
    z-index: 1000;
    transform: translateX(100%);
    transition: transform 0.25s ease;
}

.drawer-panel.open {
    transform: translateX(0);
    box-shadow: var(--shadow);
}

.drawer-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: var(--font_size__0) var(--font_size_0);
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.drawer-header button {
    border: none;
    background: transparent;
    color: var(--bg-1);
    font-size: var(--font_size_1);
    cursor: pointer;
}

.drawer-header button:hover {
    background: transparent;
    color: var(--bg-1);
    transform: none;
    box-shadow: none;
}

.drawer-body {
    flex: 1;
    min-height: 0;
    box-sizing: border-box;
    padding: var(--font_size_0);
    color: var(--blue-navy);
    font-size: var(--font_size_0);
}

.drawer-body--scrollable {
    overflow: auto;
}

.drawer-body--fixed {
    overflow: hidden;
}


.drawer-body .block_1 {
    margin: 0 0 var(--font_size__0);
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size_1);
    background: var(--bg-1);
    box-shadow: var(--shadow);
}

.drawer-body h1,
.drawer-body h2,
.drawer-body h3,
.drawer-body h4,
.drawer-body h5,
.drawer-body h6 {
    margin-top: 0;
    color: var(--blue-navy);
    font-size: var(--font_size_1);
    line-height: 1.2;
}

.drawer-body label,
.drawer-body p,
.drawer-body span,
.drawer-body input,
.drawer-body select,
.drawer-body textarea,
.drawer-body td,
.drawer-body th {
    font-size: var(--font_size_0);
}

.drawer-body label > span,
.drawer-body .label_info,
.drawer-body .label-info {
    color: var(--text-3);
}

.drawer-body input:not([type="checkbox"]):not([type="radio"]),
.drawer-body select,
.drawer-body textarea {
    box-sizing: border-box;
    margin: 0;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--blue-navy);
}

.drawer-body input:not([type="checkbox"]):not([type="radio"]):focus,
.drawer-body select:focus,
.drawer-body textarea:focus {
    border-color: var(--accent);
    outline: none;
    box-shadow: 0 0 0 3px rgba(61, 132, 196, 0.14);
}

@media (orientation: portrait) {
    .drawer-panel {
        width: 98%;
    }
}

@media (max-width: 762px) {
    .drawer-panel {
        width: 98%;
    }
}

.drawer-header__main {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    gap: var(--font_size_0);
}

.drawer-title {
    flex: 0 0 auto;
    white-space: nowrap;
}

.drawer-header__actions {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
    gap: var(--font_size__0);
}

.drawer-header__actions button,
.drawer-header__actions input {
    min-height: 32px;
    box-sizing: border-box;
}

@media (max-width: 762px) {
    .drawer-header {
        align-items: flex-start;
    }

    .drawer-header__main {
        flex-direction: column;
        align-items: flex-start;
    }

    .drawer-header__actions {
        width: 100%;
        flex-wrap: wrap;
    }
}

/* Файл PDFViewer.css */

/* PDFViewer.css */

.PDFViewer-container {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding: var(--font_size__0);
    box-sizing: border-box;
    background: #f3f4f6;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Сам Document */
.PDFViewer-container .react-pdf__Document {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: auto;
    max-width: 100%;
}

/* Обёртка каждой страницы */
.PDFViewer-page {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 0 0 var(--font_size__0) 0;
    overflow: hidden;
}

/* Страница */
.PDFViewer-container .react-pdf__Page {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    max-width: 100%;
    background: white;
}

/* Canvas */
.PDFViewer-container .react-pdf__Page__canvas {
    display: block;
    max-width: 100%;
    height: auto !important;
    margin: 0 auto;
}

/* Текстовый слой и слой аннотаций */
.PDFViewer-container .react-pdf__Page__textContent,
.PDFViewer-container .react-pdf__Page__annotations {
    left: 50% !important;
    transform: translateX(-50%);
    max-width: 100%;
}

.PDFViewer-loading,
.PDFViewer-error {
    width: 100%;
    min-height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--font_size__2);
    box-sizing: border-box;
}
/* Файл attachment_list.css */

/* ── Вложения ── */

.doc-card__attachments-tab .doc-card__empty,
.doc-card__attachments-title {
    font-size: var(--font_size_0);
    line-height: 1.45;
}


.doc-card__file-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.doc-card__file-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: var(--font_size_1);
    border-radius: var(--font_size__0);
    transition: background 0.15s;
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
}

.doc-card__file-item:hover {
    background: var(--bg-1);
}

.doc-card__file-icon {
    width: var(--font_size_10);
    height: var(--font_size_10);
    flex-shrink: 0;
    flex-grow: 0;
}

.doc-card__file-name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: var(--font_size_0);
    color: var(--text-3);
    font-weight: 500;
}

/* Кнопка скачивания доков — прижата к правому краю строки */

.doc-card__file-download {
    margin-left: auto;
    flex-shrink: 0;
    flex-grow: 0;
    color: var(--text-3);
    display: flex;
    align-items: center;
    background: transparent;
    cursor: pointer;
    padding: 8px;
    border: none;
}

.doc-card__file-download:hover {
    color: var(--accent);
}

/* ── Подпись под списком ── */

.doc-card__attachments-footer {
    margin-top: var(--font_size__0);
    padding: var(--font_size__0);
    border: 1px solid var(--text-3);
    border-radius: var(--font_size__0);
    background: var(--card);
    font-size: var(--font_size_0);
    color: var(--text-3);
    display: inline-block;
}

.doc-card__empty--error {
    color: var(--accent-red);
    font-style: normal;
}

@media (max-width: 760px) {
    /* Контейнер списка не вылезает за карточку */
    .doc-card__attachments,
    .doc-card__file-list {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        overflow: hidden;
    }

    /* Строка одного файла */
    .doc-card__file-item {
        display: flex;
        align-items: flex-start;
        gap: 6px;
        padding: 6px 4px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    /* Иконка PDF — фикс, не ужимается */
    .doc-card__file-icon {
        width: 22px;
        height: 22px;
        flex-shrink: 0;
        flex-grow: 0;
    }

    /* Имя — забирает оставшееся место и переносится */
    .doc-card__file-name {
        flex: 1 1 0;
        min-width: 0;
        font-size: var(--font_size_0);
        line-height: 1.3;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        overflow-wrap: break-word;
        word-break: normal;
        hyphens: none;
    }

    /* Кнопки скачивания/удаления — фикс, не сжимаются, помещаются справа */
    .doc-card__file-download,
    .doc-card__file-delete {
        flex-shrink: 0;
        flex-grow: 0;
        width: 28px;
        height: 28px;
        padding: 4px;
        margin: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }

    .doc-card__file-download {
        margin-left: auto;
    }

    .doc-card__file-download svg,
    .doc-card__file-delete svg {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
    }
}


/* Файл document_viewers.css */

/* ── Просмотрщики файлов в DriverPanel ── */

.file-viewer__message {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 24px;
    text-align: center;
    color: var(--text-2, #57606a);
}

.file-viewer__message--error {
    color: #b42318;
}

.file-viewer__text {
    margin: 0;
    max-width: 360px;
    line-height: 1.4;
}

.file-viewer__spinner {
    width: 28px;
    height: 28px;
    border: 3px solid rgba(0, 0, 0, 0.12);
    border-top-color: #0078d4;
    border-radius: 50%;
    animation: file-viewer-spin 0.8s linear infinite;
}

@keyframes file-viewer-spin {
    to {
        transform: rotate(360deg);
    }
}

.file-viewer__download-btn {
    padding: 8px 16px;
    border: 1px solid #0078d4;
    border-radius: 6px;
    background: #0078d4;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
}

.file-viewer__download-btn:disabled {
    opacity: 0.5;
    cursor: default;
}

/* docx */

.docx-viewer {
    width: 100%;
    overflow: auto;
    background: #f3f3f3;
}

.docx-viewer .docx-wrapper {
    padding: 12px;
    background: #f3f3f3;
}

.docx-viewer .docx {
    background: #fff;
    margin: 0 auto;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
}

/* excel — оформление под Excel: зелёные акценты, сетка,
   заголовки столбцов (A, B, …) и номера строк */

.excel-viewer {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.excel-viewer__tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 8px;
    background: #f3f5f4;
    border-bottom: 2px solid #217346;
}

.excel-viewer__tab {
    padding: 4px 12px;
    border: 1px solid #cfd8d3;
    border-bottom: none;
    border-radius: 4px 4px 0 0;
    background: #e8efe9;
    color: #217346;
    cursor: pointer;
    font-size: var(--font_size_0);
    font-weight: 600;
}

.excel-viewer__tab.is-active {
    background: #217346;
    border-color: #217346;
    color: #fff;
}

.excel-viewer__table-wrap {
    overflow: auto;
    max-width: 100%;
    background: #fff;
}

.excel-viewer__table {
    border-collapse: collapse;
    font-size: var(--font_size_0);
    color: #1f2328;
}

.excel-viewer__table td {
    border: 1px solid #d4d4d4;
    padding: 3px 8px;
    white-space: nowrap;
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #fff;
}

.excel-viewer__table tbody tr:hover td {
    background: #eef6f0;
}

/* Заголовки столбцов (буквы) — прибиты к верху */

.excel-viewer__colhead,
.excel-viewer__corner {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #f1f4f2;
    border: 1px solid #cfd8d3;
    color: #4a5a52;
    font-weight: 600;
    text-align: center;
    padding: 3px 8px;
}

/* Номера строк — прибиты к левому краю */

.excel-viewer__rowhead {
    position: sticky;
    left: 0;
    z-index: 1;
    background: #f1f4f2;
    border: 1px solid #cfd8d3;
    color: #4a5a52;
    font-weight: 600;
    text-align: center;
    padding: 3px 8px;
    min-width: 38px;
}

/* Угловая ячейка — поверх и строк, и столбцов */

.excel-viewer__corner {
    left: 0;
    z-index: 3;
    min-width: 38px;
}

.excel-viewer__more {
    align-self: center;
    margin: 12px 0;
}


/* Файл image_and_compact_viewers.css */

/* image */

.image-viewer {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.image-viewer__toolbar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px;
    border-bottom: 1px solid var(--border, #d0d7de);
}

.image-viewer__toolbar button {
    width: 30px;
    height: 28px;
    border: 1px solid var(--border, #d0d7de);
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
    font-size: 15px;
    line-height: 1;
}

.image-viewer__scale {
    margin-left: 4px;
    font-size: var(--font_size_0);
    color: var(--text-2, #57606a);
}

.image-viewer__canvas {
    flex: 1;
    min-height: 320px;
    overflow: hidden;
    background:
        repeating-conic-gradient(#f0f0f0 0% 25%, #fafafa 0% 50%)
        50% / 20px 20px;
    cursor: grab;
}

.image-viewer__canvas:active {
    cursor: grabbing;
}

.image-viewer__img {
    display: block;
    margin: 0 auto;
    transform-origin: center center;
    user-select: none;
    -webkit-user-drag: none;
}

.docx-viewer .docx-wrapper {
    padding: 0;
    background: #ffffff;
}

.docx-viewer .docx {
    margin: 0 auto;
    box-shadow: none;
}

.csv-viewer .excel-viewer__table-wrap {
    background: #ffffff;
}

/* Компактный DocumentAttachments для сообщений мессенджера. */

.doc-card__attachments--compact {
    width: 100%;
    margin-top: 6px;
}

.doc-card__attachments--compact .doc-card__file-list {
    width: 100%;
}

.doc-card__attachments--compact .doc-card__file-item {
    align-items: center;
    gap: 6px;
    padding: var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    cursor: pointer;
}

.doc-card__attachments--compact .doc-card__file-item:hover {
    background: var(--bg-2);
}

.doc-card__attachments--compact .doc-card__file-icon {
    width: 28px;
    height: 28px;
}

.doc-card__attachments--compact .doc-card__file-name {
    color: var(--text-1);
    font-size: inherit;
    line-height: 1.2;
}

.doc-card__attachments--compact .doc-card__file-download {
    width: 30px;
    height: 30px;
    padding: 5px;
}

.doc-card__attachments--compact .doc-card__attachments-footer {
    display: none;
}

/* Файл DocumentAttachments.css */

/* Файл Button.css */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 0;
    min-height: 34px;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--bg-1);
    background: var(--accent);
    font-family: inherit;
    font-size: var(--font_size_button);
    font-weight: 400;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition:
        background-color .16s ease,
        border-color .16s ease,
        box-shadow .16s ease,
        transform .06s ease;
}

.btn:hover:not(:disabled):not(.disabled) {
    background: var(--accent-blue);
    box-shadow: 0 4px 12px rgba(15, 23, 42, .14);
}

.btn:active:not(:disabled):not(.disabled) {
    transform: translateY(1px);
    box-shadow: none;
}

.btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
    outline-offset: 2px;
}

.btn-primary {
    color: var(--bg-1);
    background: var(--accent);
    border-color: var(--accent);
}

.btn-secondary {
    color: var(--text-2);
    background: var(--bg-1);
    border-color: var(--border);
}

.btn-secondary:hover:not(:disabled):not(.disabled) {
    color: var(--accent-blue);
    background: var(--bg-2);
    border-color: var(--accent);
}

.btn-success {
    color: var(--bg-1);
    background: var(--accent-success);
    border-color: var(--accent-success);
}

.btn-success:hover:not(:disabled):not(.disabled) {
    background: var(--accent-success-hover);
}

.btn-danger {
    color: var(--bg-1);
    background: var(--accent-red);
    border-color: var(--accent-red);
}

.btn-danger:hover:not(:disabled):not(.disabled) {
    background: var(--accent-red-bright);
}

.btn-orange {
    color: var(--bg-1);
    background: var(--accent-2);
    border-color: var(--accent-2);
}

.btn-orange:hover:not(:disabled):not(.disabled) {
    background: var(--accent-orange-text);
}

.btn-ghost {
    color: var(--accent-blue);
    background: transparent;
    border-color: transparent;
}

.btn-ghost:hover:not(:disabled):not(.disabled) {
    background: var(--bg-2);
    box-shadow: none;
}

.btn-small {
    min-height: 30px;
    padding: 4px 9px;
    font-size: calc(var(--font_size_button) * .9);
}

.btn-medium {
    min-height: 34px;
    padding: 6px 12px;
}

.btn-large {
    min-height: 40px;
    padding: 8px 16px;
    font-size: calc(var(--font_size_1) * .85);
}

.btn-wrap {
    white-space: normal;
    overflow-wrap: anywhere;
}

.btn-stretch {
    width: 100%;
    height: 100%;
}

.btn-full-width {
    width: 100%;
}

.btn-square {
    width: 34px;
    min-width: 34px;
    padding: 0;
}

.btn-small.btn-square {
    width: 30px;
    min-width: 30px;
}

.btn-active {
    color: var(--bg-1);
    background: var(--blue-navy);
    border-color: var(--blue-navy);
}

.btn:disabled,
.btn.disabled {
    opacity: .55;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}


@media (orientation: portrait), (max-width: 680px) {
    .btn {
        min-height: 32px;
        padding: 5px 9px;
    }

    .btn-small {
        min-height: 28px;
        padding: 3px 7px;
    }
}
/* Файл page_authorization.css */

.page_authorization {
    width: 100%;
    min-height: 100dvh;
    box-sizing: border-box;
    overflow-x: hidden;
    background: var(--bg-1);
    color: var(--text-1);
    font-family:
        system-ui,
        -apple-system,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif;
    font-size: var(--font_size_0);
}

.page_authorization .label_info_3 {
    color: var(--text-1);
    font-size: var(--font_size_10);
}

.page_authorization input {
    box-sizing: border-box;
    margin-top: 4px;
    margin-bottom: var(--font_size__0);
    border: 1px solid var(--border);
    background: var(--bg-2);
    color: var(--text-1);
    font-family: inherit;
    font-size: var(--font_size_0);
}

.page_authorization button {
    background: var(--accent-blue);
    color: var(--bg-1);
    font-family: inherit;
    font-size: var(--font_size_0);
}

.page_authorization button:hover {
    background: var(--blue-navy);
}

.consent-block .pd-policy-link {
    color: var(--accent-blue);
    text-decoration: underline;
    cursor: pointer;
}

.consent-block .pd-policy-link:hover {
    opacity: 0.7;
}

#button_login:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.consent-block {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
    margin: var(--font_size_0);
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    box-sizing: border-box;
    color: var(--text-2);
    font-size: var(--font_size_0);
    line-height: 1.4;
    text-align: left;
}

.consent-hint {
    padding: var(--font_size__0) var(--font_size_0);
    border: 1px solid var(--accent-yellow-border);
    border-radius: var(--font_size__0);
    background: var(--accent-orange-bg);
    color: var(--accent-orange-text);
    font-size: var(--font_size_0);
}

.consent-hint-icon {
    margin-right: 4px;
    font-weight: 700;
}

.consent-row {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    column-gap: var(--font_size__0);
    align-items: start;
}

.consent-row .consent-badge {
    grid-row: 1;
    grid-column: 3;
}

.consent-row--accepted {
    align-items: center;
}

.consent-accepted-icon {
    grid-row: 1;
    grid-column: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: var(--bg-2);
    color: var(--accent-blue);
    font-size: var(--font_size_0);
    font-weight: 700;
    line-height: 1;
}

.consent-checkbox {
    width: 18px;
    height: 18px;
    margin-top: 4px;
    cursor: pointer;
}

.consent-text {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.consent-text label {
    cursor: pointer;
}

.consent-divider {
    width: 100%;
    height: 1px;
    background: var(--border);
}

.consent-badge {
    display: inline-block;
    align-self: start;
    margin-top: 4px;
    padding: 4px var(--font_size__0);
    border-radius: var(--font_size_0);
    font-size: var(--font_size_0);
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.consent-badge--required {
    border: 1px solid var(--accent-red);
    background: var(--bg-1);
    color: var(--accent-red);
}

.consent-badge--optional {
    border: 1px solid var(--border);
    background: var(--bg-2);
    color: var(--accent-blue);
}

.auth-pd-side {
    display: none;
}

.auth-pd-inline {
    display: block;
    box-sizing: border-box;
    margin-top: var(--font_size_0);
    margin-bottom: var(--font_size_1);
    padding: 0 var(--font_size_0);
    text-align: center;
}

.auth-pd-inline .consent-block {
    margin-left: auto;
    margin-right: auto;
}

@media (orientation: landscape) and (min-width: 769px) {
    .page_authorization {
        position: fixed;
        inset: 0 auto 0 0;
        display: flex;
        width: 50%;
        height: 100dvh;
        min-height: 0;
        flex-direction: column;
        justify-content: center;
        padding: var(--font_size_0);
        overflow: hidden;
    }

    .page_authorization > p,
    .page_authorization form > p {
        margin-top: 4px;
        margin-bottom: 4px;
    }

    .page_authorization form {
        margin: 0;
    }

    .auth-pd-inline {
        display: none;
        margin: 0;
        padding: 0;
    }

    .auth-pd-side {
        position: fixed;
        top: 0;
        right: 0;
        display: flex;
        width: 50%;
        height: 100dvh;
        box-sizing: border-box;
        align-items: center;
        justify-content: center;
        padding: var(--font_size__0);
        overflow: hidden;
        border-left: 1px solid var(--border);
        background: var(--bg-1);
    }

    .auth-pd-side .consent-block {
        width: calc(100% - var(--font_size_1));
        max-height: calc(100dvh - var(--font_size_10));
        margin: 0;
        overflow-y: auto;
    }

    #button_register {
        position: fixed;
        top: var(--font_size_0);
        right: var(--font_size_1);
        z-index: 5;
        margin: 0;
    }
}

/* Файл page_load_mobile_version.css */

.page_load_mobile_version {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Arial', sans-serif;
    line-height: 1.6;
    color: var(--text-1);
    background-color: #f5f5f5;
    display: flex;
    min-height: 100vh;


    /* Стили для левой секции */
    .left-section {
        flex: 1;
        padding-left: 40px;
        padding-right: 25px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background-color: var(--bg-1);
    }

    .left-section h1 {
        font-size: 2.5rem;
        margin-bottom: var(--font_size_10);
        text-align: center;
        color: #2c3e50;
    }

    .app-image {
        margin-left: 50%;
        width: 80%;
    }

    .app-image img {
        width: 25%;
    }

    .app-description {
        font-size: 1.1rem;
        text-align: justify;
        color: #2c3e50;
    }

    .left-section button {
        background: none;
        border: none;
        cursor: pointer;
    }


    /* Стили для правой секции */
    .right-section {
        flex: 1;
        padding: 40px;
        background-color: #f8f9fa;
        display: flex;
        flex-direction: column;
    }

    /* Контейнер для прокрутки */
    .changelog-container {
        flex: 1;
        overflow-y: auto;
        max-height: calc(100vh - 80px);  /* Высота с учетом padding */
        padding-right: 10px;  /* Отступ для скроллбара */
    }

    /* Стили для скроллбара */
    .changelog-container::-webkit-scrollbar {
        width: 8px;
    }

    .changelog-container::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 4px;
    }

    .changelog-container::-webkit-scrollbar-thumb {
        background: #c1c1c1;
        border-radius: 4px;
    }

    .changelog-container::-webkit-scrollbar-thumb:hover {
        background: #a8a8a8;
    }

    .changelog {
        max-width: 600px;
        margin: 0 auto;
    }

    .changelog-item {
        background: white;
        border-radius: 8px;
        margin-bottom: var(--font_size_3);
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        overflow: hidden;
    }

    .changelog-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: var(--font_size_3);
        cursor: pointer;
        background-color: var(--bg-1);
        border-bottom: 1px solid #eee;
    }

    .changelog-info {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

    .date {
        font-weight: bold;
        color: '#22c3e50';
        font-size: 1rem;
    }

    .version {
        color: #3498db;
        font-weight: bold;
        font-size: 0.9rem;
    }

    .toggle-btn {
        background: #3498db;
        color: white;
        border: none;
        width: var(--font_size_10);
        height: var(--font_size_10);
        border-radius: 50%;
        font-size: 1.2rem;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background-color 0.3s ease;
    }

    .toggle-btn:hover {
        background: #2980b9;
    }

    .changelog-details {
        display: none;
        padding: var(--font_size_3);
        background-color: #f8f9fa;
        border-top: 1px solid #eee;
    }

    .improvements, .fixes {
        margin-bottom: 15px;
    }

    .improvements strong,
    .fixes strong {
        color: #2c3e50;
        display: block;
        margin-bottom: 8px;
    }

    .improvements ul, .fixes ul {
        list-style-type: none;
        padding-left: 0;
    }

    .improvements li, .fixes li {
        padding: 5px 0;
        padding-left: 15px;
        position: relative;
    }

    .improvements li::before, .fixes li::before {
        content: "•";
        color: #3498db;
        position: absolute;
        left: 0;
    }


    /* Адаптивность для мобильных устройств */
    @media (max-aspect-ratio: 1/1) {
        &  {
            flex-direction: column;
        }
        
        .left-section, .right-section {
            width: 100%;
        }
        
        .left-section {
            min-height: auto;
            padding: var(--font_size_10) var(--font_size_3);
        }
        
        .right-section {
            padding: var(--font_size_3);
        }
        
        .changelog-container {
            max-height: none;
            overflow-y: visible;
        }
        
        .left-section h1 {
            font-size: 2rem;
        }
    }


    /* Дополнительные медиа-запросы для очень маленьких экранов */
    @media (max-width: 480px) {
        .left-section h1 {
            font-size: 1.5rem;
        }
        
        .app-description {
            font-size: 1rem;
        }
        
        .changelog-header {
            padding: 15px;
        }
        
        .changelog-details {
            padding: 15px;
        }
    }
}
/* Файл base.css */

/* base.css */

html, body {
    height: 100%;
    margin: 0px;
    padding: 0px;
    font-family: Arial, sans-serif;
}


/* Контейнер виджета */
.tab-widget-container {
    position: relative;
    width: 100%;
    height: 100%;
}


/* Кнопка меню */
.menu-button {
    display: none;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 1000;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    width: 40px;
       height: 40px;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.menu-button span {
    display: block;
    width: 100%;
    height: 4px;
    background-color: #fd7e14;
    border-radius: 2px;
    transition: all 0.3s ease;
}

.menu-button:hover span {
    background-color: #e96b00;
}

.menu-button.active span:nth-child(1) {
    transform: rotate(45deg) translate(8px, 8px);
}

.menu-button.active span:nth-child(2) {
    opacity: 0;
}

.menu-button.active span:nth-child(3) {
    transform: rotate(-45deg) translate(8px, -8px);
}


/* Где располагаются виджеты */
.tab-content-item {
    display: none;
    box-sizing: border-box;
    width: 100%;
}

.tab-content-item.active {
    display: flex;
    flex-direction: column;
}


/* Анимации */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}


/* nav-footer не должен растягивать сайдбар — ширину задают вкладки.
   Хак width:0 + min-width:100% заставляет flex-ребёнка занимать
   ширину родителя, а не растягивать его своим содержимым. */
.nav-footer {
    align-self: stretch;
    width: 0;
    min-width: 100%;
    box-sizing: border-box;
}


/* Кнопка "Политика обработки персональных данных" в nav-footer — единый стиль для всех тем */
.nav-footer .policy-button {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
    background: transparent;
    font-size: var(--font_size_0);
    color: var(--bg-1);
    cursor: pointer;
    text-decoration: underline;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.3;
    text-align: center;
}

.nav-footer .label-info {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    box-sizing: border-box;
}

.nav-footer .policy-button:hover {
    opacity: 0.7;
}


.tab-widget-container {
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.tab-content-wrapper.scrollable,
.tab-content-wrapper.scrollable > .tab-content-item.active.scrollable-content {
    flex: 1 1 auto;
    min-height: 0;
}
/* Единое ограничение приложения высотой видимой области экрана.
   Внешний body не прокручивается: прокруткой управляет содержимое вкладки. */
html,
body,
#root {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

.tab-widget-container,
.tab-container-left,
.tab-container-top,
.tab-content-wrapper,
.tab-content-item.active {
    min-height: 0;
    max-height: 100%;
}

.tab-widget-container,
.tab-container-left,
.tab-container-top {
    overflow: hidden;
}

/* Верхняя конфигурационная панель занимает ровно высоту окна.
   Внутренние экраны получают доступную высоту и создают собственный скролл. */
#tab-container-tab_0 > .tab-content-wrapper.scrollable
> .tab-content-item.active.scrollable-content {
    overflow: hidden;
}

#tab-container-tab_0 > .tab-content-wrapper.scrollable
> .tab-content-item.active.scrollable-content > * {
    flex: 1 1 auto;
    min-height: 0;
    /* max-height: 100%; */
    overflow: auto;
}
/* Файл tabs.css */

/* tabs.css */

.tab-link {
    padding: 0.4rem;
    margin-bottom: var(--tab-margin-bottom, 0.5rem);
    text-decoration: none;
    color: #495057;
    border: 0;
    border-radius: 0.375rem;
    background: transparent;
    cursor: pointer;
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.2;
    min-height: 2.4rem;
    display: flex;
    align-items: left;
    justify-content: left;
    text-align: left;
    width: 100%;
    box-sizing: border-box;
}

.tab-link:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.tab-link.active {
    cursor: default;
    color: rgb(44, 39, 39);
    background-color: #fd7e14;
}

.tab-item-wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    margin-bottom: var(--tab-margin-bottom, 0.5rem);
}

.tab-close-button {
    background: none;
    border: none;
    color: #d33b3b;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    padding: 6px;
    border-radius: 3px;
    display: flex;
    justify-content: left;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.tab-close-button:hover {
    background-color: #e0e0e0;
    color: #333;
}
/* Файл left-panel.css */

/* left-panel.css */

/* Левая панель с вкладками */
.tab-container-left {
    display: flex;
    position: relative;
    transition: margin-left 0.3s ease;
}

.tab-nav-left {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    background-color: #f8f9fa;
    padding-top: 0.2rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    width: var(--left-panel-width, auto);
    min-width: var(--left-panel-width, 200px);
    box-sizing: border-box;
    transition: transform 0.3s ease;
    z-index: 100;
    position: relative;
}

.tab-content-wrapper {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    transition: margin-left 0.3s ease;
}

.tab-content-left {
    box-sizing: border-box;
    height: 100%;
}

/* Для левой панели - многострочный текст */
.tab-nav-left .tab-link {
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.2;
    min-height: 0rem;
    display: flex;
    justify-content: left;
    text-align: left;
}

/* Для левой панели - кнопка закрытия под текстом */
.tab-nav-left .tab-item-wrapper {
    flex-direction: column;
    align-items: stretch;
}

.tab-nav-left .tab-close-button {
    margin-top: 0.25rem;
    margin-right: 0;
}

/* Класс для скрытия панели */
.tab-container-left.hide-panel .tab-nav-left {
    display: none;
}

.tab-container-left.hide-panel .tab-content-wrapper,
.tab-container-left.fixed-panel {
    margin-left: 0 !important;
}

.tab-container-left.fixed-panel .tab-nav-left {
    transform: translateX(0) !important;
    position: relative !important;
}

.tab-container-left.fixed-panel .menu-button {
    display: none !important;
}
/* Файл top-panel.css */

/* Контейнер для вкладок сверху */
.tab-container-top {
    display: flex;
    flex-direction: column;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0.2rem;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    min-height: 0;
    /* Гасим случайный скролл при ещё не завершённой загрузке
       контента (мерцающий скролл вокруг TabWidget). Внутренний
       контент сам управляет своим скроллом. */
    overflow: hidden;
}

/* Оформление вкладки перенесено на .tab-item-wrapper,
   чтобы крестик визуально оказался внутри общей рамки. */
.tab-container-top .tab-nav-top .tab-link:not(.active) {
    background: transparent !important;
    color: #24507a !important;
    border: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

.tab-container-top .tab-nav-top .tab-link:not(.active):hover {
    background: transparent !important;
    color: #0b5ca8 !important;
}

.tab-container-top .tab-nav-top .tab-link.active {
    background: transparent !important;
    color: #ffffff !important;
    border: none !important;
    opacity: 1 !important;
    box-shadow: none !important;
}

.tab-content-top {
    box-sizing: border-box;
    width: 100%;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* Wrapper, в котором живут .tab-content-item — также гасит
   паразитный скролл, появляющийся при асинхронной загрузке. */
.tab-container-top > .tab-content-wrapper {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

/* Для верхней панели - однострочный текст */
.tab-nav-top {
    display: flex;
    flex-wrap: wrap;
    gap: 0.28rem;
    margin-bottom: 0.1rem;
    padding: 0.2rem;
    background-color: #f8f9fa;
    border-radius: 0.375rem;
    flex-shrink: 0;
}

.tab-nav-top .tab-link {
    line-height: 1;
    min-height: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: auto;
    margin-bottom: 0;
    padding: 0;

    background: transparent;
    color: #315f8a;
    border: none;
    border-radius: 0;

    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;

    box-shadow: none;

    transition:
        color 0.15s ease;
}

.tab-nav-top .tab-link:hover {
    background: transparent;
    color: #0b5ca8;
    box-shadow: none;
}

.tab-nav-top .tab-link.active {
    background: transparent;
    color: #ffffff;
    box-shadow: none;
}

.tab-nav-top .tab-link.active:hover {
    background: transparent;
    color: #ffffff;
}

/* Рамка/фон вкладки живут на wrapper'е, крестик и текст — внутри. */
.tab-nav-top .tab-item-wrapper {
    display: inline-flex;
    align-items: center;
    flex-direction: row;
    margin-right: 0;
    margin-bottom: 0;

    padding: 0.38rem 0.72rem;
    background: #ffffff;
    border: 1px solid #b8cfe3;
    border-radius: 0.42rem;
    box-shadow: 0 1px 2px rgba(18, 54, 86, 0.08);

    transition:
        background-color 0.15s ease,
        border-color 0.15s ease,
        box-shadow 0.15s ease;
}

.tab-nav-top .tab-item-wrapper:hover {
    background: #eef6ff;
    border-color: #6fa8dc;
    box-shadow: 0 2px 4px rgba(18, 54, 86, 0.14);
}

.tab-nav-top .tab-item-wrapper:has(.tab-link.active) {
    background: #fd7e14;
    border-color: #fd7e14;
    box-shadow: 0 2px 5px rgba(253, 126, 20, 0.28);
}

.tab-nav-top .tab-item-wrapper:has(.tab-link.active):hover {
    background: #f97305;
    border-color: #f97305;
}

/* Крестик */
.tab-nav-top .tab-close-button {
    margin-left: 0.35rem;
    margin-right: 0;

    width: 1.15rem;
    height: 1.15rem;
    padding: 0;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #c44;
    border-radius: 4px;
    background: transparent;
    color: #c44;

    font-size: 0.95rem;
    line-height: 1;
}

.tab-nav-top .tab-close-button:hover {
    background: rgba(220, 53, 69, 0.12);
    color: #dc3545;
    border-color: #dc3545;
}
/* Файл themes.css */

/* themes.css */

/* Стиль "Синяя панель" */
.tab-container-left.blue-panel .tab-nav-left,
.tab-container-top.blue-panel .tab-nav-top {
    background-color: #0056b3;
}

.tab-container-left.blue-panel .tab-link,
.tab-container-top.blue-panel .tab-link {
    color: white;
}

.tab-container-left.blue-panel .tab-link:hover,
.tab-container-top.blue-panel .tab-link:hover {
    background-color: #fca660;
}

.tab-container-left.blue-panel .tab-link.active,
.tab-container-top.blue-panel .tab-link.active {
    background-color: #fd7e14;
    color: white;
}

/* Стиль "Вкладки синие" */
.tab-nav-top.blue-tabs .tab-link {
    background-color: #0d6efd;
    color: white;
}

.tab-nav-top.blue-tabs .tab-link:hover {
    background-color: #0b5ed7;
}

.tab-nav-top.blue-tabs .tab-link.active {
    background-color: #fd7e14;
    color: white;
}

.tab-nav-left.blue-tabs .tab-link {
    background-color: #0d6efd;
    color: white;
}

.tab-nav-left.blue-tabs .tab-link:hover {
    background-color: #0b5ed7;
}

.tab-nav-left.blue-tabs .tab-link.active {
    background-color: #fd7e14;
    color: white;
}

/* Для синих вкладок */
.blue-tabs .tab-close-button {
    color: rgba(255, 255, 255, 0.7);
}

.blue-tabs .tab-close-button:hover {
    background-color: rgba(255, 255, 255, 0.2);
    color: white;
}
/* Файл responsive.css */

/* responsive.css */

/* Медиа-запрос для портретной ориентации */
@media (orientation: portrait) {
    .tab-container-left {
        margin-left: 0 !important;
    }
    
    .tab-nav-left {
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        transform: translateX(-100%);
    }
    
    .tab-nav-left.menu-open {
        transform: translateX(0);
    }
    
    .tab-content-wrapper {
        margin-left: 0 !important;
    }
    
    .menu-button {
        display: flex;
    }
    
    .tab-container-left.menu-open .tab-content-wrapper {
        margin-left: var(--left-panel-width, 200px);
    }
}


/* Медиа-запрос для ландшафтной ориентации */
@media (orientation: landscape) {
    .menu-button {
        display: none !important;
    }
    
    .tab-nav-left {
        transform: translateX(0) !important;
        position: relative !important;
    }
}
/* Файл button_switch.css */

.config-switch-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: calc(var(--font_size__0) * .5);
    margin: 0;
    padding: calc(var(--font_size__0) * .25) calc(var(--font_size__0) * .5);
    border-bottom: 1px solid color-mix(in srgb, var(--bg-1) 14%, transparent);
}

.config-switch-button {
    min-height: 28px;
    padding: 3px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: 999px;
    color: var(--blue-navy);
    background: var(--bg-1);
    font-size: calc(var(--font_size_0) * .85);
    font-weight: 600;
    box-shadow: none;
}

.config-switch-button:hover:not(:disabled):not(.disabled) {
    color: var(--accent-blue);
    background: var(--bg-2);
    border-color: var(--accent);
    box-shadow: none;
    transform: none;
}

.config-switch-button:active:not(:disabled):not(.disabled) {
    transform: none;
}

/* Файл theme-lk.css */

.theme-lk .container {
    width: 100%;
    height: auto;
    min-height: 100%;
    max-height: none;
    overflow: visible;
    padding-left: 15px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.theme-lk .container::-webkit-scrollbar {
    width: 0;
    height: 0;
}

.theme-lk .tab-container-left {
    display: flex;
    position: relative;
    width: 100%;
    height: 100%;
    transition: margin-left 0.3s ease;
}

.theme-lk .tab-nav-left {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    background: linear-gradient(135deg, #3681c7 0%, #73a4b4 100%);
    color: var(--bg-1);
    padding: 20px 18px;
    min-width: 250px;
    box-sizing: border-box;
    transition: transform 0.3s ease;
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.1);
    height: 100dvh;
    overflow-y: auto;
}

/* Только переопределения для theme-lk */
.theme-lk .tab-nav-left .tab-link {
    padding: 10px 38px;
    margin-bottom: 22px;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    font-size: var(--font_size_1);
    color: var(--bg-1);
    justify-content: center;
    min-height: auto;
    transition: background 0.2s, transform 0.2s;
}

.theme-lk .tab-nav-left .tab-link:hover {
    background-color: rgba(255, 255, 255, 0.3);
    transform: translateY(-2px);
}

.theme-lk #house_label,
.theme-lk #apartment_label {
    font-size: var(--font_size_1);
}

.theme-lk #Бокс_переключение_между_домами,
.theme-lk #Бокс_переключение_между_квартирами {
    padding: 5px;
    border: none;
    border-radius: 8px;
    font-size: var(--font_size_0);
    cursor: pointer;
    transition: all 0.2s ease;
    appearance: none;
    background-repeat: no-repeat;
    background-color: transparent;
    color: var(--bg-1);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.theme-lk #Бокс_переключение_между_домами:hover,
.theme-lk #Бокс_переключение_между_квартирами:hover {
    transform: var(--font_size_0);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.theme-lk #Бокс_переключение_между_домами option,
.theme-lk #Бокс_переключение_между_квартирами option {
    background-color: #eaeef1;
    color: #333;
}

.theme-lk .nav-footer .logout-button {
    width: 100%;
    padding: 12px;
    border: none;
    border-radius: 8px;
    background-color: var(--color_3);
    font-size: var(--font_size_1);
    color: var(--bg-1);
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
}

.theme-lk .nav-footer .logout-button:hover {
    background-color: rgba(255, 255, 255, 0.3);
    transform: translateY(-2px);
}

.theme-lk .nav-footer .label-info {
    text-align: center;
    white-space: pre-line;
    font-size: var(--font_size_0);
    align-self: center;
}

.theme-lk .nav-footer {
    margin-top: auto;
    gap: 4px;
}
/* Прокрутка содержимого ЛК выполняется активной вкладкой TabWidget.
   Корневые компоненты вкладок сохраняют естественную высоту и
   выравниваются по верхнему краю. */
.config_LK {
    width: 100%;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

.config_LK > .tab-widget-container,
.config_LK .tab-container-left.theme-lk,
.config_LK .tab-content-wrapper.scrollable {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.config_LK .tab-content-wrapper.scrollable
> .tab-content-item.active.scrollable-content {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.config_LK .tab-content-wrapper.scrollable
> .tab-content-item.active.scrollable-content > * {
    width: 100%;
    height: auto !important;
    min-height: 100%;
    max-height: none !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
    box-sizing: border-box;
}

/* Файл scrollable.css */

/* scrollable.css
 * Поведение для пропа <TabWidget scrollable={true}/>.
 *
 * Идея: когда вкладка помечена как scrollable, её активный
 * .tab-content-item растягивается на всю доступную высоту wrapper'а
 * (flex:1; min-height:0; height:100%). Это позволяет содержимому
 * вкладки опираться на height:100% и держать СВОЙ внутренний скролл,
 * не выталкивая его наружу на body.
 *
 * Сам overflow здесь НЕ задаём, чтобы не плодить двойной скролл с
 * контентом, который уже имеет overflow-y:auto. Если содержимое
 * скроллом не управляет, добавьте overflow-y:auto на корень контента
 * вкладки — это правильное место.
 *
 * До этой правки классы .scrollable / .scrollable-content в DOM
 * проставлялись, но никаких CSS-правил за ними не стояло — проп был
 * фактически no-op.
 */

/* Контейнер списка вкладок. Для tabs_position='слева' wrapper уже
   flex:1; min-height:0 (left-panel.css), здесь страхуем верхнюю
   компоновку — у tabs_position='сверху' своих стилей у wrapper'а нет. */
.tab-content-wrapper.scrollable {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

/* Все элементы списка — занимают всю высоту wrapper'а.
   Неактивные скрыты через .tab-content-item { display:none } из base.css,
   поэтому реально растягивается только активная. */
.tab-content-wrapper.scrollable > .tab-content-item.scrollable-content {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
}

/* Активная scrollable-вкладка — собственно flex-колонка с заданной
   высотой; overflow оставляем контенту. */
.tab-content-wrapper.scrollable > .tab-content-item.active.scrollable-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    scrollbar-gutter: stable;
}

/* Широкие таблицы прокручиваются внутри содержимого TabWidget,
   не растягивая всю страницу. */
.tab-content-wrapper.scrollable,
.tab-content-wrapper.scrollable > .tab-content-item.scrollable-content {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.tab-content-wrapper.scrollable > .tab-content-item.active.scrollable-content > * {
    min-width: 100%;
}

/* Файл tab-drag.css */

.tab-nav--draggable .tab-item-wrapper:not(.tab-item-wrapper--locked) {
    cursor: grab;
}

.tab-nav--draggable .tab-item-wrapper:not(.tab-item-wrapper--locked):active {
    cursor: grabbing;
}

.tab-item-wrapper[draggable='true'] {
    user-select: none;
}

.tab-item-wrapper--drop-before {
    position: relative;
}

.tab-nav-top .tab-item-wrapper--drop-before::before {
    content: '';
    position: absolute;
    top: -2px;
    bottom: -2px;
    left: -5px;
    width: 3px;
    border-radius: 3px;
    background: var(--accent);
}

.tab-nav-left .tab-item-wrapper--drop-before::before {
    content: '';
    position: absolute;
    top: -4px;
    right: 0;
    left: 0;
    height: 3px;
    border-radius: 3px;
    background: var(--accent);
}

.tab-item-wrapper--locked {
    cursor: default;
}

.tab-nav-empty-drop {
    margin: var(--font_size__0);
    padding: var(--font_size_0);
    border: 1px dashed var(--border);
    border-radius: var(--font_size__0);
    color: var(--text-2);
    font-size: var(--font_size_0);
    text-align: center;
}

.tab-widget-empty-content {
    display: flex;
    flex: 1 1 auto;
    min-height: 120px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: var(--font_size_1);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

/* Файл TabWidget.css */

/* TabWidget.css */

/* Импорт всех стилей */

/* Файл base.css */

/* Контейнер таблицы */
.pivot-table-container {
    overflow: auto;
    scrollbar-gutter: stable;
    height: 100%;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--card);
    box-shadow: var(--shadow);
}

.pivot-table {
    width: 100%;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--font_size_1);
    color: var(--text-2);
}

.pivot-table-loading,
.pivot-table-error,
.pivot-table-empty {
    padding: 14px;
    text-align: center;
    color: var(--text-3);
}

/* Радиобаттон */
.pivot-radio-native {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.pivot-radio-visual {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-bottom: 12px;
    border: 1px solid #888;
    border-radius: 50%;
    background: white;
    box-sizing: border-box;
    vertical-align: middle;
    position: relative;
    pointer-events: none;
}

/* Подсветка активных родительских и листовых узлов */
.radio-button-container--parent:has(.pivot-radio-native:checked) .pivot-radio-visual,
.radio-button-container--leaf:has(.pivot-radio-native:checked) .pivot-radio-visual {
    border-color: var(--accent);
}

/* Внутренняя точка */
.pivot-radio-visual--checked::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #1976D2;
    transform: translate(-50%, -50%);
}

/* 👨‍🦱 Курсор */
.radio-button-container--leaf {
    cursor: pointer;
}


.node-value {
    margin-bottom: 12px;
    line-height: 1.4;
}
/* Файл header.css */

/* PivotTable.header.css */

/* Заголовки и ячейки */
.pivot-table th,
.pivot-table td {
    padding: 4px 6px;
    text-align: left;
    vertical-align: top;
    overflow: hidden;
    text-overflow: ellipsis;
    border-bottom: 1px solid #eef2f7;
}

.pivot-table th {
    position: sticky;
    top: 0;
    z-index: 10;
    background: linear-gradient(180deg, #f8fbff 0%, #f2f6fb 100%);
    color: #172033;
    font-weight: 600;
    font-size: 12px;
    line-height: 1.3;
}

.aggregation-header th {
    box-shadow: inset 0 -1px 0 #e6edf6;
}

.empty-header {
    background: linear-gradient(180deg, #f8fbff 0%, #f2f6fb 100%);
}

.hierarchy-header,
.value-header {
    min-height: 44px;
}

.header-label {
    display: block;
    line-height: 1.25;
    font-size: 12px;
}

.agg-label {
    margin-top: 2px;
    font-size: 11px;
    line-height: 1.2;
    color: #7b8794;
    font-weight: 500;
}

/* Управляемый перенос заголовков */
.value-header--wrap .header-label,
.hierarchy-header--wrap .header-label {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
}

.value-header--nowrap .header-label,
.hierarchy-header--nowrap .header-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Файл hierarchy.css */

/* hierarchy.css */

/* Иерархия */
.hierarchy-row {
    cursor: pointer;
    transition: background-color 0.16s ease;
}

.hierarchy-row:hover {
    background-color: var(--bg-2); /* #edf1f5 */
}

.hierarchy-cell {
    --pivot-indent-step: 12px;
    --pivot-indent-base: 10px;
    position: relative;
    padding-left: calc(
        var(--pivot-level, 0)
        * var(--pivot-indent-step)
        + var(--pivot-indent-base)
    ) !important;
}

.hierarchy-cell--child {
    border-left: 2px solid var(--border); /* #d7e7f2 */
}

.hierarchy-cell--root {
    border-left: none;
}

.hierarchy-content {
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
}

.hierarchy-indent {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}

.toggle-button {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--text-3);
    cursor: pointer;
    transition: background-color 0.16s ease, color 0.16s ease;
}

.toggle-button:hover {
    background: var(--bg-2);
    color: var(--accent-blue);
}

.node-value {
    min-width: 0;
    font-size: var(--font_size_0);
    line-height: 1.3;
    color: var(--text-2);
}

.node-stats {
    color: var(--text-3);
    white-space: nowrap;
}

.checkbox-cell {
    text-align: center;
}

.empty-value {
    color: var(--text-3);
}

/* Фон уровней */
.level-0 {
    background-color: var(--bg-2); /* #edf1f5 вместо #f8fbff */
}

.level-2 {
    background-color: var(--bg-1); /* #ffff вместо #fbfcfe */
}
/* Файл kind_badge.css */

/* kind_badge.css */

/* Бейдж «Продавец»/«Покупатель» слева от названия
   контрагента в корневой строке сводной таблицы. */
.hierarchy-kind-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px;
    border-radius: 6px;
    font-size: var(--font_size_0);
    white-space: nowrap;
    flex: 0 0 auto;
}

.hierarchy-kind-badge--seller {
    background-color: #ede9fe;
    color: var(--blue-navy);
}

.hierarchy-kind-badge--buyer {
    background-color: #d1fae5;
    color: #047857;
}
/* Файл total_row.css */

/* total_row.css */

.pivot-total-row {
    background: var(--bg-2);
}

.pivot-total-cell {
    position: sticky;
    bottom: 0;
    z-index: 9;
    padding: 4px 6px;
    background: var(--bg-2);
    border-top: 2px solid var(--border);
    font-weight: 600;
    color: var(--text-1);
}

.pivot-total-label {
    text-align: left;
}

.pivot-total-value {
    text-align: right;
}

/* Файл PivotTable.css */

/* PivotTable.css */
/* Файл Grid.css */

.grid-container {
    display: grid;
    width: 100%;
    height: 100%;
    gap: 5px;
    grid-auto-rows: 1fr;
}

.grid-container.scrollable {
    overflow: auto;
    grid-auto-rows: min-content;
}

.grid-item {
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

@media (orientation: portrait) {
    .grid-container--portrait-flow {
        display: flex;
        width: 100%;
        height: 100%;
        min-height: 0;
        min-width: 0;
        flex-direction: column;
        gap: 7px;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .grid-container--portrait-flow > .grid-item {
        min-width: 0;
        flex: 0 0 auto;
        grid-row: auto !important;
        grid-column: auto !important;
        overflow: visible;
    }

    .grid-container--portrait-flow > .grid-item:has(.table-widget) {
        height: auto;
        min-height: 280px;
        max-height: none;
        flex: 1 1 280px;
        overflow: hidden;
    }

    .grid-container--portrait-flow
    > .grid-item:has(.table-widget)
    .table-widget {
        height: 100%;
        min-height: 0;
        max-height: 100%;
    }

    .grid-container--portrait-flow
    > .grid-item:has(.table-widget)
    .table-wrapper,
    .grid-container--portrait-flow
    > .grid-item:has(.table-widget)
    .portrait-card-table {
        height: 100%;
        min-height: 0;
        max-height: 100%;
        overflow-y: auto;
    }
}

/* Файл PaymentApprovalDrawer.css */

.drawer-title .pad-back-btn {
    margin-right: var(--font_size__0);
    border: 1px solid var(--border);
    background: var(--accent-blue);
    color: var(--bg-1);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.pad-approval-content {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: var(--font_size__0);
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.pad-approval-content .block_1 {
    box-sizing: border-box;
    margin: 0;
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: var(--shadow);
}

.pad-section {
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
}

.pad-section-title {
    margin-bottom: var(--font_size__0);
    color: var(--text-2);
    font-size: var(--font_size_0);
    font-weight: 700;
    letter-spacing: normal;
    text-transform: none;
}

.pad-field label {
    display: block;
    margin-bottom: 4px;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.pad-val {
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.pad-val--accent {
    color: var(--accent-blue);
    font-size: var(--font_size_1);
}

.pad-status-badge {
    display: inline-block;
    margin-top: var(--font_size__0);
    padding: 4px var(--font_size_0);
    background: var(--accent-orange-bg);
    color: var(--accent-orange-text);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.pad-actions {
    position: sticky;
    bottom: calc(0px - var(--font_size_0));
    display: flex;
    gap: var(--font_size__0);
    margin: var(--font_size__0) calc(0px - var(--font_size_0)) calc(0px - var(--font_size_0));
    padding: var(--font_size__0);
    border-top: 1px solid var(--border);
    background: var(--bg-1);
    z-index: 10;
}

.pad-btn-approve,
.pad-btn-reject,
.pad-btn-chat {
    min-height: 38px;
    margin: 0;
    padding: 4px var(--font_size_0);
    border-radius: var(--font_size__0);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.pad-btn-approve {
    flex: 1;
    border: 1px solid var(--accent);
    background: var(--accent);
    color: var(--bg-1);
    font-weight: 700;
}

.pad-btn-approve:hover:not(:disabled) {
    background: var(--accent-blue);
    transform: none;
}

.pad-btn-approve:disabled,
.pad-btn-chat:disabled,
.pad-btn-reject:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.pad-btn-reject {
    flex: 1;
    border: 1px solid var(--accent-red);
    background: var(--bg-1);
    color: var(--accent-red);
}

.pad-btn-reject:hover {
    border-color: var(--accent-red-bright);
    background: var(--bg-2);
    color: var(--accent-red);
    transform: none;
}

.pad-btn-chat {
    border: 1px solid var(--accent-blue);
    background: var(--accent-blue);
    color: var(--bg-1);
}

.pad-btn-chat:hover {
    background: var(--accent);
    transform: none;
}

.pad-empty {
    color: var(--text-2);
    font-size: var(--font_size_0);
    text-align: center;
}

/* Файл use_confirm_payments.css */

.confirm_payments_content {
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.confirm_payments_content .content-card__title {
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.confirm_payments_content .content-card__meta,
.confirm_payments_content .content-card__text,
.confirm_payments_content .no-content {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.confirm_payments_content .badge {
    background: var(--bg-2);
    color: var(--accent);
    font-size: var(--font_size_0);
}

.payment-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 190px);
    gap: var(--font_size__0);
    align-items: start;
}

.payment-card__file {
    display: flex;
    justify-content: flex-end;
}

.payment-card__footer {
    display: flex;
    grid-column: 1 / -1;
    justify-content: flex-end;
    gap: var(--font_size__0);
}

.payment-card__chat-btn,
.payment-card__open-btn {
    margin: 0;
    padding: 4px var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.payment-card__chat-btn {
    background: var(--bg-1);
    color: var(--text-1);
}

.payment-card__chat-btn:hover {
    background: var(--bg-2);
    color: var(--text-1);
    transform: none;
}

.payment-card__open-btn {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.payment-card__open-btn:hover {
    background: var(--accent-blue);
    color: var(--bg-1);
    transform: none;
}

@media (max-width: 760px) {
    .payment-card {
        grid-template-columns: 1fr;
    }

    .payment-card__file {
        justify-content: flex-start;
    }

    .payment-card__footer {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

/* Файл driver_messenger_base.css */

/* Файл driver_messenger.css */

/* Файл driver_messenger.css */

.driver_messages_button {
    position: fixed;
    right: var(--font_size_1);
    bottom: var(--font_size_1);
    width: 54px;
    height: 54px;
    border: 0;
    border-radius: 50%;
    background: var(--accent);
    color: var(--bg-1);
    cursor: pointer;
    z-index: 100;
}

.driver_messages_button:hover {
    background: var(--accent-blue);
}

.driver_messages_button_icon {
    font-size: var(--font_size_2);
}

.driver_messages_button_badge,
.driver_messages_badge {
    display: inline-flex;
    min-width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 0 4px;
    border-radius: var(--font_size_0);
    background: var(--accent-orange-bg);
    color: var(--accent-orange-text);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.driver_messages_button_badge {
    position: absolute;
    top: -4px;
    right: -4px;
}

.driver_messages_panel {
    max-width: 100vw;
    height: 100dvh;
}

.driver_messages_panel .drawer-header {
    font-size: var(--font_size_1);
}

.driver_messages_panel .drawer-body {
    display: flex;
    min-height: 0;
    flex-direction: column;
    padding: var(--font_size_0);
    overflow: hidden;
}

.driver_messages_wrap {
    display: flex;
    height: 100%;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow: hidden;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.driver_messages_tabs {
    display: flex;
    flex-shrink: 0;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 4px;
}

.driver_messages_tab {
    flex-shrink: 0;
    margin: 0;
    padding: 4px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
}

.driver_messages_tab:hover {
    background: var(--bg-2);
    color: var(--text-1);
    transform: none;
    box-shadow: none;
}

.driver_messages_tab--active,
.driver_messages_tab--active:hover {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.driver_messages_toolbar,
.driver_messages_room_header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size__0);
}

.driver_messages_room_title {
    min-width: 0;
    margin: 0;
    padding: 4px var(--font_size__0);
    overflow: hidden;
    border: 0;
    background: transparent;
    color: var(--text-1);
    font-size: var(--font_size_1);
    font-weight: 700;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.driver_messages_room_title:hover {
    background: var(--bg-1);
    color: var(--text-1);
    transform: none;
    box-shadow: none;
}

.driver_messages_room_actions {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: var(--font_size__0);
}

.driver_messages_toolbar--actions {
    justify-content: flex-end;
}

.driver_messages_add {
    width: 34px;
    height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size_1);
    line-height: 1;
    cursor: pointer;
}

.driver_messages_add:hover {
    background: var(--accent-blue);
    transform: none;
}

.driver_messages_list {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
}

.driver_messages_wrap .block_1,
.pad-approval-content .block_1 {
    box-sizing: border-box;
    margin: 0;
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: var(--shadow);
    font-size: var(--font_size_0);
}

.driver_messages_empty {
    color: var(--text-2);
    text-align: center;
}

.driver_room_card {
    display: block;
    width: 100%;
    border: 1px solid var(--border);
    background: var(--bg-1);
    color: var(--text-1);
    text-align: left;
    cursor: pointer;
}

.driver_room_card:hover {
    border-color: var(--accent);
    background: var(--bg-2);
    color: var(--text-1);
    transform: none;
    box-shadow: var(--shadow);
}

.driver_room_card__header,
.driver_room_card__footer,
.driver_message_meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size__0);
}

.driver_room_card__title,
.driver_message_author {
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.driver_room_card__message {
    margin: 4px 0;
    overflow: hidden;
    color: var(--text-2);
    font-size: var(--font_size_0);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver_room_card__footer,
.driver_message_date,
.driver_message_read,
.driver_messages_room_members {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.driver_room_status {
    color: var(--accent);
}


/* Файл driver_messenger_layout.css */

.driver_room_status--closed {
    color: var(--text-2);
}

.driver_messages_back {
    margin: 0;
    padding: 4px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.driver_messages_back:hover {
    background: var(--bg-2);
    color: var(--text-1);
    transform: none;
}

.driver_message_row {
    display: flex;
    width: 100%;
    justify-content: flex-start;
}

.driver_message_row--mine {
    justify-content: flex-end;
}

.driver_message_group {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 4px;
}

.driver_message_day {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin: 4px 0;
}

.driver_message_day span {
    padding: 4px var(--font_size_0);
    border-radius: var(--font_size_1);
    background: var(--border);
    color: var(--text-2);
    font-size: var(--font_size_0);
    line-height: 1.2;
}

.driver_message_author {
    margin-bottom: 4px;
}

.driver_messages_wrap .driver_message_card--mine {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.driver_message_card--mine .driver_message_text,
.driver_message_card--mine .driver_message_time {
    color: var(--bg-1);
}

.driver_message_text {
    margin: 0;
    color: var(--text-1);
    font-size: var(--font_size_0);
    line-height: 1.35;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.driver_message_time {
    margin-top: 2px;
    color: var(--text-2);
    font-size: var(--font_size_0);
    line-height: 1;
    text-align: right;
}

.driver_messages_form {
    position: sticky;
    bottom: 0;
    display: grid;
    flex-shrink: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--font_size__0);
    align-items: stretch;
    margin-top: auto;
    padding-top: var(--font_size__0);
    background: var(--bg-2);
    z-index: 2;
}

.driver_messages_input {
    width: 100%;
    height: 38px;
    min-height: 38px;
    max-height: 84px;
    box-sizing: border-box;
    margin: 0;
    padding: 4px var(--font_size__0);
    resize: vertical;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-family: inherit;
    font-size: var(--font_size_0);
    line-height: 1.2;
}

.driver_messages_input:focus {
    border-color: var(--accent);
    outline: none;
}

.driver_messages_send {
    min-height: 38px;
    margin: 0;
    padding: 4px var(--font_size_0);
    border: 0;
    border-radius: var(--font_size__0);
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size_0);
    line-height: 1.2;
    cursor: pointer;
}

.driver_messages_send:hover {
    background: var(--accent-blue);
    transform: none;
}

.driver_messages_send:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.driver_user_picker {
    display: flex;
    height: 100%;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: var(--font_size__0);
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.driver_user_picker__title {
    display: flex;
    flex-direction: column;
    gap: 4px;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.driver_user_picker__title input {
    box-sizing: border-box;
    min-height: 38px;
    margin: 0;
    padding: 4px var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-family: inherit;
    font-size: var(--font_size_0);
}

.driver_user_picker__search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--font_size__0);
    box-sizing: border-box;
    min-height: 38px;
    padding: 0 var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-2);
}

.driver_user_picker__search input {
    width: 100%;
    height: 36px;
    box-sizing: border-box;
    margin: 0;
    padding: 4px 0;
    border: 0;
    background: transparent;
    color: var(--text-1);
    font-family: inherit;
    font-size: var(--font_size_0);
    outline: none;
}

.driver_user_picker__list {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow-y: auto;
}

.driver_user_picker__actions {
    display: flex;
    flex-shrink: 0;
    justify-content: flex-end;
    margin-top: auto;
    padding-top: var(--font_size__0);
    background: var(--bg-2);
}

.driver_messages_members_list {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow-y: auto;
}

.driver_messages_member {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size_0);
}

.driver_messages_member button {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: var(--bg-1);
    color: var(--accent-orange-text);
    font-size: var(--font_size_1);
    line-height: 1;
    cursor: pointer;
}

.driver_messages_member button:hover {
    background: var(--bg-2);
    transform: none;
}

/* Файл driver_messenger_rooms.css */

.driver_user_picker__item {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
    cursor: pointer;
}

.driver_user_picker__item span {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.driver_user_picker__item small {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.confirm_payments_content {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow-y: auto;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.driver_messages_wrap .confirm_payments_content .content-toolbar {
    gap: 4px;
    padding-right: 0;
}

.driver_messages_wrap .confirm_payments_content .search {
    height: 38px;
    gap: var(--font_size__0);
    border-color: var(--border);
    background: var(--bg-1);
}

.driver_messages_wrap .confirm_payments_content .search input {
    box-sizing: border-box;
    height: 36px;
    margin: 0;
    padding: 4px var(--font_size_0);
    color: var(--text-1);
    font-size: var(--font_size_0);
}

@media (max-width: 760px) {
    .driver_messages_button {
        right: var(--font_size_0);
        bottom: var(--font_size_0);
    }

    .driver_messages_form {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }
}

/* Управление участниками, сообщениями и вложениями */

.driver_messages_members_view {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow: hidden;
}

.driver_room_title_editor,
.driver_message_edit_form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: var(--font_size__0);
    align-items: stretch;
}

.driver_room_title_editor input,
.driver_message_edit_form textarea {
    min-width: 0;
    min-height: 36px;
    margin: 0;
    padding: 4px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.driver_room_title_editor button,
.driver_message_edit_form button,
.driver_messages_member_add,
.driver_message_action_bar button,
.driver_message_file_button {
    min-height: 36px;
    margin: 0;
    padding: 4px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.driver_messages_member_add {
    align-self: flex-start;
}

.driver_message_action_bar {
    display: flex;
    gap: 4px;
    margin-left: auto;
}

.driver_message_card {
    padding: 5px var(--font_size__0) 4px;
    text-align: left;
    cursor: pointer;
}

.driver_message_card:hover {
    transform: none;
}

.driver_message_attachment {
    display: block;
    max-width: 100%;
    margin-top: 4px;
    padding: 4px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-2);
    color: var(--text-1);
    font-size: var(--font_size_0);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.driver_message_card--mine .driver_message_attachment {
    border-color: color-mix(in srgb, var(--bg-1) 45%, transparent);
    background: color-mix(in srgb, var(--bg-1) 16%, transparent);
    color: var(--bg-1);
}

.driver_message_file_input {
    display: none;
}

.driver_messages_form {
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.driver_forward_rooms {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow-y: auto;
}

.driver_forward_room {
    width: 100%;
    text-align: left;
    cursor: pointer;
}

@media (max-width: 640px) {
    .driver_room_title_editor,
    .driver_message_edit_form {
        grid-template-columns: minmax(0, 1fr);
    }
}

.driver_message_forwarded {
    margin-bottom: 2px;
    color: var(--text-2);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.driver_message_card--mine .driver_message_forwarded {
    color: var(--bg-1);
    opacity: 0.8;
}

/* Финальная компоновка мессенджера: действия должны быть заметны,
   а сообщения — компактны по вертикали. */

.driver_message_card {
    max-width: 50%;
    margin: 0;
    padding: 4px var(--font_size__0) 3px;
    border-radius: var(--font_size__0);
}

.driver_message_card--selected {
    outline: 2px solid var(--accent-orange-bg);
    outline-offset: 1px;
}

.driver_message_author {
    margin: 0 0 2px;
    line-height: 1.15;
}

.driver_message_text {
    line-height: 1.25;
}

.driver_message_time {
    margin-top: 1px;
}

.driver_message_row--system {
    justify-content: center;
}

.driver_messages_wrap .driver_message_card--system {
    max-width: 88%;
    padding: 3px var(--font_size__0);
    border-color: var(--border);
    background: var(--bg-2);
    color: var(--text-2);
    box-shadow: none;
    text-align: center;
    cursor: default;
}

.driver_message_card--system .driver_message_text,
.driver_message_card--system .driver_message_time {
    color: var(--text-2);
    text-align: center;
}

.driver_message_action_bar {
    min-width: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.driver_message_action_bar button,
.driver_message_file_button {
    display: inline-flex;
    width: 36px;
    min-width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: var(--font_size_1);
    line-height: 1;
}

/* Файл driver_messenger_messages.css */

.driver_room_title_editor {
    flex-shrink: 0;
}

.driver_room_title_editor input {
    width: 100%;
}

.driver_messages_member_add {
    width: 100%;
    flex-shrink: 0;
    text-align: center;
}

.driver_messages_member {
    padding: 6px var(--font_size__0);
}

.driver_messages_member span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.driver_message_edit_form {
    flex-shrink: 0;
}

.driver_message_edit_form textarea {
    max-height: 110px;
    resize: vertical;
}

@media (orientation: portrait) {
    .driver_message_card {
        max-width: 70%;
    }
}

.driver_message_card--deleted {
    cursor: default;
    opacity: 0.72;
}

/* Вкладки панели перенесены в синюю шапку DriverPanel. */

.driver_messages_panel .drawer-header {
    min-height: 42px;
    gap: 4px;
    padding: 0 4px;
}

.driver_messages_panel .drawer-title {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: stretch;
    align-self: stretch;
    overflow: hidden;
}

.driver_messages_tabs--header {
    width: 100%;
    align-items: stretch;
    gap: 2px;
    padding: 0;
}

.driver_messages_tabs--header .driver_messages_tab {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    padding: 4px var(--font_size_0);
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--bg-1);
    font-weight: 600;
}

.driver_messages_tabs--header .driver_messages_tab:hover {
    background: var(--accent-blue);
    color: var(--bg-1);
}

.driver_messages_tabs--header .driver_messages_tab--active,
.driver_messages_tabs--header .driver_messages_tab--active:hover {
    background: var(--bg-1);
    color: var(--accent);
}

.driver_messages_panel .drawer-close {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    padding: 0;
}

.driver_messages_panel .drawer-body {
    padding: 4px var(--font_size__0) var(--font_size__0);
}

.driver_messages_toolbar--chat-list {
    justify-content: stretch;
}

.driver_room_search,
.driver_message_search {
    display: grid;
    min-width: 0;
    flex: 1;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--font_size__0);
    box-sizing: border-box;
    min-height: 36px;
    padding: 0 var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-2);
}

.driver_room_search input,
.driver_message_search input {
    width: 100%;
    min-width: 0;
    height: 34px;
    box-sizing: border-box;
    margin: 0;
    padding: 2px 0;
    border: 0;
    background: transparent;
    color: var(--text-1);
    font-family: inherit;
    font-size: var(--font_size_0);
    outline: none;
}

.driver_message_search {
    flex: 0 0 auto;
}

.driver_message_search button,
.driver_message_search_toggle {
    display: inline-flex;
    width: 34px;
    min-width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_1);
    cursor: pointer;
}

.driver_message_search button {
    width: 28px;
    min-width: 28px;
    height: 28px;
    border: 0;
}

.driver_message_search_toggle:hover,
.driver_message_search_toggle--active {
    border-color: var(--accent);
    background: var(--bg-2);
    color: var(--accent);
    transform: none;
}

.driver_messages_room_header > .driver_messages_room_title {
    flex: 1;
}

.driver_message_time {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}

.driver_message_ticks {
    color: currentColor;
    font-weight: 700;
    letter-spacing: -3px;
    opacity: 0.72;
}

.driver_message_ticks--read {
    opacity: 1;
}

.driver_messages_form {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: end;
}

.driver_messages_input {
    height: 38px;
    min-height: 38px;
    max-height: 128px;
    overflow-y: auto;
    resize: none;
}

.driver_messages_send {
    display: inline-flex;
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.driver_messages_send svg {
    width: var(--font_size_1);
    height: var(--font_size_1);
    fill: currentColor;
}

@media (max-width: 760px), (orientation: portrait) {
    .driver_messages_form {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .driver_messages_tabs--header .driver_messages_tab {
        min-height: 38px;
        padding-right: var(--font_size__0);
        padding-left: var(--font_size__0);
    }
}

/* Прикреплённый файл и редактирование в поле ввода */

.driver_messages_form--editing {
    grid-template-columns: minmax(0, 1fr) auto;
}

.driver_messages_form .driver_messages_input {
    max-height: 60vh;
}

.driver_message_edit_context,
.driver_message_pending_file {
    grid-column: 1 / -1;
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size__0);
    padding: 4px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
}

/* Ссылка на карточку документа из сообщения согласования. */
.driver_message_document_link {
    display: inline-flex;
    align-items: center;
    margin: 6px 0 0;
    padding: 5px 8px;
    border: 1px solid currentColor;
    border-radius: var(--font_size__0);
    background: transparent;
    color: var(--accent);
    font-size: var(--font_size_0);
    font-weight: 700;
    cursor: pointer;
}

.driver_message_document_link:hover {
    background: var(--bg-2);
    color: var(--accent);
    transform: none;
}

/* Файл driver_messenger_composer.css */

.driver_message_edit_context > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.driver_message_edit_context span,
.driver_message_pending_file span {
    min-width: 0;
    overflow: hidden;
    color: var(--text-2);
    font-size: var(--font_size_0);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver_message_edit_context button,
.driver_message_pending_file button {
    flex-shrink: 0;
    min-width: 32px;
    min-height: 32px;
    margin: 0;
    padding: 2px 8px;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-2);
    color: var(--text-1);
    cursor: pointer;
}

/* Современный внешний вид мессенджера */

.driver_messages_panel .drawer {
    width: min(1160px, 96vw);
    border-left: 1px solid rgba(255, 255, 255, 0.15);
    background: linear-gradient(180deg, var(--bg-2) 0%, var(--bg-1) 100%);
}

.driver_messages_panel .drawer-header {
    padding: 0;
    background: var(--accent);
    color: var(--bg-1);
}

.driver_messages_tabs--header {
    display: flex;
    align-items: stretch;
    gap: 0;
    width: 100%;
}

.driver_messages_tabs--header .driver_messages_tab {
    height: 54px;
    padding: 0 26px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.88);
    font-weight: 700;
}

.driver_messages_tabs--header .driver_messages_tab:hover {
    background: rgba(255, 255, 255, 0.08);
    color: var(--bg-1);
}

.driver_messages_tabs--header .driver_messages_tab--active,
.driver_messages_tabs--header .driver_messages_tab--active:hover {
    background: rgba(255, 255, 255, 0.14);
    color: var(--bg-1);
}

.driver_messages_panel .drawer-close {
    color: var(--bg-1);
}

.driver_messages_wrap {
    gap: 12px;
    padding: 6px 2px 2px;
}

.driver_messages_toolbar--chat-list,
.driver_messages_room_header {
    padding: 0 6px;
}

.driver_room_search,
.driver_message_search {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-height: 46px;
    padding: 0 14px;
    border: 1px solid rgba(21, 87, 170, 0.12);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 10px 24px rgba(38, 77, 135, 0.08);
}

.driver_room_search input,
.driver_message_search input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.driver_messages_add,
.driver_messages_back,
.driver_message_search_toggle,
.driver_messages_member_add {
    min-height: 42px;
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(38, 77, 135, 0.08);
}

.driver_messages_add {
    width: 42px;
    height: 42px;
}

.driver_messages_list {
    gap: 10px;
    padding: 2px 6px 6px;
}

.driver_room_card {
    border: 1px solid rgba(21, 87, 170, 0.10);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 14px 32px rgba(38, 77, 135, 0.08);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.driver_room_card:hover {
    transform: translateY(-1px);
    border-color: rgba(21, 87, 170, 0.22);
    box-shadow: 0 18px 36px rgba(38, 77, 135, 0.12);
}

.driver_room_card__header,
.driver_room_card__footer {
    gap: 10px;
}

.driver_room_card__title {
    color: var(--blue-navy);
}

.driver_messages_wrap .driver_message_card {
    max-width: min(78%, 760px);
    padding: 12px 14px;
    border: 1px solid rgba(21, 87, 170, 0.08);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 10px 24px rgba(38, 77, 135, 0.08);
}

.driver_messages_wrap .driver_message_card--mine {
    border-color: rgba(21, 87, 170, 0.26);
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.98) 0%,
        rgba(232, 240, 253, 0.98) 100%
    );
    color: var(--text-1);
}

.driver_message_day span {
    background: rgba(21, 87, 170, 0.08);
    color: var(--blue-navy);
}

.driver_message_attachment {
    padding: 8px 12px;
    border: 1px solid rgba(21, 87, 170, 0.12);
    border-radius: 12px;
    background: rgba(21, 87, 170, 0.06);
    color: var(--blue-navy);
}

.driver_messages_form {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: end;
    gap: 10px;
    margin: 4px 6px 2px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.driver_messages_form--editing {
    grid-template-columns: 1fr auto;
}

.driver_message_edit_context,
.driver_message_pending_file {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(21, 87, 170, 0.06);
}

.driver_message_edit_context span,
.driver_message_pending_file span {
    color: var(--text-2);
}

.driver_message_file_button,
.driver_messages_send {
    border: 0;
    background: var(--accent);
    color: var(--bg-1);
}

.driver_message_file_button {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    padding: 0;
    border-radius: 12px;
}

.driver_message_file_button svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: var(--bg-1);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.driver_messages_send {
    width: 44px;
    height: 44px;
    border-radius: 14px;
}

.driver_message_file_button:hover,
.driver_messages_send:hover {
    background: var(--accent-blue);
}

.driver_messages_input {
    min-height: 38px;
    max-height: 180px;
    padding: 6px 14px;
    border: 1px solid rgba(21, 87, 170, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow:
        0 5px 14px rgba(38, 77, 135, 0.08),
        inset 0 1px 2px rgba(0, 0, 0, 0.02);
}

.driver_message_action_bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.18);
}

.driver_message_action_bar button {
    min-width: 38px;
    height: 38px;
    border: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.16);
    color: var(--bg-1);
}

/* Файл driver_messenger_files.css */

.driver_messages_members_list {
    display: grid;
    gap: 8px;
}

.driver_messages_member {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 14px;
}

.drawer-panel.driver_messages_panel {
    width: min(980px, 94vw);
    border-left: 1px solid color-mix(in srgb, var(--blue-navy) 8%, var(--border));
    background: var(--bg-2);
}

.drawer-panel.driver_messages_panel .drawer-header {
    padding: 0;
    background: linear-gradient(180deg, var(--bg-1) 0%, color-mix(in srgb, var(--accent) 6%, var(--bg-1)) 100%);
    color: var(--text-1);
}

.drawer-panel.driver_messages_panel .drawer-title {
    display: flex;
    min-width: 0;
    flex: 1;
}

/* Финальные правки читаемости, компактности и настроек мессенджера. */

.driver_messages_wrap {
    font-size: var(--messenger-font-size, var(--font_size_0));
}

.driver_messages_wrap .driver_room_card__title,
.driver_messages_wrap .driver_room_card__message,
.driver_messages_wrap .driver_room_card__footer,
.driver_messages_wrap .driver_message_author,
.driver_messages_wrap .driver_message_forwarded,
.driver_messages_wrap .driver_message_text,
.driver_messages_wrap .driver_message_time,
.driver_messages_wrap .driver_messages_input,
.driver_messages_wrap .driver_room_search input,
.driver_messages_wrap .driver_message_search input,
.driver_messages_wrap .driver_messages_settings,
.driver_messages_wrap .doc-card__file-name {
    font-size: var(--messenger-font-size, var(--font_size_0));
}

.driver_messages_wrap .driver_message_card {
    padding: var(--font_size__0);
}

.driver_messages_wrap .driver_message_card--mine,
.driver_messages_wrap .driver_message_card--mine .driver_message_author,
.driver_messages_wrap .driver_message_card--mine .driver_message_forwarded,
.driver_messages_wrap .driver_message_card--mine .driver_message_text,
.driver_messages_wrap .driver_message_card--mine .driver_message_time,
.driver_messages_wrap .driver_message_card--mine .driver_message_ticks,
.driver_messages_wrap .driver_message_card--mine .doc-card__file-name,
.driver_messages_wrap .driver_message_card--mine .doc-card__file-download {
    color: var(--text-1);
}

.driver_messages_wrap .driver_message_card--mine .driver_message_forwarded {
    opacity: 1;
    color: var(--text-2);
}

.driver_messages_wrap .driver_message_card--mine .doc-card__file-item {
    border-color: var(--border);
    background: var(--bg-1);
}

.driver_messages_wrap .driver_message_card--mine .doc-card__file-item:hover {
    background: var(--bg-2);
}

.driver_message_document_attachment {
    width: 100%;
}

.driver_messages_toolbar_actions {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 8px;
}

.driver_messages_settings_button {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_1);
    cursor: pointer;
}

.driver_messages_settings_button:hover,
.driver_messages_settings_button--active {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
    transform: none;
}

.driver_messages_settings {
    display: flex;
    flex-shrink: 0;
    flex-direction: column;
    gap: 8px;
    margin: 0 6px;
    padding: var(--font_size__0);
}

.driver_messages_settings__header,
.driver_messages_settings__scale {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.driver_messages_settings input[type='range'] {
    width: 100%;
    accent-color: var(--accent);
}

.driver_messages_settings__scale {
    color: var(--text-2);
}

.driver_messages_settings__scale button {
    margin: 0;
    padding: 4px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-size: inherit;
    cursor: pointer;
}

.driver_messages_settings__scale button:hover {
    border-color: var(--accent);
    background: var(--bg-2);
    color: var(--text-1);
    transform: none;
}

/* Компактная верхняя панель и список чатов. */

.drawer-panel.driver_messages_panel .drawer-header {
    min-height: 44px;
}

.driver_messages_tabs--header .driver_messages_tab {
    height: 44px;
    padding: 0 20px;
}

.drawer-panel.driver_messages_panel .drawer-close {
    width: 44px;
    height: 44px;
    padding: 0;
}

.driver_messages_wrap .driver_room_card {
    min-height: 0;
    padding: 10px 12px;
}

.driver_room_card__header {
    align-items: flex-start;
}

.driver_room_card__title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver_room_card__meta {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.driver_room_card__date {
    color: var(--text-2);
    font-size: var(--messenger-font-size, var(--font_size_0));
    font-weight: 400;
    white-space: nowrap;
}

.driver_room_card__message {
    margin: 3px 0 0;
}

@media (max-width: 760px) {
    .driver_messages_tabs--header .driver_messages_tab {
        height: 42px;
        padding: 0 12px;
    }

    .drawer-panel.driver_messages_panel .drawer-header {
        min-height: 42px;
    }

    .drawer-panel.driver_messages_panel .drawer-close {
        width: 42px;
        height: 42px;
    }
}

/* Компактный список участников и полноразмерное поле уведомлений. */

.driver_messages_members_list {
    display: flex;
    min-height: 0;
    flex: 0 1 auto;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 8px;
    overflow-y: auto;
}

.driver_messages_member {
    width: 100%;
    min-height: 52px;
    box-sizing: border-box;
    flex: 0 0 auto;
    padding: 8px 14px;
}

.driver_messages_form--notification {
    grid-template-columns: minmax(0, 1fr) auto;
}

.driver_messages_form--notification .driver_messages_input {
    grid-column: 1;
    width: 100%;
    min-width: 0;
}

.driver_messages_form--notification .driver_messages_send {
    grid-column: 2;
}

/* Файл driver_messenger_drawer.css */

/* Финальные исправления панели действий и выбора участников. */

.driver_message_action_bar {
    background: var(--bg-1);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}

.driver_message_action_bar button {
    border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border));
    background: var(--bg-1);
    color: var(--accent-dark);
    opacity: 1;
}

.driver_message_action_bar button:hover,
.driver_message_action_bar button:focus-visible {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.driver_user_picker__actions {
    display: flex;
    justify-content: flex-end;
    padding: 8px 0 0;
}

.driver_user_picker__submit {
    width: auto;
    min-width: 190px;
    max-width: 100%;
    min-height: 42px;
    height: auto;
    padding: 8px 18px;
    white-space: normal;
    line-height: 1.2;
}

/* Итоговая видимость действий и кнопки выбора участников. */

.driver_messages_room_header .driver_message_action_bar {
    position: relative;
    z-index: 2;
    padding: 6px;
    border: 1px solid var(--border);
    background: var(--bg-1);
    box-shadow: var(--shadow);
}

.driver_messages_room_header .driver_message_action_bar button {
    border: 1px solid var(--accent);
    background: var(--bg-1);
    color: var(--accent-dark);
    opacity: 1;
    box-shadow: none;
}

.driver_messages_room_header .driver_message_action_bar button:hover,
.driver_messages_room_header .driver_message_action_bar button:focus-visible {
    background: var(--accent);
    color: var(--bg-1);
}

.driver_user_picker__actions {
    position: sticky;
    bottom: 0;
    box-sizing: border-box;
    width: 100%;
    padding: 8px 0 0;
    background: var(--bg-2);
}

.driver_user_picker__submit {
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 42px;
    padding: 8px 18px;
    white-space: normal;
}

.approvals-control-tab {
    display: flex;
    min-height: 0;
    height: 100%;
    flex-direction: column;
}

.approvals-control-tab__tabs {
    display: flex;
    gap: 6px;
    padding: 5px;
    border-bottom: 1px solid var(--border);
}

.approvals-control-tab__tabs button {
    min-height: 32px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    cursor: pointer;
}

.approvals-control-tab__tabs button.active {
    background: var(--accent);
    color: var(--bg-1);
}

.late-readings-tab {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
}

.late-readings-tab__header {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 8px;
    font-weight: 700;
}

.late-readings-tab__table-wrap {
    min-height: 0;
    flex: 1;
    overflow: auto;
}

.late-readings-tab__table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--messenger-font-size);
}

.late-readings-tab__table th,
.late-readings-tab__table td {
    padding: 6px;
    border-bottom: 1px solid var(--border);
    text-align: left;
}

.late-readings-tab__row--new {
    background: rgba(255, 193, 7, 0.16);
}

.approvals-control-tab__tabs button {
    align-items: center;
    display: inline-flex;
    gap: 6px;
}

.approvals-count-badge,
.driver_messages_tab__approval-badge {
    align-items: center;
    background: var(--warning, #ff7a00);
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    justify-content: center;
    min-height: 20px;
    min-width: 20px;
    padding: 0 5px;
}

.profile-photo-approvals {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.profile-photo-approvals__card {
    border: 1px solid var(--border);
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr);
    padding: 14px;
}

.profile-photo-approvals__card--new {
    border-color: var(--warning, #ff7a00);
}

.profile-photo-approvals__info h3 {
    margin: 0 0 10px;
}

.profile-photo-approvals__info dl {
    display: grid;
    gap: 6px;
    margin: 0;
}

.profile-photo-approvals__info dl > div {
    display: grid;
    gap: 4px;
    grid-template-columns: 140px 1fr;
}

.profile-photo-approvals__info dt {
    color: var(--text-2);
}

.profile-photo-approvals__info dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.profile-photo-approvals__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    grid-column: 1 / -1;
}

.profile-photo-approvals__actions button {
    border: 1px solid var(--border);
    border-radius: 8px;
    cursor: pointer;
    padding: 8px 12px;
}

.profile-photo-approvals__approve {
    background: var(--success, #2b9b67);
    color: #fff;
}

.profile-photo-approvals__reject {
    background: var(--danger, #c94040);
    color: #fff;
}

.profile-photo-approvals__empty {
    padding: 24px;
    text-align: center;
}

@media (max-width: 760px) {
    .profile-photo-approvals__card {
        grid-template-columns: 1fr;
    }

    .profile-photo-approvals__info dl > div {
        grid-template-columns: 1fr;
    }
}

.approvals-signature-reminder {
    margin: 12px;
    padding: 16px;
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--bg-1);
    color: var(--text-1);
}

.approvals-signature-reminder h3 {
    margin: 0 0 10px;
    font-size: var(--font_size_1);
}

.approvals-signature-reminder p {
    margin: 6px 0;
    font-size: var(--font_size_0);
    line-height: 1.45;
}

/* Файл voice_messages.css */

.driver_voice_recorder {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
}

.driver_voice_recorder__button {
    display: inline-flex;
    width: 46px;
    height: 46px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--accent);
    color: var(--bg-1);
    cursor: pointer;
    touch-action: none;
    user-select: none;
}

.driver_voice_recorder__button:hover,
.driver_voice_recorder__button:focus-visible {
    background: var(--accent-blue);
}

.driver_voice_recorder__button:disabled {
    cursor: default;
    opacity: .55;
}

.driver_voice_recorder__button svg,
.driver_voice_message__play svg {
    width: 23px;
    height: 23px;
    fill: currentColor;
}

.driver_voice_recorder--recording {
    position: absolute;
    right: 6px;
    bottom: 6px;
    left: 54px;
    z-index: 5;
    min-height: 48px;
    justify-content: space-between;
    padding-left: 12px;
    border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--border));
    border-radius: 16px;
    background: var(--bg-1);
    box-shadow: 0 10px 28px color-mix(in srgb, var(--blue-navy) 12%, transparent);
}

.driver_voice_recorder__status {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
    color: var(--text-1);
}

.driver_voice_recorder__pulse {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #d83b3b;
    animation: driver_voice_pulse 1s ease-in-out infinite;
}

.driver_voice_recorder__hint {
    overflow: hidden;
    color: var(--text-3);
    font-size: .82em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver_message_voice_attachment {
    margin-top: 5px;
}

.driver_voice_message {
    display: grid;
    grid-template-columns: 42px minmax(190px, 1fr) auto;
    align-items: center;
    gap: 9px;
    width: min(390px, 68vw);
    min-width: 280px;
    color: var(--text-1);
}

.driver_voice_message audio {
    display: none;
}

.driver_voice_message__play {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--accent);
    color: var(--bg-1);
    cursor: pointer;
}

.driver_voice_message__play:hover,
.driver_voice_message__play:focus-visible {
    background: var(--accent-blue);
}

.driver_voice_message__play:disabled {
    cursor: wait;
    opacity: .68;
}

.driver_voice_message__loader {
    width: 18px;
    height: 18px;
    border: 2px solid color-mix(in srgb, var(--bg-1) 42%, transparent);
    border-top-color: var(--bg-1);
    border-radius: 50%;
    animation: driver_voice_spin .8s linear infinite;
}

.driver_voice_message__content {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.driver_voice_message__waveform {
    display: flex;
    width: 100%;
    height: 28px;
    align-items: center;
    gap: 2px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.driver_voice_message__bar {
    width: 3px;
    height: var(--voice-bar-height);
    min-height: 4px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-3) 42%, transparent);
    transition: background-color .12s ease;
}

.driver_voice_message__bar--played {
    background: var(--accent);
}

.driver_voice_message__meta {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--text-3);
    font-size: .76em;
}

.driver_voice_message__meta span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver_voice_message__speed {
    min-width: 38px;
    height: 28px;
    padding: 0 7px;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 11%, var(--bg-1));
    color: var(--accent-blue);
    font-size: .74em;
    font-weight: 700;
    cursor: pointer;
}

.driver_voice_message__speed:hover,
.driver_voice_message__speed:focus-visible {
    background: color-mix(in srgb, var(--accent) 19%, var(--bg-1));
}

.driver_message_card--mine .driver_voice_message {
    color: var(--text-1);
}

.driver_message_card--mine .driver_voice_message__play {
    background: var(--bg-1);
    color: var(--accent-blue);
}

.driver_message_card--mine .driver_voice_message__bar {
    background: color-mix(in srgb, var(--blue-navy) 18%, transparent);
}

.driver_message_card--mine .driver_voice_message__bar--played {
    background: var(--accent-blue);
}

.driver_message_card--mine .driver_voice_message__meta {
    color: var(--text-2);
}

.driver_voice_message--error {
    display: block;
    width: auto;
    min-width: 0;
    color: var(--danger, #b42318);
}

@keyframes driver_voice_pulse {
    0%, 100% {
        opacity: .45;
        transform: scale(.85);
    }

    50% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes driver_voice_spin {
    to {
        transform: rotate(360deg);
    }
}

@media (orientation: portrait), (max-width: 760px) {
    .driver_voice_recorder--recording {
        left: 50px;
    }

    .driver_voice_recorder__hint {
        max-width: 145px;
    }

    .driver_voice_message {
        grid-template-columns: 38px minmax(150px, 1fr) auto;
        width: min(330px, 76vw);
        min-width: 245px;
    }

    .driver_voice_message__play {
        width: 38px;
        height: 38px;
    }

    .driver_voice_message__waveform {
        gap: 1px;
    }
}

/* Файл driver_messenger_permissions.css */

.driver_messages_member {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto;
    gap: var(--font_size__0);
    align-items: start;
}

.driver_messages_member_info {
    min-width: 0;
}

.driver_messages_member_name {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
}

.driver_messages_member_owner {
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--bg-2);
    color: var(--text-2);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.driver_participant_permissions {
    display: grid;
    grid-template-columns: repeat(2, minmax(190px, 1fr));
    gap: 5px 12px;
    margin-top: 8px;
}

.driver_participant_permission {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.driver_participant_permission input {
    width: 17px;
    height: 17px;
    margin: 0;
}

.driver_messages_member_actions {
    display: flex;
    gap: 6px;
}

.driver_messages_delete_room {
    border-color: var(--error-color, #c62828);
    color: var(--error-color, #c62828);
}

@media (max-width: 760px) {
    .driver_messages_member {
        grid-template-columns: 1fr;
    }

    .driver_participant_permissions {
        grid-template-columns: 1fr;
    }

    .driver_messages_member_actions {
        justify-content: flex-end;
    }
}

.driver_room_title_editor--header {
    min-width: 0;
    flex: 1;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.driver_room_title_editor--header input {
    min-width: 0;
}

.driver_room_title_editor--header button {
    white-space: nowrap;
}

@media (max-width: 640px) {
    .driver_room_title_editor--header {
        grid-template-columns: minmax(0, 1fr) auto;
    }
}

/* Файл header_and_rooms.css */

.driver_messages_panel .drawer {
    background: var(--bg-1);
}

.driver_messages_panel .drawer-header {
    min-height: 54px;
    border-bottom: 1px solid color-mix(in srgb, var(--blue-navy) 6%, var(--border));
    box-shadow: 0 8px 28px color-mix(in srgb, var(--blue-navy) 6%, transparent);
}

.driver_messages_tabs--header {
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.driver_messages_tabs--header::-webkit-scrollbar {
    display: none;
}

.driver_messages_tabs--header .driver_messages_tab {
    position: relative;
    min-height: 52px;
    padding: 0 calc(var(--font_size_0) * 1.05);
    color: var(--text-2);
    font-weight: 600;
    transition:
        background-color .16s ease,
        color .16s ease;
}

.driver_messages_tabs--header .driver_messages_tab::after {
    position: absolute;
    right: 12px;
    bottom: 0;
    left: 12px;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: transparent;
    content: '';
}

.driver_messages_tabs--header .driver_messages_tab--active,
.driver_messages_tabs--header .driver_messages_tab--active:hover {
    background: color-mix(in srgb, var(--accent) 8%, var(--bg-1));
    color: var(--accent-blue);
}

.driver_messages_tabs--header .driver_messages_tab--active::after {
    background: var(--accent);
}

.driver_messages_panel .drawer-close {
    width: 38px;
    height: 38px;
    margin-right: 6px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent) 6%, var(--bg-1));
}

.driver_messages_panel .drawer-body {
    padding: 10px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 3%, var(--bg-2)) 0%, var(--bg-2) 100%);
}

.driver_messages_wrap {
    gap: 7px;
    padding: 0;
}

.driver_messages_toolbar,
.driver_messages_room_header {
    min-height: 50px;
    padding: 8px 10px;
    border: 1px solid color-mix(in srgb, var(--blue-navy) 6%, var(--border));
    border-radius: 16px;
    background: color-mix(in srgb, var(--bg-1) 94%, var(--accent) 6%);
    box-shadow: 0 4px 18px color-mix(in srgb, var(--blue-navy) 4%, transparent);
}

.driver_messages_back,
.driver_message_search_toggle,
.driver_messages_add,
.driver_messages_member_add {
    border: 1px solid var(--border);
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: none;
    transition:
        border-color .16s ease,
        background-color .16s ease,
        color .16s ease;
}

.driver_messages_back {
    min-height: 38px;
    padding: 5px 12px;
    border-radius: 12px;
}

.driver_messages_back:hover,
.driver_message_search_toggle:hover,
.driver_messages_add:hover,
.driver_messages_member_add:hover {
    border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
    background: color-mix(in srgb, var(--accent) 7%, var(--bg-1));
    color: var(--accent-blue);
}

.driver_messages_room_title {
    padding: 6px 9px;
    border-radius: 10px;
    color: var(--text-1);
    font-size: var(--font_size_1);
    font-weight: 650;
}

.driver_room_search,
.driver_message_search {
    min-height: 40px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
    box-shadow: none;
}

.driver_room_search:focus-within,
.driver_message_search:focus-within {
    border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 10%, transparent);
}

.driver_messages_list {
    gap: 8px;
    padding: 8px;
    scrollbar-width: thin;
    scrollbar-color:
        color-mix(in srgb, var(--text-3) 40%, transparent)
        transparent;
}

.driver_messages_list::-webkit-scrollbar {
    width: 6px;
}

.driver_messages_list::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-3) 40%, transparent);
    background-clip: padding-box;
}

/* Файл messages.css */

.driver_room_card {
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--blue-navy) 6%, var(--border));
    border-radius: 18px;
    background: linear-gradient(180deg, var(--bg-1) 0%, color-mix(in srgb, var(--accent) 3%, var(--bg-1)) 100%);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--blue-navy) 5%, transparent);
    transition:
        border-color .16s ease,
        background-color .16s ease;
}

.driver_room_card:hover {
    border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
    background: color-mix(in srgb, var(--accent) 4%, var(--bg-1));
}

.driver_room_card__title {
    color: var(--text-1);
    font-weight: 650;
}

.driver_room_card__message {
    margin: 4px 0 0;
    color: var(--text-3);
}

.driver_message_group {
    gap: 4px;
}

.driver_message_day {
    margin: 5px 0;
}

.driver_message_day span {
    padding: 3px 9px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg-1);
    color: var(--text-2);
    box-shadow: none;
    font-size: calc(var(--font_size_0) * .84);
}

.driver_messages_wrap .driver_message_card {
    max-width: min(68%, 720px);
    padding: 10px 12px 8px;
    border: 1px solid color-mix(in srgb, var(--blue-navy) 6%, var(--border));
    border-radius: 18px 18px 18px 6px;
    background: linear-gradient(180deg, var(--bg-1) 0%, color-mix(in srgb, var(--accent) 2%, var(--bg-1)) 100%);
    box-shadow: 0 10px 26px color-mix(in srgb, var(--blue-navy) 5%, transparent);
    cursor: pointer;
    transition:
        border-color .16s ease,
        background-color .16s ease;
}

.driver_messages_wrap .driver_message_card:hover {
    border-color: color-mix(in srgb, var(--accent) 24%, var(--border));
    background: color-mix(in srgb, var(--accent) 3%, var(--bg-1));
}

.driver_messages_wrap .driver_message_card--mine,
.driver_messages_wrap .driver_message_card--mine:hover {
    border-color: color-mix(in srgb, var(--accent) 38%, var(--border));
    border-radius: 18px 18px 6px 18px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 90%, white) 0%, var(--accent) 100%);
    color: var(--bg-1);
    box-shadow: 0 12px 26px color-mix(in srgb, var(--accent) 18%, transparent);
}

.driver_message_card--mine .driver_message_author,
.driver_message_card--mine .driver_message_text,
.driver_message_card--mine .driver_message_time,
.driver_message_card--mine .driver_message_forwarded {
    color: var(--bg-1);
}

.driver_message_author {
    margin-bottom: 2px;
    color: var(--blue-navy);
    font-size: calc(var(--font_size_0) * .86);
    font-weight: 650;
}

.driver_message_text {
    line-height: 1.38;
    overflow-wrap: anywhere;
}

.driver_message_forwarded {
    margin-bottom: 4px;
    padding-left: 8px;
    border-left: 2px solid color-mix(in srgb, var(--accent) 54%, var(--border));
    color: var(--text-2);
}

.driver_message_time {
    margin-top: 3px;
    font-size: calc(var(--font_size_0) * .78);
    opacity: .7;
}

.driver_messages_wrap .driver_message_card--system {
    max-width: min(88%, 760px);
    padding: 5px 10px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg-1);
    box-shadow: none;
    color: var(--text-2);
}

.driver_message_attachment,
.driver_message_document_attachment {
    border-radius: 10px;
}

.driver_message_attachment {
    border-color: var(--border);
    background: var(--bg-2);
}

.driver_message_card--mine .driver_message_attachment {
    border-color: color-mix(in srgb, var(--bg-1) 34%, transparent);
    background: color-mix(in srgb, var(--bg-1) 12%, transparent);
    color: var(--bg-1);
}

.driver_message_action_bar {
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
    box-shadow: 0 3px 12px color-mix(in srgb, var(--blue-navy) 8%, transparent);
}

.driver_message_action_bar button {
    width: 32px;
    min-width: 32px;
    height: 32px;
    border-radius: 9px;
}

/* Файл composer_and_mobile.css */

.driver_messages_form {
    position: sticky;
    bottom: 0;
    grid-template-columns: 38px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 7px;
    min-height: 46px;
    margin: auto 2px 0;
    padding: 5px 0 2px;
    background: var(--bg-2);
    z-index: 3;
}

.driver_messages_form--notification {
    grid-template-columns: minmax(0, 1fr) 38px;
}

.driver_messages_form--notification .driver_messages_input {
    grid-column: 1;
    min-width: 0;
}

.driver_messages_form--notification .driver_messages_send {
    grid-column: 2;
}

.driver_messages_input {
    height: 38px;
    min-height: 38px;
    max-height: 104px;
    padding: 7px 13px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--bg-1);
    box-shadow: none;
    line-height: 1.3;
    resize: none;
    transition:
        border-color .16s ease,
        box-shadow .16s ease;
}

.driver_messages_input:focus {
    border-color: color-mix(in srgb, var(--accent) 60%, var(--border));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 10%, transparent);
}

.driver_message_file_button,
.driver_messages_send {
    display: inline-grid;
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 13px;
    background: var(--accent);
    color: var(--bg-1);
    box-shadow: none;
    transition:
        background-color .16s ease,
        transform .16s ease;
}

.driver_message_file_button:hover,
.driver_messages_send:hover {
    background: var(--accent-blue);
}

.driver_message_file_button:active,
.driver_messages_send:active {
    transform: scale(.96);
}

.driver_message_file_button svg,
.driver_messages_send svg {
    width: 19px;
    height: 19px;
}

.driver_message_edit_context,
.driver_message_pending_file {
    padding: 7px 10px;
    border: 1px solid var(--border);
    border-radius: 11px;
    background: var(--bg-1);
    box-shadow: none;
}

@media (max-width: 760px), (orientation: portrait) {
    .driver_messages_wrap .driver_message_card {
        max-width: 86%;
    }

    .driver_messages_toolbar,
    .driver_messages_room_header {
        min-height: 40px;
    }

    .driver_messages_back {
        min-height: 36px;
        padding-right: 10px;
        padding-left: 10px;
    }
}

@media (orientation: portrait) {
    .drawer-panel.driver_messages_panel {
        right: 0;
        left: 0;
        width: 100%;
        max-width: 100%;
    }

    .drawer-panel.driver_messages_panel .drawer {
        width: 100%;
        max-width: 100%;
        border-radius: 0;
    }

    .driver_messages_panel .drawer-body {
        padding-right: max(6px, env(safe-area-inset-right));
        padding-left: max(6px, env(safe-area-inset-left));
    }

    .driver_messages_form {
        padding-bottom: max(2px, env(safe-area-inset-bottom));
    }
}

/* Файл light_theme.css */

.driver_messages_panel .drawer,
.driver_messages_panel .drawer-body,
.driver_messages_wrap,
.driver_messages_list {
    background: var(--bg-2);
}

.driver_messages_wrap {
    color: var(--text-1);
}

.driver_messages_list {
    border: 1px solid color-mix(in srgb, var(--blue-navy) 5%, var(--border));
    border-radius: 20px;
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--bg-1) 75%, transparent);
}

.driver_messages_wrap .driver_message_card {
    color: var(--text-1);
}

.driver_message_card:not(.driver_message_card--mine) .driver_message_author,
.driver_message_card:not(.driver_message_card--mine) .driver_message_text,
.driver_message_card:not(.driver_message_card--mine) .driver_message_time,
.driver_message_card:not(.driver_message_card--mine) .driver_message_forwarded {
    color: var(--text-1);
}

.driver_message_attachment,
.driver_message_document_attachment {
    color: var(--text-1);
}

.driver_room_card,
.driver_room_search,
.driver_message_search,
.driver_messages_form,
.driver_messages_input {
    background: var(--bg-1);
}

/* Файл telegram_clean.css */

.drawer-panel.driver_messages_panel,
.driver_messages_panel .drawer,
.driver_messages_panel .drawer-body,
.driver_messages_wrap {
    background: var(--bg-1);
}

.driver_messages_panel .drawer-header {
    min-height: 46px;
    padding-top: 0;
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: 0 2px 10px color-mix(in srgb, var(--blue-navy) 5%, transparent);
}

.driver_messages_panel .drawer-title {
    min-height: 46px;
    align-items: stretch;
}

.driver_messages_tabs--header {
    min-height: 46px;
    padding: 0 4px;
}

.driver_messages_tabs--header .driver_messages_tab {
    min-height: 46px;
    padding: 0 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text-2);
    font-size: calc(var(--font_size_0) * 1.08);
    font-weight: 650;
}

.driver_messages_tabs--header .driver_messages_tab:hover,
.driver_messages_tabs--header .driver_messages_tab:focus-visible {
    background: color-mix(in srgb, var(--accent) 7%, var(--bg-1));
    color: var(--accent-blue);
}

.driver_messages_tabs--header .driver_messages_tab--active,
.driver_messages_tabs--header .driver_messages_tab--active:hover,
.driver_messages_tabs--header .driver_messages_tab--active:focus-visible {
    background: var(--bg-1);
    color: var(--accent-blue);
}

.driver_messages_tabs--header .driver_messages_tab--active::after {
    right: 12px;
    left: 12px;
    height: 3px;
    background: var(--accent);
}

.driver_messages_panel .drawer-close {
    position: relative;
    z-index: 4;
    display: inline-flex;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    margin: 4px 7px 4px 4px;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: var(--bg-1);
    color: var(--text-1);
    opacity: 1;
    box-shadow: none;
}

.driver_messages_panel .drawer-close:hover,
.driver_messages_panel .drawer-close:focus-visible {
    border-color: color-mix(in srgb, var(--accent) 48%, var(--border));
    background: color-mix(in srgb, var(--accent) 8%, var(--bg-1));
    color: var(--accent-blue);
}

.driver_messages_panel .drawer-body {
    padding: 4px 8px 7px;
}

.driver_messages_wrap {
    gap: 6px;
}

.driver_messages_toolbar,
.driver_messages_room_header {
    min-height: 48px;
    margin: 0;
    padding: 6px 9px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: var(--bg-1);
    box-shadow: none;
}

.driver_messages_room_identity strong,
.driver_messages_room_title {
    font-size: calc(var(--font_size_0) * 1.12);
}

.driver_messages_list {
    gap: 7px;
    padding: 5px 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.driver_message_group {
    gap: 5px;
}

.driver_messages_wrap .driver_message_card {
    max-width: min(70%, 720px);
    padding: 9px 11px 7px;
    border: 0;
    border-radius: 17px 17px 17px 5px;
    background: color-mix(in srgb, var(--blue-navy) 4%, var(--bg-1));
    color: var(--text-1);
    box-shadow: none;
}

.driver_messages_wrap .driver_message_card:hover {
    border: 0;
    background: color-mix(in srgb, var(--blue-navy) 7%, var(--bg-1));
}

.driver_messages_wrap .driver_message_card--mine,
.driver_messages_wrap .driver_message_card--mine:hover {
    border: 0;
    border-radius: 18px 18px 5px 18px;
    background: color-mix(in srgb, var(--accent) 23%, var(--bg-1));
    color: var(--text-1);
    box-shadow: none;
}

.driver_message_card--mine .driver_message_author,
.driver_message_card--mine .driver_message_text,
.driver_message_card--mine .driver_message_time,
.driver_message_card--mine .driver_message_forwarded,
.driver_message_card--mine .driver_message_ticks {
    color: var(--text-1);
}

.driver_message_card--mine .driver_message_time,
.driver_message_card--mine .driver_message_ticks {
    color: var(--text-2);
}

.driver_message_day span {
    border: 1px solid var(--border);
    background: var(--bg-1);
    box-shadow: none;
}

.driver_room_card {
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--bg-1);
    box-shadow: none;
}

.driver_room_card:hover {
    border-color: color-mix(in srgb, var(--accent) 32%, var(--border));
    background: color-mix(in srgb, var(--accent) 5%, var(--bg-1));
}

.driver_messages_form {
    border-top: 1px solid var(--border);
    background: var(--bg-1);
    box-shadow: none;
}

@media (orientation: portrait), (max-width: 760px) {
    .drawer-panel.driver_messages_panel {
        top: 0;
        width: 100%;
        max-width: 100%;
    }

    .driver_messages_tabs--header .driver_messages_tab {
        padding: 0 13px;
        font-size: calc(var(--font_size_0) * 1.02);
    }

    .driver_messages_panel .drawer-body {
        padding: 3px 7px 6px;
    }

    .driver_messages_wrap .driver_message_card {
        max-width: 82%;
    }
}

/* Файл driver_messenger_modern.css */

/* Файл 01.css */

/* Создание чатов, presence и компактное управление участниками. */

.driver_chat_creation {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: 10px;
    padding: 4px;
    overflow: hidden;
}

.driver_chat_creation__header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.driver_chat_creation__header h3 {
    margin: 0;
    color: var(--text-1);
    font-size: calc(var(--messenger-font-size) * 1.08);
    text-align: center;
}

.driver_chat_creation__choices {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 6px;
}

.driver_chat_creation__choice {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-height: 78px;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border));
    border-radius: 16px;
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: 0 5px 14px color-mix(in srgb, var(--blue-navy) 6%, transparent);
    text-align: left;
    cursor: pointer;
}

.driver_chat_creation__choice:hover {
    border-color: color-mix(in srgb, var(--accent) 48%, var(--border));
    background: color-mix(in srgb, var(--accent) 4%, var(--bg-1));
}

.driver_chat_creation__choice-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
    background: color-mix(in srgb, var(--accent) 12%, var(--bg-1));
    font-size: 22px;
}

.driver_chat_creation__choice span:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.driver_chat_creation__choice small,
.driver_chat_creation__hint,
.driver_chat_creation__status {
    color: var(--text-2);
    font-size: calc(var(--messenger-font-size) * .82);
}

.driver_chat_creation__title,
.driver_chat_creation__search {
    display: flex;
    gap: 7px;
    align-items: center;
}

.driver_chat_creation__title {
    flex-direction: column;
    align-items: stretch;
    color: var(--text-2);
    font-size: calc(var(--messenger-font-size) * .86);
}

.driver_chat_creation__title input,
.driver_chat_creation__search input {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    height: 40px;
    margin: 0;
    padding: 7px 11px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.driver_chat_creation__search {
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
}

.driver_chat_creation__search input {
    padding-right: 0;
    padding-left: 0;
    border: 0;
    outline: 0;
}

.driver_chat_creation__pivot {
    min-height: 0;
    flex: 1;
    overflow: auto;
    border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
    border-radius: 14px;
    background: var(--bg-1);
}

.driver_chat_creation__pivot .pivot-table-container {
    max-height: none;
    border: 0;
    box-shadow: none;
}

.driver_chat_creation__pivot .pivot-table th,
.driver_chat_creation__pivot .pivot-table td {
    padding-top: 7px;
    padding-bottom: 7px;
    font-size: calc(var(--messenger-font-size) * .9);
}

.driver_chat_creation__actions {
    display: flex;
    justify-content: flex-end;
}

.driver_chat_creation__actions .driver_messages_send {
    width: auto;
    min-width: 148px;
    padding: 0 18px;
    white-space: nowrap;
}

.driver_messages_room_identity {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    align-items: center;
    overflow: hidden;
    text-align: center;
}

.driver_room_card__identity {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.driver_messages_room_identity strong,
.driver_room_card__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.driver_room_card__title {
    max-width: 100%;
}

.driver_messages_presence {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    color: var(--text-3, var(--text-2));
    font-size: calc(var(--messenger-font-size) * .7);
    font-weight: 500;
    white-space: nowrap;
}

.driver_messages_presence_dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--success-color, #20864a);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--success-color, #20864a) 14%, transparent);
}

.driver_messages_presence--online {
    color: var(--success-color, #20864a);
}

.driver_messages_members_view {
    gap: 8px;
}

.driver_messages_member_actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, max-content));
    gap: 7px;
    justify-content: start;
}

.driver_messages_member_add,
.driver_messages_delete_room {
    box-sizing: border-box;
    max-width: 100%;
    min-height: 36px;
    padding: 6px 11px;
    border-radius: 11px;
    background: var(--bg-1);
    line-height: 1.15;
    white-space: normal;
}

.driver_messages_members_list {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
}

.driver_messages_member {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px;
    gap: 8px;
    align-items: start;
    padding: 10px 11px;
    border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
    border-radius: 13px;
    background: color-mix(in srgb, var(--bg-1) 97%, var(--accent));
    box-shadow: 0 3px 9px color-mix(in srgb, var(--blue-navy) 4%, transparent);
}

.driver_messages_member > button {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--error-color, #c62828) 28%, var(--border));
    border-radius: 10px;
    background: transparent;
    color: var(--error-color, #c62828);
}

.driver_messages_member_name {
    flex-wrap: wrap;
    font-size: calc(var(--messenger-font-size) * .92);
}


/* Файл 02.css */

.driver_messages_member_owner {
    padding: 1px 6px;
    font-size: calc(var(--messenger-font-size) * .68);
}

.driver_participant_permissions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px 10px;
    margin-top: 7px;
}

.driver_participant_permission {
    gap: 6px;
    font-size: calc(var(--messenger-font-size) * .78);
    line-height: 1.2;
}

.driver_participant_permission input {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

.driver_user_picker__actions {
    position: sticky;
    bottom: 0;
    padding-top: 7px;
    background: var(--bg-2);
}

.driver_user_picker__submit {
    width: auto;
    max-width: 100%;
    min-width: min(100%, 190px);
    padding: 0 14px;
    white-space: normal;
}

@media (max-width: 640px), (orientation: portrait) {
    .driver_chat_creation__choices {
        grid-template-columns: 1fr;
    }

    .driver_chat_creation__choice {
        min-height: 68px;
    }

    .driver_messages_member_actions {
        grid-template-columns: minmax(0, 1fr) auto;
        width: 100%;
    }

    .driver_messages_member_add,
    .driver_messages_delete_room {
        width: 100%;
    }

    .driver_participant_permissions {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 380px) {
    .driver_messages_member_actions {
        grid-template-columns: 1fr;
    }
}

/* Файл driver_messenger_creation.css */

/* Файл driver_messenger.css */

/* Файл TableHeader.css */

/* ─── Icon button (sort/filter trigger) ─── */
.th-icon-btn {
    width: 20px;
    height: 20px;
    border: 1px solid #d0d7de;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
}

.th-icon-btn:hover {
    background: #f3f4f6;
}

/* ─── Filter dropdown menu container ─── */
.th-filter-menu {
    width: min(400px, calc(100vw - 16px));
    background: #ffffff;
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14);
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    z-index: 9999;
    font-size: 13px;
    color: #000000;
}

.th-filter-menu * {
    font-size: inherit;
    font-family: inherit;
}

/* ─── Menu buttons ─── */
.th-menu-btn {
    width: 100%;
    border: none;
    background: #ffffff;
    text-align: left;
    padding: 8px 10px;
    border-radius: 6px;
    cursor: pointer;
    color: #000000;
    white-space: normal;
    word-break: break-word;
}

.th-menu-btn:hover {
    background: #f3f4f6;
}

.th-menu-btn--apply {
    width: auto;
    padding: 4px 8px;
    background: #e5f2ff;
    border-radius: 6px;
}

.th-menu-btn--apply:hover {
    background: #cce4ff;
}

.th-menu-btn--cancel {
    width: auto;
    padding: 4px 8px;
}

/* ─── Hint text ─── */
.th-menu-hint {
    margin-top: 4px;
    color: #6b7280;
    white-space: normal;
    word-break: break-word;
}

/* ─── Divider ─── */
.th-divider {
    margin: 4px 0;
    border: none;
    border-top: 1px solid #e5e7eb;
}

/* ─── Sort order badge ─── */
.th-sort-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 14px;
    height: 14px;
    padding: 0 3px;
    border-radius: 999px;
    background: #1976d2;
    color: #ffffff;
    font-size: 9px;
    font-weight: 600;
    line-height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    box-shadow: 0 0 0 1px #ffffff;
}

/* ─── MultiSortPanel ─── */
.th-multi-panel {
    padding: 4px 2px;
}

.th-multi-panel__title {
    margin-bottom: 4px;
    color: #000000;
}

.th-multi-panel__footer {
    display: flex;
    gap: 6px;
    justify-content: flex-end;
}

/* ─── Checkbox list ─── */
.th-checkbox-list {
    max-height: 220px;
    overflow-y: auto;
    margin-bottom: 8px;
    padding: 6px;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
}

/* ─── Checkbox row ─── */
.th-checkbox-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 4px;
    color: #000000;
}

.th-checkbox-row--spread {
    justify-content: space-between;
    align-items: center;
}

/* ─── Checkbox label ─── */
.th-checkbox-label {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    min-width: 0;
    cursor: pointer;
}

/* ─── Column name span ─── */
.th-col-name {
    /* overflow: hidden; */
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ─── Direction buttons (↑ ↓) ─── */
.th-direction-group {
    display: flex;
    gap: 4px;
    margin-left: 8px;
}

.th-direction-btn {
    border: 1px solid #d0d7de;
    background: #ffffff;
    color: #000000;
    border-radius: 6px;
    padding: 2px 8px;
    cursor: pointer;
    line-height: 1.4;
    flex-shrink: 0;
}

.th-direction-btn:hover {
    background: #f3f4f6;
}

.th-direction-btn--active {
    background: #e5f2ff;
    border-color: #93c5fd;
}

/* ─── Critical fixes for dropdown visibility ─── */
.data-table th.table-header,
.data-table th.table-header .header-content {
    overflow: visible !important;
}

.data-table th.table-header .th-menu-anchor {
    position: relative;
    overflow: visible !important;
}
/* Файл glass-style.css */

/* Стиль Glass */

.glass-style .table-container {
    background: rgba(255, 255, 255, 1);
}

.glass-style .data-table {
    background: transparent;
}

.glass-style .data-table th {
    background: rgba(74, 144, 226);
    color: white;
    font-weight: 600;
}

/* Фиксированные заголовки в glass стиле */
.glass-style .fixed-header,
.glass-style .fixed-header-row {
    background: rgba(74, 144, 226) !important;
    color: white !important;
}

/* Для фиксиксированных строк в glass стиле */
.glass-style .fixed-row {
    background: rgba(255, 255, 255, 1) !important;
}

.glass-style .fixed-row-cell {
    background: inherit !important;
}

.glass-style .data-table th:not(:last-child) {
    border-right: 0px solid rgba(255, 255, 255);
}

.glass-style .data-table td {
    background: rgba(255, 255, 255, 1) !important;
    border-bottom: 0px solid rgba(0, 0, 0);
}

/* Активная строка для фиксированных ячеек */
.glass-style .data-table tr:hover td {
    background: #fffce6 !important;
}

/* Новые правила для нередактируемых ячеек */
.glass-style .data-table td.non-editable-cell {
    background-color: rgba(191, 226, 252) !important;
}

/* Для первой ячейки в строке (если нужно сохранить особый стиль) */
.glass-style .data-table td:first-child {
    background-color: rgba(93, 173, 226) !important;
}

/* При наведении на строку, нередактируемые ячейки также меняют цвет */
.glass-style .data-table tr:hover td.non-editable-cell {
    background-color: #e6f2ff !important;
}
/* Файл modern-style.css */

/* Стиль 1: Современный (Modern) */
.modern-style .table-container {
    border-radius: 8px;
}

.modern-style .data-table th {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    font-weight: 600;
    border-bottom: 2px solid #5a67d8;
}

/* Фиксированные заголовки в modern стиле */
.modern-style .fixed-header,
.modern-style .fixed-header-row {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: white !important;
}

/* Для фиксированныхрованных строк в modern стиле */
.modern-style .fixed-row {
    background: white !important;
}

.modern-style .fixed-row-cell {
    background: inherit !important;
}

/* Переопределяем для фиксированных ячеек в modern стиле */
.modern-style .fixed-cell {
    background: white !important;
}
/* Файл striped-style.css */

/* Стиль Striped с чередующимися строками */

.striped-style
.table-container {
    border: 0px solid #e0e0e0;
    border-radius: 6px;
}

.striped-style
.data-table th {
    background: #2c3e50;
    color: white;
    font-weight: 600;
    border-bottom: 0px solid #34495e;
    position: relative;
}

.striped-style
.data-table th::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0px;
    background: linear-gradient(90deg, #3498db, #2ecc71);
}

/* Чередующиеся строки */
.striped-style
.data-table tbody
tr:nth-child(odd) td {
    background-color: var(--bg-1);
}

.striped-style
.data-table tbody
tr:nth-child(even) td {
    background-color: #e8f4fc; /* голубой цвет */
}

/* Эффект при наведении */
.striped-style
.data-table tbody tr:hover td {
    background-color: #fffacd !important; /* светло-желтый при наведении */
}

/* Фиксированные заголовки в striped стиле */
.striped-style .fixed-header,
.striped-style .fixed-header-row {
    background: #2c3e50 !important;
    color: white !important;
}

.striped-style
.fixed-header-row th::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0px;
    background: linear-gradient(90deg, #3498db, #2ecc71);
}

/* Для фиксированных строк в striped стиле */
.striped-style
.fixed-row {
    background: white !important;
}

.striped-style .fixed-row-cell {
    background: inherit !important;
}

/* Для нечетных фиксированных строк */
.striped-style
.fixed-row:nth-child(odd)
.fixed-row-cell {
    background-color: #ffffff !important;
}

/* Для четных фиксированных строк */
.striped-style
.fixed-row:nth-child(even)
.fixed-row-cell {
    background-color: #e8f4fc !important;
}

/* Переопределяем для фиксированных ячеек в striped стиле */
.striped-style
.fixed-cell {
    background: inherit !important;
}

/* Границы для ячеек */
.striped-style
.data-table th {
    border-right: 1px solid #34495e;
}

/* Последняя ячейка в строке */
.striped-style
.data-table td:last-child {
    border-right: none;
}

/* Последняя строка */
.striped-style
.data-table tbody tr:last-child td {
    border-bottom: none;
}
/* Файл highlighting_cell_borders.css */

/* Обновленные стили для выделенных ячеек */
.selected-cell.has-top-neighbor::after {
    border-top: none;
}

.selected-cell.has-bottom-neighbor::after {
    border-bottom: none;
}

.selected-cell.has-left-neighbor::after {
    border-left: none;
}

.selected-cell.has-right-neighbor::after {
    border-right: none;
}

/* Для редактируемой ячейки всегда показываем все границы */
.editing-cell::after {
    border: 2px solid #0078d4 !important;
}


/* ── Подсветка скопированного диапазона ──
   Класс copied-range-cell ставится на каждую ячейку
   диапазона (см. keyboard_shortcuts.js); на ячейках,
   лежащих на внешней границе, дополнительно стоят
   copied-range-top / -bottom / -left / -right —
   именно там и рисуется пунктир, чтобы получился
   единый контур вокруг всего диапазона. */
.copied-range-cell {
    position: relative;
}

.copied-range-cell::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    border: 0 dashed #1976d2;
    z-index: 7;
}

.copied-range-cell.copied-range-top::before {
    border-top-width: 2px;
}

.copied-range-cell.copied-range-bottom::before {
    border-bottom-width: 2px;
}

.copied-range-cell.copied-range-left::before {
    border-left-width: 2px;
}

.copied-range-cell.copied-range-right::before {
    border-right-width: 2px;
}
/* Файл add_row_column_buttons.css */

.add_row_column_overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 25;
}

.add_row_column__button {
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: none;
    background: var(--accent-blue);
    color: var(--bg-1);
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    cursor: pointer;
    pointer-events: auto;
    box-shadow: var(--shadow);
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 30;
}

.add_row_column__button:hover {
    background: var(--accent);
}

.add_row_column__row_highlight {
    position: absolute;
    height: 1px;
    background: var(--accent-blue);
    pointer-events: none;
    z-index: 24;
}

.add_row_column__column_highlight {
    position: absolute;
    width: 1px;
    background: var(--accent-blue);
    pointer-events: none;
    z-index: 24;
}

.table-widget .table-container {
    position: relative;
}
/* Файл portrait_modes.css */

.portrait-card-table {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 5px;
    box-sizing: border-box;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.portrait-table-card {
    display: flex;
    width: 100%;
    min-width: 0;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 0;
    margin: 0;
    padding: 5px 8px;
    box-sizing: border-box;
    cursor: pointer;
}

.portrait-table-card__field {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(105px, 40%) minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    padding: 7px 2px;
    border-bottom: 1px solid var(--border);
    box-sizing: border-box;
}

.portrait-table-card__field:last-child {
    border-bottom: 0;
}

.portrait-table-card__label {
    min-width: 0;
    color: var(--text-3);
    font-size: var(--font_size_0);
    font-weight: 600;
    overflow-wrap: anywhere;
}

.portrait-table-card__value {
    min-width: 0;
    color: var(--text-2);
    font-size: var(--font_size_0);
    overflow-wrap: anywhere;
    word-break: break-word;
}

.portrait-column-switcher-wrapper {
    overflow-x: hidden;
}

.portrait-column-navigator {
    display: flex;
    width: 100%;
    min-width: 0;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
    padding: 4px 5px;
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
    box-sizing: border-box;
}

.portrait-column-navigator__current {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    color: var(--text-3);
    font-size: calc(var(--font_size_0) * .9);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portrait-column-navigator__search {
    display: inline-flex;
    width: 34px;
    height: 30px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-2);
    cursor: pointer;
    font-size: var(--font_size_1);
}

.portrait-column-navigator__search:hover {
    background: var(--bg-2);
}

.portrait-column-navigator__actions {
    display: flex;
    flex: 0 0 auto;
    gap: 5px;
    margin-left: auto;
}

.portrait-column-navigator__actions button {
    display: inline-flex;
    width: 34px;
    height: 30px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(180deg, #49a9df, #2f83c3);
    color: var(--bg-1);
    cursor: pointer;
    font-size: var(--font_size_1);
    font-weight: 700;
}

.portrait-column-navigator__actions button:disabled {
    opacity: .4;
    cursor: default;
}

@media (orientation: portrait) {
    .portrait-card-table {
        gap: var(--font_size_10);
        padding: 4px;
        background: var(--bg-2);
    }

    .portrait-table-card.block_1 {
        margin: 0;
    }

    .portrait-table-card {
        padding: 4px 8px;
        border: 1px solid var(--border);
        border-radius: 8px;
        background: var(--bg-1);
        box-shadow: var(--shadow);
    }

    .portrait-column-switcher-wrapper .data-table {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        table-layout: fixed;
    }

    .table-widget:not(.apartment-number-content-width)
    .portrait-column-switcher-wrapper .data-table th,
    .table-widget:not(.apartment-number-content-width)
    .portrait-column-switcher-wrapper .data-table td {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .apartment-number-content-width
    .portrait-column-switcher-wrapper .data-table th,
    .apartment-number-content-width
    .portrait-column-switcher-wrapper .data-table td {
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .table-widget:not(.apartment-number-content-width)
    .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column) th:first-child,
    .table-widget:not(.apartment-number-content-width)
    .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column) td:first-child {
        width: 40% !important;
    }

    .portrait-column-switcher-wrapper
    .data-table.has-row-number-column .row-number-header,
    .portrait-column-switcher-wrapper
    .data-table.has-row-number-column .row-number-cell {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        overflow: hidden !important;
        white-space: nowrap !important;
    }

    .table-widget:not(.apartment-number-content-width)
    .portrait-column-switcher-wrapper
    .data-table.has-row-number-column th:nth-child(2),
    .table-widget:not(.apartment-number-content-width)
    .portrait-column-switcher-wrapper
    .data-table.has-row-number-column td:nth-child(2) {
        width: 38% !important;
    }

    .portrait-column-switcher-wrapper .data-table th:only-child,
    .portrait-column-switcher-wrapper .data-table td:only-child {
        width: 100% !important;
    }

    .portrait-column-switcher-wrapper .header-content,
    .portrait-column-switcher-wrapper .cell-content,
    .portrait-column-switcher-wrapper .cell-display-value {
        min-width: 0;
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .portrait-column-switcher-wrapper .data-table .fixed-column,
    .portrait-column-switcher-wrapper .data-table .fixed-cell {
        overflow: hidden !important;
        background-clip: border-box !important;
        isolation: isolate;
    }

    .portrait-column-switcher-wrapper
    .data-table .row-number-cell .cell-content,
    .portrait-column-switcher-wrapper
    .data-table .row-number-cell .cell-display-value {
        line-height: 1.15;
        text-align: center;
        white-space: nowrap;
    }

    .striped-style .portrait-column-switcher-wrapper
    .data-table tbody tr:nth-child(odd) .fixed-cell {
        background-color: var(--bg-1) !important;
    }

    .striped-style .portrait-column-switcher-wrapper
    .data-table tbody tr:nth-child(even) .fixed-cell {
        background-color: #e8f4fc !important;
    }

    .glass-style .portrait-column-switcher-wrapper
    .data-table td.fixed-cell {
        background-color: rgba(255, 255, 255, 1) !important;
    }

    .glass-style .portrait-column-switcher-wrapper
    .data-table td.fixed-cell:first-child {
        background-color: rgba(93, 173, 226, 1) !important;
    }
}

/* Файл portrait_fixed_cells.css */

@media (orientation: portrait) {
    .portrait-column-switcher-wrapper .data-table {
        table-layout: fixed !important;
    }

    .portrait-column-switcher-wrapper .data-table tbody tr {
        position: relative;
    }

    .portrait-column-switcher-wrapper
    .data-table tbody td.fixed-cell {
        position: static !important;
        left: auto !important;
        z-index: auto !important;
    }

    .portrait-column-switcher-wrapper
    .data-table tbody td:first-child.fixed-cell {
        overflow: hidden !important;
        vertical-align: top;
        clip-path: none;
        isolation: auto;
    }

    .portrait-column-switcher-wrapper
    .data-table tbody td:first-child.fixed-cell .cell-content,
    .portrait-column-switcher-wrapper
    .data-table tbody td:first-child.fixed-cell .cell-display-value {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow: hidden !important;
        box-sizing: border-box;
    }
}

/* Файл content_width_columns.css */

.apartment-number-content-width
.data-table:not(.has-row-number-column) th:first-child,
.apartment-number-content-width
.data-table:not(.has-row-number-column) td:first-child,
.apartment-number-content-width
.data-table.has-row-number-column th:nth-child(2),
.apartment-number-content-width
.data-table.has-row-number-column td:nth-child(2) {
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.apartment-number-content-width
.data-table:not(.has-row-number-column) th:first-child .header-content,
.apartment-number-content-width
.data-table:not(.has-row-number-column) td:first-child .cell-content,
.apartment-number-content-width
.data-table:not(.has-row-number-column) td:first-child .cell-display-value,
.apartment-number-content-width
.data-table.has-row-number-column th:nth-child(2) .header-content,
.apartment-number-content-width
.data-table.has-row-number-column td:nth-child(2) .cell-content,
.apartment-number-content-width
.data-table.has-row-number-column td:nth-child(2) .cell-display-value {
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

@media (orientation: portrait) {
    .apartment-number-content-width
    .portrait-column-switcher-wrapper .data-table {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        table-layout: fixed !important;
    }

    .apartment-number-content-width
    .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column) th:not(:first-child),
    .apartment-number-content-width
    .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column) td:not(:first-child),
    .apartment-number-content-width
    .portrait-column-switcher-wrapper
    .data-table.has-row-number-column th:not(:first-child):not(:nth-child(2)),
    .apartment-number-content-width
    .portrait-column-switcher-wrapper
    .data-table.has-row-number-column td:not(:first-child):not(:nth-child(2)) {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    .apartment-number-content-width
    .portrait-column-switcher-wrapper {
        overflow-x: hidden !important;
    }
}

/* Файл TableWidget.css */



/* Базовые стили таблицы */
.table-widget {
    position: relative;
    display: flex;
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    max-height: calc(100dvh - (var(--font_size_10) * 3));
    flex-direction: column;
    overflow: hidden;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    box-sizing: border-box;
}

.table-container {
    box-shadow: 0 2px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    height: 100%;
    min-height: 0;
    max-height: 100%;
}

.table-wrapper {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: auto;
    min-width: 0;
    min-height: 0;
    max-height: 100%;
    flex: 1 1 auto;
    overflow-x: auto;
    overflow-y: auto;
    scrollbar-gutter: auto;
    overscroll-behavior: contain;
    touch-action: pan-x pan-y;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}

.data-table {
    width: 100%;
    border-spacing: 0;
    table-layout: fixed;
    background: white;
    position: relative;
}

/* Общие стили для заголовков и ячеек */
.data-table th,
.data-table td {
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: left;
    border-right: 0px solid hsl(210, 16%, 93%);
    border-bottom: 0px solid #0f68c1;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box;
    background-clip: padding-box;
    position: relative;
    overflow: hidden;
}

/* Стили для редактируемых ячеек */
.editable-cell {
    cursor: cell;
}

.selected-cell {
    position: relative;
    z-index: 8 !important;
}

.selected-cell::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid #0078d4;
    pointer-events: none;
}

.editing-cell::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid #0078d4;
    background-color: white;
    pointer-events: none;
    z-index: 61;
}

.cell-input {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    padding: 0px;
    margin: 0px;
    font-size: inherit;
    font-family: inherit;
    background: transparent;
    box-sizing: border-box;
    position: relative;
    z-index: 62;
}

/* Выделение диапазона */
.selection-range {
    position: absolute;
    border: 2px solid #0078d4;
    background-color: rgba(0, 120, 212, 0.1);
    pointer-events: none;
    z-index: 55;
}

/* Фиксированные столбцы */
.fixed-column {
    position: sticky !important;
    background: white !important;
}

/* Фиксированные заголовки столбцов.
   Вертикальное закрепление задаётся только классом fixed-header-row.
   Иначе при горизонтально закреплённых столбцах часть шапки оставалась
   на месте, а остальные заголовки прокручивались вверх. */
.fixed-header {
    z-index: 30 !important;
    background: inherit !important;
}

.fixed-header.fixed-header-row {
    top: 0;
}

/* Фиксированные ячейки */
.fixed-cell {
    z-index: 20 !important;
    background: inherit !important;
}

/* Фиксированные строки */
.fixed-row {
    position: sticky !important;
    background: white !important;
    z-index: 22 !important;
}

.fixed-row-cell {
    background: inherit !important;
}

/* Класс для фиксированной шапки */
.fixed-header-row {
    position: sticky !important;
    top: 0 !important;
    z-index: 25 !important;
}

/* Для таблицы с фиксированной шапкой */
.fixed-header-table thead {
    position: sticky;
    top: 0;
    z-index: 25;
}

/* Вспомогательные классы для контента */
.header-content,
.cell-content {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Стили для состояний */
.loading {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 200px;
    font-size: 18px;
    color: #665;
}

.error-message {
    background-color: #f8d7da;
    color: #721c24;
    border-radius: 4px;
    border: 1px solid #f5c6cb;
    margin-bottom: 10px;
}

.no-data {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100px;
    color: #655;
    font-style: italic;
}

/* Для ячейек с плейсхолдером */
.cell-placeholder {
    color: #998;
    opacity: 0.7;
}

/* Пользовательская заливка ячеек (как в Excel) */
.glass-style .data-table .table-cell-cell.custom-filled-cell,
.striped-style .data-table .table-cell-cell.custom-filled-cell,
.modern-style .data-table .table-cell-cell.custom-filled-cell,
.table-cell-cell.custom-filled-cell {
    background: var(--custom_cell_background) !important;
}

/* Фантомные строки больше НЕ используются для высоты
   (phantomCount = 0). Стили оставлены на случай возврата,
   они безвредны при отсутствии .phantom-row в DOM. */
.phantom-row {
    pointer-events: none;
    user-select: none;
}

.phantom-cell {
    background: transparent;
    border: none;
    cursor: default;
}

.data-table tbody tr.phantom-row:hover td,
.data-table tbody tr.phantom-row:nth-child(odd) td,
.data-table tbody tr.phantom-row:nth-child(even) td {
    background: transparent !important;
    box-shadow: none !important;
}

.cell-checkbox {
    display: block;
    margin: 0 auto;
    cursor: pointer;
}

.cell-display-value.wrap-cell {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.2;
}

.table-widget--auto-height {
    height: auto;
    max-height: none;
    overflow: visible;
}

.table-widget--auto-height .table-container {
    height: auto;
    max-height: none;
    overflow: visible;
}

.table-widget--auto-height .table-wrapper {
    height: auto;
    max-height: none;
    flex: 0 0 auto;
    overflow-x: auto;
    overflow-y: visible;
    overscroll-behavior: auto;
}


/* Файл table_search.css */

.table-search-portrait {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
}

.table-search-portrait__toggle,
.table-search-portrait__field button,
.table-search-panel__footer button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
    color: var(--accent-dark);
    font-size: var(--font_size_1);
    cursor: pointer;
}

.table-search-portrait__toggle:hover,
.table-search-portrait__field button:hover,
.table-search-panel__footer button:hover {
    border-color: var(--accent);
    background: var(--bg-2);
    color: var(--accent);
}

.table-search-portrait__field {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    gap: 8px;
    padding: 4px 6px 4px 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
}

.table-search-portrait__field input {
    min-width: 0;
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.table-search-portrait__field span {
    color: var(--text-2);
    font-size: var(--font_size_0);
    white-space: nowrap;
}

.table-search-panel__content {
    display: flex;
    height: 100%;
    box-sizing: border-box;
    flex-direction: column;
    gap: 14px;
    padding: 12px;
}

.table-search-panel__field {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
}

.table-search-panel__field input {
    min-width: 0;
    height: 42px;
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.table-search-panel__options {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
}

.table-search-panel__options label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.table-search-panel__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
}

.table-search-panel__footer > div {
    display: flex;
    gap: 8px;
}

.table-search-panel__footer button:disabled {
    cursor: default;
    opacity: 0.45;
}

.table-search-current-cell {
    box-shadow: inset 0 0 0 3px var(--accent-orange-bg) !important;
}

/* Файл total_row.css */

/* Строка «Итого» TableWidget. По умолчанию прокручивается
   вместе с таблицей, а при fix_total_row={true} прибивается
   к низу скролл-контейнера. */

.tw-total-row {
    background: var(--bg-2, #edf1f5);
}

.tw-total-cell {
    position: static;
    bottom: auto;
    z-index: 15;
    padding: 4px 6px;
    background: var(--bg-2, #edf1f5);
    border-top: 2px solid var(--border, #d0d7de);
    font-weight: 600;
    color: var(--text-1, #1f2328);
    box-sizing: border-box;
}

/* Фиксированные слева столбцы в футере должны
   перекрывать обычные ячейки при горизонтальном скролле. */
.tw-total-cell.fixed-column {
    z-index: 25;
}

/* fix_total_row={true} — строка прибивается к низу. */
.tw-total-row:not(.tw-total-row--static) .tw-total-cell {
    position: sticky;
    bottom: 0;
}

.tw-total-label {
    text-align: left;
}

.tw-total-value {
    text-align: right;
}

/* Стиль glass: заливка строки «Итого» как у шапки.
   Повышенная специфичность + !important, чтобы перебить
   `.glass-style .data-table td { background: #fff !important }`
   и `td:first-child`. */
.glass-style .data-table .tw-total-cell {
    background: rgba(74, 144, 226) !important;
    color: #fff;
    border-top-color: rgba(74, 144, 226);
}

/* Файл DocumentFilePreview.css */

.document-file-preview {
    min-height: 70dvh;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--bg-1);
}

.document-file-preview__pdf {
    display: block;
    width: 100%;
    min-height: 78dvh;
    border: 0;
    background: var(--bg-1);
}

.document-file-preview--docx {
    padding: 18px;
}

.document-file-preview--docx .docx-viewer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}

.document-file-preview__message {
    padding: 24px;
    color: var(--text-2);
    text-align: center;
}

.document-file-preview__message--error {
    color: var(--accent-red);
}

/* Файл DocumentTemplatesPanel.css */

.document-templates-panel {
    width: 100%;
    height: 100%;
    min-height: 0;
}

.document-templates-panel > .tab-widget-container,
.document-templates-panel .tab-container-left,
.document-templates-panel .tab-content-wrapper,
.document-templates-panel .tab-content-left,
.document-templates-panel .tab-content-item.active {
    height: 100%;
    min-height: 0;
}

.document-templates-panel .tab-container-left {
    align-items: stretch;
}

.document-templates-panel .tab-nav-left {
    align-self: stretch;
    height: 100%;
    min-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    background: var(--bg-2);
}

.document-templates-panel .tab-nav-left .tab-item-wrapper {
    flex: 0 0 auto;
}

.document-templates-panel .tab-nav-left .tab-item-wrapper:first-child {
    margin-top: 0;
}

.document-templates-panel .tab-content-left,
.document-templates-panel .tab-content-item.active {
    overflow-y: auto;
}

.document-templates {
    display: grid;
    grid-template-columns: minmax(280px, 0.8fr) minmax(360px, 1.2fr);
    gap: 10px;
    min-height: 100%;
    padding: 8px;
    box-sizing: border-box;
}

.document-templates__editor,
.document-templates__list {
    min-width: 0;
    margin: 0;
}

.document-templates__title {
    margin-bottom: 10px;
    color: var(--blue-navy);
    font-size: var(--font_size_1);
    font-weight: 700;
}

.document-templates__field {
    display: grid;
    gap: 5px;
    margin-bottom: 10px;
    color: var(--text-3);
}

.document-templates__field input,
.document-templates__field textarea {
    width: 100%;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    box-sizing: border-box;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.document-templates__field textarea {
    resize: vertical;
    white-space: pre-wrap;
}

.document-templates__actions,
.document-templates__item-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.document-templates__item {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}

.document-templates__item-main {
    min-width: 0;
}

.document-templates__item-main strong {
    color: var(--blue-navy);
}

.document-templates__item-main span {
    display: block;
    margin-top: 2px;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.document-templates__item-main p {
    max-height: 92px;
    margin: 6px 0 0;
    overflow: hidden;
    color: var(--text-1);
    white-space: pre-wrap;
}

.document-templates__item-actions {
    align-content: flex-start;
    flex: 0 0 auto;
}

.document-templates__item-actions button {
    min-width: 96px;
    min-height: 32px;
    padding: 5px 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-2);
    cursor: pointer;
}

.document-templates__item-actions button:hover {
    border-color: var(--accent);
    background: var(--bg-2);
    color: var(--accent-blue);
}

.document-templates__empty {
    color: var(--text-2);
}

@media (max-width: 900px) {
    .document-templates {
        grid-template-columns: 1fr;
    }
}

.document-appearance {
    min-height: calc(100% - 16px);
    margin: 8px;
    box-sizing: border-box;
}

.document-appearance p {
    max-width: 660px;
    margin: 0 0 18px;
    color: var(--text-2);
    line-height: 1.5;
}

.document-appearance__fields {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.document-appearance__fields .document-templates__field {
    min-width: 220px;
}

.document-appearance__fields select {
    min-height: 36px;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0 10px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.document-appearance__preview {
    width: min(680px, 100%);
    margin-top: 18px;
    padding: 20px;
    border: 1px solid var(--border);
    border-radius: 10px;
    box-sizing: border-box;
    background: var(--bg-1);
    color: var(--text-1);
}

/* Компактная раскладка вкладки «Файл» Writer. */
.document-templates-panel .document-templates {
    grid-template-columns: minmax(320px, 430px) minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    padding: 4px 4px 8px 8px;
}

.document-templates-panel .document-templates__editor,
.document-templates-panel .document-templates__list {
    width: 100%;
    max-width: none;
    min-height: 0;
    margin: 0 !important;
    box-sizing: border-box;
}

.document-templates-panel .document-templates__list {
    justify-self: stretch;
}

@media (max-width: 900px) {
    .document-templates-panel .document-templates {
        grid-template-columns: 1fr;
    }
}

/* Файл full_document_editor_layout.css */

.doc-editor {
    --doc-editor-control-font-size: 12px;
    --doc-editor-control-height: 28px;
    display: flex;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    gap: 12px;
    padding: 4px 0;
}


.doc-editor--file-mode {
    gap: 0;
    padding: 0;
}

.doc-editor--file-mode .doc-editor__topbar--file {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.doc-editor--file-mode .document-templates-panel {
    flex: 1 1 auto;
    min-height: 0;
}

.doc-editor__topbar {
    display: flex;
    height: 132px;
    min-height: 132px;
    max-height: 132px;
    flex: 0 0 132px;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
}

.doc-editor__topbar--file {
    height: 42px;
    min-height: 38px;
    max-height: 42px;
    flex-basis: 42px;
}

.doc-editor__tabs-row {
    display: flex;
    min-width: 0;
    min-height: 38px;
    flex: 0 0 38px;
    align-items: stretch;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid var(--border);
    background: var(--bg-2);
}

.doc-editor__tabs {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    gap: 6px;
    padding: 4px 5px 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}

.doc-editor__tab {
    height: 30px;
    flex: 0 0 auto;
    padding: 0 8px;
    border: none;
    border-radius: 10px 10px 0 0;
    background: transparent;
    color: var(--text-3);
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: 0.16s ease;
}

.doc-editor__tab:hover {
    background: color-mix(in srgb, var(--accent) 7%, var(--bg-1));
    color: var(--text-1);
    box-shadow: none;
    transform: none;
}

.doc-editor__tab--active {
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: 0 -1px 0 var(--bg-1), 0 0 0 1px var(--border) inset;
}

.doc-editor__topbar-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
    padding-right: 7px;
}

.doc-editor__layout-mode-btn {
    display: inline-flex;
    width: 34px;
    min-width: 34px;
    height: 32px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-1);
    color: var(--blue-navy);
    font-size: 17px;
    line-height: 1;
    cursor: pointer;
}

.doc-editor__layout-mode-btn:hover {
    border-color: var(--accent);
    background: var(--bg-1);
    color: var(--accent);
    box-shadow: none;
    transform: none;
}

.doc-editor__save-text-btn {
    align-self: center;
    min-width: 142px;
    min-height: 32px;
    margin: 0;
    padding: 4px 12px;
    border: 1px solid var(--accent);
    border-radius: 9px;
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--doc-editor-control-font-size);
    white-space: nowrap;
}

.doc-editor__save-text-btn:hover {
    border-color: var(--accent-blue);
    background: var(--accent-blue);
    color: var(--bg-1);
}

.doc-editor__tab-panel {
    display: grid;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    grid-auto-columns: max-content;
    grid-auto-flow: column;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    align-items: center;
    align-content: stretch;
    justify-content: start;
    gap: 4px 8px;
    padding: 5px 8px;
    overflow-x: auto;
    overflow-y: hidden;
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
    scrollbar-width: thin;
}

.doc-editor__tab-panel--formulas {
    display: flex;
    align-items: stretch;
    gap: 8px;
    overflow-x: hidden;
}

.doc-editor__tab-panel > .doc-editor__group--column,
.doc-editor__tab-panel > .doc-editor__review-toolbar {
    grid-row: 1 / span 2;
}

.doc-editor__tab-panel > .doc-editor__hint {
    margin-top: 0;
}

.doc-editor__group {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 4px;
    padding-right: 8px;
    border-right: 1px solid var(--border);
}

.doc-editor__group:last-child {
    padding-right: 0;
    border-right: none;
}

.doc-editor__group--column {
    flex-direction: column;
    align-items: flex-start;
}

.doc-editor__group--grow {
    flex: 1 1 100%;
}

.doc-editor__group--compact {
    gap: 3px;
    padding-right: 7px;
}

/* Файл full_document_editor_controls.css */

.doc-editor__tool-btn,
.doc-editor__select,
.doc-editor__color-control,
.doc-editor__mini-field {
    min-height: var(--doc-editor-control-height);
    border: 1px solid #d9ddea;
    border-radius: 8px;
    background: #fff;
    color: #44506b;
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
    line-height: 1;
    box-sizing: border-box;
}

.doc-editor__tool-btn {
    display: inline-flex;
    min-width: var(--doc-editor-control-height);
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 8px;
    cursor: pointer;
    transition: all 140ms ease;
}

.doc-editor__tool-btn:hover,
.doc-editor__select:hover,
.doc-editor__color-control:hover {
    border-color: #bcc4d8;
    background: #f7f8fc;
}

.doc-editor__tool-btn--wide {
    min-width: 90px;
}

.doc-editor__tool-btn--active {
    border-color: #ff8a1f;
    background: #fff1e5;
    color: #ff7d12;
}

.doc-editor__select {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 10px;
    cursor: pointer;
    transition: all 140ms ease;
}

.doc-editor__select-native {
    appearance: none;
    padding-right: 28px;
    background: linear-gradient(45deg, transparent 50%, #7f88a0 50%),
        linear-gradient(135deg, #7f88a0 50%, transparent 50%),
        linear-gradient(to right, #fff, #fff);
    background-position: calc(100% - 14px) 11px,
        calc(100% - 9px) 11px,
        0 0;
    background-size: 5px 5px, 5px 5px, 100% 100%;
    background-repeat: no-repeat;
}

.doc-editor__color-control {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    cursor: pointer;
    transition: all 140ms ease;
}

.doc-editor__color-label {
    font-size: var(--doc-editor-control-font-size);
    white-space: nowrap;
}

.doc-editor__color-control input[type='color'] {
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
}

.doc-editor__switches {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.doc-editor__switch {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #42506d;
    font-size: var(--doc-editor-control-font-size);
    line-height: 1.2;
}

.doc-editor__switch input {
    width: 16px;
    height: 16px;
    margin: 0;
    padding: 0;
}

.doc-editor__hint {
    margin-top: 12px;
    padding: 8px;
    border-radius: 6px;
    background: #f8f9fc;
    color: #667085;
    font-size: var(--doc-editor-control-font-size);
    line-height: 1.25;
}

.doc-editor__status-chip {
    display: inline-flex;
    height: 30px;
    align-items: center;
    padding: 0 10px;
    border-radius: 999px;
    background: #f3f5fa;
    color: #4c5873;
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
}

.doc-editor__layout {
    display: flex;
    justify-content: center;
}

.doc-editor__workspace {
    display: flex;
    width: 100%;
    max-width: 900px;
    min-height: 1240px;
    justify-content: center;
    padding: 20px;
    border: 1px solid #e4e6ef;
    border-radius: 14px;
    background: #f4f5f9;
}

.doc-editor__page {
    display: flex;
    width: 794px;
    min-height: 1123px;
    flex-direction: column;
    padding: 48px 56px;
    border: 1px solid #e9ebf2;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(43, 51, 69, 0.08);
}


/* Файл full_document_editor_review.css */

.doc-editor__review-toolbar {
    display: grid;
    width: max-content;
    min-width: 100%;
    height: 100%;
    grid-template-columns: auto auto minmax(max-content, 1fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 4px 10px;
    align-items: center;
}

.doc-editor__review-toolbar-modes,
.doc-editor__review-toolbar-history,
.doc-editor__review-toolbar-main,
.doc-editor__review-toolbar-side {
    display: flex;
    min-width: 0;
    gap: 6px;
}

.doc-editor__review-toolbar-modes {
    min-width: 280px;
    grid-column: 1;
    grid-row: 1 / span 2;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding-right: 10px;
    border-right: 1px solid var(--border);
}

.doc-editor__review-toolbar-history {
    height: 100%;
    grid-column: 2;
    grid-row: 1 / span 2;
    align-items: stretch;
}

.doc-editor__review-toolbar-history .doc-editor__group {
    height: 100%;
    align-items: flex-start;
}

.doc-editor__review-clear-stack {
    display: flex;
    min-width: 145px;
    flex-direction: column;
    gap: 4px;
}

.doc-editor__review-clear-stack .doc-editor__tool-btn {
    width: 100%;
}

.doc-editor__review-toolbar-main {
    grid-column: 3;
    grid-row: 1;
    align-items: center;
}

.doc-editor__review-toolbar-side {
    grid-column: 3;
    grid-row: 2;
    align-items: center;
    justify-content: flex-end;
    padding-left: 10px;
    border-left: 1px solid var(--border);
}

.doc-editor__review-toolbar-side .doc-editor__group {
    border-right: 0;
}

.doc-editor__indent-group,
.doc-editor__paragraph-spacing-group {
    min-width: max-content;
}

.doc-editor__indent-control {
    display: inline-flex;
    min-height: var(--doc-editor-control-height);
    align-items: center;
    gap: 6px;
    color: var(--text-2);
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
    white-space: nowrap;
}

.doc-editor__indent-control input {
    width: 64px;
    min-height: var(--doc-editor-control-height);
    box-sizing: border-box;
    padding: 0 7px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
}

.doc-editor__indent-control input:focus,
.doc-editor__mini-field input:focus {
    outline: none;
    border-color: var(--accent);
    background: #fff;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 15%, transparent);
}

.doc-editor__mini-field {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 8px;
}

.doc-editor__mini-field span,
.doc-editor__mini-field small {
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
    white-space: nowrap;
}

.doc-editor__mini-field small {
    color: #7c879d;
}

.doc-editor__mini-field input {
    width: 56px;
    min-height: 22px;
    padding: 0 6px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: #f7f8fc;
    color: #27324a;
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
    line-height: 1;
    box-sizing: border-box;
}

/* Файл full_document_editor_base.css */

/* Файл full_document_editor_toolbar.css */

.doc-editor__page-meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}

.doc-editor__meta-label {
    font-size: 11px;
    line-height: 1.4;
    color: #8c95aa;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.doc-editor__meta-value {
    margin-top: 4px;
    font-size: 15px;
    color: #27324a;
    font-weight: 700;
}

.doc-editor__status {
    padding: 6px 12px;
    border-radius: 999px;
    background: #fff1e5;
    color: #ff7d12;
    font-size: 12px;
    font-weight: 700;
}

.doc-editor__page-title {
    font-size: 22px;
    line-height: 1.35;
    font-weight: 700;
    color: #1f2b44;
    text-align: center;
    margin-bottom: 8px;
}

.doc-editor__page-subtitle {
    font-size: 13px;
    color: #7c879d;
    text-align: center;
    margin-bottom: 28px;
}

/* HEADER & FOOTER */

.doc-editor__header,
.doc-editor__footer-line {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
    font-size: 12px;
    color: #6b7280;
}

.doc-editor__header {
    padding-bottom: 14px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e7eaf1;
}

.doc-editor__footer-line {
    padding-top: 14px;
    margin-top: 22px;
    border-top: 1px solid #e7eaf1;
}

.doc-editor__header > div:nth-child(2),
.doc-editor__footer-line > div:nth-child(2) {
    text-align: center;
}

.doc-editor__header > div:nth-child(3),
.doc-editor__footer-line > div:nth-child(3) {
    text-align: right;
}

.doc-editor__header > div,
.doc-editor__footer-line > div {
    cursor: text;
    padding: 4px;
    border-radius: 2px;
    transition: background 0.15s ease;
}

.doc-editor__header > div:hover,
.doc-editor__footer-line > div:hover {
    background: rgba(123, 97, 214, 0.05);
}

.doc-editor__header--editing,
.doc-editor__footer-line--editing {
    outline: 2px solid #7b61d6;
    outline-offset: -2px;
    border-radius: 4px;
}

.doc-editor__hf-cell--active {
    outline: 2px solid #7b61d6;
    outline-offset: 2px;
    border-radius: 2px;
}

/* EDITABLE AREA */

.doc-editor__editable {
    flex: 1;
    min-height: 820px;
    outline: none;
    border: 1px dashed #d9ddea;
    border-radius: 8px;
    padding: 16px 18px;
    background: #fff;
    font-family: var(--doc-editor-default-font, 'Times New Roman'), serif;
    font-size: var(--doc-editor-default-font-size, 16px);
    color: #232a36;
    line-height: 1.5;
}

.doc-editor__editable:focus {
    border-color: #7b61d6;
    box-shadow: 0 0 0 3px rgba(123, 97, 214, 0.08);
}

.doc-editor__editable p {
    margin: 0 0 12px;
    text-align: justify;
}

.doc-editor__editable ul,
.doc-editor__editable ol {
    margin: 0 0 12px 22px;
}

.doc-editor__editable table {
    width: 100%;
    margin: 12px 0;
}

.doc-editor__editable img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 12px 0;
}

.doc-editor__editable a {
    color: #7b61d6;
    text-decoration: underline;
}

.doc-editor__editable h1 {
    font-size: 32px;
    line-height: 1.2;
    margin: 18px 0 12px;
}

.doc-editor__editable h2 {
    font-size: 28px;
    line-height: 1.25;
    margin: 16px 0 10px;
}

.doc-editor__editable h3 {
    font-size: 24px;
    line-height: 1.3;
    margin: 16px 0 10px;
}

.doc-editor__editable h4 {
    font-size: 20px;
    line-height: 1.35;
    margin: 14px 0 8px;
}

.doc-editor__editable h5 {
    font-size: 17px;
    line-height: 1.4;
    margin: 14px 0 8px;
}

.doc-editor__editable h6 {
    font-size: 15px;
    line-height: 1.4;
    margin: 14px 0 8px;
}

.doc-editor__editable blockquote {
    border-left: 3px solid #7b61d6;
    padding-left: 16px;
    margin: 12px 0;
    color: #5a647c;
    font-style: italic;
}

.doc-editor__editable hr {
    border: none;
    border-top: 2px solid #e4e6ef;
    margin: 20px 0;
}

.doc-editor__inline-blockquote {
    border-left: 3px solid #7b61d6;
    padding-left: 16px;
    margin: 12px 0;
    color: #5a647c;
    font-style: italic;
}

.doc-editor__page-break {
    border-top: 2px dashed #c9d2e3;
    margin: 18px 0;
    height: 0;
    page-break-after: always;
    break-after: page;
}

/* FOOTER */

.doc-editor__footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 2px;
}

/* MODAL */

.doc-editor__modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(27, 32, 45, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    backdrop-filter: blur(4px);
}

.doc-editor__modal {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(27, 32, 45, 0.25);
    width: min(480px, 94vw);
    max-height: 90vh;
    overflow: auto;
}

.doc-editor__modal-header {
    padding: 20px 24px;
    border-bottom: 1px solid #e4e6ef;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Файл full_document_editor_page.css */

.doc-editor__modal-header h3 {
    font-size: 18px;
    font-weight: 700;
    color: #1f2b44;
    margin: 0;
}

.doc-editor__modal-close {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: #f4f5f9;
    color: #5a647c;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    transition: all 140ms ease;
}

.doc-editor__modal-close:hover {
    background: #e9ebf2;
    color: #1f2b44;
}

.doc-editor__modal-body {
    padding: 24px;
}

.doc-editor__margin-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.doc-editor__margin-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.doc-editor__margin-field label {
    font-size: 13px;
    font-weight: 600;
    color: #5a647c;
}

.doc-editor__margin-field input {
    height: 42px;
    border: 1px solid #dce1ec;
    border-radius: 10px;
    padding: 0 14px;
    font-size: 15px;
    color: #27324a;
    transition: all 140ms ease;
}

.doc-editor__margin-field input:focus {
    outline: none;
    border-color: #7b61d6;
    box-shadow: 0 0 0 3px rgba(123, 97, 214, 0.08);
}

.doc-editor__modal-footer {
    padding: 16px 24px;
    border-top: 1px solid #e4e6ef;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.doc-editor__modal-btn {
    height: 42px;
    padding: 0 20px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: all 140ms ease;
    border: none;
}

.doc-editor__modal-btn--cancel {
    background: #f4f5f9;
    color: #5a647c;
}

.doc-editor__modal-btn--cancel:hover {
    background: #e9ebf2;
    color: #27324a;
}

.doc-editor__modal-btn--primary {
    background: #7b61d6;
    color: #fff;
}

.doc-editor__modal-btn--primary:hover {
    background: #6a4fc4;
}

@media (max-width: 760px) {
    .doc-editor__header,
    .doc-editor__footer-line {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .doc-editor__header > div,
    .doc-editor__footer-line > div {
        text-align: left !important;
    }
}

/* Режим повторного использования редактора и просмотр исходных файлов. */

.doc-editor__view-switch {
    display: flex;
    gap: 6px;
    padding: 8px;
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
}

.doc-editor__view-switch-btn {
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.doc-editor__view-switch-btn--active {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.doc-editor--content-mode .doc-editor__page {
    width: min(100%, 980px);
    min-height: 420px;
}

.doc-editor--content-mode .doc-editor__page--content {
    padding-top: 42px !important;
    padding-bottom: 42px !important;
}

.doc-editor__editable:empty::before,
.doc-editor__editable:has(> p:only-child > br:only-child)::before {
    color: var(--text-2);
    content: attr(data-placeholder);
    pointer-events: none;
}

/* Масштабирование, прокрутка и рецензирование документа. */

.doc-editor__layout {
    min-height: 0;
    overflow: hidden;
}

.doc-editor__viewport {
    width: 100%;
    max-height: min(68vh, 850px);
    overflow: auto;
    background: transparent;
    border: 1px solid var(--border);
}

.doc-editor__zoom-stage {
    position: relative;
    margin: 0 auto;
}

.doc-editor__page {
    box-sizing: border-box;
    width: 794px;
    min-height: 1123px;
    border: 1px solid #dfe3ea;
    border-radius: 0;
    box-shadow: none;
}

.doc-editor__workspace {
    max-width: none;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.doc-editor--content-mode .doc-editor__page,
.doc-editor--content-mode .doc-editor__page--content {
    width: 794px;
}

.doc-editor__bottom-panel {
    height: 26px;
    min-height: 26px;
    max-height: 26px;
    display: flex;
    flex: 0 0 26px;
    align-items: center;
    justify-content: flex-end;
    padding: 1px 6px;
    border: 1px solid var(--border);
    border-top: 0;
    background: var(--bg-1);
}

.doc-editor__zoom-control {
    display: flex;
    align-items: center;
    gap: 5px;
}

.doc-editor__zoom-control button {
    width: 22px;
    height: 22px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
}

.doc-editor__zoom-control input {
    width: 110px;
    height: 14px;
}

.doc-editor__zoom-control span {
    min-width: 40px;
    text-align: center;
    font-size: var(--font_size_0);
}

.doc-editor__review-insert {
    background: rgba(63, 160, 90, 0.16);
    color: inherit;
    text-decoration: underline;
    text-decoration-color: #2f9a54;
    text-underline-offset: 3px;
}

.doc-editor__review-delete {
    background: rgba(214, 72, 72, 0.13);
    color: #b53636;
    text-decoration: line-through;
}

.doc-editor__page--hide-review .doc-editor__review-insert {
    background: transparent;
    text-decoration: none;
}

/* Файл full_document_editor_review.css */

.doc-editor__page--hide-review .doc-editor__review-delete {
    display: none;
}

.doc-editor__editable td {
    min-width: 40px;
}

@media (max-width: 850px) {
    .doc-editor__viewport {
        max-height: 65vh;
    }
}

.doc-editor__layout,
.doc-editor__zoom-stage {
    background: transparent;
}

/* Подпись автора исправления при наведении. */

.doc-editor__review-insert,
.doc-editor__review-delete {
    position: relative;
}

.doc-editor__review-insert:hover::after,
.doc-editor__review-delete:hover::after {
    position: absolute;
    left: 0;
    bottom: calc(100% + 4px);
    z-index: 15;
    min-width: max-content;
    max-width: 260px;
    padding: 4px 7px;
    border: 1px solid var(--border);
    border-radius: 5px;
    background: var(--bg-1);
    box-shadow: 0 3px 10px rgba(31, 43, 68, 0.16);
    color: var(--text-1);
    content: attr(data-review-user);
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}

/* Разметка страниц и компактная панель масштаба. */

.doc-editor__viewport {
    background: var(--bg-2);
    padding: 12px;
    box-sizing: border-box;
}

.doc-editor__page-stack {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.doc-editor__page {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    overflow: hidden;
    box-sizing: border-box;
    background: var(--bg-1);
}

.doc-editor__editable {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.doc-editor__bottom-panel {
    width: 100%;
    height: 23px;
    min-height: 23px;
    max-height: 23px;
    flex-basis: 23px;
    box-sizing: border-box;
    justify-content: flex-end;
    padding: 0 5px;
    background: var(--bg-1);
}

.doc-editor__zoom-control {
    height: 21px;
    gap: 4px;
}

.doc-editor__zoom-control button {
    width: 19px;
    height: 19px;
    min-width: 19px;
    min-height: 19px;
    padding: 0;
    border-radius: 5px;
    font-size: 13px;
}

.doc-editor__zoom-control input {
    width: 92px;
    height: 12px;
    margin: 0;
}

.doc-editor__zoom-control span {
    min-width: 38px;
    font-size: 12px;
}

.doc-editor__layout-field {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #44506b;
    font-size: var(--doc-editor-control-font-size, 12px);
    font-weight: 600;
}

.doc-editor__layout-field > span {
    white-space: nowrap;
}

@media (max-width: 850px) {
    .doc-editor__viewport {
        padding: 8px;
    }
}

/* Ссылки, сноски и дополнительные инструменты Word. */
.doc-editor__editable a {
    color: var(--accent-blue);
    text-decoration: underline;
    cursor: pointer;
}

.doc-editor__note-ref {
    margin-left: 1px;
    font-size: 0.72em;
    line-height: 1;
    vertical-align: super;
}

.doc-editor__note-ref a,
.doc-editor__note-backlink {
    text-decoration: none;
}

.doc-editor__notes {
    margin-top: 18px;
    padding-top: 4px;
    font-size: 0.82em;
    line-height: 1.35;
}

.doc-editor__notes hr {
    width: 34%;
    margin: 0 0 6px;
    border: 0;
    border-top: 1px solid var(--border);
}

.doc-editor__notes-title {
    margin-bottom: 4px;
    color: var(--text-2);
    font-weight: 600;
}

.doc-editor__notes ol {
    margin: 0;
    padding-left: 24px;
}

.doc-editor__notes li {
    margin-bottom: 3px;
}

.doc-editor__bookmark {
    border-bottom: 1px dotted var(--accent);
}

.doc-editor__bookmark--marker {
    display: inline-block;
    min-width: 16px;
    color: var(--accent);
    user-select: none;
}

.doc-editor__cross-reference {
    border-bottom: 1px dashed currentColor;
}

.doc-editor__comment {
    padding: 0 2px;
    border-bottom: 2px solid #f59e0b;
    background: rgba(245, 158, 11, 0.16);
    cursor: help;
}

.doc-editor__page--show-marks .doc-editor__editable p::after,
.doc-editor__page--show-marks .doc-editor__editable li::after,
.doc-editor__page--show-marks .doc-editor__editable h1::after,
.doc-editor__page--show-marks .doc-editor__editable h2::after,
.doc-editor__page--show-marks .doc-editor__editable h3::after,
.doc-editor__page--show-marks .doc-editor__editable h4::after,
.doc-editor__page--show-marks .doc-editor__editable h5::after,
.doc-editor__page--show-marks .doc-editor__editable h6::after {
    content: ' ¶';
    color: var(--accent);
    font-weight: 400;
    opacity: 0.58;
}

.doc-editor__modal--wide {
    width: min(620px, calc(100vw - 32px));
}

.doc-editor__find-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

.doc-editor__find-grid label {
    display: grid;
    gap: 5px;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.doc-editor__find-grid input {
    width: 100%;
    min-height: 34px;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0 10px;
    color: var(--blue-navy);
    font: inherit;
}

.doc-editor__find-grid input:focus {
    border-color: var(--accent);
    outline: none;
}

.doc-editor__statistics {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto;
    gap: 8px 16px;
    align-items: center;
}

/* Файл full_document_editor_modals.css */

.doc-editor__statistics span {
    color: var(--text-2);
}

.doc-editor__statistics strong {
    color: var(--blue-navy);
    text-align: right;
}

@media (max-width: 620px) {
    .doc-editor__find-grid {
        grid-template-columns: 1fr;
    }
}

/* Компактное соединение панели инструментов, рабочей области и масштаба. */
.doc-editor {
    gap: 0;
    padding: 0;
}

.doc-editor__topbar {
    margin: 0;
    border-radius: 12px 12px 0 0;
}

.doc-editor__layout {
    gap: 0;
    align-items: stretch;
    margin: 0;
}

.doc-editor__viewport {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    border-top: 0;
}

.doc-editor__bottom-panel {
    margin: 0;
    border-radius: 0 0 8px 8px;
}

.doc-editor__footer {
    margin-top: 10px;
}

/* Текст кнопок редактора всегда виден, а не только при наведении. */
.doc-editor .doc-editor__tool-btn {
    color: #44506b !important;
    -webkit-text-fill-color: #44506b;
    opacity: 1;
}

.doc-editor .doc-editor__tool-btn--active {
    color: #ff7d12 !important;
    -webkit-text-fill-color: #ff7d12;
}

.doc-editor .doc-editor__tab {
    color: #5d6785 !important;
    -webkit-text-fill-color: #5d6785;
}

.doc-editor .doc-editor__tab--active {
    color: #1f2b44 !important;
    -webkit-text-fill-color: #1f2b44;
}

.doc-editor__footer .btn-secondary {
    color: var(--text-2) !important;
    -webkit-text-fill-color: var(--text-2);
}

.doc-editor__footer .btn-primary {
    color: var(--bg-1) !important;
    -webkit-text-fill-color: var(--bg-1);
}

.doc-editor__reviewer-chip {
    width: 100%;
    flex: 1 0 100%;
    justify-content: flex-start;
    box-sizing: border-box;
    margin-top: 4px;
}

/* Боковая панель рецензирования. */
.doc-editor__layout--with-review {
    justify-content: stretch;
}

.doc-editor__review-panel {
    display: flex;
    width: 238px;
    min-width: 238px;
    max-height: min(68vh, 850px);
    flex: 0 0 238px;
    flex-direction: column;
    gap: 8px;
    overflow: auto;
    padding: 10px;
    border: 1px solid var(--border);
    border-top: 0;
    border-left: 0;
    background: var(--bg-1);
}

.doc-editor__review-panel-title {
    color: var(--blue-navy);
    font-size: var(--font_size_1);
    font-weight: 700;
}

.doc-editor__review-panel-current {
    display: grid;
    gap: 3px;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-2);
}

.doc-editor__review-panel-current span,
.doc-editor__reviewer-item span {
    color: var(--text-3);
    font-size: 11px;
}

.doc-editor__review-panel-current strong,
.doc-editor__reviewer-item strong {
    overflow-wrap: anywhere;
    color: var(--blue-navy);
    font-size: var(--font_size_0);
}

.doc-editor__review-panel-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.doc-editor__reviewer-item {
    display: grid;
    gap: 4px;
    width: 100%;
    min-height: 48px;
    box-sizing: border-box;
    padding: 7px 8px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--blue-navy) !important;
    -webkit-text-fill-color: var(--blue-navy);
    text-align: left;
    cursor: pointer;
}

.doc-editor__reviewer-item:hover,
.doc-editor__reviewer-item--active {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 10%, var(--bg-1));
}

.doc-editor__review-panel-empty {
    padding: 10px 4px;
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.doc-editor__review-change--selected {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
    background: color-mix(in srgb, var(--accent) 20%, transparent) !important;
}

@media (max-width: 980px) {
    .doc-editor__review-panel {
        width: 210px;
        min-width: 210px;
        flex-basis: 210px;
    }
}

/* Файл full_document_editor_formulas.css */

.doc-editor__formula-group {
    display: grid;
    min-width: 0;
    flex: 1 1 auto;
    grid-template-columns: minmax(180px, 0.8fr) minmax(300px, 1.5fr) max-content;
    grid-row: auto;
    align-self: stretch;
    align-items: end;
    gap: 8px;
    padding: 4px 8px 5px 0;
}

.doc-editor__formula-group label {
    display: grid;
    min-width: 0;
    align-content: end;
    gap: 4px;
    color: var(--text-1);
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
    line-height: 1.15;
}

.doc-editor__formula-group select,
.doc-editor__formula-group input {
    width: 100%;
    min-width: 0;
    min-height: 36px;
    box-sizing: border-box;
    padding: 5px 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.doc-editor__formula-group select:focus,
.doc-editor__formula-group input:focus {
    border-color: var(--accent);
    outline: none;
}

.doc-editor__formula-input {
    min-width: 0;
}

.doc-editor__formula-actions {
    display: flex;
    align-items: flex-end;
    gap: 5px;
}

.doc-editor__formula-actions .doc-editor__tool-btn {
    min-height: 36px;
    padding-inline: 10px;
    white-space: nowrap;
}

.doc-editor__formula-help {
    display: grid;
    min-width: 180px;
    max-width: 230px;
    flex: 0 1 230px;
    grid-row: auto;
    align-self: stretch;
    align-content: center;
    gap: 4px;
    padding-left: 10px;
    overflow: hidden;
}

.doc-editor__formula-help strong,
.doc-editor__formula-help span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.doc-editor__formula-help span {
    color: var(--text-3);
}

.doc-editor__formula-error {
    color: var(--accent-red) !important;
}

.doc-editor__formula-field {
    display: inline-block;
    padding: 0 4px;
    border-bottom: 1px dotted currentColor;
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    cursor: help;
}

.doc-editor__formula-field--error {
    color: var(--accent-red);
    background: color-mix(in srgb, var(--accent-red) 8%, transparent);
}

/* Файл full_document_editor_find_replace.css */

.doc-editor-find-replace-panel__content {
    display: grid;
    gap: var(--font_size_0);
}

.doc-editor-find-replace-panel__fields {
    display: grid;
    gap: var(--font_size_0);
}

.doc-editor-find-replace-panel__fields label {
    display: grid;
    gap: var(--font_size__0);
    color: var(--text-2);
    font-weight: 600;
}

.doc-editor-find-replace-panel__fields input {
    width: 100%;
    min-height: 38px;
    padding: 0 var(--font_size_0);
}

.doc-editor-find-replace-panel__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--font_size__0);
    padding-top: var(--font_size__0);
    border-top: 1px solid var(--border);
}

/* Файл full_document_editor_mobile.css */

.doc-editor--mobile-layout .doc-editor__tabs {
    padding-right: 2px;
}

.doc-editor--mobile-layout .doc-editor__topbar-actions {
    gap: 4px;
    padding-right: 5px;
}

.doc-editor--mobile-layout .doc-editor__save-text-btn {
    min-width: auto;
    max-width: 138px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.doc-editor--mobile-layout .doc-editor__tab-panel {
    overflow-x: auto;
}

.doc-editor--mobile-layout .doc-editor__tab-panel--formulas {
    overflow-x: auto;
}

.doc-editor--mobile-layout .doc-editor__formula-group {
    min-width: 760px;
}

.doc-editor--mobile-layout .doc-editor__formula-help {
    min-width: 190px;
}

.doc-editor--mobile-layout .doc-editor__layout--with-review {
    flex-direction: column;
}

.doc-editor--mobile-layout .doc-editor__review-panel {
    width: 100%;
    min-width: 0;
    max-height: 220px;
    flex: 0 0 auto;
    box-sizing: border-box;
    border-top: 0;
    border-left: 1px solid var(--border);
}

.doc-editor--mobile-layout .doc-editor__viewport {
    width: 100%;
    min-width: 0;
}

.doc-editor__zoom-fit-label {
    color: var(--text-3);
    font-size: var(--doc-editor-control-font-size);
    font-weight: 600;
}

/* Файл FullDocumentEditor.css */

/* Файл tab_news.css */

.news-layout {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    overflow: hidden;
}

.news-type-filter {
    display: flex;
    width: auto;
    min-height: 0;
    align-self: stretch;
    flex-direction: column;
    gap: var(--font_size__0);
}


.news-type-filter.block_1 {
    margin-top: var(--font_size__0);
    margin-right: var(--font_size__0);
    margin-bottom: var(--font_size__0);
    padding: var(--font_size__0) var(--font_size_0);
}

.news-type-filter__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.news-type-filter__header button {
    margin: 0;
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-1);
    color: var(--accent-dark);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.news-type-filter__list {
    display: grid;
    grid-template-columns: repeat(
        auto-fit,
        minmax(180px, 1fr)
    );
    gap: 7px 12px;
}

.news-type-filter__list label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    cursor: pointer;
}

.news-type-filter__list input {
    flex: 0 0 auto;
    margin-top: 3px;
}

.news-type-filter__empty {
    color: var(--text-2);
}

.news-list-area {
    display: flex;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
}

.news-list-area > .content-toolbar {
    flex: 0 0 auto;
}

.news-list-area__scroll {
    display: block;
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto;
    padding-right: 4px;
}

@media (max-width: 820px) {
    .news-layout {
        overflow: auto;
    }

    .news-list-area {
        overflow: visible;
    }

    .news-list-area__scroll {
        overflow: visible;
    }

    .news-type-filter__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Файл app_styling.css */

/* app_styling.css */

/* Стиль: Modern Minimal (мягкая версия) — синий */
.container {
    background: linear-gradient(
        180deg, var(--bg-2)
    );
    font-family: 
        system-ui, 
        -apple-system, 
        "Segoe UI", 
        Roboto, 
        Arial, 
        sans-serif;
}


/* Блок контента (карточки) */
.block_1 {
    background-color: var(--bg-1);
    padding-top: var(--font_size_3);
    padding-left: var(--font_size_3);
    padding-right: var(--font_size_3);
    padding-bottom: var(--font_size_3);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    margin-top: var(--font_size_10);
    margin-right: var(--font_size_3);
    margin-bottom: var(--font_size_3);
}


/* Блок информации */
.block_2 {
    display: flex;
    border-radius: 8px;
    padding: 10px;
    align-items: center;
    background: #ebf5ff;
    margin-top: var(--font_size_10);
    margin-right: var(--font_size_3);
    margin-bottom: var(--font_size_3);
    border: 2px solid #a5c0df;
}

.block_2 img {
    height: 28px;
    width: 28px;
}

.block_2__info-icon {
    display: block;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    margin-right: 8px;
    object-fit: contain;
}


/* Блок предупреждения */
.block_3 {
    display: flex;
    align-items: flex-start;
    gap: var(--font_size__0);
    background: var(--accent-orange-bg);
    border: solid var(--accent-yellow-border);
    border-radius: 12px;
    padding: var(--font_size_0);
    margin-top: var(--font_size_0);
    margin-right: var(--font_size_0);
    margin-bottom: var(--font_size_0);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}

.block_3__icon {
    flex-shrink: 0;
    width: 45px;
    height: 45px;
}

.block_3__title {
    font-size: var(--font_size_2);
    font-weight: 700;
    color: #8a5600;
    margin-bottom: 6px;
    line-height: 1.3;
}

.block_3__description {
    font-size: var(--font_size_1);
    color: #6f5a2a;
    line-height: 1.45;
}

.block_3--warning {
    background: var(--accent-orange-bg);
    border-color: #f0a500;
}

.block_3--success {
    background: #edfaf3;
    border-color: #82d9a8;
}

.block_3--success .block_3__title {
    color: #1a5c38;
}

.block_3--success .block_3__description {
    color: #2d6b4a;
}


/* === Кнопка === */
button {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: var(--font_size_button) !important;
    font-weight: 400 !important;
    padding: 5px 12px;
    background-color: #2f75b5; /* основной цвет */
    color: #ffff; /* цвет текста */
    border: none;
    border-radius: 8px; /* скругление углов */
    cursor: pointer;
    transition: background-color 0.2s, transform 0.2s, box-shadow 0.2s;
    border-radius: 10px;
}

button:hover {
    background-color: #1e5a8a; /* Темнее при наведении */
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}


/* Inputs */
input {
    padding: 8px;
    margin-top: 5px;
    margin-bottom: 15px;
    font-size: var(--font_size_1);
    border: 1px solid #ccc;
    border-radius: 8px;
}

input:focus {
    border-color: var(--blue-navy);
    box-shadow: 0 0 5px rgba(142, 175, 235, 0.3);
    outline: none;
}

.input_text {
    font-size: var(--font_size_0);
    background: transparent;
    border: none
}

.input-error {
    border: 2px solid red;
}


/* Labels */
.label_info {
    font-size: var(--font_size_0)
}

.label_info_1 {
    color: #6b7280;
    font-size: var(--font_size_1)
}

Label {
    font-size: var(--font_size_2)
}

.label_info_3 {
    font-size: var(--font_size_10)
}

.text {
    flex: 1;
    color: var(--text-1);
}
/* Профиль сотрудника в ЛК для общедомовых показаний. */
.lk-employee-profile {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 8px 0;
    padding: 8px;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
}

.lk-employee-profile span {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

/* Файл tab_app_settings.css */

legend {
    margin-top: 10px;
    margin-bottom: 15px;
    color: var(--blue-navy);
    font-size: var(--font_size_2);
    font-weight: 600;
}

input[type="text_tab_app_settings"] {
    width: 100%;
}


.lk-settings-password {
    width: 100%;
}

input[type="checkbox"] {
    margin-right: 10px;
}

.lk-profile-contact-grid {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: var(--font_size_0);
    align-items: start;
    margin-bottom: var(--font_size_0);
}

.lk-profile-contact-grid__identity {
    display: grid;
    grid-template-columns: minmax(130px, 0.34fr) minmax(180px, 1fr);
    gap: var(--font_size__0) var(--font_size_0);
    align-items: center;
    min-width: 0;
}

.lk-profile-contact-grid__identity input {
    width: 100%;
    box-sizing: border-box;
}

.lk-profile-photo-field {
    display: flex;
    flex-direction: column;
    width: 92px;
    min-width: 92px;
    gap: 4px;
}

.lk-profile-photo-field__preview {
    display: flex;
    width: 92px;
    height: 112px;
    min-height: 112px;
    max-height: 112px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    padding: 0;
    background: var(--bg-2);
    cursor: pointer;
    box-shadow: none;
}

.lk-profile-photo-field__preview:hover {
    border-color: var(--accent);
    background: var(--bg-2);
    transform: none;
    box-shadow: none;
}

.lk-profile-photo-field__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.lk-profile-photo-field__placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 6px;
    color: var(--text-3);
    font-size: calc(var(--font_size_0) * 0.48);
    text-align: center;
}

.lk-profile-photo-field__placeholder-icon {
    font-size: calc(var(--font_size_2) * 1.15);
}

.lk-profile-photo-field__input {
    display: none;
}

.lk-profile-photo-field__hint {
    color: var(--text-3);
    font-size: calc(var(--font_size_0) * 0.38);
    line-height: 1.2;
    text-align: center;
}

.egrn_attachments_wrap {
    margin-top: var(--font_size_1);
    margin-bottom: var(--font_size_1);
}

.egrn_attachments_title {
    margin-bottom: var(--font_size__0);
    color: var(--text-2);
    font-size: var(--font_size_1);
    font-weight: 600;
}

.doc-card__file-delete {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    border: 0;
    padding: 8px;
    background: transparent;
    color: var(--text-3);
    cursor: pointer;
}

.doc-card__file-delete:hover {
    color: var(--color_3);
}

@media (max-width: 700px) {
    .lk-profile-contact-grid {
        grid-template-columns: 82px minmax(0, 1fr);
    }

    .lk-profile-contact-grid__identity {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .lk-profile-photo-field,
    .lk-profile-photo-field__preview {
        width: 82px;
        min-width: 82px;
    }

    .lk-profile-photo-field__preview {
        height: 104px;
        min-height: 104px;
        max-height: 104px;
    }
}

/* Файл top_panel.css */

/* ===== Верхняя панель ===== */
.top-panel {
    background: var(--accent);
    color: var(--bg-1);
    padding-top: 12px;
    padding-left: var(--font_size_3);
    padding-bottom: 8px;
    margin: 0px 0px 0px -18px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding-right: var(--font_size_3);
}

.top-panel__title {
    font-size: var(--font_size_1);
    font-weight: 700;
    color: var(--bg-1);
}

.top-panel__subtitle {
    font-weight: 400;
    font-size: var(--font_size_0);
    color: 1px solid rgba(255, 255, 255, 0.3);
}


/* ===== Переключатель периодов ===== */
.top-panel__row {
    display: flex;
    padding-top: 12px;
    align-items: center;
    gap: 5px;
    padding-right: 18px;
}

.top-panel__row .prev,
.top-panel__row .next {
    background: transparent;
    color: var(--bg-1);
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 6px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: var(--font_size_0);
    cursor: pointer;
    transition: background 0.2s;
}

.top-panel__row .prev:hover,
.top-panel__row .next:hover {
    background: rgba(196, 178, 178, 0.15);
}

.top-panel__row .input_text {
    color: var(--bg-1);
    background: transparent;
    border: none;
    text-align: center;
    font-size: var(--font_size_0);
    max-width: 120px;
    padding: 0px;
    margin: 0px;
}


/* ===== Скачать мобильную версию ===== */
.top-panel__title {
    max-width: calc(100% - 230px);
    padding-right: 8px;
}

.btn-download-mobile {
    position: absolute;
    z-index: 2;
    top: 12px;
    right: var(--font_size_3);
    margin: 0;
    padding: 4px 10px;
    background: none;
    border: 1px solid #f7f8f8;
    border-radius: var(--font_size_2);
    color: var(--bg-1);
    font-size: 0.85rem;
    line-height: 1.15;
    white-space: nowrap;
}

/* Даже при узкой области страницы кнопка 
    остаётся в верхней строке справа от 
    названия квартиры, а не переносится 
    к выбору периода. */
@media (max-width: 539px) {
    .top-panel__title {
        max-width: calc(100% - 180px);
    }

    .top-panel__row {
        flex-wrap: wrap;
        padding-right: 0;
    }

    .btn-download-mobile {
        top: 10px;
        right: var(--font_size_3);
        max-width: 168px;
        padding: 3px 7px;
        font-size: 0.72rem;
    }
}

@media (max-width: 360px) {
    .top-panel__title {
        max-width: calc(100% - 154px);
    }

    .btn-download-mobile {
        max-width: 145px;
        font-size: 0.64rem;
    }
}

/* Файл service_fields.css */

/* ===== Карточка услуги ===== */
.service-card__header {
    background: #edf2f7;
    padding: 12px;
    margin: 0;
    border-bottom: 1px solid #e2e8f0;
    font-size: var(--font_size_0);
    color: var(--blue-navy);
}

.service-card__body {
    padding-top: 10px;
}

.service-card__detail {
    margin-top: 4px;
}


/* ===== Поле ввода с иконкой ===== */
.input-with-icon {
    position: relative;
    display: inline-block;
}

.input-with-icon
input.blocked-input[name= "var_14"] {
    max-width: 330px;
    background: linear-gradient(
        to right,
        transparent calc(100% - 40px),
        #f0f3f8 calc(100% - 40px),
        #f0f3f8 100%
    );
}

.input-icon {
    position: absolute;
    right: 12px;
    top: 55%;
    transform: translateY(-75%);
}


/* Капельки у услуг */
.service-card__header[data-service= "Холодная вода"]::before,
.service-card__header[data-service= "Горячая вода"]::before {
    content: "💧";
    display: inline-flex;   
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    font-size: var(--font_size_0);
    flex-shrink: 0;
}

.service-card__header[data-service= "Холодная вода"]::before {
    background: #dbeafe;
}

.service-card__header[data-service= "Горячая вода"]::before {
    background: #fee2e2;
    filter: hue-rotate(120deg);
}


/* ===== Скрытие элементы ===== */
.hidden {
    display: none !important;
}

#label_only_viewing {
    font-style: italic;
}


/* === Комментарий === */
#var_15 {
    width: 98%;
    height: 120px;
    padding: 12px;
    box-sizing: border-box;
    border-radius: 12px;
    border: 1px solid #d1d9e6;
    resize: vertical;
}

/* Файл table_history.css */

/* ===== Таблица ===== */
#Таблица_показания_счётчиков table {
    width: 98%;
    border-collapse: collapse;
    border-radius: var(--font_size_3);
    overflow: hidden;
}

#Таблица_показания_счётчиков table th, 
#Таблица_показания_счётчиков table td {
    border: 1px solid var(--text-1);
    text-align: center;
    white-space: pre-wrap;
}

#Таблица_показания_счётчиков table td:nth-child(1) {
    background-color: #9BC2E6;
    color: var(--text-1);
}

#Таблица_показания_счётчиков table td:nth-child(2) {
    background-color: #d4e6f1;
    color: var(--text-1);
}

#Таблица_показания_счётчиков table thead {
    background: linear-gradient(
        135deg, #3681c7, #a7c7e7);
    color: var(--bg-1);
}

#Таблица_показания_счётчиков table thead th {
    padding: 12px;
    font-family: 
        'Helvetica Neue',
        Helvetica,
        Arial,
        sans-serif;
    font-size: var(--font_size_0);
    border-bottom: 1px solid #f1f7fa;
}

#Таблица_показания_счётчиков table tbody td {
    padding: 12px;
    font-family: 
        'Helvetica Neue',
        Helvetica,
        Arial,
        sans-serif;
    font-size: var(--font_size_0);
    color: var(--text-1);
    border-bottom: 1px solid #f1f7fa;
    transition: background-color 0.2s;
}

/* Таблица истории на основной вкладке растёт по содержимому и не
   создаёт собственную область прокрутки. */
#Таблица_показания_счётчиков .table-widget,
#Таблица_показания_счётчиков .table-container,
#Таблица_показания_счётчиков .table-wrapper {
    height: auto;
    max-height: none;
    overflow: visible;
}

.meter-readings-drawer-loading {
    display: flex;
    min-height: 180px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    color: var(--text-2);
    text-align: center;
}

.meter-readings-drawer-spinner {
    width: 38px;
    height: 38px;
    border: 4px solid var(--border);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: meter-readings-drawer-spin .8s linear infinite;
}

@keyframes meter-readings-drawer-spin {
    to {
        transform: rotate(360deg);
    }
}

.meter-readings-history-table-wrap {
    width: 100%;
    margin-top: var(--font_size__0);
    overflow-x: auto;
}

.meter-readings-history-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font_size_0);
}

.meter-readings-history-table th,
.meter-readings-history-table td {
    padding: var(--font_size__0);
    border: 1px solid var(--border);
    text-align: left;
    white-space: nowrap;
}

.meter-readings-history-table th {
    background: var(--bg-2);
    color: var(--blue-navy);
    font-weight: 600;
}

.meter-readings-history-empty {
    margin-top: var(--font_size__0);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

/* Файл drawer_header.css */

.meter-readings-drawer-header-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: var(--font_size__0);
    color: var(--bg-1);
}

.meter-readings-drawer-header-actions > span {
    white-space: nowrap;
    font-size: var(--font_size_0);
    font-weight: 600;
}

.meter-readings-drawer-header-actions .prev,
.meter-readings-drawer-header-actions .next {
    min-width: 48px;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: var(--font_size__0);
    background: rgba(255, 255, 255, 0.1);
    color: var(--bg-1);
}

.meter-readings-drawer-header-actions .prev:disabled,
.meter-readings-drawer-header-actions .next:disabled {
    cursor: default;
    opacity: 0.45;
}

.meter-readings-drawer-header-actions .input_text {
    width: 150px;
    min-width: 120px;
    margin: 0;
    border: 0;
    background: var(--bg-1);
    color: var(--blue-navy);
    text-align: center;
}

@media (max-width: 762px) {
    .meter-readings-drawer-header-actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .meter-readings-drawer-header-actions > span {
        width: 100%;
    }
}

/* Файл tab_meter_readings.css */

/* Файл page_receipts.css */

.block_2--paid {    
    background: #dcfce7;
    border: 1px solid #86efac;
    color: #166534;
}

.block_2--unpaid {
    gap: 12px;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    color: #991b1b;
}

.block_2__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.block_2--paid .block_2__icon { 
    background: #166534; color: var(--bg-1);}
.block_2--unpaid .block_2__icon { 
    background: #991b1b; color: var(--bg-1);}


/* Ландшафт: ширина > высоты */
@media (orientation: landscape) {
    .qr-code-img {
        width: 20%;
    }
}


/* Портрет: высота > ширины */
@media (orientation: portrait) {
    .qr-code-img {
        width: 80%;
    }
}
/* Файл tab_news.css */

/* Тулбар поиска/фильтров */
.content-toolbar {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 10px;
    padding-right: 14px;
}

.search {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 18px;
    background: var(--card);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    height: 38px;
}

.search__icon { 
    color: var(--text-3);
}

.search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: var(--font_size_1);
    color: var(--text-2);
    height: 35px;
    margin-top: var(--font_size_3);
}

.btn {
    border: 1px solid var(--border);
    border-radius: 16px;
    cursor: pointer;
    font-weight: 700;
    background: var(--card);
    color: var(--text-2);
    box-shadow: var(--shadow);
}

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

.btn-ghost {
    background: rgba(255,255,255,.75);
}

.btn-primary {
    background: linear-gradient(
        180deg, #4aa2de, var(--accent));
    border-color: rgba(255,255,255,.25);
    color: rgba(255,255,255,.96);
}


/* Карточка контента */
.content-card__title {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    margin-top: 0px;
    margin-bottom: 10px;
    font-size: var(--font_size_1);
    line-height: 1.2;
    font-weight: 800;
    color: var(--text-1);
}

.content-card__actions {
    display: flex;
    gap: 8px;
}


/* Икон-кнопки */
.icon-btn {
    width: 36px;
    height: 36px;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.96);
    color: var(--accent);
    cursor: pointer;
    display: grid;
    place-items: center;
}

.icon-btn--danger {
    color: var(--accent-2);
    background: rgba(255,247,240,.9);
}

.icon-btn:hover { 
    transform: scale(1.03); 
}


/* Мета информация */
.content-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;        
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    color: var(--accent);
    background: rgba(61,132,196,.12);
    font-weight: 800;
}

.badge-important {
    color: var(--accent-2);
    background: rgba(212,112,43,.12);
}

.badge-type {
    color: #1f5fb9;
    background: rgba(100,116,139,.12);
}

.content-card__text {
    margin: 12px 0 10px;
    color: var(--text-2);
    line-height: 1.5;
    font-size: var(--font_size_0);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.content-card__more {
    border: 0;
    background: transparent;
    color: var(--accent);
    font-weight: 800;
    cursor: pointer;
    padding: 0;
}


/* Сообщение об отсутствии контента */
.no-content {
    text-align: center;
    padding: 40px;
    color: var(--text-3);
    font-size: var(--font_size_1);
}


/* Синяя иконка редактирования */
.edit-item img {
    filter: 
        invert(39%) 
        sepia(57%) 
        saturate(748%) 
        hue-rotate(183deg) 
        brightness(91%) 
        contrast(89%);
}


/* Красная иконка удаления */
.delete-item img {
    filter: 
        invert(37%) 
        sepia(91%) 
        saturate(748%) 
        hue-rotate(340deg) 
        brightness(91%) 
        contrast(89%);
}


/* Респект к снижению анимации */
@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; }
}


/* Оплаченная карточка — зелёная полоска слева */
.block_1--paid {
    border-left: 5px solid #22c55e;
}

/* Бейдж "Оплачено" */
.badge-paid {
    color: #166534;
    background: #dcfce7;
    border: 1px solid #86efac;
    font-weight: 800;
}

/* Сумма оплаты рядом с начислением */
.receipt__paid-amount {
    color: #16a34a;
}


.receipt__not-paid {
    color: #dc2626;
}


/* Частично оплаченная карточка — жёлтая полоска слева */
.block_1--partial {
    border-left: 5px solid var(--accent-yellow-border);
}

/* Бейдж "Частично оплачено" */
.badge-partial {
    color: #8a5600;
    background: rgba(240, 165, 0, 0.12);
    border: 1px solid var(--accent-yellow-border);
    font-weight: 800;
}

/* Сумма частичной оплаты рядом с начислением */
.receipt__partial-amount {
    color: var(--accent-yellow-border);
}
/* Файл page_news.css */

#var_121  /* Поле "Заголовок новости */
{
    width: 98%;
}

#var_122  /*  */
{
    font-size: var(--font_size_1);
    width: 98%;
    height: 380px;
}
/* Файл DropdownButton.css */

/* DropdownButton.css */

.dropdown-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

.dropdown-button {
    padding: 8px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #f7f7f7;
    border-radius: 4px;
    background-color: white;
    font-size: 14px;
    cursor: pointer;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    overflow: visible;
    min-width: 100%;
}

.dropdown-item {
    padding: 8px;
    cursor: pointer;
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow: visible;
    text-overflow: clip;
}

.dropdown-item:not(:last-child) {
    border-bottom: 1px solid #eee;
}

/* Класс для временного элемента измерений */
.measurement-element {
    position: absolute !important;
    visibility: hidden !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    padding: 8px !important;
    font-family: inherit !important;
    line-height: normal !important;
}

.dropdown-item-image {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex-shrink: 0;
    margin-right: 8px;
    vertical-align: middle;
}
/* Файл column_settings.css */

.column-settings-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.column-settings-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 6px;
    border-radius: 8px;
    font-size: var(--font_size_0);
    color: var(--blue-navy);
    cursor: pointer;
}

.column-settings-item:hover {
    background: var(--bg-2);
}

.column-settings-item input {
    cursor: pointer;
}

.column-settings-empty {
    padding: 6px;
    font-size: var(--font_size_0);
    color: var(--text-3);
}
/* Файл management_objects_workspace.css */

.management-workspace__toolbar {
    flex: 0 0 auto;
    box-sizing: border-box;
}

.management-workspace > .tab-widget-container > .tab-container-top {
    width: 100%;
    min-height: 0;
    box-sizing: border-box;
}

.management-workspace .tab-content-wrapper,
.management-workspace .tab-content-top,
.management-workspace .tab-content-item.active {
    min-height: 0;
}

/* Файл document_showcase.css */

.document-showcase {
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: var(--font_size__0) var(--font_size_1) var(--font_size_1);
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
    background: var(--bg-1);
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.document-showcase__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 32px;
    gap: var(--font_size__0);
    margin-bottom: 4px;
}

.document-showcase__back {
    padding: 4px var(--font_size_0);
    border: 0;
    border-radius: var(--font_size__0);
    background: transparent;
    color: var(--accent);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.document-showcase__back:hover {
    background: var(--card);
}

.document-showcase__view-switch {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.document-showcase__view-button {
    padding: 4px var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--card);
    color: var(--text-3);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.document-showcase__view-button--active {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.document-showcase__grid {
    display: grid;
    gap: var(--font_size__0);
}

.document-showcase__grid--tiles {
    grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
}

.document-showcase__grid--list {
    grid-template-columns: 1fr;
}

.document-showcase__folder {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
    min-height: 46px;
    padding: var(--font_size__0);
    border: 1px solid transparent;
    border-radius: var(--font_size_0);
    background: var(--card);
    color: var(--text-3);
    text-align: left;
    cursor: pointer;
    box-shadow: var(--shadow);
}

.document-showcase__grid--list .document-showcase__folder {
    width: 100%;
    min-height: 42px;
}

.document-showcase__folder:hover {
    border-color: var(--accent);
    background: var(--bg-1);
}

.document-showcase__folder-icon {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
}

.document-showcase__folder-title {
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: var(--font_size_0);
    font-weight: 500;
}

.document-showcase__attachments {
    padding: var(--font_size_1);
    border-radius: var(--font_size_1);
    background: var(--card);
}

.document-showcase__empty {
    padding: var(--font_size_2);
    color: var(--text-2);
    text-align: center;
}

@media (max-width: 760px) {
    .document-showcase__toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .document-showcase__view-switch {
        margin-left: 0;
    }

    .document-showcase__grid--tiles {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.document-showcase__filters {
    align-items: center;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    display: grid;
    gap: 6px;
    grid-template-columns: minmax(220px, 1fr) auto auto auto;
    margin-bottom: 8px;
    padding: 6px 8px;
}

.document-showcase__filters input,
.document-showcase__filters select {
    background: var(--bg-1);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    color: var(--text-3);
    font-size: var(--font_size_0);
    min-width: 0;
    padding: var(--font_size__0);
}

.document-showcase__filters span {
    color: var(--text-2);
    font-size: var(--font_size__0);
    white-space: nowrap;
}


.document-showcase__filters .document-showcase__count {
    min-width: max-content;
    justify-self: end;
    color: var(--text-2);
    font-size: var(--font_size_0);
    font-weight: 500;
}

.document-showcase__folder {
    contain-intrinsic-size: 46px;
    content-visibility: auto;
}

.document-showcase__load-more {
    background: var(--accent);
    border: 0;
    border-radius: var(--font_size__0);
    color: var(--bg-1);
    cursor: pointer;
    display: block;
    font-size: var(--font_size_0);
    margin: var(--font_size_1) auto 0;
    padding: var(--font_size__0) var(--font_size_2);
}

@media (max-width: 900px) {
    .document-showcase__filters {
        grid-template-columns: 1fr;
    }

    .document-showcase__filters span {
        white-space: normal;
    }
}

/* Единая навигация и структура дерева для всех разделов витрины. */
.document-showcase__navigation,
.document-showcase__inline-navigation {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
    min-width: 0;
}

.document-showcase__tree {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    box-sizing: border-box;
    width: 100%;
    min-height: 34px;
    margin-bottom: 6px;
    padding: 5px 9px;
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--card);
    color: var(--text-2);
    font-size: var(--font_size_0);
    font-weight: 600;
    line-height: 1.35;
}

.document-showcase__tree span {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    overflow-wrap: anywhere;
}

.document-showcase__tree span:not(:last-child)::after {
    content: '›';
    margin-left: 6px;
    color: var(--text-3);
    font-weight: 700;
}

.document-showcase__lake-browser {
    min-width: 0;
}

.document-showcase__inline-navigation {
    margin-bottom: var(--font_size__0);
}

@media (max-width: 760px) {
    .document-showcase__navigation {
        width: 100%;
        flex-wrap: wrap;
    }

    .document-showcase__navigation .document-showcase__back {
        flex: 1 1 auto;
        white-space: nowrap;
    }

    .document-showcase__tree {
        font-size: var(--font_size_1);
    }
}

/* Файл info_blocks.css */

.info_blocks {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
}

.info_blocks__card {
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    border-color: var(--border);
    background: var(--bg-1);
}

.info_blocks__card--clickable {
    cursor: pointer;
}

.info_blocks__card--clickable:hover {
    border-color: var(--accent);
    background: var(--bg-2);
}

.info_blocks__card--clickable:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(61, 132, 196, 0.18);
}

.info_blocks__card--active {
    border-color: var(--accent);
    box-shadow:
        0 0 0 2px var(--accent),
        var(--shadow);
}

.info_blocks__label {
    color: var(--text-2);
    font-size: calc(var(--font_size_0) * 0.82);
    line-height: 1.35;
}

.info_blocks__value {
    color: var(--blue-navy);
    font-size: calc(var(--font_size_0) * 1.18);
    font-weight: 700;
    line-height: 1;
}

.info_blocks__card--success .info_blocks__value {
    color: var(--success, #22a35a);
}

.info_blocks__card--warning .info_blocks__value {
    color: var(--warning, #f39a1e);
}

.info_blocks__card--danger .info_blocks__value {
    color: var(--danger, #e34f4f);
}

@media (orientation: portrait), (max-width: 980px) {
    .info_blocks {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .info_blocks {
        grid-template-columns: 1fr;
    }
}

/* Файл house_details.css */

.house-details-card {
    max-height: none;
    margin: 0 0 var(--font_size__0);
    overflow: visible;
}

.house-details-body {
    display: grid;
    min-width: 0;
    max-width: 100%;
    grid-template-columns: minmax(0, 1.6fr) 2px minmax(0, 1fr);
    grid-template-areas:
        "params divider apartments"
        "files  files   files";
    gap: var(--font_size_0);
    align-items: stretch;
    box-sizing: border-box;
}

.house-details-divider {
    grid-area: divider;
    width: 2px;
    height: calc(100% - var(--font_size_10));
    align-self: start;
    background: var(--accent);
    border-radius: var(--font_size__0);
}

.house-details-subtitle {
    display: block;
    margin-bottom: var(--font_size__0);
    color: var(--blue-navy);
    font-size: var(--font_size_1);
    font-weight: 600;
}

.house-details-params {
    grid-area: params;
    max-width: 100%;
}

.house-details-paramrow {
    display: flex;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size_0);
    box-sizing: border-box;
}

.house-details-paramrow > span {
    min-width: 0;
    max-width: 42%;
    flex: 0 1 auto;
    overflow-wrap: anywhere;
}

.house-details-paramrow input {
    max-width: 100%;
    flex: 1 1 0;
}

.house-details-savebtn {
    align-self: flex-start;
    height: calc(var(--font_size_10) + var(--font_size__0));
    margin-top: var(--font_size__0);
    padding: 0 var(--font_size_0);
    border: none;
    border-radius: var(--font_size__0);
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size_0);
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s ease;
}

.house-details-apartments {
    grid-area: apartments;
    position: static;
    min-width: 0;
    min-height: 0;
}

.house-details-apartments-inner {
    position: static;
    display: flex;
    min-width: 0;
    min-height: 0;
    height: 100%;
    max-height: 430px;
    flex-direction: column;
    gap: var(--font_size__0);
}

.house-details-apartmentshead,
.house-details-apartmentrow {
    display: grid;
    min-width: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--font_size__0);
    align-items: center;
}

.house-details-apartmentshead {
    position: sticky;
    z-index: 2;
    top: 0;
    padding: 4px 0;
    background: var(--bg-1);
}

.house-details-apartmentshead > span {
    color: var(--text-3);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.house-details-apartmentnum {
    color: var(--blue-navy);
    font-size: var(--font_size_0);
}

.house-details-apartmentsbody {
    display: flex;
    min-height: 0;
    max-height: 360px;
    flex: 1 1 auto;
    flex-direction: column;
    gap: var(--font_size__0);
    padding-right: 4px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
}

.house-details-files {
    grid-area: files;
}

.house-details-upload {
    display: flex;
    min-width: 0;
    height: calc(var(--font_size_10) + var(--font_size__0));
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: 1px dashed var(--accent);
    border-radius: var(--font_size__0);
    color: var(--accent-blue);
    font-size: var(--font_size_0);
    text-align: center;
    cursor: pointer;
}

.house-details-upload:hover {
    background: var(--bg-2);
}

@media (max-aspect-ratio: 1 / 1), (max-width: 768px) {
    .house-details-card {
        max-height: none;
        margin-right: 0;
    }

    .house-details-body {
        width: 100%;
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "params"
            "apartments"
            "files";
    }

    .house-details-divider {
        display: none;
    }

    .house-details-paramrow {
        flex-direction: column;
        align-items: stretch;
        gap: calc(var(--font_size__0) / 2);
        padding-right: 0;
    }

    .house-details-paramrow > span,
    .house-details-paramrow input {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
    }

    .house-details-paramrow input {
        display: block;
        flex: 0 0 auto;
    }

    .house-details-apartments {
        min-height: calc(var(--font_size_10) * 7);
    }

    .house-details-apartments-inner {
        height: auto;
        max-height: 430px;
    }

    .house-details-apartmentsbody {
        max-height: 360px;
    }
}

/* Файл layout_and_toolbar.css */

.counterparty-page {
    display: flex;
    width: 100%;
    min-height: 100%;
    align-items: flex-start;
    gap: var(--font_size_0);
    box-sizing: border-box;
    padding: var(--font_size_0);
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--bg-2);
}

.counterparty-pagemain {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: visible;
}

.counterparty-pageside {
    flex: 0 0 210px;
    overflow: visible;
}

.counterparty-pagemain .grid-container,
.counterparty-pagemain .grid-container.scrollable,
.counterparty-pagemain .grid-item {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.counterparty-sectionheader__top {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: var(--font_size_0);
}

.counterparty-sectiontitle {
    margin: 0;
    color: var(--blue-navy);
    font-size: var(--font_size_3);
    font-weight: 700;
    line-height: 1.15;
}

.counterparty-sectionsubtitle {
    display: block;
    margin: calc(var(--font_size__0) / 2) 0 0;
    color: var(--text-2);
    font-size: var(--font_size_1);
    font-weight: 600;
}

.counterparty-toolbar {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--font_size__0);
}

.counterparty-toolbarbtn {
    display: inline-flex;
    height: calc(var(--font_size_10) + var(--font_size__0));
    align-items: center;
    gap: var(--font_size__0);
    box-sizing: border-box;
    padding: 0 var(--font_size_0);
    border: 1px solid transparent;
    border-radius: var(--font_size__0);
    font-size: var(--font_size_0);
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: 0.15s ease;
}

.counterparty-toolbarbtn_primary {
    background: var(--accent);
    color: var(--bg-1);
    box-shadow: var(--shadow);
}

.counterparty-toolbarbtn_primary:hover {
    background: var(--accent-blue);
}

.counterparty-toolbarbtn_secondary {
    border-color: var(--border);
    background: var(--bg-1);
    color: var(--blue-navy);
}

.counterparty-toolbarbtn_secondary:hover:not(:disabled):not(.is-disabled) {
    border-color: var(--accent);
    background: var(--bg-2);
    color: var(--accent-blue);
}

.counterparty-toolbarbtn_secondary.is-disabled,
.counterparty-toolbarbtn_secondary:disabled,
.counterparty-toolbarbtn_danger.is-disabled,
.counterparty-toolbarbtn_danger:disabled {
    opacity: 0.5;
    box-shadow: none;
    cursor: not-allowed;
}

.counterparty-toolbarbtn_danger {
    border-color: var(--accent-red);
    background: var(--bg-1);
    color: var(--accent-red);
}

.counterparty-toolbarbtn_danger:hover:not(:disabled):not(.is-disabled) {
    background: var(--bg-2);
}

.counterparty-toolbaricon {
    font-size: var(--font_size_0);
    line-height: 1;
}

.counterparty-tablehint {
    margin-top: var(--font_size__0);
    color: var(--text-3);
    font-size: var(--font_size_0);
    text-align: right;
    user-select: none;
}

.counterparty-pivot .hierarchy-row.is-clickable {
    cursor: pointer;
}

.counterparty-pivot .hierarchy-row.is-clickable:hover {
    background: var(--bg-2);
}


/* Файл driver_and_loading.css */

.counterparty-driverbody {
    display: flex;
    flex-direction: column;
    gap: var(--font_size_0);
    padding: calc(var(--font_size__0) / 2) calc(var(--font_size__0) / 2) var(--font_size_1);
}

.counterparty-driversubtitle {
    margin: 0;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.counterparty-driverfield {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
}

.counterparty-driverfield > span {
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.counterparty-driverfield input,
.counterparty-driverfield select {
    width: 100%;
    height: calc(var(--font_size_10) + var(--font_size__0));
    box-sizing: border-box;
    padding: 0 var(--font_size_0);
    outline: none;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.counterparty-driverfield input:disabled,
.counterparty-driverfield input[readonly] {
    background: var(--bg-2);
    color: var(--text-2);
    cursor: not-allowed;
}

.counterparty-driverfield input::placeholder {
    color: var(--text-3);
}

.counterparty-driverfield input:focus,
.counterparty-driverfield select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(61, 132, 196, 0.14);
}

.counterparty-driverfooter {
    position: sticky;
    bottom: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--font_size__0);
    margin-top: var(--font_size__0);
    padding: var(--font_size_0) calc(var(--font_size__0) / 2) var(--font_size__0);
    border-top: 1px solid var(--border);
    background: var(--bg-1);
}

.counterparty-driverbtn {
    height: calc(var(--font_size_10) + var(--font_size__0));
    border: none;
    border-radius: var(--font_size__0);
    font-size: var(--font_size_0);
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s ease;
}

.counterparty-driverbtn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.counterparty-driverbtn_secondary {
    background: var(--bg-2);
    color: var(--text-1);
}

.counterparty-driverbtn_secondary:hover:not(:disabled) {
    background: var(--border);
}

.counterparty-driverbtn_primary {
    background: var(--accent);
    color: var(--bg-1);
    box-shadow: var(--shadow);
}

.counterparty-driverbtn_primary:hover:not(:disabled) {
    background: var(--accent-blue);
}

.counterparty-page_loading {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.counterparty-pageloader {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--font_size_0);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.counterparty-spinner {
    width: calc(var(--font_size_10) + var(--font_size__0));
    height: calc(var(--font_size_10) + var(--font_size__0));
    border: 3px solid var(--border);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: counterparty-spin 0.9s linear infinite;
}

.counterparty-loadertext {
    font-weight: 500;
    letter-spacing: 0.2px;
}

@keyframes counterparty-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .counterparty-spinner {
        animation-duration: 1.6s;
    }
}


/* Файл contracts_and_responsive.css */

.counterparty-contractblock {
    display: flex;
    flex-direction: column;
    gap: var(--font_size_0);
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--bg-2);
}

.counterparty-contractheader {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.counterparty-contracttitle {
    color: var(--blue-navy);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.counterparty-contractremove {
    width: calc(var(--font_size_1) * 1.3);
    height: calc(var(--font_size_1) * 1.3);
    border: 1px solid var(--accent-red);
    border-radius: 50%;
    background: var(--bg-1);
    color: var(--accent-red);
    font-size: var(--font_size_0);
    line-height: 1;
    cursor: pointer;
}

.counterparty-contractremove:hover {
    background: var(--bg-2);
}

.counterparty-addmorebtn {
    align-self: flex-start;
    height: calc(var(--font_size_10) + var(--font_size__0));
    padding: 0 var(--font_size_0);
    border: 1px dashed var(--accent);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--accent-blue);
    font-size: var(--font_size_0);
    font-weight: 600;
    cursor: pointer;
}

.counterparty-addmorebtn:hover {
    background: var(--bg-2);
}

@media (orientation: portrait), (max-width: 980px) {
    .counterparty-page {
        flex-direction: column;
    }

    .counterparty-pagemain,
    .counterparty-pageside {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        flex: 0 0 auto;
        overflow: visible;
    }

    .counterparty-pageside {
        margin-top: var(--font_size_0);
    }
}

/* Единственная вертикальная прокрутка находится у всей страницы объекта. */

.counterparty-pagemain .grid-container {
    grid-auto-rows: min-content;
}

.counterparty-page .counterparty-pivot {
    height: auto;
    max-height: none;
    overflow: visible;
    scrollbar-gutter: auto;
}

.counterparty-page .table-widget,
.counterparty-page .table-container {
    height: auto;
    max-height: none;
    overflow: visible;
}

.counterparty-page .table-wrapper {
    height: auto;
    max-height: none;
    overflow-x: auto;
    overflow-y: visible;
    overscroll-behavior: auto;
}

/* Открытый объект: общая страница прокручивается, статистика остаётся на месте. */

.counterparty-page {
    height: 100%;
    min-height: 0;
    align-items: flex-start;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.counterparty-pageside {
    position: sticky;
    top: var(--font_size_0);
    align-self: flex-start;
    max-height: calc(100dvh - 150px);
    overflow: visible;
}

@media (orientation: portrait), (max-width: 980px) {
    .counterparty-pageside {
        position: static;
        max-height: none;
    }
}


.counterparty-contractgrid,
.counterparty-contractrequisites__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--font_size_0);
}

.counterparty-contractgrid__wide {
    grid-column: 1 / -1;
}

.counterparty-contractrequisites {
    display: flex;
    flex-direction: column;
    gap: var(--font_size_0);
    padding-top: var(--font_size_0);
    border-top: 1px solid var(--border);
}

.counterparty-contractrequisites__title {
    color: var(--blue-navy);
    font-size: var(--font_size_0);
    font-weight: 700;
}

@media (orientation: portrait), (max-width: 680px) {
    .counterparty-contractgrid,
    .counterparty-contractrequisites__grid {
        grid-template-columns: 1fr;
    }

    .counterparty-contractgrid__wide {
        grid-column: auto;
    }
}

/* Файл open_tab.css */

/* Файл tab.css */

.management-objects-root {
    width: 100%;
    max-width: 100%;
}

.management-house-status-filter {
    height: 36px;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
    color: var(--blue-navy);
    padding: 0 10px;
    font-size: var(--font_size_0);
    outline: none;
}

.management-house-status-filter:focus {
    border-color: var(--accent);
}

@media (max-width: 768px) {
    .management-objects-root .management-workspace__toolbar {
        gap: 6px;
    }
}

/* Файл company_information.css */

.company-information-root,
.company-information__page {
    background: var(--bg-2);
}

.company-information-toolbar {
    flex: 0 0 auto;
    flex-wrap: wrap;
}

.company-information__page {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    gap: var(--font_size__0);
    box-sizing: border-box;
    padding: var(--font_size_0);
}

.company-information__card,
.company-information__documents {
    margin: 0;
}

.company-information__fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(200px, 1fr));
    gap: var(--font_size__0);
    margin-bottom: var(--font_size__0);
}

.company-information__field {
    display: grid;
    gap: calc(var(--font_size__0) / 2);
    min-width: 0;
    color: var(--blue-navy);
    font-size: var(--font_size_0);
}

.company-information__field--wide {
    grid-column: 1 / -1;
}

.company-information__field textarea {
    width: 100%;
    min-width: 0;
    min-height: calc(var(--font_size_10) * 3);
    box-sizing: border-box;
    padding: var(--font_size__0) var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--blue-navy);
    font: inherit;
    font-size: var(--font_size_0);
    resize: vertical;
}

.company-information__save {
    min-height: calc(var(--font_size_10) + var(--font_size__0));
    font-size: var(--font_size_0);
}

.company-information__documents .doc-card__attachments,
.company-information__documents .doc-card__file-list {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

.company-information__row-actions button {
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    cursor: pointer;
}

@media (max-width: 1050px) {
    .company-information__fields {
        grid-template-columns: repeat(2, minmax(200px, 1fr));
    }
}

@media (max-width: 760px) {
    .company-information__fields {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Файл PhotoUpload.css */

/*  */

.photo-upload-container {
position: relative;
margin: 10px 0;
}

.photo-upload-input {
display: none;
}

.photo-upload-frame {
width: 100%;
height: 100%;
border: 2px dashed #ddd;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
overflow: hidden;
background-color: #f9f9f9;
}

.photo-upload-frame:hover {
border-color: #007bff;
background-color: #f0f8ff;
}

.photo-upload-disabled .photo-upload-frame {
cursor: not-allowed;
opacity: 0.6;
background-color: #f5f5f5;
}

.photo-upload-disabled .photo-upload-frame:hover {
border-color: #ddd;
background-color: #f5f5f5;
}

.photo-upload-preview {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 6px;
}

.photo-upload-placeholder {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #666;
}

.photo-upload-plus {
font-size: 32px;
font-weight: 300;
color: #999;
margin-bottom: 8px;
}

.photo-upload-text {
font-size: 14px;
text-align: center;
max-width: 80%;
}

.photo-upload-remove {
position: absolute;
top: 5px;
right: 5px;
width: 24px;
height: 24px;
border-radius: 50%;
background-color: rgba(255, 107, 107, 0.9);
color: white;
border: none;
font-size: 18px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background-color 0.2s;
}

.photo-upload-remove:hover {
background-color: #ff6b6b;
}
/* Файл FormField.css */

/* components/FormField/FormField.css */

.form-field-photo-with-rows {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.form-field-photo-container {
    flex-shrink: 0;
}

.form-field-photo-rows-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.form-field-photo-row {
    display: flex;
    flex-direction: row; /* Изменено с column на row */
    align-items: center; /* Выравниваем по центру по вертикали */
    gap: 10px; /* Расстояние между надписью и полем */
    width: 100%;
}

/* Дополнительный класс для текста в строке с фото */
.form-field-photo-row .form-field-text {
    min-width: 120px; /* Фиксированная ширина для надписей */
    white-space: nowrap;
    margin: 0;
}

/* Дополнительный класс для поля ввода в строке с фото */
.form-field-field-photo-row .form-field-input,
.form-field-photo-row .form-field-textarea,
.form-field-photo-row .form-field-select {
    flex: 1;
    min-width: 150px;
}

/* Остальные стили остаются без изменений */
.form-field-container {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 0 auto;
    padding: 5px;
}

.form-field-row {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    align-items: flex-start;
}

.form-field-item {
    flex: 1;
    min-width: 200px;
}

.form-field-new-row {
    flex-basis: 100%;
}

.form-field-layout-right {
    flex: 1;
}

.form-field-layout-top,
.form-field-layout-bottom {
    flex-basis: 100%;
}

.form-field-content {
    display: flex;
    gap: 10px;
}

.form-field-vertical {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
}

.form-field-left .form-field-content,
.form-field-right .form-field-content {
    flex-direction: row;
}

.form-field-top .form-field-content {
    flex-direction: column;
    align-items: flex-start;
}

.form-field-bottom .form-field-content {
    flex-direction: column-reverse;
    align-items: flex-start;
}

.form-field-text {
    font-weight: 500;
    color: #333;
    min-width: 150px;
    white-space: nowrap;
    display: block;
}

.form-field-input,
.form-field-textarea,
.form-field-select {
    border: 1px solid #ddd;
    font-size: 16px;
    flex-grow: 1;
    padding: 5px;
    border-radius: 4px;
    min-width: 200px;
}

.form-field-input:focus,
.form-field-textarea:focus,
.form-field-select:focus {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.form-field-required {
    border-left: 3px solid #ff6b6b;
}

.form-field-disabled {
    background-color: #f5f5f5;
    cursor: not-allowed;
    opacity: 0.7;
}

.field-disabled .form-field-text {
    color: #585555;
}

.required-asterisk {
    color: #ff6b6b;
    font-weight: bold;
    margin-left: 4px;
}

.form-field-error {
    font-size: 0.8em;
    color: #ff6b6b;
    margin-top: 4px;
}

/* Стили для checkbox и radio */
.form-field-checkbox-wrapper {
    display: flex;
    align-items: center center;
    gap: 8px;
}

.form-field-checkbox {
    margin: 0;
}

.form-field-checkbox-text {
    font-weight: 500;
    color: #333;
}

.form-field-radio-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-field-radio-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.form-field-radio-text {
    font-weight: 500;
    color: #333;
}

/* Стили для textarea */
.form-field-textarea {
    resize: vertical;
    min-height: 60px;
}

/* Стили для select */
.form-field-select {
    background-color: white;
    cursor: pointer;
}
/* Файл tab_personnel_and_salary.css */

.personnel-entities-root {
    width: 100%;
    max-width: 100%;
}

.staff-revisions-tab,
.tab-personnel-and-salary {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    height: 100%;
}

.staff-revisions-tab__toolbar,
.tab-personnel-and-salary__buttons {
    position: relative;
    z-index: 5;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 42px;
    padding: 8px 4px;
    background: var(--bg-1);
}

.tab-personnel-and-salary > :not(.tab-personnel-and-salary__buttons),
.staff-revisions-tab > :not(.staff-revisions-tab__toolbar) {
    min-height: 0;
}

.personnel-hires {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.personnel-hires__table-wrap {
    max-width: 100%;
    overflow: auto;
}

.personnel-hires__table {
    width: 100%;
    border-collapse: collapse;
}

.personnel-hires__table th,
.personnel-hires__table td {
    padding: 8px;
    border-bottom: 1px solid var(--border);
    text-align: left;
}

.personnel-hires__table th {
    background: var(--bg-2);
}

.personnel-hires__table tbody tr {
    cursor: pointer;
}

.personnel-hires__table tbody tr:hover {
    background: var(--bg-2);
}

.personnel-hires__toolbar {
    flex-wrap: wrap;
}

.personnel-hires__toolbar button,
.personnel-hires__order-link,
.personnel-hires__document-link,
.personnel-hires__order-card-link,
.personnel-hires__document-form button {
    min-height: 32px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    cursor: pointer;
}

.personnel-hires__panel {
    display: grid;
    gap: 9px;
}

.personnel-hires__panel > label {
    display: grid;
    gap: 4px;
}

.personnel-hires__panel input,
.personnel-hires__panel textarea,
.personnel-hires__document-form select {
    box-sizing: border-box;
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 7px 9px;
    font: inherit;
}

.personnel-hires__panel-actions,
.personnel-hires__document-form {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}


.personnel-hires__order-card-link {
    width: fit-content;
    padding: var(--font_size__0) var(--font_size_0);
    border-color: var(--accent);
    color: var(--accent-blue);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.personnel-hires__documents h4 {
    margin: 0 0 var(--font_size__0);
}

.personnel-hires__document-form > div {
    display: inline-flex;
}

.personnel-hires__documents {
    margin: 0;
}

.personnel-hires__document-link {
    display: block;
    width: 100%;
    margin-top: 5px;
    text-align: left;
}

.personnel-salary {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
}

.personnel-salary__toolbar {
    display: flex;
    flex: 0 0 auto;
    align-items: end;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
}

.personnel-salary__toolbar label {
    display: grid;
    gap: 4px;
}

.personnel-salary__toolbar input {
    min-height: 34px;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 5px 8px;
    font: inherit;
}

.personnel-salary__table-wrap {
    width: 100%;
    min-height: 0;
    overflow: auto;
}

.personnel-salary__table {
    width: 100%;
    border-collapse: collapse;
}

.personnel-salary__table th,
.personnel-salary__table td {
    padding: 7px;
    border: 1px solid var(--border);
    text-align: left;
}

.personnel-salary__table th {
    position: sticky;
    top: 0;
    background: var(--accent);
    color: var(--bg-1);
    z-index: 1;
}

.personnel-salary__table input {
    width: 100%;
    min-width: 110px;
    min-height: 32px;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 5px 7px;
    font: inherit;
}

.personnel-salary__table td:first-child {
    min-width: 220px;
}

@media (max-width: 700px) {
    .personnel-salary__toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .personnel-salary__toolbar .btn {
        width: 100%;
    }
}

/* Файл download_residents.css */

.download-residents__root {
    display: flex;
    flex-direction: column;
    height: 100%;
    box-sizing: border-box;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.download-residents__block {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.download-residents__label {
    font-size: var(--font_size_0);
    color: var(--text-3);
    margin-bottom: 10px;
    display: block;
}

.download-residents__select {
    width: 100%;
    height: calc(var(--font_size_0) * 2);
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid var(--border);
    background: var(--bg-1);
    font-size: var(--font_size_0);
    color: var(--text-1);
    box-sizing: border-box;
}

.download-residents__select:focus {
    outline: none;
    border-color: var(--accent-blue);
    box-shadow: 0 0 0 2px rgba(47, 117, 181, 0.15);
}

.download-residents__radio-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 4px 2px;
}

.download-residents__radio-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--font_size_0);
    color: var(--text-2);
    cursor: pointer;
}

.download-residents__radio-row input[type="radio"] {
    accent-color: var(--accent-blue);
    cursor: pointer;
}

.download-residents__house {
    font-size: var(--font_size_1);
    color: var(--text-1);
}

.download-residents__button-row {
    margin-top: 20px;
    display: flex;
    flex-shrink: 0;
}
/* Файл List.css */

.radio-button-list {
    font-family: Arial, sans-serif;
    display: flex;
    flex-direction: column;
}

.radio-button-list--scroll {
    height: 100%;
    min-height: 0;
}

.radio-list-label {
    font-weight: bold;
    margin-bottom: 10px;
    color: #333;
    flex-shrink: 0;
}

.options-container {
    display: flex;
    flex-direction: column;
    overflow: visible;
}

.options-container--scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.options-container--scroll::-webkit-scrollbar {
    width: 8px;
}

.options-container--scroll::-webkit-scrollbar-track {
    background: var(--bg-2);
    border-radius: 4px;
}

.options-container--scroll::-webkit-scrollbar-thumb {
    background: var(--text-3);
    border-radius: 4px;
}

.options-container--scroll::-webkit-scrollbar-thumb:hover {
    background: var(--text-2);
}

.no-options-message {
    padding: 2px;
    color: #665;
    text-align: center;
    font-style: italic;
}

.error-message {
    padding: 12px;
    color: #d32f2f;
    background-color: #ffebee;
    border-radius: 4px;
    margin: 8px 0;
}
/* Файл ListItem.css */

/* SelectionListItem.css */

.radio-label {
    padding-bottom: 12px;
    display: flex;
    align-items: center;
    cursor: pointer;
    position: relative;
    border-radius: 4px;
    transition: background-color 0.2s;
}

.radio-label:hover {
    background-color: #f5f5f5;
}

.radio-label.disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.radio-input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.radio-content {
    display: flex;
    flex-direction: column;
}

.radio-text {
    font-size: 16px;
    color: #333;
}

.radio-description {
    font-size: 14px;
    color: #4e4c4c;
    margin-top: 2px;
}
/* Файл ListRadio.css */

/* SelectionListRadio.css */

.radio-custom {
    position: relative;
    height: 10px;
    width: 10px;
    background-color: #fff;
    border: 2px solid #ccc;
    border-radius: 50%;
    margin-right: 10px;
    flex-shrink: 0;
}

/* Стили для радиокнопок */
.radio-input:checked ~ 
.radio-custom:not(.radio-custom-checkbox) {
    background-color: #2196F3;
    border-color: #2196F3;
}

.radio-input:checked ~ 
.radio-custom:not(.radio-custom-checkbox)::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

.radio-input:disabled ~ .radio-custom {
    background-color: #e9ecef;
    border-color: #adb5bd;
    cursor: not-allowed;
}

.radio-input:disabled ~ .radio-text {
    color: #6c757d;
    cursor: not-allowed;
}
/* Файл ListCheckbox.css */

/* SelectionListCheckbox.css */

.radio-custom-checkbox {
    border-radius: 4px;
}

/* Стили для чекбоксов */
.radio-input:checked ~ 
.radio-custom-checkbox {
    background-color: #2196F3;
    border-color: #2196F3;
}

.radio-input:checked ~ 
.radio-custom-checkbox::after {
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 10px;
    font-weight: bold;
    line-height: 1;
}
/* Файл ListBorder.css */

/* SelectionListBorder.css */

/* Border styles */
.selection-list-border {
    padding: 4px;
    border: 1px solid #ddd;
}

.selection-list-border-rounded {
    border-radius: 8px;
}

.selection-list-border-shadow {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
/* Файл PortraitCollapse.css */

.selection-list-shell {
    position: relative;
    min-width: 0;
}

.selection-list-portrait-toggle {
    display: none;
}

@media (orientation: portrait) {
    .selection-list-shell--portrait-collapse {
        width: 100%;
        min-width: 0;
        flex: 0 0 auto;
    }

    .selection-list-shell--portrait-collapse
    .selection-list-portrait-toggle {
        display: flex;
        width: 100%;
        min-width: 0;
        min-height: 38px;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 6px 10px;
        border: 1px solid var(--border);
        border-radius: 9px;
        background: var(--bg-1);
        color: var(--text-2);
        box-shadow: var(--shadow);
        box-sizing: border-box;
        cursor: pointer;
        font-size: var(--font_size_0);
        font-weight: 600;
        text-align: left;
    }

    .selection-list-shell--portrait-collapse
    .selection-list-portrait-toggle span:first-child {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .selection-list-shell--portrait-collapse
    .radio-button-list--portrait-popup {
        display: none;
        position: absolute;
        top: calc(100% + 5px);
        right: 0;
        left: 0;
        width: 100% !important;
        max-height: min(62dvh, 520px);
        min-height: 0 !important;
        overflow: auto;
        padding: 8px;
        border: 1px solid var(--border);
        border-radius: 10px;
        background: var(--bg-1);
        box-shadow: 0 10px 28px rgba(15, 23, 42, .18);
        box-sizing: border-box;
        z-index: 150;
    }

    .selection-list-shell--portrait-collapse.is-open
    .radio-button-list--portrait-popup {
        display: flex;
    }

    .selection-list-shell--portrait-collapse
    .radio-button-list--portrait-popup
    .options-container {
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible;
    }
}

/* Файл index.css */

/*  */

/* Файл tab_residents.css */

.residents-actions {
    display: grid;
    width: 100%;
    height: 100%;
    min-width: 0;
    gap: 5px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
}

.residents-actions__add {
    min-width: 0;
    grid-column: 1 / -1;
}

.residents-actions__download,
.residents-actions__export {
    min-width: 0;
}

.residents-actions__add .btn,
.residents-actions__download .dropdown-container,
.residents-actions__download .dropdown-button,
.residents-actions__export .btn {
    width: 100%;
    height: 100%;
}

@media (orientation: portrait) {
    .residents-actions {
        height: auto;
        align-items: stretch;
        grid-template-columns: minmax(0, 1fr) 40px 40px;
        grid-template-rows: minmax(32px, auto);
    }

    .residents-actions__add {
        grid-column: auto;
    }

    .residents-table .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column) th:first-child,
    .residents-table .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column) td:first-child {
        width: 25% !important;
    }
}

/* Файл window_add_service.css */

.add-service-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 8px 4px;
}

.add-service-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
}

/* Файл 01.css */

/* Файл window_service.css */

/* ─── Layout ─────────────────────────────────────────────── */
.service-layout {
    display: grid;
    margin-right: 0px;
    grid-template-columns: 340px minmax(0, 1fr);
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.service-layout--wide {
    grid-template-columns: 55% minmax(0, 1fr);
}

.service-card--sidebar,
.service-card--content {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}


/* ─── Внутренняя структура карточки ─────────────────────── */
.service-layout .service-card__header {
    display: flex;
    margin-bottom: 10px;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.service-card__title {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    color: #172033;
}

.service-card__subtitle {
    margin: 5px 0 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: #6b7280;
}

.service-card__body {
    flex: 1;
    min-height: 0;
    overflow: hidden;
}


/* Если внутри PivotTable / TableWidget нужно занять всё место */
.service-card__body--pivot {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.service-card__body--pivot > * {
    flex: 1;
    min-height: 0;
}

/* ─── Toolbar ────────────────────────────────────────────── */
.service-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.service-toolbar--stack {
    flex-direction: column;
    align-items: stretch;
}

/* ─── Empty state ────────────────────────────────────────── */
.service-empty-state {
    margin: 12px;
    border: 1px dashed #cfd8e6;
    border-radius: 14px;
    background: #f8fbff;
    color: #6b7280;
    padding: 32px 18px;
    font-size: 13px;
    text-align: center;
    line-height: 1.6;
}

/* ─── Badges ─────────────────────────────────────────────── */
.badge-current,
.badge-planned,
.badge-archive {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    white-space: nowrap;
}

.badge-current {
    background: #dcfce7;
    color: #166534;
}

.badge-planned {
    background: #ffedd5;
    color: #9a3412;
}

.badge-archive {
    background: #e5e7eb;
    color: #475569;
}

/* ─── Detail panel ───────────────────────────────────────── */
.service-card--detail {
    position: relative;
    border: 1px solid #bfdbfe;
    box-shadow: inset 0 0 0 1px #dbeafe;
}

.service-card__header--detail {
    position: relative;
    background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%);
    border-bottom: 1px solid #dbeafe;
}

.service-card__header--detail::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #3b82f6 0%, #60a5fa 100%);
    border-radius: 0 4px 4px 0;
}

.service-detail-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    margin-bottom: 8px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.02em;
}

.service-card--sidebar .service-toolbar--stack {
    align-items: stretch;
}


/* ─── Отступы внутри окна услуги ────────────────────────── */
.drawer-panel--service .drawer-body {
    padding-top: 0px;
}

.service-layout .block_1 {
    margin-top: 8px;
    margin-bottom: 0px;
}

.service-layout {
    padding-bottom: 0px
}


/* ─── Значение по нормативу под левой таблицей ───────────── */
.norm-value-wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    flex-shrink: 0;
}

.norm-value-label {
    font-size: 12px;
    line-height: 1.4;
    color: #6b7280;
}

.norm-value-input {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 10px;
    border: 1px solid #cfd8e6;
    border-radius: 8px;
    background: #ffffff;
    font-size: 13px;
    line-height: 1.4;
    color: #172033;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}


@media (max-aspect-ratio: 1 / 1) {
    /* Контейнер услуги перестаёт «обрезать» содержимое
       и растёт по сумме высот двух карточек */
    .service-layout,
    .service-layout--wide {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto;
        height: auto;
        min-height: 100%;
        overflow: visible;
    }

    /* Карточки больше не обрезают себя по высоте */
    .service-card--sidebar,
    .service-card--content {
        min-height: 0;
        overflow: visible;
    }

    .service-card__body {
        overflow: visible;
    }

    /* В портретном режиме прокручивается всё содержимое окна услуги,
       а не отдельные таблицы внутри вкладки. */
    .drawer-panel--service .drawer-body {
        overflow-y: auto;
        overscroll-behavior-y: contain;
    }

    .drawer-panel--service .tab-widget-container,
    .drawer-panel--service .tab-container-top,
    .drawer-panel--service .tab-content-wrapper,
    .drawer-panel--service .tab-content-item.active {
        height: auto !important;
        max-height: none !important;
        min-height: 0;
        overflow: visible !important;
    }

    .drawer-panel--service .service-layout .table-widget,
    .drawer-panel--service .service-layout .table-container,
    .drawer-panel--service .service-layout .table-wrapper,
    .drawer-panel--service .service-layout .pivot-table-container {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
}



/* Файл 02.css */

@media (max-aspect-ratio: 1 / 1) {
    .drawer-panel--service {
        width: 100% !important;
        max-width: 100vw;
    }

    .drawer-panel--service .drawer-body {
        max-width: 100%;
        padding: var(--font_size__0);
        overflow-x: hidden;
    }

    .drawer-panel--service .tab-widget-container,
    .drawer-panel--service .tab-container-top,
    .drawer-panel--service .tab-content-wrapper,
    .drawer-panel--service .tab-content-item.active,
    .drawer-panel--service .add-service-form,
    .drawer-panel--service .form-field-container,
    .drawer-panel--service .form-field-row,
    .drawer-panel--service .form-field-item,
    .drawer-panel--service .form-field-content {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .drawer-panel--service .form-field-row {
        display: block;
    }

    .drawer-panel--service .form-field-item {
        margin-bottom: var(--font_size_0);
    }

    .drawer-panel--service .form-field-content,
    .drawer-panel--service .form-field-left .form-field-content,
    .drawer-panel--service .form-field-right .form-field-content {
        align-items: stretch;
        flex-direction: column;
        gap: calc(var(--font_size__0) * .5);
    }

    .drawer-panel--service .form-field-text {
        min-width: 0;
        white-space: normal;
    }

    .drawer-panel--service .form-field-input,
    .drawer-panel--service .form-field-textarea,
    .drawer-panel--service .form-field-select {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .drawer-panel--service .add-service-actions {
        width: 100%;
        justify-content: flex-end;
    }
}

/* Файл window_service.css */

/* Файл tab_tarif_and_servises.css */

.services-table-layout {
    display: grid;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    grid-template-columns: minmax(0, 1fr) 118px;
    gap: 4px;
    box-sizing: border-box;
}

.services-table-layout__table {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.services-table-layout__actions {
    display: flex;
    min-width: 0;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: column;
    gap: 8px;
}

.services-table-layout__actions > * {
    max-width: 100%;
}

@media (orientation: portrait) {
    .services-table-layout {
        height: auto;
        min-height: 100%;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(56dvh, 1fr) auto;
        gap: 6px;
    }

    .services-table-layout__table {
        min-height: 56dvh;
    }

    .services-table-layout__actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
    }
}

/* Файл CalendarModal.css */

.calendar-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.calendar-modal {
    background-color: white;
    border-radius: 8px;
    padding: 20px;
    width: 400px;
    box-shadow: 0  4px 20px rgba(0, 0, 0, 0.2);
}

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e0e0e0;
}

.calendar-year {
    font-size: 24px;
    font-weight: bold;
    color: #333;
}

.calendar-nav-button {
    background: none;
    border: 1px solid #ddd;
    border-radius: 4px;
    width: 40px;
    height: 40px;
    font-size: 18px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    /* Глобальный селектор button {color: #ffff} в app_styling.css
       красит весь текст кнопок в белый. Возвращаем читаемый цвет
       стрелкам < и >. */
    color: #333;
    background-color: white;
}

.calendar-nav-button:hover {
    background-color: #f5f5f5;
    border-color: #999;
}

.calendar-months-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 20px;
}

.calendar-month-button {
    padding: 12px 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: white;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s;
    /* Без явного color глобальное правило button {color: #ffff}
       делает текст невидимым (белым на белом фоне). */
    color: #333;
}

.calendar-month-button:hover {
    background-color: #f0f0f0;
    border-color: #999;
}

.calendar-month-button.selected {
    background-color: #007bff;
    color: white;
    border-color: #0056b3;
}

.calendar-footer {
    display: flex;
    justify-content: flex-end;
    padding-top: 10px;
    border-top: 1px solid #e0e0e0;
    gap: var(--font_size__0);
}

.calendar-close-button {
    padding: 8px 16px;
    background-color: #6c757d;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.2s;
}

.calendar-close-button:hover {
    background-color: #5a6268;
}

.calendar-date-title {
    margin-bottom: var(--font_size_0);
    color: var(--text-1);
    font-size: var(--font_size_1);
    font-weight: 700;
}

.calendar-date-input {
    width: 100%;
    min-height: calc(var(--font_size_10) * 1.2);
    box-sizing: border-box;
    margin-bottom: var(--font_size_0);
    padding: var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-family: inherit;
    font-size: var(--font_size_0);
}

.calendar-select-button {
    padding: var(--font_size__0) var(--font_size_0);
    border: 0;
    border-radius: var(--font_size__0);
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.calendar-select-button:hover {
    background: var(--accent-blue);
    transform: none;
}
/* Файл tab_counters.css */

.counters-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--font_size__0);
    min-width: 0;
}

.counters-toolbar button {
    margin: 0;
    font-size: var(--font_size_0);
}

.counters-toolbar button:disabled,
.counters-import-panel__submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.counters-import-panel__content {
    display: flex;
    flex-direction: column;
    gap: var(--font_size_0);
    margin: 0;
}

.counters-import-panel__file {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.counters-import-panel__file input {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.counters-import-panel__modes {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
}

.counters-import-panel__modes label {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.counters-import-panel__modes input {
    margin: 0;
}

.counters-import-panel__submit {
    align-self: flex-end;
    margin: 0;
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size_0);
}

@media (orientation: portrait) {
    .counters-toolbar {
        justify-content: stretch;
    }

    .counters-toolbar button {
        flex: 1 1 100%;
        width: 100%;
    }
}

/* Файл check_window.css */

.check_window_root {
    display: flex;
    flex-direction: row;
    height: 100%;
    min-height: 0;
    gap: var(--spacing-sm, 8px);
    padding: var(--spacing-sm, 8px);
    box-sizing: border-box;
}

.check_window_months {
    flex: 0 0 150px;
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.check_window_months_title {
    font-weight: 600;
    font-size: var(--font-size-sm, 13px);
    margin-bottom: 4px;
}

.check_window_month_item {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.check_window_table_wrap {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: auto;
}

.check_window_table {
    width: 100%;
    border-collapse: collapse;
}

.check_window_table th,
.check_window_table td {
    border: 1px solid var(--color-border, #ccc);
    padding: 4px 8px;
    text-align: left;
}

.check_window_table th {
    background: var(--color-bg-muted, #eef);
    position: sticky;
    top: 0;
}

.check_window_diff {
    color: var(--color-danger, #d32f2f);
    font-weight: 600;
}

.check_window_hint {
    padding: var(--spacing-md, 12px);
    color: var(--color-text-muted, #555);
}

.check_window_format {
    height: 30px;
    padding: 0 8px;
    border-radius: 6px;
    border: 1px solid #ccc;
    background: white;
    font-size: 13px;
}
.check_window_sort_button {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size__0);
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}

.check_window_sort_button:hover {
    background: transparent;
    color: var(--accent);
    transform: none;
    box-shadow: none;
}

/* Файл create_tab_.css */

.meter-readings-navigation {
    display: grid;
    min-width: 0;
    grid-template-columns: 52px 52px;
    grid-template-rows: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 7px;

    /* Важно: не ограничиваем по высоте и не обрезаем */
    height: auto;
    overflow: visible;
}

/* Кнопки <- и -> */
.meter-readings-navigation > .dropdown-button-container,
.meter-readings-navigation > .btn {
    align-self: start;
}

/* Блок с годами: по умолчанию (ландшафт) — на вторую строку, на всю ширину */
.meter-readings-navigation__years {
    min-width: 0;
    grid-column: 1 / -1;
    grid-row: 2;
    overflow: auto;

    /* Позволяем блоку с годами сжиматься, но не выталкивать 3‑ю строку */
    min-height: 0;
}

.meter-readings-navigation__years .selection-list {
    margin: 0;
    height: 100%;
}

.meter-readings-left-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    flex-direction: row;      /* горизонтально в ландшафте */
    gap: 7px;
    grid-column: 1 / -1;
    grid-row: 3;

    /* Гарантируем, что эта строка видна */
    visibility: visible;
}

.meter-readings-left-actions > .btn {
    flex: 1 1 auto;           /* обе кнопки делят пространство */
    max-width: 260px;
}

.meter-readings-settings {
    display: grid;
    gap: 10px;
}

.meter-readings-settings__item {
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-1);
}

.meter-readings-settings__item h4,
.meter-readings-settings__item p {
    margin: 0;
}

.meter-readings-settings__item p {
    margin-top: 4px;
    color: var(--text-3);
}


@media (orientation: portrait), (max-width: 680px) {
    .meter-readings-navigation {
        /* 2 строки: 1 — кнопки + годы, 2 — действия */
        grid-template-columns: 42px 42px minmax(0, 1fr);
        grid-template-rows: auto auto;
        height: auto;
        overflow: visible;
    }

    .meter-readings-navigation__years {
        /* годы в той же строке, в третьей колонке */
        grid-column: 3;
        grid-row: 1;
        overflow: visible;
        min-height: auto;
    }

    .meter-readings-left-actions {
        grid-column: 1 / -1;
        grid-row: 2;

        flex-direction: row; 
        align-items: center;
    }

    .meter-readings-left-actions > .btn {
        flex: 1 1 auto;
        max-width: none;
    }
}
/* Файл common_house_meter_readings.css */

.common-house-readings {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.common-house-readings .grid-container {
    grid-template-columns: 110px minmax(0, 1fr) !important;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.common-house-readings .selection-list-border {
    height: 100%;
    box-sizing: border-box;
}

.common-house-readings .table-widget-container {
    height: 100%;
    min-height: 0;
}

.common-house-readings .grid-item:first-child,
.common-house-readings .grid-item:nth-child(2) {
    width: 110px;
    max-width: 110px;
}

@media (max-width: 900px) {
    .common-house-readings .grid-container {
        grid-template-columns: 105px minmax(0, 1fr) !important;
    }

    .common-house-readings .grid-item:first-child,
    .common-house-readings .grid-item:nth-child(2) {
        width: 105px;
        max-width: 105px;
    }
}

/* Файл tab_receipt.css */

.tab_receipt_root {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
}

.tab_receipt_top_bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    flex-wrap: wrap;
}

.tab_receipt_body {
    display: flex;
    flex-direction: row;
    gap: 5px;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
}

.tab_receipt_periods {
    flex: 0 0 auto;
    min-height: 0;
    display: flex;
}

.tab_receipt_viewer {
    flex: 1 1 0;
    min-width: 0;
    min-height: 0;
    display: flex;
}

.tab_receipt_viewer_empty {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--text-3);
    font-size: 14px;
}

@media (orientation: portrait) {
    .tab_receipt_body {
        flex-direction: column;
    }

    .tab_receipt_periods {
        flex: 0 0 auto;
        max-height: 30vh;
        overflow: hidden;
    }

    .tab_receipt_viewer {
        flex: 1 1 auto;
    }
}


.receipt_generation_panel_section {
    --frp-text: var(--text-2);
    --frp-text-muted: var(--text-3);
    --frp-accent: var(--accent);
    --frp-accent-soft: var(--bg-2);
    --frp-accent-strong: var(--accent-blue);
    --frp-radius: 10px;
    --frp-radius-sm: 8px;

    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    color: var(--frp-text);
    font-family: inherit;
}

.receipt_generation_panel_title {
    display: flex;
    align-items: center;
    font-size: var(--font_size_0);
    font-weight: 600;
    color: var(--frp-text-muted);
}

.receipt_generation_panel_title::before {
    content: "";
    display: inline-block;
    width: 4px;
    height: 14px;
    border-radius: 2px;
    background: var(--frp-accent);
}

.receipt_generation_panel_summary {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px 10px;
    font-size: var(--font_size_0);
    color: var(--frp-text-muted);
}

.receipt_generation_panel_summary > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    /* line-height: 1; */
}

.receipt_generation_panel_summary > span b {
    font-weight: 600;
    color: var(--frp-accent);
    font-variant-numeric: tabular-nums;
}

.receipt_generation_panel_actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.receipt_generation_panel_actions button {
    border-radius: var(--frp-radius-sm) !important;
    transition:
        background-color 0.15s ease,
        box-shadow 0.15s ease,
        transform 0.05s ease;
}

.receipt_generation_panel_actions button:hover {
    box-shadow:
        0 1px 2px rgba(79, 70, 229, 0.15),
        0 4px 12px rgba(79, 70, 229, 0.18);
}

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

.receipt_generation_panel_field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.receipt_generation_panel_label {
    font-size: var(--font_size_0);
    color: var(--frp-text-muted);
    font-weight: 500;
}

.receipt_generation_panel_select {
    width: 100%;
    min-height: 36px;
    border: 1px solid var(--border);
    border-radius: var(--frp-radius-sm);
    background: transparent;
    color: var(--frp-text);
    outline: none;
    box-sizing: border-box;
}

.receipt_generation_panel_select:focus {
    border-color: var(--frp-accent);
}

.receipt_generation_panel_row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.receipt_generation_panel_checkbox {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    color: var(--frp-text);
    line-height: 1.35;
}

.receipt_generation_panel_hint {
    font-size: calc(var(--font_size_0) * .9);
    color: var(--frp-text-muted);
    line-height: 1.4;
}

.receipt_generation_panel_file_name {
    font-size: calc(var(--font_size_0) * .9);
    color: var(--frp-text-muted);
    word-break: break-word;
}

.receipt_generation_panel_root ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.receipt_generation_panel_root ::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 8px;
}

.receipt_generation_panel_root ::-webkit-scrollbar-thumb:hover {
    background: var(--frp-text-muted);
}

.receipt_generation_panel_root ::-webkit-scrollbar-track {
    background: transparent;
}

@media (max-width: 720px) {
    .receipt_generation_panel_root {
        padding: 12px;
        gap: 12px;
    }

    .receipt_generation_panel_section {
        padding: 12px;
    }

    .receipt_generation_panel_summary {
        padding: 8px 10px;
    }

    .receipt_generation_panel_actions {
        justify-content: stretch;
    }

    .receipt_generation_panel_actions button {
        width: 100%;
    }
}


/* Панель драйвера "Скачать" */
.download-panel__options {
    margin-bottom: 16px;
}

.download-panel__option-label {
    display: block;
    margin-bottom: 8px;
}

.download-panel__section-title {
    font-weight: 500;
    margin-bottom: 8px;
}

.download-panel__status-info {
    margin-bottom: 12px;
    color: var(--text-3); /* Соответствует цвету из исходного кода */
}

/* Стили для группировки элементов управления */
.download-panel__controls > div {
    margin-bottom: 16px;
}


.receipt-image-file-input {
    display: none;
}

/* Файл tariff_benefit_documents.css */

.drawer-panel--tariff-benefits .tariff-benefits__editor-panel {
    max-height: calc(100dvh - 92px);
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.tariff-benefits__field textarea {
    width: 100%;
    min-height: 82px;
    padding: 7px 9px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-2);
    font: inherit;
    resize: vertical;
    box-sizing: border-box;
}

.tariff-benefits__field textarea:focus {
    outline: 2px solid color-mix(in srgb, var(--accent) 30%, transparent);
    border-color: var(--accent);
}

.tariff-benefits__documents {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 8px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}

.tariff-benefits__documents h4 {
    margin: 0;
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.tariff-benefits__upload {
    display: flex;
    min-height: 54px;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border: 1px dashed var(--accent);
    border-radius: 8px;
    background: var(--bg-2);
    color: var(--text-2);
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
}

.tariff-benefits__upload:hover {
    background: color-mix(in srgb, var(--accent) 8%, var(--bg-2));
}

.tariff-benefits__upload.is-disabled {
    border-color: var(--border);
    color: var(--text-3);
    cursor: default;
}

.tariff-benefits__upload input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.tariff-benefits__documents .doc-card__attachments {
    min-width: 0;
}

@media (max-width: 1100px) {
    .drawer-panel--tariff-benefits .tariff-benefits__editor-panel {
        max-height: none;
        overflow-y: visible;
    }
}

/* Файл tariff_benefits.css */

.tariff-benefits {
    display: block;
    height: 100%;
    min-height: 0;
    padding: 12px;
    box-sizing: border-box;
    color: var(--text-2);
}

.tariff-benefits__list-panel,
.tariff-benefits__editor-panel,
.tariff-benefits__pivot-panel {
    min-height: 0;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--card);
    box-shadow: var(--shadow);
    box-sizing: border-box;
}

.tariff-benefits__list-panel,
.tariff-benefits__pivot-panel {
    display: flex;
    flex-direction: column;
}

.tariff-benefits__list-panel {
    height: 100%;
}

.tariff-benefits__pivots {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(320px, 1.4fr);
    gap: 12px;
    min-height: 0;
}

.tariff-benefits__panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.tariff-benefits__heading-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.tariff-benefits__list-heading {
    display: block;
}

.tariff-benefits__list-heading .btn {
    width: auto;
    min-width: 150px;
    flex: 0 0 auto;
}

.tariff-benefits__panel-heading h3 {
    margin: 0 0 3px;
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.tariff-benefits__panel-heading p {
    margin: 0;
    color: var(--text-3);
    font-size: var(--font_size_button);
}

.tariff-benefits__table-wrap {
    min-height: 0;
    flex: 1 1 auto;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.tariff-benefits__table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font_size_button);
}

.tariff-benefits__table th,
.tariff-benefits__table td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.tariff-benefits__table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--bg-2);
    color: var(--text-1);
}

.tariff-benefits__table tbody tr {
    cursor: pointer;
}

.tariff-benefits__table tbody tr:hover,
.tariff-benefits__table tbody tr.is-selected {
    background: var(--accent-orange-bg);
}

.tariff-benefits__empty,
.tariff-benefits__loading {
    padding: 24px;
    text-align: center;
    color: var(--text-3);
}

.tariff-benefits__form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.tariff-benefits__field {
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: var(--text-3);
    font-size: var(--font_size_button);
}

.tariff-benefits__field--wide {
    grid-column: 1 / -1;
}

.tariff-benefits__field input,
.tariff-benefits__field select {
    width: 100%;
    min-height: 36px;
    padding: 7px 9px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-2);
    font: inherit;
    box-sizing: border-box;
}

.tariff-benefits__field input:focus,
.tariff-benefits__field select:focus {
    outline: 2px solid color-mix(in srgb, var(--accent) 30%, transparent);
    border-color: var(--accent);
}

.tariff-benefits__actions {
    display: flex;
    gap: 8px;
    margin-top: 14px;
}

.tariff-benefits__pivot-panel .pivot-table-container {
    min-height: 0;
    overflow: auto;
}

@media (max-width: 1100px) {
    .tariff-benefits {
        height: auto;
    }

    .tariff-benefits__pivots {
        grid-template-columns: 1fr;
    }
}

@media (orientation: portrait) {
    .tariff-benefits {
        height: 100%;
        min-height: 0;
        padding: 7px;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .tariff-benefits__list-panel {
        height: auto;
        min-height: 100%;
    }

    .tariff-benefits__panel-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .tariff-benefits__panel-heading .btn {
        width: 100%;
    }

    .tariff-benefits__list-heading {
        display: block;
    }

    .tariff-benefits__list-heading .btn {
        width: auto;
        min-width: 132px;
    }

    .tariff-benefits__list-heading p {
        margin-top: 5px;
    }

    .tariff-benefits__table-wrap {
        flex: 0 0 auto;
        overflow-x: hidden;
        overflow-y: visible;
        border: 0;
        border-radius: 0;
    }

    .tariff-benefits__table,
    .tariff-benefits__table tbody,
    .tariff-benefits__table tr,
    .tariff-benefits__table td {
        display: block;
        width: 100%;
    }

    .tariff-benefits__table thead {
        display: none;
    }

    .tariff-benefits__table tbody {
        display: flex;
        min-width: 0;
        flex-direction: column;
        gap: 8px;
    }

    .tariff-benefits__table tbody tr {
        min-width: 0;
        overflow: hidden;
        border: 1px solid var(--border);
        border-radius: 8px;
        background: var(--bg-1);
        box-shadow: var(--shadow);
    }

    .tariff-benefits__table tbody td {
        display: grid;
        min-width: 0;
        grid-template-columns: minmax(100px, 34%) minmax(0, 1fr);
        gap: 8px;
        padding: 8px;
        border-bottom: 1px solid var(--border);
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .tariff-benefits__table tbody td:last-child {
        border-bottom: 0;
    }

    .tariff-benefits__table tbody td::before {
        content: attr(data-label);
        color: var(--text-3);
        font-weight: 600;
    }

    .tariff-benefits__table tbody td.tariff-benefits__empty {
        display: block;
        text-align: center;
    }

    .tariff-benefits__table tbody td.tariff-benefits__empty::before {
        content: none;
    }
}

/* Файл tariff_benefit_assignments.css */

.drawer-panel--tariff-benefits .drawer-body {
    background: var(--bg-2);
}

.tariff-benefits__drawer-loading {
    padding: 32px;
    color: var(--text-3);
    text-align: center;
}

.tariff-benefits__drawer-workspace {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    gap: 12px;
    min-width: 0;
    min-height: 0;
}

.tariff-benefits__assignment-panel {
    grid-column: 1 / -1;
    min-width: 0;
    min-height: 0;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--card);
    box-shadow: var(--shadow);
    box-sizing: border-box;
    overflow: hidden;
}

.tariff-benefits__assignment-empty {
    padding: 18px;
    border: 1px dashed var(--border);
    border-radius: 8px;
    color: var(--text-3);
    text-align: center;
}

.tariff-benefits__assignment-widget {
    width: 100%;
    height: min(360px, 45dvh);
    min-width: 0;
    min-height: 220px;
}

.tariff-benefits__assignment-widget .table-container,
.tariff-benefits__assignment-widget .table-wrapper {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 1100px) {
    .tariff-benefits__drawer-workspace {
        grid-template-columns: 1fr;
    }

    .tariff-benefits__assignment-panel {
        grid-column: auto;
    }
}

@media (max-width: 700px) {
    .tariff-benefits__assignment-widget {
        height: min(320px, 42dvh);
        min-height: 200px;
    }
}

@media (orientation: portrait) {
    .tariff-benefits__assignment-widget {
        height: clamp(220px, 44dvh, 360px);
        min-height: 0;
        max-height: clamp(220px, 44dvh, 360px);
    }

    .tariff-benefits__assignment-widget .table-wrapper,
    .tariff-benefits__assignment-widget
    .portrait-column-switcher-wrapper {
        height: 100%;
        min-height: 0;
        max-height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
    }
}

/* Файл debtor_card.css */

.debtor-card-page {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.debtor-card-page__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(250px, .72fr);
    gap: var(--font_size__0);
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    padding: var(--font_size__0);
    box-sizing: border-box;
}

.debtor-card-page .block_1 {
    margin: 0;
    padding: var(--font_size_0);
}

.debtor-card-page__apartments,
.debtor-card-page__settings {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.debtor-card-page__settings {
    overflow: auto;
}

.debtor-card-page__title {
    margin-bottom: var(--font_size__0);
    color: var(--blue-navy);
    font-size: var(--font_size_1);
    font-weight: 700;
}

.debtor-card-page__pivot {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.debtor-card-page__field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(130px, .9fr);
    align-items: center;
    gap: var(--font_size__0);
    margin-bottom: var(--font_size__0);
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.debtor-card-page__field input,
.debtor-card-page__field select {
    width: 100%;
    min-width: 0;
    height: calc(var(--font_size_10) + var(--font_size__0));
    padding: 0 var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
    box-sizing: border-box;
}

.debtor-card-page__summary,
.debtor-card-page__note {
    margin-top: var(--font_size__0);
    color: var(--text-1);
    font-size: var(--font_size_0);
    line-height: 1.3;
}

.debtor-card-page__note {
    color: var(--text-3);
}

.debtor-card-page__actions {
    display: flex;
    justify-content: flex-end;
    margin-top: auto;
    padding-top: var(--font_size__0);
}

@media (orientation: portrait), (max-width: 760px) {
    .debtor-card-page {
        overflow: auto;
    }

    .debtor-card-page__layout {
        grid-template-columns: minmax(0, 1fr);
        height: auto;
        min-height: 100%;
    }

    .debtor-card-page__field {
        grid-template-columns: minmax(0, 1fr);
    }

    .debtor-card-page__apartments {
        min-height: 48dvh;
    }
}

/* Файл tab_accruals_and_payments.css */

.accruals-workspace {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 8px;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.accruals_left_panel {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 140px;
    max-width: 140px;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.accruals_left_dropdowns {
    display: flex;
    flex: 0 0 auto;
    flex-direction: row;
    gap: 5px;
}

.accruals_left_dropdowns > * {
    flex: 1;
    min-width: 0;
}

.accruals_left_filter {
    min-width: 0;
}

.accruals-table-area {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.accruals-table-area > * {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
}

@media (orientation: portrait) {
    .accruals-workspace {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto minmax(0, 1fr);
        gap: 5px;
    }

    .accruals_left_panel {
        display: grid;
        grid-template-columns: auto minmax(105px, 0.7fr) minmax(125px, 1fr);
        align-items: start;
        gap: 5px;
        width: 100%;
        max-width: none;
        height: auto;
        overflow: visible;
    }

    .accruals_left_dropdowns {
        align-self: start;
        white-space: nowrap;
    }

    .accruals_left_filter {
        width: 100%;
        min-width: 0;
    }

    .accruals_left_filter > * {
        width: 100% !important;
    }
}

@media (max-width: 560px) and (orientation: portrait) {
    .accruals_left_panel {
        grid-template-columns: auto minmax(90px, 0.8fr) minmax(105px, 1fr);
    }
}

@media (min-width: 2200px) {
    .accruals-workspace {
        grid-template-columns: 180px minmax(0, 1fr);
    }

    .accruals_left_panel {
        width: 180px;
        max-width: 180px;
    }
}

/* Файл universal_chart.css */

.universal-chart {
    width: 100%;
}

.universal-chart--empty {
    display: grid;
    min-height: 180px;
    place-items: center;
    color: var(--text-3);
}

.universal-chart--donut {
    display: grid;
    grid-template-columns: minmax(170px, 220px) 1fr;
    gap: 22px;
    align-items: center;
}

.universal-chart__donut-wrap {
    position: relative;
    width: min(220px, 100%);
    aspect-ratio: 1;
}

.universal-chart__donut-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
    filter: drop-shadow(0 10px 22px rgba(31, 53, 84, 0.08));
}

.universal-chart__donut-track {
    stroke: var(--bg-2);
}

.universal-chart__donut-segment {
    cursor: pointer;
    transition: opacity .18s ease, stroke-width .18s ease;
}

.universal-chart__donut-segment:hover {
    opacity: .86;
    stroke-width: 18;
}

.universal-chart__donut-hole {
    position: absolute;
    inset: 23%;
    display: grid;
    place-items: center;
    align-content: center;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: var(--bg-1);
    color: var(--text-1);
    cursor: pointer;
}

.universal-chart__donut-hole:disabled {
    cursor: default;
}

.universal-chart__donut-hole strong {
    font-size: 26px;
    line-height: 1;
}

.universal-chart__donut-hole small {
    color: var(--text-3);
}

.universal-chart__legend {
    display: grid;
    gap: 12px;
}

.universal-chart__legend-item {
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: 12px;
    align-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.universal-chart__legend-item:disabled {
    cursor: default;
}

.universal-chart__legend-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    box-shadow: 0 0 0 2px var(--bg-1);
}

.universal-chart__legend-item b,
.universal-chart__legend-item small {
    display: block;
}

.universal-chart__legend-item small {
    color: var(--text-3);
}

.universal-chart--area {
    min-height: 220px;
}

.universal-chart--area svg {
    width: 100%;
    height: 220px;
    overflow: visible;
}

.universal-chart--area polygon {
    opacity: .22;
}

.universal-chart--area polyline {
    fill: none;
    stroke-width: 2.5;
    vector-effect: non-scaling-stroke;
}

.universal-chart__area-point {
    fill: var(--bg-1);
    stroke: var(--text-2);
    stroke-width: .35;
    cursor: pointer;
}

.universal-chart__bar-scroll {
    overflow-x: auto;
    padding-bottom: 6px;
}

.universal-chart__bar-stage {
    position: relative;
    display: grid;
    grid-auto-columns: minmax(78px, 1fr);
    grid-auto-flow: column;
    min-height: 240px;
    align-items: end;
    gap: 14px;
    padding: 0 4px;
}

.universal-chart__bar-grid {
    position: absolute;
    inset: 0 0 55px;
    pointer-events: none;
}

.universal-chart__bar-grid span {
    position: absolute;
    right: 0;
    left: 0;
    border-top: 1px solid var(--border);
    opacity: .55;
}

.universal-chart__bar-group {
    position: relative;
    z-index: 1;
    display: grid;
    min-width: 70px;
    min-height: 235px;
    align-content: end;
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.universal-chart__bar-group:disabled {
    cursor: default;
}

.universal-chart__bar-columns {
    display: flex;
    height: 170px;
    align-items: end;
    justify-content: center;
    gap: 6px;
}

.universal-chart__bar {
    width: 22px;
    min-height: 0;
    border-radius: 10px 10px 3px 3px;
    box-shadow: 0 8px 22px rgba(31, 53, 84, 0.13);
    transition: height .18s ease, transform .18s ease;
}

.universal-chart__bar-group:not(:disabled):hover .universal-chart__bar {
    transform: translateY(-2px);
}

.universal-chart__bar-group strong,
.universal-chart__bar-group small {
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.universal-chart__bar-group small {
    color: var(--text-3);
}

@media (max-width: 760px) {
    .universal-chart--donut {
        grid-template-columns: 1fr;
    }
}

/* Файл bank_account_page.css */

.bank-account-page {
    display: flex;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    font-size: var(--font_size_0);
}

.bank-account-page__dashboard,
.bank-account-page__table {
    min-width: 0;
    min-height: 0;
    flex: 0 0 auto;
}

.bank-account-page__statement-toolbar,
.bank-account-page__table-toolbar {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: var(--font_size__0);
}

.bank-account-page__statement-toolbar {
    margin-top: var(--font_size__0);
}

.bank-account-page__table {
    min-height: 420px;
    margin-bottom: var(--font_size_0);
}

.bank-account-page__table .table-widget,
.bank-account-page__table .table-container,
.bank-account-page__table .table-wrapper {
    max-height: none;
}

.bank-account-page__table .table-widget--auto-height,
.bank-account-page__table .table-widget--auto-height .table-container,
.bank-account-page__table .table-widget--auto-height .table-wrapper {
    height: auto !important;
    max-height: none !important;
    overflow-y: visible !important;
}

.bank-account-page__table .table-widget--auto-height .table-wrapper {
    overflow-x: auto !important;
}

.bank-account-details-panel {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: var(--font_size_0);
    overflow: auto;
}

.bank-account-details-panel__actions {
    display: flex;
    justify-content: flex-end;
}

.bank-account-details-panel .table-widget,
.bank-account-details-panel .data-table,
.bank-account-details-panel .data-table th,
.bank-account-details-panel .data-table td,
.bank-account-page__table .table-widget,
.bank-account-page__table .data-table,
.bank-account-page__table .data-table th,
.bank-account-page__table .data-table td {
    font-size: var(--font_size_0);
}

.bank-account-documents {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: var(--font_size__0);
}

.bank-account-documents__toolbar {
    display: flex;
    justify-content: flex-start;
}

.bank-account-details-panel__table {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--border-radius, 12px);
}

.bank-account-details-panel__head,
.bank-account-details-panel__row {
    display: grid;
    grid-template-columns: minmax(180px, .75fr) minmax(260px, 1.25fr);
    align-items: center;
    gap: var(--font_size_0);
    padding: 8px 10px;
}

.bank-account-details-panel__head {
    background: var(--primary-color, #5b6fc7);
    color: var(--button-text-color, #fff);
}

.bank-account-details-panel__row {
    border-top: 1px solid var(--border);
}

.bank-account-details-panel__row > span {
    color: var(--text-2);
}

.bank-account-details-panel__row > input {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 7px 9px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.bank-account-details-panel__empty {
    padding: var(--font_size_1);
    color: var(--text-3);
    text-align: center;
}

@media (orientation: portrait), (max-width: 760px) {
    .bank-account-details-panel__head {
        display: none;
    }

    .bank-account-details-panel__row {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

@media (orientation: portrait) {
    .bank-statement-table
    .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column):has(
        th:first-child .header-content > span[title="Дата"]
    ):has(
        th:nth-child(2) .header-content > span[title="Назначение платежа"]
    ) th:first-child,
    .bank-statement-table
    .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column):has(
        th:first-child .header-content > span[title="Дата"]
    ):has(
        th:nth-child(2) .header-content > span[title="Назначение платежа"]
    ) td:first-child {
        width: 20% !important;
        min-width: 20% !important;
        max-width: 20% !important;
        white-space: nowrap;
    }

    .bank-statement-table
    .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column):has(
        th:first-child .header-content > span[title="Дата"]
    ):has(
        th:nth-child(2) .header-content > span[title="Назначение платежа"]
    ) th:nth-child(2),
    .bank-statement-table
    .portrait-column-switcher-wrapper
    .data-table:not(.has-row-number-column):has(
        th:first-child .header-content > span[title="Дата"]
    ):has(
        th:nth-child(2) .header-content > span[title="Назначение платежа"]
    ) td:nth-child(2) {
        width: 80% !important;
        min-width: 80% !important;
        max-width: 80% !important;
    }
}

/* Файл bank_dashboard_layout.css */

.bank-dashboard {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 8px;
}

.bank-dashboard .block_1 {
    margin: 0;
}

.bank-dashboard__header {
    display: flex;
    min-width: 0;
    align-items: stretch;
    flex-direction: column;
    gap: 4px;
}

.bank-dashboard__header > h3 {
    width: 100%;
    margin: 0;
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.bank-dashboard__header-meta {
    display: flex;
    min-width: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 6px 10px;
}

.bank-dashboard__header-meta > span {
    flex: 0 0 auto;
    color: var(--text-3);
    font-size: var(--font_size_0);
    white-space: nowrap;
}

.bank-dashboard__header-controls,
.bank-dashboard__header-actions {
    display: flex;
    min-width: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.bank-dashboard__header-controls {
    flex: 0 1 auto;
    margin-left: auto;
}

.bank-dashboard__header-actions {
    flex: 0 1 auto;
}

.bank-dashboard__header-actions > *,
.bank-dashboard__header-actions .dropdown-button-container,
.bank-dashboard__header-actions .dropdown-container,
.bank-dashboard__header-actions .dropdown-button {
    width: auto !important;
    max-width: none;
    flex: 0 0 auto;
}

.bank-dashboard__header-actions .dropdown-button {
    white-space: nowrap;
}

.bank-dashboard__settings-wrap {
    position: relative;
    flex: 0 0 auto;
}

.bank-dashboard__settings {
    position: absolute;
    z-index: 80;
    top: calc(100% + 6px);
    right: 0;
    display: flex;
    width: min(320px, 80vw);
    flex-direction: column;
    gap: 8px;
    padding: 12px;
}

.bank-dashboard__settings label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.bank-dashboard__widgets {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(320px, 1.2fr) minmax(220px, .8fr);
    gap: 8px;
}

.bank-dashboard__widgets--single {
    grid-template-columns: 1fr;
}

.bank-dashboard__widget {
    min-width: 0;
    padding: 10px 12px;
}

.bank-dashboard__widget-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.bank-dashboard__widget-title h4 {
    margin: 0;
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.bank-dashboard__widget-title span {
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.bank-dashboard__documents {
    display: flex;
    min-height: 120px;
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;
    margin-top: 8px;
}

.bank-dashboard__documents .btn,
.bank-dashboard__documents .dropdown-button-container {
    width: 100%;
}

.bank-dashboard__metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.bank-dashboard__metrics--above-chart {
    margin: 2px 0;
}

.bank-dashboard__metric {
    display: flex;
    min-height: 88px;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    padding: 10px 12px;
}

.bank-dashboard__metric span,
.bank-dashboard__metric small {
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.bank-dashboard__metric strong {
    color: var(--text-1);
    font-size: var(--font_size_2);
}

.bank-dashboard__metric--inflow strong {
    color: var(--success, #2e7d32);
}

.bank-dashboard__metric--outflow strong {
    color: var(--error, #c62828);
}

.bank-dashboard__empty,
.bank-dashboard__loading {
    display: grid;
    min-height: 120px;
    place-items: center;
    color: var(--text-3);
}

@media (max-width: 1000px) {
    .bank-dashboard__metrics,
    .bank-dashboard__widgets {
        grid-template-columns: 1fr;
    }
}

@media (orientation: portrait), (max-width: 900px) {
    .bank-dashboard__header-meta {
        align-items: flex-start;
        justify-content: flex-start;
        gap: 6px;
    }

    .bank-dashboard__header-meta > span {
        width: 100%;
    }

    .bank-dashboard__header-controls {
        width: 100%;
        flex: 0 0 auto;
        justify-content: flex-start;
        gap: 6px;
        margin-left: 0;
    }

    .bank-dashboard__header-actions {
        width: auto;
        flex: 1 1 auto;
        justify-content: flex-start;
        gap: 6px;
    }

    .bank-dashboard__header-actions > * {
        flex: 0 1 auto;
    }
}

/* Файл bank_dashboard_chart.css */

.bank-dashboard__widget--chart {
    padding-bottom: 12px;
}

.bank-dashboard__legend {
    display: flex;
    gap: 16px;
    margin: 8px 0 4px;
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.bank-dashboard__legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.bank-dashboard__legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.bank-dashboard__legend-dot--inflow {
    background: var(--success, #2e7d32);
}

.bank-dashboard__legend-dot--outflow {
    background: var(--error, #c62828);
}

.bank-dashboard__widget--chart .universal-chart__bar-stage {
    min-height: 260px;
}

.bank-dashboard__widget--chart .universal-chart__bar {
    width: 24px;
    border-radius: 12px 12px 4px 4px;
}

/* Файл bank_accounts_dashboard.css */

/* Файл payment_order_templates.css */

.payment-order-templates .driver-panel-content {
    overflow: hidden;
}

.payment-order-templates__layout {
    display: grid;
    height: 100%;
    min-height: 0;
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
    gap: 10px;
}

.payment-order-templates__list,
.payment-order-templates__form,
.payment-order-templates__history {
    padding: 12px;
}

.payment-order-templates__list,
.payment-order-templates__editor {
    min-height: 0;
    overflow: auto;
}

.payment-order-templates__section-header,
.payment-order-templates__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.payment-order-templates__section-header h3,
.payment-order-templates__history h3 {
    margin: 0;
}

.payment-order-templates__items {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-top: 10px;
}

.payment-order-templates__item {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 4px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: var(--border_radius);
    background: var(--bg-1);
    color: var(--text-1);
    text-align: left;
    cursor: pointer;
}

.payment-order-templates__item.is-active {
    border-color: var(--primary-color);
    background: var(--bg-2);
}

.payment-order-templates__item span,
.payment-order-templates__section-header span,
.payment-order-templates__counterparty span {
    color: var(--text-3);
    font-size: var(--font_size__0);
}

.payment-order-templates__editor {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.payment-order-templates__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.payment-order-templates__grid label {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 5px;
}

.payment-order-templates__grid input,
.payment-order-templates__grid select,
.payment-order-templates__grid textarea {
    width: 100%;
    min-width: 0;
}

.payment-order-templates__grid textarea {
    min-height: 86px;
    resize: vertical;
}

.payment-order-templates__wide {
    grid-column: 1 / -1;
}

.payment-order-templates__weekdays {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.payment-order-templates__weekdays label {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
}

.payment-order-templates__tax {
    margin-top: 12px;
    padding: 10px;
}

.payment-order-templates__tax summary {
    cursor: pointer;
    font-weight: 600;
}

.payment-order-templates__counterparty {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 12px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: var(--border_radius);
}

.payment-order-templates__history-scroll {
    overflow: auto;
    max-height: 260px;
}

.payment-order-templates__history table {
    width: 100%;
    border-collapse: collapse;
}

.payment-order-templates__history th,
.payment-order-templates__history td {
    padding: 7px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.payment-order-templates__empty {
    padding: 14px;
    color: var(--text-3);
    text-align: center;
}

@media (orientation: portrait), (max-width: 900px) {
    .payment-order-templates__layout {
        display: flex;
        flex-direction: column;
    }

    .payment-order-templates__list {
        max-height: 220px;
    }

    .payment-order-templates__grid {
        grid-template-columns: 1fr;
    }

    .payment-order-templates__wide {
        grid-column: auto;
    }
}

/* Файл window_operation_details.css */

.window-operation-details {
    width: 100%;
    padding: 18px 20px 20px;
    box-sizing: border-box;
    color: #1f2937;
    background: linear-gradient(180deg, #f7f9fc 0%, #eef3f9 100%);
}

.window-operation-details *,
.window-operation-details *::before,
.window-operation-details *::after {
    box-sizing: border-box;
}

.window-operation-details .operation-grid {
    display: grid;
    grid-template-columns: minmax(320px, 1fr) 160px minmax(360px, 1.1fr);
    gap: 18px;
    align-items: start;
    min-height: 0;
}

.window-operation-details .operation-form-block,
.window-operation-details .house-details-files {
    margin-top: var(--font_size_10);
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid #d8e2ef;
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 10px 28px rgba(32, 70, 117, 0.08);
}

.window-operation-details .operation-form-block {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.window-operation-details .house-details-subtitle {
    display: block;
    font-weight: 700;
    color: #24496f;
    margin-bottom: 2px;
}

.window-operation-details label {
    color: #37516d;
    font-weight: 600;
}

.window-operation-details input,
.window-operation-details select,
.window-operation-details textarea {
    width: 100%;
    border: 1px solid #c8d5e6;
    border-radius: 12px;
    background: #fff;
    color: #1f2937;
    line-height: 1.3;
    padding: 10px 12px;
    outline: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.window-operation-details input:hover,
.window-operation-details select:hover,
.window-operation-details textarea:hover {
    border-color: #9eb6d1;
}

.window-operation-details input:focus,
.window-operation-details select:focus,
.window-operation-details textarea:focus {
    border-color: #4a90e2;
    box-shadow: 0 0 0 4px rgba(74, 144, 226, 0.14);
}

.window-operation-details button {
    border: none;
    border-radius: 999px;
    cursor: pointer;
    font-weight: 700;
    transition: transform 0.16s ease, box-shadow 0.16s ease, opacity 0.16s ease;
}

.window-operation-details button:hover {
    transform: translateY(-1px);
}

.window-operation-details .house-details-upload {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 16px;
    border: 1.5px dashed #87a9cf;
    border-radius: 16px;
    background: linear-gradient(180deg, #fafdff 0%, #f2f7fc 100%);
    color: #3f6a92;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    user-select: none;
    transition:
        border-color 0.18s ease,
        background 0.18s ease,
        box-shadow 0.18s ease,
        transform 0.18s ease;
}

.window-operation-details .house-details-upload:hover {
    border-color: #4a90e2;
    background: linear-gradient(180deg, #ffffff 0%, #edf5fc 100%);
    box-shadow: 0 10px 18px rgba(74, 144, 226, 0.12);
    transform: translateY(-1px);
}

.window-operation-details .house-details-upload input[type="file"] {
    display: none;
}

.window-operation-details .empty-text,
.window-operation-details .attachments-empty {
    color: #8a97a8;
    font-style: italic;
    padding: 10px 2px;
}


@media (max-width: 1200px) {
    .window-operation-details .operation-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .window-operation-details {
        padding: 12px;
    }

    .window-operation-details .operation-form-block,
    .window-operation-details .house-details-files {
        padding: 14px;
        border-radius: 14px;
    }

    .window-operation-details input,
    .window-operation-details select,
    .window-operation-details textarea {
        padding: 9px 11px;
    }

    .window-operation-details .document-attachments-item,
    .window-operation-details .attachment-item {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* Файл warehouse_accounting.css */

.warehouse-accounting,
.warehouse-accounting__table-page {
    display: flex;
    width: 100%;
    min-height: 0;
    height: 100%;
    flex-direction: column;
}

.warehouse-accounting__table-page {
    gap: 6px;
    padding-top: 2px;
}

.warehouse-accounting__description {
    display: flex;
    min-height: 52px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 4px;
    padding: 7px 12px;
}

.warehouse-accounting__description-text {
    display: flex;
    min-width: 0;
    align-items: baseline;
    gap: 18px;
}

.warehouse-accounting__description strong {
    flex: 0 0 auto;
    color: var(--text-1);
    font-size: 18px;
}

.warehouse-accounting__description span {
    overflow: hidden;
    color: var(--text-3);
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.warehouse-accounting__table {
    min-height: 320px;
    flex: 1 1 auto;
}

.warehouse-entry-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
    padding: 4px;
}

.warehouse-entry-form__field {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 6px;
}

.warehouse-entry-form__field--wide,
.warehouse-entry-form__notice,
.warehouse-entry-form__actions {
    grid-column: 1 / -1;
}

.warehouse-entry-form__field > span {
    color: var(--text-2);
    font-weight: 600;
}

.warehouse-entry-form__field input,
.warehouse-entry-form__field select,
.warehouse-entry-form__field textarea {
    width: 100%;
    box-sizing: border-box;
}

.warehouse-entry-form__field textarea {
    min-height: 96px;
    resize: vertical;
}

.warehouse-entry-form__notice {
    padding: 10px 12px;
    color: var(--text-3);
}

.warehouse-entry-form__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 6px;
}

@media (max-width: 900px) {
    .warehouse-accounting__description,
    .warehouse-accounting__description-text {
        align-items: flex-start;
        flex-direction: column;
    }

    .warehouse-accounting__description span {
        white-space: normal;
    }

    .warehouse-entry-form {
        grid-template-columns: 1fr;
    }
}

/* Файл auto_payment_orders_panel.css */

.auto-payment-orders-panel .drawer-body {
    padding: var(--font_size__0);
}

.auto-payment-orders-panel__content {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow: auto;
}

.auto-payment-orders-panel__settings,
.auto-payment-orders-panel__history {
    padding: var(--font_size_0);
}

.auto-payment-orders-panel__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--font_size_0);
    flex-wrap: wrap;
}

.auto-payment-orders-panel__header h3,
.auto-payment-orders-panel__history h3 {
    margin: 0;
}

.auto-payment-orders-panel__header p {
    max-width: 760px;
    margin: 4px 0 0;
    color: var(--text-3);
}

.auto-payment-orders-panel__actions {
    display: flex;
    gap: var(--font_size__0);
    flex-wrap: wrap;
}


.auto-payment-orders-panel__settings-table {
    width: 100%;
    height: min(42vh, 430px);
    min-height: 240px;
    margin-top: var(--font_size__0);
}

.auto-payment-orders-panel__table-wrap {
    width: 100%;
    max-width: 100%;
    margin-top: var(--font_size__0);
    overflow: auto;
}

.auto-payment-orders-panel__table {
    width: 100%;
    min-width: 1180px;
    border-collapse: collapse;
}

.auto-payment-orders-panel__table th,
.auto-payment-orders-panel__table td {
    padding: 6px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: middle;
}

.auto-payment-orders-panel__table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bg-2);
}

.auto-payment-orders-panel__table input:not([type='checkbox']),
.auto-payment-orders-panel__table select {
    width: 100%;
    min-width: 90px;
    min-height: 32px;
    box-sizing: border-box;
    padding: 4px 6px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.auto-payment-orders-panel__table td:nth-child(5) input {
    min-width: 360px;
}

@media (orientation: portrait), (max-width: 850px) {
    .auto-payment-orders-panel__actions,
    .auto-payment-orders-panel__actions > * {
        width: 100%;
    }
}

/* Файл 01_styles.css */

/* Файл purchases_and_sales.css */

.purchases-and-sales-root,
.purchases-and-sales-table-page,
.sales-tab-page,
.sale-invoice-page,
.reconciliation-page {
    display: flex;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    overflow: hidden;
    font-size: inherit;
}

.purchases-and-sales-table-page,
.sales-tab-page__table {
    flex: 1;
}

.sales-tab-page {
    gap: 6px;
    padding: 6px;
}

.sales-tab-page__toolbar {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    padding: 7px 9px;
}

.sales-tab-page__table {
    min-height: 0;
}

.sale-invoice-page {
    background: var(--bg-2);
}

.sale-invoice-page__scroll {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: 8px;
    overflow: auto;
    padding: 7px;
}

.sale-invoice-page__actions {
    display: flex;
    flex: 0 0 auto;
    justify-content: flex-end;
    padding: 7px;
    border-top: 1px solid var(--border);
    background: var(--bg-1);
}

.sale-invoice-header,
.sale-invoice-items {
    padding: 10px;
}

.sale-invoice-header__title,
.sale-invoice-items__toolbar,
.sale-invoice-items__totals,
.reconciliation-page__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.sale-invoice-header__title h2,
.sale-invoice-items__toolbar h3,
.sale-products-panel h3 {
    margin: 0;
    font-size: var(--font_size_0);
}

.sale-invoice-header__title > div {
    display: flex;
    gap: 8px;
}

.sale-invoice-header__title label,
.sale-invoice-header__grid label,
.sale-products-panel__form-grid label,
.reconciliation-page__toolbar label {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.sale-invoice-header__title label {
    flex-direction: row;
    align-items: center;
}

.sale-invoice-header__grid,
.sale-products-panel__form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px 10px;
    margin-top: 9px;
}

.sale-invoice-header__wide,
.sale-products-panel__wide {
    grid-column: 1 / -1;
}

.sale-invoice-header input,
.sale-invoice-header select,
.sale-products-panel input,
.sale-products-panel select,
.reconciliation-page input,
.reconciliation-page select,
.sale-invoice-items input,
.sale-invoice-items select {
    min-height: 30px;
    box-sizing: border-box;
    padding: 4px 7px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.sale-invoice-items__table-wrap,
.reconciliation-page__table-wrap {
    width: 100%;
    min-height: 0;
    overflow: auto;
    margin-top: 8px;
}

.sale-invoice-items__table,
.reconciliation-page__table {
    width: 100%;
    border-collapse: collapse;
    background: var(--bg-1);
}

.sale-invoice-items__table {
    min-width: 2050px;
}

/* Файл 02_styles.css */

.sale-invoice-items__table th,
.sale-invoice-items__table td,
.reconciliation-page__table th,
.reconciliation-page__table td {
    padding: 5px;
    border: 1px solid var(--border);
    vertical-align: middle;
}

.sale-invoice-items__table th,
.reconciliation-page__table th {
    position: sticky;
    top: 0;
    background: var(--accent);
    color: var(--bg-1);
    font-size: calc(var(--font_size_0) * .78);
    text-align: center;
    z-index: 2;
}

.sale-invoice-items__table input,
.sale-invoice-items__table select {
    width: 100%;
    min-width: 82px;
}

.sale-invoice-items__table td:first-child input {
    min-width: 240px;
}

.sale-invoice-items__number,
.reconciliation-page__number {
    text-align: right;
    white-space: nowrap;
}

.sale-invoice-items__remove {
    margin: 0;
    padding: 3px 7px;
    border: 1px solid var(--accent-red);
    border-radius: 6px;
    background: var(--bg-1);
    color: var(--accent-red);
    cursor: pointer;
}

.sale-invoice-items__empty,
.reconciliation-page__empty,
.sale-products-panel__empty {
    padding: 18px;
    color: var(--text-3);
    text-align: center;
}

.sale-invoice-items__totals {
    justify-content: flex-end;
    margin-top: 9px;
    font-size: var(--font_size_0);
}

.sale-products-panel .drawer-body {
    padding: 7px;
}

.sale-products-panel__content {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: 0;
    grid-template-columns: minmax(260px, .8fr) minmax(360px, 1.2fr);
    gap: 8px;
}

.sale-products-panel__list,
.sale-products-panel__form {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 8px;
    padding: 9px;
    overflow: hidden;
}

.sale-products-panel__items {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: 5px;
    overflow: auto;
}

.sale-products-panel__item {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    padding: 7px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    cursor: pointer;
}

.sale-products-panel__item > span {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sale-products-panel__item small {
    color: var(--text-3);
}

.reconciliation-page {
    gap: 7px;
    padding: 7px;
}

.reconciliation-page__toolbar {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-end;
    gap: 8px;
    padding: 8px;
    flex-wrap: wrap;
}

.reconciliation-page__toolbar label:first-child {
    min-width: 280px;
    flex: 1;
}

.reconciliation-page__actions {
    display: flex;
    gap: 6px;
    margin-left: auto;
}

.reconciliation-page__content {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: 8px;
    padding: 9px;
    overflow: hidden;
}

.reconciliation-page__summary {
    justify-content: flex-start;
    flex-wrap: wrap;
}

/* Файл 03_styles.css */

.reconciliation-page__summary span {
    padding: 5px 8px;
    border-radius: 7px;
    background: var(--bg-2);
}

@media (max-width: 900px) {
    .sale-invoice-header__grid,
    .sale-products-panel__form-grid,
    .sale-products-panel__content {
        grid-template-columns: 1fr;
    }

    .sale-products-panel__content {
        overflow: auto;
    }

    .sale-products-panel__list,
    .sale-products-panel__form {
        overflow: visible;
    }

    .reconciliation-page__actions {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }
}

/* Компактная форма счёта-фактуры в виде единого документа. */

.sale-invoice-page {
    font-size: calc(var(--font_size_0) * .76);
}

.sale-invoice-page__scroll {
    padding: 6px;
}

.sale-invoice-document {
    display: flex;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    flex-direction: column;
    padding: 10px;
    border: 1px solid var(--border);
    background: var(--bg-1);
}

.sale-invoice-header__title {
    padding-bottom: 7px;
    border-bottom: 2px solid var(--text-1);
}

.sale-invoice-header__title h2 {
    font-size: var(--font_size_1);
}

.sale-invoice-header__title label,
.sale-invoice-header__grid label {
    font-size: calc(var(--font_size_0) * .76);
}

.sale-invoice-header__grid {
    gap: 4px 10px;
    margin-top: 7px;
    padding-bottom: 8px;
}

.sale-invoice-header input,
.sale-invoice-header select,
.sale-invoice-document input,
.sale-invoice-document select {
    min-height: 26px;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: calc(var(--font_size_0) * .76);
}

.sale-invoice-items__toolbar {
    position: relative;
    padding: 7px 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.sale-invoice-items__toolbar h3 {
    font-size: calc(var(--font_size_0) * .88);
}

.sale-invoice-items__toolbar-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

.sale-invoice-items__table-wrap {
    margin-top: 7px;
}

.sale-invoice-items__table {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.sale-invoice-items__table th,
.sale-invoice-items__table td {
    padding: 3px 4px;
    font-size: calc(var(--font_size_0) * .72);
}

.sale-invoice-items__table th {
    min-width: 76px;
    white-space: normal;
}

.sale-invoice-items__table th:first-child,
.sale-invoice-items__table td:first-child {
    min-width: 220px;
}

.sale-invoice-items__table input,
.sale-invoice-items__table select {
    min-width: 72px;
    min-height: 24px;
    padding: 1px 4px;
    font-size: inherit;
}

.sale-invoice-items__table td:first-child input {
    min-width: 210px;
}

.sale-invoice-items__totals {
    margin-top: 7px;
    padding-top: 7px;
    border-top: 2px solid var(--text-1);
    font-size: calc(var(--font_size_0) * .82);
}

.sale-invoice-page__actions {
    gap: 6px;
    padding: 6px;
}

.sale-invoice-columns {
    position: relative;
}

/* Файл 04_styles.css */

.sale-invoice-columns__toggle {
    min-height: 28px;
    margin: 0;
    padding: 4px 9px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--accent-dark);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.sale-invoice-columns__panel {
    position: absolute;
    top: calc(100% + 5px);
    right: 0;
    width: min(390px, 78vw);
    padding: 8px;
    border: 1px solid var(--border);
    background: var(--bg-1);
    box-shadow: var(--shadow);
    z-index: 20;
}

.sale-invoice-columns__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.sale-invoice-columns__header button {
    margin: 0;
    padding: 2px 6px;
    border: 0;
    background: transparent;
    color: var(--text-1);
    cursor: pointer;
}

.sale-invoice-columns__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px 8px;
}

.sale-invoice-columns__list label {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    gap: 5px;
    font-size: calc(var(--font_size_0) * .72);
}

.sale-invoice-columns__list input {
    min-height: 0;
    margin-top: 2px;
}

@media (max-width: 720px) {
    .sale-invoice-columns__list {
        grid-template-columns: 1fr;
    }
}

/* Компактное расположение кнопки и таблицы списка реализаций. */

.sales-tab-page {
    gap: 2px;
    padding: 0 6px 6px;
}

.sales-tab-page__toolbar.block_1 {
    min-height: 0;
    margin: 0;
    padding: 0 0 4px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.sales-tab-page__table {
    min-height: 0;
    margin: 0;
    flex: 1 1 auto;
}

/* Реквизиты счёта-фактуры располагаются одним столбцом. */

.sale-invoice-header__grid {
    grid-template-columns: minmax(320px, 50%);
    justify-content: start;
}

.sale-invoice-header__wide {
    grid-column: auto;
}

/* Таблица счёта-фактуры использует общий размер шрифта приложения. */

.sale-invoice-items__table th,
.sale-invoice-items__table td,
.sale-invoice-items__table input,
.sale-invoice-items__table select {
    font-size: var(--font_size_0);
}

.sale-invoice-page--loading {
    align-items: center;
    justify-content: center;
    color: var(--text-3);
    font-size: var(--font_size_0);
}

/* Компактные поля акта сверки и обычный размер шрифта таблицы. */

.reconciliation-page__toolbar label,
.reconciliation-page__toolbar input,
.reconciliation-page__toolbar select {
    font-size: calc(var(--font_size_0) * .82);
}

.reconciliation-page__toolbar input,
.reconciliation-page__toolbar select {
    min-height: 28px;
    padding: 3px 6px;
}

.reconciliation-page__table th,
.reconciliation-page__table td {
    font-size: var(--font_size_0);
}

@media (orientation: portrait), (max-width: 900px) {
    .sale-invoice-header__grid {
        grid-template-columns: 1fr;
    }
}

/* Заголовок счёта-фактуры: номер и дата находятся слева и равны заголовку по размеру. */

.sale-invoice-header__title {
    justify-content: flex-start;
    flex-wrap: wrap;
}

.sale-invoice-header__title > div {
    align-items: center;
    justify-content: flex-start;
    margin-left: 0;
}

/* Файл 05_styles.css */

.sale-invoice-header__title h2,
.sale-invoice-header__title label,
.sale-invoice-header__title input {
    font-size: var(--font_size_1);
    font-weight: 700;
}

.sale-invoice-header__title input {
    min-height: 34px;
}

.sale-invoice-header__title label:first-child input {
    width: 220px;
}

.sale-invoice-header__title label:last-child input {
    width: 185px;
}

/* В альбомном режиме поле располагается справа от наименования реквизита. */

.sale-invoice-header__grid {
    width: 50%;
    min-width: 560px;
    grid-template-columns: 1fr;
}

.sale-invoice-header__grid label {
    display: grid;
    grid-template-columns: minmax(210px, 42%) minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    font-size: var(--font_size_0);
}

.sale-invoice-header__grid input,
.sale-invoice-header__grid select {
    width: 100%;
    font-size: var(--font_size_0);
}

@media (orientation: portrait), (max-width: 900px) {
    .sale-invoice-header__grid {
        width: 100%;
        min-width: 0;
    }

    .sale-invoice-header__grid label {
        display: flex;
        align-items: stretch;
        flex-direction: column;
        gap: 3px;
    }

    .sale-invoice-header__title > div {
        width: 100%;
        flex-wrap: wrap;
    }
}

/* Таблица объектов управления использует тот же размер шрифта,
   что и таблицы остальных вкладок конфигурации «Бух». */

.purchases-and-sales-root
.table-widget {
    font-size: inherit;
}

/* Акт сверки без лишних вертикальных промежутков. */

.reconciliation-page {
    gap: 3px;
    padding: 0 6px 6px;
}

.reconciliation-page__toolbar.block_1 {
    margin: 0;
    padding: 3px 6px 5px;
}

.reconciliation-page__toolbar label:first-child,
.reconciliation-page__toolbar label:nth-child(2) {
    min-width: 230px;
    flex: 1 1 260px;
}

.reconciliation-page__content.block_1 {
    margin: 0;
    padding: 5px 7px 7px;
    gap: 4px;
}

.reconciliation-page__table-wrap {
    flex: 1 1 auto;
    margin-top: 0;
}

/* Счёт-фактура полностью помещается в контейнер вкладки. */

.sale-invoice-page__scroll {
    overflow-x: hidden;
    overflow-y: auto;
}

.sale-invoice-document {
    max-width: 100%;
    overflow: hidden;
}

.sale-invoice-header__title {
    justify-content: space-between;
}

.sale-invoice-header__grid {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    grid-template-columns: repeat(2, minmax(280px, 1fr));
}

.sale-invoice-items__table-wrap {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
}

.sale-invoice-items__table {
    max-width: none;
}

.sale-invoice-columns__section-title {
    display: block;
    margin: 9px 0 5px;
    padding-top: 7px;
    border-top: 1px solid var(--border);
    font-size: calc(var(--font_size_0) * .78);
}

@media (max-width: 1050px) {
    .sale-invoice-header__grid {
        grid-template-columns: 1fr;
    }
}

/* Таблица объектов управления использует типографику остальных TableWidget. */

.purchases-and-sales-root .table-widget,
.purchases-and-sales-root .data-table,
.purchases-and-sales-root .data-table th,
.purchases-and-sales-root .data-table td,
.purchases-and-sales-root .header-content,
.purchases-and-sales-root .cell-content {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: inherit !important;
}

/* Файл 06_styles.css */

/* Форма реализации повторяет компоновку бумажного счёта-фактуры. */

.sale-invoice-page__scroll {
    display: block;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.sale-invoice-document {
    width: 100%;
    min-width: 0;
    min-height: max-content;
    flex: 0 0 auto;
    overflow: visible;
}

.sale-invoice-header__title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 12px;
}

.sale-invoice-header__identity {
    display: flex;
    min-width: 0;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.sale-invoice-header__identity h2 {
    margin: 0;
    white-space: nowrap;
}

.sale-invoice-header__identity label {
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 5px;
    font-size: var(--font_size_0);
    font-weight: 600;
}

.sale-invoice-header__identity label:first-of-type input {
    width: 190px;
}

.sale-invoice-header__identity label:last-of-type input {
    width: 155px;
}

.sale-invoice-header__grid {
    display: grid;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    grid-template-columns: 1fr;
    gap: 4px;
}

.sale-invoice-header__grid label {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(260px, 34%) minmax(0, 1fr);
    align-items: center;
    gap: 8px;
}

.sale-invoice-header__grid input,
.sale-invoice-header__grid select {
    width: 100%;
    min-width: 0;
}

.sale-invoice-items__table-wrap {
    width: 100%;
    max-width: 100%;
    min-height: 120px;
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-gutter: stable;
}

.sale-invoice-items__table {
    width: max-content;
    min-width: 100%;
    max-width: none;
}

@media (max-width: 900px), (orientation: portrait) {
    .sale-invoice-header__title {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .sale-invoice-header__identity {
        width: 100%;
    }

    .sale-invoice-header__grid label {
        display: flex;
        align-items: stretch;
        flex-direction: column;
        gap: 3px;
    }
}

/* Прокрутка охватывает всю форму реализации, включая таблицу товаров. */

.sale-invoice-page__scroll {
    height: 100%;
    max-height: 100%;
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto;
}

.sale-invoice-document {
    min-height: auto;
    margin: 0;
}

.sale-invoice-items__toolbar,
.sale-invoice-items__table-wrap,
.sale-invoice-items__totals {
    flex: 0 0 auto;
}

.reconciliation-page__mode {
    flex: 0 0 170px;
}

/* Панель продаж и действия сформированной реализации. */

.sales-tab-page__toolbar {
    gap: var(--font_size__0);
    flex-wrap: wrap;
}

.sale-invoice-page__actions {
    align-items: center;
    gap: var(--font_size__0);
    flex-wrap: wrap;
}

.sale-invoice-page__format {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
}

/* Файл 07_styles.css */

.sale-invoice-page__format select {
    min-height: 32px;
    box-sizing: border-box;
    padding: 3px var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
}

/* Компактные столбцы строк реализации и адаптивное карточное представление. */

.sale-invoice-items__table-wrap {
    width: calc(100% + 8px);
    max-width: calc(100% + 8px);
    margin-right: -8px;
}

.sale-invoice-items__table th,
.sale-invoice-items__table td {
    box-sizing: border-box;
}

.sale-invoice-items__table input,
.sale-invoice-items__table select {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.sale-invoice-items__column--name {
    width: 240px;
    min-width: 240px !important;
}

.sale-invoice-items__column--article {
    width: 90px;
    min-width: 90px !important;
}

.sale-invoice-items__column--product-code {
    width: 110px;
    min-width: 110px !important;
}

.sale-invoice-items__column--unit-code {
    width: 76px;
    min-width: 76px !important;
}

.sale-invoice-items__column--unit {
    width: 78px;
    min-width: 78px !important;
}

.sale-invoice-items__column--quantity {
    width: 94px;
    min-width: 94px !important;
}

.sale-invoice-items__column--price {
    width: 102px;
    min-width: 102px !important;
}

.sale-invoice-items__column--excise,
.sale-invoice-items__column--vat-rate,
.sale-invoice-items__column--country-code {
    width: 96px;
    min-width: 96px !important;
}

.sale-invoice-items__column--amount {
    width: 128px;
    min-width: 128px !important;
}

.sale-invoice-items__column--country,
.sale-invoice-items__column--customs {
    width: 170px;
    min-width: 170px !important;
}

.sale-invoice-items__column--actions {
    width: 42px;
    min-width: 42px !important;
    text-align: center;
}

@media (orientation: portrait), (max-width: 760px) {
    .sale-invoice-items__table-wrap {
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        overflow: visible;
    }

    .sale-invoice-items__table,
    .sale-invoice-items__table tbody {
        display: block;
        width: 100%;
        min-width: 0;
    }

    .sale-invoice-items__table thead {
        display: none;
    }

    .sale-invoice-items__table tbody tr:not(.sale-invoice-items__empty-row) {
        display: grid;
        width: 100%;
        box-sizing: border-box;
        grid-template-columns: 1fr;
        gap: 5px;
        margin-bottom: var(--font_size__0);
        padding: var(--font_size__0);
        border: 1px solid var(--border);
        border-radius: var(--font_size__0);
        background: var(--bg-1);
    }

    .sale-invoice-items__table tbody td {
        display: grid;
        width: 100% !important;
        min-width: 0 !important;
        grid-template-columns: minmax(120px, 38%) minmax(0, 1fr);
        align-items: center;
        gap: var(--font_size__0);
        padding: 3px 0;
        border: 0;
        text-align: left;
    }

    .sale-invoice-items__table tbody td::before {
        content: attr(data-label);
        color: var(--text-3);
        font-weight: 700;
    }

    .sale-invoice-items__table tbody td.sale-invoice-items__column--actions {
        display: flex;
        justify-content: flex-end;
    }

    .sale-invoice-items__table tbody td.sale-invoice-items__column--actions::before {
        display: none;
    }

    .sale-invoice-items__empty-row,
    .sale-invoice-items__empty-row td {
        display: block;
        width: 100%;
    }

    .sale-invoice-items__empty-row td::before {
        display: none;
    }
}

/* Файл 08_styles.css */

.purchases-and-sales-table-page__toolbar {
    display: flex;
    flex: 0 0 auto;
    justify-content: flex-end;
    padding: var(--font_size__0);
}

.purchases-and-sales-table-page__table {
    min-height: 0;
    flex: 1 1 auto;
}

/* Файл purchases_and_sales.css */

/* Файл 01_styles.css */

/* Файл accounting.css */

/* Файл accounting.css */

.accounting-tab-root,
.accounting-report-page,
.accounting-entries {
    display: flex;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    overflow: hidden;
}

.accounting-report-page {
    gap: 6px;
    padding: 2px 6px 6px;
    font-size: calc(var(--font_size_0) * .86);
}

.accounting-report-page > .block_1,
.accounting-report-page .accounting-report.block_1,
.accounting-journal > .block_1 {
    margin: 0;
}

.accounting-report-page__toolbar {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 10px;
}

.accounting-report-page__toolbar label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--font_size_0);
}

.accounting-report-page__toolbar input {
    min-height: 34px;
    padding: 0 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: inherit;
}

.accounting-report-page__toolbar > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.accounting-report-page__status {
    display: flex;
    min-height: 30px;
    box-sizing: border-box;
    flex: 0 0 auto;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 16px;
    padding: 5px 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
    font-size: calc(var(--font_size_0) * .82);
}

.accounting-report-page__status--ok {
    border-color: var(--accent);
}

.accounting-report-page__status--warning {
    border-color: var(--accent-yellow-border);
}

.accounting-report-page__status span:first-child {
    font-weight: 700;
}

.accounting-report-page__warnings {
    display: grid;
    flex: 0 0 auto;
    gap: 4px;
    padding: 7px 10px;
    border-color: var(--accent-yellow-border);
    font-size: calc(var(--font_size_0) * .78);
}

.accounting-report-page__scroll {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    padding-right: 4px;
}

.accounting-report {
    padding: 10px;
}

.accounting-report h2,
.accounting-report h3 {
    margin: 0;
}

.accounting-report h2 {
    margin-bottom: 10px;
    font-size: var(--font_size_1);
}

.accounting-report h3 {
    padding: 8px 10px;
    border-radius: 10px 10px 0 0;
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size_0);
    text-align: center;
}

/* Файл 02_styles.css */


.accounting-report__balance-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.accounting-report__side {
    min-width: 0;
}

.accounting-report__columns {
    display: grid;
    min-height: 32px;
    grid-template-columns: minmax(0, 1fr) 70px 130px;
    align-items: center;
    gap: 8px;
    padding: 5px 10px;
    border: 1px solid var(--border);
    border-top: 0;
    background: var(--bg-2);
    color: var(--accent-dark);
    font-size: calc(var(--font_size_0) * .78);
    font-weight: 700;
}

.accounting-report__columns span:nth-child(2) {
    text-align: center;
}

.accounting-report__columns span:last-child {
    text-align: right;
}

.accounting-report__section {
    overflow: hidden;
    margin-bottom: 8px;
    border: 1px solid var(--border);
    border-radius: 10px;
}

.accounting-report__section-title {
    padding: 7px 10px;
    background: var(--bg-2);
    color: var(--accent-dark);
    font-weight: 700;
}

.accounting-report__row {
    display: grid;
    width: 100%;
    min-height: 38px;
    grid-template-columns: minmax(0, 1fr) 70px 130px;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 6px 10px;
    border: 0;
    border-top: 1px solid var(--border);
    border-radius: 0;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: calc(var(--font_size_0) * .84);
    text-align: left;
    cursor: pointer;
}

.accounting-report__row:hover {
    background: var(--bg-2);
    color: var(--text-1);
    transform: none;
}

.accounting-report__row--total {
    background: rgba(47, 117, 181, 0.1);
    font-weight: 700;
}

.accounting-report__row--subsection {
    padding-left: 22px;
    font-style: italic;
}

.accounting-report__name {
    min-width: 0;
    overflow-wrap: anywhere;
}

.accounting-report__code {
    min-width: 0;
    color: var(--text-2);
    text-align: center;
}

.accounting-report__value {
    min-width: 0;
    text-align: right;
    white-space: nowrap;
}

.accounting-entries {
    gap: 4px;
    padding: 4px 6px 6px;
}

.accounting-entries__header {
    display: flex;
    min-height: 30px;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px 18px;
    padding: 4px 8px;
    font-size: calc(var(--font_size_0) * .82);
}

.accounting-entries__header span:first-child {
    font-weight: 700;
}

.accounting-entries__header span:last-child {
    color: var(--text-2);
}

.accounting-entries__table {
    min-height: 0;
    flex: 1;
}

.accounting-line-editor-panel .drawer-body,
.accounting-chart-panel .drawer-body,
.accounting-entry-source-panel .drawer-body {
    padding: 8px;
}

/* Файл 03_styles.css */

.accounting-line-editor {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: 0;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 7px;
    overflow: hidden;
}

.accounting-line-editor__tools {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 6px;
    padding: 7px;
    overflow-y: auto;
    font-size: calc(var(--font_size_0) * .78);
}

.accounting-line-editor__standard {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--border);
}

.accounting-line-editor__standard small {
    color: var(--text-2);
    line-height: 1.25;
}

.accounting-line-editor__switch,
.accounting-line-editor__form-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}

.accounting-line-editor__tools button {
    min-height: 30px;
    margin: 0;
    padding: 4px 7px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--accent-dark);
    font-size: calc(var(--font_size_0) * .78);
    cursor: pointer;
}

.accounting-line-editor__tools button.active,
.accounting-line-editor__tools button.primary {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.accounting-line-editor__tools label {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.accounting-line-editor__tools input,
.accounting-line-editor__tools select,
.accounting-line-editor__tools textarea {
    width: 100%;
    min-height: 29px;
    box-sizing: border-box;
    padding: 4px 6px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: calc(var(--font_size_0) * .78);
}

.accounting-line-editor__tools textarea {
    min-height: 56px;
    resize: vertical;
}

.accounting-line-editor__canvas {
    min-width: 0;
    min-height: 0;
    overflow: auto;
    padding: 2px;
}

.accounting-line-editor__balance {
    display: grid;
    grid-template-columns: repeat(2, minmax(330px, 1fr));
    gap: 7px;
}

.accounting-line-editor__column {
    min-width: 0;
}

.accounting-line-editor__column > h3 {
    margin: 0 0 8px;
    padding: 5px 7px;
    border-radius: 7px;
    background: var(--accent);
    color: var(--bg-1);
    font-size: calc(var(--font_size_0) * .78);
    text-align: center;
}

.accounting-line-editor__section {
    overflow: hidden;
    margin-bottom: 5px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
}

.accounting-line-editor__section-title {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0;
    padding: 5px 7px;
    border: 0;
    border-radius: 0;
    background: var(--bg-2);
    color: var(--accent-dark);
    font-size: calc(var(--font_size_0) * .78);
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

/* Файл 04_styles.css */


.accounting-line-editor__line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    border-top: 1px solid var(--border);
    background: var(--bg-1);
}

.accounting-line-editor__line--active {
    background: rgba(47, 117, 181, 0.12);
}

.accounting-line-editor__line > button {
    display: flex;
    width: 100%;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0;
    padding: 5px 7px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text-1);
    font-size: calc(var(--font_size_0) * .78);
    text-align: left;
    cursor: pointer;
}

.accounting-line-editor__line:hover {
    background: rgba(47, 117, 181, 0.08);
}

.accounting-line-editor__line small {
    flex: 0 0 auto;
    color: var(--text-2);
}

.accounting-line-editor__visibility {
    display: flex;
    align-items: center;
    gap: 4px;
    padding-right: 7px;
    color: var(--text-2);
    font-size: calc(var(--font_size_0) * .68);
    white-space: nowrap;
}

.accounting-line-editor__visibility input,
.accounting-line-editor__form-visibility input {
    width: auto;
    min-height: 0;
    margin: 0;
}

.accounting-line-editor__form-visibility {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 7px !important;
}

.accounting-chart {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    gap: 6px;
}

.accounting-chart__notice {
    flex: 0 0 auto;
    padding: 8px 10px;
    font-size: var(--font_size_0);
    font-weight: 700;
}

.accounting-chart__table {
    min-height: 0;
    flex: 1;
}

.accounting-journal {
    display: flex;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    align-content: flex-start;
    gap: 6px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 2px 6px 6px;
}

.accounting-journal__form {
    flex: 0 0 auto;
    padding: 6px 8px;
}

.accounting-journal__form-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
}

.accounting-journal__form-header > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.accounting-journal__form-header strong {
    font-size: calc(var(--font_size_0) * .92);
}

.accounting-journal__form-header span {
    color: var(--text-2);
    font-size: calc(var(--font_size_0) * .72);
}


/* Файл 05_styles.css */

.accounting-journal__fields {
    display: grid;
    grid-template-columns: repeat(5, minmax(130px, 1fr));
    gap: 4px 7px;
}

.accounting-journal__fields label {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
    font-size: calc(var(--font_size_0) * .76);
}

.accounting-journal__fields input,
.accounting-journal__fields select {
    width: 100%;
    min-height: 27px;
    box-sizing: border-box;
    padding: 2px 6px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: calc(var(--font_size_0) * .82);
}

.accounting-journal__wide {
    grid-column: span 2;
}

.accounting-journal__table {
    width: 100%;
    height: clamp(400px, 58vh, 620px);
    min-height: 400px;
    flex: 0 0 auto;
}

.accounting-entry-source {
    padding: 8px;
}

.accounting-entry-source__notice {
    margin-bottom: 7px;
    color: var(--text-2);
}

.accounting-entry-source__grid {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.accounting-entry-source__row {
    display: grid;
    grid-template-columns: minmax(170px, 34%) minmax(0, 1fr);
    gap: 8px;
    padding: 6px 8px;
    border-bottom: 1px solid var(--border);
}

.accounting-entry-source__row:last-child {
    border-bottom: 0;
}

.accounting-entry-source__row strong {
    color: var(--accent-dark);
}

.accounting-entry-source__row span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.accounting-entry-source__empty {
    padding: 20px;
    color: var(--text-2);
    text-align: center;
}

.accounting-entry-source-panel--sale .drawer-body {
    overflow: hidden;
}

@media (max-width: 1250px) {
    .accounting-journal__fields {
        grid-template-columns: repeat(3, minmax(150px, 1fr));
    }
}

@media (max-width: 960px) {
    .accounting-report__balance-grid,
    .accounting-line-editor__balance {
        grid-template-columns: 1fr;
    }

    .accounting-line-editor {
        grid-template-columns: 1fr;
        overflow: auto;
    }

    .accounting-line-editor__tools,
    .accounting-line-editor__canvas {
        overflow: visible;
    }
}

@media (orientation: portrait), (max-width: 720px) {
    .accounting-report-page__toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .accounting-report-page__toolbar > div {
        justify-content: flex-start;
    }

    .accounting-report__columns,
    .accounting-report__row {
        grid-template-columns: minmax(0, 1fr) 60px 92px;
    }

    .accounting-entries__header {
        align-items: flex-start;
        flex-direction: column;
        gap: 2px;
    }

    .accounting-journal__fields {
        grid-template-columns: 1fr;
    }

    .accounting-journal__wide {
        grid-column: auto;
    }

    .accounting-journal__table {
        height: 60vh;
        min-height: 360px;
    }

    .accounting-entry-source__row {
        grid-template-columns: 1fr;
        gap: 2px;
    }
}

/* Файл 06_styles.css */


/* Настройка столбцов проводок и задолженность поставщикам. */

.accounting-journal__table-toolbar {
    display: flex;
    flex: 0 0 auto;
    justify-content: flex-end;
    padding: 0 4px 4px;
}

.accounting-entries__header {
    align-items: center;
}

.accounting-entries__header > :last-child {
    margin-left: auto;
}

.accounting-supplier-debts {
    height: 100%;
}

/* Раскрытие детализации кредиторской задолженности. */

.accounting-report__expand-marker {
    display: inline-block;
    width: 16px;
    margin-right: 3px;
    color: var(--accent);
    font-weight: 700;
}

/* Файл accounting.css */

/* Файл usn.css */

.usn-page {
    display: flex;
    flex-direction: column;
}

.usn-page > .block_1 {
    min-width: 0;
    margin: 0;
}

.usn-page__grid {
    display: grid;
    gap: var(--font_size__0);
}

.usn-page__grid--small {
    margin-top: var(--font_size__0);
}

.usn-page__calculation {
    display: flex;
    min-height: 0;
    flex: 0 0 auto;
    flex-direction: column;
    gap: var(--font_size__0);
}

.usn-page__period-wrap {
    width: 100%;
    min-height: 0;
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-gutter: stable;
}

.usn-page__period-table {
    width: 100%;
    min-width: 760px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--font_size_0);
}

.usn-page__period-table thead {
    position: sticky;
    top: 0;
    z-index: 2;
}

.usn-page__period-table th,
.usn-page__period-table td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.usn-page__period-table th {
    background: var(--bg-2);
    color: var(--blue-navy);
    font-weight: 700;
    box-shadow: inset 0 -1px 0 var(--border);
}

.usn-page__period-table td {
    background: var(--bg-1);
}

.usn-page__period-table td input {
    width: 100%;
    min-width: 110px;
}

.usn-page__actions {
    margin-top: 0;
    justify-content: flex-end;
}

@media (max-aspect-ratio: 1 / 1), (max-width: 900px) {
    .usn-page__actions {
        flex-direction: column;
    }

    .usn-page__actions .btn {
        width: 100%;
    }

    .usn-page__period-table {
        min-width: 680px;
    }
}

/* Файл taxes_and_tax_reporting.css */

.taxes-and-reporting-root,
.tax-object-tabs,
.tax-object-tabs > .tab-widget-container,
.tax-object-tabs .tab-container-left,
.tax-object-tabs .tab-content-wrapper {
    width: 100%;
    height: 100%;
    min-height: 0;
}

.tax-object-tabs {
    display: flex;
    overflow: hidden;
}

.tax-object-tabs .tab-content-wrapper.scrollable
> .tab-content-item.active.scrollable-content {
    min-height: 0;
    overflow: hidden;
}

.taxes-and-reporting-root .tab-content-item {
    min-height: 0;
}

.ndfl-page,
.usn-page {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: calc(var(--font_size__0) / 2);
    box-sizing: border-box;
    padding: calc(var(--font_size__0) / 2) var(--font_size__0);
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
    background: var(--bg-2);
}

.ndfl-page > .block_1,
.usn-page > .block_1 {
    width: 100%;
    min-width: 0;
    margin: 0;
    box-sizing: border-box;
}

.ndfl-page__card {
    background: var(--bg-2);
    color: var(--blue-navy);
}

.ndfl-page__object,
.ndfl-page__settings,
.ndfl-page__table-wrap,
.usn-page__general,
.usn-page__calculation,
.usn-page__signer {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.ndfl-page__object {
    color: var(--text-2);
    font-size: var(--font_size_0);
    line-height: 1.4;
}

.ndfl-page__settings {
    display: flex;
    align-items: end;
    flex-wrap: wrap;
    gap: var(--font_size__0);
}

.ndfl-page__settings-title {
    display: flex;
    min-width: min(260px, 100%);
    flex: 1 1 260px;
    flex-direction: column;
    gap: calc(var(--font_size__0) / 2);
}

.ndfl-page__settings-title h2,
.ndfl-page__settings-title p {
    margin: 0;
}

.ndfl-page__settings-title p {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.ndfl-page__settings label {
    display: flex;
    min-width: 180px;
    flex: 1 1 180px;
    flex-direction: column;
    gap: var(--font_size__0);
}

.ndfl-page__settings label > span {
    color: var(--text-3);
    font-size: var(--font_size_0);
    font-weight: 600;
}

.ndfl-page__settings select,
.ndfl-page__settings input {
    width: 100%;
    min-width: 0;
    height: calc(var(--font_size_10) + var(--font_size__0));
    padding: 0 var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--blue-navy);
    font: inherit;
    font-size: var(--font_size_0);
    box-sizing: border-box;
}

.ndfl-page__table-wrap {
    display: flex;
    min-height: 360px;
    flex: 0 0 auto;
    flex-direction: column;
    gap: var(--font_size__0);
}

.ndfl-page__table-widget {
    min-height: clamp(320px, 52dvh, 680px);
}

.ndfl-page__table-widget-content {
    min-height: 280px;
    flex: 1 1 auto;
}

.tax-reference-page__note {
    flex: 0 0 auto;
}

.tax-reference-page__table-wrap {
    gap: var(--font_size__0);
}

.tax-reference-page__table-scroll {
    min-height: 0;
}

.tax-reference-page__table {
    width: 100%;
    min-width: 1180px;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    font-size: var(--font_size_0);
}

.tax-reference-page__table thead {
    position: sticky;
    top: 0;
    z-index: 4;
}

.tax-reference-page__table th,
.tax-reference-page__table td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
    vertical-align: top;
    background-clip: padding-box;
}

.tax-reference-page__table th {
    background: var(--bg-2);
    color: var(--blue-navy);
    font-size: var(--font_size_0);
    font-weight: 700;
    line-height: 1.2;
    overflow-wrap: anywhere;
    white-space: normal;
    box-shadow: inset 0 -1px 0 var(--border);
}

.tax-reference-page__table td {
    background: var(--bg-1);
}

.tax-reference-page__table th:nth-child(1),
.tax-reference-page__table td:nth-child(1) {
    width: 110px;
}

.tax-reference-page__table th:nth-child(2),
.tax-reference-page__table td:nth-child(2),
.tax-reference-page__table th:nth-child(3),
.tax-reference-page__table td:nth-child(3) {
    width: 150px;
}

.tax-reference-page__table th:nth-child(4),
.tax-reference-page__table td:nth-child(4) {
    width: 125px;
}

.tax-reference-page__table th:nth-child(5),
.tax-reference-page__table td:nth-child(5),
.tax-reference-page__table th:nth-child(6),
.tax-reference-page__table td:nth-child(6) {
    width: 180px;
}

.tax-reference-page__table th:nth-child(7),
.tax-reference-page__table td:nth-child(7) {
    width: 115px;
}

.tax-reference-page__table th:nth-child(8),
.tax-reference-page__table td:nth-child(8) {
    width: 110px;
}

.tax-reference-page__table input,
.tax-reference-page__table select {
    width: 100%;
    min-width: 0;
    height: calc(var(--font_size_10) + var(--font_size__0));
    box-sizing: border-box;
    font-size: var(--font_size_0);
}

.tax-reference-page__table td:last-child .btn {
    width: 100%;
}

@media (max-aspect-ratio: 1 / 1), (max-width: 980px) {
    .ndfl-page,
    .usn-page {
        padding-right: calc(var(--font_size_0) + 4px);
    }

    .ndfl-page__settings {
        align-items: stretch;
    }

    .ndfl-page__settings > .btn {
        width: 100%;
    }

    .ndfl-page__table-widget {
        min-height: clamp(300px, 46dvh, 600px);
    }
}

/* Файл auto_payment_order_details.css */

.counterparty-payment-details {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.counterparty-payment-details__section {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding: 1rem;
}

.counterparty-payment-details__section h3 {
    margin: 0;
}

.counterparty-payment-details__section > label,
.counterparty-payment-details__grid label {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.counterparty-payment-details__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem 1rem;
}

.counterparty-payment-details__wide {
    grid-column: 1 / -1;
}

.counterparty-payment-details input:not([type='checkbox']),
.counterparty-payment-details select,
.counterparty-payment-details textarea {
    width: 100%;
    box-sizing: border-box;
}

.counterparty-payment-details textarea {
    min-height: 6.5rem;
    resize: vertical;
}

.counterparty-payment-details__checkbox {
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 0.55rem;
}

.counterparty-payment-details__actions {
    display: flex;
    justify-content: flex-end;
}

.auto-payment-orders-panel__history-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.auto-payment-orders-panel__selection {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.auto-payment-orders-panel__table th:first-child,
.auto-payment-orders-panel__table td:first-child {
    width: 3.25rem;
    min-width: 3.25rem;
    text-align: center;
}

@media (orientation: portrait) {
    .counterparty-payment-details__grid {
        grid-template-columns: 1fr;
    }

    .counterparty-payment-details__wide {
        grid-column: auto;
    }
}

/* Файл sale_templates_panel.css */

.sale-templates-panel .drawer-body {
    padding: var(--font_size__0);
}

.sale-templates-panel__layout {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: 0;
    grid-template-columns: minmax(230px, 0.55fr) minmax(560px, 1.9fr);
    gap: var(--font_size__0);
}

.sale-templates-panel__list,
.sale-templates-panel__editor,
.sale-templates-panel__form,
.sale-templates-panel__items,
.sale-templates-panel__history {
    min-width: 0;
    min-height: 0;
}

.sale-templates-panel__list {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.sale-templates-panel__editor {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow: auto;
}

.sale-templates-panel__section-header,
.sale-templates-panel__actions,
.sale-templates-panel__item-title,
.sale-templates-panel__weekdays {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
}

.sale-templates-panel__section-header,
.sale-templates-panel__item-title {
    justify-content: space-between;
}

.sale-templates-panel__section-header h3,
.sale-templates-panel__history h3 {
    margin: 0;
}

.sale-templates-panel__actions {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.sale-templates-panel__template-list,
.sale-templates-panel__items-list {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow: auto;
    margin-top: var(--font_size__0);
}

.sale-templates-panel__template {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    margin: 0;
    padding: var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    text-align: left;
    cursor: pointer;
}

.sale-templates-panel__template.is-active {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(61, 132, 196, 0.12);
}

.sale-templates-panel__template span,
.sale-templates-panel__buyer-info {
    color: var(--text-3);
}

.sale-templates-panel__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--font_size__0);
    margin-top: var(--font_size__0);
}

.sale-templates-panel__grid label {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 4px;
}

.sale-templates-panel__grid input:not([type="checkbox"]),
.sale-templates-panel__grid select {
    width: 100%;
    min-height: 34px;
    box-sizing: border-box;
}

.sale-templates-panel__grid select[multiple] {
    min-height: 110px;
}

.sale-templates-panel__wide {
    grid-column: 1 / -1;
}

.sale-templates-panel__check,
.sale-templates-panel__weekdays label {
    flex-direction: row !important;
    align-items: center;
}

.sale-templates-panel__weekdays {
    flex-wrap: wrap;
}

.sale-templates-panel__item {
    padding: var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
}

.sale-templates-panel__item-title button {
    border: none;
    background: transparent;
    color: var(--accent-red);
    cursor: pointer;
}

.sale-templates-panel__history-scroll {
    width: 100%;
    overflow: auto;
    margin-top: var(--font_size__0);
}

.sale-templates-panel__history table {
    width: 100%;
    border-collapse: collapse;
}

.sale-templates-panel__history th,
.sale-templates-panel__history td {
    padding: var(--font_size__0);
    border: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.sale-templates-panel__history th {
    background: var(--bg-2);
}

.sale-templates-panel__empty {
    padding: var(--font_size_0);
    color: var(--text-3);
    text-align: center;
}

@media (max-width: 1050px) {
    .sale-templates-panel__layout {
        grid-template-columns: 1fr;
        overflow: auto;
    }

    .sale-templates-panel__list {
        max-height: 260px;
    }

    .sale-templates-panel__editor {
        overflow: visible;
    }

    .sale-templates-panel__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .sale-templates-panel__grid {
        grid-template-columns: 1fr;
    }

    .sale-templates-panel__wide {
        grid-column: auto;
    }
}


.sale-templates-panel__attachments {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: var(--border_radius);
    background: var(--bg-2);
}

.sale-templates-panel__attachments strong {
    width: 100%;
}

.sale-templates-panel__attachments label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

/* Файл purchases_table.css */

.purchases-and-sales-table-page {
    display: flex;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    gap: 4px;
    overflow: hidden;
    padding: 0 6px 6px;
}

.purchases-and-sales-table-page__toolbar {
    display: flex;
    min-height: 0;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
}

.purchases-and-sales-table-page__table {
    min-height: 0;
    flex: 1 1 auto;
    margin: 0;
}

.incoming-email-content {
    overflow: visible;
    border: 0;
    background: transparent;
}

.incoming-email-content__header {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 4px;
    border-bottom: 1px solid #edf0f4;
    background: transparent;
}

.incoming-email-content__title {
    margin: 0;
    font-size: var(--font_size_0);
    line-height: 1.45;
}

.incoming-email-content__switch {
    display: inline-flex;
    flex-shrink: 0;
    padding: 2px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-1);
}

.incoming-email-content__switch button {
    min-height: 30px;
    padding: 4px 10px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--text-2);
    font-size: calc(var(--font_size_0) * .82);
    cursor: pointer;
}

.incoming-email-content__switch button.is-active {
    background: var(--accent);
    color: #ffffff;
}

.incoming-email-content__frame {
    display: block;
    width: 100%;
    min-height: 180px;
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    background: #ffffff;
    box-sizing: border-box;
}

.incoming-email-content__plain {
    box-sizing: border-box;
    min-height: 180px;
    margin: 0;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: visible;
    background: #ffffff;
    color: #1f2937;
    font: inherit;
    line-height: 1.45;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.incoming-email-content__security-note {
    padding: 6px 4px;
    color: var(--text-2);
    font-size: calc(var(--font_size_0) * .72);
}

@media (max-width: 680px) {
    .incoming-email-content__header {
        align-items: flex-start;
        flex-direction: column;
    }
}


@media (orientation: portrait) {
    .incoming-email-content__header {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

    .incoming-email-content__title {
        min-width: 0;
        flex: 1 1 auto;
    }

    .incoming-email-content__switch {
        flex: 0 0 auto;
        margin-left: auto;
    }
}

/* Файл DocumentCardRecipientDirectory.css */

.doc-card__recipient-directory {
    display: grid;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid var(--border-color);
    border-radius: var(--border_radius_1);
    background: var(--background);
}

.doc-card__recipient-directory-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 220px);
    gap: 8px;
}

.doc-card__recipient-directory-select {
    width: 100%;
}

@media (max-width: 720px) {
    .doc-card__recipient-directory-controls {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Файл DocumentCardBase.css */

.doc-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    padding-top: var(--font_size_0);
    padding-bottom: var(--font_size_0);
    padding-left: var(--font_size_0);
    padding-right: var(--font_size_0);
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
    background: transparent;
    overflow: hidden;
}

.doc-card__header {
    flex: 0 0 auto;
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 10px;
    padding-left: 2px;
    flex-wrap: wrap;
}

.doc-card__title {
    font-weight: 700;
    font-size: 18px;
    color: #1a1a1a;
    line-height: 1.2;
}

.doc-card__meta {
    color: #8a8f98;
    font-size: 14px;
    line-height: 1.2;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.doc-card__meta-sep {
    color: #c2c7cf;
}

.doc-card__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
}

.doc-card__body::-webkit-scrollbar {
    width: 10px;
}

.doc-card__body::-webkit-scrollbar-track {
    background: transparent;
}

.doc-card__body::-webkit-scrollbar-thumb {
    background: #d7dce3;
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.doc-card__body::-webkit-scrollbar-thumb:hover {
    background: #c2c9d2;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.doc-card__empty {
    padding: 22px 8px 40px 8px;
    color: #a3a8b0;
    font-style: italic;
    font-size: 13px;
}

.doc-card__footer {
    flex: 0 0 auto;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #edf0f4;
    background: transparent;
}
.doc-card__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

/* Одинаковые компактные отступы карточки со всех сторон. */
.doc-card {
    padding: 7px;
}

.doc-card__header {
    margin-bottom: 7px;
    padding: 0;
}

.doc-card__body {
    padding-right: 0;
}

.doc-card__footer {
    margin-top: 6px;
    padding-top: 6px;
}

.doc-card__heading-line {
    display: flex;
    min-width: 0;
    align-items: baseline;
    gap: 10px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.doc-card__meta--heading {
    color: #1a1a1a;
    font-size: 18px;
    font-weight: 700;
}

.doc-card__meta--heading .doc-card__meta-sep {
    color: #1a1a1a;
}

/* Файл DocumentCardRequisites.css */

.doc-card__requisites {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding-top: 10px;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 6px;
    box-sizing: border-box;
}

.doc-card__fields {
    flex: 1 1 auto;
    min-width: 0;
}

.doc-card__table {
    border-collapse: collapse;
    table-layout: auto;
    width: 100%;
}

.doc-card__table tr {
    border-bottom: 1px solid #edf0f4;
}

.doc-card__table tr:last-child {
    border-bottom: none;
}

.doc-card__table td {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 4px;
    padding-right: 4px;
    vertical-align: top;
    line-height: 1.45;
    word-break: break-word;
}

.doc-card__fields > .doc-card__table td.doc-card__label {
    width: 1%;
    padding-right: 22px;
    white-space: nowrap;
}

.doc-card__fields > .doc-card__table td.doc-card__value {
    width: auto;
}

.doc-card__label {
    color: #8d939c;
    font-size: var(--font_size_0);
}

.doc-card__value {
    color: #1f2430;
    font-size: var(--font_size_0);
    font-weight: 500;
}

.doc-card__value--dash {
    color: #c0c5cd;
    font-weight: 400;
}

.doc-card__value--badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
}

.doc-card__value--overdue {
    background: #fff1f1;
    color: #cf3f36;
    border: 1px solid #f3c2be;
}

.doc-card__value--done {
    background: #eefaf0;
    color: #2e7d32;
    border: 1px solid #c6e6c9;
}

.doc-card__value--in-progress {
    background: #fff8e8;
    color: #d18700;
    border: 1px solid #f2dd9b;
}

.doc-card__field-textarea {
    width: 100%;
    border: none;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
    resize: vertical;
    outline: none;
    box-sizing: border-box;
    background: transparent;
    color: #1f2430;
    padding: 0;
    margin: 0;
}

.doc-card__field-number {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    color: #1f2430;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

.doc-card__field-number::-webkit-outer-spin-button,
.doc-card__field-number::-webkit-inner-spin-button {
    margin: 0;
}

.doc-card__field-select {
    width: 100%;
    min-height: 30px;
    padding: 4px 8px;
    border: 1px solid #d0d7de;
    border-radius: 6px;
    background: #ffffff;
    font-size: 13px;
    color: #24292f;
    box-sizing: border-box;
}

.doc-card__field-select:focus {
    outline: none;
    border-color: #0969da;
    box-shadow: 0 0 0 2px rgba(9, 105, 218, 0.15);
}

.doc-card__field-input {
    box-sizing: border-box;
    width: 100%;
    min-height: 34px;
    margin: 0;
    padding: 5px 8px;
    border: 1px solid #d8dee8;
    border-radius: 7px;
    outline: 0;
    background: #ffffff;
    color: #1f2430;
    font: inherit;
    font-size: var(--font_size_0);
    line-height: 1.35;
}

.doc-card__field-input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 15%, transparent);
}

.doc-card__field-input--textarea {
    min-height: 72px;
    resize: vertical;
}

/* Файл DocumentCardRelated.css */

.doc-card__related {
    width: 30%;
    min-width: 260px;
    max-width: 360px;
    flex: 0 0 30%;
    background: #f8f9fb;
    border-radius: 10px;
    padding: 16px;
    align-self: flex-start;
    border: 1px solid #e3e7ed;
    box-sizing: border-box;
}

.doc-card__related-title {
    font-weight: 700;
    font-size: 14px;
    color: #1a1a1a;
    margin-bottom: 14px;
}

.doc-card__related-row {
    margin-bottom: 14px;
}

.doc-card__related-row:last-child {
    margin-bottom: 0;
}

.doc-card__related-label {
    color: #9096a0;
    font-size: var(--font_size_0);
    margin-bottom: 4px;
}

.doc-card__related-link {
    color: #336fd1;
    font-size: 13px;
    cursor: pointer;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    line-height: 1.35;
}

.doc-card__related-link:hover {
    text-decoration: underline;
}

.doc-card__related-none {
    color: #c1c6ce;
    font-size: 13px;
}

.doc-card__related-hint {
    margin-top: 4px;
    color: #8d939c;
    font-size: 12px;
    line-height: 1.35;
}

.doc-card__related-row--stack {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.doc-card__related-row-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.doc-card__related-add-btn {
    border: 1px solid #d8deea;
    background: var(--bg-1);
    color: #42526b;
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    transition: all 0.2s ease;
}

.doc-card__related-add-btn:hover {
    background: #f6f8fc;
    border-color: #c7d1e1;
}

.doc-card__related-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.doc-card__related-item {
    border: 1px solid #e2e8f0;
    background: var(--bg-1);
    border-radius: 10px;
    padding: 8px 10px;
}

.doc-card__related-item-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.doc-card__related-remove-btn {
    width: 24px;
    height: 24px;
    border: 1px solid #d8deea;
    background: var(--bg-1);
    color: #7a869a;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    flex: 0 0 24px;
    transition: all 0.2s ease;
}

.doc-card__related-remove-btn:hover {
    background: #f8fafc;
    color: #42526b;
    border-color: #c7d1e1;
}
/* Файл DocumentCardDistribution.css */

.doc-card__distribution {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.doc-card__distribution-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.doc-card__distribution-title {
    font-size: 16px;
    font-weight: 600;
    color: #25324a;
}

.doc-card__distribution-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.doc-card__distribution-btn {
    border: 1px solid #d8deea;
    background: var(--bg-1);
    color: #42526b;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    transition: all 0.2s ease;
}


.doc-card__distribution-btn:hover {
    background: #f6f8fc;
    border-color: #c7d1e1;
}


.doc-card__distribution-btn--small {
    padding: 6px 10px;
    font-size: 12px;
}


.doc-card__distribution-empty {
    border: 1px dashed #d7deea;
    background: #fafbfd;
    color: #7b8798;
    border-radius: 10px;
    padding: 18px;
    text-align: center;
    font-size: 14px;
}


.doc-card__distribution-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}


.doc-card__recipient-card {
    background: var(--bg-1);
    border: 1px solid #e1e6ef;
    border-radius: 12px;
    padding: 14px;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}


.doc-card__recipient-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}


.doc-card__recipient-card-title-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
}


.doc-card__recipient-card-number {
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: #eef2f8;
    color: #5e6c84;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex: 0 0 24px;
}


.doc-card__recipient-card-menu {
    border: 1px solid #d8deea;
    background: #f8fafc;
    color: #667085;
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 12px;
    line-height: 1.2;
    cursor: pointer;
    transition: all 0.2s ease;
}


.doc-card__recipient-card-menu:hover {
    background: #f1f5f9;
    border-color: #c8d2e1;
}


.doc-card__recipient-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}


.doc-card__recipient-section {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}


.doc-card__recipient-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    background: #f3f5f9;
    border: 1px solid #e1e6ef;
    border-radius: 10px;
}


.doc-card__recipient-section-title {
    font-size: 13px;
    font-weight: 600;
    color: #4d5b75;
}


.doc-card__recipient-section-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}


.doc-card__distribution-line {
    display: flex;
    align-items: center;
    gap: 8px;
}


.doc-card__distribution-input {
    width: 100%;
    min-width: 0;
    border: 1px solid #d8deea;
    background: var(--bg-1);
    color: #25324a;
    border-radius: 8px;
    padding: 9px 12px;
    font-size: 13px;
    line-height: 1.35;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}


.doc-card__distribution-input::placeholder {
    color: #98a2b3;
}


.doc-card__distribution-input:focus {
    border-color: #9bb2d1;
    box-shadow: 0 0 0 3px rgba(58, 123, 213, 0.08);
}

.doc-card__distribution-input--recipient {
    font-weight: 600;
}

.doc-card__distribution-icon-btn {
    width: 32px;
    height: 32px;
    border: 1px solid #d8deea;
    background: var(--bg-1);
    color: #7a869a;
    border-radius: 8px;
    flex: 0 0 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    transition: all 0.2s ease;
}

.doc-card__distribution-icon-btn:hover {
    background: #f8fafc;
    color: #42526b;
    border-color: #c7d1e1;
}
.doc-card__distribution-mode-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.doc-card__distribution-mode {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
    color: var(--text-1);
    cursor: pointer;
}

.doc-card__distribution-mode--active {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 8%, var(--bg-1));
}

.doc-card__distribution-mode input {
    margin-top: 3px;
    accent-color: var(--accent);
}

.doc-card__distribution-mode span {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.doc-card__distribution-mode strong {
    font-size: var(--font_size_0);
}

.doc-card__distribution-mode small {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

@media (max-width: 900px) {
    .doc-card__distribution-mode-list {
        grid-template-columns: 1fr;
    }
}

/* Файл DocumentCardModal.css */

.doc-card__modal-backdrop {
    position: absolute;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 80px;
    background: rgba(15, 23, 42, 0.28);
}

.doc-card__modal {
    width: min(420px, calc(100% - 32px));
    background: #ffffff;
    border: 1px solid #dce3ec;
    border-radius: 14px;
    padding: 18px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.22);
}

.doc-card__modal-title {
    font-size: 17px;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 8px;
}

.doc-card__modal-text {
    font-size: 13px;
    line-height: 1.45;
    color: #4b5563;
    margin-bottom: 16px;
}

.doc-card__modal-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.doc-card__modal-cancel-btn {
    border: 1px solid #d8deea;
    background: #ffffff;
    color: #42526b;
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    transition: all 0.2s ease;
}

.doc-card__modal-cancel-btn:hover {
    background: #f6f8fc;
    border-color: #c7d1e1;
}
/* Файл DocumentCardEmployeePicker.css */

.doc-card__employee-picker {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-width: 100%;
    flex-direction: column;
    gap: 10px;
    box-sizing: border-box;
    color: var(--text-1);
}

.doc-card__employee-picker-hint {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg-2);
    color: var(--text-3);
    font-size: var(--font_size_0);
    line-height: 1.35;
    box-sizing: border-box;
}

.doc-card__employee-picker-hint::before {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 50%;
    background: var(--accent);
    color: var(--bg-1);
    content: "👤";
    font-size: 12px;
    line-height: 1;
}

.doc-card__employee-picker-search {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--bg-1);
    box-shadow: var(--shadow);
}

.doc-card__employee-picker-search span {
    flex: 0 0 auto;
    color: var(--text-3);
    font-size: var(--font_size_1);
}

.doc-card__employee-picker-search input {
    width: 100%;
    min-width: 0;
    height: 40px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text-1);
    font: inherit;
    box-shadow: none;
    outline: 0;
}

.doc-card__employee-picker-list {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px;
    padding: 2px;
    overflow-y: auto;
}

.doc-card__employee-picker-item {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 11px;
    align-items: center;
    width: 100%;
    min-height: 70px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--accent) 14%, var(--border));
    border-radius: 16px;
    background: color-mix(in srgb, var(--bg-1) 97%, var(--accent));
    color: var(--text-1);
    box-shadow: 0 6px 18px color-mix(in srgb, var(--blue-navy) 7%, transparent);
    text-align: left;
    cursor: pointer;
    transition:
        border-color .16s ease,
        background-color .16s ease,
        box-shadow .16s ease,
        transform .16s ease;
}

.doc-card__employee-picker-item:hover {
    border-color: color-mix(in srgb, var(--accent) 46%, var(--border));
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--blue-navy) 11%, transparent);
    transform: translateY(-1px);
}

.doc-card__employee-picker-avatar {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent) 16%, var(--bg-1));
    color: var(--blue-navy);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.doc-card__employee-picker-person {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.doc-card__employee-picker-person strong {
    overflow: hidden;
    color: var(--text-1);
    font-size: var(--font_size_0);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.doc-card__employee-picker-person span,
.doc-card__employee-picker-person small {
    overflow: hidden;
    color: var(--text-3);
    font-size: calc(var(--font_size_0) * .84);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.doc-card__employee-picker-empty {
    padding: 28px 16px;
    border: 1px dashed var(--border);
    border-radius: 14px;
    background: var(--bg-1);
    color: var(--text-3);
    text-align: center;
}

/* Файл DocumentCardAdaptive.css */

@media (max-width: 768px) {
    .doc-card__distribution-header,
    .doc-card__recipient-card-header,
    .doc-card__recipient-section-header {
        flex-direction: column;
        align-items: stretch;
    }

    .doc-card__recipient-card-title-wrap {
        width: 100%;
    }

    .doc-card__recipient-columns {
        grid-template-columns: 1fr;
    }

    .doc-card__distribution-line {
        align-items: stretch;
    }

    .doc-card__distribution-icon-btn {
        width: 100%;
        height: 36px;
        flex-basis: auto;
    }

    .doc-card__employee-picker-hint {
        width: 100%;
        border-radius: 10px;
    }

    .doc-card__employee-picker .table-container {
        min-height: 300px;
        max-height: calc(100vh - 190px);
    }
}


@media (max-width: 760px) {
    .doc-card {
        padding-left: var(--font_size_0);
        padding-right: var(--font_size_0);
    }

    .doc-card__header {
        gap: 8px;
    }

    .doc-card__title {
        font-size: 16px;
    }

    .doc-card__meta {
        font-size: 13px;
    }

    .doc-card__requisites {
        flex-direction: column;
        gap: 14px;
    }

    .doc-card__fields {
        width: 100%;
    }

    .doc-card__related {
        width: 100%;
        min-width: 0;
        max-width: none;
        flex: 0 0 auto;
        align-self: stretch;
    }

    .doc-card__fields > .doc-card__table,
    .doc-card__fields > .doc-card__table tbody,
    .doc-card__fields > .doc-card__table tr,
    .doc-card__fields > .doc-card__table td {
        display: block;
        width: 100%;
    }

    .doc-card__fields > .doc-card__table tr {
        padding-top: 6px;
        padding-bottom: 6px;
    }

    .doc-card__fields > .doc-card__table td.doc-card__label {
        width: auto;
        min-width: 0;
        max-width: none;
        padding-right: 0;
        padding-bottom: 2px;
        white-space: normal;
    }

    .doc-card__fields > .doc-card__table td.doc-card__value {
        width: 100%;
    }
}
/* Файл DocumentCardResolutionsLayout.css */

.incoming-resolutions {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
    color: var(--text-2);
    font-size: calc(var(--font_size_0) * 0.72);
}

.incoming-resolutions__content {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.incoming-resolutions__resolution {
    position: relative;
    flex: 0 0 auto;
    box-sizing: border-box;
    margin-bottom: 8px;
    border: 1px solid #8bc9f4;
    border-radius: 9px;
    padding: 9px 11px 8px;
    background: #eaf7ff;
}

.incoming-resolutions__resolution-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 18px;
    margin-bottom: 2px;
}

.incoming-resolutions__resolution-title {
    color: #00679a;
    font-size: calc(var(--font_size_0) * 0.66);
    font-weight: 800;
    line-height: 1.2;
}

.incoming-resolutions__resolution-actions {
    position: absolute;
    top: 7px;
    right: 9px;
    display: flex;
    gap: 5px;
    opacity: 1;
    pointer-events: auto;
}


.incoming-resolutions__mini-btn {
    border: 1px solid #b9d7eb;
    border-radius: 6px;
    padding: 3px 7px;
    background: #ffffff;
    color: #126596;
    font-size: calc(var(--font_size_0) * 0.52);
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    box-shadow: none;
}

.incoming-resolutions__mini-btn:hover {
    background: #f7fbff;
    transform: none;
    box-shadow: none;
}

.incoming-resolutions__mini-btn--danger {
    color: #a23434;
}

.incoming-resolutions__resolution-textarea {
    display: block;
    width: 100%;
    min-height: 39px;
    max-height: 110px;
    margin: 0;
    border: 0;
    outline: 0;
    resize: none;
    overflow-y: auto;
    padding: 0 120px 0 0;
    background: transparent;
    color: #26364c;
    font: inherit;
    font-size: calc(var(--font_size_0) * 0.62);
    font-weight: 500;
    line-height: 1.38;
    box-sizing: border-box;
}

.incoming-resolutions__resolution-textarea::placeholder {
    color: #8a99ab;
}

.incoming-resolutions__resolution-meta,
.incoming-resolutions__assignment-meta {
    color: #5d7189;
    font-size: calc(var(--font_size_0) * 0.54);
    line-height: 1.32;
}

.incoming-resolutions__resolution-meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin-top: 2px;
}

.incoming-resolutions__resolution-meta b,
.incoming-resolutions__assignment-meta b {
    color: #27384f;
    font-weight: 800;
}

.incoming-resolutions__meta-row {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    flex-wrap: wrap;
}

.incoming-resolutions__meta-row--resolution {
    gap: 20px;
}

.incoming-resolutions__resolution-date {
    margin-left: 3px;
}

.incoming-resolutions__section-title {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    margin: 2px 0 8px;
    color: #202a3b;
    font-size: calc(var(--font_size_0) * 0.7);
    font-weight: 800;
    line-height: 1.2;
}

.incoming-resolutions__section-title::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: #d9e1ea;
}

.incoming-resolutions__tree-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 7px 12px 0;
    scrollbar-gutter: stable;
}

.incoming-resolutions__empty {
    padding: 8px 2px;
    color: #52647a;
    font-size: calc(var(--font_size_0) * 0.56);
}

.incoming-resolutions__actions {
    position: relative;
    z-index: 3;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
    border-top: 1px solid #d9e1ea;
    padding: 12px 0 2px;
    background: var(--bg-2);
}

.incoming-resolutions__create-btn,
.incoming-resolutions__add-btn,
.incoming-resolutions__save-resolution-btn {
    border-radius: 8px;
    padding: 10px 14px;
    font-size: calc(var(--font_size_0) * 0.61);
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    box-shadow: none;
}

.incoming-resolutions__create-btn,
.incoming-resolutions__save-resolution-btn {
    min-width: 170px;
    border: 0;
    background: #2f6fdd;
    color: #ffffff;
}

.incoming-resolutions__add-btn {
    border: 1px solid #d4e2ef;
    background: #ffffff;
    color: #2f6fdd;
}

.incoming-resolutions__create-btn:hover,
.incoming-resolutions__add-btn:hover,
.incoming-resolutions__save-resolution-btn:hover {
    transform: none;
    box-shadow: none;
}

.incoming-resolutions__create-btn:disabled,
.incoming-resolutions__add-btn:disabled,
.incoming-resolutions__save-resolution-btn:disabled {
    cursor: default;
    opacity: 0.58;
}

@media (max-width: 768px) {
    .incoming-resolutions__resolution-actions {
        opacity: 1;
        pointer-events: auto;
    }

    .incoming-resolutions__resolution-textarea {
        padding-right: 0;
    }

    .incoming-resolutions__meta-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 2px;
    }

    .incoming-resolutions__actions {
        flex-wrap: wrap;
    }

    .incoming-resolutions__create-btn,
    .incoming-resolutions__add-btn,
    .incoming-resolutions__save-resolution-btn {
        flex: 1 1 180px;
    }
}

.incoming-resolutions__save-order-btn {
    min-width: 170px;
    border: 0;
    border-radius: 8px;
    padding: 10px 14px;
    background: #16845b;
    color: #ffffff;
    font-size: calc(var(--font_size_0) * 0.61);
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    box-shadow: none;
}

.incoming-resolutions__save-order-btn:hover:not(:disabled) {
    background: #126e4c;
    transform: none;
    box-shadow: none;
}

.incoming-resolutions__save-order-btn:disabled {
    cursor: default;
    opacity: .58;
}

@media (max-width: 768px) {
    .incoming-resolutions__save-order-btn {
        flex: 1 1 180px;
    }
}

/* Файл DocumentCardResolutionsTreeLayout.css */

.incoming-resolutions__tree {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.incoming-resolutions__assignment {
    --assignment-indent: 36px;
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding-left: calc(var(--assignment-level) * var(--assignment-indent));
    box-sizing: border-box;
}

.incoming-resolutions__tree-line-vertical {
    position: absolute;
    top: -9px;
    bottom: 50%;
    left: calc((var(--assignment-level) * var(--assignment-indent)) - 18px);
    width: 1px;
    background: #b7c7d8;
}

.incoming-resolutions__tree-line-horizontal {
    position: absolute;
    top: 20px;
    left: calc((var(--assignment-level) * var(--assignment-indent)) - 18px);
    width: 18px;
    height: 1px;
    background: #b7c7d8;
}

.incoming-resolutions__assignment-number {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 23px;
    width: 23px;
    height: 23px;
    margin-top: 7px;
    border: 0;
    border-radius: 50%;
    padding: 0;
    background: #2f6fdd;
    color: #ffffff;
    font-size: calc(var(--font_size_0) * 0.53);
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    box-shadow: none;
}

.incoming-resolutions__assignment-number:hover {
    background: #245cc2;
    transform: none;
    box-shadow: none;
}

.incoming-resolutions__assignment-number--child {
    background: #728198;
}

.incoming-resolutions__assignment-card {
    flex: 1 1 auto;
    min-width: 0;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    background: #ffffff;
    box-sizing: border-box;
}

.incoming-resolutions__assignment-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    min-height: 78px;
    padding: 7px 8px 6px;
    box-sizing: border-box;
}

.incoming-resolutions__assignment-content {
    flex: 1 1 auto;
    min-width: 0;
}

.incoming-resolutions__assignment-title-input {
    display: block;
    width: 100%;
    min-height: 30px;
    margin: 0 0 3px;
    border: 1px solid transparent;
    border-radius: 4px;
    outline: 0;
    padding: 0 2px;
    background: transparent;
    color: #202a3b;
    font: inherit;
    font-size: calc(var(--font_size_0) * 0.61);
    font-weight: 800;
    line-height: 1.3;
    box-sizing: border-box;
    resize: none;
    overflow: hidden;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.incoming-resolutions__assignment-title-input:hover,
.incoming-resolutions__assignment-title-input:focus {
    border-color: #dfe7ef;
    background: #ffffff;
}

.incoming-resolutions__assignment-meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.incoming-resolutions__phone {
    display: inline-grid;
    grid-template-columns: 16px minmax(0, max-content);
    gap: 5px;
    align-items: center;
    min-width: 0;
    color: #63758c;
    white-space: nowrap;
}

/* Файл DocumentCardResolutionsTreeControls.css */

.incoming-resolutions__phone-icon {
    display: inline-flex;
    width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: #63758c;
    font-size: 0.86em;
    line-height: 1;
}

.incoming-resolutions__phone-text {
    min-width: 0;
    line-height: 1.2;
}

.incoming-resolutions__deadline {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    width: max-content;
}

.incoming-resolutions__deadline-input {
    width: 168px;
    min-width: 168px;
    height: 24px;
    border: 1px solid transparent;
    border-radius: 4px;
    outline: 0;
    padding: 1px 38px 1px 6px;
    background: transparent;
    color: #63758c;
    font: inherit;
    font-size: inherit;
    box-sizing: border-box;
}


.incoming-resolutions__deadline-input::-webkit-calendar-picker-indicator {
    flex: 0 0 auto;
    margin: 0;
    padding: 3px;
    cursor: pointer;
}

.incoming-resolutions__deadline-input:hover,
.incoming-resolutions__deadline-input:focus {
    border-color: #dfe7ef;
    background: #ffffff;
}

.incoming-resolutions__assignment-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.incoming-resolutions__assignment-save-btn {
    min-width: 86px;
    border: 1px solid #2f6fdd;
    border-radius: 6px;
    padding: 5px 8px;
    background: #2f6fdd;
    color: #ffffff;
    font-size: calc(var(--font_size_0) * 0.48);
    font-weight: 800;
    cursor: pointer;
    box-shadow: none;
}

.incoming-resolutions__assignment-save-btn:hover {
    background: #245cc2;
    transform: none;
    box-shadow: none;
}

.incoming-resolutions__assignment-save-btn:disabled {
    border-color: #cbd5e1;
    background: #eef2f7;
    color: #77869a;
    cursor: default;
}

.incoming-resolutions__status-btn {
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
}

.incoming-resolutions__status-btn:hover {
    background: transparent;
    transform: none;
    box-shadow: none;
}

.incoming-resolutions__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    border-radius: 6px;
    padding: 5px 9px;
    font-size: calc(var(--font_size_0) * 0.5);
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.incoming-resolutions__status--progress {
    background: #fff1c8;
    color: #9a5600;
}

.incoming-resolutions__status--done {
    background: #d4f7e6;
    color: #126b45;
}

.incoming-resolutions__status--not-started {
    background: #ffe0e0;
    color: #ad2f2f;
}

.incoming-resolutions__delete-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 50%;
    padding: 0;
    background: #3478b7;
    color: #ffffff;
    cursor: pointer;
    opacity: 1;
}

.incoming-resolutions__delete-btn:hover {
    background: #2c689f;
}

/* Файл DocumentCardResolutionsTreeDrag.css */

@media (max-width: 900px) {
    .incoming-resolutions__assignment-main {
        flex-direction: column;
    }

    .incoming-resolutions__assignment-actions {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 768px) {
    .incoming-resolutions__assignment {
        --assignment-indent: 22px;
    }
}

.incoming-resolutions__drag-handle {
    display: inline-flex;
    width: 22px;
    height: 32px;
    flex: 0 0 22px;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #7b8ca2;
    font-size: 17px;
    line-height: 1;
    cursor: grab;
}

.incoming-resolutions__drag-handle:hover:not(:disabled) {
    background: #edf4fb;
    color: #2f6fdd;
    box-shadow: none;
    transform: none;
}

.incoming-resolutions__drag-handle:active:not(:disabled) {
    cursor: grabbing;
}

.incoming-resolutions__drag-handle:disabled {
    opacity: .3;
    cursor: default;
}

.incoming-resolutions__assignment--dragging {
    opacity: .45;
}

.incoming-resolutions__assignment--drop-target::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -4px;
    left: calc(var(--assignment-level) * var(--assignment-indent));
    height: 3px;
    border-radius: 999px;
    background: #2f6fdd;
}

.incoming-resolutions__assignment input:disabled,
.incoming-resolutions__assignment textarea:disabled,
.incoming-resolutions__assignment button:disabled {
    cursor: default;
}


@media (orientation: portrait) {
    .incoming-resolutions__assignment-main {
        flex-direction: column;
    }

    .incoming-resolutions__assignment-title-input {
        white-space: pre-wrap;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .incoming-resolutions__meta-row {
        flex-wrap: wrap;
    }

    .incoming-resolutions__assignment-actions {
        width: 100%;
        justify-content: flex-start;
    }
}

/* Файл DocumentCardResolutionsPicker.css */

.drawer-panel--employee-picker {
    z-index: 1100;
}

.incoming-resolutions__employee-picker {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 100%;
}

.incoming-resolutions__employee-picker-hint,
.incoming-resolutions__employee-picker-state {
    border: 1px solid #d7e7f2;
    border-radius: 12px;
    padding: 12px 14px;
    background: #f8fbff;
    color: var(--text-3);
}

.incoming-resolutions__employee-picker-state--error {
    border-color: #f0b9b9;
    background: #fff5f5;
    color: #b42318;
}

.incoming-resolutions__employee-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.incoming-resolutions__employee-card {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    border: 1px solid #d7e7f2;
    border-radius: 12px;
    padding: 10px 12px;
    background: #ffffff;
    color: var(--text-2);
    text-align: left;
    box-sizing: border-box;
}

.incoming-resolutions__employee-card:hover {
    border-color: #b9d9ed;
    background: #f8fbff;
}

.incoming-resolutions__employee-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    overflow: hidden;
    border-radius: 50%;
    background: #eaf4ff;
}

.incoming-resolutions__employee-avatar-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.incoming-resolutions__employee-avatar-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.incoming-resolutions__employee-info {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.incoming-resolutions__employee-name-btn {
    width: max-content;
    max-width: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    color: #334155;
    font: inherit;
    font-weight: 800;
    text-align: left;
    cursor: pointer;
    box-shadow: none;
}

.incoming-resolutions__employee-name-btn:hover {
    background: transparent;
    color: var(--accent);
    text-decoration: underline;
    transform: none;
    box-shadow: none;
}

.incoming-resolutions__employee-position,
.incoming-resolutions__employee-phone {
    color: var(--text-3);
    font-size: calc(var(--font_size_0) * 0.58);
}

.incoming-resolutions__employee-phone::before {
    content: "☎";
    margin-right: 4px;
    color: #63758c;
    font-size: 0.9em;
}

.incoming-resolutions__employee-select-btn {
    flex: 0 0 auto;
    border: 1px solid var(--accent);
    border-radius: 7px;
    padding: 6px 10px;
    background: var(--accent);
    color: #ffffff;
    font-size: calc(var(--font_size_0) * 0.55);
    font-weight: 700;
    cursor: pointer;
    box-shadow: none;
}

.incoming-resolutions__employee-select-btn:hover {
    background: #2d75b8;
    transform: none;
    box-shadow: none;
}

@media (max-width: 768px) {
    .drawer-panel--employee-picker {
        width: 98% !important;
    }

    .incoming-resolutions__employee-card {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .incoming-resolutions__employee-select-btn {
        margin-left: 44px;
    }
}

/* Файл DocumentCardPersonProfile.css */

.drawer-panel--person-card {
    z-index: 1200;
}

.person-card-drawer {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 100%;
}

.person-card-drawer__state {
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    padding: var(--font_size_0);
    background: var(--bg-1);
    color: var(--text-3);
}

.person-card-drawer__header {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    padding: var(--font_size_0);
    background: var(--bg-1);
}

.person-card-drawer__photo-button {
    display: flex;
    flex: 0 0 126px;
    width: 126px;
    height: 158px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    padding: 0;
    background: var(--bg-2);
    cursor: pointer;
    box-shadow: none;
}

.person-card-drawer__photo-button:hover {
    border-color: var(--accent);
    background: var(--bg-2);
    transform: none;
    box-shadow: none;
}

.person-card-drawer__photo-button:disabled {
    cursor: wait;
    opacity: 0.7;
}

.person-card-drawer__photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.person-card-drawer__photo-placeholder {
    color: var(--text-3);
    font-size: calc(var(--font_size_2) * 2.1);
}

.person-card-drawer__identity {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}

.person-card-drawer__identity h3 {
    margin: 0;
    color: var(--blue-navy);
    font-size: var(--font_size_1);
}

.person-card-drawer__identity p {
    margin: 0;
    color: var(--text-3);
}

.person-card-drawer__upload-btn {
    margin-top: auto;
    border: 1px solid var(--accent);
    border-radius: var(--font_size__0);
    padding: 7px 12px;
    background: var(--bg-1);
    color: var(--accent);
    cursor: pointer;
    box-shadow: none;
}

.person-card-drawer__upload-btn:hover {
    background: var(--bg-2);
    transform: none;
    box-shadow: none;
}

.person-card-drawer__file-input {
    display: none;
}

.person-card-drawer__fields {
    display: grid;
    grid-template-columns: minmax(130px, 0.42fr) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--bg-1);
}

.person-card-drawer__field {
    display: contents;
}

.person-card-drawer__label,
.person-card-drawer__value {
    border-bottom: 1px solid var(--border);
    padding: 10px 12px;
}

.person-card-drawer__label {
    background: var(--bg-2);
    color: var(--text-3);
    font-weight: 600;
}

.person-card-drawer__value {
    min-width: 0;
    color: var(--text-2);
    overflow-wrap: anywhere;
}

.person-card-drawer__field:last-child .person-card-drawer__label,
.person-card-drawer__field:last-child .person-card-drawer__value {
    border-bottom: 0;
}

.person-card-drawer__history-note {
    color: var(--text-3);
    font-size: calc(var(--font_size_0) * 0.7);
}

.incoming-resolutions__person-link {
    display: inline;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 800;
    text-align: left;
    cursor: pointer;
    box-shadow: none;
}

.incoming-resolutions__person-link:hover {
    background: transparent;
    color: var(--accent);
    text-decoration: underline;
    transform: none;
    box-shadow: none;
}

@media (max-width: 700px) {
    .drawer-panel--person-card {
        width: 98% !important;
    }

    .person-card-drawer__header {
        flex-direction: column;
    }

    .person-card-drawer__photo-button {
        width: 108px;
        height: 136px;
        flex-basis: 136px;
    }

    .person-card-drawer__fields {
        grid-template-columns: 1fr;
    }

    .person-card-drawer__field {
        display: flex;
        flex-direction: column;
    }
}

/* Файл DocumentCardResolutions.css */

/* Файл DocumentCardDownload.css */

.document-download-panel {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 4px;
}

.document-download-panel__section {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.document-download-panel__section h3 {
    margin: 0;
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.document-download-panel__options,
.document-download-panel__formats {
    display: grid;
    gap: 8px;
}

.document-download-panel__formats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.document-download-panel label {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 9px;
    padding: 9px 11px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    cursor: pointer;
}

.document-download-panel label:has(input:checked) {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 8%, var(--bg-1));
}

.document-download-panel__actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

@media (max-width: 600px) {
    .document-download-panel__formats {
        grid-template-columns: 1fr;
    }
}

/* Файл base_and_create.css */

.approval-sheet-panel {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.approval-sheet-create,
.approval-sheet-history {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.approval-sheet-create h3,
.approval-sheet-history h3 {
    margin: 0;
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.approval-sheet-create__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.approval-sheet-create__heading p {
    margin: 4px 0 0;
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.approval-sheet-create__heading > span {
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--bg-2);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.approval-sheet-mode {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.approval-sheet-mode label,
.approval-sheet-employee {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-1);
    cursor: pointer;
}

.approval-sheet-mode label:has(input:checked),
.approval-sheet-employee:has(input:checked) {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 8%, var(--bg-1));
}

.approval-sheet-mode span,
.approval-sheet-employee > span {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 2px;
}

.approval-sheet-mode strong,
.approval-sheet-employee strong {
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.approval-sheet-mode small,
.approval-sheet-employee small {
    color: var(--text-3);
    font-size: var(--font_size_-1);
}

.approval-sheet-employees {
    display: grid;
    max-height: 340px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    overflow: auto;
}

.approval-sheet-employee {
    position: relative;
    align-items: center;
}

.approval-sheet-employee--disabled {
    cursor: not-allowed;
    opacity: 0.62;
}


.approval-sheet-employee__order {
    display: inline-flex;
    min-width: 30px;
    align-items: center;
    justify-content: center;
    padding: 3px 6px;
    border-radius: 999px;
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size__0);
    font-weight: 700;
}

.approval-sheet-employee em {
    color: var(--danger, #b54b4b);
    font-size: var(--font_size_-1);
    font-style: normal;
}

.approval-sheet-create__actions,
.approval-review-panel__actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.approval-sheet-employee-picker {
    display: flex;
    min-height: 260px;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-1);
}

/* Файл picker_and_order.css */

.approval-sheet-employee-picker__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.approval-sheet-employee-picker__header > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.approval-sheet-employee-picker__header strong {
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.approval-sheet-employee-picker__header small,
.approval-sheet-employee-picker__notice {
    color: var(--text-3);
    font-size: var(--font_size_-1);
}

.approval-sheet-employee-picker__header input {
    width: min(300px, 44%);
    min-height: 34px;
    padding: 0 10px;
}

.approval-sheet-employee-pivot {
    max-height: 360px;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.approval-sheet-employee-pivot .pivot-table {
    min-width: 100%;
}

.approval-sheet-selected-order {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 9px 10px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-2);
}

.approval-sheet-selected-order > strong {
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.approval-sheet-selected-order > div {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.approval-sheet-selected-order span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg-1);
    color: var(--text-2);
    font-size: var(--font_size_-1);
}

.approval-sheet-selected-order b {
    display: inline-flex;
    width: 20px;
    height: 20px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--accent);
    color: var(--bg-1);
    font-size: var(--font_size__0);
}

/* Файл versions_and_reviewers.css */

.approval-sheet-versions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.approval-sheet-version {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
}

.approval-sheet-version__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    background: var(--bg-2);
}

.approval-sheet-version__header > div,
.approval-sheet-reviewer > div,
.approval-sheet-reviewer__result {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.approval-sheet-version__header strong,
.approval-sheet-reviewer strong {
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.approval-sheet-version__header small,
.approval-sheet-reviewer small {
    color: var(--text-3);
    font-size: var(--font_size_-1);
}

.approval-sheet-status {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: var(--font_size_-1);
    font-weight: 700;
}

.approval-sheet-status--pending {
    background: #fff2cf;
    color: #755900;
}

.approval-sheet-status--approved {
    background: #dff4e7;
    color: #176137;
}

.approval-sheet-status--rejected {
    background: #f9dddd;
    color: #8c2525;
}

.approval-sheet-reviewers {
    display: flex;
    flex-direction: column;
}

.approval-sheet-reviewer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(160px, 0.8fr);
    gap: 12px;
    padding: 9px 12px;
    border-bottom: 1px solid var(--border);
}

.approval-sheet-reviewer:last-child {
    border-bottom: 0;
}

.approval-sheet-reviewer__result {
    align-items: flex-end;
    text-align: right;
}

.approval-sheet-reviewer__result > span {
    color: var(--text-2);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.approval-sheet-empty {
    padding: 18px;
    border: 1px dashed var(--border);
    border-radius: 9px;
    color: var(--text-3);
    text-align: center;
}

/* Файл review_and_mobile.css */

.approval-review-panel {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.approval-review-panel p {
    margin: 0;
    color: var(--text-2);
    line-height: 1.45;
}

.approval-review-panel label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.approval-review-panel textarea {
    min-height: 150px;
    resize: vertical;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
    font-weight: 400;
}

@media (max-width: 720px) {
    .approval-sheet-mode,
    .approval-sheet-employees {
        grid-template-columns: 1fr;
    }

    .approval-sheet-employee-picker__header {
        align-items: stretch;
        flex-direction: column;
    }

    .approval-sheet-employee-picker__header input {
        width: 100%;
    }

    .approval-sheet-reviewer {
        grid-template-columns: 1fr;
    }

    .approval-sheet-reviewer__result {
        align-items: flex-start;
        text-align: left;
    }
}

/* Файл DocumentCardApproval.css */

/* Файл 01.css */

/* Файл DocumentCard.css */

/* Базовая оболочка карточки: .doc-card, шапка, номер/дата,
центральная прокручиваемая область, скроллбар, пустое
состояние и нижняя панель с кнопкой. */

/* Вкладка Реквизиты: layout левой части, таблица реквизитов,
левая колонка под ширину текста, значения, бейджи статуса
и поля редактирования (textarea, number, select). */

/* Правый блок "Связанные документы": карточка справа,
заголовок, строки, кнопка Добавить, список связанных
документов, ссылки и кнопка удаления связи. */

/* Вкладка "Лист рассылки": карточки получателей, секции,
поля ввода, кнопки действий и двухколоночная сетка получателей. */

/* Модальное окно подтверждения связи входящего с исходящим:
затемнение, окно, заголовок, текст, кнопки. */

/* Оформление панели выбора исполнителя через TableWidget:
подсказка, контейнер таблицы, hover/active строк, курсор на строках. */

/* Весь адаптив: на мобильной версии "Связанные документы"
уезжают вниз, таблица реквизитов становится вертикальной,
лист рассылки и выбор исполнителя подстраиваются под узкий экран. */
/* Просмотр локально выбранных вложений до отправки. */
.doc-card__attachment-local-open {
    flex: 1;
    min-width: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: var(--blue-navy);
    font-size: var(--font_size_0);
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.doc-card__attachment-local-open:hover {
    background: transparent;
    color: var(--accent);
    box-shadow: none;
    transform: none;
}

/* Компактная шапка исходящего документа и панели редактирования. */
.doc-card__header--outgoing {
    align-items: center;
    justify-content: space-between;
}

.doc-card__header-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.doc-card__delivery-status {
    padding-left: 10px;
    border-left: 1px solid var(--border);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.doc-card__editor-panel {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.doc-card__editor-panel .doc-editor {
    height: 100%;
    min-height: 0;
}

.doc-card__related-table-panel {
    display: flex;
    height: 100%;
    min-height: 420px;
    flex-direction: column;
    gap: 8px;
    overflow: hidden;
}

.doc-card__related-table-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.doc-card__related-table-content .table-widget,
.doc-card__related-table-content .table-container,
.doc-card__related-table-content .table-wrapper {
    height: 100%;
    min-height: 0;
    max-height: 100%;
}

/* Реквизиты и вложения карточки располагаются на одном уровне. */
.doc-card__body--sections {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-right: 0;
}

.doc-card__section {
    flex: 0 0 auto;
    min-width: 0;
}

.doc-card__section-title {
    margin: 0 0 6px;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

/* Компактная панель редактора текста документа. */
.document-text-drawer .drawer-body {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}

.document-text-drawer .doc-card__editor-panel {
    display: flex;
    height: 100%;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
}

.document-text-drawer .doc-card__editor-panel .doc-editor {
    display: flex;
    height: 100%;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
}

.document-text-drawer .doc-editor__topbar,
.document-text-drawer .doc-editor__view-switch {
    flex: 0 0 auto;
}

.document-text-drawer .doc-editor__layout {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.document-text-drawer .doc-editor__viewport {
    height: 100%;
    max-height: none;
    flex: 1 1 auto;
}

.document-text-drawer .doc-editor__review-panel {
    height: 100%;
    max-height: none;
}

.document-text-drawer .doc-editor__bottom-panel {
    flex: 0 0 23px;
}

/* Таблицы входящих и исходящих занимают всю ширину вкладки. */
.documents-table-full-width,
.documents-table-full-width .table-widget,
.documents-table-full-width .table-container,
.documents-table-full-width .table-wrapper,
.documents-table-full-width .data-table {
    width: 100%;
    max-width: 100%;
}

.documents-table-full-width {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

/* Редактор текста документа занимает всю высоту DriverPanel. */
.document-text-drawer {
    height: 100dvh;
}

.document-text-drawer .drawer-body {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}

.document-text-drawer .doc-card__editor-panel,
.document-text-drawer .doc-card__editor-panel > * {
    display: flex;
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
}

.document-text-drawer .doc-editor {
    width: 100%;
    height: 100%;
    min-height: 0;
    flex: 1 1 auto;
    gap: 0;
    padding: 0;
}

.document-text-drawer .doc-editor__topbar {
    flex: 0 0 auto;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
}

.document-text-drawer .doc-editor__view-switch {
    flex: 0 0 auto;
}

.document-text-drawer .doc-editor__layout {
    display: flex;
    height: auto;
    min-height: 0;
    flex: 1 1 0;
    overflow: hidden;
}

.document-text-drawer .doc-editor__viewport {
    height: auto;
    min-height: 0;
    max-height: none;
    flex: 1 1 auto;
}

.document-text-drawer .doc-editor__review-panel {
    height: auto;
    min-height: 0;
    max-height: none;
}


/* Файл 02.css */

.document-text-drawer .doc-editor__bottom-panel {
    flex: 0 0 23px;
}

/* Дополнительное растягивание редактора текста документа внутри DriverPanel. */
.document-text-drawer.drawer-panel {
    height: 100dvh;
    max-height: 100dvh;
}

.document-text-drawer .drawer-body,
.document-text-drawer .drawer-body--fixed,
.document-text-drawer .drawer-body--scrollable {
    display: flex;
    height: calc(100dvh - 50px);
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}

.document-text-drawer .doc-card__editor-panel,
.document-text-drawer .doc-card__editor-panel > div,
.document-text-drawer .doc-editor {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    overflow: hidden;
}

.document-text-drawer .doc-editor__layout {
    display: flex;
    height: auto;
    min-height: 0;
    flex: 1 1 0;
    align-items: stretch;
    overflow: hidden;
}

.document-text-drawer .doc-editor__viewport,
.document-text-drawer .doc-editor__review-panel {
    height: auto;
    min-height: 0;
    max-height: none;
    flex: 1 1 auto;
}

.document-text-drawer .doc-editor__review-panel {
    flex: 0 0 238px;
}

.document-text-drawer .doc-editor__bottom-panel {
    flex: 0 0 26px;
}


/* Входящая карточка: разделитель между реквизитами и письмом
   совпадает с разлиновкой строк реквизитов. */
.doc-card__body--incoming {
    gap: 0;
}

.doc-card__body--incoming .doc-card__section--email {
    border-top: 1px solid #edf0f4;
}

.doc-card__body--incoming .doc-card__section--attachments {
    margin-top: 8px;
}

.document-text-drawer .document-templates-panel {
    min-height: 0;
    flex: 1 1 auto;
}

/* Файл DocumentCard.css */

/* Файл meetings_and_votings.css */

.meetings-root,
.meeting-card {
    background: transparent;
    color: inherit;
}

.meetings-table-shell,
.meetings-list-shell {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
}

.meetings-list-shell,
.question-drawer-form {
    gap: var(--font_size__0);
}

.meetings-toolbar {
    flex: 0 0 auto;
}

.meetings-style .table-container {
    border-radius: 0;
    background: var(--bg-1);
    box-shadow: none;
}

.meetings-style .data-table th,
.meetings-style .fixed-header,
.meetings-style .fixed-header-row {
    background: var(--accent-blue) !important;
    color: var(--bg-1) !important;
    font-weight: 600;
}

.meetings-style .data-table tbody td,
.meetings-style .fixed-row,
.meetings-style .fixed-row-cell,
.meetings-style .fixed-cell {
    background: var(--bg-1) !important;
    color: inherit !important;
}

.meetings-style .data-table tbody tr:hover td {
    background: #fffce6 !important;
}

.meeting-card {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    gap: var(--font_size__0);
    box-sizing: border-box;
    padding: var(--font_size_0);
    overflow: auto;
}

.meeting-card > .house-details-card,
.question-drawer-form {
    margin: 0;
}

.meeting-section {
    margin-top: 0;
    margin-right: 0;
}

.meeting-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--font_size__0);
}

.meeting-field textarea {
    width: 100%;
    min-height: calc(var(--font_size_10) * 2.5);
    box-sizing: border-box;
    padding: var(--font_size__0) var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: inherit;
    font: inherit;
    font-size: var(--font_size_0);
    resize: vertical;
}

.meeting-field-full {
    grid-column: 1 / -1;
}

.meeting-upload,
.meetings-empty {
    padding: var(--font_size_0);
    border: 1px dashed var(--border);
    border-radius: var(--font_size_0);
}

.meeting-upload {
    display: flex;
    justify-content: center;
    margin-top: var(--font_size__0);
    color: var(--accent-blue);
    cursor: pointer;
}

.meeting-checkbox-row {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
    color: inherit;
}

.meeting-question-list {
    margin-top: var(--font_size__0);
}

.meeting-question-item {
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--bg-1);
}

.meeting-question-title {
    margin-bottom: var(--font_size__0);
    color: inherit;
    font-weight: 600;
}

.meeting-answer-row input {
    flex: 1;
}

.meeting-question-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--font_size__0);
}

.meeting-question-actions {
    flex: 0 0 auto;
    flex-wrap: nowrap;
}

.meeting-question-actions button {
    min-width: 30px;
    min-height: 28px;
    padding: 3px 7px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: inherit;
    cursor: pointer;
}

.meeting-protocol-options {
    display: flex;
    flex-direction: column;
    gap: var(--font_size_0);
}

.meeting-protocol-options label {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
}

@media (orientation: portrait) {
    .meeting-form-grid {
        grid-template-columns: 1fr;
    }

    .meeting-field-date,
    .meeting-field-period {
        grid-column: 1 / -1;
    }
}

/* Файл DownloadPanel.css */

.download-panel {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 12px;
    box-sizing: border-box;
    min-width: 280px;
}

.download-panel__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.download-panel__label {
    font-size: var(--font_size_0, 14px);
    color: var(--text-1, #222);
}

.download-panel__select {
    height: 34px;
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid var(--border, #cfcfcf);
    background: var(--bg-1, #fff);
    color: var(--text-1, #222);
    font-size: var(--font_size_0, 14px);
    outline: none;
}

.download-panel__select:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

.download-panel__actions {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
/* Файл tab_access_to_LC.css */

.access-to-lc-root {
    display: flex;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.access-to-lc-root > .grid-container {
    flex: 1 1 auto;
    min-height: 0;
    grid-template-rows: repeat(4, minmax(0, 1fr));
}

.access-to-lc-root > .grid-container > .grid-item:last-child {
    display: flex;
    min-height: 0;
    overflow: hidden;
}

.access-to-lc-root
> .grid-container
> .grid-item:last-child
> .table-widget {
    height: 100%;
    min-height: 0;
    max-height: none;
    flex: 1 1 auto;
}

.access-to-lc-root
> .grid-container
> .grid-item:last-child
.table-container {
    height: 100%;
    min-height: 0;
    max-height: none;
    flex: 1 1 auto;
}

.access-to-lc-root
> .grid-container
> .grid-item:last-child
.table-wrapper {
    height: 100%;
    min-height: 0;
    max-height: none;
}

.access-to-lc-root
> .grid-container
> .grid-item:last-child
.table-scroll-container {
    height: 100%;
    min-height: 0;
    max-height: none;
}

#content-1-tab_5.tab-content-item.active {
    display: flex;
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

#content-1-tab_5 > .access-to-lc-root {
    flex: 1 1 auto;
}

.access-to-lc-actions {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    flex-direction: column;
    gap: var(--font_size__0);
    width: 100%;
}

.bulk-access-assignment {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--font_size_0);
    width: 100%;
    min-height: 65vh;
}

.bulk-access-assignment__panel {
    display: flex;
    min-width: 0;
    min-height: 0;
    flex-direction: column;
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--card);
    box-shadow: var(--shadow);
}

.bulk-access-assignment__heading {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: calc(var(--font_size__0) / 2);
    margin-bottom: var(--font_size__0);
}

.bulk-access-assignment__heading--right {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size_0);
}

.bulk-access-assignment__heading h3,
.bulk-access-assignment__heading p {
    margin: 0;
}

.bulk-access-assignment__heading h3 {
    color: var(--text-2);
    font-size: var(--font_size_1);
}

.bulk-access-assignment__heading p {
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.bulk-access-assignment__heading input {
    width: min(240px, 45%);
    min-width: 120px;
    padding: var(--font_size__0) var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--bg-1);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.bulk-access-assignment__pivot {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.bulk-access-assignment__status {
    margin-bottom: var(--font_size__0);
    color: var(--accent-orange-text);
    font-size: var(--font_size_0);
}

.bulk-access-assignment__empty {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    min-height: 240px;
    color: var(--text-3);
    text-align: center;
}

@media (max-width: 900px) {
    .bulk-access-assignment {
        grid-template-columns: minmax(0, 1fr);
    }

    .bulk-access-assignment__panel {
        min-height: 45vh;
    }
}

/* В портретной ориентации обе кнопки занимают одну строку. */
@media (orientation: portrait) {
    .access-to-lc-actions {
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;
    }
}


/* Убирает артефакты скрытых повторов номера квартиры на телефоне. */
@media (orientation: portrait) {
    .access-residents-table
    .portrait-column-switcher-wrapper {
        overflow-x: hidden;
    }

    .access-residents-table
    .portrait-column-switcher-wrapper
    .data-table .fixed-column,
    .access-residents-table
    .portrait-column-switcher-wrapper
    .data-table .fixed-cell {
        position: static !important;
        left: auto !important;
    }

    .access-residents-table
    .portrait-column-switcher-wrapper
    .data-table .row-number-header,
    .access-residents-table
    .portrait-column-switcher-wrapper
    .data-table .row-number-cell {
        display: none !important;
    }

    .access-residents-table
    .portrait-column-switcher-wrapper
    .data-table td:first-child,
    .access-residents-table
    .portrait-column-switcher-wrapper
    .data-table td:first-child .cell-content,
    .access-residents-table
    .portrait-column-switcher-wrapper
    .data-table td:first-child .cell-display-value {
        overflow: hidden !important;
        clip-path: inset(0);
    }
}

/* Файл OutgoingDocumentSettings.css */

.outgoing-settings {
    align-items: stretch;
}

.outgoing-settings > * {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.outgoing-settings__header h2 {
    margin: 0;
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.outgoing-settings__header p {
    margin: 6px 0 0;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.outgoing-settings__field {
    display: flex;
    margin-top: var(--font_size_1);
    flex-direction: column;
    gap: 6px;
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.outgoing-settings__field input,
.outgoing-settings__field select {
    width: 100%;
    min-height: 42px;
    box-sizing: border-box;
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    outline: none;
}

.outgoing-settings__field input:focus,
.outgoing-settings__field select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(31, 111, 190, 0.12);
}

.outgoing-settings__templates {
    display: flex;
    margin-top: var(--font_size_1);
    flex-direction: column;
    gap: 8px;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.outgoing-settings__template-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.outgoing-settings__template {
    margin: 0;
    padding: 7px 12px;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    cursor: pointer;
}

.outgoing-settings__template:hover,
.outgoing-settings__template--active {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.outgoing-settings__actions {
    display: flex;
    margin-top: var(--font_size_1);
    flex-wrap: wrap;
    gap: 8px;
}

.outgoing-settings__empty,
.outgoing-settings__loading {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.outgoing-settings__loading {
    min-height: 56px;
    justify-content: center;
}

.outgoing-settings__pdf-types {
    display: grid;
    gap: 8px;
    margin: var(--font_size_1) 0 0;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
}

.outgoing-settings__pdf-types legend {
    padding: 0 6px;
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.outgoing-settings__pdf-types label {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    cursor: pointer;
}

.outgoing-settings__pdf-types input {
    margin-top: 3px;
}

.outgoing-settings__pdf-types span {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.outgoing-settings__pdf-types strong {
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.outgoing-settings__pdf-types small {
    color: var(--text-2);
    font-size: var(--font_size__0);
    line-height: 1.4;
}

.outgoing-settings__signature-visualization {
    display: grid;
    gap: 12px;
    margin: var(--font_size_1) 0 0;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
}

.outgoing-settings__signature-visualization legend {
    padding: 0 6px;
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.outgoing-settings__checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.outgoing-settings__checkbox-row input {
    margin-top: 3px;
}

.outgoing-settings__signature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 12px;
}

.outgoing-settings__signature-grid .outgoing-settings__field {
    margin-top: 0;
}

.outgoing-settings__signature-tags,
.outgoing-settings__signature-status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    color: var(--text-2);
    font-size: var(--font_size__0);
}

.outgoing-settings__signature-tags strong {
    color: var(--text-1);
    font-size: var(--font_size_0);
}

.outgoing-settings__signature-tags code,
.outgoing-settings__signature-status code {
    padding: 4px 7px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--bg-2);
    color: var(--text-1);
    font-family: monospace;
    font-size: var(--font_size__0);
}

.outgoing-settings__signature-status {
    flex-direction: column;
    align-items: flex-start;
}

.outgoing-settings__reminder {
    padding: 10px 12px;
    border: 1px solid #e2b84c;
    border-radius: var(--font_size__0);
    background: #fff8df;
    color: #725100;
    font-size: var(--font_size_0);
    font-weight: 700;
}

.outgoing-settings__reminder--expired {
    border-color: #d86969;
    background: #fff0f0;
    color: #8a2222;
}

@media (max-width: 760px) {
    .outgoing-settings__signature-grid {
        grid-template-columns: 1fr;
    }
}

/* Файл meter_reading_sort_settings.css */

.meter-sort-settings {
    display: grid;
    gap: 8px;
    padding: 4px;
}

.meter-sort-settings > .block_1 {
    margin: 0;
}

.meter-sort-settings__header {
    display: flex;
    align-items: end;
    gap: 14px;
}

.meter-sort-settings__header label {
    display: grid;
    gap: 4px;
    min-width: 280px;
}

.meter-sort-settings select {
    min-height: 34px;
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 5px 8px;
    font: inherit;
}

.meter-sort-settings__header p {
    margin: 0;
    color: var(--text-2);
}

.meter-sort-settings__title {
    margin-bottom: 8px;
    font-weight: 700;
}

.meter-sort-settings__rule {
    display: grid;
    grid-template-columns: 30px minmax(220px, 1fr) 180px auto;
    gap: 8px;
    align-items: center;
    margin-bottom: 7px;
}

.meter-sort-settings__rule > span {
    text-align: center;
    font-weight: 700;
}

.meter-sort-settings__rule button,
.meter-sort-settings__actions button {
    min-height: 34px;
    padding: 5px 12px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-2);
    color: var(--text-1);
    font: inherit;
    cursor: pointer;
}

.meter-sort-settings__rule button:hover:not(:disabled),
.meter-sort-settings__actions button:hover:not(:disabled) {
    border-color: var(--accent);
    background: var(--bg-3);
    color: var(--text-1);
}

.meter-sort-settings__rule button:disabled,
.meter-sort-settings__actions button:disabled {
    background: var(--bg-2);
    color: var(--text-3);
    opacity: .65;
    cursor: not-allowed;
}

.meter-sort-settings__actions button.button {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.meter-sort-settings__actions button.button:hover:not(:disabled) {
    border-color: var(--accent-blue);
    background: var(--accent-blue);
    color: var(--bg-1);
}

.meter-sort-settings__actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

/* Файл SessionLifetimeSettings.css */

.session-lifetime-settings {
    padding: 12px;
}

.session-lifetime-settings__card {
    display: grid;
    gap: 14px;
    max-width: 560px;
}

.session-lifetime-settings__header h3 {
    margin: 0 0 6px;
}

.session-lifetime-settings__header p {
    margin: 0;
    color: var(--text-3);
    line-height: 1.45;
}

.session-lifetime-settings__field {
    display: grid;
    gap: 6px;
}

.session-lifetime-settings__field > span {
    font-weight: 600;
}

.session-lifetime-settings__field input {
    width: 220px;
    max-width: 100%;
    min-width: 0;
    padding: 9px 11px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
    box-sizing: border-box;
}

.session-lifetime-settings__hint {
    color: var(--text-3);
    font-size: 0.95em;
}

.session-lifetime-settings__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.session-lifetime-settings__loading {
    margin: 12px;
}

/* Файл tab_layout_settings.css */

.tab-layout-settings {
    display: flex;
    flex-direction: column;
    gap: var(--font_size_0);
    min-height: 100%;
    box-sizing: border-box;
    padding: var(--font_size_0);
    background: var(--bg-2);
}

.tab-layout-settings__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--font_size_0);
    margin: 0;
}

.tab-layout-settings__header h3 {
    margin: 0 0 var(--font_size__0);
    color: var(--blue-navy);
    font-size: var(--font_size_2);
}

.tab-layout-settings__header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.tab-layout-settings__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--font_size__0);
}

.tab-layout-settings__board {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--font_size_0);
    align-items: start;
}

.tab-layout-settings__widget {
    min-width: 0;
    margin: 0;
    padding: var(--font_size_0);
}

.tab-layout-settings__widget-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size__0);
    margin-bottom: var(--font_size__0);
    color: var(--blue-navy);
    font-size: var(--font_size_0);
}

.tab-layout-settings__widget-header span {
    color: var(--text-2);
    font-size: var(--font_size__0);
}

.tab-layout-settings__tabs {
    display: flex;
    flex-direction: column;
    gap: calc(var(--font_size__0) / 2);
    min-height: 52px;
}

.tab-layout-settings__tab {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--font_size__0);
    min-height: 34px;
    box-sizing: border-box;
    padding: calc(var(--font_size__0) / 2) var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--blue-navy);
    font-size: var(--font_size_0);
    cursor: grab;
}

.tab-layout-settings__tab:active {
    cursor: grabbing;
}

.tab-layout-settings__tab:hover {
    border-color: var(--accent);
    box-shadow: var(--shadow);
}

.tab-layout-settings__tab--locked {
    opacity: 0.72;
    cursor: default;
}

.tab-layout-settings__tab small {
    color: var(--text-2);
    font-size: var(--font_size__0);
    white-space: nowrap;
}

.tab-layout-settings__handle {
    color: var(--text-2);
    font-weight: 700;
    letter-spacing: -2px;
}

.tab-layout-settings__empty {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: var(--font_size__0);
    border: 1px dashed var(--border);
    border-radius: var(--font_size__0);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

@media (max-width: 760px) {
    .tab-layout-settings__header {
        flex-direction: column;
    }
}

/* Прокрутка длинного списка TabWidget и редактирование названий. */
.tab-layout-settings {
    height: 100%;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: auto;
}

.tab-layout-settings__board {
    flex: 0 0 auto;
    padding-bottom: var(--font_size_1);
}

.tab-layout-settings__title-input {
    width: 100%;
    min-width: 0;
    min-height: 28px;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: 6px;
    padding: 3px 6px;
    background: transparent;
    color: var(--blue-navy);
    font: inherit;
}

.tab-layout-settings__title-input:hover,
.tab-layout-settings__title-input:focus {
    border-color: var(--border);
    background: var(--bg-1);
    outline: none;
}

/* Файл UpdFormatSettings.css */

.upd-format-settings {
    display: flex;
    width: 100%;
    max-width: none;
    height: 100%;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    align-self: stretch;
    flex-direction: column;
    gap: var(--font_size__0);
    box-sizing: border-box;
    padding: var(--font_size__0) 0 var(--font_size__0) var(--font_size__0);
    overflow: auto;
    scrollbar-gutter: auto;
    background: var(--bg-2);
    container-name: upd-format-page;
    container-type: inline-size;
}

.upd-format-settings > .block_1 {
    width: 100%;
    max-width: none;
    min-width: 0;
    margin: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.upd-format-settings__form {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: var(--font_size_0);
}

.upd-format-settings .upd-format-settings__fields.workspace-form-grid--three {
    display: grid;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        'document-type'
        'effective-from'
        'xml-file'
        'xsd-file'
        'actions';
    gap: var(--font_size_0);
    box-sizing: border-box;
}

.upd-format-settings__field,
.upd-format-settings__actions {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.upd-format-settings__field--document-type {
    grid-area: document-type;
}

.upd-format-settings__field--effective-from {
    grid-area: effective-from;
}

.upd-format-settings__field--xml {
    grid-area: xml-file;
}

.upd-format-settings__field--xsd {
    grid-area: xsd-file;
}

.upd-format-settings__actions {
    grid-area: actions;
    justify-content: flex-start;
}

.upd-format-settings__field input,
.upd-format-settings__field select {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.upd-format-settings__field input[type='file'] {
    inline-size: 100%;
    min-inline-size: 0;
    max-inline-size: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.upd-format-settings__actions .btn {
    width: auto;
    max-width: 100%;
    white-space: normal;
}

.upd-format-settings__list {
    overflow: visible;
    flex: 0 0 auto;
    min-height: 0;
}

.upd-format-settings__table-wrap {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.upd-format-settings__table-widget {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    font-family: inherit;
}

.upd-format-settings__table-widget .table-wrapper {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow-x: auto;
    overflow-y: visible;
    border-radius: 0;
    box-shadow: none;
}

.upd-format-settings__table-widget .data-table {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    font-size: var(--font_size_0);
}

.upd-format-settings__table-widget .data-table th,
.upd-format-settings__table-widget .data-table td {
    min-width: 0 !important;
    max-width: none !important;
    padding: 8px 6px;
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
    color: var(--blue-navy);
    text-align: left;
    vertical-align: top;
    white-space: normal;
    overflow: hidden;
    overflow-wrap: anywhere;
    word-break: break-word;
    text-overflow: clip;
}

.upd-format-settings__table-widget .data-table th,
.upd-format-settings__table-widget .fixed-header,
.upd-format-settings__table-widget .fixed-header-row {
    background: var(--bg-2) !important;
    color: var(--blue-navy) !important;
    font-weight: 700;
}

.upd-format-settings__table-widget .header-content,
.upd-format-settings__table-widget .cell-content,
.upd-format-settings__table-widget .cell-display-value {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    text-overflow: clip;
}

.upd-format-settings__table-widget .data-table th:nth-child(1),
.upd-format-settings__table-widget .data-table td:nth-child(1) {
    width: 10%;
}

.upd-format-settings__table-widget .data-table th:nth-child(2),
.upd-format-settings__table-widget .data-table td:nth-child(2) {
    width: 8%;
}

.upd-format-settings__table-widget .data-table th:nth-child(3),
.upd-format-settings__table-widget .data-table td:nth-child(3) {
    width: 10%;
}

.upd-format-settings__table-widget .data-table th:nth-child(4),
.upd-format-settings__table-widget .data-table td:nth-child(4) {
    width: 16%;
}

.upd-format-settings__table-widget .data-table th:nth-child(5),
.upd-format-settings__table-widget .data-table td:nth-child(5) {
    width: 8%;
}

.upd-format-settings__table-widget .data-table th:nth-child(6),
.upd-format-settings__table-widget .data-table td:nth-child(6) {
    width: 13%;
}

.upd-format-settings__table-widget .data-table th:nth-child(7),
.upd-format-settings__table-widget .data-table td:nth-child(7) {
    width: 17%;
}

.upd-format-settings__table-widget .data-table th:nth-child(8),
.upd-format-settings__table-widget .data-table td:nth-child(8) {
    width: 18%;
}

.upd-format-settings__empty {
    padding: var(--font_size_0);
    border: 1px dashed var(--border);
    border-radius: var(--font_size__0);
    color: var(--text-2);
}

@container upd-format-page (min-width: 700px) {
    .upd-format-settings .upd-format-settings__fields.workspace-form-grid--three {
        grid-template-columns: minmax(0, 2fr) minmax(220px, 1fr);
        grid-template-areas:
            'document-type effective-from'
            'xml-file xsd-file'
            'actions actions';
    }
}

@container upd-format-page (max-width: 699px) {
    .upd-format-settings__actions .btn {
        width: 100%;
    }
}

@media (orientation: portrait) {
    .upd-format-settings__table-widget.table-widget--auto-height,
    .upd-format-settings__table-widget.table-widget--auto-height .portrait-card-table {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .upd-format-settings__table-widget .portrait-card-table {
        gap: var(--font_size__0);
        padding: 0;
        background: transparent;
    }

    .upd-format-settings__table-widget .portrait-table-card {
        margin: 0;
        padding: var(--font_size__0) var(--font_size_0);
        border: 1px solid var(--border);
        border-radius: var(--font_size__0);
        background: var(--bg-1);
        box-shadow: var(--shadow);
        cursor: default;
    }

    .upd-format-settings__table-widget .portrait-table-card__field {
        grid-template-columns: minmax(110px, 42%) minmax(0, 1fr);
        gap: var(--font_size__0);
        padding: 6px 0;
    }

    .upd-format-settings__table-widget .portrait-table-card__label,
    .upd-format-settings__table-widget .portrait-table-card__value {
        font-size: var(--font_size_0);
    }
}

/* Файл Import1CPanel.css */

.import-1c-settings {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    gap: var(--font_size_0);
    box-sizing: border-box;
    padding: var(--font_size_0) 0 var(--font_size_0) var(--font_size_0);
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--bg-2);
}

.import-1c-settings__section {
    display: flex;
    width: auto;
    min-width: 0;
    flex-direction: column;
    gap: var(--font_size_0);
    padding: var(--font_size_1);
    margin-right: 0;
}

.import-1c-settings__header h2,
.import-1c-settings__section h3 {
    margin: 0;
    color: var(--blue-navy);
}

.import-1c-settings__header p {
    max-width: 850px;
    margin: var(--font_size__0) 0 0;
    color: var(--text-3);
}

.import-1c-settings__upload,
.import-1c-settings__apply-footer,
.import-1c-settings__status-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size_0);
}

.import-1c-settings__file {
    display: flex;
    min-width: min(100%, 420px);
    flex-direction: column;
    gap: var(--font_size__0);
    color: var(--text-1);
    font-weight: 600;
}

.import-1c-settings__file input {
    width: 100%;
    box-sizing: border-box;
    padding: var(--font_size__0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
}

.import-1c-settings__button {
    min-height: calc(var(--font_size_10) + var(--font_size__0));
    padding: 0 var(--font_size_1);
    border: 0;
    border-radius: var(--font_size__0);
    font-size: var(--font_size_0);
    font-weight: 600;
    cursor: pointer;
}

.import-1c-settings__button_primary {
    background: var(--accent);
    color: var(--bg-1);
    box-shadow: var(--shadow);
}

.import-1c-settings__button:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.import-1c-settings__error {
    padding: var(--font_size_0);
    border: 1px solid var(--accent-red);
    border-radius: var(--font_size__0);
    background: var(--bg-2);
    color: var(--accent-red);
}

.import-1c-settings__progress {
    width: 100%;
    height: var(--font_size_0);
}

.import-1c-settings__progress-caption {
    color: var(--text-3);
    text-align: right;
}

.import-1c-settings__report {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: var(--font_size__0);
}

.import-1c-settings__report > div {
    display: flex;
    flex-direction: column;
    gap: calc(var(--font_size__0) / 2);
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-2);
}

.import-1c-settings__report strong {
    color: var(--blue-navy);
    font-size: var(--font_size_2);
}

.import-1c-settings__report span,
.import-1c-settings__apply-footer > span {
    color: var(--text-3);
}

.import-1c-settings__details {
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    padding: var(--font_size_0);
}

.import-1c-settings__details summary {
    color: var(--blue-navy);
    font-weight: 600;
    cursor: pointer;
}

.import-1c-settings__tables {
    display: flex;
    flex-wrap: wrap;
    gap: var(--font_size__0);
    margin-top: var(--font_size_0);
}

.import-1c-settings__tables code {
    padding: calc(var(--font_size__0) / 2) var(--font_size__0);
    border-radius: calc(var(--font_size__0) / 2);
    background: var(--bg-2);
}

.import-1c-settings__report-table-wrap {
    width: 100%;
    margin-top: var(--font_size_0);
    overflow-x: auto;
}

.import-1c-settings__report-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    background: var(--bg-1);
}

.import-1c-settings__report-table th,
.import-1c-settings__report-table td {
    padding: var(--font_size__0);
    border: 1px solid var(--border);
    color: var(--text-2);
    text-align: left;
    vertical-align: top;
}

.import-1c-settings__report-table th {
    background: var(--bg-2);
    color: var(--blue-navy);
}

.import-1c-settings__log {
    max-height: 320px;
    margin: var(--font_size_0) 0 0;
    overflow: auto;
    padding: var(--font_size_0);
    background: var(--text-1);
    color: var(--bg-1);
    white-space: pre-wrap;
    word-break: break-word;
}

.import-1c-settings__modes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--font_size_0);
}

.import-1c-settings__mode {
    display: flex;
    align-items: flex-start;
    gap: var(--font_size__0);
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    cursor: pointer;
}

.import-1c-settings__mode > span {
    display: flex;
    flex-direction: column;
    gap: calc(var(--font_size__0) / 2);
}

.import-1c-settings__mode small {
    color: var(--text-3);
}

.import-1c-settings__success {
    border: 1px solid var(--accent-success);
}

@media (orientation: portrait), (max-width: 900px) {
    .import-1c-settings__report,
    .import-1c-settings__modes {
        grid-template-columns: 1fr;
    }

    .import-1c-settings__button,
    .import-1c-settings__upload > *,
    .import-1c-settings__apply-footer > * {
        width: 100%;
    }
}

/* Файл tab_settings_layout.css */

#tab-container-tab_0
> .tab-content-wrapper.scrollable
> .tab-content-item.active:has(
    > .tab-widget-container > #tab-container-tab_5
) {
    min-width: 0;
    padding: 0 0 0 4px !important;
    overflow: hidden !important;
    scrollbar-gutter: auto;
}

#tab-container-tab_0
> .tab-content-wrapper.scrollable
> .tab-content-item.active
> .tab-widget-container:has(> #tab-container-tab_5) {
    width: 100%;
    min-width: 0;
    height: 100%;
    overflow: hidden !important;
}

#tab-container-tab_5,
#tab-container-tab_5 > .tab-content-wrapper,
#tab-container-tab_5 > .tab-content-wrapper > .tab-content-item {
    width: 100%;
    min-width: 0;
}

#tab-container-tab_5
> .tab-content-wrapper
> .tab-content-item.active:has(> .settings-workspace) {
    min-height: 0;
    overflow: hidden;
}

#tab-container-tab_5
> .tab-content-wrapper
> .tab-content-item.active
> .settings-workspace {
    flex: 1 1 auto;
    min-height: 0;
}

/* Файл settings_workspace.css */

.settings-workspace {
    display: flex;
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: var(--font_size__0);
    box-sizing: border-box;
    padding: var(--font_size__0);
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--bg-2);
    scrollbar-gutter: auto;
}

.settings-workspace > .block_1,
.settings-workspace > .settings-workspace__card {
    width: 100%;
    min-width: 0;
    max-width: none;
    box-sizing: border-box;
    margin: 0;
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size_1);
    background: var(--bg-1);
    color: var(--blue-navy);
    box-shadow: var(--shadow);
}

.settings-workspace > .settings-workspace__card {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
}

/* Файл scheduler_control.css */

.developer-scheduler-control {
    align-items: center;
    display: flex;
    gap: 10px;
}

.developer-scheduler-control__button {
    background: var(--main-color, #2f80c9);
    border: 1px solid var(--main-color, #2f80c9);
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
    padding: 6px 10px;
}

.developer-scheduler-control__button--stop {
    background: transparent;
    color: var(--main-color, #2f80c9);
}

.developer-scheduler-control__button:disabled {
    cursor: wait;
    opacity: 0.6;
}

/* Файл pages_dev_base.css */

/* Файл pages_dev.css */

.developer-settings-root,
.developer-database,
.developer-storage {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
}

.developer-settings-root {
    overflow: hidden;
}

.developer-database,
.developer-storage {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
    padding: var(--font_size__0);
    overflow: hidden;
    background: var(--page_background);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.developer-database .block_1,
.developer-storage .block_1 {
    margin: 0;
}

.developer-loading,
.developer-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 140px;
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.developer-toolbar,
.developer-storage__toolbar {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
    flex: 0 0 auto;
    padding: var(--font_size__0);
}

.developer-toolbar__modes {
    display: flex;
    align-items: center;
    gap: 6px;
}

.developer-search {
    flex: 1 1 300px;
    min-width: 160px;
    min-height: 34px;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 6px 10px;
    background: var(--bg-1);
    color: var(--text-2);
    font: inherit;
    outline: none;
}

.developer-search:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 18%, transparent);
}

.developer-summary-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: var(--font_size__0);
    flex: 0 0 auto;
}

.developer-summary-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size__0);
    min-height: calc(var(--font_size_10) + var(--font_size__0));
    padding: calc(var(--font_size__0) * .75) var(--font_size_0);
}

.developer-summary-card span,
.developer-storage__metric span,
.developer-storage__toolbar span {
    color: var(--text-3);
}

.developer-summary-card b,
.developer-storage__metric strong {
    color: var(--text-1);
    font-size: var(--font_size_2);
}

.developer-table-list {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: calc(var(--font_size__0) * .5);
    min-height: 0;
    overflow: auto;
    padding-right: calc(var(--font_size__0) * .25);
}

.developer-table-card {
    flex: 0 0 auto;
    overflow: hidden;
    padding: 0;
}

.developer-table-card > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: calc(var(--font_size__0) * .75) var(--font_size_0);
    cursor: pointer;
    list-style: none;
    background: var(--bg-1);
}

.developer-table-card > summary::-webkit-details-marker {
    display: none;
}

.developer-table-card > summary::before {
    content: '›';
    flex: 0 0 auto;
    color: var(--accent);
    font-size: var(--font_size_2);
    transition: transform .16s ease;
}

.developer-table-card[open] > summary::before {
    transform: rotate(90deg);
}

.developer-table-card > summary > div:first-of-type {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
}

.developer-table-card > summary strong {
    color: var(--text-1);
}

.developer-table-card > summary span {
    color: var(--text-3);
}

.developer-table-card__stats {
    display: flex;
    align-items: center;
    gap: calc(var(--font_size__0) * .75);
    flex-wrap: wrap;
    justify-content: flex-end;
}

.developer-table-card__stats span {
    display: inline-flex;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 2px calc(var(--font_size__0) * .75);
    background: var(--bg-2);
    white-space: nowrap;
}

.developer-column-list {
    border-top: 1px solid var(--border);
}

.developer-column-row {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.6fr)
        minmax(90px, .6fr)
        minmax(90px, .5fr)
        minmax(180px, 1fr);
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 4px 12px;
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
}

.developer-column-row:nth-child(even) {
    background: color-mix(in srgb, var(--bg-2) 55%, var(--bg-1));
}

.developer-column-name {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.developer-column-name strong,
.developer-column-reference {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.developer-column-type,
.developer-column-nullable,
.developer-column-reference {
    color: var(--text-3);
}

.developer-key {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    min-height: 20px;
    border-radius: 5px;
    padding: 0 4px;
    color: var(--bg-1);
    font-size: calc(var(--font_size_0) * .75);
    font-weight: 700;
}

.developer-key--pk {
    background: var(--accent-orange-text);
}

.developer-key--fk {
    background: var(--accent-blue);
}

.developer-table-card__actions {
    display: flex;
    justify-content: flex-end;
    padding: 8px 12px;
    background: var(--bg-1);
}

.developer-table-error {
    padding: 8px 12px;
    color: var(--accent-red);
    background: color-mix(in srgb, var(--accent-red) 8%, var(--bg-1));
}

.developer-diagram-shell {
    position: relative;
    flex: 1 1 auto;
    min-height: 500px;
    overflow: hidden;
    background:
        linear-gradient(
            to right,
            color-mix(in srgb, var(--border) 55%, transparent) 1px,
            transparent 1px
        ),
        linear-gradient(
            to bottom,
            color-mix(in srgb, var(--border) 55%, transparent) 1px,
            transparent 1px
        ),
        var(--bg-2);
    background-size: 24px 24px;
}

/* Файл pages_dev_navigation.css */

.developer-diagram-tools {
    position: absolute;
    z-index: 20;
    top: 10px;
    right: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card);
    box-shadow: var(--shadow);
}

.developer-diagram-viewport {
    width: 100%;
    height: 100%;
    min-height: 500px;
    overflow: auto;
}

.developer-diagram-viewport::after {
    content: '';
    display: block;
    width: var(--diagram-width);
    height: var(--diagram-height);
    pointer-events: none;
}

.developer-diagram-canvas {
    position: absolute;
    left: 0;
    top: 0;
    transform-origin: 0 0;
}

.developer-relations {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: visible;
    pointer-events: none;
}

.developer-relations path {
    fill: none;
    stroke: color-mix(in srgb, var(--accent) 75%, var(--text-3));
    stroke-width: 1.5;
    opacity: .78;
}

.developer-relations marker path {
    fill: var(--accent);
    stroke: none;
}

.developer-schema-table {
    position: absolute;
    z-index: 2;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--border));
    border-radius: 10px;
    background: var(--bg-1);
    box-shadow: var(--shadow);
}

.developer-schema-table > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 46px;
    padding: 6px 9px;
    box-sizing: border-box;
    color: var(--bg-1);
    background: linear-gradient(135deg, var(--accent-blue), var(--blue-navy));
    cursor: grab;
    user-select: none;
}

.developer-schema-table > header:active {
    cursor: grabbing;
}

.developer-schema-table > header > div {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.developer-schema-table > header strong,
.developer-schema-table > header span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.developer-schema-table > header span {
    opacity: .8;
    font-size: calc(var(--font_size_0) * .78);
}

.developer-schema-table > header button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 7px;
    color: var(--bg-1);
    background: rgba(255,255,255,.13);
    cursor: pointer;
}

.developer-schema-column {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 70px;
    align-items: center;
    gap: 5px;
    height: 30px;
    box-sizing: border-box;
    padding: 0 8px;
    border-bottom: 1px solid var(--border);
}

.developer-schema-column:last-child {
    border-bottom: none;
}

.developer-schema-column:nth-child(even) {
    background: color-mix(in srgb, var(--bg-2) 55%, var(--bg-1));
}

.developer-schema-column__key {
    color: var(--accent-orange-text);
    font-weight: 700;
    font-size: calc(var(--font_size_0) * .72);
}

.developer-schema-column__name,
.developer-schema-column__type {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.developer-schema-column__type {
    color: var(--text-3);
    text-align: right;
    font-size: calc(var(--font_size_0) * .76);
}

.developer-preview {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 0 0 min(42vh, 430px);
    min-height: 220px;
    overflow: hidden;
}

.developer-preview__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
}

.developer-preview__header > div {
    display: flex;
    flex-direction: column;
}

.developer-preview__header span {
    color: var(--text-3);
}

.developer-preview__scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.developer-preview table {
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
    background: var(--bg-1);
}

.developer-preview th,
.developer-preview td {
    max-width: 360px;
    padding: 6px 8px;
    border: 1px solid var(--border);
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.developer-preview th {
    position: sticky;
    top: 0;
    z-index: 1;
    color: var(--bg-1);
    background: var(--text-2);
}

.developer-storage__toolbar {
    justify-content: space-between;
}

.developer-storage__toolbar > div {
    display: flex;
    flex-direction: column;
}

.developer-storage__main {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(260px, 1fr);
    flex: 0 0 min(30vh, 260px);
    gap: var(--font_size__0);
    min-height: 0;
}

.developer-storage__donut-card {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--font_size_0);
    min-height: 0;
    padding: var(--font_size_0);
}

.developer-storage__donut {
    display: grid;
    place-items: center;
    width: 168px;
    height: 168px;
    flex: 0 0 168px;
    border-radius: 50%;
    background: conic-gradient(
        var(--accent) 0 var(--storage-used),
        var(--bg-2) var(--storage-used) 100%
    );
    box-shadow: inset 0 0 0 1px var(--border);
}

.developer-storage__donut::before {
    content: '';
    grid-area: 1 / 1;
    width: 112px;
    height: 112px;
    border-radius: 50%;
    background: var(--bg-1);
    box-shadow: 0 0 0 1px var(--border);
}

/* Файл pages_dev_dashboard.css */

.developer-storage__donut > div {
    position: relative;
    grid-area: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.developer-storage__donut strong {
    color: var(--text-1);
    font-size: var(--font_size_3);
}

.developer-storage__donut span {
    color: var(--text-3);
}

.developer-storage__legend {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
}

.developer-storage__legend > div {
    display: flex;
    align-items: center;
    gap: 10px;
}

.developer-storage__legend > div > div {
    display: flex;
    flex-direction: column;
}

.developer-storage__legend small {
    color: var(--text-3);
}

.developer-storage__dot {
    width: 13px;
    height: 13px;
    border-radius: 50%;
}

.developer-storage__dot--used {
    background: var(--accent);
}

.developer-storage__dot--free {
    background: var(--bg-2);
    border: 1px solid var(--border);
}

.developer-storage__cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--font_size__0);
    min-height: 0;
}

.developer-storage__metric {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 0;
    padding: var(--font_size_0);
}

.developer-storage__breakdown {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: var(--font_size_0);
}

.developer-storage__breakdown h3 {
    margin: 0 0 var(--font_size__0);
    color: var(--text-1);
}

.developer-storage__row {
    display: grid;
    grid-template-columns: minmax(180px, 280px) 1fr;
    align-items: center;
    gap: var(--font_size_0);
    margin-bottom: var(--font_size__0);
}

.developer-storage__row:last-child {
    margin-bottom: 0;
}

.developer-storage__row > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.developer-storage__row span {
    color: var(--text-3);
}

.developer-storage__bar {
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--bg-2);
}

.developer-storage__bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent), var(--accent-blue));
}

@media (max-width: 1000px) {
    .developer-summary-grid {
        grid-template-columns: repeat(3, minmax(120px, 1fr));
    }

    .developer-column-row {
        grid-template-columns: minmax(190px, 1.4fr) 90px 90px;
    }

    .developer-column-reference {
        grid-column: 1 / -1;
    }

    .developer-storage__main {
        grid-template-columns: 1fr;
        flex-basis: auto;
        overflow: auto;
    }
}

@media (orientation: portrait), (max-width: 720px) {
    .developer-database,
    .developer-storage {
        padding: calc(var(--font_size__0) * .75);
    }

    .developer-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .developer-toolbar__modes {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .developer-summary-grid {
        grid-template-columns: repeat(2, minmax(100px, 1fr));
    }

    .developer-table-card > summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .developer-table-card__stats {
        justify-content: flex-start;
    }

    .developer-column-row {
        grid-template-columns: minmax(0, 1fr) 80px;
    }

    .developer-column-nullable,
    .developer-column-reference {
        grid-column: 1 / -1;
    }

    .developer-storage__donut-card {
        flex-direction: column;
    }

    .developer-storage__row {
        grid-template-columns: 1fr;
        gap: 6px;
    }
}

/* Компактная верхняя навигация только внутри конфигурации Developer. */

.developer-settings-root .tab-nav-top {
    gap: calc(var(--font_size__0) * .4);
    margin-bottom: 0;
    padding: calc(var(--font_size__0) * .25);
}

.developer-settings-root .tab-nav-top .tab-item-wrapper {
    padding: calc(var(--font_size__0) * .55) var(--font_size_0);
}

/* Основные параметры сервера и история нагрузки. */

.developer-server {
    display: flex;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    gap: var(--font_size__0);
    padding: var(--font_size__0);
    overflow: hidden;
    background: var(--page_background);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.developer-server .block_1 {
    margin: 0;
}

.developer-server__toolbar,
.developer-server__chart-header {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size_0);
}

.developer-server__toolbar {
    padding: var(--font_size__0) var(--font_size_0);
}

.developer-server__toolbar > div,
.developer-server__chart-header > div:first-child,
.developer-server__metric {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.developer-server__toolbar span,
.developer-server__chart-header span,
.developer-server__metric span,
.developer-server__metric small {
    color: var(--text-3);
}

.developer-server__cards {
    display: grid;
    flex: 0 0 auto;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--font_size__0);
}

.developer-server__metric {
    min-height: 116px;
    justify-content: center;
    padding: var(--font_size_0);
}


/* Файл pages_dev_cards.css */

.developer-server__metric strong {
    color: var(--text-1);
    font-size: var(--font_size_3);
}

.developer-server__progress {
    width: 100%;
    height: var(--font_size__0);
    overflow: hidden;
    border-radius: var(--font_size_0);
    background: var(--bg-2);
}

.developer-server__progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent), var(--accent-blue));
}

.developer-server__chart {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: var(--font_size__0);
    overflow: hidden;
    padding: var(--font_size_0);
}

.developer-server__legend {
    display: flex;
    align-items: center;
    gap: var(--font_size_0);
}

.developer-server__legend span {
    position: relative;
    padding-left: var(--font_size_0);
}

.developer-server__legend span::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: var(--font_size__0);
    height: var(--font_size__0);
    border-radius: 50%;
    content: '';
    transform: translateY(-50%);
}

.developer-server__legend-cpu::before {
    background: var(--accent);
}

.developer-server__legend-memory::before {
    background: var(--accent-orange-text);
}

.developer-server__chart-body {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
}

.developer-server__chart-body svg {
    width: 100%;
    min-height: 220px;
    flex: 1 1 auto;
    overflow: visible;
}

.developer-server__grid-line {
    stroke: var(--border);
    stroke-width: 1;
}

.developer-server__grid-label {
    fill: var(--text-3);
    font-size: var(--font_size_0);
}

.developer-server__line {
    fill: none;
    stroke-width: 3;
    vector-effect: non-scaling-stroke;
}

.developer-server__line--cpu {
    stroke: var(--accent);
}

.developer-server__line--memory {
    stroke: var(--accent-orange-text);
}

.developer-server__axis {
    display: flex;
    justify-content: space-between;
    color: var(--text-3);
    font-size: var(--font_size_0);
}

@media (orientation: portrait), (max-width: 800px) {
    .developer-server__cards {
        grid-template-columns: 1fr;
        overflow: auto;
    }

    .developer-server__metric {
        min-height: 86px;
    }

    .developer-server__chart-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Современный дашборд Developer */

.developer-settings-root {
    background: var(--bg-2);
}

.developer-settings-root .tab-nav-top {
    gap: 8px;
    padding: 8px 10px 0;
    background: transparent;
}

.developer-settings-root .tab-nav-top .tab-item-wrapper {
    border-radius: 14px 14px 0 0;
    overflow: hidden;
}

.developer-settings-root .tab-nav-top .tab-btn {
    min-height: 42px;
    border-radius: 14px 14px 0 0;
}

.developer-storage--rich {
    padding: 10px;
    gap: 12px;
}

.developer-storage__dashboard {
    display: grid;
    grid-template-columns: minmax(320px, 1.4fr) minmax(260px, 1fr);
    gap: 12px;
}

.developer-storage__hero {
    grid-column: 1 / -1;
    padding: 14px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(247,250,255,0.98) 100%);
}

.developer-storage__hero-main {
    display: grid;
    grid-template-columns: minmax(340px, 1fr) minmax(380px, 1.2fr);
    gap: 14px;
    align-items: stretch;
}

.developer-storage__cards--compact {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.developer-storage__cards--compact .developer-storage__metric,
.developer-storage__server-card,
.developer-storage__breakdown,
.developer-storage__chart-card,
.developer-storage__toolbar {
    border-radius: 18px;
}

.developer-storage__server-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    grid-column: 1 / -1;
}

.developer-storage__server-card {
    display: flex;
    min-height: 132px;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
}

.developer-storage__server-card span,
.developer-storage__section-title span {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.developer-storage__server-card strong {
    color: var(--blue-navy);
    font-size: var(--font_size_2);
}

.developer-storage__section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.developer-storage__section-title h3 {
    margin: 0;
}

.developer-storage__chart-card,
.developer-storage__breakdown {
    padding: 14px;
}

.developer-storage__area-chart {
    display: flex;
    min-height: 320px;
    flex-direction: column;
    gap: 10px;
}

.developer-storage__area-chart svg {
    width: 100%;
    height: 280px;
    overflow: visible;
}

.developer-storage__chart-grid {
    stroke: rgba(21, 87, 170, 0.14);
    stroke-width: 1;
}

.developer-storage__chart-label {
    fill: var(--text-2);
    font-size: var(--font_size_0);
}

.developer-storage__chart-fill {
    fill: rgba(232, 72, 85, 0.68);
}

.developer-storage__chart-line {
    fill: none;
    stroke: #ff2c33;
    stroke-width: 5;
    stroke-linejoin: round;
    stroke-linecap: round;
}


/* Файл pages_dev_charts.css */

.developer-storage__chart-axis {
    display: flex;
    justify-content: space-between;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.developer-storage__breakdown {
    grid-column: 1 / 2;
}

.developer-storage__chart-card {
    grid-column: 2 / 3;
}

.developer-storage__donut-card {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 240px;
    padding: 6px;
}

.developer-storage__metric {
    min-height: 110px;
    padding: 14px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(246,249,254,1) 100%);
}

@media (max-width: 1200px) {
    .developer-storage__dashboard,
    .developer-storage__hero-main,
    .developer-storage__server-summary {
        grid-template-columns: 1fr;
    }

    .developer-storage__breakdown,
    .developer-storage__chart-card {
        grid-column: 1 / -1;
    }

    .developer-storage__cards--compact {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 800px) {
    .developer-storage__cards--compact {
        grid-template-columns: 1fr;
    }

    .developer-storage__donut-card {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Компактная компоновка второй вкладки Developer. */

.developer-storage--rich {
    padding: 6px 8px 8px;
    gap: 8px;
}

.developer-storage__dashboard {
    gap: 8px;
}

.developer-storage__hero {
    padding: 10px;
}

.developer-storage__hero-main {
    gap: 10px;
}

.developer-storage__donut-card {
    min-height: 190px;
    gap: 12px;
    padding: 2px;
}

.developer-storage__donut {
    width: 185px;
    height: 185px;
}

.developer-storage__cards--compact {
    gap: 8px;
}

.developer-storage__metric {
    min-height: 82px;
    padding: 10px 12px;
}

.developer-storage__server-summary {
    gap: 8px;
}

.developer-storage__server-card {
    min-height: 98px;
    gap: 6px;
    padding: 10px 12px;
}

.developer-storage__chart-card,
.developer-storage__breakdown {
    padding: 10px 12px;
}

.developer-storage__section-title {
    margin-bottom: 6px;
}

.developer-storage__area-chart {
    min-height: 215px;
    gap: 4px;
}

.developer-storage__area-chart svg {
    height: 190px;
}

.developer-storage__row {
    padding-top: 3px;
    padding-bottom: 3px;
}

/* Нижняя строка дашборда: состав проекта и две компактные диаграммы. */

.developer-storage__bottom-grid {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: minmax(300px, 1.15fr) repeat(2, minmax(260px, 1fr));
    gap: 8px;
    align-items: stretch;
}

.developer-storage__bottom-grid .developer-storage__breakdown,
.developer-storage__bottom-grid .developer-storage__chart-card {
    min-width: 0;
    grid-column: auto;
}

.developer-storage__bottom-grid .developer-storage__section-title {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
}

.developer-storage__bottom-grid .developer-storage__chart-card {
    min-height: 245px;
}

.developer-storage__chart-canvas {
    position: relative;
    min-height: 0;
    flex: 1 1 auto;
}

.developer-storage__chart-canvas svg {
    display: block;
}

.developer-storage__chart-hit {
    fill: transparent;
    stroke: transparent;
    cursor: crosshair;
    pointer-events: all;
}

.developer-storage__chart-tooltip {
    position: absolute;
    z-index: 4;
    display: flex;
    min-width: 82px;
    flex-direction: column;
    gap: 2px;
    padding: 6px 8px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    box-shadow: var(--shadow);
    pointer-events: none;
    transform: translate(-50%, calc(-100% - 10px));
    white-space: nowrap;
}

.developer-storage__chart-tooltip span {
    color: var(--text-2);
}

.developer-storage__area-chart--users .developer-storage__chart-fill {
    fill: color-mix(in srgb, var(--accent) 42%, transparent);
}

.developer-storage__area-chart--users .developer-storage__chart-line {
    stroke: var(--accent-blue);
}

@media (max-width: 1450px) {
    .developer-storage__bottom-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .developer-storage__bottom-grid .developer-storage__breakdown {
        grid-column: 1 / -1;
    }
}

@media (max-width: 900px) {
    .developer-storage__bottom-grid {
        grid-template-columns: 1fr;
    }

    .developer-storage__bottom-grid .developer-storage__breakdown {
        grid-column: auto;
    }
}

/* Компактная и понятная схема связей по одинаковым ID-столбцам. */

.developer-diagram-shell {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.developer-diagram-viewport {
    position: relative;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    overflow: auto;
    scrollbar-gutter: stable both-edges;
    overscroll-behavior: contain;
}

.developer-diagram-canvas {
    min-width: 100%;
    min-height: 100%;
}

.developer-relations path {
    stroke-width: 1.35;
    opacity: 0.82;
}

.developer-schema-table {
    border-radius: 8px;
    font-size: var(--font_size_0);
}

.developer-schema-table > header {
    min-height: 42px;
    padding: 5px 8px;
    font-size: var(--font_size_0);
}

/* Файл pages_dev_tables.css */

.developer-schema-table > header strong {
    font-size: var(--font_size_0);
}

.developer-schema-table > header span {
    font-size: calc(var(--font_size_0) * 0.74);
}

.developer-schema-column {
    height: 26px;
    grid-template-columns: 25px minmax(0, 1fr) 62px;
    gap: 4px;
    padding: 0 7px;
    font-size: calc(var(--font_size_0) * 0.88);
}

.developer-schema-column__key {
    font-size: calc(var(--font_size_0) * 0.68);
}

.developer-schema-column__type {
    font-size: calc(var(--font_size_0) * 0.70);
}

/* Переключаемый Developer-дашборд. */

.developer-dashboard__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 16px;
}

.developer-dashboard__switcher {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    padding: 2px;
}

.developer-dashboard__switch {
    flex: 0 0 auto;
    min-height: 36px;
    padding: 6px 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 700;
    cursor: pointer;
}

.developer-dashboard__switch:hover {
    border-color: var(--accent);
    background: var(--bg-2);
    color: var(--accent-dark);
}

.developer-dashboard__switch--active,
.developer-dashboard__switch--active:hover {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.developer-dashboard__content,
.developer-dashboard__section {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px;
}

.developer-dashboard__storage-hero {
    display: grid;
    grid-template-columns: minmax(310px, 0.9fr) minmax(420px, 1.4fr);
    gap: 10px;
    padding: 10px 12px;
    border-radius: 18px;
}

.developer-dashboard__storage-hero .developer-storage__donut-card {
    min-height: 174px;
}

.developer-dashboard__composition {
    min-width: 0;
    padding-left: 8px;
    border-left: 1px solid var(--border);
}

.developer-dashboard__composition .developer-storage__section-title {
    margin-bottom: 4px;
}

.developer-dashboard__composition .developer-storage__row {
    padding: 3px 0;
}

.developer-dashboard__metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.developer-dashboard__metrics--six {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.developer-dashboard__metric {
    display: flex;
    min-width: 0;
    min-height: 78px;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: var(--bg-1);
    box-shadow: var(--shadow);
}

.developer-dashboard__metric span,
.developer-dashboard__metric small {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.developer-dashboard__metric strong {
    overflow: hidden;
    color: var(--accent-dark);
    font-size: var(--font_size_1);
    text-overflow: ellipsis;
}

.developer-dashboard__metric--success strong {
    color: var(--success, #16864b);
}

.developer-dashboard__metric--warning strong {
    color: var(--accent-orange-text);
}

.developer-dashboard__metric--danger strong {
    color: var(--danger, #c73535);
}

.developer-dashboard__overview-grid,
.developer-dashboard__two-columns {
    display: grid;
    min-height: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.developer-dashboard__overview-grid {
    grid-template-columns: minmax(280px, 0.85fr) minmax(420px, 1.35fr);
}

.developer-dashboard__panel {
    min-width: 0;
    min-height: 0;
    padding: 10px 12px;
    border-radius: 16px;
}

.developer-dashboard__panel .developer-storage__area-chart {
    min-height: 205px;
}

.developer-dashboard__panel .developer-storage__area-chart svg {
    height: 180px;
}

.developer-dashboard__integration-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.developer-dashboard__integration-mini,
.developer-dashboard__integration-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 7px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: var(--bg-1);
    box-shadow: var(--shadow);
}

.developer-dashboard__integration-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.developer-dashboard__integration-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.developer-dashboard__integration-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 10px;
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.developer-dashboard__integration-error {
    overflow-wrap: anywhere;
    color: var(--danger, #c73535);
    font-size: var(--font_size_0);
}

.developer-dashboard__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--bg-2);
    color: var(--text-2);
    font-size: var(--font_size_0);
    font-weight: 700;
}

.developer-dashboard__status--ok,
.developer-dashboard__status--running,
.developer-dashboard__status--enabled {
    background: color-mix(in srgb, #16864b 13%, var(--bg-1));
    color: #16864b;
}

.developer-dashboard__status--error {
    background: color-mix(in srgb, #c73535 13%, var(--bg-1));
    color: #c73535;
}

.developer-dashboard__status--disabled,
.developer-dashboard__status--never {
    background: var(--bg-2);
    color: var(--text-2);
}

.developer-dashboard__ranked-list,
.developer-dashboard__routes {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

/* Файл pages_dev_integration_errors.css */

.developer-dashboard__integration-error-button {
    display: inline-flex;
    width: calc(var(--font_size_1) * 1.7);
    height: calc(var(--font_size_1) * 1.7);
    align-self: flex-end;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--danger);
    border-radius: 50%;
    background: var(--bg-1);
    color: var(--danger);
    font-size: var(--font_size_1);
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.developer-dashboard__integration-error-button:hover,
.developer-dashboard__integration-error-button:focus-visible {
    background: var(--danger);
    color: var(--bg-1);
}

.developer-integration-error-panel {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: var(--font_size_0);
}

.developer-integration-error-panel__notice {
    display: flex;
    align-items: center;
    gap: var(--font_size__0);
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--bg-1);
    color: var(--text-2);
}

.developer-integration-error-panel__icon {
    display: inline-flex;
    width: calc(var(--font_size_1) * 1.8);
    height: calc(var(--font_size_1) * 1.8);
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--danger);
    color: var(--bg-1);
    font-size: var(--font_size_1);
    font-weight: 700;
}

.developer-integration-error-panel__text {
    min-height: 240px;
    max-height: calc(100dvh - 190px);
    box-sizing: border-box;
    margin: 0;
    padding: var(--font_size_0);
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--bg-1);
    color: var(--danger);
    font-family: monospace;
    font-size: var(--font_size_0);
    line-height: 1.45;
    overflow-wrap: normal;
    tab-size: 4;
    user-select: text;
    white-space: pre-wrap;
    word-break: normal;
}

.developer-integration-error-panel__copy {
    min-width: 120px;
    padding: var(--font_size__0) var(--font_size_0);
    border: 1px solid var(--bg-1);
    border-radius: var(--font_size__0);
    background: transparent;
    color: var(--bg-1);
    cursor: pointer;
}

.developer-integration-error-panel__copy:disabled {
    cursor: default;
    opacity: .55;
}

/* Файл 01.css */

/* Файл pages_dev_schema.css */

.developer-dashboard__ranked-row,
.developer-dashboard__route-row {
    display: grid;
    min-width: 0;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    border-bottom: 1px solid var(--border);
}

.developer-dashboard__ranked-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.developer-dashboard__route-row {
    grid-template-columns: minmax(0, 1fr) repeat(3, auto);
}

.developer-dashboard__ranked-row:last-child,
.developer-dashboard__route-row:last-child {
    border-bottom: 0;
}

.developer-dashboard__ranked-row strong,
.developer-dashboard__route-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.developer-dashboard__ranked-row span,
.developer-dashboard__route-row span {
    color: var(--text-2);
    font-size: var(--font_size_0);
    white-space: nowrap;
}

.developer-dashboard__note {
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-2);
    color: var(--text-2);
    font-size: var(--font_size_0);
}

@media (max-width: 1300px) {
    .developer-dashboard__metrics--six {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .developer-dashboard__integration-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .developer-dashboard__storage-hero,
    .developer-dashboard__overview-grid,
    .developer-dashboard__two-columns {
        grid-template-columns: 1fr;
    }

    .developer-dashboard__composition {
        padding-top: 8px;
        padding-left: 0;
        border-top: 1px solid var(--border);
        border-left: 0;
    }

    .developer-dashboard__metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .developer-dashboard__integration-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .developer-dashboard__toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .developer-dashboard__metrics,
    .developer-dashboard__metrics--six,
    .developer-dashboard__integration-grid {
        grid-template-columns: 1fr;
    }
}

.developer-dashboard__metric--green strong {
    color: #16864b;
}

.developer-dashboard__metric--orange strong {
    color: var(--accent-orange-text);
}

.developer-dashboard__metric--red strong {
    color: #c73535;
}

.developer-storage__area-chart--requests .developer-storage__chart-fill {
    fill: color-mix(in srgb, var(--accent) 30%, transparent);
}

.developer-storage__area-chart--requests .developer-storage__chart-line,
.developer-storage__area-chart--storage .developer-storage__chart-line {
    stroke: var(--accent-blue);
}

.developer-dashboard__content {
    overflow: auto;
    padding-right: 2px;
    scrollbar-gutter: stable;
}

.developer-dashboard__section {
    flex: 0 0 auto;
}

/* Компактная конфигурация Developer без боковой панели */

.developer-app-shell {
    display: flex;
    width: 100%;
    height: 100dvh;
    min-width: 0;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
    background: var(--page_background);
}

.developer-app-toolbar {
    display: flex;
    min-height: 42px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: var(--font_size__0);
    padding: 4px var(--font_size_0);
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
}

.developer-app-toolbar__switches {
    display: flex;
    align-items: center;
    gap: 6px;
}

.developer-app-toolbar__policy {
    border: 0;
    background: transparent;
    color: var(--accent);
    font-size: var(--font_size_0);
    text-decoration: underline;
    cursor: pointer;
}

.developer-app-content {
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.developer-settings-root .tab-nav-top {
    justify-content: flex-start;
}

.developer-settings-root .tab-link {
    white-space: nowrap;
}

/* Компактные блоки вкладки «Производительность». */

.developer-dashboard__metrics--performance {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.developer-dashboard__section--performance .developer-dashboard__metric {
    min-height: 58px;
    gap: 1px;
    padding: 6px 9px;
}

.developer-dashboard__section--performance .developer-dashboard__metric span,
.developer-dashboard__section--performance .developer-dashboard__metric small {
    font-size: calc(var(--font_size_0) * .78);
}

.developer-dashboard__section--performance .developer-dashboard__metric strong {
    font-size: var(--font_size_0);
}

.developer-dashboard__two-columns--performance .developer-dashboard__panel {
    padding: 7px 9px;
}

.developer-dashboard__two-columns--performance .developer-storage__area-chart {
    min-height: 142px;
}

.developer-dashboard__two-columns--performance .developer-storage__area-chart svg {
    height: 118px;
}

.developer-dashboard__routes-panel {
    flex: 0 0 auto;
    max-height: 150px;
    padding: 7px 9px;
    overflow: hidden;
}

.developer-dashboard__routes-panel .developer-dashboard__routes {
    max-height: 96px;
    overflow-y: auto;
}

.developer-dashboard__routes-panel .developer-dashboard__route-row {
    padding: 3px 0;
}

.developer-dashboard__integration-list--details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.developer-dashboard__integration-list--details .developer-dashboard__integration-mini {
    gap: 4px;
    padding: 7px 9px;
    box-shadow: none;
}

.developer-dashboard__integration-list--details .developer-dashboard__integration-details {
    gap: 2px 7px;
    font-size: calc(var(--font_size_0) * .74);
}

.developer-dashboard__integration-note {
    margin-top: 6px;
    color: var(--text-2);
    font-size: calc(var(--font_size_0) * .74);
}

@media (max-width: 1200px) {
    .developer-dashboard__metrics--performance {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 750px) {
    .developer-dashboard__metrics--performance,
    .developer-dashboard__integration-list--details {
        grid-template-columns: 1fr;
    }
}


/* Разделение названия и веса в детализации диска. */
.developer-dashboard__ranked-row {
    grid-template-columns: minmax(0, 1fr) minmax(140px, 34%);
}


/* Файл 02.css */

.developer-dashboard__ranked-label {
    display: flex;
    min-width: 0;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
}

.developer-dashboard__ranked-label strong {
    min-width: 0;
}

.developer-dashboard__ranked-label span {
    flex: 0 0 auto;
}

.developer-dashboard__integration-time {
    display: flex;
    min-width: 0;
    align-items: baseline;
    justify-content: flex-end;
    gap: 6px;
    white-space: nowrap;
}

.developer-dashboard__integration-time span {
    color: inherit;
    font-size: inherit;
}

@media (max-width: 750px) {
    .developer-dashboard__ranked-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .developer-dashboard__ranked-label {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }

    .developer-dashboard__integration-time {
        align-items: flex-end;
        flex-direction: column;
        gap: 1px;
    }
}

/* Файл pages_dev_schema.css */

/* Файл pages_dev_storage_layout.css */

/* Растягивание таблицы медленных маршрутов до нижней границы экрана. */

.developer-dashboard__section--performance {
    min-height: 0;
    flex: 1 1 auto;
}

.developer-dashboard__section--performance .developer-dashboard__routes-panel {
    display: flex;
    min-height: 140px;
    max-height: none;
    flex: 1 1 0;
    flex-direction: column;
}

.developer-dashboard__section--performance .developer-dashboard__routes {
    min-height: 0;
    max-height: none;
    flex: 1 1 auto;
    overflow-y: auto;
}

/* Левая навигация конфигурации Developer. */
.developer-settings-root > .tab-widget-container,
.developer-settings-root .tab-container-left,
.developer-settings-root .tab-content-wrapper,
.developer-settings-root .tab-content-left,
.developer-settings-root .tab-content-item.active {
    height: 100%;
    min-height: 0;
}

.developer-settings-root .tab-nav-left {
    height: 100%;
    min-height: 0;
    padding: 6px;
    border-right: 1px solid var(--border);
    background: var(--bg-1);
}

.developer-side-navigation {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 8px;
}

.developer-side-navigation .btn {
    width: 100%;
}

.developer-side-dashboard {
    display: flex;
    width: 100%;
    min-width: 0;
    flex-direction: column;
    gap: 6px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--border);
}

.developer-side-dashboard strong {
    color: var(--blue-navy);
    font-size: var(--font_size_0);
}

.developer-side-dashboard > span {
    color: var(--text-3);
    font-size: calc(var(--font_size_0) * .82);
    line-height: 1.3;
}

.developer-side-dashboard .btn {
    width: 100%;
}

.developer-side-dashboard__policy {
    width: 100%;
    padding: 3px 0;
    border: 0;
    background: transparent;
    color: var(--accent);
    font-size: calc(var(--font_size_0) * .78);
    line-height: 1.3;
    text-align: left;
    text-decoration: underline;
    cursor: pointer;
}

.developer-app-content {
    height: 100%;
}

/* Внутренняя прокрутка состава проекта на невысоких экранах. */
.developer-dashboard__composition {
    max-height: clamp(220px, 42dvh, 430px);
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: var(--font_size__0);
    scrollbar-gutter: stable;
}

/* Файл pages_dev_storage_metrics.css */

/* Верхние показатели Developer: четыре карточки в каждой строке. */
.developer-dashboard__overview-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    align-items: stretch;
}

.developer-dashboard__overview-metrics .developer-dashboard__metric {
    min-height: 78px;
}

.developer-dashboard__metrics--performance,
.developer-dashboard__metrics--storage {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.developer-storage--rich {
    gap: 6px;
    padding-top: 6px;
}

.developer-storage__dot--total {
    background: var(--text-2);
}

.developer-dashboard__chart-stack {
    display: grid;
    min-width: 0;
    min-height: 0;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.developer-dashboard__chart-panel {
    display: flex;
    min-height: 0;
    flex-direction: column;
}

.developer-dashboard__chart-panel .developer-storage__section-title {
    flex: 0 0 auto;
}

.developer-dashboard__chart-panel .developer-storage__area-chart {
    min-height: 0;
    flex: 1 1 auto;
}

.developer-dashboard__chart-panel .developer-storage__chart-canvas svg {
    height: 100%;
    min-height: 120px;
}

@media (max-width: 1180px) {
    .developer-dashboard__overview-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (orientation: portrait) and (max-width: 560px) {
    .developer-dashboard__overview-metrics,
    .developer-dashboard__metrics--performance,
    .developer-dashboard__metrics--storage {
        grid-template-columns: minmax(0, 1fr);
    }

    .developer-dashboard__chart-stack {
        grid-template-rows: none;
    }
}

.developer-dashboard__metric[type="button"] {
    border: 0;
    text-align: left;
    cursor: pointer;
}

.developer-dashboard__metric[type="button"]:hover {
    transform: translateY(-1px);
}

.developer-dashboard__drill-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
}

.developer-dashboard__drill-head h3 {
    margin: 0;
}

.developer-dashboard__drill-head label {
    display: grid;
    gap: 3px;
    color: var(--text-3);
    font-size: var(--font_size__0);
}

.developer-dashboard__drill-head input {
    min-height: 34px;
    padding: 4px 8px;
    border: 1px solid var(--border);
    border-radius: 10px;
}

.developer-storage__donut-card .universal-chart--donut {
    grid-template-columns: minmax(190px, 220px) 1fr;
}


@media (orientation: portrait) and (max-width: 900px) {
    .developer-dashboard__drill-head {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
    }

    .developer-dashboard__drill-head > div {
        min-width: 0;
    }

    .developer-dashboard__drill-head label {
        display: grid;
        width: 100%;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        gap: 8px;
    }

    .developer-dashboard__drill-head input {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .developer-dashboard__route-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }

    .developer-dashboard__route-row strong,
    .developer-dashboard__route-row span {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
        word-break: break-word;
    }
}


.developer-storage__disk-dot--project {
    background: var(--success, #2b9b67);
}

.developer-storage__disk-dot--outside {
    background: var(--warning, #ef8b24);
}

.developer-dashboard__runtime-grid {
    display: grid;
    gap: var(--font_size_0);
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.developer-dashboard__runtime-grid > div {
    background: var(--bg-1);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
    min-width: 0;
    padding: var(--font_size_0);
}

.developer-dashboard__runtime-grid span {
    color: var(--text-2);
    font-size: var(--font_size__0);
}

.developer-dashboard__runtime-grid strong {
    color: var(--text-3);
    overflow-wrap: anywhere;
}

.developer-dashboard__metric--code-split strong {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
}

.developer-dashboard__metric--code-split strong span {
    white-space: nowrap;
}

/* Файл pages_dev_storage_code.css */


/* Единая карточка количества строк кода и детализация по разделам. */
.developer-dashboard__metric-column--code {
    grid-template-rows: minmax(0, 1fr);
}

.developer-dashboard__metric--code-total {
    height: 100%;
    justify-content: center;
}

.developer-dashboard__metric--code-total strong {
    font-size: calc(var(--font_size_2) * 1.12);
}

.developer-code-drill {
    min-height: 0;
    flex: 1 1 auto;
}

.developer-code-drill__head {
    grid-template-columns: auto minmax(0, 1fr);
}

.developer-code-drill__head span,
.developer-code-drill__note {
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.developer-code-drill__panel {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    padding: var(--font_size_0);
}

.developer-code-drill__columns,
.developer-code-drill__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(110px, 150px) minmax(110px, 150px);
    align-items: center;
    gap: 12px;
    font-size: var(--font_size_0);
}

.developer-code-drill__columns {
    padding: 0 12px 8px;
    color: var(--text-3);
}

.developer-code-drill__columns span:not(:first-child) {
    text-align: right;
}

.developer-code-drill__rows {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
}

.developer-code-drill__row {
    min-height: 44px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
}

.developer-code-drill__row:last-child {
    border-bottom: 0;
}

.developer-code-drill__row > span {
    min-width: 0;
    padding-left: calc(var(--developer-code-level, 0) * 22px);
    overflow-wrap: anywhere;
}

.developer-code-drill__row strong {
    color: var(--text-2);
    font-size: var(--font_size_0);
    text-align: right;
}

.developer-code-drill__row--emphasis {
    background: var(--bg-2);
}

.developer-code-drill__row--emphasis > span,
.developer-code-drill__row--emphasis strong {
    color: var(--blue-navy);
    font-weight: 700;
}

.developer-code-drill__note {
    margin: 12px 0 0;
    line-height: 1.45;
}

@media (max-width: 680px) {
    .developer-code-drill__columns,
    .developer-code-drill__row {
        grid-template-columns: minmax(0, 1fr) 82px 82px;
        gap: 6px;
    }

    .developer-code-drill__row > span {
        padding-left: calc(var(--developer-code-level, 0) * 12px);
    }
}

/* Файл 01.css */

/* Файл pages_dev_servers.css */

.developer-dashboard__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex: 0 0 auto;
}

.developer-dashboard__header .developer-dashboard__switcher {
    min-width: 0;
    flex: 1 1 auto;
}

.developer-dashboard__server-selector {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 320px;
    padding: 4px 6px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
}

.developer-dashboard__server-selector label {
    color: var(--text-3);
    font-size: var(--font_size__0);
    white-space: nowrap;
}

.developer-dashboard__server-selector select {
    min-width: 160px;
    max-width: 280px;
    flex: 1 1 auto;
    margin: 0;
    padding: 6px 28px 6px 9px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
}

.developer-dashboard__server-refresh {
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    flex: 0 0 32px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-2);
    color: var(--accent-dark);
    font-size: var(--font_size_1) !important;
    line-height: 1;
}

.developer-dashboard__server-refresh:hover:not(:disabled) {
    background: var(--bg-3);
    color: var(--accent-dark);
    transform: none;
}

.developer-dashboard__server-status {
    max-width: 120px;
    overflow: hidden;
    color: var(--text-3);
    font-size: var(--font_size__0);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.developer-dashboard__metric[type="button"],
.developer-dashboard__metric[type="button"]:hover,
.developer-dashboard__metric[type="button"]:focus,
.developer-dashboard__metric[type="button"]:active {
    border: 1px solid var(--border);
    background: var(--bg-1);
    color: var(--text-1);
}

.developer-dashboard__metric[type="button"] span,
.developer-dashboard__metric[type="button"] small {
    color: var(--text-2);
}

.developer-dashboard__metric[type="button"] strong {
    color: var(--accent-dark);
    opacity: 1;
    visibility: visible;
}

.developer-dashboard__metric[type="button"]:hover {
    border-color: var(--accent);
    box-shadow: var(--shadow);
    transform: translateY(-1px);
}

.developer-storage__donut-card {
    display: grid;
    grid-template-columns: minmax(185px, 230px) minmax(185px, 1fr);
    align-items: center;
}

.developer-storage__disk-chart.universal-chart--donut {
    display: block;
}

.developer-storage__disk-chart .universal-chart__legend {
    display: none;
}

.developer-storage__disk-chart .universal-chart__donut-wrap {
    margin: 0 auto;
}

.developer-storage__disk-legend {
    display: grid;
    gap: 10px;
    align-content: center;
}

.developer-storage__disk-legend-row {
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--text-1);
    text-align: left;
}

button.developer-storage__disk-legend-row:hover {
    background: transparent;
    color: var(--text-1);
    transform: none;
    box-shadow: none;
}

.developer-storage__disk-legend-row b,
.developer-storage__disk-legend-row small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.developer-storage__disk-legend-row b {
    color: var(--text-1);
    font-size: var(--font_size_1);
}

.developer-storage__disk-legend-row small {
    color: var(--text-3);
}

.developer-storage__disk-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
}

.developer-storage__disk-dot--total {
    background: var(--text-2);
}

.developer-storage__disk-dot--used {
    background: var(--accent, #3b86c8);
}

.developer-storage__disk-dot--free {
    border: 1px solid var(--border);
    background: var(--bg-3, #e8f0f7);
}

@media (max-width: 1080px) {
    .developer-dashboard__header {
        align-items: stretch;
        flex-direction: column;
    }

    .developer-dashboard__server-selector {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }
}

@media (max-width: 700px) {
    .developer-storage__donut-card {
        grid-template-columns: 1fr;
    }

    .developer-dashboard__server-status {
        display: none;
    }
}



.developer-storage__disk-chart .universal-chart__donut-hole strong {
    font-size: var(--font_size_10);
}

/* Файл 02.css */

@media (orientation: portrait) {
    .developer-settings-root,
    .developer-settings-root .tab-widget-container,
    .developer-settings-root .tab-container-left,
    .developer-settings-root .tab-content-wrapper,
    .developer-settings-root .tab-content-left,
    .developer-settings-root .tab-content-item.active,
    .developer-storage,
    .developer-dashboard__content,
    .developer-dashboard__section {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .developer-storage {
        overflow-x: hidden;
        overflow-y: auto;
    }

    .developer-dashboard__header {
        align-items: stretch;
        flex-direction: column;
    }

    .developer-dashboard__switcher {
        display: flex;
        width: 100%;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-gutter: auto;
        -webkit-overflow-scrolling: touch;
    }

    .developer-dashboard__switch {
        width: auto;
        min-width: max-content;
        min-height: 32px;
        flex: 0 0 auto;
        padding: calc(var(--font_size__0) * .75) var(--font_size_0);
        font-size: var(--font_size_0);
        font-weight: 400;
        white-space: nowrap;
    }

    .developer-dashboard__server-selector {
        display: grid;
        width: 100%;
        min-width: 0;
        grid-template-columns: auto minmax(0, 1fr) 32px;
        box-sizing: border-box;
    }

    .developer-dashboard__server-selector select {
        width: 100%;
        max-width: none;
        min-width: 0;
    }

    .developer-dashboard__server-status {
        grid-column: 2 / -1;
        max-width: none;
    }

    .developer-dashboard__storage-hero,
    .developer-dashboard__overview-grid,
    .developer-dashboard__two-columns,
    .developer-dashboard__integration-grid,
    .developer-dashboard__integration-list,
    .developer-dashboard__integration-list--details {
        grid-template-columns: minmax(0, 1fr);
    }

    .developer-storage__donut-card .universal-chart--donut {
        grid-template-columns: minmax(0, 1fr);
    }

    .developer-dashboard__panel,
    .developer-dashboard__metric,
    .developer-dashboard__integration-mini,
    .developer-dashboard__integration-card {
        max-width: 100%;
        box-sizing: border-box;
    }
}


@media (orientation: portrait) and (max-width: 560px) {
    .developer-dashboard__metrics--overview,
    .developer-dashboard__metrics--performance,
    .developer-dashboard__metrics--storage,
    .developer-dashboard__user-stack {
        grid-template-columns: minmax(0, 1fr);
    }
}


button.developer-storage__disk-legend-row {
    cursor: pointer;
}

button.developer-storage__disk-legend-row:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 4px;
}

/* Файл pages_dev_servers.css */

/* Файл pages_dev.css */

/* Файл dataflow_query_combine_panel.css */

.office-dataflow-combine-panel .drawer-body {
    display: flex;
    flex-direction: column;
    gap: var(--font_size_0);
}

.office-dataflow-combine-panel__base {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
}

.office-dataflow-combine-panel__base strong,
.office-dataflow-combine-panel__base span {
    color: var(--blue-navy);
    font-size: var(--font_size_0);
}

.office-dataflow-combine-panel__base small {
    color: var(--text-3);
    font-size: var(--font_size_button);
    line-height: 1.4;
}

.office-dataflow-combine-panel__queries {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
}

.office-dataflow-combine-panel__queries h3 {
    margin: 0;
    font-size: var(--font_size_0);
}

.office-dataflow-combine-panel__query {
    display: flex;
    flex-direction: column;
    gap: var(--font_size_0);
    padding: var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
}

.office-dataflow-combine-panel__query--selected {
    border-color: var(--accent);
}

.office-dataflow-combine-panel__query-title {
    display: flex;
    align-items: flex-start;
    gap: var(--font_size__0);
    cursor: pointer;
}

.office-dataflow-combine-panel__query-title input {
    width: var(--font_size_0);
    height: var(--font_size_0);
    flex: 0 0 auto;
    margin: 2px 0 0;
}

.office-dataflow-combine-panel__query-title > span {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.office-dataflow-combine-panel__query-title strong {
    overflow-wrap: anywhere;
    color: var(--blue-navy);
    font-size: var(--font_size_0);
}

.office-dataflow-combine-panel__query-title small {
    color: var(--text-3);
    font-size: var(--font_size_button);
}

.office-dataflow-combine-panel__keys {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--font_size_0);
}

.office-dataflow-combine-panel__keys label {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
}

.office-dataflow-combine-panel__keys label > span {
    color: var(--text-2);
    font-size: var(--font_size_button);
}

.office-dataflow-combine-panel__keys select {
    width: 100%;
    min-height: 38px;
    padding: 0 var(--font_size__0);
    font-size: var(--font_size_button);
}

.office-dataflow-combine-panel__empty {
    padding: var(--font_size_0);
    border: 1px dashed var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-3);
    font-size: var(--font_size_button);
    text-align: center;
}

.office-dataflow-combine-panel__actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--font_size__0);
    margin-top: auto;
    padding-top: var(--font_size__0);
}

.office-dataflow-combine-panel__actions button {
    min-height: 38px;
    padding: 0 var(--font_size_0);
    font-size: var(--font_size_button);
}

@media (max-width: 680px) {
    .office-dataflow-combine-panel__keys {
        grid-template-columns: 1fr;
    }

    .office-dataflow-combine-panel__actions {
        flex-direction: column-reverse;
    }

    .office-dataflow-combine-panel__actions button {
        width: 100%;
    }
}

/* Файл office_dataflow_queries.css */

.office-query__workspace.office-query__workspace--queries {
    grid-template-columns:
        minmax(160px, calc(var(--dataflow-left-panel-width, 17.5%) - 3px))
        6px
        minmax(320px, calc(var(--dataflow-center-panel-width, 65%) - 6px))
        6px
        minmax(180px, calc(var(--dataflow-right-panel-width, 17.5%) - 3px));
    gap: 0;
}

.office-dataflow-resizer {
    position: relative;
    z-index: 4;
    min-width: 6px;
    min-height: 0;
    cursor: col-resize;
    touch-action: none;
    outline: none;
}

.office-dataflow-resizer::before {
    content: '';
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 2px;
    width: 2px;
    border-radius: 2px;
    background: var(--border, #dfe5f2);
    transition: background .15s ease;
}

.office-dataflow-resizer:hover::before,
.office-dataflow-resizer:focus-visible::before,
.office-dataflow-resizer--active::before {
    background: var(--accent, #3d84c4);
}

.office-dataflow-queries {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: var(--bg-1, #fff);
    border: 1px solid var(--border, #dfe5f2);
    border-radius: 10px;
    box-shadow: var(--shadow, 0 6px 14px rgba(15, 23, 42, .06));
}

.office-dataflow-queries__header {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 11px;
    border-bottom: 1px solid var(--border, #dfe5f2);
    color: var(--text-2, #334155);
    font-size: var(--font_size_button, 14px);
}

.office-dataflow-queries__header button {
    width: 26px;
    height: 26px;
    padding: 0;
    border: 1px solid var(--border, #dfe5f2);
    border-radius: 7px;
    background: var(--bg-2, #edf1f5);
    color: var(--accent-blue, #2f75b5);
    cursor: pointer;
    font-size: var(--font_size_1, 18px);
    line-height: 1;
}

.office-dataflow-queries__list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 7px;
}

.office-dataflow-queries__item {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    padding: 8px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--text-2, #334155);
    text-align: left;
    cursor: pointer;
}

.office-dataflow-queries__item:hover {
    background: var(--bg-2, #edf1f5);
}

.office-dataflow-queries__item--active {
    border-color: var(--accent, #3d84c4);
    background: var(--bg-2, #edf1f5);
}

.office-dataflow-queries__item strong,
.office-dataflow-queries__item small,
.office-dataflow-queries__item span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.office-dataflow-queries__item strong {
    font-size: var(--font_size_button, 14px);
}

.office-dataflow-queries__item small,
.office-dataflow-queries__item span {
    color: var(--text-3, #64748b);
    font-size: var(--font_size_button, 14px);
    line-height: 1.25;
}

.office-dataflow-queries__actions {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 34px);
    justify-content: end;
    gap: 6px;
    padding: 7px;
    border-top: 1px solid var(--border, #dfe5f2);
}

.office-dataflow-queries__actions button {
    width: 34px;
    height: 34px;
    min-width: 0;
    padding: 0;
    border: 1px solid var(--border, #dfe5f2);
    border-radius: 7px;
    background: var(--bg-1, #fff);
    color: var(--text-2, #334155);
    cursor: pointer;
    font-size: var(--font_size_button, 14px);
    line-height: 1;
}

.office-dataflow-queries__actions button span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.office-query__workspace--queries .office-query-steps__empty,
.office-query__workspace--queries .office-query__empty-preview {
    font-size: var(--font_size_button, 14px);
}

@media (max-width: 1100px) {
    .office-query__workspace.office-query__workspace--queries {
        grid-template-columns:
            minmax(140px, calc(var(--dataflow-left-panel-width, 17.5%) - 3px))
            6px
            minmax(240px, calc(var(--dataflow-center-panel-width, 65%) - 6px))
            6px
            minmax(160px, calc(var(--dataflow-right-panel-width, 17.5%) - 3px));
    }
}

@media (max-width: 760px) {
    .office-query__workspace.office-query__workspace--queries {
        grid-template-columns: 1fr;
        gap: 8px;
        overflow-y: auto;
    }

    .office-dataflow-resizer {
        display: none;
    }

    .office-dataflow-queries,
    .office-query__preview,
    .office-query-steps {
        min-height: 180px;
    }
}

/* Файл office_dataflow_import.css */

.office-postgres-import {
    display: grid;
    gap: 18px;
}

.office-postgres-import__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.office-postgres-import__grid label {
    display: grid;
    gap: 6px;
    font-weight: 600;
}

.office-postgres-import__grid input,
.office-postgres-import__grid textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border-color, #cfdceb);
    border-radius: 10px;
    font: inherit;
}

.office-postgres-import__grid textarea {
    min-height: 180px;
    resize: vertical;
    font-family: monospace;
}

.office-postgres-import__wide {
    grid-column: 1 / -1;
}

.office-postgres-import__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

@media (orientation: portrait), (max-width: 760px) {
    .office-postgres-import__grid {
        grid-template-columns: 1fr;
    }

    .office-postgres-import__wide {
        grid-column: auto;
    }
}

/* Файл office_extended_tools.css */

.office-ribbon-extensions {
    display: flex;
    min-width: 0;
    flex: 0 1 auto;
    align-items: stretch;
    gap: 2px;
    order: 2;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

.office-ribbon__tabs-actions {
    order: 10;
}

.office-ribbon-menu {
    position: relative;
    flex: 0 0 auto;
}

.office-ribbon-menu__summary {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    white-space: nowrap;
}

.office-ribbon-menu__summary::-webkit-details-marker {
    display: none;
}

.office-ribbon-menu[open] .office-ribbon-menu__summary {
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: 0 -1px 0 var(--bg-1), 0 0 0 1px var(--border) inset;
}

.office-ribbon-menu__list {
    position: fixed;
    z-index: 900;
    display: grid;
    width: min(360px, calc(100vw - 24px));
    max-height: min(520px, calc(100dvh - 90px));
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
    margin-top: 2px;
    padding: 8px;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
    box-shadow: var(--box-shadow);
}

.office-ribbon-menu__list button {
    min-width: 0;
    min-height: 34px;
    padding: 6px 8px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.office-ribbon-menu__list button:hover {
    background: color-mix(in srgb, var(--accent) 8%, var(--bg-1));
}

.office-extended-tools__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--font_size__0);
}

.office-extended-tools__grid > * {
    width: 100%;
}

.office-sheet__objects .office-card--table-object,
.office-sheet__objects .office-card--pivot-object {
    display: none;
}

@media (orientation: portrait), (max-width: 900px) {
    .office-ribbon-extensions {
        max-width: 42vw;
        scrollbar-width: thin;
    }

    .office-ribbon-menu__list {
        left: 8px;
        grid-template-columns: 1fr;
    }

    .office-extended-tools__grid {
        grid-template-columns: 1fr;
    }
}

.office-ribbon-menu__summary--active {
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: 0 -1px 0 var(--bg-1), 0 0 0 1px var(--border) inset;
}

.office-command-panel .drawer-body {
    padding: var(--font_size_0);
}

.office-command-panel__groups {
    display: flex;
    flex-direction: column;
    gap: var(--font_size__0);
}

.office-command-panel__group {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--font_size_0);
    background: var(--bg-1);
}

.office-command-panel__group summary {
    padding: var(--font_size_0);
    color: var(--text-1);
    font-size: var(--font_size_0);
    font-weight: 700;
    cursor: pointer;
    list-style-position: inside;
}

.office-command-panel__group[open] summary {
    border-bottom: 1px solid var(--border);
    background: var(--bg-2);
}

.office-command-panel__commands {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--font_size__0);
    padding: var(--font_size_0);
}

.office-command-panel__commands button {
    min-width: 0;
    min-height: 40px;
    padding: var(--font_size__0) var(--font_size_0);
    border: 1px solid var(--border);
    border-radius: var(--font_size__0);
    background: var(--bg-1);
    color: var(--text-1);
    font: inherit;
    text-align: left;
    overflow-wrap: anywhere;
    cursor: pointer;
}

.office-command-panel__commands button:hover {
    background: color-mix(in srgb, var(--accent) 8%, var(--bg-1));
}

@media (max-width: 762px) {
    .office-command-panel__commands {
        grid-template-columns: 1fr;
    }
}

/* Файл office_sheet_formula_picker.css */

.office-formula-bar__fx {
    width: 100%;
    min-width: 0;
    padding: 0;
    border: 0;
    border-right: 1px solid #e0e6f1;
    border-radius: 0;
    background: #fff;
    cursor: pointer;
}

.office-formula-bar__fx:hover,
.office-formula-bar__fx:focus-visible {
    background: var(--bg-2);
    color: var(--accent);
    outline: none;
}

.office-formula-picker {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
}

.office-formula-picker__search {
    display: grid;
    gap: 6px;
    color: var(--text-2);
    font-weight: 600;
}

.office-formula-picker__search input {
    width: 100%;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    box-sizing: border-box;
}

.office-formula-picker__groups {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.office-formula-picker__group {
    padding: 7px 11px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg-1);
    color: var(--text-2);
    cursor: pointer;
}

.office-formula-picker__group--active {
    border-color: var(--accent);
    background: var(--accent);
    color: var(--bg-1);
}

.office-formula-picker__summary {
    color: var(--text-3);
    font-size: var(--font_size_0);
}

.office-formula-picker__list {
    display: grid;
    gap: 8px;
}

.office-formula-picker__item {
    display: grid;
    gap: 4px;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    text-align: left;
    cursor: pointer;
}

.office-formula-picker__item:hover,
.office-formula-picker__item:focus-visible {
    border-color: var(--accent);
    background: var(--bg-2);
    outline: none;
}

.office-formula-picker__item strong {
    color: var(--accent);
}

.office-formula-picker__item span {
    color: var(--text-2);
    font-size: var(--font_size_0);
}

.office-formula-picker__item small {
    color: var(--text-3);
}

/* Файл workspace_base.css */

.office-workspace {
    display: flex;
    height: 100dvh;
    min-height: 100dvh;
    overflow: hidden;
    background: #f4f6fb;
    font-family: Arial, sans-serif;
}

.office-workspace__sidebar {
    width: 140px;
    min-width: 140px;
    height: 100dvh;
    overflow: hidden;
    background: linear-gradient(180deg, #0f4f97 0%, #0d3f79 100%);
    color: #fff;
    padding: 12px 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.office-workspace__brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
}

.office-workspace__brand strong {
    display: block;
    font-size: 16px;
}

.office-workspace__brand span {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.78);
}

.office-workspace__logo {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
}

.office-workspace__switches,
.office-workspace__links {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.office-workspace__switch,
.office-workspace__links button,
.office-workspace__policy,
.office-ribbon__tab,
.office-toolbar-buttons button,
.office-query__header-cell button {
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: inherit;
    border-radius: 9px;
    cursor: pointer;
    transition: background 0.2s ease;
}

.office-workspace__switch,
.office-workspace__links button,
.office-workspace__policy {
    color: #fff;
    padding: 8px 7px;
    font-size: 11px;
    line-height: 1.3;
}

.office-workspace__switch:hover,
.office-workspace__links button:hover,
.office-workspace__policy:hover {
    background: rgba(255, 255, 255, 0.16);
}

.office-workspace__switch--active {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.32);
}

.office-workspace__policy {
    margin-top: auto;
}

.office-workspace__save {
    border: 1px solid rgba(255, 255, 255, 0.24);
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    border-radius: 10px;
    padding: 8px 7px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.office-workspace__save:disabled {
    cursor: wait;
    opacity: 0.65;
}

.office-workspace__content {
    flex: 1;
    min-width: 0;
    height: 100dvh;
    overflow: hidden;
    padding: 10px;
}

.office-workspace__panel {
    display: flex;
    flex-direction: column;
    height: calc(100dvh - 20px);
    min-height: 0;
    gap: 8px;
}

.office-workspace__panel--writer {
    overflow: hidden;
}

.office-workspace__panel--writer .doc-editor {
    height: 100%;
    min-height: 0;
}

.office-workspace__panel--sheet,
.office-workspace__panel--dataflow {
    overflow: hidden;
}

/* Файл ribbon.css */

.office-ribbon {
    flex: 0 0 auto;
    background: #fff;
    border: 1px solid #dfe5f2;
    border-radius: 12px;
    overflow: hidden;
}

.office-ribbon--sheet,
.office-ribbon--dataflow,
.office-ribbon--dashboard {
    height: 132px;
    min-height: 132px;
    max-height: 132px;
}

.office-ribbon__tabs {
    height: 38px;
    display: flex;
    align-items: flex-end;
    gap: 6px;
    padding: 5px 9px 0;
    background: #edf2fb;
}

.office-ribbon__tab {
    height: 33px;
    background: #fff;
    color: #244067;
    border: 1px solid #d9e1f1;
    padding: 6px 13px;
    font-size: 12px;
    font-weight: 600;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.office-ribbon__tab--active {
    background: #fefefe;
    border-color: #b8c8e8;
}

.office-ribbon__content {
    display: flex;
    align-items: stretch;
    gap: 10px;
    padding: 8px 10px;
}

.office-ribbon__content--sheet,
.office-ribbon__content--dataflow,
.office-ribbon__content--dashboard {
    height: 94px;
    min-height: 94px;
    max-height: 94px;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
}

.office-ribbon__content--file {
    align-items: center;
}

.office-ribbon__group {
    min-width: max-content;
    padding: 4px 10px 5px 0;
    border-right: 1px solid #e2e7f0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 5px;
}

.office-ribbon__group--wide {
    min-width: 260px;
}

.office-ribbon__group--save {
    margin-left: auto;
    border-right: 0;
    padding-right: 0;
}

.office-ribbon__group-title {
    color: #6a7690;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.office-ribbon__group-row {
    display: flex;
    align-items: center;
    gap: 5px;
}

.office-ribbon__formula-help,
.office-ribbon__hint {
    color: #66748e;
    font-size: 11px;
    line-height: 1.35;
}

.office-field {
    display: inline-flex;
    flex-direction: column;
    gap: 3px;
    min-width: 132px;
}

.office-field--small {
    min-width: 66px;
}

.office-field span {
    color: #687892;
    font-size: 10px;
    font-weight: 600;
}

.office-field select {
    height: 29px;
    min-height: 29px;
    border: 1px solid #d6ddeb;
    border-radius: 8px;
    padding: 0 8px;
    background: #fff;
    color: #20304d;
    font-size: 11px;
}

.office-toolbar-buttons {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.office-toolbar-buttons--compact {
    flex-wrap: nowrap;
}

.office-toolbar-buttons button,
.office-query__header-cell button {
    background: #fff;
    color: #234068;
    border-color: #d7dfef;
    padding: 6px 9px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.office-toolbar-buttons button:hover,
.office-query__header-cell button:hover,
.office-ribbon__tab:hover {
    background: #f5f8fe;
}

.office-primary-button {
    border: 1px solid #2f75c8;
    border-radius: 8px;
    background: #3d86d1;
    color: #fff;
    padding: 7px 13px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.office-primary-button:hover {
    background: #3277c1;
}

.office-primary-button:disabled {
    cursor: wait;
    opacity: 0.65;
}

/* Файл sheet_grid.css */

.office-formula-bar {
    flex: 0 0 34px;
    height: 34px;
    display: grid;
    grid-template-columns: 92px 34px minmax(0, 1fr);
    align-items: stretch;
    background: #fff;
    border: 1px solid #dfe5f2;
    border-radius: 8px;
    overflow: hidden;
}

.office-formula-bar__address,
.office-formula-bar__fx {
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #e0e6f1;
    color: #304363;
    font-size: 11px;
    font-weight: 700;
}

.office-formula-bar__fx {
    color: #58729c;
    font-style: italic;
}

.office-formula-bar input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: none;
    padding: 0 10px;
    color: #1f2f4a;
    font-size: 12px;
    font-family: Arial, sans-serif;
}

.office-sheet-grid {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    position: relative;
    background: #fff;
    border: 1px solid #dfe5f2;
    border-radius: 10px;
    outline: none;
}

.office-sheet-grid__canvas {
    position: relative;
}

.office-sheet-grid__corner,
.office-sheet-grid__column-header,
.office-sheet-grid__row-header,
.office-sheet-grid__cell,
.office-sheet-grid__cell-input {
    position: absolute;
    box-sizing: border-box;
    border-right: 1px solid #e3e8f2;
    border-bottom: 1px solid #e3e8f2;
}

.office-sheet-grid__corner,
.office-sheet-grid__column-header,
.office-sheet-grid__row-header {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f6fb;
    color: #42516b;
    font-size: 11px;
    font-weight: 600;
    z-index: 5;
}

.office-sheet-grid__corner {
    z-index: 7;
}

.office-sheet-grid__column-header {
    z-index: 6;
}

.office-sheet-grid__row-header {
    z-index: 6;
}

.office-sheet-grid__cell {
    padding: 5px 7px;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #fff;
    color: #263750;
    font-size: 12px;
    line-height: 18px;
    cursor: cell;
    z-index: 1;
}

.office-sheet-grid__cell:hover {
    background: #f8fbff;
}

.office-sheet-grid__cell--active {
    outline: 2px solid #2f80d4;
    outline-offset: -2px;
    z-index: 3;
}

.office-sheet-grid__cell-input {
    padding: 3px 6px;
    outline: 2px solid #2f80d4;
    outline-offset: -2px;
    border-top: 0;
    border-left: 0;
    background: #fff;
    color: #1f2f4a;
    font-size: 12px;
    font-family: Arial, sans-serif;
    z-index: 10;
}

.office-sheet__addons {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 10px;
}

.office-sheet__objects {
    flex: 0 0 auto;
    max-height: 260px;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.office-sheet__objects h3 {
    margin: 0;
    color: #20385f;
    font-size: 14px;
}

.office-card {
    background: #fff;
    border: 1px solid #dfe5f2;
    border-radius: 10px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.office-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.office-card__header strong {
    color: #1f3457;
    font-size: 12px;
}

.office-card__header span {
    color: #6a7a93;
    font-size: 10px;
}

.office-card--table-object,
.office-card--pivot-object {
    min-width: 0;
    overflow: auto;
}

.office-card--table-object .table-widget,
.office-card--pivot-object .pivot-table-container {
    min-height: 170px;
}

/* Файл query_preview.css */

.office-query__status {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    color: #5d6a80;
    font-size: 11px;
}

.office-query__workspace {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 8px;
    overflow: hidden;
}

.office-query__preview {
    min-width: 0;
    min-height: 0;
    overflow: auto;
    background: #fff;
    border: 1px solid #dfe5f2;
    border-radius: 10px;
    box-shadow: 0 6px 18px rgba(38, 60, 105, 0.04);
}

.office-query__table {
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
    table-layout: auto;
}

.office-query__table th,
.office-query__table td {
    border-right: 1px solid #e3e8f2;
    border-bottom: 1px solid #e3e8f2;
    padding: 3px 5px;
    height: 24px;
    max-width: 260px;
    color: #263750;
    vertical-align: middle;
    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.office-query__table th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: #f3f6fb;
    color: #253957;
    font-weight: 700;
    text-align: left;
}

.office-query__checkbox-cell {
    position: sticky;
    left: 0;
    z-index: 2;
    width: 54px;
    min-width: 54px;
    max-width: 54px;
    background: #f8faff;
    text-align: center;
}

.office-query__table th.office-query__checkbox-cell {
    z-index: 5;
}

.office-query__checkbox-cell label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 400;
}

.office-query__checkbox-cell input {
    width: 13px;
    height: 13px;
    margin: 0;
}

.office-query__header-cell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    min-width: 120px;
}

.office-query__header-cell button {
    flex: 0 0 auto;
    padding: 3px 6px;
    font-size: 10px;
}

/* Файл query_steps.css */

.office-query-steps {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #dfe5f2;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
}

.office-query-steps__header {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 11px;
    border-bottom: 1px solid #e3e8f2;
    color: #233a60;
    font-size: 12px;
}

.office-query-steps__header span {
    min-width: 24px;
    height: 24px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #edf3fc;
    color: #557096;
    font-size: 10px;
}

.office-query-steps__list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 7px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.office-query-steps__empty {
    display: flex;
    min-height: 120px;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    padding: 18px;
    color: #66748e;
    text-align: center;
    font-size: 11px;
    line-height: 1.4;
}

.office-query__empty-preview {
    min-width: 0;
    min-height: 0;
}

.office-query-steps__item {
    width: 100%;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #2d4262;
    padding: 7px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 7px;
    text-align: left;
    cursor: pointer;
}

.office-query-steps__item:hover {
    background: #f5f8fd;
}

.office-query-steps__item--active {
    border-color: #9ab9e5;
    background: #edf5ff;
}

.office-query-steps__index {
    width: 22px;
    height: 22px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e4edf9;
    color: #48658e;
    font-size: 10px;
    font-weight: 700;
}

.office-query-steps__item > span:last-child {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.office-query-steps__item strong {
    overflow: hidden;
    text-overflow: ellipsis;
    color: #293e5e;
    font-size: 11px;
    white-space: nowrap;
}

.office-query-steps__item small {
    color: #8290a6;
    font-size: 9px;
}

.office-empty-state {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px dashed #cad6ed;
    border-radius: 10px;
    color: #66748e;
    text-align: center;
    padding: 24px;
    font-size: 12px;
}

/* Файл file_panel.css */

.office-file-panel {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    background: #f7f9fd;
    border: 1px solid #dfe5f2;
    border-radius: 10px;
    overflow: hidden;
}

.office-file-panel__sidebar {
    width: 190px;
    min-width: 190px;
    padding: 12px;
    border-right: 1px solid #dfe5f2;
    background: #edf2fb;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.office-file-panel__tab {
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #29466f;
    padding: 9px 11px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.office-file-panel__tab:hover {
    background: rgba(255, 255, 255, 0.7);
}

.office-file-panel__tab--active {
    background: #fff;
    border-color: #d4deef;
}

.office-file-panel__content {
    flex: 1;
    min-width: 0;
    overflow: auto;
    padding: 22px;
}

.office-file-panel__section {
    max-width: 620px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}

.office-file-panel__section h3 {
    margin: 0;
    color: #20385f;
    font-size: 18px;
}

.office-file-panel__section p,
.office-file-panel__section small {
    margin: 0;
    color: #67758d;
    font-size: 12px;
    line-height: 1.5;
}

.office-file-panel__fields {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

.office-file-panel__fields label,
.office-file-panel__name-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.office-file-panel__fields label span,
.office-file-panel__name-field span {
    color: #5a6880;
    font-size: 11px;
    font-weight: 700;
}

.office-file-panel__fields input,
.office-file-panel__name-field input {
    min-height: 36px;
    border: 1px solid #d2dceb;
    border-radius: 8px;
    padding: 0 11px;
    background: #fff;
    color: #20304d;
    font-size: 12px;
}

.office-file-panel__fields input {
    width: 160px;
}

.office-file-panel__name-field {
    width: min(100%, 420px);
}

@media (max-width: 1000px) {
    .office-query__workspace {
        grid-template-columns: minmax(0, 1fr) 230px;
    }
}

@media (max-width: 760px) {
    .office-workspace {
        flex-direction: column;
        height: auto;
        min-height: 100dvh;
        overflow: auto;
    }

    .office-workspace__sidebar {
        width: 100%;
        min-width: 0;
        height: auto;
        flex-direction: row;
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .office-workspace__content {
        height: calc(100dvh - 180px);
    }

    .office-workspace__brand {
        width: 100%;
        flex-direction: row;
        justify-content: center;
    }

    .office-workspace__policy {
        margin-top: 0;
    }

    .office-query__workspace {
        grid-template-columns: 1fr;
    }

    .office-query-steps {
        min-height: 180px;
    }

    .office-file-panel {
        flex-direction: column;
    }

    .office-file-panel__sidebar {
        width: 100%;
        min-width: 0;
        flex-direction: row;
        flex-wrap: wrap;
        border-right: 0;
        border-bottom: 1px solid #dfe5f2;
    }
}

/* Файл writer_overrides.css */

.office-workspace__panel--writer .doc-editor {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    gap: 8px;
    padding-bottom: 0;
}

.office-workspace__panel--writer .doc-editor__layout {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.office-workspace__panel--writer .doc-editor__viewport {
    height: 100%;
    min-height: 0;
    max-height: none;
}

.office-workspace__panel--writer .doc-editor__review-panel {
    height: 100%;
    min-height: 0;
}

.office-workspace__panel--writer .doc-editor__bottom-panel {
    flex: 0 0 26px;
}

.office-query__header-cell input {
    width: 100%;
    min-width: 110px;
    height: 23px;
    box-sizing: border-box;
    border: 1px solid #2f80d4;
    border-radius: 5px;
    padding: 2px 5px;
    background: #fff;
    color: #20304d;
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    outline: none;
}

/* Файл dashboard_charts_core.css */

.office-workspace__panel--dashboard {
    overflow: hidden;
}

.office-ribbon__group--dashboard-source {
    min-width: 290px;
}

.office-dashboard-title-input {
    width: 190px;
    height: 29px;
    box-sizing: border-box;
    border: 1px solid #d6ddeb;
    border-radius: 8px;
    padding: 0 8px;
    color: #20304d;
    font-size: 11px;
    outline: none;
}

.office-dashboard-stage {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 18px;
    background: #e9edf5;
    border: 1px solid #dfe5f2;
    border-radius: 10px;
}

.office-dashboard-slide {
    position: relative;
    width: 1000px;
    height: 562px;
    flex: 0 0 1000px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #d7deeb;
    box-shadow: 0 12px 34px rgba(34, 55, 91, 0.14);
}

.office-dashboard-empty {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    color: #7b879a;
    font-size: 14px;
    text-align: center;
}

.office-dashboard-object {
    position: absolute;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid #d8dfec;
    background: #fff;
    box-shadow: 0 6px 18px rgba(38, 60, 105, 0.08);
    cursor: move;
    user-select: none;
}

.office-dashboard-object--selected {
    outline: 2px solid #2f80d4;
    outline-offset: 2px;
}

.office-dashboard-object__title {
    flex: 0 0 34px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-bottom: 1px solid #e6ebf4;
    color: #243b60;
    font-size: 13px;
    font-weight: 700;
}

.office-dashboard-object__content {
    flex: 1 1 auto;
    min-height: 0;
    padding: 10px;
}

.office-dashboard-chart {
    width: 100%;
    height: 100%;
}

.office-dashboard-chart--bar {
    overflow: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
}

.office-dashboard-bar-row {
    display: grid;
    grid-template-columns: 90px minmax(80px, 1fr) 55px;
    align-items: center;
    gap: 7px;
    min-height: 18px;
    color: #344a6e;
    font-size: 10px;
}

.office-dashboard-bar-row > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.office-dashboard-bar-row > div {
    height: 11px;
    overflow: hidden;
    border-radius: 4px;
    background: #edf2fa;
}

.office-dashboard-bar-row i {
    display: block;
    height: 100%;
    min-width: 2px;
    background: #3e84cf;
}

.office-dashboard-bar-row strong {
    text-align: right;
}

/* Файл dashboard_charts_extra.css */

.office-dashboard-chart--line {
    display: flex;
    flex-direction: column;
    color: #3e84cf;
}

.office-dashboard-chart--line svg {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
}

.office-dashboard-line-labels {
    flex: 0 0 24px;
    display: flex;
    justify-content: space-between;
    gap: 3px;
    color: #66748d;
    font-size: 8px;
}

.office-dashboard-line-labels span {
    max-width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.office-dashboard-chart--pie {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
}

.office-dashboard-pie {
    width: min(190px, 45%);
    aspect-ratio: 1;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04);
}

.office-dashboard-legend {
    min-width: 0;
    max-height: 100%;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: #42526c;
    font-size: 9px;
}

.office-dashboard-legend > div {
    display: grid;
    grid-template-columns: 10px minmax(70px, 1fr) auto;
    align-items: center;
    gap: 5px;
}

.office-dashboard-legend i {
    width: 9px;
    height: 9px;
    border-radius: 2px;
}

.office-dashboard-legend span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Файл workspace_refinements.css */

.office-workspace__panel {
    font-family: var(--office-interface-font-family, Arial), sans-serif;
    font-size: var(--office-interface-font-size, 12px);
}

.office-ribbon--file-only {
    height: 38px;
    min-height: 38px;
    max-height: 38px;
}

.office-ribbon__tabs-actions {
    display: flex;
    align-items: center;
    margin-left: auto;
    padding: 0 0 4px 8px;
}

.office-ribbon__tabs-actions .office-primary-button {
    min-height: 30px;
}

.office-file-panel__fields select {
    min-width: 160px;
    min-height: 36px;
    border: 1px solid #d2dceb;
    border-radius: 8px;
    padding: 0 10px;
    background: #fff;
    color: #20304d;
    font: inherit;
}

.office-sheet-grid__cell,
.office-sheet-grid__cell-input {
    font-family: var(--office-interface-font-family, Arial), sans-serif;
}

.office-sheet-grid__column-header,
.office-sheet-grid__row-header,
.office-sheet-grid__corner {
    font-family: var(--office-interface-font-family, Arial), sans-serif;
    font-size: var(--office-interface-font-size, 12px);
}

.office-query__table th,
.office-query__table td,
.office-query__checkbox-cell label,
.office-query-steps,
.office-query-steps__header,
.office-query-steps__header span,
.office-query-steps__item,
.office-query-steps__index,
.office-query-steps__item strong,
.office-query-steps__item small {
    font-family: var(--office-interface-font-family, Arial), sans-serif;
    font-size: var(--office-interface-font-size, 12px);
}

.office-query__table th,
.office-query__table td {
    height: 28px;
    padding: 4px 6px;
    line-height: 1.25;
}

.office-query-steps__item small {
    opacity: 0.72;
}

.office-dashboard-stage,
.office-dashboard-slide,
.office-dashboard-object,
.office-dashboard-object__title,
.office-dashboard-object__content,
.office-dashboard-empty {
    font-family: var(--office-interface-font-family, Arial), sans-serif;
    font-size: var(--office-interface-font-size, 12px);
}

.office-workspace__panel--file-view {
    gap: 0;
}

.office-workspace__panel--file-view .office-ribbon--file-only {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.office-workspace__panel--file-view .office-file-panel {
    border-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.office-query__header-cell input {
    width: 100%;
    min-width: 90px;
    border: 1px solid #8fb1df;
    border-radius: 6px;
    padding: 3px 5px;
    background: #fff;
    color: inherit;
    font: inherit;
}

.office-query__table th {
    box-sizing: border-box;
    height: 28px;
    min-height: 28px;
    max-height: 28px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.office-query__header-cell {
    height: 20px;
    min-height: 20px;
    max-height: 20px;
}

.office-query__header-cell input {
    height: 20px;
    min-height: 20px;
    max-height: 20px;
    box-sizing: border-box;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 18px;
}

/* Единая лента Nimbus Office в стиле Writer */

/* Файл ribbon_theme.css */

.office-ribbon {
    height: 132px;
    min-height: 132px;
    max-height: 132px;
    flex: 0 0 132px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-1);
}

.office-ribbon--sheet,
.office-ribbon--dataflow,
.office-ribbon--dashboard {
    height: 132px;
    min-height: 132px;
    max-height: 132px;
}

.office-ribbon__tabs {
    display: flex;
    min-width: 0;
    min-height: 38px;
    height: 38px;
    flex: 0 0 38px;
    align-items: stretch;
    gap: 6px;
    padding: 4px 5px 0;
    overflow: hidden;
    border-bottom: 1px solid var(--border);
    background: var(--bg-2);
}

.office-ribbon__tab {
    height: 30px;
    flex: 0 0 auto;
    padding: 0 8px;
    border: 0;
    border-radius: 10px 10px 0 0;
    background: transparent;
    color: var(--text-3);
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: 0.16s ease;
}

.office-ribbon__tab:hover {
    border: 0;
    background: color-mix(in srgb, var(--accent) 7%, var(--bg-1));
    color: var(--text-1);
    box-shadow: none;
    transform: none;
}

.office-ribbon__tab--active {
    border: 0;
    background: var(--bg-1);
    color: var(--text-1);
    box-shadow: 0 -1px 0 var(--bg-1), 0 0 0 1px var(--border) inset;
}

.office-ribbon__content,
.office-ribbon__content--sheet,
.office-ribbon__content--dataflow,
.office-ribbon__content--dashboard {
    display: grid;
    min-width: 0;
    min-height: 0;
    height: 94px;
    max-height: 94px;
    grid-auto-columns: max-content;
    grid-auto-flow: column;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    align-items: center;
    align-content: stretch;
    justify-content: start;
    gap: 4px 8px;
    padding: 5px 8px;
    overflow-x: auto;
    overflow-y: hidden;
    border-bottom: 1px solid var(--border);
    background: var(--bg-1);
    scrollbar-width: thin;
}

.office-ribbon__group {
    min-width: max-content;
    grid-row: 1 / span 2;
    justify-content: center;
    gap: 4px;
    padding: 0 8px 0 0;
    border-right: 1px solid var(--border);
}

.office-ribbon__group-title {
    color: var(--text-3);
    font-size: 10px;
}

.office-toolbar-buttons button,
.office-query__header-cell button,
.office-field select,
.office-dashboard-title-input {
    border-color: var(--border);
    background: var(--bg-1);
    color: var(--text-1);
}

.office-toolbar-buttons button:hover,
.office-query__header-cell button:hover {
    background: color-mix(in srgb, var(--accent) 7%, var(--bg-1));
}

.office-primary-button,
.office-ribbon__tabs-actions .office-primary-button {
    min-width: 142px;
    min-height: 32px;
    margin: 0 2px 0 0;
    padding: 4px 12px;
    border: 1px solid var(--accent);
    border-radius: 9px;
    background: var(--accent);
    color: var(--bg-1);
    font-size: 12px;
    white-space: nowrap;
}

.office-primary-button:hover {
    border-color: var(--accent-blue);
    background: var(--accent-blue);
    color: var(--bg-1);
}

.office-ribbon__tabs-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    margin-left: auto;
    padding: 0 2px 4px 8px;
}

.office-ribbon--file-only {
    height: 38px;
    min-height: 38px;
    max-height: 38px;
    flex-basis: 38px;
}

/* Фиксированные заголовки виртуального листа */
.office-sheet-grid {
    contain: strict;
}

.office-sheet-grid__column-header-layer {
    position: sticky;
    top: 0;
    z-index: 20;
    pointer-events: none;
}

.office-sheet-grid__row-header-layer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 19;
    pointer-events: none;
    will-change: transform;
}

.office-sheet-grid__corner {
    z-index: 24;
    will-change: transform;
}

.office-sheet-grid__column-header,
.office-sheet-grid__row-header {
    z-index: 1;
}

.office-sheet-grid__cell-input {
    z-index: 30;
}

/* Дашборд с презентационными слайдами */

/* Файл dashboard_navigation.css */

.office-dashboard-workspace {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px;
    overflow: hidden;
}

.office-dashboard-stage {
    min-height: 0;
    flex: 1 1 auto;
    padding: 14px;
}

.office-dashboard-slide {
    background: #fff;
    transition: background-color 0.18s ease;
}

.office-dashboard-slide--presentation {
    box-shadow: 0 14px 40px rgba(34, 55, 91, 0.18);
}

.office-dashboard-slide--dashboard {
    background-image:
        linear-gradient(rgba(54, 91, 142, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(54, 91, 142, 0.035) 1px, transparent 1px);
    background-size: 20px 20px;
}

.office-dashboard-slide__mode {
    position: absolute;
    right: 12px;
    bottom: 10px;
    z-index: 2;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(30, 50, 82, 0.08);
    color: #64728a;
    font-size: 10px;
    pointer-events: none;
}

.office-dashboard-object {
    color: #243b60;
}

.office-dashboard-object--text {
    border-color: transparent;
    box-shadow: none;
}

.office-dashboard-object--shape {
    align-items: stretch;
    justify-content: stretch;
}

.office-dashboard-text-object,
.office-dashboard-shape-object {
    display: flex;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    align-items: center;
    padding: 14px 18px;
    white-space: pre-wrap;
    word-break: break-word;
}

.office-dashboard-text-object {
    align-items: flex-start;
}

.office-dashboard-shape-object {
    justify-content: center;
}

.office-dashboard-navigator {
    display: flex;
    min-height: 72px;
    flex: 0 0 72px;
    align-items: center;
    gap: 6px;
    padding: 6px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
}

.office-dashboard-navigator > button {
    width: 34px;
    min-width: 34px;
    height: 34px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    cursor: pointer;
}

.office-dashboard-navigator > button:disabled {
    cursor: default;
    opacity: 0.4;
}

.office-dashboard-navigator__slides {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: stretch;
    gap: 6px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}

.office-dashboard-thumbnail {
    display: grid;
    min-width: 150px;
    max-width: 190px;
    grid-template-columns: 24px minmax(0, 1fr);
    grid-template-rows: 1fr auto;
    gap: 2px 7px;
    padding: 7px 9px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-2);
    color: var(--text-1);
    text-align: left;
    cursor: pointer;
}

.office-dashboard-thumbnail > span {
    grid-row: 1 / span 2;
    align-self: center;
    color: var(--text-3);
    font-size: 11px;
    font-weight: 700;
}

.office-dashboard-thumbnail strong,
.office-dashboard-thumbnail small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.office-dashboard-thumbnail strong {
    font-size: 11px;
}

.office-dashboard-thumbnail small {
    color: var(--text-3);
    font-size: 9px;
}

.office-dashboard-thumbnail--active {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 9%, var(--bg-1));
    box-shadow: 0 0 0 1px var(--accent) inset;
}

.office-color-field {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-3);
    font-size: 10px;
    font-weight: 700;
}

.office-color-field input[type='color'] {
    width: 34px;
    height: 28px;
    padding: 2px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    cursor: pointer;
}

.office-color-field input[type='color']:disabled {
    cursor: default;
    opacity: 0.45;
}

/* Панель подсказок формул. */

/* Файл formula_and_dashboard_ribbon.css */

.office-formula-bar {
    position: relative;
    overflow: visible;
    z-index: 60;
}

.office-formula-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 90;
    display: flex;
    width: min(520px, calc(100vw - 40px));
    max-height: 300px;
    flex-direction: column;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    box-shadow: 0 12px 30px rgba(28, 50, 82, 0.18);
}

.office-formula-suggestions--bar {
    left: 126px;
}

.office-formula-suggestions--cell {
    top: calc(100% + 2px);
    left: 0;
    min-width: 420px;
}

.office-formula-suggestion {
    display: grid;
    gap: 2px;
    padding: 7px 10px;
    border: 0;
    border-bottom: 1px solid var(--border);
    border-radius: 0;
    background: var(--bg-1);
    color: var(--text-1);
    text-align: left;
    cursor: pointer;
}

.office-formula-suggestion:last-child {
    border-bottom: 0;
}

.office-formula-suggestion:hover,
.office-formula-suggestion--active {
    background: var(--bg-2);
}

.office-formula-suggestion strong {
    color: var(--accent);
    font-size: 11px;
}

.office-formula-suggestion span {
    color: var(--text-2);
    font-size: 10px;
}

.office-formula-suggestion small {
    color: var(--text-3);
    font-size: 9px;
}

.office-formula-suggestion__parameter {
    font-style: normal;
}

.office-formula-suggestion__parameter--active {
    color: var(--accent);
    font-weight: 700;
    text-decoration: underline;
}

.office-sheet-grid__cell-input {
    overflow: visible;
}

/* Адаптивная лента и вертикальная панель слайдов. */
.office-ribbon--dashboard {
    height: 132px;
    min-height: 132px;
    max-height: 132px;
    flex: 0 0 132px;
}

.office-ribbon--dashboard .office-ribbon__content--dashboard {
    display: flex;
    height: 94px;
    min-height: 94px;
    max-height: 94px;
    flex-wrap: nowrap;
    align-items: stretch;
    align-content: stretch;
    overflow-x: auto;
    overflow-y: hidden;
}

/* Файл dashboard_slide_pane.css */

.office-ribbon--dashboard .office-ribbon__group {
    min-height: 0;
}

.office-dashboard-workspace {
    flex-direction: row;
    gap: 8px;
}

.office-dashboard-slide-pane {
    display: flex;
    width: 214px;
    min-width: 180px;
    flex: 0 0 214px;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg-1);
}

.office-dashboard-slide-pane__header {
    display: flex;
    min-height: 38px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 8px;
    border-bottom: 1px solid var(--border);
}

.office-dashboard-slide-pane__header strong {
    color: var(--text-1);
    font-size: 11px;
}

.office-dashboard-slide-pane__header button {
    width: 28px;
    height: 26px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--text-1);
    cursor: pointer;
}

.office-dashboard-slide-pane__list {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px;
    padding: 8px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
}

.office-dashboard-slide-pane .office-dashboard-thumbnail {
    display: grid;
    width: 100%;
    min-width: 0;
    max-width: none;
    grid-template-columns: 20px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 3px 6px;
    padding: 6px;
}

.office-dashboard-slide-pane .office-dashboard-thumbnail__number {
    grid-row: 1 / span 2;
    align-self: start;
    padding-top: 2px;
}

.office-dashboard-thumbnail__preview {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1000 / 562;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 4px;
    background-image:
        linear-gradient(rgba(54, 91, 142, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(54, 91, 142, 0.025) 1px, transparent 1px);
    background-size: 8px 8px;
}

.office-dashboard-thumbnail__preview i {
    position: absolute;
    display: block;
    box-sizing: border-box;
    min-width: 2px;
    min-height: 2px;
    border: 1px solid;
    opacity: 0.85;
}

.office-dashboard-slide-pane .office-dashboard-thumbnail strong {
    grid-column: 2;
}

.office-dashboard-main {
    display: flex;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.office-dashboard-main .office-dashboard-stage {
    width: 100%;
}

.office-dashboard-object--read-only {
    pointer-events: none;
}

/* Полноэкранный показ слайдов. */
.office-slide-show {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #111722;
}

.office-slide-show__canvas {
    position: relative;
    flex: 0 0 auto;
}

.office-slide-show__slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 1000px;
    height: 562px;
    transform-origin: top left;
}

.office-slide-show__close {
    position: absolute;
    top: 16px;
    right: 18px;
    z-index: 3;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.35);
    color: #fff;
    cursor: pointer;
}

.office-slide-show__controls {
    position: absolute;
    bottom: 16px;
    left: 50%;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 12px;
    transform: translateX(-50%);
    color: #fff;
}

.office-slide-show__controls button {
    width: 38px;
    height: 32px;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.35);
    color: #fff;
    cursor: pointer;
}

.office-slide-show__controls button:disabled {
    cursor: default;
    opacity: 0.35;
}

/* Файл dashboard_slide_responsive.css */

@media (max-width: 900px) {
    .office-dashboard-slide-pane {
        width: 174px;
        min-width: 150px;
        flex-basis: 174px;
    }

    .office-formula-suggestions--cell {
        min-width: 300px;
    }
}

/* Файл sheet_tools.css */

.office-dashboard-slide-pane .office-dashboard-thumbnail__preview {
    grid-column: 2;
    grid-row: 1;
    align-self: stretch;
    color: inherit;
}

/* Расширенные инструменты Sheets. */
.office-sheet-tool-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.office-sheet-tool-form > label,
.office-sheet-tool-form__row > label {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    gap: 6px;
    color: var(--text-2);
    font-weight: 600;
}

.office-sheet-tool-form input,
.office-sheet-tool-form select,
.office-sheet-tool-form textarea {
    width: 100%;
    min-height: 38px;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-1);
    color: var(--text-1);
    padding: 8px 10px;
}

.office-sheet-tool-form textarea {
    min-height: 90px;
    resize: vertical;
}

.office-sheet-tool-form__row {
    display: flex;
    gap: 12px;
}

.office-sheet-tool-form__reference {
    padding: 10px 12px;
    border-radius: 8px;
    background: var(--bg-2);
    color: var(--text-2);
}

.office-sheet-tool-form__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.office-card--sheet-chart {
    min-height: 280px;
}

.office-sheet-chart {
    display: flex;
    height: 220px;
    align-items: flex-end;
    gap: 8px;
    padding: 12px;
    overflow-x: auto;
}

.office-sheet-chart__point {
    display: grid;
    min-width: 54px;
    height: 100%;
    grid-template-rows: 1fr auto auto;
    align-items: end;
    gap: 3px;
    color: var(--text-2);
    text-align: center;
}

.office-sheet-chart__bar {
    width: 70%;
    min-height: 3px;
    justify-self: center;
    border-radius: 5px 5px 0 0;
    background: var(--accent);
}

.office-sheet-chart--line .office-sheet-chart__bar {
    width: 10px;
    border-radius: 50% 50% 0 0;
}

.office-sheet-chart__point span,
.office-sheet-chart__point small {
    max-width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Расширенные визуалы Power BI и функции презентаций. */
.office-dashboard-main {
    flex-direction: column;
    gap: 8px;
}

.office-dashboard-main .office-dashboard-stage {
    flex: 1 1 auto;
}

/* Файл dashboard_objects_core.css */

.office-dashboard-slide--grid {
    background-image:
        linear-gradient(rgba(54, 91, 142, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(54, 91, 142, 0.055) 1px, transparent 1px);
    background-size: 20px 20px;
}

.office-dashboard-kpi {
    display: flex;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 18px;
    text-align: center;
}

.office-dashboard-kpi span {
    color: inherit;
    font-weight: 700;
}

.office-dashboard-kpi strong {
    color: var(--accent);
    font-size: 34px;
    line-height: 1;
}

.office-dashboard-kpi small {
    color: var(--text-3);
}

.office-dashboard-table-object,
.office-dashboard-slicer {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    flex-direction: column;
    padding: 10px;
}

.office-dashboard-table-object__scroll {
    min-height: 0;
    flex: 1 1 auto;
    overflow: auto;
}

.office-dashboard-table-object table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
}

.office-dashboard-table-object th,
.office-dashboard-table-object td {
    padding: 5px 7px;
    border: 1px solid var(--border);
    text-align: left;
    white-space: nowrap;
}

.office-dashboard-table-object th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--bg-2);
}

.office-dashboard-slicer {
    align-content: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 6px;
    overflow: auto;
}

.office-dashboard-slicer .office-dashboard-object__title {
    width: 100%;
}

.office-dashboard-slicer > button {
    padding: 6px 9px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--bg-1);
    color: var(--text-2);
    cursor: pointer;
}

.office-dashboard-slicer > button.active {
    border-color: var(--accent);
    background: color-mix(in srgb, var(--accent) 12%, var(--bg-1));
    color: var(--accent);
}

.office-dashboard-bar-row,
.office-dashboard-legend button {
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
}

/* Файл dashboard_objects_extra.css */


.office-dashboard-bar-row {
    width: 100%;
}

.office-dashboard-legend button {
    display: grid;
    width: 100%;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    text-align: left;
}

.office-dashboard-line-point {
    cursor: pointer;
}

.office-dashboard-drill-controls {
    display: inline-flex;
    gap: 3px;
    margin-left: auto;
}

.office-dashboard-drill-controls button {
    width: 24px;
    height: 22px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 5px;
    background: var(--bg-1);
    cursor: pointer;
}

.office-dashboard-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-2);
    font-size: 10px;
}

.office-dashboard-notes {
    display: flex;
    min-height: 92px;
    flex: 0 0 92px;
    flex-direction: column;
    gap: 4px;
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg-1);
    color: var(--text-2);
    font-size: 10px;
    font-weight: 700;
}

.office-dashboard-notes textarea {
    min-height: 54px;
    flex: 1 1 auto;
    resize: none;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--text-1);
    font: inherit;
    font-weight: 400;
}

.office-slide-show__notes {
    position: absolute;
    right: 18px;
    bottom: 62px;
    z-index: 4;
    max-width: min(440px, 44vw);
    max-height: 24vh;
    overflow: auto;
    padding: 10px 14px;
    border-radius: 9px;
    background: rgba(0, 0, 0, 0.68);
    color: #fff;
    white-space: pre-wrap;
}

.office-slide-show__slide--fade {
    animation-name: office-slide-fade;
    animation-timing-function: ease;
}

.office-slide-show__slide--slide {
    animation-name: office-slide-shift;
    animation-timing-function: ease-out;
}

.office-slide-show__slide--zoom {
    animation-name: office-slide-zoom;
    animation-timing-function: ease-out;
}

/* Файл dashboard_animations.css */

@keyframes office-slide-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes office-slide-shift {
    from { opacity: 0; translate: 10% 0; }
    to { opacity: 1; translate: 0 0; }
}

@keyframes office-slide-zoom {
    from { opacity: 0; scale: 0.94; }
    to { opacity: 1; scale: 1; }
}

@media (max-width: 900px) {
    .office-sheet-tool-form__row {
        flex-direction: column;
    }

    .office-dashboard-notes {
        min-height: 78px;
        flex-basis: 78px;
    }
}

/* Компактный режим вкладки «Файл» дашборда без пустой ленты. */
.office-workspace__panel--dashboard.office-workspace__panel--file-view
> .office-ribbon.office-ribbon--file-only {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    flex: 0 0 38px !important;
    overflow: hidden;
}

.office-workspace__panel--dashboard.office-workspace__panel--file-view
.office-ribbon__content {
    display: none;
}

.office-workspace__panel--dashboard.office-workspace__panel--file-view
> .office-file-panel {
    min-height: 0;
    flex: 1 1 auto;
    margin-top: 0;
}

.office-dashboard-source-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
}

.office-dashboard-source-actions button {
    width: 100%;
}


/* Дополнительные команды презентации: визуальное состояние блокировки. */

.office-dashboard-object--locked {
    outline: 2px dashed var(--border);
    cursor: not-allowed;
}

.office-dashboard-object--locked::after {
    position: absolute;
    z-index: 5;
    top: 4px;
    right: 6px;
    content: '🔒';
    font-size: var(--font_size__0);
    pointer-events: none;
}

/* Файл OfficeWorkspace.css */


/*# sourceMappingURL=main.a40b0096.css.map*/