/* styles-brigade-site.css — участок бригады и выпадашка ФИО с поиском.
 * Отдельный файл, потому что styles-brigade.css уже 757 строк (хард-лимит 600):
 * новый блок в него не дописываем (ARCHITECTURE_LIMITS «новый код → новый файл»).
 * Палитра и размеры — те же, что в styles-brigade.css / styles-plan-cells.css. */

/* ── Выпадашка ФИО с поиском ─────────────────────────────────────────────── */

/* Ширина ФИКСИРОВАННАЯ, а не max-content (как у общего .brigade-cell-menu):
   при длинной строке-подсказке меню раздувалось на пол-экрана и получало
   горизонтальную прокрутку (владелец, 2026-08-17). Теперь по горизонтали не
   растём вовсе, длинное имя обрезается ellipsis, а список прокручивается
   вертикально. */
.brigade-cell-menu.brigade-emp-menu {
  width: 320px;
  min-width: 320px;
  max-width: min(320px, 88vw);
  max-height: 260px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 8px;
}

/* Меню — grid (из .brigade-cell-wrap.open .brigade-cell-menu). У grid-элементов
   min-width: auto, поэтому длинное ФИО в одну строку распирало колонку шире
   меню и давало горизонтальную прокрутку. minmax(0, 1fr) + min-width: 0 у
   секций разрешают ужиматься — длинное имя обрезается ellipsis. */
.brigade-cell-wrap.open .brigade-cell-menu.brigade-emp-menu {
  grid-template-columns: minmax(0, 1fr);
}

.brigade-emp-section,
.brigade-emp-search-wrap,
.brigade-emp-note,
.brigade-cell-menu.brigade-emp-menu > .brigade-cell-option {
  min-width: 0;
}

.brigade-emp-search-wrap {
  padding-bottom: 4px;
}

.brigade-emp-search {
  width: 100%;
  min-height: 26px;
  border: 1px solid #9fb4cd;
  border-radius: 6px;
  background: #f7f9fd;
  color: #1d3353;
  padding: 0 8px;
  font: inherit;
  font-size: 11px;
  outline: none;
}

.brigade-emp-search:focus {
  border-color: #4779b6;
  background: #ffffff;
}

.brigade-emp-section-title {
  color: #7a8ba3;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 6px 6px 2px;
}

/* width: 100% обязателен: у <button> ширина shrink-to-fit, и с nowrap строка
   «ФИО + участок» вылезала за меню (427px при контейнере 302) — правая часть
   уезжала под обрез. Теперь строка ровно по ширине меню, длинное имя — ellipsis. */
.brigade-emp-option {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  white-space: nowrap;
  box-sizing: border-box;
}

.brigade-emp-opt-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.brigade-emp-opt-area {
  flex: 0 0 auto;
  max-width: 45%;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 9px;
  font-weight: 600;
  color: #2752a8;
  background: #e7effb;
  border-radius: 999px;
  padding: 1px 7px;
}

.brigade-emp-opt-area.is-empty {
  color: #94a3b8;
  background: #f1f4f9;
  font-weight: 500;
  font-style: italic;
}

/* Подсказка живёт ПОД списком и переносится по словам: строкой сверху она
   задавала ширину всему меню. */
.brigade-emp-note {
  color: #7a8ba3;
  font-size: 10px;
  line-height: 1.35;
  padding: 6px 6px 2px;
  margin-top: 4px;
  border-top: 1px solid #eef2f8;
  white-space: normal;
  overflow-wrap: anywhere;
}

.brigade-emp-empty {
  color: #7a8ba3;
  font-size: 11px;
  padding: 10px 6px;
  text-align: center;
  font-style: italic;
}

/* ── Участок бригады: только выбор ────────────────────────────────────────── */
/* Бейджа участка рядом с названием бригады нет намеренно (владелец,
   2026-08-17): участок служебный, живёт в диалоге «Бригада». */

/* Выбор участка — своя выпадашка (brigade-site-dialog.js): системный <select>
   рисует ОС, и ни высоту, ни прокрутку, ни поиск в нём не задать. */
.brigade-site-picker {
  position: relative;
  flex: 0 0 auto;
  width: 190px;
}

.brigade-site-picker-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-height: 32px;
  border: 1px solid #3d5f86;
  border-radius: 8px;
  background: #f7f9fd;
  color: #1f3556;
  padding: 4px 8px;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
  text-align: left;
}

.brigade-site-picker-value {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brigade-site-picker-value.is-empty {
  color: #7a8ba3;
}

/* Координаты и высоту ставит JS (position: fixed, brigade-site-dialog.js):
   диалог обрезает содержимое, и absolute-меню срезалось по его краю. */
.brigade-site-menu {
  position: fixed;
  z-index: 2147483000;
  display: none;
  width: 240px;
  max-width: 88vw;
  max-height: 240px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid #cfd8e5;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(17, 31, 56, 0.22);
  padding: 8px;
}

.brigade-site-picker.open .brigade-site-menu {
  display: block;
}

.brigade-site-search {
  width: 100%;
  min-height: 26px;
  border: 1px solid #9fb4cd;
  border-radius: 6px;
  background: #f7f9fd;
  color: #1d3353;
  padding: 0 8px;
  font: inherit;
  font-size: 11px;
  outline: none;
  margin-bottom: 4px;
}

.brigade-site-search:focus {
  border-color: #4779b6;
  background: #ffffff;
}

.brigade-site-option {
  display: block;
  width: 100%;
  min-height: 24px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  text-align: left;
  cursor: pointer;
  padding: 4px 8px;
  color: #1f3556;
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
}

.brigade-site-option:hover,
.brigade-site-option.is-active {
  background: #e7effb;
}

.brigade-site-clear {
  color: #7a8ba3;
}

.brigade-site-notfound,
.brigade-site-empty {
  color: #7a8ba3;
  font-size: 10px;
  line-height: 1.35;
  padding: 6px;
  white-space: normal;
}

/* Диалог «Редактор бригад» тёмный (см. .brigade-manager-dialog) — подписи
   светлые, как у .brigade-manager-color-title. Тёмный текст на тёмном фоне
   не читался вовсе. */
.brigade-site-only-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 2px 2px 10px;
  color: #d7e6ff;
  font-size: 12px;
}

.brigade-site-only-row .brigade-site-only-text {
  flex: 1 1 auto;
  line-height: 1.3;
}

.brigade-site-only-row .brigade-site-only-hint {
  display: block;
  color: #9fb8d8;
  font-size: 10px;
}

/* Участок в строке редактора бригад — панель под названием, открывается кнопкой
   «⚑», как цвет и переименование. Свой display НЕ задаём: базовый
   .brigade-edit-panel скрыт и раскрывается по .is-open — правило без этой
   оговорки держало панель открытой всегда. */
.brigade-edit-site-panel .brigade-site-picker {
  flex: 1 1 auto;
  width: auto;
}