/* Настраиваемые таблицы — порядок/ширина/видимость колонок.
   Самостоятельный модуль (tableprefs.js), навешивается на .dk-table/.dk-mini.
   Цвета — токены кабинета (--c-*), работает в светлой и тёмной теме. */

/* Обёртку таблицы модуль делает контейнером для иконки (position:relative задаётся в JS,
   чтобы не зависеть от того, есть ли .dk-tablewrap). */
.tp-wrap { position: relative; }

/* Кнопка-«слайдеры» в правом верхнем углу шапки таблицы. */
.tp-gear {
  position: absolute; top: 2px; right: 8px; z-index: 6;
  width: 26px; height: 26px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--c-line); border-radius: 7px;
  background: var(--c-panel); color: var(--c-muted);
  cursor: pointer; opacity: .55; transition: opacity .12s, color .12s, border-color .12s;
}
.tp-wrap:hover .tp-gear { opacity: 1; }
.tp-gear:hover { color: var(--c-acc); border-color: var(--c-acc); }
.tp-gear svg { width: 15px; height: 15px; display: block; }
.tp-gear.in-cell {
  position: static; top: auto; right: auto; z-index: 6;
  margin: 0 auto; opacity: .68;
}
.tp-col.tp-gear-cell { width: 34px !important; min-width: 34px !important; max-width: 34px !important; padding: 0 !important; text-align: center; border-left-color: transparent !important; border-right-color: transparent !important; background: transparent !important; }
td.tp-gear-cell { width: 34px !important; min-width: 34px !important; max-width: 34px !important; padding: 0 !important; border-left-color: transparent !important; border-right-color: transparent !important; background: transparent !important; }
.tp-col.tp-gear-cell .tp-resize { display: none !important; }
.tp-col.tp-locked { cursor: default; }

/* Поповер видимости колонок (выпадает из-под иконки). */
.tp-pop {
  position: fixed; top: auto; left: auto; z-index: 600;
  min-width: 210px; max-width: 280px; max-height: 60vh; overflow-y: auto;
  background: var(--c-pop, var(--c-panel)); border: 1px solid var(--c-line);
  border-radius: 12px; box-shadow: 0 14px 40px rgba(0,0,0,.28);
  padding: 8px; font-size: .82rem; color: var(--c-ink);
}
.tp-pop[hidden] { display: none; }
.tp-pop .tp-pop-h {
  font-size: .7rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--c-muted); padding: 4px 8px 6px; font-weight: 700;
}
.tp-pop label {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 8px; border-radius: 8px; cursor: pointer; user-select: none;
}
.tp-pop label:hover { background: var(--c-hover); }
.tp-pop label input { width: 15px; height: 15px; accent-color: var(--c-acc); cursor: pointer; flex: none; }
.tp-pop label span { overflow: hidden; text-overflow:clip; white-space: nowrap; }
.tp-pop .tp-reset {
  display: block; width: 100%; margin-top: 6px; padding: 8px;
  border: 1px solid var(--c-line); border-radius: 8px;
  background: transparent; color: var(--c-muted); cursor: pointer; font-size: .8rem;
}
.tp-pop .tp-reset:hover { color: var(--c-acc); border-color: var(--c-acc); }

/* Заголовки: место под кнопку, курсор перетаскивания, зона resize у правого края. */
.dk-table thead th.tp-col, .dk-mini thead th.tp-col { position: relative; }
.dk-table thead th.tp-drag, .dk-mini thead th.tp-drag { cursor: grab; }
.tp-col .tp-resize {
  position: absolute; top: 0; bottom: 0; right: -3px; width: 8px; height: auto;
  cursor: col-resize; z-index: 2; user-select: none;
}
.tp-col .tp-resize::after {
  content: ""; position: absolute; right: 3px; top: 22%; bottom: 22%; width: 1px;
  background: var(--c-line);
}
.tp-col .tp-resize:hover::after, body.tp-resizing-col .tp-col .tp-resize::after { background: rgba(111,211,255,.55); }
.tp-col .tp-resize.fixed { cursor: default; }
.tp-col.tp-dragging { opacity: .45; }
.tp-col.tp-drop-before { box-shadow: inset 2px 0 0 var(--c-acc); }
.tp-col.tp-drop-after  { box-shadow: inset -2px 0 0 var(--c-acc); }

/* Скрытая колонка. */
.tp-hidden { display: none !important; }

/* Когда выставлены ширины — таблица фиксированной раскладки + горизонтальный скролл обёртки. */
.tp-sized { table-layout: fixed; }
.tp-scroll { overflow-x: auto; }

/* Резерв справа в последнем заголовке, чтобы иконка не наезжала на его текст. */
.dk-table thead th:last-child.tp-col:not(.tp-gear-cell), .dk-mini thead th:last-child.tp-col:not(.tp-gear-cell) { padding-right: 34px; }

/* Во время перетаскивания колонки — глушим выделение текста по странице. */
body.tp-dragging-col, body.tp-resizing-col { user-select: none; cursor: col-resize; }
body.tp-dragging-col { cursor: grabbing; }
