/* claims.css — статус утверждения словами.

   Одиннадцатый файл дизайн-системы, свой в каждом из четырёх сайтов.
   Подключается последним: он единственный, кому положено переопределять
   .claim из components.css, и делает это ради двух вещей.

   Первая — легенда docx шире той, что была в components.css. Там четыре
   значения (fact · building · planned · stated), здесь шесть, названных
   заказчиком: fact · project · planned · forecast · dynamic · confirm.
   Прогноз и план в четырёх значениях сливались, а на этих страницах
   разница между «планируется» и «прогноз проекта» — это разница между
   обязательством и допущением.

   Вторая — подпись обязана быть текстом в потоке, а не цветом рамки.
   Цвет не доезжает до дальтоника, до чёрно-белой печати и до скриншота
   в мессенджере; слово доезжает везде. Поэтому .claim здесь перестаёт
   быть nowrap: «Требует подтверждения документом» на 360px не помещается
   в строку и обязано переноситься, а не уезжать за край экрана.

   Текст подписи напечатан дважды: здесь через ::after и в claims.js.
   Это не недосмотр. Js-подпись — основная (её видно в DOM, её читает
   поиск по странице и машинная приёмка), css-подпись — запасная, на случай
   отключённого js. Модуль ставит data-claim-labeled, и ::after гаснет,
   так что одновременно они не появляются никогда. */

.claim {
  /* Длинная подпись переносится внутри метки, а не рвёт раскладку. */
  white-space: normal;
  /* Раз перенос разрешён, интерлиньяж обязан перестать быть плоским.
     В components.css у .claim стоит --as-lh-flat — он рассчитан на метку
     ровно в одну строку и вместе с nowrap был безопасен. Здесь nowrap снят,
     и на «Требует подтверждения документом» вторая строка наезжала на первую:
     буквы с выносными элементами сталкивались. Строчный шаг обычного текста
     разводит строки и ничего больше в метке не двигает. */
  line-height: var(--as-lh-body);
  flex-wrap: wrap;
  max-width: 100%;
  text-transform: none;
  align-items: baseline;
}

/* Точка-маркер не должна сжиматься до нуля, когда текст занял всю строку. */
.claim::before {
  flex: none;
  align-self: center;
}

/* Подпись статуса. Капслок оставлен только ей: собственный текст метки
   («Съёмки не было») — обычное предложение, а статус — служебная пометка,
   и на странице они обязаны различаться до чтения. */
.claim-label {
  display: inline;
  text-transform: uppercase;
  letter-spacing: var(--as-tr-micro);
  font-weight: var(--as-w-medium);
  opacity: 0.85;
}

/* ---------- Шесть значений легенды ----------
   Цвет — вторая подсказка, а не единственная. Первая всегда слово.

   Каноническая запись атрибута — строчные слова через пробел:
   data-claim="forecast dynamic". Селектор ~= другой формы не понимает,
   поэтому claims.js приводит к ней всё, что написано иначе («FORECAST +
   DYNAMIC», «project, confirm»), и переписывает атрибут. Разметке достаточно
   держаться канонической записи, и тогда состояние есть ещё до js. */

.claim[data-claim~="fact"] {
  color: var(--as-text-on-dark);
  border-color: var(--as-line-on-dark);
  border-style: solid;
}

.claim[data-claim~="project"] {
  color: var(--as-text-on-dark);
  border-color: var(--as-line-on-dark);
  border-style: solid;
  opacity: 0.92;
}

.claim[data-claim~="planned"] {
  color: var(--as-text-on-dark-mute);
  border-color: var(--as-line-on-dark);
  border-style: dashed;
}

.claim[data-claim~="forecast"] {
  color: var(--as-accent-400);
  border-color: var(--as-accent-400);
  border-style: dashed;
}

.claim[data-claim~="dynamic"] {
  color: var(--as-accent-400);
  border-color: var(--as-accent-400);
  border-style: dotted;
}

.claim[data-claim~="confirm"] {
  color: var(--as-text-on-dark-mute);
  border-color: var(--as-line-on-dark);
  border-style: dotted;
}

.claim[data-claim~="confirm"]::before,
.claim[data-claim~="dynamic"]::before {
  background: transparent;
  box-shadow: inset 0 0 0 1px currentColor;
}

/* Кремовый регистр: та же логика, свои значения контраста. */
.on-light .claim[data-claim~="fact"],
.on-light .claim[data-claim~="project"] {
  color: var(--as-text-on-light);
  border-color: var(--as-line-on-light);
}

.on-light .claim[data-claim~="planned"],
.on-light .claim[data-claim~="confirm"] {
  color: var(--as-text-on-light-mute);
  border-color: var(--as-line-on-light);
}

.on-light .claim[data-claim~="forecast"],
.on-light .claim[data-claim~="dynamic"] {
  color: var(--as-accent-500);
  border-color: var(--as-accent-500);
}

/* ---------- Запасная подпись без js ----------
   Работает ровно до того момента, как claims.js поставит свою. У составного
   статуса без js видна одна подпись из двух: ::after у элемента один, и второй
   ему взяться неоткуда. Это осознанный предел запасного варианта — полную
   подпись собирает модуль. */

.claim[data-claim~="fact"]::after { content: " · Подтверждённый факт"; }
.claim[data-claim~="project"]::after { content: " · По данным проекта"; }
.claim[data-claim~="planned"]::after { content: " · Планируется"; }
.claim[data-claim~="forecast"]::after { content: " · Прогноз проекта"; }
.claim[data-claim~="dynamic"]::after { content: " · Требует обновления перед публикацией"; }
.claim[data-claim~="confirm"]::after { content: " · Требует подтверждения документом"; }

.claim[data-claim-labeled]::after {
  content: none;
}

/* На узком экране метка перестаёт быть строкой и становится абзацем:
   так подпись видна целиком, а не обрезана по краю вьюпорта. */
@media (max-width: 599px) {
  .claim {
    display: flex;
    width: 100%;
  }
}