/* Shared CRM styles. The final user-approved theme is dark navigation and blue
 * actions; the register/inspector and workshop layouts retain their workflows.
 * Published via php artisan filament:assets (no separate frontend build).
 */

:root {
    --sc-red: #e02128;
    --sc-ink: #2a2a2c;
    --sc-grey: #6b6b6b;
    --sc-line: #e8e8e8;
    --sc-soft: #f6f6f7;
    --sc-green: #188741;
    --sc-radius: 10px;
}

/* ─── Фирменная надпись ───────────────────────────────────────────────────────── */

.sc-brand {
    font-weight: 900;
    letter-spacing: -0.03em;
    font-size: 1.125rem;
    white-space: nowrap;
    color: var(--sc-ink);
}

.dark .sc-brand {
    color: #f4f4f5;
}

.sc-brand-dot {
    color: var(--sc-red);
}

/* Свёрнутое меню: остаётся «.com» — по нему систему узнают так же, как сайт. */
.fi-sidebar-nav-collapsed .sc-brand-word,
.fi-sidebar.fi-sidebar-collapsed .sc-brand-word {
    display: none;
}

/*
 * 🔴 ФИРМЕННЫЙ ЗНАК — КРАСНАЯ ТОЧКА, И ОНА РАБОТАЕТ, А НЕ УКРАШАЕТ. В названии компании
 * выделена не буква, а точка перед «com»; в интерфейсе тем же красным помечается пункт меню,
 * на котором сотрудник сейчас находится. Получается одна деталь, по которой систему узнают
 * с любого экрана, и она же отвечает на вопрос «где я» — а не просто «фирменный акцент».
 *
 * Точка стоит СЛЕВА от значка, у самого края: в свёрнутом меню подписи нет, и подсветка
 * фоном на узкой колонке читается хуже метки на краю.
 */
.fi-sidebar-item-active > .fi-sidebar-item-button {
    position: relative;
}

.fi-sidebar-item-active > .fi-sidebar-item-button::before {
    content: '';
    position: absolute;
    inset-inline-start: -0.5rem;
    top: 50%;
    width: 6px;
    height: 6px;
    margin-top: -3px;
    border-radius: 9999px;
    background: var(--sc-red);
}

/*
 * Заголовки экранов набираются плотнее обычного — тем же приёмом, что и сама надпись
 * «Сервис.com» (`letter-spacing: -.03em` в стилях сайта). Одна строка кода, а страница
 * перестаёт выглядеть чужой панелью: заголовок и логотип написаны одной рукой.
 */
.fi-header-heading,
.fi-modal-heading {
    letter-spacing: -0.02em;
    font-weight: 800;
}

/* ─── Поверхности ─────────────────────────────────────────────────────────────── */

/*
 * Компактное скругление выбранного рабочего стиля: одинаковое у таблиц, секций и диалогов.
 */
.fi-section,
.fi-wi-stats-overview-stat,
.fi-ta-ctn,
.fi-modal-window {
    border-radius: var(--sc-radius);
}

/* Фон страницы — «мягкий» серый сайта вместо белого: на нём карточки читаются как карточки. */
.fi-main-ctn {
    background-color: var(--sc-soft);
}

.dark .fi-main-ctn {
    background-color: rgb(24 24 27);
}

.fi-section,
.fi-ta-ctn {
    border-color: var(--sc-line);
}

.dark .fi-section,
.dark .fi-ta-ctn {
    border-color: rgb(255 255 255 / 0.1);
}

/* ─── Плотность таблиц ────────────────────────────────────────────────────────── */

/*
 * 🔴 НА ЭКРАНЕ 13 ДЮЙМОВ ПОМЕЩАЛОСЬ ВОСЕМЬ СТРОК ЗАКАЗОВ. Список заказов — главный экран
 * приёмщика, и больше трети высоты строки занимали отступы: строка 73 px при содержимом 24 px.
 *
 * 🔴 ОТСТУП ЖИВЁТ НЕ ТАМ, ГДЕ КАЖЕТСЯ. У самой ячейки `p-0`, у обёртки колонки — ноль,
 * а шестнадцать пикселей сверху и снизу задаёт `.fi-ta-text` глубоко внутри. Первая редакция
 * правила обёртку и ячейку: строка стала 73 px вместо 77 — то есть правка «была», а экран
 * остался прежним. Проверено в браузере на копии боевой базы, а не рассуждением.
 *
 * 🔴 ДЕСЯТЬ ПИКСЕЛЕЙ, А НЕ НОЛЬ. Нулевой отступ сжимает строку до размера текста, и попасть
 * в неё пальцем на планшете нельзя. Замерено в браузере: строка 73 px → 53 px, на экране
 * 1498×812 помещается 10 строк вместо 8. Пятьдесят три пикселя выше минимума для касания
 * (44 px у Apple и Google), то есть плотнее — уже нельзя.
 */
.fi-ta-cell > .fi-ta-col-wrp {
    padding-top: 0;
    padding-bottom: 0;
}

.fi-ta-cell .fi-ta-text,
.fi-ta-header-cell > * {
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
}

/* Номер заказа — моноширинным: «AU-0001» читается и диктуется по одному знаку. */
.fi-ta-record .fi-ta-text-item-label:first-letter {
    font-feature-settings: 'tnum';
}

/* ─── Вход ────────────────────────────────────────────────────────────────────── */

/*
 * Экран входа — первое, что видит сотрудник каждое утро. Он остаётся простым, но перестаёт
 * быть безымянным: фирменная надпись крупно, фон — тот же мягкий серый.
 */
.fi-simple-layout {
    background-color: var(--sc-soft);
}

.dark .fi-simple-layout {
    background-color: rgb(24 24 27);
}

.fi-simple-main {
    border-radius: var(--sc-radius);
    border: 1px solid var(--sc-line);
}

.dark .fi-simple-main {
    border-color: rgb(255 255 255 / 0.1);
}

.fi-simple-header .sc-brand {
    font-size: 1.75rem;
}

/*
 * Логотип на экране входа стоит по центру. Его ВЫСОТА задана не здесь, а `brandLogoHeight`
 * в `AdminPanelProvider`: Filament пишет её инлайном, и правило темы её не перебивает.
 */
.fi-simple-header .fi-logo {
    justify-content: center;
}

/*
 * 🔴 КОЛОНКА ДЕЙСТВИЙ ПРИЖАТА К ПРАВОМУ КРАЮ.
 *
 * Замер на копии боевой базы 09.09.2026: в списке заказов содержимое таблицы 1622 px,
 * видно 1056 — колонка действий начиналась НА 632 px ЗА КРАЕМ ноутбука 1440×900
 * и на 552 px за краем планшета 1024×768. То есть «Принять оплату» прямо из списка,
 * ради которой оплату туда и вынесли, была недостижима, пока не пролистаешь вбок.
 * Ни один тест этого не видел: разметка есть, кнопка отрисована, действие работает.
 *
 * Так сделано у RemOnline и RO App, и по той же причине: в списке из десяти колонок
 * действие обязано оставаться на экране, иначе им не пользуются.
 *
 * Фон непрозрачный намеренно: у строки Filament фон прозрачный, и без заливки под
 * прижатой колонкой поехали бы уплывающие вбок ячейки.
 */
.fi-ta-actions-cell,
.fi-ta-actions-header-cell {
    position: sticky;
    right: 0;
    z-index: 1;
    background-color: rgb(255 255 255);
    box-shadow: -8px 0 8px -8px rgb(0 0 0 / 0.15);
}

.fi-ta-header-cell.fi-ta-actions-header-cell,
.fi-ta-actions-header-cell {
    background-color: rgb(249 250 251);
}

.fi-ta-row:hover .fi-ta-actions-cell {
    background-color: rgb(249 250 251);
}

.dark .fi-ta-actions-cell {
    background-color: rgb(24 24 27);
}

.dark .fi-ta-actions-header-cell {
    background-color: rgb(39 39 42);
}

.dark .fi-ta-row:hover .fi-ta-actions-cell {
    background-color: rgb(39 39 42);
}

/* Header actions and work context must fit a receptionist's laptop and phone. */
.fi-resource-orders .fi-header { flex-wrap: wrap; gap: 1rem; }
.fi-resource-orders .fi-header > div:last-child { min-width: 0; max-width: 100%; }
.fi-resource-orders .fi-header .fi-ac { flex-wrap: wrap; }
.fi-resource-orders .fi-tabs { flex-wrap: wrap; overflow: visible; }
.sc-order-summary { border-bottom: 1px solid #d4d4d8; padding-bottom: 1rem; display: grid; gap: .75rem; }
/* Сводка заказа крупнее (владелец 09.11.2026: «мелко или тесно»): на стойке её читают с расстояния. */
.sc-order-context { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem 1rem; font-size: 1rem; }
.sc-order-context strong { font-size: 1.25rem; }
.sc-order-context span { overflow-wrap: anywhere; }
.sc-order-money { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0; }
.sc-order-money dt { font-size: .875rem; color: #52525b; }
.sc-order-money dd { margin: .25rem 0 0; font-size: 1.5rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.sc-order-items { margin-top: .25rem; }
/* Две вкладки заказа, как в LiveSklad: «Работы и материалы» | «Информация о заказе». */
.sc-order-switch { display: inline-flex; border: 1px solid #d4d4d8; border-radius: .5rem; overflow: hidden; margin-bottom: 1rem; }
.sc-order-switch button { min-height: 44px; padding: .5rem 1.25rem; font-size: 1rem; font-weight: 500; color: #3f3f46; background: #fff; }
.sc-order-switch button + button { border-left: 1px solid #d4d4d8; }
.sc-order-switch button.is-active { background: #eef2ff; color: #1d4ed8; font-weight: 600; }
.dark .sc-order-switch { border-color: #3f3f46; }
.dark .sc-order-switch button { background: transparent; color: #d4d4d8; }
.dark .sc-order-switch button + button { border-color: #3f3f46; }
.dark .sc-order-switch button.is-active { background: #1e293b; color: #93c5fd; }
.sc-issue-notice { background: #fff4df; color: #78350f; padding: .75rem; border-radius: .5rem; font-size: .875rem; }
.sc-timer-status { font-size: .875rem; }
.sc-pulse-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.sc-pulse-link { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: 3px; font-size: .875rem; }
.sc-table-scroll { overflow-x: auto; max-width: 100%; }
/* On the warehouse report, 620px tables must scroll inside a 390px phone viewport. */
.sc-stock-report .sc-table-scroll { contain: paint; }
/* Широкая таблица прокручивается, а не сжимает цифры в столбик. Только от 4 колонок: двухколоночный
   баланс (статья | сумма) в половине экрана получал min-width 620 при обёртке 514 px — суммы уезжали
   за край, и баланс показывал одни названия статей (обход в браузере 06.10.2026). */
.sc-table-scroll table:has(tr > :nth-child(4)) { min-width: 620px; }
.sc-board-advance { min-height: 44px; padding: .5rem .75rem; }
.dark .sc-order-money dt { color: #a1a1aa; }
.dark .sc-order-summary { border-color: #3f3f46; }
.dark .sc-issue-notice { background: #422006; color: #fde68a; }
@media (max-width: 1023px) { .sc-pulse-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639px) {
    .sc-pulse-grid { grid-template-columns: minmax(0, 1fr); }
    .sc-order-money { gap: .5rem; }
    .sc-order-money dd { font-size: .875rem; overflow-wrap: anywhere; }
    .fi-resource-orders .fi-header .fi-ac { gap: .5rem; }
    .fi-resource-orders .fi-header .fi-ac .fi-btn { min-height: 44px; }
}

.sc-order-section-select, .sc-order-mobile-detail { display: none; }
@media (max-width: 639px) {
    .sc-order-mobile-detail { display: block; width: 155px; white-space: normal; overflow-wrap: anywhere; line-height: 1.45; }
    .sc-order-mobile-detail strong { font-weight: 500; }
    .sc-order-section-select { display: grid; gap: .5rem; font-size: .875rem; }
    .sc-order-section-select select { width: 100%; min-height: 44px; border: 1px solid #d4d4d8; border-radius: .5rem; background-color: white; color: #18181b; font-size: 16px; }
    .dark .sc-order-section-select select { background-color: #18181b; color: #fafafa; border-color: #52525b; }
    .fi-resource-orders .fi-resource-relation-managers > .fi-tabs { display: none; }
    .fi-resource-orders .fi-header > div:last-child { width: 100%; max-width: 100%; }
    .fi-resource-orders .fi-header .fi-ac { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
    .fi-resource-orders .fi-header .fi-ac .fi-btn { width: 100%; min-height: 44px; }
    .fi-resource-orders .fi-header .fi-ac .fi-btn-label { white-space: normal; }
    .fi-modal-slide-over .fi-btn { min-height: 44px; }
}

/* Unified workspace, approved concept 01. Shared across all Filament resources. */
:root {
    --sc-surface: #fff;
    --sc-muted: #52525b;
    --sc-hover: #f0f1f3;
    --sc-focus: #48484e;
}
.dark {
    --sc-surface: #18181b;
    --sc-line: #3f3f46;
    --sc-muted: #b4b4bd;
    --sc-hover: #27272a;
    --sc-focus: #d4d4d8;
}
.fi-body { font-size: 0.875rem; }
.fi-sidebar-header, .fi-topbar > nav { box-shadow: none; border-bottom: 1px solid var(--sc-line); }
.fi-sidebar { border-right: 1px solid var(--sc-line); }
.fi-sidebar-item-button { min-height: 44px; border-radius: 8px; }
.fi-sidebar-item-active > .fi-sidebar-item-button { background: var(--sc-hover); }
.fi-main { padding-top: 1.5rem; padding-bottom: 2rem; }
.fi-header-heading { font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.2; }
.fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat {
    background: var(--sc-surface);
    box-shadow: 0 0 0 1px var(--sc-line);
}
.fi-section-header { border-bottom: 1px solid var(--sc-line); }
.fi-section-header-heading { font-weight: 600; }
.fi-btn { border-radius: 8px; min-height: 40px; font-weight: 600; }
.fi-input-wrp { border-radius: 8px; }
.fi-input { min-height: 40px; }
.fi-ta-header-cell { background: var(--sc-hover); }
.fi-ta-header-cell-label { font-size: .75rem; font-weight: 600; color: var(--sc-muted); }
.fi-ta-text-item-label, .fi-wi-stats-overview-stat-value { font-variant-numeric: tabular-nums; }
.fi-ta-row:hover { background: var(--sc-hover); }
.fi-tabs { box-shadow: none; border-bottom: 1px solid var(--sc-line); border-radius: 0; background: transparent; }
.fi-tabs-item { min-height: 44px; border-radius: 6px 6px 0 0; }
.fi-tabs-item-active { background: var(--sc-surface); box-shadow: inset 0 -2px currentColor; }
.fi-body :is(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--sc-focus); outline-offset: 3px; }
.fi-body ::selection { background: #dce5ee; color: #18181b; }
.fi-body :is(input, textarea) { caret-color: var(--sc-focus); }
.sc-workspace-nav { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.sc-workspace-nav a { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .5rem .875rem; border: 1px solid var(--sc-line); border-radius: 8px; background: var(--sc-surface); font-weight: 600; }
.sc-workspace-nav svg { width: 18px; height: 18px; }
.sc-board { padding-bottom: 1rem; scrollbar-color: #a1a1aa transparent; }
.sc-board-column { background: var(--sc-hover); border-radius: var(--sc-radius); border: 1px solid var(--sc-line); padding: .875rem; }
.sc-board-card { background: var(--sc-surface); border: 1px solid var(--sc-line); border-radius: 8px; padding: 1rem; margin-bottom: .75rem; }
.sc-board-advance { background: var(--sc-surface); color: inherit; font-weight: 600; }
.sc-board-advance:hover { background: var(--sc-hover); }
.sc-board-card-title { font-size: 1rem; font-weight: 600; line-height: 1.5; }
.sc-preview { display: grid; gap: 1.5rem; }
.sc-preview h3 { font-size: 1.125rem; font-weight: 600; }
.sc-preview-section { border-bottom: 1px solid var(--sc-line); padding-bottom: 1.25rem; }
.sc-preview dl { display: grid; gap: .75rem; }
.sc-preview dl > div { display: flex; justify-content: space-between; gap: 1rem; }
.sc-preview dt { color: var(--sc-muted); }
.sc-preview dd { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.sc-preview p { overflow-wrap: anywhere; line-height: 1.6; }
.sc-preview-action { display: flex; justify-content: center; align-items: center; min-height: 44px; background: var(--sc-ink); color: #fff; border-radius: 8px; padding: .75rem; font-weight: 600; }
.dark .sc-preview-action { background: #e4e4e7; color: #18181b; }
.sc-network-tile { background: var(--sc-surface); border-radius: var(--sc-radius); }
@media (max-width: 639px) {
    .fi-main { padding-top: 1rem; }
    .fi-btn, .fi-input { min-height: 44px; }
    .fi-input { font-size: 16px; }
    .sc-workspace-nav a { flex: 1; justify-content: center; }
    .sc-preview dl > div { flex-wrap: wrap; }
    .sc-preview dd { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
    .fi-body *, .fi-body *::before, .fi-body *::after { scroll-behavior: auto; }
}

/* Filter disclosure keeps the master's tasks in the first phone viewport. */
.sc-board-filters { border: 1px solid var(--sc-line); border-radius: 8px; background: var(--sc-surface); }
.sc-board-filters summary { cursor: pointer; min-height: 44px; padding: .75rem 1rem; font-weight: 600; }
.sc-board-filter-fields { padding: .5rem 1rem 1rem; }
.sc-board-hint { color: var(--sc-muted); font-size: .8125rem; line-height: 1.5; }
.sc-board { grid-template-columns: repeat(var(--sc-board-columns), minmax(220px, 1fr)); overflow-x: auto; }
/* Phone board: stage tabs and a single column instead of horizontal scrolling (plan 300, U16). */
.sc-board-tabs { display: none; }
@media (max-width: 639px) {
    .sc-board-tabs { display: flex; gap: .25rem; overflow-x: auto; margin-top: .75rem; }
    .sc-board-tab { flex-shrink: 0; min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--sc-line); border-radius: 999px; background: var(--sc-surface); font-size: .875rem; }
    .sc-board-tab[aria-selected="true"] { border-color: var(--sc-focus); font-weight: 600; }
    .sc-board-tab span { color: var(--sc-muted); font-variant-numeric: tabular-nums; }
    .sc-board-hint-wide { display: none; }
    .sc-board { grid-template-columns: minmax(0, 1fr); overflow-x: visible; }
    .sc-board-column:not([data-active="true"]) { display: none; }
}
.fi-body summary:focus-visible { outline: 2px solid var(--sc-focus); outline-offset: 3px; }
.fi-body .fi-tabs { justify-content: flex-start; border-radius: 0; box-shadow: none; background: transparent; width: 100%; }
.fi-body .fi-tabs-item { border-radius: 6px 6px 0 0; }
@media (min-width: 1280px) { .sc-board { grid-template-columns: repeat(var(--sc-board-columns), minmax(0, 1fr)); } }
@media (max-width: 639px) {
    .fi-body .fi-ta-actions { display: grid; grid-template-columns: repeat(2, 44px); gap: 0; }
    /* 🔴 СЕТКА 2×44 — ДЛЯ ИКОНОК. Текстовые действия («Провести выплату», «Изменить», «Удалить»)
       сжимались в 44 px и наползали на сумму и друг на друга: на телефоне не прочитать деньги и легко
       нажать не то (обход всех экранов в браузере 06.10.2026: зарплаты, смены, бюджет, рассылки,
       поступления — 20+ списков). Текстовые идут столбиком своей ширины, высота касания — 44 px. */
    .fi-body .fi-ta-actions:has(> .fi-link) { grid-template-columns: max-content; justify-items: end; row-gap: 0; }
    .fi-body .fi-ta-actions > .fi-link { min-height: 44px; }
    .fi-body .fi-ta-actions .fi-icon-btn { min-width: 44px; min-height: 44px; }
    .sc-board { margin-top: 0; }
}

.sc-workspace-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.sc-workspace-stat { display: grid; gap: .5rem; text-align: left; padding: 1rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius); background: var(--sc-surface); }
.sc-workspace-stat span { color: var(--sc-muted); font-size: .875rem; }
.sc-workspace-stat strong { font-size: 1.75rem; line-height: 1.2; font-variant-numeric: tabular-nums; }
.sc-workspace-stat:hover { background: var(--sc-hover); }
.sc-order-date { display: block; white-space: nowrap; font-size: .75rem; color: var(--sc-muted); }
@media (max-width: 639px) {
    .sc-workspace-summary { gap: .5rem; }
    .sc-workspace-stat { padding: .75rem .5rem; }
    .sc-workspace-stat span { font-size: .75rem; }
    .sc-workspace-stat strong { font-size: 1.5rem; }
    .fi-body .fi-resource-orders .fi-tabs { flex-wrap: nowrap; overflow-x: auto; }
    .fi-body .fi-resource-orders .fi-tabs-item { flex-shrink: 0; }
}

/* Operational register and persistent inspector retained in the combined design. */
:root { --sc-text: #141820; --sc-secondary: #596273; --sc-divider: #e3e6eb; --sc-selected: #edf4ff; }
.dark { --sc-text: #f4f4f5; --sc-secondary: #b4bdca; --sc-divider: #3f4652; --sc-selected: #223249; }
.fi-body .fi-sidebar { border-right: 1px solid var(--sc-divider); }
.fi-body .fi-sidebar-header { padding-inline: 22px; box-shadow: none; }
.fi-body .sc-brand { font-size: 28px; font-weight: 700; line-height: 1; letter-spacing: -.04em; }
.fi-body .sc-brand-domain { color: var(--sc-ink); }
.dark .fi-body .sc-brand-domain { color: #f4f4f5; }
.fi-body .fi-sidebar-nav { padding: 24px 12px; gap: 16px; }
.fi-sidebar-nav:has(#sc-full-menu:not(:checked)) > ul { display: none; }
.sc-primary-nav { display: grid; gap: 10px; }
.sc-primary-nav a { position: relative; display: flex; align-items: center; gap: 18px; min-height: 54px; padding: 12px 14px; color: var(--sc-secondary); border-radius: 7px; font-size: 16px; font-weight: 500; }
.sc-primary-nav svg { width: 23px; height: 23px; flex-shrink: 0; }
.sc-primary-nav a:hover { background: var(--sc-hover); color: var(--sc-text); }
.sc-primary-nav .sc-nav-active { background: #edeef0; color: #10151d; font-weight: 700; }
.sc-primary-nav .sc-nav-active::before { content: ''; position: absolute; left: 0; top: 12px; bottom: 12px; width: 2px; background: currentColor; }
.dark .sc-primary-nav .sc-nav-active { background: #303743; color: #fff; }
.sc-menu-disclosure { position: relative; display: flex; align-items: center; gap: 14px; padding: 14px; margin-top: 24px; min-height: 48px; color: var(--sc-secondary); cursor: pointer; font-size: 14px; }
.sc-menu-disclosure input { position: absolute; opacity: 0; width: 100%; height: 100%; inset: 0; cursor: pointer; }
.sc-menu-disclosure:has(input:focus-visible) { outline: 2px solid var(--sc-focus); outline-offset: 2px; }
.sc-menu-disclosure svg { width: 20px; height: 20px; }
.sc-menu-chevron { margin-left: auto; }
.sc-menu-disclosure:has(input:checked) .sc-menu-chevron { transform: rotate(180deg); }
.fi-sidebar:not(.fi-sidebar-open) .sc-primary-nav span, .fi-sidebar:not(.fi-sidebar-open) .sc-menu-disclosure span { display: none; }
.fi-sidebar:not(.fi-sidebar-open) .sc-primary-nav a { justify-content: center; padding-inline: 0; }
.fi-sidebar:not(.fi-sidebar-open) .sc-brand-word, .fi-sidebar:not(.fi-sidebar-open) .sc-brand-domain { display: none; }
.fi-body .fi-topbar > nav { min-height: 68px; border-bottom: 1px solid var(--sc-divider); }
.fi-body .fi-global-search-field .fi-input-wrp { box-shadow: none; border: 1px solid var(--sc-divider); background: #f8f9fa; }
.fi-body .fi-global-search-field input { min-height: 40px; }
/* Тёмная тема (обход 09.10.2026): светлое поле #f8f9fa горело в шапке единственным белым пятном. */
.dark .fi-body .fi-global-search-field .fi-input-wrp { background: rgb(255 255 255 / 5%); border-color: rgb(255 255 255 / 12%); }
.fi-main:has(.sc-orders-workspace) { padding: 0 8px 24px 20px; max-width: none; }
.sc-orders-workspace > section { padding: 0; gap: 0; }
.sc-desk-layout { display: grid; grid-template-columns: minmax(0, 1fr) clamp(340px, 27vw, 410px); gap: 18px; align-items: start; color: var(--sc-text); }
.sc-desk-layout.sc-desk-wide, .sc-desk-layout:not(:has(.sc-order-inspector)) { grid-template-columns: minmax(0, 1fr); }
.sc-desk-main { min-width: 0; padding-top: 20px; }
.sc-desk-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px; }
.sc-desk-heading h1 { font-size: 36px; font-weight: 700; letter-spacing: -.03em; line-height: 1.2; }
.sc-desk-primary-actions .fi-btn { min-height: 44px; padding-inline: 20px; border-radius: 7px; font-size: 15px; }
.sc-desk-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.sc-desk-stat { display: grid; position: relative; gap: 2px; min-height: 90px; text-align: left; padding: 14px 20px; border: 1px solid var(--sc-divider); border-radius: 7px; background: var(--sc-surface); }
.sc-desk-stat span { color: var(--sc-secondary); font-size: 15px; }
.sc-desk-stat strong { font-size: 30px; line-height: 1.25; font-weight: 700; font-variant-numeric: tabular-nums; }
.sc-desk-stat svg { width: 25px; height: 25px; position: absolute; right: 18px; top: 32px; color: var(--sc-secondary); }
.sc-desk-stat-done strong, .sc-desk-stat-done svg { color: #188741; }
.sc-desk-stat:hover { background: var(--sc-hover); }
.sc-desk-toolbar { display: flex; align-items: center; justify-content: space-between; min-height: 48px; border-bottom: 1px solid var(--sc-divider); gap: 4px; }
.sc-desk-tabs { display: flex; min-width: 0; overflow-x: auto; }
.sc-desk-tabs button { flex-shrink: 0; padding: 12px 15px; min-height: 48px; font-size: 14px; color: var(--sc-secondary); border-bottom: 2px solid transparent; }
.sc-desk-tabs button[aria-pressed=true] { color: var(--sc-text); border-color: var(--sc-text); font-weight: 600; background: var(--sc-surface); }
.sc-desk-tools { display: flex; flex-shrink: 0; }
.sc-icon-control { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 40px; color: var(--sc-secondary); border-radius: 5px; }
.sc-icon-control:hover { color: var(--sc-text); background: var(--sc-hover); }
.sc-icon-control svg { width: 19px; height: 19px; }
.sc-desk-search { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: var(--sc-surface); border-bottom: 1px solid var(--sc-divider); }
.sc-desk-search svg { width: 20px; height: 20px; color: var(--sc-secondary); }
.sc-desk-search input { width: 100%; border: 0; background: transparent; font-size: 14px; min-height: 36px; color: inherit; }
.sc-desk-filter-note { padding: 10px 14px; display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; font-size: 13px; background: var(--sc-selected); overflow-wrap: anywhere; }
.sc-desk-filter-note button { text-decoration: underline; }
.sc-workspace-presets { padding: 10px 14px; border-bottom: 1px solid var(--sc-divider); font-size: 13px; }
.sc-workspace-presets summary { cursor: pointer; }
.sc-workspace-presets p { color: var(--sc-secondary); margin-top: 8px; }
.sc-workspace-preset-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.sc-workspace-preset-controls input { border: 1px solid var(--sc-divider); border-radius: 6px; min-width: 0; max-width: 100%; padding: 6px 8px; }
.sc-workspace-preset-controls button { color: var(--sc-focus); text-decoration: underline; text-underline-offset: 3px; }
.sc-sync-status { padding: 20px; background: var(--sc-surface, white); border: 1px solid var(--sc-divider); border-radius: 12px; }
.sc-sync-status h2 { font-size: 18px; font-weight: 600; }
.sc-sync-status p { margin-top: 8px; overflow-wrap: anywhere; }
.sc-sync-run { padding-block: 14px; border-bottom: 1px solid var(--sc-divider); }
.sc-sync-run h3 { font-weight: 600; }
.sc-desk-register { background: var(--sc-surface); border-radius: 0 0 7px 7px; overflow: hidden; }
.sc-desk-table-scroll { overflow-x: auto; scrollbar-color: #b2bac5 transparent; }
.sc-desk-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.sc-desk-table th { text-align: left; font-size: 12px; color: var(--sc-secondary); font-weight: 500; padding: 16px 10px; white-space: nowrap; }
.sc-desk-table td { padding: 12px 10px; height: 80px; border-top: 1px solid var(--sc-divider); vertical-align: middle; }
.sc-desk-table th:first-child, .sc-desk-table td:first-child { padding-left: 14px; }
.sc-desk-table tbody tr { cursor: pointer; }
.sc-desk-table tbody tr:hover { background: #f6f8fb; }
.sc-desk-table tbody tr[data-selected=true] { background: var(--sc-selected); }
/* Обёртка окон действий нулевой высоты: снимаем и её единственный отступ сетки (gap-y-8 = 2rem). */
.sc-orders-workspace .sc-action-modals { margin-bottom: -2rem; }
/* Номер переносится по дефису, а не налезает на значок аппарата: колонка 92–100 px, а номер
   без кода филиала — «ORD-261007-3-0001», 17 знаков (Order::makeNumber). */
.sc-order-number { white-space: normal; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
/* «Сохранить» в карточке заказа — у нижнего края экрана, пока до кнопок не докрутили: в браузере
   07.10 она стояла на 1386–1699 px при экране 768–1024 px, за четырьмя секциями. Штатный
   «липкий» режим Filament включается только на странице длиннее двух экранов — карточка короче. */
.fi-resource-orders.fi-resource-edit-record-page .fi-form-actions {
    position: sticky;
    bottom: 0;
    z-index: 5;
    margin-inline: -1rem;
    padding: 12px 1rem calc(12px + env(safe-area-inset-bottom));
    background-color: var(--sc-soft);
    border-top: 1px solid var(--sc-line);
}
.dark .fi-resource-orders.fi-resource-edit-record-page .fi-form-actions { background-color: rgb(24 24 27); }
.sc-order-number button { min-height: 44px; text-align: left; }
.sc-device-cell { display: flex; align-items: center; gap: 10px; min-width: 145px; }
.sc-device-cell > div { display: grid; gap: 2px; max-width: 190px; }
.sc-device-cell strong { font-size: 14px; font-weight: 600; line-height: 1.35; }
.sc-device-cell span:not(.sc-device-symbol), .sc-device-cell small { font-size: 12px; color: var(--sc-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 180px; }
.sc-device-symbol { width: 30px; flex-shrink: 0; color: #626e80; }
.sc-device-symbol svg { width: 30px; height: 42px; }
.sc-status { display: inline-flex; border-radius: 5px; padding: 5px 8px; font-size: 12px; font-weight: 500; line-height: 1.3; white-space: nowrap; background: #e9ebef; color: #374151; }
.sc-status-blue { color: #065ac5; background: #e1efff; }
.sc-status-amber { color: #99501a; background: #fff0df; }
.sc-status-green { color: #146a36; background: #dff2e5; }
.sc-status-violet { color: #6449a3; background: #eee7ff; }
.sc-master-cell { min-width: 75px; max-width: 100px; font-size: 12px; }
.sc-age-cell { max-width: 110px; font-size: 12px; }
.sc-desk-table .sc-money-cell { text-align: right; white-space: normal; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; font-size: 13px; }
.sc-overdue { color: #bb2029; }
.sc-positive { color: #188741; }
.sc-muted { color: var(--sc-secondary); }
.sc-desk-pagination { padding: 12px 16px; border-top: 1px solid var(--sc-divider); }
.sc-desk-empty { display: grid; justify-items: center; padding: 44px 20px; gap: 10px; text-align: center; }
.sc-desk-empty svg { width: 32px; height: 32px; color: var(--sc-secondary); }
.sc-desk-empty h2 { font-size: 18px; font-weight: 600; }
.sc-desk-empty p { color: var(--sc-secondary); }
.sc-desk-empty button { min-height: 44px; text-decoration: underline; }
.sc-advanced-heading { display: flex; justify-content: space-between; gap: 12px; padding-block: 16px; font-size: 14px; }
.sc-advanced-heading button { text-decoration: underline; }
.sc-order-inspector { position: sticky; top: 68px; max-height: calc(100vh - 76px); overflow-y: auto; background: var(--sc-surface); border: 1px solid var(--sc-divider); border-radius: 8px; scrollbar-width: thin; }
.sc-inspector-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 18px 22px 4px; }
.sc-inspector-number { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sc-inspector-number svg { width: 20px; height: 20px; color: #919baa; flex-shrink: 0; }
.sc-inspector-number h2 { font-size: 23px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.sc-inspector-body { padding: 0 22px 22px; }
.sc-inspector-device { padding-block: 6px 16px; border-bottom: 1px solid var(--sc-divider); }
.sc-inspector-device > div { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.sc-inspector-device h3 { min-width: 0; max-width: 100%; overflow-wrap: anywhere; font-size: 22px; font-weight: 600; line-height: 1.35; }
.sc-inspector-device p { color: var(--sc-secondary); font-size: 12px; margin-top: 7px; }
.sc-inspector-section { padding-block: 15px; border-bottom: 1px solid var(--sc-divider); }
.sc-inspector-section h3 { font-size: 14px; font-weight: 600; margin-bottom: 10px; }
.sc-inspector-section p { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.sc-inspector-client { display: flex; align-items: center; gap: 10px; }
.sc-client-avatar { width: 38px; height: 38px; border-radius: 50%; background: #eceef1; color: #525b68; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; flex-shrink: 0; }
.sc-inspector-client > div { display: grid; gap: 2px; min-width: 0; flex: 1; }
.sc-inspector-client strong { font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.sc-inspector-client > div > span { font-size: 13px; }
.sc-repair-timeline { list-style: none; margin-left: 5px; }
.sc-repair-timeline li { position: relative; display: flex; gap: 12px; justify-content: space-between; font-size: 13px; padding: 0 0 16px 20px; border-left: 1px solid #d1d6df; color: var(--sc-secondary); }
.sc-repair-timeline li::before { content: ''; position: absolute; left: -5px; top: 3px; width: 9px; height: 9px; border: 1px solid #98a2b3; border-radius: 50%; background: var(--sc-surface); }
.sc-repair-timeline li:last-child { padding-bottom: 0; border-left-color: transparent; }
.sc-repair-timeline .sc-timeline-current { color: var(--sc-text); font-weight: 600; }
.sc-repair-timeline .sc-timeline-current::before { background: var(--sc-text); border-color: var(--sc-text); }
.sc-repair-timeline time { color: var(--sc-secondary); font-weight: 400; white-space: nowrap; }
.sc-inspector-section .sc-inspector-assignee { margin-top: 12px; font-size: 12px; color: var(--sc-secondary); }
.sc-inspector-items { display: grid; gap: 8px; font-size: 13px; }
.sc-inspector-items li { display: flex; justify-content: space-between; gap: 14px; }
.sc-inspector-items strong { font-weight: 500; white-space: nowrap; }
.sc-inspector-detail { display: inline-flex; align-items: center; min-height: 36px; font-size: 13px; color: #065ac5; }
.sc-inspector-money { display: grid; gap: 8px; font-size: 14px; }
.sc-inspector-money > div { display: flex; justify-content: space-between; gap: 12px; }
.sc-inspector-money dd { font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; min-width: 0; }
.sc-inspector-primary { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px; margin-top: 16px; border-radius: 7px; background: #2a2a2c; color: white; font-size: 14px; font-weight: 600; }
.sc-inspector-primary:hover { background: #151519; }
.dark .sc-desk-table tbody tr:hover { background: #252c37; }
.dark .sc-inspector-primary { background: #e4e4e7; color: #18181b; }
.dark .sc-inspector-detail { color: #91bdff; }
.dark .sc-overdue { color: #ff949a; }
.dark .sc-positive { color: #7fdaa0; }
@media (min-width: 1280px) {
    .fi-body .fi-global-search-field { width: min(48vw, 680px); }
}
@media (min-width: 640px) and (max-width: 1279px) {
    /* При ширине 720px привязка правого края списка шириной 384px обрезала первые 64px результата. */
    .fi-body .fi-global-search-results-ctn { inset-inline-start: 0; inset-inline-end: auto; }
}
@media (max-width: 1099px) {
    .sc-desk-layout { grid-template-columns: minmax(0, 1fr); }
    .sc-order-inspector:not(.sc-inspector-mobile-open) { display: none; }
    .sc-order-inspector.sc-inspector-mobile-open { position: fixed; inset: 0 0 0 auto; width: min(440px, 100vw); max-height: 100dvh; z-index: 60; border-radius: 0; box-shadow: -16px 0 48px rgb(0 0 0 / .16); }
}
@media (max-width: 639px) {
    .fi-main:has(.sc-orders-workspace) { padding: 0 12px 20px; }
    .sc-desk-heading { gap: 10px; margin-bottom: 14px; }
    .sc-desk-heading h1 { font-size: 28px; }
    .sc-desk-primary-actions .fi-btn { padding-inline: 12px; font-size: 13px; }
    .sc-desk-stat { min-height: 78px; padding: 12px; }
    .sc-desk-stat span { font-size: 12px; }
    .sc-desk-stat strong { font-size: 25px; }
    .sc-desk-stat svg { display: none; }
    .sc-desk-tabs button { padding-inline: 10px; font-size: 13px; }
    .sc-desk-tools .sc-icon-control { min-width: 36px; }
    .sc-desk-table { min-width: 660px; }
    .sc-desk-table td { height: 82px; }
    .sc-desk-search input { font-size: 16px; }
    .sc-icon-control { min-width: 44px; min-height: 44px; }
}
@media (prefers-reduced-motion: no-preference) {
    .sc-desk-table tbody tr { transition: background-color 120ms ease-out; }
    .sc-inspector-body { animation: sc-inspector-reveal 160ms ease-out; }
    @keyframes sc-inspector-reveal { from { opacity: .75; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }
}
.sc-desk-layout, .sc-orders-workspace, .sc-orders-workspace > section { min-width: 0; max-width: 100%; }
.sc-desk-table { font-size: 14px; }
.sc-desk-table th { font-size: 13px; }
.sc-device-cell strong { font-size: 16px; }
.sc-device-cell span:not(.sc-device-symbol), .sc-device-cell small { font-size: 13px; }
.sc-master-cell, .sc-age-cell, .sc-status { font-size: 13px; }
.sc-desk-table .sc-money-cell { font-size: 14px; }
.sc-inspector-number h2 { font-size: 25px; }
.sc-inspector-device h3 { font-size: 24px; }
.sc-inspector-section h3, .sc-inspector-client strong { font-size: 15px; }
.sc-mobile-order-number, .sc-mobile-order-context { display: none; }
@media (max-width: 639px) {
    .fi-body .fi-topbar > nav { padding-inline: 12px; gap: 8px; }
    .fi-body .fi-branch-switcher { padding-inline-end: 0; }
    .fi-body .fi-branch-switcher .fi-input { min-width: 0 !important; width: 126px; max-width: 33vw; font-size: 12px; padding-inline-start: 8px; }
    /* Обход с телефона 10.10.2026: в ряду шапки сжималось всё поровну, а выбор точки шириной
       126px не сжимается — и меню профиля сжималось до 0 px: аватар уезжал за край (до 387 при
       ширине 360), на 320 пропадал и колокольчик. Иконки (сканер, поиск, уведомления, профиль)
       держат размер, уступает только выбор точки. На 320: 256 px ряда − 4 иконки (44+44+32+32)
       − 4 зазора по 8 = 72 px на выбор точки; на 360 — 112. */
    .fi-body .fi-topbar > nav > div.ms-auto { column-gap: 8px; min-width: 0; }
    .fi-body .fi-topbar > nav > div.ms-auto > * { flex-shrink: 0; }
    .fi-body .fi-topbar > nav > div.ms-auto > :has(.fi-branch-switcher) { flex-shrink: 1; min-width: 0; }
    .fi-body .fi-topbar > nav > div.ms-auto .fi-branch-switcher .fi-input { width: 100%; max-width: 126px; }
    .fi-body .fi-global-search-field { width: 44px; min-width: 0; position: relative; }
    .fi-body .fi-global-search-field:focus-within { position: absolute; left: 12px; right: 12px; width: auto; z-index: 20; }
    /* 🔴 ЗНАЧОК ПОИСКА НЕ ОТКРЫВАЛ ПОИСК (проверка удобства 20.10.2026, телефон 390). В свёрнутом виде видна
       лупа, а само поле ввода стояло правее неё (x 161–205 при значке 120–164) — под выбором точки: касание
       лупы не ставило курсор, касание поля попадало в выбор точки, и из рамки выглядывала буква «П».
       Свёрнутое поле — прозрачное и на весь значок: касание ставит курсор, правило выше раскрывает поиск. */
    .fi-body .fi-global-search-field:not(:focus-within) input { position: absolute; inset: 0; width: 100%; opacity: 0; z-index: 1; }
    .fi-body .fi-global-search-field:not(:focus-within) .fi-input-wrp { min-height: 42px; }
    /* Фокус показывает рамка всего поля; второй прямоугольник вокруг самого ввода — лишний. */
    .fi-body .fi-global-search-field:focus-within input { outline: none; }
    .fi-body .fi-global-search-field input { font-size: 16px; }
    .sc-desk-table { min-width: 0; }
    .sc-desk-table thead { display: none; }
    .sc-desk-table tr { display: grid; grid-template-columns: minmax(0, 1fr) 44px; padding: 10px 14px; border-top: 1px solid var(--sc-divider); }
    .sc-desk-table td { display: none; padding: 0; height: auto; border: 0; }
    .sc-desk-table td:nth-child(2), .sc-desk-table td:last-child { display: block; }
    .sc-desk-table td:last-child { align-self: center; }
    .sc-desk-table td[colspan] { display: block; grid-column: 1 / -1; }
    .sc-mobile-order-number { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; }
    .sc-device-cell > div { max-width: none; }
    .sc-device-cell strong { font-size: 16px; }
    .sc-device-cell span:not(.sc-device-symbol), .sc-device-cell small { max-width: 230px; }
    .sc-mobile-order-context { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
    .sc-mobile-order-context strong { font-size: 13px; font-weight: 600; }
    .sc-mobile-order-context small { flex-basis: 100%; color: var(--sc-secondary); font-size: 12px; }
}
/* Review corrections: header alignment, readable laptop columns, real workflow links. */
.sc-brand-lockup { display: grid; gap: 5px; }
.sc-brand-caption { font-size: 10px; line-height: 1.2; letter-spacing: 0; color: var(--sc-secondary); white-space: nowrap; }
.fi-sidebar:not(.fi-sidebar-open) .sc-brand-caption { display: none; }
.sc-account-role { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 500; }
.sc-inspector-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.sc-inspector-add { display: inline-flex; align-items: center; gap: 4px; min-height: 36px; font-size: 13px; color: #065ac5; }
.sc-inspector-add svg { width: 16px; height: 16px; }
.sc-inspector-secondary { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px; margin-top: 10px; border: 1px solid #586577; border-radius: 7px; font-size: 14px; font-weight: 600; color: var(--sc-text); }
.sc-inspector-secondary:hover { background: var(--sc-hover); }
.sc-master-cell > span { display: block; max-width: 110px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.dark .sc-inspector-add { color: #91bdff; }
@media (min-width: 1280px) {
    .fi-body .fi-topbar > nav { padding-inline: 20px; }
    .fi-body .fi-topbar > nav > div.ms-auto { margin-inline-start: 0; width: 100%; }
    .fi-body .fi-topbar .fi-global-search { margin-inline-end: auto; min-width: 0; }
    .fi-body .fi-global-search-field { width: min(44vw, 680px); }
    .sc-desk-table { table-layout: fixed; }
    .sc-desk-table th:first-child { width: 100px; }
    .sc-desk-table th:nth-child(3) { width: 144px; }
    .sc-desk-table th:nth-child(4) { width: 98px; }
    .sc-desk-table th:nth-child(5) { width: 65px; }
    .sc-desk-table th.sc-money-cell { width: 118px; }
    .sc-desk-table th:last-child { width: 36px; }
    .sc-desk-table td { padding-inline: 8px; height: 82px; }
    .sc-device-cell { min-width: 0; }
    .sc-device-cell > div { min-width: 0; max-width: none; }
    .sc-device-cell strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .sc-device-cell span:not(.sc-device-symbol), .sc-device-cell small { max-width: 100%; }
}
@media (min-width: 1280px) and (max-width: 1499px) {
    .sc-desk-layout { grid-template-columns: minmax(0, 1fr) 340px; }
    .sc-desk-layout.sc-desk-wide, .sc-desk-layout:not(:has(.sc-order-inspector)) { grid-template-columns: minmax(0, 1fr); }
    .sc-desk-table th:first-child { width: 92px; }
    .sc-desk-table th:nth-child(3) { width: 137px; }
    .sc-desk-table th:nth-child(4) { width: 88px; }
    .sc-desk-table th.sc-money-cell { width: 108px; }
}
@media (max-width: 1279px) {
    .sc-account-role { display: none; }
    .sc-desk-layout { grid-template-columns: minmax(0, 1fr); }
    .sc-order-inspector:not(.sc-inspector-mobile-open) { display: none; }
    .sc-order-inspector.sc-inspector-mobile-open { position: fixed; inset: 0 0 0 auto; width: min(440px, 100vw); max-height: 100dvh; z-index: 60; border-radius: 0; box-shadow: -16px 0 48px rgb(0 0 0 / .16); }
}

/* User-selected reference, 19 Sep: dark navigation / blue operational system. */
:root { --sc-primary: #265dff; --sc-ink: #11172b; --sc-text: #11172b; --sc-secondary: #5c6c85; --sc-line: #dfe6ef; --sc-divider: #dfe6ef; --sc-soft: #f2f5f8; --sc-focus: #265dff; --sc-selected: #edf3ff; }
.fi-body .fi-sidebar, .fi-body .fi-sidebar-header { background: #222b32; border-color: #222b32; }
.fi-body .fi-sidebar-header { height: 124px; min-height: 124px; align-items: flex-start; padding-top: 27px; }
.fi-body .fi-sidebar .sc-brand, .fi-body .fi-sidebar .sc-brand-domain { color: #f8fafc; }
.fi-body .fi-sidebar .sc-brand-caption { color: #bdc9d6; font-size: 13px; line-height: 1.4; letter-spacing: .025em; }
.fi-body .fi-sidebar-nav { padding: 10px 9px 24px; }
.sc-primary-nav { gap: 3px; }
.sc-primary-nav a { min-height: 55px; color: #d4dfea; gap: 20px; padding: 12px 18px; font-weight: 400; }
.sc-primary-nav a:hover { background: #34414c; color: #fff; }
.sc-primary-nav .sc-nav-active, .dark .sc-primary-nav .sc-nav-active { background: var(--sc-focus); color: white; font-weight: 500; }
.sc-primary-nav .sc-nav-active::before, .fi-sidebar-item-active > .fi-sidebar-item-button::before { display: none; }
.sc-menu-disclosure { color: #bfccda; margin-top: 12px; }
.fi-sidebar .fi-sidebar-item-label, .fi-sidebar .fi-sidebar-group-label, .fi-sidebar .fi-sidebar-item-icon, .fi-sidebar .fi-icon-btn-icon { color: #d4dfea; }
.fi-sidebar .fi-sidebar-item-button:hover { background: #34414c; }
.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-button { background: #265dff; }
.fi-body .fi-topbar > nav { min-height: 72px; }
.sc-account-role { display: grid; gap: 2px; max-width: 190px; }
.sc-account-role strong { font-size: 13px; font-weight: 500; }
.sc-account-role span { color: var(--sc-secondary); font-size: 12px; }
.sc-inspector-primary, .dark .sc-inspector-primary { background: var(--sc-focus); color: #fff; }
.sc-inspector-primary:hover { background: #1748d6; }
.sc-desk-tabs button[aria-pressed=true] { color: var(--sc-focus); border-color: var(--sc-focus); }
.sc-inspector-detail, .sc-pulse-link { color: var(--sc-focus); }
.fi-main:has(.sc-network-workspace) { padding: 0 26px 24px 28px; max-width: none; }
.sc-network-workspace > section { padding-block: 24px 0; gap: 0; }
.sc-network-workspace { color: var(--sc-text); }
.sc-network-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.sc-network-heading h1 { font-size: 44px; line-height: 1.15; letter-spacing: -.03em; font-weight: 700; }
.sc-network-heading p { margin-top: 7px; color: var(--sc-secondary); font-size: 16px; }
.sc-network-controls { display: flex; align-items: center; gap: 16px; }
.sc-network-controls .fi-branch-switcher { padding: 0; }
.sc-network-controls select, .sc-network-date { min-height: 50px; border: 1px solid #cbd6e5; border-radius: 6px; background-color: var(--sc-surface, white); padding: 12px 16px; font-size: 14px; color: #344866; box-shadow: none; }
.sc-network-controls select { width: 240px; }
.sc-network-date { display: flex; gap: 14px; align-items: center; white-space: nowrap; }
.sc-network-date svg { width: 23px; height: 23px; }
.sc-network-freshness { font-size: 12px; line-height: 1.5; color: var(--sc-secondary); margin: 12px 0 16px; }
.sc-network-warning { padding: 12px 16px; border: 1px solid #d9a84e; background: #fff7e8; color: #735014; border-radius: 6px; }
.sc-network-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.sc-network-kpi { position: relative; display: grid; grid-template-columns: 62px minmax(0, 1fr); align-content: center; align-items: center; column-gap: 20px; row-gap: 10px; border: 1px solid var(--sc-divider); border-radius: 6px; background: var(--sc-surface, white); min-height: 155px; padding: 22px; }
.sc-network-icon { display: inline-flex; width: 60px; height: 60px; flex-shrink: 0; align-items: center; justify-content: center; border-radius: 10px; }
.sc-network-icon svg { width: 30px; height: 30px; stroke-width: 1.8; }
.sc-network-blue { background: #e7eeff; color: #235bfa; }
.sc-network-green { background: #e4f5eb; color: #07822b; }
.sc-network-red { background: #ffebed; color: #e71425; }
.sc-network-amber { background: #fff3df; color: #a96b00; }
.sc-network-kpi-label { font-size: 14px; }
.sc-network-kpi strong { display: block; margin-top: 5px; font-size: clamp(25px, 2.05vw, 34px); line-height: 1.15; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sc-network-kpi small { grid-column: 1 / -1; color: var(--sc-secondary); font-size: 12px; }
.sc-kpi-cover { position: absolute; inset: 0; border-radius: 6px; }
.sc-network-kpi:has(a:hover) { border-color: #91acfd; }
.sc-network-columns { display: grid; grid-template-columns: minmax(0, 1.74fr) minmax(310px, 1fr); gap: 16px; align-items: start; }
.sc-network-main, .sc-network-side { display: grid; gap: 16px; min-width: 0; }
.sc-network-panel { background: var(--sc-surface, white); border: 1px solid var(--sc-divider); border-radius: 6px; min-width: 0; overflow: hidden; }
.sc-network-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 62px; padding: 16px 20px; border-bottom: 1px solid var(--sc-divider); }
.sc-network-panel h2 { font-size: 20px; font-weight: 600; letter-spacing: -.02em; line-height: 1.3; }
.sc-network-panel header > span:not(.sc-network-count) { color: var(--sc-secondary); font-size: 12px; }
.sc-branch-table-wrap { overflow-x: auto; }
.sc-branch-table { border-collapse: collapse; width: 100%; font-size: 15px; font-variant-numeric: tabular-nums; }
.sc-branch-table thead { background: var(--sc-soft); color: #435573; font-size: 13px; }
.sc-branch-table th, .sc-branch-table td { border-bottom: 1px solid var(--sc-divider); padding: 14px 18px; text-align: center; white-space: nowrap; }
.sc-branch-table th { font-weight: 500; }
.sc-branch-table th:first-child { text-align: left; }
.sc-branch-table td:last-child { text-align: right; }
.sc-network-danger { color: #d80d22; }
.sc-network-table-note { font-size: 11px; color: var(--sc-secondary); padding: 10px 18px; }
.sc-network-chart header { border: 0; }
.sc-network-chart svg { display: block; width: 100%; padding: 0 12px 12px; }
.sc-network-chart text { fill: var(--sc-secondary); font: 13px Inter, sans-serif; }
.sc-network-chart .sc-chart-value { fill: var(--sc-text); }
.sc-chart-grid { stroke: var(--sc-divider); stroke-width: 1; }
.sc-chart-area { fill: #265dff; fill-opacity: .09; }
.sc-chart-line { fill: none; stroke: #265dff; stroke-width: 2.5; stroke-linejoin: round; }
.sc-chart-dot { fill: #265dff; }
.sc-network-count { border-radius: 50%; background: #e71425; color: white; min-width: 29px; height: 29px; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; }
.sc-network-decisions { padding: 0 20px; }
.sc-network-decision { display: flex; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--sc-divider); }
.sc-network-decision:last-child { border: 0; }
.sc-network-decision .sc-network-icon { width: 50px; height: 50px; border-radius: 50%; }
.sc-network-decision p { font-size: 13px; line-height: 1.55; }
.sc-network-workspace a:not(.sc-kpi-cover) { color: #1e53ec; font-size: 14px; display: inline-flex; align-items: center; gap: 7px; min-height: 36px; }
.sc-network-workspace a svg { width: 17px; height: 17px; }
.sc-network-empty { padding: 20px 0; }
.sc-network-empty strong { display: block; font-size: 15px; margin: 12px 0 6px; }
.sc-network-empty p { font-size: 13px; color: var(--sc-secondary); line-height: 1.6; }
.sc-network-summary { display: flex; gap: 20px; padding: 22px 20px; }
.sc-network-summary .sc-network-icon { border-radius: 50%; }
.sc-network-summary strong { font-size: 15px; line-height: 1.4; }
.sc-network-summary p { font-size: 14px; line-height: 1.55; color: var(--sc-secondary); margin: 6px 0 12px; }
.sc-network-summary small { display: block; margin-top: 8px; font-size: 11px; color: var(--sc-secondary); }
.sc-network-more { margin-top: 22px; }
.sc-network-more summary { cursor: pointer; min-height: 44px; padding-block: 12px; color: var(--sc-secondary); font-size: 13px; }
.sc-network-more .sc-network-tile { padding: 18px; border: 1px solid var(--sc-divider); }
.sc-network-more strong { display: block; font-size: 24px; }
.sc-network-more p { font-size: 12px; }
.sc-network-footer { display: flex; justify-content: space-between; gap: 16px; padding-top: 16px; font-size: 12px; color: var(--sc-secondary); }
.dark .sc-network-controls select, .dark .sc-network-date, .dark .sc-branch-table thead { color: #c9d8ee; }
.dark .sc-network-warning { background: #352c1e; color: #f2d9a3; }
.dark .sc-network-workspace a:not(.sc-kpi-cover) { color: #9db8ff; }
@media (max-width: 1399px) {
    .sc-network-kpi { padding: 18px 14px; column-gap: 12px; grid-template-columns: 48px minmax(0, 1fr); }
    .sc-network-kpi > .sc-network-icon { width: 48px; height: 48px; }
    .sc-network-controls select { width: 195px; }
    .sc-network-heading h1 { font-size: 38px; }
    .sc-branch-table th, .sc-branch-table td { padding-inline: 12px; }
}
@media (max-width: 1199px) {
    .sc-network-heading { align-items: flex-start; flex-direction: column; }
    .sc-network-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-network-columns { grid-template-columns: minmax(0, 1fr); }
    .sc-network-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-account-role { display: none; }
}
@media (max-width: 639px) {
    .fi-main:has(.sc-network-workspace) { padding-inline: 14px; }
    .sc-network-workspace > section { padding-top: 18px; }
    .sc-network-heading h1 { font-size: 32px; }
    .sc-network-heading p { font-size: 14px; }
    .sc-network-controls { width: 100%; gap: 8px; flex-wrap: wrap; }
    .sc-network-controls select { width: 100%; min-width: 0 !important; }
    .sc-network-controls > div { flex: 1; min-width: 145px; }
    .sc-network-date { font-size: 12px; padding: 10px; gap: 6px; }
    .sc-network-kpis { gap: 8px; }
    .sc-network-kpi { display: block; min-height: 148px; padding: 14px; }
    .sc-network-kpi > .sc-network-icon { width: 32px; height: 32px; margin-bottom: 8px; }
    .sc-network-kpi > .sc-network-icon svg { width: 21px; height: 21px; }
    .sc-network-kpi strong { font-size: 23px; white-space: normal; overflow-wrap: anywhere; }
    .sc-network-kpi-label { font-size: 12px; }
    .sc-network-kpi small { display: block; margin-top: 6px; font-size: 11px; }
    .sc-network-panel h2 { font-size: 18px; }
    .sc-network-panel > header { padding: 14px; }
    .sc-network-chart header { flex-wrap: wrap; }
    .sc-network-side { grid-template-columns: minmax(0, 1fr); }
    .sc-network-footer { flex-direction: column; gap: 6px; }
    .sc-branch-table { font-size: 13px; }
    .sc-network-chart svg { padding: 0 0 8px; }
}

.dark { --sc-text: #f4f4f5; --sc-secondary: #b4bdca; --sc-line: #3f4652; --sc-divider: #3f4652; --sc-soft: #202733; --sc-selected: #223249; }
.sc-network-count-clear { background: #e4f5eb; color: #07822b; }

/* Cancel the framework slot gap; this workspace owns its spacing. */
.sc-network-workspace > section > div > .grid { row-gap: 0; }
.sc-network-kpi strong { white-space: normal; overflow-wrap: anywhere; }

.sc-chart-scroll { overflow-x: auto; scrollbar-color: #9badc8 transparent; }
.sc-chart-hint { display: none; }
@media (max-width: 639px) {
    .sc-network-chart svg { min-width: 700px; }
    .sc-chart-hint { display: block; padding: 0 14px 12px; font-size: 12px; color: var(--sc-secondary); }
    .sc-desk-toolbar { flex-wrap: wrap; }
    .sc-desk-tabs { flex: 1 0 100%; flex-wrap: wrap; overflow: visible; }
    .sc-desk-tabs button { padding-inline: 10px; }
    .sc-desk-tools { width: 100%; justify-content: flex-end; }
}

/* The agreed price stays visible beside the current order context. */
.sc-approval-status { flex-basis: 100%; width: 100%; display: grid; gap: .35rem; font-size: .875rem; line-height: 1.5; }
.sc-order-inspector .sc-approval-status { padding-top: 1rem; border-top: 1px solid var(--sc-divider); }

@media (max-width: 639px) {
    .fi-body .fi-resource-orders .fi-ta-header > .fi-ta-actions { display: flex; flex-wrap: wrap; width: 100%; gap: .5rem; }
    .fi-body .fi-resource-orders .fi-ta-header > .fi-ta-actions .fi-btn { width: 100%; white-space: normal; }
}

/* Payroll extends the operational table with readable mobile employee rows. */
.sc-payroll-report { display: grid; gap: 24px; min-width: 0; }
#payroll-composition-heading { display: block; scroll-margin-top: 96px; }
.sc-payroll-summary th, .sc-payroll-summary td { padding: 10px 8px; }
@media (max-width: 640px) {
    .sc-payroll-summary thead { display: none; }
    .sc-payroll-summary, .sc-payroll-summary tbody { display: block; width: 100%; }
    .sc-payroll-summary tr { display: grid; gap: 12px; padding: 18px 0; }
    .sc-payroll-summary td { display: flex; justify-content: space-between; gap: 12px; padding: 0; text-align: right; overflow-wrap: anywhere; }
    .sc-payroll-summary td::before { content: attr(data-label); text-align: left; color: var(--sc-secondary); font-weight: 400; }
    .sc-payroll-summary td:first-child { display: block; text-align: left; font-weight: 600; }
    .sc-payroll-summary td:first-child::before, .sc-payroll-summary td:last-child:not([data-label])::before { display: none; }
    .sc-payroll-summary td:last-child:not([data-label]) { justify-content: flex-start; }
}

/* 🔴 ФОКУС В ТЁМНОМ МЕНЮ БЫЛ ПОЧТИ НЕВИДИМ (аудит интерфейса 05.10.2026). Общий фокус — синий #265dff:
   на фоне меню #222b32 это около 2,8:1 (нужно не меньше 3:1), а на активном пункте, залитом тем же
   синим, — 1:1, то есть рамки нет вовсе. В меню рамка светлая: 13,8:1 к фону и 4,9:1 к активному. */
.fi-body .fi-sidebar :is(a, button, input, select, summary):focus-visible,
.fi-body .fi-sidebar .sc-menu-disclosure:has(input:focus-visible) { outline-color: #f8fafc; }

/* 🔴 ПАЛЕЦ НА ПЛАНШЕТЕ — ТОТ ЖЕ, ЧТО НА ТЕЛЕФОНЕ (аудит интерфейса 05.10.2026). Цели 44 px включались
   только уже 640 px; у стойки планшет 768–1279 px получал кнопки 40 px и значки 36 px, и приёмщик
   попадал в соседнюю. Условие — сенсорный указатель, а не ширина: ноутбук с мышью не меняется. */
@media (pointer: coarse) {
    .fi-btn, .fi-input, .fi-icon-btn, .sc-icon-control, .sc-desk-tools .sc-icon-control { min-width: 44px; min-height: 44px; }
    .fi-input { font-size: 16px; }
    /* 🔴 ОБХОД 09.10.2026, ТЕЛЕФОН 390 px: флажок строки таблицы 16×16, крестик «Удалить фильтр» 22×22,
       номер заказа на доске 54×20 — в два-три раза меньше пальца. Зона касания растёт невидимым полем
       до 44 px, а вид, высота строк и колонки доски не меняются. Флажки ФОРМ сюда не входят: в списке
       выбора они стоят через 24 px, и поля соседних пунктов перекрылись бы — палец ставил бы чужую галку. */
    label:has(> .fi-ta-record-checkbox), label:has(> .fi-ta-page-checkbox), .fi-badge-delete-button, .sc-board-number { position: relative; }
    label:has(> .fi-ta-record-checkbox)::after, label:has(> .fi-ta-page-checkbox)::after { content: ''; position: absolute; inset: -14px; }
    .fi-badge-delete-button::after { content: ''; position: absolute; inset: -11px; }
    .sc-board-number::after { content: ''; position: absolute; inset: -12px -4px; }
    .sc-workspace-preset-controls button { min-height: 44px; }
    /* Обход планшета 10.10.2026 (340 экранов, pointer: coarse): ссылочные действия в строке таблицы —
       «Изменить», «Этикетка», «Позиции», «Отменить», «Пришёл» — 20 px в высоту, на 36 разных экранах (75 открытий из 340 по всем ролям);
       крошки над заголовком — тоже 20. Поле касания растёт вверх-вниз на 12 px (до 44), вбок на 6:
       соседние действия стоят через 12 px (gap-3), крошки — через 8 и шеврон, поля не перекрываются. */
    .fi-ta-actions .fi-ac-link-action::after { content: ''; position: absolute; inset: -12px -6px; }
    .fi-breadcrumbs-item-label { position: relative; }
    .fi-breadcrumbs-item-label::after { content: ''; position: absolute; inset: -12px -4px; }
    /* Проверка удобства 20.10.2026 (телефон 390 px, 340 экранов): текстовые ссылки 17 px — «Как считаются
       показатели» на каждом отчёте, памятка, расшифровки ОПиУ и баланса; ссылки в ячейках списка на телефоне
       («Клиент», «Когда», «Статус») — 20 px. Ячейки строки ведут в одну запись, поэтому их поля могут
       перекрываться — растут на 12 px. Текстовые — на 8 (до 33 px): строки расшифровки стоят через 28 px,
       и поле больше залезло бы на соседнюю строку. Вбок не растут — соседей сбоку не задевают. */
    .fi-main :is(p, li, td) > a, .fi-ta-cell a { position: relative; }
    .fi-main :is(p, li, td) > a::after { content: ''; position: absolute; inset: -8px 0; }
    .fi-ta-cell a::after { content: ''; position: absolute; inset: -12px 0; }
}

/* Полоса стадий лида (план 200, задача 1): шаги в ряд, на телефоне переносятся; кнопки 44 px для касания. */
.sc-lead-stages ol { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; }
.sc-lead-stage > button, .sc-lead-stage > span {
    display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px;
    border: 1px solid var(--sc-line); border-radius: 999px; font-size: 14px; font-weight: 600;
    color: var(--sc-ink); background: #fff;
}
.sc-lead-stage > button { cursor: pointer; }
.sc-lead-stage > button:hover, .sc-lead-stage > button:focus-visible { border-color: var(--sc-ink); }
.sc-lead-stage--done > button, .sc-lead-stage--done > span { background: var(--sc-soft); color: var(--sc-grey); }
.sc-lead-stage--current > span { background: var(--sc-ink); border-color: var(--sc-ink); color: #fff; }
.sc-lead-stage-lost { margin-top: 8px; font-weight: 600; color: var(--sc-red); }
.dark .sc-lead-stage > button, .dark .sc-lead-stage > span { background: rgb(39 39 42); border-color: rgb(63 63 70); color: rgb(244 244 245); }
.dark .sc-lead-stage--done > button, .dark .sc-lead-stage--done > span { background: rgb(24 24 27); color: rgb(161 161 170); }
.dark .sc-lead-stage--current > span { background: rgb(244 244 245); color: rgb(24 24 27); }

/* Доска обращений (план 200, задача 2): четыре столбца на ПК, прокрутка вбок на планшете и телефоне. */
.sc-lead-board { display: grid; grid-template-columns: repeat(4, minmax(240px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 8px; }
.sc-lead-column { background: var(--sc-soft); border: 1px solid var(--sc-line); border-radius: var(--sc-radius); padding: 10px; min-height: 200px; }
.sc-lead-column--over { border-color: var(--sc-ink); }
.sc-lead-column h2 { display: flex; justify-content: space-between; font-weight: 700; margin-bottom: 8px; }
.sc-lead-column h2 span { color: var(--sc-grey); font-weight: 600; }
.sc-lead-card { background: #fff; border: 1px solid var(--sc-line); border-radius: 8px; padding: 10px; margin-bottom: 8px; cursor: grab; }
.sc-lead-card__name { font-weight: 700; color: var(--sc-ink); }
.sc-lead-card__meta { font-size: 13px; color: var(--sc-grey); margin-top: 2px; }
.sc-lead-card__text { font-size: 14px; margin-top: 4px; overflow-wrap: anywhere; }
.sc-lead-card__warn { color: var(--sc-red); }
.sc-lead-card__moves { display: flex; gap: 6px; justify-content: flex-end; margin-top: 6px; }
.sc-lead-card__moves button { min-width: 44px; min-height: 44px; border: 1px solid var(--sc-line); border-radius: 8px; font-size: 18px; }
.sc-lead-column__empty { font-size: 13px; color: var(--sc-grey); padding: 6px 2px; }
.dark .sc-lead-column { background: rgb(24 24 27); border-color: rgb(63 63 70); }
.dark .sc-lead-card { background: rgb(39 39 42); border-color: rgb(63 63 70); }
.dark .sc-lead-card__name { color: rgb(244 244 245); }
.dark .sc-lead-card__moves button { border-color: rgb(63 63 70); }

/* Лента обращения (план 200, задача 3). */
.sc-lead-timeline { margin-top: 24px; }
.sc-lead-timeline h2 { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.sc-lead-event { border-left: 3px solid var(--sc-line); padding: 6px 0 10px 12px; }
.sc-lead-event--message, .sc-lead-event--call { border-left-color: #2563eb; }
.sc-lead-event--stage { border-left-color: var(--sc-ink); }
.sc-lead-event--task-open { border-left-color: #d97706; }
.sc-lead-event--task-done { border-left-color: var(--sc-green); }
.sc-lead-event--overdue { border-left-color: var(--sc-red); }
.sc-lead-event--overdue .sc-lead-event__body { color: var(--sc-red); font-weight: 600; }
.sc-lead-event__head { font-size: 14px; display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; }
.sc-lead-event__head time, .sc-lead-event__head span { color: var(--sc-grey); font-size: 13px; }
.sc-lead-event__body { font-size: 14px; margin-top: 2px; white-space: pre-line; overflow-wrap: anywhere; }
.sc-lead-event__done { margin-top: 6px; min-height: 44px; padding: 0 14px; border: 1px solid var(--sc-line); border-radius: 8px; font-weight: 600; }
.dark .sc-lead-event__done { border-color: rgb(63 63 70); }
/* Шаг, который не нажимается («Оплата» — её ставят деньги), — пунктиром: иначе его принимают за кнопку. */
.sc-lead-stage--idle > span { border-style: dashed; color: var(--sc-grey); }

/* Поле подписи клиента (план 200, задача 20): белый фон и в тёмной теме — подпись чёрным по белому. */
.sc-signature-pad { width: 100%; height: 180px; background: #fff; border: 2px dashed var(--sc-line); border-radius: 8px; touch-action: none; }
.sc-signature-pad__bar { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; font-size: 14px; color: var(--sc-grey); }
.sc-signature-pad__bar button { min-height: 44px; padding: 0 14px; border: 1px solid var(--sc-line); border-radius: 8px; font-weight: 600; }

/* Сканер штрихкодов камерой (план 200, задача 49). */
.sc-scan__button { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: 8px; color: var(--sc-grey); }
.sc-scan__button:hover, .sc-scan__button:focus-visible { color: var(--sc-ink); background: var(--sc-soft); }
.sc-scan__overlay { position: fixed; inset: 0; z-index: 60; background: rgb(0 0 0 / .6); display: flex; align-items: center; justify-content: center; padding: 16px; }
.sc-scan__panel { background: #fff; border-radius: 12px; padding: 16px; width: min(480px, 100%); }
.sc-scan__video { width: 100%; border-radius: 8px; background: #000; aspect-ratio: 4 / 3; object-fit: cover; }
.sc-scan__hint { margin-top: 8px; font-size: 14px; color: var(--sc-ink); }
.sc-scan__close { margin-top: 12px; min-height: 44px; width: 100%; border: 1px solid var(--sc-line); border-radius: 8px; font-weight: 600; }
.dark .sc-scan__panel { background: rgb(24 24 27); }
.dark .sc-scan__hint { color: rgb(244 244 245); }

/* ── Контраст текста по WCAG AA (план 200, задача 158) ───────────────────────────────────────
   Проверка axe-core 07.10.2026: янтарный текст предупреждений (#d97706 на белом — 3,18 : 1)
   и серые хлебные крошки на фоне страницы (#71717a на #f2f5f8 — 4,41 : 1) ниже порога 4,5 : 1.
   Это мелкий текст («Срок сегодня», подпись плитки), его читают у стойки при ярком свете.
   Только светлая тема: в тёмной у этих цветов контраст достаточный. */
html:not(.dark) .text-custom-600[style*="--warning-600"],
html:not(.dark) [style*="--warning-600"] .text-custom-600 { color: #b45309; } /* 5,0 : 1 на белом */
html:not(.dark) .fi-breadcrumbs-item-label,
html:not(.dark) .fi-main .text-gray-500 { color: #5b5b66; } /* 6,1 : 1 на #f2f5f8 */
html:not(.dark) .fi-ta-placeholder { color: #6b6b75; } /* «не задано» в таблицах: #a1a1aa давал 2,56 : 1, теперь 5,1 : 1 */

/* Тёмная тема (та же проверка, задача 158): серые подписи и плейсхолдеры были 2,3–3,7 : 1.
   `html.dark`, а не `.dark`: у Filament правило `dark:text-gray-500` той же силы и подключено
   позже — с равной специфичностью побеждало оно. */
.dark { --sc-grey: #b4b4bc; }
html.dark .fi-ta-placeholder,
html.dark .fi-main .text-gray-500,
html.dark .fi-main .text-gray-600 { color: #a1a1aa; } /* 7 : 1 на #18181b */
html.dark .sc-lead-card__warn { color: #fca5a5; }
html.dark .sc-desk-tabs button[aria-pressed=true] { color: #8fb0ff; border-color: #8fb0ff; } /* #265dff был 3,45 : 1 */
html.dark .fi-ta-filter-indicators .truncate,
html.dark [class*="dark:bg-custom-400/10"] .truncate { color: #b3c7ff; } /* метка фильтра: 4,37 → 8 : 1 */
html.dark .fi-main a.text-primary-600 { color: #8fb0ff; } /* ссылки отчётов: #2254e6 был 2,93 : 1 */

/* Кнопки «Вернуть введённое» / «Удалить» в плашке черновика (задача 162): цель касания 44 px. */
.sc-offline-draft__btn { min-height: 44px; margin-left: 8px; padding: 0 12px; border: 1px solid currentColor; border-radius: 8px; font-weight: 600; }

/* Phone bottom bar: orders, board, scanner, my work within thumb reach (plan 300, U15). */
.sc-bottom-bar { display: none; }
@media (max-width: 639px) {
    .sc-bottom-bar { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; position: fixed; inset: auto 0 0 0; z-index: 30; border-top: 1px solid var(--sc-line); background: var(--sc-surface); padding-bottom: env(safe-area-inset-bottom); }
    .sc-bottom-bar a, .sc-bottom-bar button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 56px; font-size: .75rem; color: var(--sc-muted); }
    .sc-bottom-bar svg { width: 22px; height: 22px; }
    .sc-bottom-bar [aria-current="page"] { color: var(--sc-focus); font-weight: 600; }
    .fi-body .fi-main { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
}

/* Hotkeys cheat sheet opened with "?" (plan 300, U17). */
.sc-hotkeys { position: fixed; inset: 0; z-index: 60; background: rgb(0 0 0 / .5); display: flex; align-items: center; justify-content: center; padding: 16px; }
.sc-hotkeys__panel { background: var(--sc-surface); border-radius: 12px; padding: 16px 20px; width: min(440px, 100%); }
.sc-hotkeys__panel h2 { font-weight: 600; margin-bottom: 8px; }
.sc-hotkeys__panel dl > div { display: flex; gap: 12px; padding: 4px 0; border-bottom: 1px solid var(--sc-line); }
.sc-hotkeys__panel dt { min-width: 72px; }
.sc-hotkeys__panel kbd { font-family: ui-monospace, monospace; font-size: .8125rem; padding: 1px 6px; border: 1px solid var(--sc-line); border-radius: 4px; }

/* Заказ слева, история справа — как в LiveSklad (App\Livewire\OrderFeed, владелец 10.11.2026).
   С 1280 px — две колонки, лента прилипает к верху и прокручивается сама; уже — лента под заказом. */
.sc-order-layout { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); }
.sc-order-main { min-width: 0; display: grid; gap: 1rem; align-content: start; }
.sc-order-feed { display: flex; flex-direction: column; border: 1px solid #e4e4e7; border-radius: .75rem; background: #fff; min-height: 20rem; }
.sc-order-feed-title { font-size: 1.125rem; font-weight: 600; padding: .75rem 1rem; border-bottom: 1px solid #e4e4e7; }
.sc-order-feed-list { flex: 1; overflow-y: auto; padding: .75rem 1rem; display: grid; gap: .75rem; align-content: start; max-height: 32rem; }
.sc-order-feed-item { border-left: 2px solid #e4e4e7; padding-left: .75rem; }
.sc-order-feed-head { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.sc-order-feed-head time { font-size: .75rem; color: #71717a; white-space: nowrap; }
.sc-order-feed-text { margin-top: .25rem; font-size: .875rem; white-space: pre-line; overflow-wrap: anywhere; }
.sc-order-feed-actor { margin-top: .125rem; font-size: .75rem; color: #71717a; font-style: italic; }
.sc-order-feed-now span { display: inline-block; font-size: .75rem; color: #fff; background: #a1a1aa; border-radius: .25rem; padding: .125rem .5rem; }
.sc-order-feed-input { border-top: 1px solid #e4e4e7; padding: .75rem 1rem; display: grid; gap: .5rem; }
.sc-order-feed-input textarea { width: 100%; border: 1px solid #d4d4d8; border-radius: .5rem; padding: .5rem .625rem; font-size: .875rem; resize: vertical; background: transparent; }
.sc-order-feed-input button { justify-self: end; min-height: 40px; padding: .375rem 1rem; border-radius: .5rem; background: #1d4ed8; color: #fff; font-weight: 600; font-size: .875rem; }
.sc-order-feed-input button[disabled] { opacity: .6; }
.sc-order-feed-error { color: #b91c1c; font-size: .8125rem; }
.sc-order-feed-hint { color: #71717a; font-size: .75rem; }
.dark .sc-order-feed, .dark .sc-order-feed-title, .dark .sc-order-feed-input { border-color: #3f3f46; }
.dark .sc-order-feed { background: rgba(255, 255, 255, .03); }
.dark .sc-order-feed-item { border-color: #3f3f46; }
.dark .sc-order-feed-input textarea { border-color: #52525b; }
@media (min-width: 1280px) {
    .sc-order-layout { grid-template-columns: minmax(0, 1fr) 22rem; align-items: start; }
    .sc-order-feed { position: sticky; top: 5rem; max-height: calc(100vh - 6rem); }
    .sc-order-feed-list { max-height: none; }
}
/* Таблица работ не залезает под ленту: прокручивается внутри колонки заказа. */
.sc-order-main > * { min-width: 0; }
.sc-order-items, .sc-order-main .fi-ta { max-width: 100%; overflow-x: auto; }
/* Длинная запись ленты — шесть строк, остальное по щелчку; название события переносится, а не режется. */
.sc-order-feed-text.is-clamped { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
.sc-order-feed-head .fi-badge { white-space: normal; text-align: left; }
.sc-order-feed-head .fi-badge span { white-space: normal; overflow: visible; text-overflow: clip; }
/* Нижняя панель заказа, как в LiveSklad: Сохранить · Выдать · Печать (несколько документов галочками). */
.sc-order-bar { position: sticky; bottom: 0; z-index: 20; display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; padding: .75rem 1rem; background: #fff; border: 1px solid #e4e4e7; border-radius: .75rem; box-shadow: 0 -4px 12px rgba(0, 0, 0, .06); }
.sc-order-bar button { min-height: 44px; padding: .5rem 1.25rem; border-radius: .5rem; font-weight: 600; font-size: .9375rem; border: 1px solid #d4d4d8; background: #fff; }
.sc-order-bar .sc-order-bar-save { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
.sc-order-bar .sc-order-bar-issue { background: #16a34a; border-color: #16a34a; color: #fff; }
.sc-order-bar-print { position: relative; margin-left: auto; }
.sc-order-bar-menu { position: absolute; right: 0; bottom: calc(100% + .5rem); min-width: 16rem; display: grid; gap: .5rem; padding: .75rem; background: #fff; border: 1px solid #d4d4d8; border-radius: .5rem; box-shadow: 0 8px 24px rgba(0, 0, 0, .12); }
.sc-order-bar-menu label { display: flex; gap: .5rem; align-items: center; font-size: .9375rem; min-height: 32px; }
.sc-order-bar-menu button[disabled] { opacity: .5; }
.dark .sc-order-bar, .dark .sc-order-bar-menu { background: #18181b; border-color: #3f3f46; }
.dark .sc-order-bar button:not(.sc-order-bar-save):not(.sc-order-bar-issue) { background: transparent; border-color: #52525b; color: #e4e4e7; }
/* Заказ панелью поверх списка, как в LiveSklad (filament.orders.slideover). Список виден слева и кликается. */
.sc-slideover-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 1280px); z-index: 40; background: #f4f4f5; box-shadow: -12px 0 32px rgba(0, 0, 0, .18); }
.sc-slideover-panel iframe { width: 100%; height: 100%; border: 0; display: block; }
.sc-slideover-close { position: absolute; top: .5rem; left: -2.75rem; width: 2.5rem; height: 2.5rem; border-radius: 9999px; background: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .2); font-size: 1.5rem; line-height: 1; color: #27272a; }
.dark .sc-slideover-panel { background: #09090b; }
.dark .sc-slideover-close { background: #27272a; color: #f4f4f5; }
@media (max-width: 1023px) { .sc-slideover-panel { width: 100vw; } .sc-slideover-close { left: auto; right: .5rem; } }
/* Страница внутри панели: без меню, шапки и крошек — только заказ. */
.sc-embedded .fi-sidebar, .sc-embedded .fi-topbar, .sc-embedded .fi-sidebar-close-overlay, .sc-embedded .fi-breadcrumbs { display: none !important; }
.sc-embedded .fi-main-ctn { margin-inline-start: 0 !important; padding-inline-start: 0 !important; }
.sc-embedded .fi-main { padding-top: .5rem; }
.sc-order-bar-close { display: none; }
.sc-embedded .sc-order-bar-close { display: inline-flex; align-items: center; }