/* Палитра раздела «АКТЫ». */
#componentActs {
  --docs-acts-color-muted: #a9abac;
  --docs-acts-color-nav-text: #d0d0d1;
  position: relative;
}

/* Каскад: недоступный уровень (секция без корпуса, этаж без секции) — приглушён и некликабелен. */
#componentActs .docs-acts-layout__project-navigation-chip--disabled {
  cursor: not-allowed;
  pointer-events: none;
}

#componentActs .docs-acts-layout__project-navigation-chip--close.docs-acts-layout__project-navigation-chip--close-visible {
  display: flex;
}

/* ==========================================================================
   TOOLBAR — поиск + счётчики «Согласованные / Отклонённые / Все»
   ========================================================================== */

#componentActs .docs-acts-toolbar {
  width: 100%;
  padding: 1.332vh 2.22vh;
  background: #292C30;
  border-radius: 1.332vh;
  display: flex;
  flex-direction: column;
  gap: 2.664vh;
  box-sizing: border-box;
  margin-bottom: 1.332vh;
}

#componentActs .docs-acts-toolbar__row {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#componentActs .docs-acts-toolbar__search {
  width: 60.162vh;
  height: 5.328vh;
  padding: 0.444vh 2.22vh;
  background: #13161B;
  border-radius: 0.888vh;
  display: flex;
  align-items: center;
  gap: 1.332vh;
  box-sizing: border-box;
}

#componentActs .docs-acts-toolbar__search-input {
  flex: 1 1 0;
  background: transparent;
  border: none;
  outline: none;
  box-shadow: none;
  color: var(--docs-acts-color-nav-text);
  font-size: 1.554vh;
  font-weight: 500;
  line-height: 1.998vh;
  caret-color: var(--docs-acts-color-nav-text);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

#componentActs .docs-acts-toolbar__search-input::placeholder {
  color: var(--docs-acts-color-muted);
}

#componentActs .docs-acts-toolbar__search-icon {
  width: 4.44vh;
  height: 4.44vh;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

#componentActs .docs-acts-toolbar__statuses {
  display: flex;
  align-items: center;
  gap: 0.888vh;
  border-radius: 0.888vh;
}

#componentActs .docs-acts-toolbar__status-button {
  display: flex;
  align-items: center;
  gap: 0.888vh;
  padding: 0.888vh;
  border-radius: 0.666vh;
  cursor: pointer;
  box-sizing: border-box;
}

#componentActs .docs-acts-toolbar__status-button--active {
  background: #3F4246;
}

#componentActs .docs-acts-toolbar__status-icon {
  width: 2.664vh;
  height: 2.664vh;
  display: block;
  flex-shrink: 0;
}

#componentActs .docs-acts-toolbar__status-label {
  color: var(--docs-acts-color-nav-text);
  font-size: 1.776vh;
  line-height: 2.22vh;
  font-weight: 500;
}

#componentActs .docs-acts-toolbar__status-count {
  min-width: 3.996vh;
  text-align: center;
  font-size: 1.776vh;
  line-height: 2.22vh;
  font-weight: 700;
}

#componentActs .docs-acts-toolbar__status-count--approved {
  color: #61C454;
}

#componentActs .docs-acts-toolbar__status-count--rejected {
  color: #F54F5F;
}

/* ==========================================================================
   LIST WRAPPER — общий контейнер под левую (категории) и правую (список) колонки
   ========================================================================== */

#componentActs .docs-acts-list-wrapper {
  width: 100%;
  display: flex;
  align-items: flex-start;
  background: #292C30;
  border-top-left-radius: 1.332vh;
  border-top-right-radius: 1.332vh;
  padding: 2.22vh 2.22vh 0 2.22vh;
  box-sizing: border-box;
}

/* ==========================================================================
   CATEGORIES — левая колонка-список категорий-папок
   ========================================================================== */

#componentActs .docs-acts-categories {
  width: 38.85vh;
  height: 59.274vh;
  padding: 2.22vh 1.11vh 2.22vh 2.22vh;
  background: #13161B;
  border-top-left-radius: 1.332vh;
  border-right: var(--app-border-width) solid #292C30;
  display: flex;
  flex-direction: column;
  gap: 0.888vh;
  box-sizing: border-box;
  flex-shrink: 0;
}

#componentActs .docs-acts-categories__item {
  display: inline-flex;
  align-items: center;
  gap: 0.888vh;
  padding: 1.332vh;
  border-radius: 0.888vh;
  cursor: pointer;
  box-sizing: border-box;
}

#componentActs .docs-acts-categories__item--active {
  background: #314335;
}

#componentActs .docs-acts-categories__icon {
  width: 2.664vh;
  height: 2.664vh;
  display: block;
  flex-shrink: 0;
  color: var(--docs-acts-color-nav-text);
  background-color: currentColor;
  -webkit-mask: url("../icons/component-acts-folder-line-fill.svg") center / contain no-repeat;
  mask: url("../icons/component-acts-folder-line-fill.svg") center / contain no-repeat;
}

#componentActs .docs-acts-categories__item--active .docs-acts-categories__icon {
  color: #61C454;
}

#componentActs .docs-acts-categories__label {
  width: 23.754vh;
  color: var(--docs-acts-color-nav-text);
  font-size: 1.776vh;
  line-height: 2.22vh;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#componentActs .docs-acts-categories__item--active .docs-acts-categories__label {
  color: #FFFFFF;
}

#componentActs .docs-acts-categories__count {
  width: 4.662vh;
  text-align: right;
  color: var(--docs-acts-color-nav-text);
  font-size: 1.776vh;
  line-height: 2.22vh;
  font-weight: 700;
  margin-left: auto;
}

#componentActs .docs-acts-categories__item--active .docs-acts-categories__count {
  color: #61C454;
}

/* Цветовые темы активной категории  */

#componentActs .docs-acts-categories__item--active.docs-acts-categories__item--theme-blue {
  background: #31404F;
}
#componentActs .docs-acts-categories__item--active.docs-acts-categories__item--theme-blue .docs-acts-categories__icon,
#componentActs .docs-acts-categories__item--active.docs-acts-categories__item--theme-blue .docs-acts-categories__count {
  color: #5FAFFF;
}

#componentActs .docs-acts-categories__item--active.docs-acts-categories__item--theme-green-flat {
  background: #292C30;
}

#componentActs .docs-acts-categories__item--active.docs-acts-categories__item--theme-yellow {
  background: #494429;
}
#componentActs .docs-acts-categories__item--active.docs-acts-categories__item--theme-yellow .docs-acts-categories__icon,
#componentActs .docs-acts-categories__item--active.docs-acts-categories__item--theme-yellow .docs-acts-categories__count {
  color: #FFCC00;
}

/* ==========================================================================
   LIST — правая колонка-список карточек актов
   ========================================================================== */

#componentActs .docs-acts-list {
  flex: 1 1 0;
  height: 59.274vh;
  padding: 2.22vh 2.22vh 2.22vh 1.11vh;
  background: #13161B;
  border-top-right-radius: 1.332vh;
  display: flex;
  flex-direction: column;
  gap: 0.888vh;
  box-sizing: border-box;
  overflow-y: auto;
}

#componentActs .docs-acts-list__empty {
  align-self: center;
  color: var(--docs-acts-color-muted);
  font-size: 1.776vh;
  line-height: 2.664vh;
  font-weight: 500;
}

#componentActs .docs-acts-list__card {
  padding: 1.332vh;
  background: #292C30;
  border-radius: 1.332vh;
  display: flex;
  flex-direction: column;
  gap: 0.888vh;
  box-sizing: border-box;
}

#componentActs .docs-acts-list__card[data-acts-has-file="true"] {
  cursor: pointer;
}

#componentActs .docs-acts-list__card-header {
  display: flex;
  align-items: center;
  gap: 0.888vh;
}

#componentActs .docs-acts-list__card-title {
  flex: 1 1 0;
  color: var(--docs-acts-color-nav-text);
  font-size: 1.776vh;
  line-height: 2.22vh;
  font-weight: 700;
}

#componentActs .docs-acts-list__status-label {
  display: inline-flex;
  align-items: center;
  gap: 0.888vh;
  padding: 0.444vh 0.888vh;
  background: #3F4246;
  border-radius: 0.666vh;
}

#componentActs .docs-acts-list__status-icon {
  width: 2.664vh;
  height: 2.664vh;
  display: block;
  flex-shrink: 0;
}

#componentActs .docs-acts-list__status-prefix {
  font-size: 1.554vh;
  line-height: 1.998vh;
  font-weight: 500;
}

#componentActs .docs-acts-list__status-prefix--approved {
  color: #61C454;
}

#componentActs .docs-acts-list__status-prefix--rejected {
  color: #F54F5F;
}

#componentActs .docs-acts-list__status-meta {
  color: var(--docs-acts-color-nav-text);
  font-size: 1.554vh;
  line-height: 1.998vh;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

#componentActs .docs-acts-list__card-subtitle {
  font-size: 1.554vh;
  line-height: 1.998vh;
  font-weight: 500;
}

#componentActs .docs-acts-list__card-subtitle--green {
  color: #61C454;
}

#componentActs .docs-acts-list__card-subtitle--blue {
  color: #5FAFFF;
}

#componentActs .docs-acts-list__card-subtitle--yellow {
  color: #FFCC00;
}

#componentActs .docs-acts-list__card-from,
#componentActs .docs-acts-list__card-date {
  width: 100%;
  height: 1.998vh;
  color: var(--docs-acts-color-muted);
  font-size: 1.554vh;
  line-height: 1.998vh;
  font-weight: 500;
}