/* styles-report-fact.css — UX-макет «Отчёт факт» (тёмная тема, семейство Дашборда).
   Префикс классов: rfact-. Бэкенда пока нет — это вёрстка прототипа. */

.page-shell.report-fact-mode {
  height: var(--report-fact-shell-height, auto);
  overflow: hidden;
  padding: 0;
  background: transparent;
  border: none;
}

.rfact-shell {
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 4px;
  border: 1px solid rgba(102, 133, 189, 0.36);
  border-radius: 16px;
  background:
    radial-gradient(840px 360px at 16% -26%, rgba(90, 153, 255, 0.08), transparent 60%),
    radial-gradient(760px 320px at 98% -16%, rgba(120, 100, 240, 0.07), transparent 62%),
    linear-gradient(180deg, rgba(10, 24, 49, 0.96), rgba(8, 18, 36, 0.98));
  color: #c6d5ee;
}

/* ── Тулбар ─────────────────────────────────────────────────────────────── */
.rfact-toolbar {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(106, 141, 204, 0.45);
  border-radius: 12px;
  background: linear-gradient(180deg, #233f78, #203763);
}

.rfact-toolbar-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.rfact-toolbar-right {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Чип месяца наверху тулбара — в стиле даты/времени Дашборда (иконка + текст). */
.rfact-month-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 32px;
  padding: 0 13px;
  border-radius: 9px;
  border: 1px solid rgba(106, 141, 204, 0.4);
  background: rgba(13, 28, 60, 0.5);
  color: #aebfdc;
  font-size: 12.5px;
  font-weight: 600;
}
.rfact-month-chip b {
  color: #eaf2ff;
  font-weight: 700;
  text-transform: capitalize;
}
/* Чип периода действия целей «от — до» рядом с месяцем. */
.rfact-period-chip {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 12px;
  border-radius: 9px;
  border: 1px solid rgba(106, 141, 204, 0.28);
  background: rgba(13, 28, 60, 0.35);
  color: #8ea4c8;
  font-size: 11.5px;
  white-space: nowrap;
}
.rfact-period-chip b { color: #c6d6f3; font-weight: 600; }
/* Пометка «было N, ±M» под итоговой целью в таблице «Цели по операциям». */
.rfact-goal-cell { line-height: 1.15; }
.rfact-goal-note {
  display: block;
  margin-top: 1px;
  font-size: 9.5px;
  font-weight: 500;
  color: #8aa0c6;
  white-space: nowrap;
}
.rfact-month-chip svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: #7db8ff;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rfact-filter-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 14px;
  border-radius: 9px;
  border: 1px solid rgba(106, 141, 204, 0.45);
  background: rgba(13, 28, 60, 0.5);
  color: #bcd0ef;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  transition: filter 0.15s, background 0.15s;
}
.rfact-filter-btn:hover {
  filter: brightness(1.14);
}
.rfact-filter-btn.is-active {
  background: rgba(58, 127, 212, 0.24);
  border-color: rgba(90, 153, 255, 0.55);
  color: #dceaff;
}
/* Фильтр содержит непустой выбор — зелёный акцент + точка-индикатор. */
.rfact-filter-btn.has-filter {
  border-color: rgba(47, 174, 107, 0.6);
  color: #9ce6bf;
}
.rfact-filter-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4fd6a0;
  box-shadow: 0 0 0 2px rgba(47, 174, 107, 0.25);
}

/* Выпадающая панель фильтра — раскрывается/убирается, поля «в длину». */
.rfact-filter-panel {
  display: none;
}

.rfact-filter-panel.open {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(106, 141, 204, 0.4);
  border-radius: 10px;
  background: rgba(13, 28, 60, 0.55);
}

.rfact-filter-line {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 14px;
}

/* Группа кнопок в конце строки фильтра (на месте бывшего «№ операции»). */
.rfact-line-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  align-self: flex-end;
}

.rfact-period-group {
  display: inline-flex;
  border: 1px solid rgba(120, 150, 210, 0.3);
  border-radius: 9px;
  overflow: hidden;
  background: rgba(8, 18, 36, 0.5);
}

.rfact-period {
  appearance: none;
  border: none;
  background: transparent;
  color: #bcd0ef;
  font-size: 12px;
  font-weight: 600;
  padding: 7px 13px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.rfact-period + .rfact-period {
  border-left: 1px solid rgba(120, 150, 210, 0.22);
}

.rfact-period:hover {
  color: #dceaff;
}

.rfact-period.is-active {
  background: linear-gradient(180deg, #2f6fd0, #2456a8);
  color: #fff;
}

/* Поле фильтра: подпись сверху, контрол снизу. */
.rfact-ff {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 10px;
  color: #a7bde0;
}

.rfact-ff > span {
  font-weight: 600;
  letter-spacing: 0.2px;
}

.rfact-ff input,
.rfact-ff select {
  appearance: none;
  height: 30px;
  border: 1px solid rgba(120, 150, 210, 0.42);
  border-radius: 8px;
  background: rgba(10, 22, 46, 0.7);
  color: #eaf2ff;
  font-size: 12px;
  padding: 0 9px;
  color-scheme: dark;
}

.rfact-ff-date input {
  width: 132px;
}

.rfact-ff select {
  min-width: 150px;
}

.rfact-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 14px;
  border-radius: 9px;
  border: 1px solid transparent;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: filter 0.15s, background 0.15s;
}

.rfact-btn.is-apply {
  background: linear-gradient(180deg, #2f6fd0, #2456a8);
  color: #fff;
}

.rfact-btn.is-ghost {
  background: rgba(120, 140, 180, 0.12);
  border-color: rgba(120, 150, 210, 0.3);
  color: #cdddf6;
}

.rfact-btn.is-outline {
  background: rgba(47, 174, 107, 0.12);
  border-color: rgba(47, 174, 107, 0.45);
  color: #8be3b6;
}

.rfact-btn:hover {
  filter: brightness(1.12);
}

/* «Цели производства» — статичная плашка (не кнопка): держит ширину тулбара,
   на клик/ховер не реагирует. Логики нет — только визуальный заголовок-маркер. */
.rfact-goal-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 14px;
  border-radius: 9px;
  border: 1px solid rgba(47, 174, 107, 0.45);
  background: rgba(47, 174, 107, 0.12);
  color: #8be3b6;
  font-size: 12px;
  font-weight: 600;
  cursor: default;
  user-select: none;
}

.rfact-btn-ico svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ── KPI-карточки ───────────────────────────────────────────────────────── */
.rfact-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.rfact-kpi {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 11px 16px;
  border-radius: 14px;
  border: 1px solid rgba(106, 141, 204, 0.45);
  background: linear-gradient(180deg, #233f78, #203763);
  box-shadow: inset 0 1px 0 rgba(204, 223, 255, 0.08);
  min-height: 74px;
}

/* Шапка карточки: иконка вплотную к заголовку, наверху. */
.rfact-kpi-head {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 6px;
}
.rfact-kpi-ico-sm {
  display: inline-flex;
  flex-shrink: 0;
}
.rfact-kpi-ico-sm svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
/* Заголовок карточки — единая стилистика с заголовками панелей (UPPERCASE, 760),
   чтобы он читался как «шапка блока», а не терялся под числами. */
.rfact-kpi-label {
  font-size: 11.5px;
  color: #a7bde0;
  font-weight: 760;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.rfact-kpi-value {
  font-size: 27px;
  font-weight: 800;
  color: #eaf2ff;
  line-height: 1.05;
  display: flex;
  align-items: baseline;
  gap: 5px;
}

.rfact-kpi-unit {
  font-size: 12px;
  font-weight: 500;
  color: #a7bde0;
}

.rfact-kpi-sub {
  margin-top: 4px;
  font-size: 10.5px;
  color: #9fb6d9;
}

/* KPI раздельно по единицам учёта. Единицы текут ГОРИЗОНТАЛЬНО (вправо, в
   свободное место карточки) и переносятся — карточка не растёт вниз, ширина
   фиксирована сеткой. */
.rfact-kpi-body {
  flex: 1 1 auto;
  min-width: 0;
}
.rfact-kpi-units {
  display: grid;
  grid-template-columns: repeat(3, max-content);
  align-items: baseline;
  column-gap: 26px;
  row-gap: 4px;
}
/* Много единиц (>6, до ~12): мельче + 6 колонок (6 сверху / 6 снизу). */
.rfact-kpi-units.is-dense {
  grid-template-columns: repeat(6, max-content);
  column-gap: 16px;
  row-gap: 3px;
}
.rfact-kpi-uline {
  display: flex;
  align-items: baseline;
  gap: 5px;
  line-height: 1.1;
}
.rfact-kpi-uval {
  font-size: 16px;
  font-weight: 700;
  color: #eaf2ff;
}
.rfact-kpi-units.is-dense .rfact-kpi-uval {
  font-size: 14px;
}
.rfact-kpi-units.is-dense .rfact-kpi-unit {
  font-size: 11px;
}
.rfact-kpi-empty .rfact-kpi-uval {
  color: #8aa0c6;
}

.rfact-empty-cell {
  padding: 16px;
  text-align: center;
  color: #8aa0c6;
  font-size: 12px;
}
.rfact-loading {
  padding: 4px 2px 0;
  color: #9fb6d9;
  font-size: 12px;
}

/* Круглый бейдж с процентом справа (вместо прежней иконки). */
.rfact-kpi-pct {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12.5px;
  font-weight: 800;
  border: 2px solid transparent;
}
.rfact-kpi.is-blue .rfact-kpi-pct { background: rgba(90, 153, 255, 0.14); color: #9cc4ff; border-color: rgba(90, 153, 255, 0.5); }
.rfact-kpi.is-teal .rfact-kpi-pct { background: rgba(43, 182, 168, 0.16); color: #4fd6c6; border-color: rgba(43, 182, 168, 0.5); }
.rfact-kpi.is-green .rfact-kpi-pct { background: rgba(47, 174, 107, 0.16); color: #5fd29a; border-color: rgba(47, 174, 107, 0.5); }
.rfact-kpi.is-amber .rfact-kpi-pct { background: rgba(239, 169, 60, 0.16); color: #f0b54a; border-color: rgba(239, 169, 60, 0.5); }
.rfact-kpi.is-purple .rfact-kpi-pct { background: rgba(139, 124, 240, 0.16); color: #a394ff; border-color: rgba(139, 124, 240, 0.5); }
.rfact-kpi.is-red .rfact-kpi-pct { background: rgba(232, 93, 110, 0.16); color: #ff7d8c; border-color: rgba(232, 93, 110, 0.5); }

/* Шапка (иконка + заголовок) — тон-акцент. */
.rfact-kpi.is-blue .rfact-kpi-head { color: #a3cbff; }
.rfact-kpi.is-teal .rfact-kpi-head { color: #5fe0d0; }
.rfact-kpi.is-green .rfact-kpi-head { color: #82e3b2; }
.rfact-kpi.is-amber .rfact-kpi-head { color: #ffc96a; }
.rfact-kpi.is-red .rfact-kpi-head { color: #ff8b98; }
.rfact-kpi.is-purple .rfact-kpi-head { color: #b3a6ff; }

/* Цвет заголовка карточки = акцент тона (как в образце). */
.rfact-kpi.is-blue .rfact-kpi-label { color: #a3cbff; }
.rfact-kpi.is-teal .rfact-kpi-label { color: #5fe0d0; }
.rfact-kpi.is-green .rfact-kpi-label { color: #82e3b2; }
.rfact-kpi.is-amber .rfact-kpi-label { color: #ffc96a; }
.rfact-kpi.is-red .rfact-kpi-label { color: #ff8b98; }
.rfact-kpi.is-purple .rfact-kpi-label { color: #b3a6ff; }

/* ── Аналитические панели ───────────────────────────────────────────────── */
/* 2 ряда: [Статусы | Цели по операциям] сверху, [Участки | По мастерам] снизу.
   Таблицы «Цели» и «Мастера» выросли — им отдаём широкие колонки (2-3). */
.rfact-panels {
  display: grid;
  grid-template-columns: 1.2fr 1.45fr 1.4fr;
  grid-template-rows: 1fr 1fr;
  grid-template-areas:
    "status goals  goals"
    "sect   master master";
  gap: 10px;
  flex: 1 1 0;
  min-height: 0;
}
.rfact-panel-status { grid-area: status; }
.rfact-panel-goals  { grid-area: goals; }
.rfact-panel-sect   { grid-area: sect; }
.rfact-panel-master { grid-area: master; }

.rfact-panel {
  border: 1px solid rgba(106, 141, 204, 0.45);
  border-radius: 14px;
  background: linear-gradient(180deg, #233f78, #203763);
  box-shadow: inset 0 1px 0 rgba(204, 223, 255, 0.08);
  padding: 11px 12px;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.rfact-panel-title {
  flex: 0 0 auto;
}

.rfact-bars {
  flex: 1 1 auto;
}

/* «По мастерам» — таблица со скроллом, занимает высоту блока. */
.rfact-master-wrap {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(143, 171, 221, 0.45) transparent;
}
.rfact-master-wrap::-webkit-scrollbar { width: 6px; }
.rfact-master-wrap::-webkit-scrollbar-track { background: transparent; }
.rfact-master-wrap::-webkit-scrollbar-thumb {
  background: rgba(143, 171, 221, 0.45);
  border-radius: 3px;
}
.rfact-master-table {
  table-layout: fixed;
}
/* Селектор с .rfact-master-wrap — чтобы перенос строки в шапке выиграл у более
   позднего .rfact-mini-table th { white-space: nowrap } (длинные названия в 2 строки). */
.rfact-master-wrap .rfact-master-table th {
  position: sticky;
  top: 0;
  background: #213a6c;
  z-index: 1;
  white-space: normal;
  line-height: 1.15;
  vertical-align: bottom;
}
.rfact-master-table td { white-space: nowrap; }
.rfact-mst-name {
  font-weight: 600;
  color: #eaf2ff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Цифры статусов в «По мастерам» — жирные; цвет задаётся инлайн из
   REPORT_FACT_STATUS_VIEW (тот же, что у легенды «Статусы выполнения»). */
.rfact-mst-val { font-weight: 700; }

/* «По участкам» — группа на участок, внутри строка на каждую ед. учёта. */
.rfact-sect-group {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.rfact-sect-name {
  font-size: 12px;
  font-weight: 700;
  color: #a7bde0;
}
/* Участок, выбранный в фильтре — подсвечиваем чипом-акцентом. */
.rfact-sect-name.is-selected {
  align-self: flex-start;
  padding: 2px 9px;
  border-radius: 7px;
  color: #dceaff;
  background: rgba(58, 127, 212, 0.26);
  border: 1px solid rgba(90, 153, 255, 0.55);
}
.rfact-sect-units {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.rfact-su-row,
.rfact-su-head {
  display: grid;
  /* План справа в своей колонке, Факт слева в своей → числа близко друг к другу;
     остаток колонки «Факт» даёт воздух между Фактом и индикатором. */
  grid-template-columns: 40px 52px 48px 1fr 48px;
  align-items: center;
  column-gap: 7px;
  font-size: 11.5px;
}
/* Шапка колонок «План / Факт» — мелкие подписи над числами. */
.rfact-su-head { align-items: end; margin-bottom: 1px; }
.rfact-su-cap {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #8aa0c6;
}
.rfact-su-cap.is-plan { text-align: right; }
.rfact-su-cap.is-fact { text-align: left; padding-left: 10px; }
.rfact-su-unit { color: #a7bde0; }
.rfact-su-plan { color: #d6e4fb; font-weight: 600; white-space: nowrap; text-align: right; }
/* padding-left — адекватный зазор между Планом и Фактом (не впритык). */
.rfact-su-fact { color: #d6e4fb; font-weight: 600; white-space: nowrap; text-align: left; padding-left: 10px; }
.rfact-su-track {
  height: 9px;
  border-radius: 5px;
  background: rgba(8, 18, 38, 0.4);
  overflow: hidden;
}
.rfact-su-fill {
  display: block;
  height: 100%;
  border-radius: 5px;
  background: linear-gradient(90deg, #4e8ed4, #6fb0f0);
}
.rfact-su-pct { color: #a7bde0; text-align: right; }

/* «Цели по операциям» — таблица со скроллом, занимает высоту блока. */
.rfact-panel-goals {
  display: flex;
  flex-direction: column;
}

.rfact-goals-wrap {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(143, 171, 221, 0.45) transparent;
}

.rfact-goals-wrap::-webkit-scrollbar {
  width: 6px;
}

.rfact-goals-wrap::-webkit-scrollbar-track {
  background: transparent;
}

.rfact-goals-wrap::-webkit-scrollbar-thumb {
  background: rgba(143, 171, 221, 0.4);
  border-radius: 999px;
}

.rfact-goals-wrap::-webkit-scrollbar-thumb:hover {
  background: rgba(143, 171, 221, 0.65);
}

.rfact-goals-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 12px;
}

.rfact-goals-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #233f78;
  color: #a7bde0;
  font-weight: 600;
  text-align: left;
  padding: 6px 6px;
  line-height: 1.15;
  border-bottom: 1px solid rgba(106, 141, 204, 0.45);
}

.rfact-goals-table tbody td {
  padding: 8px 6px;
  color: #d6e4fb;
  border-bottom: 1px solid rgba(106, 141, 204, 0.18);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rfact-goals-table tbody tr:hover td {
  background: rgba(90, 153, 255, 0.08);
}

.rfact-goals-name {
  white-space: normal;
}

.rfact-goals-table .t-center { text-align: center; }
/* Отступ справа у последней колонки «Выполнено в %» — значения уводим ощутимо
   левее от скроллбара (16px на широкой панели почти незаметно). */
.rfact-goals-table .t-right { text-align: right; padding-right: 32px; }

/* Заголовки панелей — в стиле h3 Дашборда: иконка + UPPERCASE, контрастно. */
.rfact-panel-title {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 760;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #e7f1ff;
  display: flex;
  align-items: center;
  gap: 6px;
}
/* «(все)» рядом с «По участкам» в режиме без фильтра — мелкий шрифт как у План/Факт.
   text-transform:none — показываем строчными, как ввёл пользователь (заголовок — uppercase). */
.rfact-panel-sub {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: none;
  color: #8aa0c6;
}
.rfact-panel-title .rfact-h3-ico {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: #9fc0ff;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}

/* статусы / кольцо — колонкой, чтобы плотно заполнять высокий блок */
.rfact-status-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

.rfact-donut-wrap {
  flex: 0 0 auto;
  width: 118px;
}

.rfact-donut {
  width: 118px;
  height: 118px;
  transform: rotate(-90deg);
}

.rfact-donut-seg {
  transition: stroke-dasharray 0.4s;
}

.rfact-donut-center {
  transform: rotate(90deg);
  transform-origin: 21px 21px;
}

.rfact-donut-num {
  fill: #eaf2ff;
  font-size: 7px;
  font-weight: 800;
  text-anchor: middle;
}

.rfact-donut-cap {
  fill: #a7bde0;
  font-size: 3.4px;
  text-anchor: middle;
}

.rfact-legend {
  flex: 1 1 auto;
  width: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.rfact-legend-row {
  display: grid;
  grid-template-columns: 10px 1fr auto auto;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}

.rfact-legend-dot {
  width: 9px;
  height: 9px;
  border-radius: 3px;
}

.rfact-legend-label {
  color: #dbe7fb;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rfact-legend-val {
  color: #eaf2ff;
  font-weight: 700;
}

.rfact-legend-pct {
  color: #a7bde0;
  min-width: 38px;
  text-align: right;
}

/* мини-таблицы */
.rfact-mini-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.rfact-mini-table th {
  text-align: left;
  color: #a7bde0;
  font-weight: 600;
  padding: 6px 6px;
  border-bottom: 1px solid rgba(104, 138, 197, 0.25);
  white-space: nowrap;
}

.rfact-mini-table td {
  padding: 11px 6px;
  color: #d6e4fb;
  border-bottom: 1px solid rgba(104, 138, 197, 0.12);
}

.rfact-mini-total td {
  font-weight: 700;
  color: #eaf2ff;
  border-top: 1px solid rgba(104, 138, 197, 0.35);
  border-bottom: none;
}

.rfact-strong {
  color: #7db8ff;
  font-weight: 700;
}

/* список групп участков (вертикальный, со скроллом при переполнении) */
.rfact-bars {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 12px;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  scrollbar-width: thin;
  scrollbar-color: rgba(143, 171, 221, 0.45) transparent;
}
.rfact-bars::-webkit-scrollbar { width: 6px; }
.rfact-bars::-webkit-scrollbar-track { background: transparent; }
.rfact-bars::-webkit-scrollbar-thumb {
  background: rgba(143, 171, 221, 0.45);
  border-radius: 3px;
}

.rfact-mini-table .t-center { text-align: center; }
.rfact-mini-table .t-right { text-align: right; }

@media (max-width: 1400px) {
  .rfact-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Цвет процента по движению (однотипно с кольцами «Производственного заказа»):
   0% — нейтральный (движения нет), 1–50% — синий, >50% — зелёный.
   Правила в конце файла — перебивают базовый цвет .rfact-su-pct / .rfact-legend-pct / .rfact-strong. */
.rfact-pct-zero { color: #a7bde0; }
.rfact-pct-low  { color: #7db8ff; }
.rfact-pct-high { color: #5fd29a; }
/* Таблица «Цели по операциям»: базовое .rfact-goals-table tbody td специфичнее —
   перебиваем для колонки «Выполнено в %». */
.rfact-goals-table tbody td.rfact-pct-zero { color: #a7bde0; }
.rfact-goals-table tbody td.rfact-pct-low  { color: #7db8ff; }
.rfact-goals-table tbody td.rfact-pct-high { color: #5fd29a; }