/* Таблица публикаций: все публикации по дате (новое сверху).
   Новые визуально не отличаются — у них свой блок на главной
   (isNew живёт в данных и фильтре ?new). Фильтрация и группировка —
   static/js/pubs-table.js, состояние в URL (?market=…, ?group=markets…).
   Под h1 на /publications/ — ряд тегов-фильтров (рынки и команды),
   над таблицей — чип активного фильтра для остальных измерений.
   Пины — личные закладки читателя (localStorage), собираются в группу
   «Всегда под рукой» наверху; строка остаётся и на своём месте (копия).
   На /publications/ (data-pins="separate") пины — отдельной табличкой
   со спейсером, а у основной появляется заголовок «Всё-всё-всё».
   Под таблицей на главной — контурная пилюля «Все публикации» (pill.css). */

.ids .ids__pubs {
  margin-top: 1.6em;
}

.ids .ids__pubs table {
  width: 100%;
}

/* Одинаковые ширины колонок во всех таблицах: название — половина,
   дата и булавка — ровно по содержимому (width 1% + nowrap), остальное — авторам */
.ids .ids__pubs--title {
  width: 50%;
}

.ids .ids__pubs td.ids__pubs--date {
  width: 1%;
  text-align: right;
  padding-right: 0;
}

.ids .ids__pubs td {
  padding: 0.55em 1em 0.55em 0;
  /* Одна тонкая светлая линейка снизу (перебивает бордер из ids.css —
     иначе бордеры складывались в двойную толщину) */
  border-bottom: var(--ids__border-width-s) solid var(--ids__border);
  vertical-align: baseline;
}

/* Ссылкой работает вся строка — переход по клику ставит pubs-table.js
   (data-href): псевдоэлемент-оверлей не годится, Safari не делает tr
   containing block, и оверлеи всех строк ложились на всю таблицу.
   Настоящая ссылка — название; пилюли и булавка кликабельны сами по себе */
.ids .ids__pubs--row {
  cursor: pointer;
}

.ids .ids__pubs--title a {
  text-decoration: none;
  transition: color var(--ids__duration-base) var(--ids__easing-base);
}

/* Авторы — обычным текстом через запятую, кеглем даты; каждое имя — ссылка
   на фильтр. Ховер строки красит всю ячейку, собственный ховер имени —
   подчёркивание */
.ids .ids__pubs td.ids__pubs--authors {
  font-size: 0.8em;
  color: var(--ids__caption);
  transition: color var(--ids__duration-base) var(--ids__easing-base);
}

/* Собственный ховер имени — подложка ховер-цвета (подчёркивание по ховеру
   не появляется нигде — не наш паттерн); микро-паддинги только по вертикали,
   на строку они не влияют */
.ids .ids__pubs--author {
  color: inherit;
  text-decoration: none;
  padding: 0.12em 0;
  border-radius: var(--ids__radius-s);
  transition: background-color var(--ids__duration-base) var(--ids__easing-base);
}

.ids .ids__pubs--author:hover {
  background: color-mix(in srgb, var(--ids__hover) 10%, transparent);
  transition-duration: var(--ids__duration-instant);
}

/* Дата — чуть мельче авторов, по общей базовой линии
   (vertical-align: baseline у ячеек) */
.ids .ids__pubs td.ids__pubs--date {
  font-size: 0.76em;
  color: var(--ids__caption);
  white-space: nowrap;
  transition: color var(--ids__duration-base) var(--ids__easing-base);
}

/* Ховер строки перекрашивает всё содержимое, включая пилюли (фон светлее);
   ховер самой пилюли — фон чуть темнее.
   Паттерн анимации везде один: ховер мгновенно, расховер 0.3s ease.
   Мгновенная длительность — только на собственном ховере элемента,
   иначе пилюля теряла свой ховер мгновенно, пока курсор оставался в строке */
.ids .ids__pubs--row:hover .ids__pubs--title a,
.ids .ids__pubs--row:hover td.ids__pubs--authors,
.ids .ids__pubs--row:hover td.ids__pubs--date {
  color: var(--ids__hover);
  transition-duration: var(--ids__duration-instant);
}

/* Булавка: видна по ховеру строки, по фокусу и в закреплённом состоянии;
   на тач-устройствах ховера нет — видна всегда, бледно */
/* Вся ячейка — зона клика булавки (ловит pubs-table.js), не только иконка;
   её ховер красит булавку так же, как собственный */
.ids .ids__pubs td.ids__pubs--pin-cell {
  width: 1%;
  padding-left: 1.2em;
  padding-right: 0;
}

/* Инлайн-блок без текста: базовая линия — его нижний край, поэтому
   низ булавки ложится на базовую линию первой строки, как дата */
.ids .ids__pubs--pin {
  display: inline-block;
  vertical-align: baseline;
  /* Оптически: чуть ниже и левее базовой линии */
  position: relative;
  top: 0.1em;
  left: -0.2em;
  padding: 0 0.2em;
  margin: 0;
  border: 0;
  background: none;
  color: var(--ids__caption);
  cursor: pointer;
  opacity: 0;
  transition:
    opacity var(--ids__duration-base) var(--ids__easing-base),
    color var(--ids__duration-base) var(--ids__easing-base);
}

/* Булавка (src/includes/pin-icon.svg, viewBox 16 × 20): головка-кружок
   с тенью-дугой и иголка. Закреплённая — «воткнута»: тело съезжает вниз
   ровно на столько, на сколько укорачивается иголка (stroke-dasharray), —
   кончик остаётся на месте, в дырке-эллипсе, двигается только головка;
   плюс лёгкий наклон вокруг кончика */
.ids .ids__pubs--pin svg {
  display: block;
  width: 0.88em;
  height: 1.1em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  overflow: visible;
}

/* Две фазы: сначала втыкание (сдвиг тела вниз + укорочение иголки + дырка),
   потом наклон с небольшим нахлёстом; при отпине — в обратном порядке.
   Сдвиг — на внешней группе, наклон — на внутренней (у transform одна
   длительность, а фазам нужны разные задержки) */
.ids .ids__pubs--pin-body,
.ids .ids__pubs--pin-needle,
.ids .ids__pubs--pin-hole {
  transition-duration: 0.22s;
  transition-timing-function: var(--ids__easing-base);
  transition-delay: 0.14s;
}

.ids .ids__pubs--pin-body { transition-property: transform; }

.ids .ids__pubs--pin-needle {
  /* Полная длина 9; воткнутая — 6, тело при этом съезжает на те же 3 */
  stroke-dasharray: 9 9;
  transition-property: stroke-dasharray;
}

.ids .ids__pubs--pin-hole {
  fill: currentColor;
  stroke: none;
  opacity: 0;
  transition-property: opacity;
}

.ids .ids__pubs--pin-tilt {
  /* Ось наклона — кончик иголки в воткнутом состоянии (до сдвига вниз) */
  transform-origin: 8px 14.5px;
  transition: transform 0.2s var(--ids__easing-base) 0s;
}

.ids .ids__pubs--pin[aria-pressed="true"] .ids__pubs--pin-body,
.ids .ids__pubs--pin[aria-pressed="true"] .ids__pubs--pin-needle,
.ids .ids__pubs--pin[aria-pressed="true"] .ids__pubs--pin-hole {
  transition-delay: 0s;
}

.ids .ids__pubs--pin[aria-pressed="true"] .ids__pubs--pin-body {
  transform: translateY(3px);
}

.ids .ids__pubs--pin[aria-pressed="true"] .ids__pubs--pin-needle {
  stroke-dasharray: 6 9;
}

.ids .ids__pubs--pin[aria-pressed="true"] .ids__pubs--pin-hole {
  opacity: 1;
}

.ids .ids__pubs--pin[aria-pressed="true"] .ids__pubs--pin-tilt {
  transform: rotate(-16deg);
  transition-delay: 0.16s;
}

@media (prefers-reduced-motion: reduce) {
  .ids .ids__pubs--pin-body,
  .ids .ids__pubs--pin-needle,
  .ids .ids__pubs--pin-hole,
  .ids .ids__pubs--pin-tilt {
    transition: none;
  }
}

.ids .ids__pubs--row:hover .ids__pubs--pin,
.ids .ids__pubs--pin:focus-visible,
.ids .ids__pubs--pin[aria-pressed="true"] {
  opacity: 1;
  transition-duration: var(--ids__duration-instant);
}

@media (hover: none) {
  .ids .ids__pubs--pin {
    opacity: 0.5;
  }
}

.ids .ids__pubs--pin-cell:hover .ids__pubs--pin {
  color: var(--ids__hover);
  transition-duration: var(--ids__duration-instant);
}

/* Строки, которые добавляются и убираются при пине/отпине (копия, заголовок
   группы, «Всё-всё-всё»), раскрываются и схлопываются по высоте, чтобы контент
   ниже не прыгал. У tr высоту не анимировать, поэтому в ноль уходят ячейки:
   кегль, интерлиньяж, паддинги и линейка (всё содержимое — в em) */
.ids .pinned-new > td,
.ids .pinned-new > th {
  animation: ids__pubs-row-in var(--ids__duration-base) var(--ids__easing-base);
}

.ids .pinned-leaving > td,
.ids .pinned-leaving > th {
  animation: ids__pubs-row-out var(--ids__duration-base) var(--ids__easing-base) forwards;
}

@keyframes ids__pubs-row-in {
  from {
    font-size: 0;
    line-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-bottom-width: 0;
    opacity: 0;
  }
  55% { opacity: 0; }
}

@keyframes ids__pubs-row-out {
  45% { opacity: 0; }
  to {
    font-size: 0;
    line-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-bottom-width: 0;
    opacity: 0;
  }
}

/* Отдельная табличка пинов (/publications/) раскрывается целиком вместе
   со спейсером за ней — сетка 0fr → 1fr */
.ids .ids__pubs--pins {
  display: grid;
  grid-template-rows: 1fr;
}

.ids .ids__pubs--pins-inner {
  min-height: 0;
  overflow: hidden;
}

.ids .ids__pubs--pins.entering {
  animation: ids__pubs-pins-in var(--ids__duration-base) var(--ids__easing-base);
}

.ids .ids__pubs--pins.leaving {
  animation: ids__pubs-pins-out var(--ids__duration-base) var(--ids__easing-base) forwards;
}

.ids .ids__pubs--pins-space.entering {
  animation: ids__pubs-space-in var(--ids__duration-base) var(--ids__easing-base);
}

.ids .ids__pubs--pins-space.leaving {
  animation: ids__pubs-space-out var(--ids__duration-base) var(--ids__easing-base) forwards;
}

@keyframes ids__pubs-pins-in {
  from { grid-template-rows: 0fr; margin-top: 0; opacity: 0; }
  55% { opacity: 0; }
}

@keyframes ids__pubs-pins-out {
  45% { opacity: 0; }
  to { grid-template-rows: 0fr; margin-top: 0; opacity: 0; }
}

@keyframes ids__pubs-space-in {
  from { height: 0; }
}

@keyframes ids__pubs-space-out {
  to { height: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ids .pinned-new > td,
  .ids .pinned-new > th,
  .ids .ids__pubs--pins.entering,
  .ids .ids__pubs--pins-space.entering {
    animation: none;
  }
}

/* Строка-подзаголовок группы (рынок, команда, подборка; «Новое» и
   «Всегда под рукой» на главной) */
.ids .ids__pubs--group th {
  padding: 1.8em 0 0.25em;
  font-family: var(--shift__description-font);
  font-weight: 200;
  font-size: 1.5em;
  /* Линейка под заголовком темнее и толще, чем между строчками */
  border-bottom: var(--ids__border-width-m) solid var(--ids__caption);
}

.ids .ids__pubs tbody tr:first-child.ids__pubs--group th {
  padding-top: 0;
}

/* На главной после группы пинов следующая группа («Новое») — ближе */
.ids .ids__pubs tbody .pinned-group ~ .ids__pubs--group:not(.pinned-group) th {
  padding-top: 0.9em;
}

/* «Все публикации» под таблицей «Новое» на главной — небольшая контурная
   пилюля по центру колонки, отдельно от строк (строкой она читалась как часть
   таблицы); контур — та же линия, что между строками (селектор сильнее
   .ids__pill.outline, иначе остаётся светлый контур пилюли) */
.ids .ids__pubs--all.ids__pill {
  display: flex;
  width: fit-content;
  margin: 1.1em auto 0;
  padding-left: 1.1em;
  padding-right: 1.1em;
  font-size: 0.8em;
  border-color: var(--ids__border);
}

/* Перед заголовком группы линейка предыдущей строки не нужна */
.ids .ids__pubs tr:has(+ .ids__pubs--group) td {
  border-bottom: none;
}

/* Теги-фильтры под h1 на /publications/ (только без группировки и без фильтра
   по автору — иначе скрипт прячет ряд): рынки и команды — пилюли (pill.css)
   того же кегля, что люди на главной, серым. Активный тег — текстового цвета,
   с крестиком-сбросом и чуть большим правым паддингом под прицеливание */
.ids .ids__pubs--tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3em 0.25em;
  /* Чуть свешивается влево — оптическая компенсация скругления; уже колонки,
     чтобы ряд не упирался в правый край (в дефолте «Соцсети» уходит на вторую строку) */
  margin: -0.4em 0 0 -0.1em;
  max-width: 80%;
  font-size: 0.9em;
}

.ids .ids__pubs--tags[hidden] {
  display: none;
}

.ids .ids__pubs--tag {
  color: var(--ids__caption);
}

.ids .ids__pubs--tag.active {
  color: var(--ids__text);
  background: color-mix(in srgb, var(--ids__caption) 28%, transparent);
  padding-right: 0.75em;
}

/* Крестик — SVG (ставит pubs-table.js; тот же в чипе автора), выровнен
   по заглавным: пилюля выравнивает содержимое по базовой линии, у SVG базовая —
   нижний край, так что при высоте 0.76em сдвиг вниз на 0.03em ставит центр
   крестика на 0.35em над базовой — центр заглавных Pragmatica (cap height
   0.70em). Полупрозрачный, по своему ховеру — непрозрачный (мгновенно) */
.ids .ids__pubs--tag-reset {
  width: 0.76em;
  height: 0.76em;
  position: relative;
  top: 0.03em;
  margin-left: 0.05em;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.1;
  stroke-linecap: round;
  opacity: 0.45;
  transition: opacity var(--ids__duration-base) var(--ids__easing-base);
}

.ids .ids__pubs--tag-reset:hover {
  opacity: 1;
  transition-duration: var(--ids__duration-instant);
}

/* Тулбар над таблицей: чип активного фильтра без своего тега (автор,
   область, подборка, новизна) — кнопка-пилюля того же кегля, что люди
   на главной, у автора с фото; выглядит как активный тег, клик снимает фильтр */
.ids .ids__pubs--toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3em 0.25em;
  margin-bottom: 1.2em;
  font-size: 0.9em;
}

.ids .ids__pubs--toolbar[hidden] {
  display: none;
}

.ids .ids__pubs--chip {
  background: color-mix(in srgb, var(--ids__caption) 28%, transparent);
  padding-right: 0.75em;
}

/* Служебный live-регион для скринридеров */
.ids .ids__pubs--live {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}