/* styles-brigade-grid.css — лист «Справочник бригад» сеткой (pages-brigade-grid.js).
   Таблица, карточки, «+», меню клетки — классы «Графика смен» (styles-roster*.css).
   Здесь только своё: двухэтажная шапка с блоками «Старший / Основные / Помощники»,
   кнопки-клетки, «Состояние записи». */

/* ── шапка ─────────────────────────────────────────────────────────────── */
.plan-table.brigade-grid thead th { height: auto; vertical-align: middle; }
.plan-table.brigade-grid thead th small { display: block; font-size: 9px; font-weight: 500; opacity: 0.82; }
.plan-table.brigade-grid thead th.bg-h-lead,
.plan-table.brigade-grid thead th.bg-h-main,
.plan-table.brigade-grid thead th.bg-h-help,
.plan-table.brigade-grid thead th.bg-h-state { text-align: center; }
.plan-table.brigade-grid thead th.bg-h-lead { background: linear-gradient(180deg, #8a6420, #6f4f17); }
.plan-table.brigade-grid thead th.bg-h-main { background: linear-gradient(180deg, #2f6aa3, #28588a); }
.plan-table.brigade-grid thead th.bg-h-help { background: linear-gradient(180deg, #5e4a8c, #4d3c74); }
.plan-table.brigade-grid thead tr.bg-h1 th.bg-h-main,
.plan-table.brigade-grid thead tr.bg-h1 th.bg-h-help { position: sticky; }
.bg-h-grp { display: inline-block; vertical-align: middle; }
.plan-table.brigade-grid thead th.bg-h-num { font-weight: 600; opacity: 0.95; }

/* «−»/«+» столбцов блока — справа в шапке блока. */
.bg-colctl { display: inline-flex; gap: 3px; margin-left: 8px; vertical-align: middle; }
.bg-colctl button {
  width: 18px; height: 18px; padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 5px;
  background: rgba(255, 255, 255, 0.12); color: #fff;
  font: inherit; font-size: 12px; font-weight: 800; line-height: 1; cursor: pointer;
}
.bg-colctl button:hover { background: rgba(255, 255, 255, 0.3); }

/* Начало блока «Основные» / «Помощники» — чуть толще линия слева. */
.plan-table.brigade-grid td.bg-grp-start { border-left: 2px solid #9db6d0; }

/* ── левая колонка ─────────────────────────────────────────────────────── */
.bg-pick { width: 13px; height: 13px; margin: 0; flex: 0 0 auto; accent-color: #2f5f8a; cursor: pointer; }
.bg-dot { width: 9px; height: 9px; border-radius: 3px; flex: 0 0 auto; background: currentColor; }
.rg-emp .bg-name {
  border: 0; background: none; padding: 0; font: inherit; color: inherit;
  text-align: left; cursor: pointer;
}
.rg-emp .bg-name:hover { color: #2f5f8a; text-decoration: underline; }
.plan-table.brigade-grid tbody tr.is-picked td { background: #e3edf8 !important; }

/* ── клетки ────────────────────────────────────────────────────────────── */
.plan-table.brigade-grid td.bg-lead { padding: 3px; height: 52px; }
.bg-card { font: inherit; width: 100%; cursor: grab; }
.bg-card.is-dragging { opacity: 0.45; }
.bg-card.is-lead { box-shadow: inset 0 0 0 1.5px #e1a23a; }
.bg-plus, .bg-lead-btn {
  display: block; width: 100%; height: 100%; min-height: 40px;
  border: 0; background: none; padding: 0; font: inherit; cursor: pointer;
}
.bg-plus { color: #b6c5d6; font-size: 16px; font-weight: 500; }
.bg-plus:hover { color: #2f5f8a; }
.bg-lead-btn { text-align: left; }
.bg-lead-card { display: grid; cursor: pointer; }
.bg-lead-empty {
  display: block; padding: 5px 6px; text-align: center;
  border: 1.5px dashed #e1a23a; border-radius: 7px;
  color: #8a5a12; font-size: 10px; font-weight: 700;
}
.bg-lead-empty:empty { display: none; }
.plan-table.brigade-grid td.is-drop { outline: 2px dashed #f59e0b; outline-offset: -2px; background: #fff6e0 !important; }

.plan-table.brigade-grid td.bg-state { text-align: center; white-space: normal; }
.bg-why { display: block; margin-top: 2px; font-size: 9px; line-height: 1.2; color: #8a4b4b; }

/* ── меню ──────────────────────────────────────────────────────────────── */
.bg-menu .bg-menu-input, .bg-menu .bg-menu-search {
  flex: 1 1 auto; min-height: 26px; border: 1px solid #b6c9df; border-radius: 7px;
  background: #fff; color: #1d3553; font: inherit; font-size: 11px; padding: 0 8px;
}
.bg-menu .bg-menu-list { max-height: 240px; overflow: auto; }
.bg-menu .roster-cell-shift[disabled] { opacity: 0.45; cursor: default; }
.bg-menu-check { display: flex; align-items: center; gap: 6px; color: #4d6a8c; font-weight: 600; }
.bg-swatches { display: flex; flex-wrap: wrap; gap: 5px; }
.bg-swatch { width: 20px; height: 20px; padding: 0; border: 2px solid transparent; border-radius: 6px; cursor: pointer; }
.bg-swatch.is-active { border-color: #1d3553; }
.bg-menu .bg-menu-del { margin-right: auto; }