/* Тема Терминал: раскладка, плотность и всё нарисованное -- из макета v05 «Тёмный терминал», цвета -- из макета v10 «Диспетчер» (владелец 21.10.2026, LeeKonstantin). Только тёмная. Каждый селектор начинается с :root[data-theme=term] -- «Старая» тема не затронута (themes.test.js). Контраст (задача 6, 21.10.2026), все пары посчитаны по WCAG, текст везде >= 4.5:1: - текст #E6E9ED: 12.4 на фоне #22272D, 10.8 на панели #2B3138, 9.6 на #323942; - вторичный #9AA4AF: 6.0 на фоне, 5.2 на панели, 4.6 на #323942 -- на подсветке #3A424B (наведение) вторичным не пишем, при наведении текст становится основным; - оранжевый #FF7A1F текстом: 5.8 на фоне, 5.0 на панели, 4.7 на оранжевой подсветке выбранного пункта; на #323942 -- 4.48, поэтому оранжевым текстом на #323942 не пишем; - тёмный текст на оранжевой заливке (кнопки, выбранная организация, знак CREPE): #1D1206 -- 7.1; - зелёный #3DDC84 7.4 и жёлтый #F5C542 8.1 на панели -- как есть. Красный #FF5B4F текстом даёт 4.3 на панели, поэтому красный ТЕКСТ (--error) -- #FF7A70 (5.1 на панели, 4.6 на #323942), а #FF5B4F (--term-red) -- для заливок без текста (полоски, точки, рамки). */ :root[data-theme=term] { --bg: #22272D; --bg-elevated: #2B3138; --tile-bg: #323942; --fill: #323942; --separator: #424A53; --label: #E6E9ED; --label-secondary: #9AA4AF; --accent: #FF7A1F; --accent-fg: #1D1206; --error: #FF7A70; --warning: #F5C542; --positive: #3DDC84; /* Свои токены темы. surface -- фон, на котором стоит элемент (страница или панель): им закрашиваются липкие шапки таблиц. Внутри .card значения переопределяются. */ --term-panel: #2B3138; --term-raise: #323942; --term-hover: #3A424B; --term-line: #424A53; --term-grid: #353C44; --term-surface: #22272D; --term-sunk: #1E2227; --term-red: #FF5B4F; --term-amber-dim: rgba(255, 122, 31, 0.14); --term-amber-line: rgba(255, 122, 31, 0.45); --term-amber-hover: #FF8C3D; --term-amber-edge: #B4520F; --term-key-edge: #191D21; /* Зебра и наведение строк: наведение 3.5% белого -- вторичный текст и оранжевые ссылки на нём ещё >= 4.5:1 (на панели #32383F: 4.7 и 4.55; на фоне #2B3036: 5.2 и 5.1). */ --term-zebra: rgba(255, 255, 255, 0.02); --term-row-hover: rgba(255, 255, 255, 0.035); --term-side: 208px; --term-mono: "JetBrains Mono", "Pretendard Variable", Pretendard, ui-monospace, Menlo, monospace; --term-sans: "IBM Plex Sans Condensed", "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", sans-serif; color-scheme: dark; } :root[data-theme=term] body { font-family: var(--term-sans); font-size: 14px; line-height: 1.4; background: var(--bg); -webkit-font-smoothing: antialiased; } /* Корейский интерфейс: у Plex Condensed нет хангыля, Pretendard подставляется сам; этого достаточно. */ /* Тёмные значения компонентных правил style.css независимо от темы ОС. */ :root[data-theme=term] .mdc-table tbody tr.row-active td { background: rgba(10, 132, 255, 0.22); } :root[data-theme=term] .mdc-table tbody tr.row-active td:first-child { box-shadow: inset 3px 0 0 var(--accent); } :root[data-theme=term] .el-row-added td { --el-added-bg: rgba(255, 214, 10, 0.28); } :root[data-theme=term] .el-pick-row:hover td, :root[data-theme=term] .el-pick-row.active td { background: rgba(255, 255, 255, 0.14); } :root[data-theme=term] .el-pick-row.active td:first-child { box-shadow: inset 3px 0 0 var(--accent); } :root[data-theme=term] .el-tile:hover, :root[data-theme=term] .el-tile:focus-visible { background: rgba(255, 255, 255, 0.07); } :root[data-theme=term] .mf-pill.ok { color: #4cd964; } :root[data-theme=term] .mf-pill.warn { color: #ffcc66; } :root[data-theme=term] .mf-pending-head { color: #ffcc66; } :root[data-theme=term] .mf-print:hover { background: rgba(10, 132, 255, 0.22); } /* ...а дальше -- уже цвета Терминала поверх них (правила ниже по файлу сильнее). */ :root[data-theme=term] .mdc-table tbody tr.row-active td { background: var(--term-amber-dim); } :root[data-theme=term] .mf-print:hover { background: var(--term-hover); } :root[data-theme=term] .mf-pending-head { color: var(--warning); } /* --------------------------------------------------------------------------------------------- Панели. Раздел страницы (.card) -- плоская панель с тонкой рамкой, как .pnl в v05; заголовок раздела (h2 первым ребёнком) -- полоса шапки панели. Внутри панели свои значения токенов: подсветка строк и мелкие плашки -- на ступень светлее панели. */ :root[data-theme=term] .card { background: var(--term-panel); border: 1px solid var(--term-line); border-radius: 3px; padding: 12px 14px; margin: 10px 0; box-shadow: none; --term-surface: #2B3138; --bg-elevated: #323942; --tile-bg: #323942; } :root[data-theme=term] .card > h2:first-child, :root[data-theme=term] .card > .md-card-head:first-child { margin: -12px -14px 12px; padding: 0 14px; min-height: 32px; display: flex; align-items: center; gap: 12px; background: var(--term-raise); border-bottom: 1px solid var(--term-line); font-size: 14px; color: var(--label); letter-spacing: 0.01em; } :root[data-theme=term] .card > .md-card-head:first-child h2 { margin: 0; display: flex; align-items: center; gap: 12px; } /* Полоса шапки -- оранжевая черта слева, как цвет заголовков панелей в v05. */ :root[data-theme=term] .card > h2:first-child::before, :root[data-theme=term] .card > .md-card-head:first-child h2::before { content: ''; flex: none; width: 3px; height: 14px; background: var(--accent); } /* Плитки цифр: сетка с линиями 1px между ячейками (.kv в v05) -- плитки без зазоров, рамка общая. */ :root[data-theme=term] .stat-grid { gap: 1px; background: var(--term-line); border: 1px solid var(--term-line); border-radius: 3px; margin: 12px 0; overflow: hidden; } :root[data-theme=term] .stat-tile { background: var(--term-panel); border-radius: 0; padding: 8px 12px 10px; min-width: 0; container-type: inline-size; } :root[data-theme=term] .stat-tile .title { font-size: 12.5px; color: var(--label-secondary); } :root[data-theme=term] .stat-tile .value { font-family: var(--term-mono); font-size: clamp(15px, 9.5cqi, 21px); font-weight: 600; margin-top: 3px; color: var(--label); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; white-space: nowrap; } :root[data-theme=term] .md-kpi { background: var(--term-panel); border: 1px solid var(--term-line); border-radius: 3px; box-shadow: none; padding: 10px 14px; } :root[data-theme=term] .md-kpi-label { font-size: 12.5px; color: var(--label-secondary); } :root[data-theme=term] .md-kpi-value { font-family: var(--term-mono); font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; } /* Главная цифра страницы -- крупная моноширинная оранжевая, как 223 001 144 ₩ в v05. */ :root[data-theme=term] .md-kpi-hero .md-kpi-value { font-size: clamp(32px, 4.6vw, 52px); font-weight: 700; color: var(--accent); letter-spacing: -0.03em; } :root[data-theme=term] .md-meter { background: var(--term-sunk); border: 1px solid var(--term-line); border-radius: 0; } :root[data-theme=term] .md-meter-fill { border-radius: 0; background: repeating-linear-gradient(90deg, var(--accent) 0 3px, transparent 3px 5px); } :root[data-theme=term] .rating-segments .rating-seg { border-radius: 3px; border: 1px solid var(--term-line); background: var(--term-panel); } :root[data-theme=term] .rating-seg.active { border-color: var(--accent); background: var(--term-amber-dim); box-shadow: inset 0 2px 0 var(--accent); } /* --------------------------------------------------------------------------------------------- Типографика. Заголовок страницы -- строка команды: моноширинный, с оранжевым курсором-блоком (.cmd в v05). Заголовки разделов -- без капса, плотные. */ :root[data-theme=term] h1 { font-family: var(--term-mono); font-size: 20px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; color: var(--label); margin: 4px 0 10px; } :root[data-theme=term] h1::after { content: ''; display: inline-block; width: 0.42em; height: 0.95em; margin-left: 0.3em; vertical-align: -0.12em; background: var(--accent); } :root[data-theme=term] h2 { font-size: 14px; font-weight: 600; text-transform: none; letter-spacing: 0.01em; color: var(--label); margin: 18px 0 8px; } :root[data-theme=term] .subtitle, :root[data-theme=term] .chart-caption { color: var(--label-secondary); font-size: 13px; } :root[data-theme=term] details.md-upload > summary, :root[data-theme=term] details.stock-warehouses > summary { text-transform: none; letter-spacing: 0.01em; font-size: 14px; font-weight: 600; color: var(--label); } :root[data-theme=term] .group-header { font-size: 13px; font-weight: 600; color: var(--accent); letter-spacing: 0.01em; border-bottom: 1px solid var(--term-line); padding: 4px 0 3px; margin-top: 16px; } :root[data-theme=term] .admin-label { text-transform: none; letter-spacing: 0.01em; font-size: 12.5px; } :root[data-theme=term] .md-count { color: var(--label-secondary); font-family: var(--term-mono); font-size: 12px; } /* Числа: моноширинные с табличными цифрами -- ячейки .num, суммы строк, итоги. */ :root[data-theme=term] td.num, :root[data-theme=term] .num:not(th), :root[data-theme=term] .amount, :root[data-theme=term] .row .amount, :root[data-theme=term] .overdue-sum, :root[data-theme=term] .mf-row-total, :root[data-theme=term] .mf-sum-total, :root[data-theme=term] .tomorrow-sum, :root[data-theme=term] .tomorrow-total, :root[data-theme=term] .k-sum, :root[data-theme=term] .k-num, :root[data-theme=term] .el-num, :root[data-theme=term] .pl-num, :root[data-theme=term] .akt-total, :root[data-theme=term] .mdc-total, :root[data-theme=term] .sales-totals, :root[data-theme=term] .data-badge strong, :root[data-theme=term] .theme-fresh-text { font-family: var(--term-mono); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; } :root[data-theme=term] td.num, :root[data-theme=term] .row .amount { font-size: 0.94em; } /* --------------------------------------------------------------------------------------------- Основа элементов: слой ниже обычных правил -- кнопка или поле без своего класса получают вид Терминала, а любое правило style.css со своим оформлением (даже менее специфичное) сильнее. Кнопка -- «клавиша» v05: плоская, рамка 1px, нижний край темнее. */ @layer term-base { :root[data-theme=term] a { color: var(--accent); } :root[data-theme=term] button { border: 1px solid var(--term-line); border-bottom-color: var(--term-key-edge); border-radius: 2px; background: var(--term-raise); color: var(--label); font-family: inherit; font-weight: 600; font-size: 13px; padding: 5px 12px; } :root[data-theme=term] button:hover:not(:disabled) { background: var(--term-hover); } :root[data-theme=term] button:disabled { opacity: 0.45; cursor: default; } :root[data-theme=term] input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]):not([type=color]), :root[data-theme=term] select, :root[data-theme=term] textarea { border: 1px solid var(--term-line); border-radius: 2px; background: var(--term-sunk); color: var(--label); font-family: inherit; font-size: 14px; padding: 5px 8px; } } :root[data-theme=term] input[type=checkbox], :root[data-theme=term] input[type=radio] { accent-color: var(--accent); } :root[data-theme=term] ::placeholder { color: #8A939D; opacity: 1; } :root[data-theme=term] :focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; } :root[data-theme=term] ::selection { background: rgba(255, 122, 31, 0.35); color: #FFFFFF; } /* Поля со своим оформлением в style.css: утоплены (темнее панели), рамка 1px, фокус -- оранжевая. */ :root[data-theme=term] .md-search, :root[data-theme=term] .period-field input, :root[data-theme=term] .period-field select, :root[data-theme=term] .search-field input, :root[data-theme=term] .overdue-bar-row input[type="search"], :root[data-theme=term] .md-header select, :root[data-theme=term] .field input, :root[data-theme=term] .field select, :root[data-theme=term] .field textarea, :root[data-theme=term] .admin-create input, :root[data-theme=term] .admin-link input, :root[data-theme=term] .notes-form textarea, :root[data-theme=term] .mdc-input, :root[data-theme=term] .el-date, :root[data-theme=term] .el-search, :root[data-theme=term] .el-select, :root[data-theme=term] .cm-switch #search, :root[data-theme=term] .cm-filters select, :root[data-theme=term] .pm-select, :root[data-theme=term] .mf-price-select { border: 1px solid var(--term-line); border-radius: 2px; background-color: var(--term-sunk); color: var(--label); } :root[data-theme=term] input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]):not([type=color]):focus, :root[data-theme=term] select:focus, :root[data-theme=term] textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); } :root[data-theme=term] select { -webkit-appearance: none; appearance: none; padding-right: 28px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='%23FF7A1F'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 9px 6px; } /* Поиск страницы -- командная строка v05: моноширинный ввод в оранжевой рамке. */ :root[data-theme=term] #search, :root[data-theme=term] .md-search { min-height: 34px; padding: 6px 10px; font-family: var(--term-mono); font-size: 13.5px; border-color: var(--term-amber-line); } :root[data-theme=term] .drop-zone { border: 1px dashed var(--term-line); border-radius: 2px; color: var(--label-secondary); background: var(--term-sunk); padding: 18px; } :root[data-theme=term] .drop-zone.drag-over { border-color: var(--accent); background: var(--term-amber-dim); color: var(--label); } :root[data-theme=term] .file-input-label { color: var(--accent); font-weight: 600; } :root[data-theme=term] .checkbox-label { color: var(--label); font-size: 13.5px; gap: 8px; } :root[data-theme=term] .checkbox-label input[type="checkbox"] { width: 15px; height: 15px; } /* --------------------------------------------------------------------------------------------- Кнопки, три вида. Главная -- оранжевая заливка с тёмным текстом (.key.amber); обычная -- «клавиша» с рамкой; опасная -- красный текст и красная рамка. */ :root[data-theme=term] .send-btn, :root[data-theme=term] .admin-create button, :root[data-theme=term] .notes-form button, :root[data-theme=term] .pl-actions .pl-primary, :root[data-theme=term] .k-print.queued { background: var(--accent); color: var(--accent-fg); border: 1px solid var(--accent); border-bottom-color: var(--term-amber-edge); border-radius: 2px; font-weight: 600; } :root[data-theme=term] .send-btn:hover:not(:disabled), :root[data-theme=term] .admin-create button:hover:not(:disabled), :root[data-theme=term] .notes-form button:hover:not(:disabled), :root[data-theme=term] .pl-actions .pl-primary:hover:not(:disabled) { background: var(--term-amber-hover); } :root[data-theme=term] .send-btn { font-size: 15px; padding: 9px 18px; } :root[data-theme=term] .send-btn:disabled { background: var(--term-raise); color: var(--label-secondary); border-color: var(--term-line); opacity: 1; } :root[data-theme=term] .refresh-btn, :root[data-theme=term] .form-actions button, :root[data-theme=term] .assortment-download, :root[data-theme=term] .assortment-head button, :root[data-theme=term] .map-buttons button, :root[data-theme=term] .pl-upload button, :root[data-theme=term] .pl-render button, :root[data-theme=term] .pl-actions button, :root[data-theme=term] .pl-button, :root[data-theme=term] .pl-banner button, :root[data-theme=term] .overdue-remind, :root[data-theme=term] .r1c-btn, :root[data-theme=term] .restore-btn { border: 1px solid var(--term-line); border-bottom-color: var(--term-key-edge); border-radius: 2px; background: var(--term-raise); color: var(--label); font-weight: 600; } :root[data-theme=term] .refresh-btn:hover:not(:disabled), :root[data-theme=term] .form-actions button:hover:not(:disabled), :root[data-theme=term] .assortment-download:hover:not(:disabled), :root[data-theme=term] .assortment-head button:hover:not(:disabled), :root[data-theme=term] .map-buttons button:hover:not(:disabled), :root[data-theme=term] .pl-upload button:hover:not(:disabled), :root[data-theme=term] .pl-render button:hover:not(:disabled), :root[data-theme=term] .pl-actions button:hover:not(:disabled), :root[data-theme=term] .pl-button:hover:not(:disabled), :root[data-theme=term] .pl-banner button:hover:not(:disabled), :root[data-theme=term] .overdue-remind:hover:not(:disabled), :root[data-theme=term] .r1c-btn:hover:not(:disabled) { background: var(--term-hover); } :root[data-theme=term] .refresh-btn { font-size: 12.5px; padding: 4px 10px; } :root[data-theme=term] .r1c-btn { font-size: 13px; padding: 5px 12px; min-height: 30px; border-color: var(--term-amber-line); } :root[data-theme=term] .refresh-btn.danger { color: var(--error); border-color: rgba(255, 91, 79, 0.55); background: transparent; } :root[data-theme=term] .refresh-btn.danger:hover:not(:disabled) { background: rgba(255, 91, 79, 0.12); } :root[data-theme=term] .restore-btn { color: var(--warning); border-color: rgba(245, 197, 66, 0.5); background: transparent; } :root[data-theme=term] .doc-close { background: var(--term-raise); border-radius: 2px; } /* Чипы-фильтры: «клавиши» в ряд; выбранный -- оранжевая заливка с тёмным текстом (.seg .on в v05). */ :root[data-theme=term] .md-week, :root[data-theme=term] .overdue-dir, :root[data-theme=term] .pl-tool, :root[data-theme=term] .m-org, :root[data-theme=term] .tomorrow-day, :root[data-theme=term] .suggestions button { border: 1px solid var(--term-line); border-radius: 2px; background: var(--term-panel); color: var(--label-secondary); font-weight: 600; } :root[data-theme=term] .md-week:hover, :root[data-theme=term] .overdue-dir:hover, :root[data-theme=term] .pl-tool:hover, :root[data-theme=term] .m-org:hover, :root[data-theme=term] .tomorrow-day:hover, :root[data-theme=term] .suggestions button:hover { background: var(--term-hover); color: var(--label); } :root[data-theme=term] .md-week.active, :root[data-theme=term] .overdue-dir.active, :root[data-theme=term] .pl-tool.active, :root[data-theme=term] .m-org.active, :root[data-theme=term] .tomorrow-day.selected, :root[data-theme=term] .suggestions button.selected { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); } /* «Накладные на завтра», рейс (21.10.2026): утопленная полоса (#1E2227) моноширинными прописными с оранжевым «▸» над панелями направлений -- как рейс в «Заказах Мегафуд». Текст 13.6:1, вторичный 6.7:1, «▸» 6.4:1. */ :root[data-theme=term] .tomorrow-trip { align-items: center; margin: 14px 0 6px; padding: 4px 10px; min-height: 30px; border: 1px solid var(--term-line); border-radius: 3px; background: var(--term-sunk); } :root[data-theme=term] .tomorrow-trip:first-child { margin-top: 8px; } :root[data-theme=term] .tomorrow-trip h2 { margin: 0; padding: 0; border: 0; font: 600 13.5px/1.3 var(--term-mono); letter-spacing: 0.04em; text-transform: uppercase; color: var(--label); } :root[data-theme=term] .tomorrow-trip h2::before { content: '▸ '; color: var(--accent); } :root[data-theme=term] .tomorrow-trip .md-count { font: 400 12.5px var(--term-mono); color: var(--label-secondary); } :root[data-theme=term] .md-week, :root[data-theme=term] .overdue-dir { padding: 4px 10px; font-size: 13px; } /* Сегменты (Заказы, Клиенты): кнопки вплотную в общей рамке, выбранный -- оранжевый. */ :root[data-theme=term] .mf-seg { background: transparent; border: 1px solid var(--term-line); border-radius: 2px; padding: 0; gap: 0; } :root[data-theme=term] .mf-seg button { border: 0; border-right: 1px solid var(--term-line); border-radius: 0; background: transparent; color: var(--label); font-weight: 500; } :root[data-theme=term] .mf-seg button:last-child { border-right: 0; } :root[data-theme=term] .mf-seg button:hover:not(.active) { background: var(--term-hover); color: var(--label); } :root[data-theme=term] .mf-seg button.active { background: var(--accent); color: var(--accent-fg); font-weight: 600; box-shadow: none; } /* Метки статусов: квадратная точка + цветной текст, без плашки (статус «● проведён» в v05). */ :root[data-theme=term] .admin-badge, :root[data-theme=term] .mf-pill { border-radius: 2px; font-weight: 600; font-size: 12px; padding: 1px 6px; background: transparent; border: 1px solid var(--term-line); color: var(--label-secondary); } :root[data-theme=term] .admin-badge.trusted, :root[data-theme=term] .mf-pill.ok { color: var(--positive); border-color: rgba(61, 220, 132, 0.4); } :root[data-theme=term] .admin-badge.off, :root[data-theme=term] .mf-pill.err { color: var(--error); border-color: rgba(255, 91, 79, 0.5); } :root[data-theme=term] .mf-pill.warn { color: var(--warning); border-color: rgba(245, 197, 66, 0.45); } :root[data-theme=term] .admin-badge.trusted::before, :root[data-theme=term] .mf-pill.ok::before, :root[data-theme=term] .mf-pill.warn::before, :root[data-theme=term] .mf-pill.err::before, :root[data-theme=term] .admin-badge.off::before { content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 5px; vertical-align: 1px; background: currentColor; } :root[data-theme=term] .rating-grade { border-radius: 2px; padding: 1px 7px; font-family: var(--term-mono); font-size: 12.5px; font-weight: 700; } :root[data-theme=term] .rating-grade-A { background: transparent; color: var(--positive); border: 1px solid rgba(61, 220, 132, 0.5); } :root[data-theme=term] .rating-grade-B { background: transparent; color: var(--accent); border: 1px solid var(--term-amber-line); } :root[data-theme=term] .rating-grade-C { background: transparent; color: var(--warning); border: 1px solid rgba(245, 197, 66, 0.5); } :root[data-theme=term] .rating-grade-D { background: transparent; color: var(--error); border: 1px solid rgba(255, 91, 79, 0.55); } :root[data-theme=term] .data-badges { gap: 6px; } :root[data-theme=term] .data-badge { background: var(--term-sunk); border: 1px solid var(--term-line); border-radius: 2px; padding: 5px 10px; font-size: 12.5px; color: var(--label-secondary); } :root[data-theme=term] .data-badge strong { color: var(--label); font-weight: 600; } :root[data-theme=term] .chip { background: var(--term-amber-dim); color: var(--label); border: 1px solid var(--term-amber-line); border-radius: 2px; } :root[data-theme=term] .admin-credentials code { background: var(--term-sunk); border: 1px solid var(--term-line); border-radius: 2px; font-family: var(--term-mono); } /* --------------------------------------------------------------------------------------------- Таблицы (.t в v05): без подложки, шапка -- мелкая вторичная над линией, строки плотные, тонкая сетка и зебра на ступень светлее, числа моноширинные. */ :root[data-theme=term] table { background: transparent; border-radius: 0; margin-top: 8px; font-size: 13.5px; } /* Плотность v05: строка ~21px (13px x 1.3 + 2+2 + линия). */ :root[data-theme=term] th, :root[data-theme=term] td { padding: 2px 8px; line-height: 1.3; font-size: 13px; border-bottom: 1px solid var(--term-grid); } :root[data-theme=term] th { font-weight: 500; font-size: 12.5px; color: var(--label-secondary); border-bottom-color: var(--term-line); white-space: nowrap; } :root[data-theme=term] td { font-variant-numeric: tabular-nums; } :root[data-theme=term] tbody tr:nth-child(2n) td { background: var(--term-zebra); } :root[data-theme=term] tbody tr:hover td { background: var(--term-row-hover); } :root[data-theme=term] tfoot td { border-top: 1px solid var(--accent); font-weight: 700; color: var(--label); } :root[data-theme=term] .stock-table thead th, :root[data-theme=term] #clients-table thead th, :root[data-theme=term] #cm-table thead th, :root[data-theme=term] .rating-table thead th, :root[data-theme=term] .sales-table thead th, :root[data-theme=term] .overdue-table thead th, :root[data-theme=term] #products-table thead th, :root[data-theme=term] .pl-table thead th, :root[data-theme=term] .el-pick-table th { background: var(--term-surface); } :root[data-theme=term] .md-table tbody tr:hover td, :root[data-theme=term] #clients-table tbody tr:hover td { background: var(--term-row-hover); } /* Списки (Долги): плотные строки с сеткой, сумма моноширинная, выбранная -- оранжевая подсветка с полосой слева (выбранный пункт меню v05). */ :root[data-theme=term] .list { border-top: 1px solid var(--term-line); } :root[data-theme=term] .list .row { border-bottom: 1px solid var(--term-grid); padding: 6px 10px; gap: 12px; } :root[data-theme=term] .list .row:nth-child(2n) { background: var(--term-zebra); } :root[data-theme=term] .list .row:hover { background: var(--term-row-hover); } :root[data-theme=term] .list .row.checked { background: var(--term-amber-dim); box-shadow: inset 2px 0 0 var(--accent); } :root[data-theme=term] .row .name { font-size: 14.5px; font-weight: 600; color: var(--label); } :root[data-theme=term] .row-details { gap: 0; } :root[data-theme=term] .row-details .detail { font-size: 12.5px; } :root[data-theme=term] .row .amount { font-weight: 600; font-size: 14px; } :root[data-theme=term] .row input[type="checkbox"] { width: 17px; height: 17px; } :root[data-theme=term] .send-report-head { color: var(--label); font-weight: 600; } :root[data-theme=term] .send-report { color: var(--label-secondary); } /* details с карточкой (Админка): панель с рамкой. */ :root[data-theme=term] .admin-user { border: 1px solid var(--term-line); border-radius: 2px; background: var(--term-raise); padding: 10px 12px; } :root[data-theme=term] .admin-blocks { background: var(--term-sunk); border: 1px solid var(--term-grid); border-radius: 2px; } :root[data-theme=term] .admin-user-login { font-family: var(--term-mono); font-size: 14.5px; } :root[data-theme=term] details.admin-setting { border-top-color: var(--term-line); } /* Журнал заказов: плотные строки на панели (полный макет -- задача 8). */ :root[data-theme=term] .mf-rows { background: var(--term-panel); border: 1px solid var(--term-line); border-radius: 2px; box-shadow: none; } :root[data-theme=term] .mf-row { border-bottom-color: var(--term-grid); } :root[data-theme=term] .mf-row:hover, :root[data-theme=term] .mf-row:focus-visible { background: var(--term-row-hover); } /* Переключатели (Админка, склады): выключенный -- серая дорожка, включённый -- оранжевый. */ :root[data-theme=term] .stock-switch { background: #4A525C; } :root[data-theme=term] .stock-switch:checked { background: var(--accent); } /* Закреплённые снизу панели («Поставить в очередь…»): цвет фона и линии темы. */ :root[data-theme=term] .send-foot, :root[data-theme=term] .mdi-pick-foot { background: var(--term-panel); border-top: 1px solid var(--accent); } :root[data-theme=term] .send-foot .summary { color: var(--label-secondary); font-size: 13px; font-family: var(--term-mono); } /* --------------------------------------------------------------------------------------------- Каркас (app.js buildThemeShell), раскладка экрана v05 на ПК: строка 1 (32px) -- знак CREPE на оранжевом, справа свежесть данных 1С с зелёной точкой, снизу оранжевая линия 2px (лента v10); строка 2 (30px) -- ряд организаций как ряд F-клавиш: «Мегафуд Alt+2»; слева -- плотное меню всех групп с заголовками и счётчиками, справа -- страница; внизу (22px, закреплена) -- строка состояния с подсказкой клавиш. Меню в Терминале показывает ВСЕ группы (как в v05): .theme-off ничего не прячет, а гасит заголовок невыбранной группы; выбранная организация -- оранжевый заголовок, и app.js прокручивает меню к ней. Телефон: ☰ и выезжающее меню всех групп, ряд организаций прокручивается; подписи клавиш на телефоне не нужны (нет клавиатуры) и скрыты. */ :root[data-theme=term] .theme-mode { display: none; } :root[data-theme=term] .theme-top[hidden], :root[data-theme=term] .theme-fresh[hidden] { display: none; } :root[data-theme=term] .theme-top { display: flex; align-items: center; gap: 12px; min-width: 0; } :root[data-theme=term] .theme-fresh { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; white-space: nowrap; font-size: 12.5px; color: var(--label-secondary); } :root[data-theme=term] .theme-fresh::before { content: ''; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--positive); box-shadow: 0 0 0 3px rgba(61, 220, 132, 0.18); } :root[data-theme=term] .theme-fresh-text { color: var(--label); font-size: 12px; overflow: hidden; text-overflow: ellipsis; } :root[data-theme=term] .theme-fresh-label { flex: none; } /* Ряд организаций -- F-клавиши v05. */ :root[data-theme=term] nav.theme-orgs { display: flex; gap: 3px; overflow-x: auto; scrollbar-width: none; margin: 0 0 10px; padding: 0; } :root[data-theme=term] nav.theme-orgs::-webkit-scrollbar { display: none; } :root[data-theme=term] .theme-org { flex: none; display: inline-flex; align-items: center; gap: 7px; padding: 0 11px; height: 26px; min-height: 0; border: 1px solid var(--term-line); border-bottom-color: var(--term-key-edge); border-radius: 2px; background: var(--term-panel); color: var(--label); font: inherit; font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer; } :root[data-theme=term] .theme-org:hover { background: var(--term-hover); } /* На подсветке #3A424B вторичный даёт 4.0 -- подпись клавиши становится основным цветом. */ :root[data-theme=term] .theme-org:hover .theme-key { color: var(--label); } :root[data-theme=term] .theme-org.active { background: var(--accent); border-color: var(--accent); color: var(--accent-fg); font-weight: 600; } /* Подпись клавиши -- первой, как «F2 Мегафуд»; цвет -- вторичный (оранжевый мелкий на панели не проходит 4.5). */ :root[data-theme=term] .theme-key { order: -1; font-family: var(--term-mono); font-size: 11px; font-weight: 600; color: var(--label-secondary); letter-spacing: 0; } :root[data-theme=term] .theme-org.active .theme-key { color: var(--accent-fg); } /* Строка состояния (v05): клавиша в рамке, рядом -- что делает. */ :root[data-theme=term] .theme-keys { display: flex; align-items: center; gap: 6px; margin-top: 24px; font-family: var(--term-mono); font-size: 11.5px; color: var(--label-secondary); } :root[data-theme=term] .theme-keys kbd { font: 600 11px/1 var(--term-mono); color: var(--label); background: var(--term-raise); border: 1px solid var(--term-line); border-bottom-color: var(--term-key-edge); border-radius: 2px; padding: 2px 5px; } :root[data-theme=term] .theme-keys span { margin-right: 14px; } /* Меню: группы с заголовком (оранжевый, счётчик справа), пункты плотные. */ :root[data-theme=term] #sidebar { background: var(--bg); border-right: 1px solid var(--term-line); gap: 0; padding: 6px 0 12px; } :root[data-theme=term] #sidebar a { display: block; padding: 1px 12px 1px 20px; border-radius: 0; font-size: 13px; line-height: 17px; color: var(--label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* Меню выше экрана прокручивается само: пункты не сжимаются flex-ом до нуля. */ :root[data-theme=term] #sidebar > * { flex: none; } :root[data-theme=term] #sidebar a:hover { background: var(--term-panel); color: var(--label); } :root[data-theme=term] #sidebar a.active { background: var(--term-amber-dim); color: var(--accent); font-weight: 600; box-shadow: inset 2px 0 0 var(--accent); } :root[data-theme=term] #sidebar a[hidden], :root[data-theme=term] #sidebar .nav-group > a[hidden] { display: none; } :root[data-theme=term] #sidebar > a[data-group="overview"] { padding-left: 12px; font-weight: 600; } :root[data-theme=term] #sidebar .nav-group { margin: 4px 0 0; padding-top: 2px; border-top: 1px solid var(--term-grid); } :root[data-theme=term] #sidebar .nav-group > a { margin-top: 0; } :root[data-theme=term] #sidebar .nav-group > summary { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 5px 12px 2px; border-radius: 0; font-size: 12.5px; font-weight: 600; letter-spacing: 0.01em; text-transform: none; color: var(--accent); } :root[data-theme=term] #sidebar .nav-group > summary:hover { background: transparent; color: var(--label); } :root[data-theme=term] #sidebar .nav-group > summary::after { content: attr(data-count); float: none; order: 2; font-family: var(--term-mono); font-size: 11px; font-weight: 400; color: var(--label-secondary); } :root[data-theme=term] #sidebar .nav-group:not([open]) > summary::after { content: '+'; } /* Невыбранная организация: заголовок вторичным цветом -- выбранная видна оранжевой. */ :root[data-theme=term] #sidebar details.theme-off > summary { color: var(--label-secondary); } :root[data-theme=term] #sidebar details.theme-off > summary:hover { color: var(--label); } :root[data-theme=term] #sidebar[data-grouped] > a[data-action="logout"] { margin-top: 10px; border-top: 1px solid var(--term-grid); padding-top: 8px; padding-left: 12px; color: var(--label-secondary); } @media (min-width: 768px) { /* Две полосы над страницей: лента (32px) и ряд организаций (30px). Полосы -- фон body, элементы каркаса поставлены поверх абсолютно (они живут внутри .page-content). */ :root[data-theme=term] body { position: relative; padding-top: 64px; background: linear-gradient(var(--accent), var(--accent)) 0 32px / 100% 2px no-repeat, linear-gradient(var(--term-panel), var(--term-panel)) 0 0 / 100% 32px no-repeat, linear-gradient(var(--term-line), var(--term-line)) 0 63px / 100% 1px no-repeat, var(--bg); } /* Знак CREPE (бренд, не переводится). */ :root[data-theme=term] body::before { content: 'CREPE'; position: absolute; top: 0; left: 0; width: var(--term-side); height: 32px; display: flex; align-items: center; padding: 0 14px; background: var(--accent); color: var(--accent-fg); font: 800 15px/1 var(--term-mono); letter-spacing: 0.08em; } :root[data-theme=term] .theme-top { position: absolute; top: 0; right: 0; height: 32px; max-width: calc(100% - var(--term-side) - 24px); padding: 0 14px; border-left: 1px solid var(--term-line); } :root[data-theme=term] nav.theme-orgs { position: absolute; top: 34px; left: 0; right: 0; height: 29px; align-items: center; padding: 0 6px; margin: 0; } :root[data-theme=term] #sidebar { flex: 0 0 var(--term-side); width: var(--term-side); height: 100vh; min-height: 0; overflow-y: auto; /* Меню высотой в окно, но сверху над ним две полосы (64px), снизу строка состояния (22px): запас снизу, чтобы прокруткой меню доставался и последний пункт. */ padding-bottom: 100px; scrollbar-width: thin; scrollbar-color: var(--term-line) transparent; } :root[data-theme=term] .page-content { max-width: 1180px; margin: 0; padding: 12px 18px 48px; } :root[data-theme=term] .page-content.page-wide { max-width: none; } :root[data-theme=term] .page-content.map-page { max-width: 1400px; } :root[data-theme=term] .theme-keys { position: fixed; left: 0; right: 0; bottom: 0; z-index: 15; height: 22px; margin: 0; padding: 0 12px; background: var(--term-panel); border-top: 1px solid var(--term-line); } /* Закреплённые снизу панели -- над строкой состояния и правее меню новой ширины. */ :root[data-theme=term] .send-foot, :root[data-theme=term] .mdi-pick-foot, :root[data-theme=term] .vg-bottom-bar { left: var(--term-side); bottom: 22px; } } @media (max-width: 767px) { /* ☰ и строка свежести -- в одну линию; оранжевая лента сверху -- знак темы. */ :root[data-theme=term] body { border-top: 2px solid var(--accent); } :root[data-theme=term] .nav-toggle { border: 1px solid var(--term-line); border-radius: 2px; background: var(--term-panel); color: var(--accent); box-shadow: none; font-size: 18px; } :root[data-theme=term] .page-content { padding-top: 0; } :root[data-theme=term] .theme-top { margin: -44px 0 10px 56px; min-height: 44px; } :root[data-theme=term] .theme-top[hidden] + nav.theme-orgs { margin-top: 10px; } :root[data-theme=term] nav.theme-orgs { margin: 0 -16px 12px; padding: 0 16px; -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent); } :root[data-theme=term] .theme-org { height: 34px; padding: 0 12px; } :root[data-theme=term] .theme-key, :root[data-theme=term] .theme-keys { display: none; } :root[data-theme=term] h1 { font-size: 18px; } :root[data-theme=term] .card { padding: 10px 10px; margin: 8px 0; } :root[data-theme=term] .card > h2:first-child { margin: -10px -10px 10px; padding: 0 10px; } :root[data-theme=term] .list .row { padding: 8px 6px; } /* Выезжающее меню: все группы, пункты 40px под палец, но в стиле меню v05. */ :root[data-theme=term] #sidebar { background: var(--bg); border-right: 1px solid var(--term-line); padding: 8px 0 calc(20px + env(safe-area-inset-bottom)); } :root[data-theme=term] #sidebar a { min-height: 40px; padding: 10px 14px 10px 22px; font-size: 15px; line-height: 20px; } :root[data-theme=term] #sidebar > a[data-group="overview"] { padding-left: 14px; } :root[data-theme=term] #sidebar .nav-group > summary { padding: 10px 14px 4px; font-size: 13px; } :root[data-theme=term] #sidebar.open { box-shadow: 2px 0 24px rgba(0, 0, 0, 0.6); } } /* --------------------------------------------------------------------------------------------- Дашборд (задача 7): раскладка и всё нарисованное -- v05 стр. 1, цвета -- v10. Сетка на ПК: [главная цифра 392px][график продаж с линией возвратов ] [таблица направлений с полосками и долями ][рейсы сеткой, сводка недели] [ ][где больше всего возвратов ] ниже -- свёрнутые панели блоков вне макета (тренды по товару/региону, ассортимент). Новая разметка стоит в dashboard.html с hidden -- её показывают только эти правила. */ :root[data-theme=term] .page-content.dash-page { max-width: none; } :root[data-theme=term] .dash-page > h1, :root[data-theme=term] .dash-page > .subtitle, :root[data-theme=term] .dash .stat-grid, :root[data-theme=term] .dash-range, :root[data-theme=term] .dash .card > h2:first-child, :root[data-theme=term] .dash-trend > .period-field, :root[data-theme=term] .dash-trend > .chart-pair, :root[data-theme=term] .dash-trend > .dash-note, :root[data-theme=term] .dash-trips > .trips-grid, :root[data-theme=term] .dash > .dash-dirs { display: none; } /* Организация и период -- справа в ряду F-клавиш (как «Организация Мегафуд ▾ | Период ▸ …» в v05). */ :root[data-theme=term] .dash-filters { display: flex; align-items: center; gap: 0; margin: 0 0 8px; } :root[data-theme=term] .dash-filters label { display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; font-size: 12.5px; color: var(--label-secondary); border-left: 1px solid var(--term-line); } :root[data-theme=term] .dash-filters label:first-child { border-left: 0; padding-left: 0; } :root[data-theme=term] .dash-filters select { min-height: 0; height: 23px; padding: 0 24px 0 7px; font-family: var(--term-mono); font-size: 12.5px; font-weight: 600; color: var(--accent); background-color: var(--term-sunk); background-position: right 7px center; } /* «Обновить из 1С» -- клавиша в ленте сверху, как в v05. */ :root[data-theme=term] .dash-page .r1c { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 8px; } :root[data-theme=term] .dash-page .r1c-note { font-family: var(--term-mono); font-size: 11.5px; color: var(--label-secondary); } /* Устаревшее «Обновлено в ЧЧ:ММ» (время последней ручной выгрузки) -- в Терминале одна свежесть: строка 1С в ленте. */ :root[data-theme=term] .r1c-note.r1c-done { display: none; } /* Организация/период на ряду F-клавиш -- только там, где хватает места обоим (ряд клавиш ~920px + панель ~500px); уже -- панель под рядом, как на 1024. Ряд клавиш оставляет панели свой край и прокручивается внутри себя, наезда нет ни на какой ширине. */ @media (min-width: 1600px) { :root[data-theme=term] .dash-filters { position: absolute; top: 34px; right: 6px; height: 29px; margin: 0; z-index: 2; } :root[data-theme=term] body:has(.dash-filters) nav.theme-orgs { right: 520px; } } @media (min-width: 768px) { :root[data-theme=term] .page-content.dash-page { padding-top: 6px; } :root[data-theme=term] .dash-page .r1c { position: absolute; top: 0; right: 8px; height: 32px; margin: 0; flex-direction: row-reverse; z-index: 2; } :root[data-theme=term] .dash-page .r1c-btn { min-height: 0; height: 24px; padding: 0 12px; font-size: 12.5px; background: var(--accent); color: var(--accent-fg); border-color: var(--accent); border-bottom-color: var(--term-amber-edge); } :root[data-theme=term] .dash-page .r1c-btn:hover:not(:disabled) { background: var(--term-amber-hover); } :root[data-theme=term] .dash-page .r1c-note { color: var(--label); } } /* Сетка. */ :root[data-theme=term] .dash { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; } :root[data-theme=term] .dash > * { margin: 0; min-width: 0; } :root[data-theme=term] .dash > .dash-fold[data-block="dashboard.breakdown"] { order: 1; } :root[data-theme=term] .dash > .dash-fold[data-block="dashboard.trips"] { order: 2; } :root[data-theme=term] .dash > .dash-returns { order: 3; } :root[data-theme=term] .dash > .dash-fold[data-block="dashboard.product-trend"] { order: 4; } :root[data-theme=term] .dash > .dash-fold[data-block="dashboard.region-trend"] { order: 5; } :root[data-theme=term] .dash > .dash-fold[data-block="dashboard.assortment"] { order: 6; } @media (min-width: 1280px) { :root[data-theme=term] .dash { grid-template-columns: 392px minmax(0, 1fr) minmax(484px, 0.68fr); grid-template-rows: auto auto 1fr; } :root[data-theme=term] .dash > * { grid-column: 1 / -1; } :root[data-theme=term] .dash > .dash-hero { grid-row: 1; grid-column: 1; } :root[data-theme=term] .dash > .dash-trend { grid-row: 1; grid-column: 2 / 4; } :root[data-theme=term] .dash > .dash-fold[data-block="dashboard.breakdown"] { grid-row: 2 / 4; grid-column: 1 / 3; } :root[data-theme=term] .dash > .dash-fold[data-block="dashboard.trips"] { grid-row: 2; grid-column: 3; } :root[data-theme=term] .dash > .dash-returns { grid-row: 3; grid-column: 3; align-self: start; } } /* Панель и её шапка (.pnl/.ph в v05): название основным цветом с оранжевой чертой, рядом -- вторичное. */ :root[data-theme=term] .dash-hero[hidden], :root[data-theme=term] .dash-returns[hidden] { display: block; } :root[data-theme=term] .dash-hero, :root[data-theme=term] .dash > .card, :root[data-theme=term] .dash-fold { background: var(--term-panel); border: 1px solid var(--term-line); border-radius: 3px; padding: 0; overflow: hidden; --term-surface: #2B3138; --bg-elevated: #323942; --tile-bg: #323942; } :root[data-theme=term] .dash-fold > .card { border: 0; border-radius: 0; margin: 0; padding: 0 0 8px; background: transparent; } :root[data-theme=term] .dash .dash-head, :root[data-theme=term] .dash .dash-head[hidden] { display: flex; align-items: center; gap: 12px; min-height: 28px; padding: 0 10px; margin: 0; background: var(--term-raise); border-bottom: 1px solid var(--term-line); white-space: nowrap; overflow: hidden; } :root[data-theme=term] .dash-head-title { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--label); } :root[data-theme=term] .dash-head-title::before { content: ''; flex: none; width: 3px; height: 13px; background: var(--accent); } :root[data-theme=term] .dash-head-sub { font-size: 12px; color: var(--label-secondary); overflow: hidden; text-overflow: ellipsis; } /* Главная цифра: моноширинная оранжевая, сравнения, темп месяца, сетка показателей (.kv). */ :root[data-theme=term] .dash-big { padding: 14px 12px 6px; font: 700 clamp(36px, 3.7vw, 52px)/1 var(--term-mono); letter-spacing: -0.03em; color: var(--accent); white-space: nowrap; font-variant-numeric: tabular-nums; } :root[data-theme=term] .dash-big-cur { font-size: 0.55em; font-weight: 500; } :root[data-theme=term] .dash-deltas { display: flex; flex-direction: column; gap: 2px; padding: 2px 12px 0; font: 12.5px/1.45 var(--term-mono); color: var(--label-secondary); } :root[data-theme=term] .dash-delta-pct { font-weight: 600; } :root[data-theme=term] .dash-delta.down .dash-delta-pct { color: var(--error); } :root[data-theme=term] .dash-delta.up .dash-delta-pct { color: var(--positive); } :root[data-theme=term] .dash-delta-was { color: var(--label); } :root[data-theme=term] .dash-progress[hidden] { display: none; } :root[data-theme=term] .dash-progress { display: flex; align-items: center; gap: 10px; margin: 10px 12px 2px; } :root[data-theme=term] .dash-progress-bar { flex: 1; height: 12px; background: var(--term-sunk); border: 1px solid var(--term-line); position: relative; } :root[data-theme=term] .dash-progress-fill { position: absolute; inset: 0 auto 0 0; background: repeating-linear-gradient(90deg, var(--accent) 0 3px, transparent 3px 5px); } :root[data-theme=term] .dash-progress-text { font: 11.5px var(--term-mono); color: var(--label-secondary); white-space: nowrap; } :root[data-theme=term] .dash-kpis { display: grid; grid-template-columns: 1fr 1fr; margin: 10px 0 0; border-top: 1px solid var(--term-line); } :root[data-theme=term] .dash-kpi { padding: 6px 12px 7px; border-right: 1px solid var(--term-line); border-bottom: 1px solid var(--term-line); } :root[data-theme=term] .dash-kpi:nth-child(2n) { border-right: 0; } :root[data-theme=term] .dash-kpi:nth-child(n+3) { border-bottom: 0; } :root[data-theme=term] .dash-kpi dt { font-size: 12px; color: var(--label-secondary); } :root[data-theme=term] .dash-kpi dd { margin: 1px 0 0; font: 600 19px/1.3 var(--term-mono); color: var(--label); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; white-space: nowrap; } :root[data-theme=term] .dash-kpi dd.dash-neg { color: var(--error); } /* График: столбики продаж (лев. ось) и линия возвратов (прав. ось) на одном поле. */ :root[data-theme=term] .dash-legend { display: inline-flex; gap: 12px; font-size: 12px; color: var(--label); } :root[data-theme=term] .dash-legend-item { display: inline-flex; align-items: center; gap: 6px; } :root[data-theme=term] .dash-key-bar { width: 9px; height: 9px; background: var(--accent); } :root[data-theme=term] .dash-key-line { width: 12px; height: 2px; background: var(--term-red); } :root[data-theme=term] .dash-gran { margin-left: auto; display: inline-flex; border: 1px solid var(--term-line); } :root[data-theme=term] .dash-gran button { border: 0; border-right: 1px solid var(--term-line); border-radius: 0; background: transparent; color: var(--label); font-size: 12px; font-weight: 500; padding: 0 9px; height: 20px; line-height: 20px; } :root[data-theme=term] .dash-gran button:last-child { border-right: 0; } :root[data-theme=term] .dash-gran button:hover:not(:disabled) { background: var(--term-hover); } :root[data-theme=term] .dash-gran button[aria-pressed="true"] { background: var(--accent); color: var(--accent-fg); font-weight: 600; } :root[data-theme=term] .dash-chart[hidden] { display: block; position: relative; height: 232px; margin: 8px 6px 6px; } :root[data-theme=term] .dash-chart { font-family: var(--term-mono); --dash-tick-size: 11; --dash-bar: #8C4F27; --dash-bar-on: #FF7A1F; --dash-line: #FF5B4F; --dash-tick: #9AA4AF; --dash-tick-2: #FF7A70; --dash-grid: #353C44; } /* Таблица направлений (.t в v05): полоска доли, доля %, возвраты красным, итог с оранжевой линией. */ :root[data-theme=term] .dash-breakdown .breakdown-head { padding: 4px 10px 0; } :root[data-theme=term] .dash-breakdown .breakdown-head .chart-caption { font-size: 12px; } :root[data-theme=term] .dash-breakdown .table-scroll { padding: 0 2px; } :root[data-theme=term] .dash-breakdown table { margin-top: 4px; } :root[data-theme=term] .dash-breakdown #breakdown-table .dash-col[hidden] { display: table-cell; } :root[data-theme=term] .dash-breakdown #breakdown-table .dash-total[hidden] { display: table-footer-group; } :root[data-theme=term] .dash-breakdown #breakdown-table td.name { max-width: 210px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } :root[data-theme=term] .dash-breakdown #breakdown-table th, :root[data-theme=term] .dash-breakdown #breakdown-table td { padding-left: 6px; padding-right: 6px; font-size: 12.5px; } :root[data-theme=term] .dash-breakdown #breakdown-table td.dash-sales { color: var(--accent); } :root[data-theme=term] .dash-breakdown #breakdown-table td.dash-ret { color: var(--error); } :root[data-theme=term] .dash-breakdown #breakdown-table td.dash-zero { color: var(--label-secondary); } /* Колонки фиксированной ширины -- длинное название направления обрезается многоточием, а не выталкивает «Возвр., %» за край панели. Порядок: название, кол-во, сумма, полоска, доля, возвраты шт, возвраты ₩, возвраты %. */ :root[data-theme=term] .dash-breakdown #breakdown-table { table-layout: fixed; width: 100%; } :root[data-theme=term] .dash-breakdown #breakdown-table thead th:nth-child(2) { width: 74px; } :root[data-theme=term] .dash-breakdown #breakdown-table thead th:nth-child(3) { width: 116px; } :root[data-theme=term] .dash-breakdown #breakdown-table thead th:nth-child(4) { width: 70px; } :root[data-theme=term] .dash-breakdown #breakdown-table thead th:nth-child(5) { width: 50px; } :root[data-theme=term] .dash-breakdown #breakdown-table thead th:nth-child(6) { width: 62px; } :root[data-theme=term] .dash-breakdown #breakdown-table thead th:nth-child(7) { width: 104px; } :root[data-theme=term] .dash-breakdown #breakdown-table thead th:nth-child(8) { width: 54px; } :root[data-theme=term] .dash-breakdown #breakdown-table .dash-col-bar { padding-right: 2px; } :root[data-theme=term] .dash-breakdown #breakdown-table td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } :root[data-theme=term] .dash-breakdown #breakdown-table th { white-space: normal; line-height: 1.15; vertical-align: bottom; } :root[data-theme=term] .dash-bar { display: block; height: 8px; background: linear-gradient(90deg, var(--term-amber-edge), var(--accent)); } :root[data-theme=term] .dash-breakdown #breakdown-table tfoot td { background: var(--term-raise); color: var(--label); height: 24px; } :root[data-theme=term] .dash-breakdown #breakdown-table tfoot td.dash-sales { color: var(--label); } :root[data-theme=term] .dash-breakdown #breakdown-table .disclosure { color: var(--label-secondary); } /* Рейсы сеткой «группа × день» (.m в v05): ячейка оранжевее -- больше сумма (12–42 %, светлый текст на ней >= 5:1), пустой день -- «было» прошлой недели, справа итог недели. */ :root[data-theme=term] .dash-trips > .period-field { margin: 6px 10px 0; font-size: 12.5px; } :root[data-theme=term] .dash-trips > .period-field input { padding: 2px 6px; font-size: 12.5px; font-family: var(--term-mono); } :root[data-theme=term] .dash-trips-matrix[hidden] { display: block; padding: 4px 6px 0; } :root[data-theme=term] .dash-matrix { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 2px; margin: 0; } :root[data-theme=term] .dash-matrix th, :root[data-theme=term] .dash-matrix td { border: 0; padding: 0; background: transparent; } :root[data-theme=term] .dash-matrix thead th { text-align: center; font-size: 12px; font-weight: 500; color: var(--label-secondary); padding: 0 0 2px; } :root[data-theme=term] .dash-matrix thead th:first-child { width: 80px; } :root[data-theme=term] .dash-matrix thead th:last-child { width: 62px; } :root[data-theme=term] .dash-matrix tbody th { text-align: left; padding: 0 4px 0 2px; vertical-align: middle; } :root[data-theme=term] .dash-matrix-name { display: block; font-size: 12.5px; font-weight: 600; color: var(--label); } :root[data-theme=term] .dash-matrix-note { display: block; font-size: 11px; line-height: 1.2; color: var(--label-secondary); white-space: normal; } :root[data-theme=term] .dash-matrix tbody td { height: 50px; text-align: center; vertical-align: middle; border: 1px solid var(--term-grid); overflow: hidden; } :root[data-theme=term] tbody tr:nth-child(2n) td.dash-matrix-off, :root[data-theme=term] .dash-matrix td.dash-matrix-off { background: var(--term-sunk); } :root[data-theme=term] tbody tr:nth-child(2n) td.dash-matrix-on, :root[data-theme=term] .dash-matrix td.dash-matrix-on { background: color-mix(in srgb, var(--accent) var(--level, 20%), var(--term-panel)); border-color: var(--term-amber-line); } :root[data-theme=term] tbody tr:nth-child(2n) td.dash-matrix-week, :root[data-theme=term] .dash-matrix td.dash-matrix-week { background: var(--term-panel); border-color: var(--term-line); } :root[data-theme=term] tbody tr:hover td.dash-matrix-off { background: var(--term-sunk); } :root[data-theme=term] .dash-matrix-sum { display: block; font: 700 12.5px/1.3 var(--term-mono); color: var(--label); } :root[data-theme=term] .dash-matrix-sub { display: block; min-height: 1.2em; font: 10.5px/1.2 var(--term-mono); letter-spacing: -0.03em; color: var(--label); white-space: nowrap; } :root[data-theme=term] .dash-matrix-off .dash-matrix-sum { color: var(--label-secondary); font-weight: 400; font-size: 11px; } :root[data-theme=term] .dash-matrix-off .dash-matrix-sub { color: var(--label-secondary); } :root[data-theme=term] .dash-matrix-week .dash-matrix-sum { color: var(--accent); } :root[data-theme=term] .dash-matrix-week .dash-matrix-sub { color: var(--label-secondary); } :root[data-theme=term] .dash-matrix-legend { margin: 4px 4px 2px; font-size: 11.5px; color: var(--label-secondary); } /* Сводка недели (.wsum) и «Где больше всего возвратов» (.rb.rr). */ :root[data-theme=term] .dash-week[hidden] { display: block; margin-top: 8px; border-top: 1px solid var(--term-line); } :root[data-theme=term] .dash-week-grid { display: grid; grid-template-columns: 1fr 1fr; margin: 0; } :root[data-theme=term] .dash-week-grid > div { padding: 6px 10px; border-right: 1px solid var(--term-line); border-bottom: 1px solid var(--term-line); } :root[data-theme=term] .dash-week-grid > div:nth-child(2n) { border-right: 0; } :root[data-theme=term] .dash-week-grid > div:nth-child(n+3) { border-bottom: 0; } :root[data-theme=term] .dash-week-grid dt { font-size: 12px; color: var(--label-secondary); } :root[data-theme=term] .dash-week-grid dd { margin: 1px 0 0; font: 600 16px/1.3 var(--term-mono); color: var(--label); font-variant-numeric: tabular-nums; } :root[data-theme=term] .dash-rank { list-style: none; margin: 0; padding: 4px 0 6px; } :root[data-theme=term] .dash-rank li { display: grid; grid-template-columns: minmax(0, 150px) minmax(40px, 1fr) 44px 86px; gap: 8px; align-items: center; padding: 3px 10px; font: 12px var(--term-mono); } :root[data-theme=term] .dash-rank-name { font: 500 12.5px var(--term-sans); color: var(--label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } :root[data-theme=term] .dash-rank-bar { height: 7px; background: var(--term-sunk); } :root[data-theme=term] .dash-rank-bar i { display: block; height: 100%; background: var(--term-red); } :root[data-theme=term] .dash-rank-share { text-align: right; color: var(--error); } :root[data-theme=term] .dash-rank-amount { text-align: right; color: var(--label); } :root[data-theme=term] .dash-rank-empty { display: block; color: var(--label-secondary); } /* Свёрнутые панели: шапка-строка с «+»/«−»; раскрытая -- содержимое панели как раньше. */ :root[data-theme=term] .dash-fold[data-fold-themes~=term] > .dash-fold-sum[hidden] { display: flex; align-items: center; gap: 8px; min-height: 30px; padding: 0 10px; cursor: pointer; list-style: none; background: var(--term-raise); font-size: 13.5px; font-weight: 600; color: var(--label); } :root[data-theme=term] .dash-fold > .dash-fold-sum::-webkit-details-marker { display: none; } :root[data-theme=term] .dash-fold > .dash-fold-sum::before { content: ''; flex: none; width: 3px; height: 13px; background: var(--accent); } :root[data-theme=term] .dash-fold > .dash-fold-sum::after { content: '+'; margin-left: auto; font: 600 14px var(--term-mono); color: var(--label-secondary); } :root[data-theme=term] .dash-fold[open] > .dash-fold-sum::after { content: '−'; } :root[data-theme=term] .dash-fold[open] > .dash-fold-sum { border-bottom: 1px solid var(--term-line); } :root[data-theme=term] .dash-fold > .dash-fold-sum:hover { background: var(--term-hover); } :root[data-theme=term] .dash-fold > .dash-fold-sum:focus-visible { outline-offset: -2px; } :root[data-theme=term] .dash-fold[data-fold-themes~=term] > .card { padding: 10px 12px 12px; } :root[data-theme=term] .dash-fold[data-fold-themes~=term]:not(.dash-fold-ready) > .card { display: none; } @media (max-width: 767px) { :root[data-theme=term] .dash-filters { flex-wrap: wrap; gap: 6px 0; } :root[data-theme=term] .dash-filters select { height: 34px; font-size: 14px; } :root[data-theme=term] .dash .dash-head { flex-wrap: wrap; white-space: normal; padding: 4px 10px; } :root[data-theme=term] .dash-gran { margin-left: 0; width: 100%; } :root[data-theme=term] .dash-gran button { flex: 1; height: 30px; line-height: 30px; } :root[data-theme=term] .dash-big { font-size: 34px; } :root[data-theme=term] .dash-chart[hidden] { height: 220px; } :root[data-theme=term] .dash-matrix thead th:first-child { width: 64px; } :root[data-theme=term] .dash-matrix-note { display: none; } :root[data-theme=term] .dash-trips-matrix[hidden] { overflow-x: auto; } :root[data-theme=term] .dash-matrix { min-width: 560px; } :root[data-theme=term] .dash-rank li { grid-template-columns: minmax(0, 1fr) 60px 40px 76px; } /* На телефоне таблица направлений не сжимается до нечитаемого -- едет вбок внутри панели. */ :root[data-theme=term] .dash-breakdown #breakdown-table { min-width: 760px; } :root[data-theme=term] .dash-breakdown #breakdown-table thead th:first-child { width: 170px; } :root[data-theme=term] .dash-filters label:first-child + label { border-left: 0; padding-left: 0; } } /* Дашборд на телефоне (dashboard-m.html): панели v05 -- оранжевая моноширинная сумма, сравнения цветным текстом в рамке, столбики месяцев оранжевые, выбранный -- ярче. */ :root[data-theme=term] .m-top { background: var(--bg); } :root[data-theme=term] .m-month { background: var(--term-panel); border: 1px solid var(--term-line); border-radius: 2px; } :root[data-theme=term] .m-month-name { font-family: var(--term-mono); font-size: 15px; color: var(--accent); } :root[data-theme=term] .m-arrow { color: var(--accent); border-radius: 2px; } :root[data-theme=term] .m-arrow:disabled { color: var(--term-line); } :root[data-theme=term] .m-hero, :root[data-theme=term] .m-tile, :root[data-theme=term] .m-card { background: var(--term-panel); border: 1px solid var(--term-line); border-radius: 3px; padding: 10px 12px; box-shadow: none; margin-top: 8px; } :root[data-theme=term] .m-tiles { gap: 8px; } :root[data-theme=term] .m-tiles .m-tile { margin-top: 8px; } :root[data-theme=term] .m-label { font-size: 12.5px; } :root[data-theme=term] .m-big { font: 700 34px/1.1 var(--term-mono); letter-spacing: -0.03em; color: var(--accent); margin: 4px 0 8px; } :root[data-theme=term] .m-mid { font: 600 20px/1.3 var(--term-mono); letter-spacing: -0.02em; } :root[data-theme=term] .m-delta { border-radius: 2px; border: 1px solid var(--term-line); background: transparent; font: 600 12.5px var(--term-mono); padding: 3px 8px; color: var(--label-secondary); } :root[data-theme=term] .m-delta.up { color: var(--positive); border-color: rgba(61, 220, 132, 0.4); background: transparent; } :root[data-theme=term] .m-delta.down { color: var(--error); border-color: rgba(255, 91, 79, 0.5); background: transparent; } :root[data-theme=term] .m-note { font-family: var(--term-mono); font-size: 11.5px; } :root[data-theme=term] .m-card-title { display: flex; align-items: center; gap: 8px; margin: -10px -12px 10px; padding: 0 12px; min-height: 30px; background: var(--term-raise); border-bottom: 1px solid var(--term-line); font-size: 13.5px; } :root[data-theme=term] .m-card-title::before { content: ''; flex: none; width: 3px; height: 13px; background: var(--accent); } :root[data-theme=term] .m-bar-fill { background: #8C4F27; border-radius: 0; } :root[data-theme=term] .m-bar.active .m-bar-fill { background: var(--accent); } :root[data-theme=term] .m-bar.active { color: var(--accent); } :root[data-theme=term] .m-bar-val, :root[data-theme=term] .m-bar-lbl, :root[data-theme=term] .m-bar-year { font-family: var(--term-mono); font-size: 10.5px; } :root[data-theme=term] .m-dir { border-top-color: var(--term-grid); } :root[data-theme=term] .m-dir-row { font-size: 14.5px; } :root[data-theme=term] .m-dir-amt { font-family: var(--term-mono); color: var(--accent); } :root[data-theme=term] .m-share { height: 7px; border-radius: 0; background: var(--term-sunk); } :root[data-theme=term] .m-share span { border-radius: 0; background: linear-gradient(90deg, var(--term-amber-edge), var(--accent)); } :root[data-theme=term] .m-dir-meta { font-size: 12px; } :root[data-theme=term] .m-clients { border-left-color: var(--term-line); } :root[data-theme=term] .m-clients li b { font-family: var(--term-mono); } :root[data-theme=term] .m-full { background: var(--term-raise); border: 1px solid var(--term-line); border-bottom-color: var(--term-key-edge); border-radius: 2px; color: var(--accent); } /* Телефонный дашборд: ☰ висит сверху (style.css), строка свежести/☀☾ встаёт рядом с ним, ряд организаций -- ниже, заголовку больше не нужен отступ под ☰. */ @media (max-width: 767px) { :root[data-theme=term] body:has(.m-dash) .page-content { padding-top: 10px; } :root[data-theme=term] body:has(.m-dash) .theme-top { margin: 0 0 10px 56px; min-height: 44px; } :root[data-theme=term] body:has(.m-dash) .theme-top[hidden] + nav.theme-orgs { margin-top: 54px; } :root[data-theme=term] .m-top h1 { margin: 0 0 8px; line-height: 1.25; } } /* Блок выключен пользователю (hiddenBlocks -> .block-off): соседи занимают его место в сетке. */ @media (min-width: 1280px) { :root[data-theme=term] .dash:has(> .dash-hero.block-off) > .dash-trend { grid-column: 1 / -1; } :root[data-theme=term] .dash:has(> .dash-fold[data-block="dashboard.breakdown"].block-off) > .dash-fold[data-block="dashboard.trips"] { grid-column: 1 / -1; } } /* Тикер в середине ленты (app.js setThemeTicker, v05): «ПРОД 223 млн ₩ ▼32,1% ВОЗВР …». Подписи вторичным, значения основным, дельта -- цветом знака; на телефоне ленты нет. */ :root[data-theme=term] .theme-ticker { display: none; } @media (min-width: 768px) { /* Лента без строки свежести (app.js прячет .theme-top атрибутом hidden) -- тикер её показывает. */ :root[data-theme=term] .theme-top[hidden]:has(.theme-ticker) { display: flex; } :root[data-theme=term] .theme-top:has(.theme-ticker) { left: calc(var(--term-side) + 28px); justify-content: space-between; border-left: 0; } :root[data-theme=term] body:has(.dash-page) .theme-top:has(.theme-ticker) { right: 300px; } :root[data-theme=term] .theme-ticker { display: flex; align-items: center; gap: 18px; min-width: 0; overflow: hidden; white-space: nowrap; font: 12px var(--term-mono); color: var(--label); } :root[data-theme=term] .theme-tick { display: inline-flex; align-items: baseline; gap: 6px; } :root[data-theme=term] .theme-tick b { font-weight: 500; color: var(--label-secondary); } :root[data-theme=term] .theme-tick em { font-style: normal; font-weight: 600; } :root[data-theme=term] .theme-tick-delta-up { color: var(--positive); } :root[data-theme=term] .theme-tick-delta-down, :root[data-theme=term] .theme-tick-down .theme-tick-value { color: var(--error); } :root[data-theme=term] .theme-tick-up .theme-tick-value { color: var(--positive); } :root[data-theme=term] .theme-tick-warn .theme-tick-value { color: var(--warning); } } /* --------------------------------------------------------------------------------------------- Заказы Мегафуд (задача 8): раскладка v05 стр. 2, цвета v10. Журнал -- плотная таблица в панели: день оранжевой строкой с меткой «сегодня/завтра», регион -- строкой с чертой и клавишей «Печать региона (N)», заказ -- строкой «Клиент | Название (KR) | Номер | Поз. | Сумма | Статус | печать». Справа (>= 1180px) -- «Итог периода» и «Регионы за период». Новая разметка (#mf-thead, #mf-aside, ячейки .mf-row-cells, .mf-day-name) стоит с hidden -- её показывают только эти правила; .page-content.mf-page есть только у mf-orders.html (Елена и Елена МД не затронуты). Контраст: оранжевый текст дня на подсветке 6% оранжевого по панели (#383537) -- 4.65, вторичный 4.79; суммы оранжевым на панели 5.0, на зебре 4.75, на наведении 4.54; регион -- на #323942 только основной (9.6) и вторичный (4.6) текст. */ /* Колонки журнала: клиент (одно имя по языку интерфейса, 21.10.2026 -- колонки «Название (KR)» больше нет) · номер · позиций · сумма · статус · печать. */ :root[data-theme=term] .mf-page { --mf-cols: minmax(0, 2.3fr) 150px 36px 118px 92px 24px; } @media (min-width: 768px) { :root[data-theme=term] .page-content.mf-page { max-width: none; padding-top: 10px; } /* «Обновить из 1С» -- клавиша в ленте, как на Дашборде. */ :root[data-theme=term] .mf-page .r1c { position: absolute; top: 0; right: 8px; height: 32px; margin: 0; display: inline-flex; align-items: center; gap: 10px; flex-direction: row-reverse; z-index: 2; } :root[data-theme=term] .mf-page .r1c-btn { min-height: 0; height: 24px; padding: 0 12px; font-size: 12.5px; background: var(--accent); color: var(--accent-fg); border-color: var(--accent); border-bottom-color: var(--term-amber-edge); } :root[data-theme=term] .mf-page .r1c-btn:hover:not(:disabled) { background: var(--term-amber-hover); } :root[data-theme=term] .mf-page .r1c-note { font-family: var(--term-mono); font-size: 11.5px; color: var(--label); } :root[data-theme=term] body:has(.mf-page) .theme-top:has(.theme-ticker) { right: 300px; } } /* Шапка: в журнале без заголовка (раздел виден в меню и ленте) -- свежесть данных слева, «+ Новый заказ» справа. */ :root[data-theme=term] .mf-page .mf-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 8px; } :root[data-theme=term] .mf-page:has(#el-list-view:not([hidden])) .mf-header h1 { display: none; } :root[data-theme=term] .mf-page .mf-header .subtitle { margin: 0; font: 12px var(--term-mono); color: var(--label-secondary); } :root[data-theme=term] .mf-page .mf-header .mf-new-btn { margin: 0; padding: 0 16px; height: 32px; font-size: 14px; border-radius: 2px; } /* Фильтры одной строкой: период-клавиши, даты, поиск-командная строка. */ :root[data-theme=term] .mf-page .mf-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0 0 8px; } :root[data-theme=term] .mf-page .mf-seg button { height: 30px; padding: 0 14px; font-size: 13px; } :root[data-theme=term] .mf-page .mf-date-field { font-size: 12.5px; color: var(--label-secondary); gap: 6px; } :root[data-theme=term] .mf-page .mf-date-field .el-date { height: 30px; font-family: var(--term-mono); font-size: 13px; } :root[data-theme=term] .mf-page .mf-search { flex: 1 1 220px; max-width: 520px; height: 30px; font-family: var(--term-mono); font-size: 13px; border-color: var(--term-amber-line); } /* Доска: журнал и сводка справа. */ :root[data-theme=term] .mf-page .mf-board { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; align-items: start; } :root[data-theme=term] .mf-page .mf-main { background: var(--term-panel); border: 1px solid var(--term-line); border-radius: 3px; min-width: 0; } :root[data-theme=term] .mf-page .mf-main > #mf-journal > .mf-empty { margin: 0; border: 0; background: transparent; } :root[data-theme=term] .mf-page .mf-thead[hidden] { display: grid; grid-template-columns: var(--mf-cols); gap: 0 10px; align-items: center; min-height: 24px; padding: 0 8px; position: sticky; top: 0; z-index: 3; background: var(--term-raise); border-bottom: 1px solid var(--term-line); font-size: 12.5px; font-weight: 500; color: var(--label-secondary); white-space: nowrap; } :root[data-theme=term] .mf-thead .num { text-align: right; } /* День: оранжевая строка с меткой «сегодня» плашкой, справа число заказов и сумма. */ :root[data-theme=term] .mf-page .mf-day { align-items: center; margin: 0; padding: 4px 8px; background: rgba(255, 122, 31, 0.06); border-top: 1px solid var(--accent); border-bottom: 1px solid var(--term-line); font-size: 14.5px; font-weight: 700; color: var(--accent); } :root[data-theme=term] .mf-page .mf-day-lead { border-top-color: transparent; } /* Раздел «Возвраты» (23.10.2026): строка-разделитель моноширинным капсом, черта янтарная. */ :root[data-theme=term] .mf-page .mf-returns-sep { margin: 18px 0 0; padding: 4px 8px; font: 700 12px/1.4 var(--term-mono); letter-spacing: 0.08em; color: var(--accent); } :root[data-theme=term] .mf-page .mf-returns-sep::after { background: var(--term-amber-line); } :root[data-theme=term] .mf-page #el-list-view > .el-defaults:first-child { margin: 0 0 8px; padding: 6px 10px; } :root[data-theme=term] .mf-page .mf-day > span:first-child { display: none; } :root[data-theme=term] .mf-page .mf-day-name[hidden], :root[data-theme=term] .mf-page .mf-day-tag[hidden]:not(:empty) { display: inline; } :root[data-theme=term] .mf-page .mf-day-tag { margin-left: 6px; padding: 1px 6px; background: var(--accent); color: var(--accent-fg); border-radius: 2px; font: 600 11.5px/1.4 var(--term-mono); vertical-align: 1px; } :root[data-theme=term] .mf-page .mf-day .md-count { font-size: 13px; font-weight: 600; color: var(--label); } /* Регион: строка на ступень светлее с оранжевой чертой, справа клавиша печати. */ :root[data-theme=term] .mf-page .mf-region { margin: 0; padding: 2px 8px 2px 10px; min-height: 26px; background: var(--term-raise); border-bottom: 1px solid var(--term-line); box-shadow: inset 3px 0 0 var(--accent); font-size: 13.5px; font-weight: 600; color: var(--label); } :root[data-theme=term] .mf-page .mf-rows + .mf-region { margin-top: 0; } :root[data-theme=term] .mf-page .mf-region .md-count { margin-left: 10px; font-weight: 400; } :root[data-theme=term] .mf-page .mf-region-print { min-height: 0; height: 21px; padding: 0 9px; gap: 5px; border: 1px solid var(--term-line); border-bottom-color: var(--term-key-edge); border-radius: 2px; background: var(--term-panel); color: var(--label); font-size: 12px; font-weight: 600; } :root[data-theme=term] .mf-page .mf-region-print:hover { background: var(--term-hover); } :root[data-theme=term] .mf-page .mf-region-print svg { width: 13px; height: 13px; } /* Рейс (21.10.2026): уровень между оранжевым днём и регионом -- утопленная строка (#1E2227) моноширинными прописными с оранжевым «▸», справа оранжевая клавиша «Печать рейса» (тёмный текст на оранжевом -- 7.1); регионы под рейсом сдвинуты вправо на ступень. Оранжевый «▸» на #1E2227 -- 6.4, текст -- 13.6, вторичный -- 6.7. */ :root[data-theme=term] .mf-page .mf-trip { margin: 0; padding: 3px 8px; min-height: 28px; border-radius: 0; background: var(--term-sunk); border-bottom: 1px solid var(--term-line); font: 600 13px/1.3 var(--term-mono); letter-spacing: 0.04em; text-transform: uppercase; color: var(--label); } :root[data-theme=term] .mf-page .mf-trip-name::before { content: '▸ '; color: var(--accent); } :root[data-theme=term] .mf-page .mf-trip .md-count { margin-left: 10px; font: 400 12.5px var(--term-mono); letter-spacing: 0; text-transform: none; color: var(--label-secondary); } :root[data-theme=term] .mf-page .mf-trip ~ .mf-region { padding-left: 22px; box-shadow: inset 3px 0 0 var(--term-line), inset 15px 0 0 var(--term-raise), inset 17px 0 0 var(--accent); } :root[data-theme=term] .mf-page .mf-trip .mf-trip-print { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); border-bottom-color: var(--term-amber-edge); font-family: var(--term-sans); letter-spacing: 0; text-transform: none; } :root[data-theme=term] .mf-page .mf-trip .mf-trip-print:hover { background: var(--term-amber-hover); } /* Заказ: ячейки строки -- колонки шапки (display: contents у обёртки ячеек). */ :root[data-theme=term] .mf-page .mf-rows { background: transparent; border: 0; border-radius: 0; } :root[data-theme=term] .mf-page .mf-row { grid-template-columns: var(--mf-cols); gap: 0 10px; min-height: 22px; padding: 0 8px; border-bottom: 1px solid var(--term-grid); font-size: 13px; line-height: 1.3; } :root[data-theme=term] .mf-page .mf-rows .mf-row:nth-child(2n) { background: var(--term-zebra); } :root[data-theme=term] .mf-page .mf-rows .mf-row:hover, :root[data-theme=term] .mf-page .mf-rows .mf-row:focus-visible { background: var(--term-row-hover); } :root[data-theme=term] .mf-page .mf-row > .mf-row-who, :root[data-theme=term] .mf-page .mf-c-pos, :root[data-theme=term] .mf-page .mf-c-date { display: none; } :root[data-theme=term] .mf-page .mf-row-cells[hidden] { display: contents; } :root[data-theme=term] .mf-c-ru { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } :root[data-theme=term] .mf-c-ru { color: var(--label); font-size: 13.5px; } :root[data-theme=term] .mf-c-num { font: 12.5px var(--term-mono); color: var(--label-secondary); white-space: nowrap; } /* Дата заказа (21.10.2026) коротко в колонке номера: «0000-006507 · 21.10» -- колонки таблицы прежние (номер шире). */ :root[data-theme=term] .mf-c-numdate { color: var(--label); } :root[data-theme=term] .mf-c-n { font: 12.5px var(--term-mono); color: var(--label); text-align: right; } :root[data-theme=term] .mf-c-note { margin-left: 4px; padding: 0 5px; border: 1px solid var(--term-amber-line); border-radius: 2px; font-size: 11.5px; color: var(--label); } :root[data-theme=term] .mf-c-note.err { border-color: rgba(255, 91, 79, 0.55); color: var(--error); } :root[data-theme=term] .mf-page .mf-unposted .mf-c-ru { color: var(--label-secondary); } :root[data-theme=term] .mf-page .mf-row-total { font-size: 13px; font-weight: 600; color: var(--accent); } :root[data-theme=term] .mf-page .mf-pill { justify-self: start; padding: 0; border: 0; font-size: 12.5px; font-weight: 500; } :root[data-theme=term] .mf-page .mf-print { width: 22px; height: 22px; border-radius: 2px; color: var(--label-secondary); } :root[data-theme=term] .mf-page .mf-print svg { width: 15px; height: 15px; } :root[data-theme=term] .mf-page .mf-print:hover { background: var(--term-hover); color: var(--accent); } /* С сайта, ещё не в 1С: панель над журналом, строки -- те же колонки. */ :root[data-theme=term] .mf-page .mf-pending { margin: 0 0 8px; border: 1px solid rgba(245, 197, 66, 0.45); border-radius: 3px; background: var(--term-panel); } :root[data-theme=term] .mf-page .mf-pending-head { padding: 4px 8px; background: rgba(245, 197, 66, 0.08); border-bottom: 1px solid var(--term-line); font-size: 13px; } :root[data-theme=term] .mf-page .mf-pending-note { color: var(--label); } /* Сводка справа: панели с шапкой (.ph в v05), большая сумма, сетка показателей, дни и регионы с полосками. */ :root[data-theme=term] .mf-pnl { background: var(--term-panel); border: 1px solid var(--term-line); border-radius: 3px; overflow: hidden; } :root[data-theme=term] .mf-pnl-head { display: flex; align-items: center; gap: 10px; min-height: 28px; padding: 0 10px; background: var(--term-raise); border-bottom: 1px solid var(--term-line); white-space: nowrap; } :root[data-theme=term] .mf-pnl-title { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--label); } :root[data-theme=term] .mf-pnl-title::before { content: ''; width: 3px; height: 13px; background: var(--accent); } :root[data-theme=term] .mf-pnl-sub { font: 12px var(--term-mono); color: var(--label-secondary); } :root[data-theme=term] .mf-aside-total { padding: 12px 12px 10px; font: 700 40px/1 var(--term-mono); letter-spacing: -0.03em; color: var(--accent); white-space: nowrap; } :root[data-theme=term] .mf-aside-total .mf-cur { font-size: 0.55em; font-weight: 500; } :root[data-theme=term] .mf-kv { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; border-top: 1px solid var(--term-line); border-bottom: 1px solid var(--term-line); } :root[data-theme=term] .mf-kv > div { padding: 5px 10px 6px; border-left: 1px solid var(--term-line); min-width: 0; } :root[data-theme=term] .mf-kv > div:first-child { border-left: 0; } :root[data-theme=term] .mf-kv dt { font-size: 12px; color: var(--label-secondary); } :root[data-theme=term] .mf-kv dd { margin: 1px 0 0; font: 600 19px/1.3 var(--term-mono); color: var(--label); white-space: nowrap; } :root[data-theme=term] .mf-kv dd.mf-all { color: var(--positive); } :root[data-theme=term] .mf-aside-days, :root[data-theme=term] .mf-aside-regions { list-style: none; margin: 0; padding: 0; } :root[data-theme=term] .mf-aside-days li { display: grid; grid-template-columns: minmax(0, 1fr) auto 100px; gap: 8px; align-items: baseline; padding: 4px 10px; border-bottom: 1px solid var(--term-grid); } :root[data-theme=term] .mf-aside-days li:last-child { border-bottom: 0; } :root[data-theme=term] .mf-aside-regions li { display: grid; grid-template-columns: minmax(0, 1fr) 22px 56px 92px; gap: 8px; align-items: center; padding: 2px 10px; min-height: 21px; } :root[data-theme=term] .mf-aside-regions li:nth-child(2n) { background: var(--term-zebra); } :root[data-theme=term] .mf-a-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--label); } :root[data-theme=term] .mf-a-count { font: 12px var(--term-mono); color: var(--label-secondary); text-align: right; white-space: nowrap; } :root[data-theme=term] .mf-a-sum { font: 600 12.5px var(--term-mono); color: var(--accent); text-align: right; white-space: nowrap; } :root[data-theme=term] .mf-aside-regions .mf-a-sum { font-weight: 500; color: var(--label); } :root[data-theme=term] .mf-a-bar { height: 8px; background: var(--term-sunk); border: 1px solid var(--term-grid); position: relative; } :root[data-theme=term] .mf-a-fill { position: absolute; inset: 0 auto 0 0; background: var(--accent); } @media (min-width: 1180px) { :root[data-theme=term] .mf-page .mf-board { grid-template-columns: minmax(0, 1fr) 350px; } :root[data-theme=term] .mf-page .mf-aside[hidden] { display: flex; flex-direction: column; gap: 8px; position: sticky; top: 8px; } } /* Телефон: без шапки колонок -- имя строкой, под ним номер; сумма и печать справа. */ @media (max-width: 767px) { :root[data-theme=term] .mf-page .mf-thead[hidden] { display: none; } :root[data-theme=term] .mf-page .mf-header .mf-new-btn { height: 40px; } :root[data-theme=term] .mf-page .mf-seg { display: flex; width: 100%; } :root[data-theme=term] .mf-page .mf-seg button { flex: 1 1 0; height: 36px; padding: 0 4px; } :root[data-theme=term] .mf-page .mf-search { height: 38px; max-width: none; } :root[data-theme=term] .mf-page .mf-day { flex-wrap: wrap; } :root[data-theme=term] .mf-page .mf-region { flex-wrap: wrap; padding: 3px 8px 3px 10px; } :root[data-theme=term] .mf-page .mf-region .md-count { display: block; margin: 0; } :root[data-theme=term] .mf-page .mf-trip { flex-wrap: wrap; } :root[data-theme=term] .mf-page .mf-trip .md-count { display: block; margin: 0; } :root[data-theme=term] .mf-page .mf-trip ~ .mf-region { padding-left: 22px; } :root[data-theme=term] .mf-page .mf-region-print { height: 32px; margin-left: auto; } :root[data-theme=term] .mf-page .mf-row { grid-template-columns: minmax(0, 1fr) auto 36px; padding: 4px 8px; } :root[data-theme=term] .mf-page .mf-row-cells[hidden] { display: block; min-width: 0; } :root[data-theme=term] .mf-page .mf-c-ru { display: block; white-space: normal; overflow-wrap: anywhere; } :root[data-theme=term] .mf-page .mf-c-num { font-size: 12px; } :root[data-theme=term] .mf-page .mf-c-n { display: none; } :root[data-theme=term] .mf-page .mf-print { width: 36px; height: 36px; } } /* Заказ сайта: в колонке номера -- «сайт №431 · 22.10.2026», ей нужно шире. */ @media (min-width: 768px) { :root[data-theme=term] .mf-page .mf-pending .mf-row { grid-template-columns: minmax(0, 2fr) 168px 36px 118px 92px 24px; } } /* Подсказки по клиенту (el-suggest: Елена, Заказы Мегафуд, Акты сверки Корея, 21.10.2026): выбранная стрелками строка -- оранжевая, как .suggestions button.selected. */ :root[data-theme=term] .el-suggest { border: 1px solid var(--term-line); border-radius: 2px; background: var(--term-panel); } :root[data-theme=term] .el-suggest-item:hover { background: var(--term-hover); } :root[data-theme=term] .el-suggest-item.active { background: var(--accent); color: var(--accent-fg); } /* «Перечитать из 1С» (21.10.2026): ответ системника под полосой карточки заказа -- строкой терминала. */ :root[data-theme=term] .mf-reread-status { font-size: 13px; padding: 6px 10px; border: 1px solid var(--term-line); border-radius: 2px; background: var(--term-panel); color: var(--label-secondary); } :root[data-theme=term] .mf-reread-status::before { content: '> '; color: var(--accent); } :root[data-theme=term] .mf-reread-status.ok { color: var(--positive); border-color: rgba(61, 220, 132, 0.4); } :root[data-theme=term] .mf-reread-status.warn { color: var(--warning); border-color: rgba(245, 197, 66, 0.45); } :root[data-theme=term] .mf-reread-status.err { color: var(--error); border-color: rgba(255, 91, 79, 0.55); } /* Возврат по накладным (mf-returns.js, 21.10.2026): «Возврат» -- контурная кнопка левее «+ Новый заказ», плитки документов и поле текста -- плоские панели с тонкой рамкой. */ :root[data-theme=term] .mf-page .mf-header .mr-open-btn { margin: 0 0 0 auto; padding: 0 16px; height: 32px; font-size: 14px; border-radius: 2px; background: transparent; color: var(--accent); border: 1px solid var(--term-amber-line); box-shadow: none; } :root[data-theme=term] .mf-page .mf-header .mr-open-btn:hover:not(:disabled) { background: var(--term-amber-dim); color: var(--accent); } :root[data-theme=term] .mr-send-hint.err, :root[data-theme=term] .mr-pick.mr-short { color: var(--error); } :root[data-theme=term] .mr-line { border-top-color: var(--term-grid); } :root[data-theme=term] .mr-pick, :root[data-theme=term] .mr-plan-qty, :root[data-theme=term] .mr-ret-total { font-family: var(--term-mono); } :root[data-theme=term] .mr-pick { font-size: 12px; } :root[data-theme=term] .mr-tile { background: var(--term-raise); border: 1px solid var(--term-line); border-radius: 2px; } :root[data-theme=term] a.mr-tile:hover { background: var(--term-hover); border-color: var(--term-amber-line); } :root[data-theme=term] .mr-tile-off { background: var(--term-sunk); } :root[data-theme=term] .mr-del { border-radius: 2px; } :root[data-theme=term] .mr-confirm { box-shadow: none; border-color: var(--term-amber-line); } :root[data-theme=term] .mr-error { box-shadow: none; border-color: var(--term-red); } :root[data-theme=term] .mr-line .mr-price.mr-need-price { box-shadow: none; border-color: var(--term-amber-line); background: var(--term-amber-dim); } :root[data-theme=term] .mr-group + .mr-group, :root[data-theme=term] .mr-total-row { border-top-color: var(--term-grid); } :root[data-theme=term] .mr-total, :root[data-theme=term] .mr-excess-qty { font-family: var(--term-mono); } :root[data-theme=term] .mr-sale-select, :root[data-theme=term] .mr-sale-picks .mr-pick { font-family: var(--term-mono); font-size: 12px; } :root[data-theme=term] .mr-line.mr-line-bad { border-radius: 2px; background: color-mix(in srgb, var(--term-red) 10%, transparent); } :root[data-theme=term] .mr-line-bad .mr-sale-select, :root[data-theme=term] .mr-line-bad .mr-qty { box-shadow: none; border-color: var(--term-red); } :root[data-theme=term] .mr-spinner { border-radius: 0; border-color: var(--term-line); border-top-color: var(--accent); } @media (max-width: 767px) { :root[data-theme=term] .mf-page .mf-header .mr-open-btn { height: 40px; } } /* Окна «Счетов клиентов» (account-prompts.js, 22.10.2026): панель с рамкой, клавиши, главная -- оранжевая. */ :root[data-theme=term] .ap-box { border: 1px solid var(--term-line); border-radius: 2px; background: var(--term-panel); } :root[data-theme=term] .ap-steps { border-radius: 2px; background: var(--term-sunk); font-family: var(--term-mono); font-size: 12.5px; } :root[data-theme=term] .ap-primary { border: 1px solid var(--accent); border-bottom-color: var(--term-amber-edge); border-radius: 2px; background: var(--accent); color: var(--accent-fg); } :root[data-theme=term] .ap-primary:hover:not(:disabled) { background: var(--term-amber-hover); } :root[data-theme=term] .ap-secondary, :root[data-theme=term] .ap-later, :root[data-theme=term] .ap-account { border: 1px solid var(--term-line); border-bottom-color: var(--term-key-edge); border-radius: 2px; background: var(--term-raise); color: var(--label); } :root[data-theme=term] .ap-secondary:hover:not(:disabled), :root[data-theme=term] .ap-later:hover:not(:disabled), :root[data-theme=term] .ap-account:hover:not(:disabled) { background: var(--term-hover); } :root[data-theme=term] .ap-account-number { font-family: var(--term-mono); } /* «МД остатки»: плитки Пн–Пт -- панели с цветной полоской сверху (23.10.2026). */ :root[data-theme=term] .md-week-tile { background: var(--term-panel); border: 1px solid var(--term-line); border-top: 2px solid var(--term-red); border-radius: 3px; } :root[data-theme=term] .md-week-tile.good { border-top-color: var(--positive); } :root[data-theme=term] .md-week-tile.today { box-shadow: none; background: var(--term-raise); } :root[data-theme=term] .md-week-title { text-transform: uppercase; letter-spacing: 0.06em; font-size: 11px; } /* «Калькулятор МД», плитка «Оплата на месте» -- купюра (29.10.2026): тёмная палитра --paid-* (style.css .mdc-paid). */ :root[data-theme=term] .mdc-paid { --paid-bg: linear-gradient(135deg, #0f3019 0%, #17452a 55%, #0d2a17 100%); --paid-border: #3f8c55; --paid-inset: rgba(255, 255, 255, 0.07); --paid-fg: #daf0dd; --paid-label: #8fcf9c; --paid-ink: rgba(140, 230, 160, 0.3); --paid-ink-soft: rgba(140, 230, 160, 0.13); --paid-mark: rgba(140, 230, 160, 0.24); --paid-input-bg: rgba(0, 0, 0, 0.35); --paid-input-fg: #e6f7e9; }