/* grid-table.css — общая плотная сетка «как в экселе».
 *
 * ЗАЧЕМ ОТДЕЛЬНЫМ ЛИСТОМ. Стиль родился на столе цен, но правило владельца —
 * «все таблицы тут и далее»: список на восемнадцать тысяч строк читается как
 * таблица, а не как лента карточек. Если стиль останется внутри price-desk.css,
 * следующий экран получит его копией — и копии разойдутся.
 *
 * ЗАКОН СЕТКИ:
 *   — одна клетка на один факт; подстрочники разводятся по своим колонкам,
 *     иначе строка растёт в три этажа и таблица перестаёт читаться взглядом;
 *   — строка в одну линию, длинное режется многоточием, полностью — в title;
 *   — шапка и первые колонки не уезжают: на двадцатой колонке вправо должно
 *     быть видно, чья это строка;
 *   — числа выключены вправо и набраны tabular-nums, иначе колонка не
 *     сравнивается глазом;
 *   — цвет никогда не единственный носитель смысла: рядом с заливкой стоит
 *     либо число, либо словесная причина.
 *
 * Включается классом `grid-table` на самой таблице и `grid-table-wrap` на
 * обёртке. Экранные особенности — свои классы поверх, не правкой этих.
 */

.grid-table-wrap { max-height:72vh; overflow:auto; border:1px solid var(--line,#d8dde5); border-radius:10px; }

table.grid-table { border-collapse:separate; border-spacing:0; width:max-content; min-width:100%;
                   font-size:12px; line-height:1.4; font-variant-numeric:tabular-nums; }
table.grid-table th, table.grid-table td {
  border-right:1px solid var(--line,#e3e7ee); border-bottom:1px solid var(--line,#e3e7ee);
  padding:6px 9px; vertical-align:middle; white-space:nowrap; background:var(--card,#fff); }
table.grid-table tbody tr:nth-child(even) td { background:color-mix(in srgb, var(--line,#e3e7ee) 18%, var(--card,#fff)); }
table.grid-table tbody tr:hover td { background:color-mix(in srgb, var(--accent,#2f6feb) 7%, var(--card,#fff)); }

table.grid-table thead th { position:sticky; z-index:3; top:0;
  background:color-mix(in srgb, var(--line,#e3e7ee) 40%, var(--card,#fff));
  font-weight:600; text-align:left; border-bottom:1px solid var(--line,#c9d0da); }
table.grid-table thead tr.grid-subhead th { top:34px; z-index:2; font-weight:500; font-size: 12px; opacity:.85;
  padding:1px 8px; height:16px; }

/* Номер строки и залипшие колонки. Смещения слева задаёт экран: ширины
   первых колонок у каждой таблицы свои, и зашивать их сюда значило бы
   сделать общий лист непригодным для второй таблицы. */
.grid-rownum { width:44px; text-align:right; color:var(--muted,#6b7280); position:sticky; left:0; z-index:4;
               background:color-mix(in srgb, var(--line,#e3e7ee) 30%, var(--card,#fff)); }
.grid-sticky { position:sticky; z-index:4; overflow:hidden; text-overflow:ellipsis;
               border-right:1px solid var(--line,#c9d0da); }
table.grid-table thead .grid-rownum, table.grid-table thead .grid-sticky { z-index:6; }
table.grid-table tbody tr:nth-child(even) .grid-sticky { background:color-mix(in srgb, var(--line,#e3e7ee) 18%, var(--card,#fff)); }

.grid-num { text-align:right; font-variant-numeric:tabular-nums; }
.grid-ellipsis { overflow:hidden; text-overflow:ellipsis; }

/* Правимая клетка. Рамка появляется по наведению и фокусу: двадцать полей
   с постоянными рамками в ряд рябят и перестают читаться как таблица. */
table.grid-table .grid-input { width:100%; min-width:92px; border:1px solid transparent; background:transparent;
  padding:3px 8px; text-align:right; font:inherit; font-variant-numeric:tabular-nums; border-radius:0; }
table.grid-table .grid-input:hover { border-color:var(--line,#c9d0da); }
table.grid-table .grid-input:focus { border-color:var(--accent,#2f6feb); background:var(--card,#fff); outline:none; }
table.grid-table td.grid-cell-input { padding:0; }
.grid-chip.is-lead { border-color:var(--accent,#2f6feb); background:color-mix(in srgb, var(--accent,#2f6feb) 9%, transparent); }

/* CRM workspace: the shared stylesheet owns presentation; no injected styles. */

.crm-focused .crm-tabs{flex-wrap:nowrap;border-bottom:1px solid var(--line);gap:20px;margin-bottom:10px}
.crm-focused .crm-tab{border:0;border-radius:0;background:none;box-shadow:none;padding:10px 2px;border-bottom:2px solid transparent}
.crm-focused .crm-tab small{display:none}.crm-focused .crm-tab.is-active{border-bottom-color:var(--accent);background:none}
.crm-more-navigation{position:relative;margin-left:auto;align-self:center}.crm-more-navigation summary{cursor:pointer;padding:10px}.crm-more-navigation>div{position:absolute;right:0;top:100%;min-width:180px;padding:8px;background:var(--surface);border:1px solid var(--line);border-radius:8px;z-index:3;box-shadow:0 8px 24px #0002}.crm-more-navigation a{display:block;padding:8px;color:var(--text)}
.crm-record-properties{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:14px 0}.crm-record-properties>div{padding:12px;background:var(--surface-2);border-radius:8px}.crm-record-properties dt{font-size:12px;color:var(--dim)}.crm-record-properties dd{margin:6px 0 0;font-size:17px;font-weight:600}.crm-focused{font-size:14px}.crm-focused .crm-scroll{border-radius:8px}.crm-focused th{font-size: 12px;letter-spacing:.03em;background:var(--surface-2)}
.crm-focused td{padding:7px 10px;font-size:13px;line-height:1.4}.crm-focused td:first-child{font-weight:550;min-width:190px}
.crm-focused .crm-scroll tr:hover{background:var(--accent-soft)}.crm-focused .crm-chip{border-radius:7px;padding:5px 10px;min-height:30px;display:inline-flex;align-items:center;gap:6px}
.crm-focused .crm-stale{line-height:1.5}.crm-focused .crm-search{display:flex;gap:8px;margin:10px 0}.crm-focused .crm-search input{max-width:440px;flex:1;min-width:120px;border-radius:7px}
.crm-more-filters{display:inline-block;position:relative}.crm-more-filters summary{cursor:pointer;padding:5px 9px;color:var(--accent)}.crm-more-filters[open]{display:flex;flex-wrap:wrap;gap:6px;width:100%}.crm-viewbar{display:flex;align-items:center;gap:8px;margin:12px 0}.crm-viewbar strong{font-size:20px;margin-right:auto}
.crm-viewbar button,.crm-preview-button,.crm-preview-controls button{font:inherit;cursor:pointer;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:6px;padding:7px 11px}
.crm-viewbar button[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.crm-preview-button{font-size: 12px;margin-left:8px;padding:3px 7px;color:var(--accent)}
.crm-focused [hidden]{display:none}.crm-analysis-panel{padding:16px 0}.crm-analysis-panel:empty{display:none}
.crm-board{display:flex;gap:14px;overflow-x:auto;padding:2px 0 16px;align-items:flex-start}
.crm-board-column{background:var(--surface-2);border:1px solid var(--line);border-radius:9px;min-width:260px;width:280px;flex:none;padding:10px}
.crm-board-column h3{font-size:13px;margin:0 0 12px;display:flex;justify-content:space-between;gap:8px}
.crm-board-card{background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:12px;margin-bottom:9px;box-shadow:0 1px 2px #00000005}
.crm-board-card>a{font-weight:600;color:var(--text);text-decoration:none;line-height:1.5}.crm-board-card dl{margin:12px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:12px}.crm-board-card dt{color:var(--dim)}.crm-board-card dd{margin:0;text-align:right;overflow-wrap:anywhere}
.crm-board-note{font-size:12px;color:var(--soft);margin:8px 0}.crm-preview{box-sizing:border-box;position:fixed;inset:16px 16px 16px auto;width:min(640px,calc(100vw - 32px));max-width:none;max-height:calc(100vh - 32px);height:calc(100vh - 32px);margin:0;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);box-shadow:0 18px 70px #0003}
.crm-preview::backdrop{background:#16282433}.crm-preview-controls{position:sticky;top:0;display:flex;align-items:center;gap:8px;padding:12px;background:var(--surface);border-bottom:1px solid var(--line);z-index:1}.crm-preview-controls a{margin-right:auto;color:var(--accent);font-size:13px}.crm-preview-body{padding:18px;overflow-wrap:anywhere}.crm-preview-body h3{font-size:18px}.crm-preview-body .crm-scroll{overflow:auto}.crm-preview-body td{font-size:12px}
@media(max-width:700px){.crm-focused .crm-tabs{gap:18px}.crm-viewbar{flex-wrap:wrap}.crm-viewbar strong{width:100%;font-size:20px}.crm-focused td{padding:10px 8px}.crm-preview{inset:0;width:100vw;height:100dvh;max-height:100dvh;border-radius:0}.crm-preview-controls{flex-wrap:wrap}.crm-board-column{min-width:250px;width:80vw}}


/* Shared spreadsheet surface. Row identity stays visible while the data scrolls. */
:is(.crm-scroll,.dt-wrap,.table-wrap,.grid-table-wrap):has(>table.grid-table) { max-width:100%; overflow:auto; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
table.grid-table tbody td:focus { position:relative; outline:2px solid var(--accent); outline-offset:-2px; background:var(--accent-soft); z-index:1; }
table.grid-table th:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
table.grid-table :is(td,th).grid-num, table.grid-table :is(td,th).num { text-align:right; font-variant-numeric:tabular-nums; }
@media(min-width:701px) { .crm-focused .crm-scroll table.grid-table td { padding:6px 9px; } }
@media(max-width:700px) {
table.grid-table :is(button,
a.crm-preview-button){ min-height:36px; } }

/* Existing report tables retain wrapping; native wide price grids keep their layout. */
table.grid-table--standard { width:100%; }
table.grid-table--standard td { white-space:normal; overflow-wrap:normal; }
.crm-focused table.grid-table--standard { min-width:1380px; }

/* Desktop registry readability; server/native sizing and resizing remain owned by their screens. */
@media (min-width:1024px) {
  .vision-table-desktop-wrap > table.vision-table-desktop { font-size:13px; line-height:1.45; }
  .vision-table-desktop-wrap > table.vision-table-desktop > tbody > tr > td { font-size:13px; padding:8px 9px; }
  .vision-table-desktop-wrap > table.vision-table-desktop > thead > tr > th { font-size:12px; padding:8px 9px; }
  .vision-table-desktop-wrap > table.vision-table-desktop :is(.sub,.meta,.t-dim) { font-size:12px; }
  .vision-table-desktop-wrap { min-width:0; max-width:100%; }
}

/* Shared composition contract: explicit presenter opt-in only. */
@media (min-width:1024px) {
  .vision-page-composition > .page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
  .vision-page-composition > .page-header h2 { font:600 20px/1.3 var(--font-sans,system-ui,sans-serif); margin:0; }
  .vision-page-composition > .page-header p { font-size:13px; line-height:1.45; margin:4px 0 0; }
  .vision-page-composition .page-header-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
  .vision-page-composition .workspace-main { min-width:0; }
  .vision-page-composition .workspace-secondary { margin:12px 0; }
  .vision-page-composition .workspace-secondary > summary { box-sizing:border-box; min-height:34px; padding:7px 10px; font-size:12px; border:1px solid var(--line,#d8dde5); border-radius:6px; cursor:pointer; }
  .vision-page-composition .workspace-secondary > summary:focus-visible { outline:2px solid var(--accent,#0f766e); outline-offset:2px; }
}
@media(min-width:1024px) {
  .vision-page-composition .page-header-actions .workspace-secondary { position:relative; margin:0; }
  .vision-page-composition .page-header-actions .workspace-secondary > nav { position:absolute; top:calc(100% + 6px); right:0; min-width:240px; max-width:min(420px,80vw); max-height:60vh; overflow:auto; padding:8px; border:1px solid var(--line,#d8dde5); border-radius:7px; background:var(--surface,#fff); box-shadow:0 6px 18px #17232c18; z-index:10; }
  .vision-page-composition .page-header-actions [data-report-views-host] { display:flex; align-items:center; gap:6px; }
  .vision-page-composition .page-header-actions [data-report-views-host] label { display:flex; align-items:center; gap:6px; margin:0; font-size:12px; }
  .vision-page-composition .page-header-actions [data-report-views-host] :is(select,input) { max-width:180px; min-height:34px; font-size:13px; }
  .vision-page-composition .page-header-actions [data-report-views-host] button { min-height:34px; }
}
@media(min-width:1024px) {
  .vision-table-desktop-wrap > table.vision-table-desktop :is(.pill,.chip,.meta,.sub,.t-dim,small) { font-size:12px; }
}
@media(min-width:1024px) {
  .vision-page-composition .team-workload-table td.n .sub,
  .vision-table-desktop-wrap > .team-workload-table td.n .sub { white-space:normal; overflow-wrap:anywhere; }
}
