/* Компоненты группы «typography», которых дизайн-система IDS не даёт.
   Строго на токенах --ids__*, без своих цветовых литералов: тогда компоненты
   автоматически работают и в тёмной теме (IDS переключает семантические токены
   по классу .dark на <html>). Файл подключается в MainAsset после site.css. */

/* Пара гарнитур для сравнения в ките: временно сбрасывает засечки h1–h3
   обратно на интерфейсный Inter, чтобы контраст «до/после» был виден на
   одном и том же тексте. За пределами кита не используется — на сайте
   заголовки всегда засечками (правило в components/tokens.css). */
.font-sans {
    font-family: "Inter", sans-serif;
    letter-spacing: normal;
}

/* Подпись/caption вне тега <small> — например, под примером в ките или под
   полем формы. IDS даёт только цвет вторичного текста (--ids__text-caption),
   готового класса-обёртки нет. */
.caption {
    display: block;
    color: var(--ids__text-caption);
    font-size: 0.85em;
}

/* Голый <small> без класса — тот же приглушённый паттерн по умолчанию.
   На сайте он и так почти всегда используется как подпись (site.css:
   .site-brand small, .taxonomy-nav small задают тот же цвет точечно) —
   здесь это общее правило, чтобы не повторять его на каждом новом месте. */
small {
    color: var(--ids__text-caption);
}

/* :visited в IDS нет вовсе. Свой цвет — смесь цвета ссылки и приглушённого
   текста через color-mix, а не литерал: посещённая ссылка остаётся узнаваемой
   как ссылка, но заметно тише непосещённой. Специфичность `.ids a:visited`
   обязана быть не ниже `.ids a` (components/ids.css) — иначе базовый цвет
   ссылки перебивает это правило вместо того, чтобы быть перебитым им. */
.ids a:visited {
    color: color-mix(in srgb, var(--ids__link) 55%, var(--ids__text-caption) 45%);
}

/* Наведение обязано побеждать даже на посещённой ссылке — иначе состояние
   «сейчас под курсором» перестаёт быть заметным именно там, где чаще всего
   кликают повторно (уже читанные ссылки). */
.ids a:visited:hover {
    color: var(--ids__hover);
}

/* Внешняя ссылка — стрелка вместо иконки: своей иконочной системы на сайте
   нет, а тянуть спрайт ради одной стрелки избыточно. rel="external" — не
   самодельный хак, а стандартный link type из HTML living standard. */
.ids a[rel~="external"]::after {
    content: " ↗";
}

/* Список определений: IDS стилизует ul/ol (components/ids.css), но не dl —
   без этого браузерный дефолт (отступ dd через margin-inline-start) не
   сочетается с остальным ритмом типографики страницы. */
dl {
    margin: 0 0 calc(var(--ids__density) * 0.75em) 0;
}

dt {
    font-weight: 600;
}

dd {
    margin: 0 0 calc(var(--ids__density) * 0.5em) 0;
    color: var(--ids__text-caption);
}

/* Автор цитаты внутри <blockquote>. Сознательно не <footer>: в IDS
   (page-composition/layout.css) есть общее правило `header, footer { padding }`
   для футера страницы, и вложенный <footer> унаследовал бы тот же отступ —
   выглядело бы как случайный баг вёрстки, а не как атрибуция цитаты. */
.blockquote-author {
    margin-top: calc(var(--ids__density) * 0.3em);
    color: var(--ids__text-caption);
    font-size: 0.8em;
}

/* Блок кода. IDS стилизует только инлайновый <code> — рамка, подложка и
   паддинг в форме «пилюли» (components/ids.css). Внутри <pre> это выглядит
   как один длинный тег на всю ширину строки, а не как блок кода. Поэтому
   подложку берёт на себя <pre>, а вложенный <code> обнуляется до обычного
   текста. Специфичность `.ids pre code` обязана быть выше `.ids code` —
   иначе паддинг и рамка инлайн-кода не гасятся внутри блока. */
.ids pre {
    margin: 0 0 calc(var(--ids__density) * 1em) 0;
    padding: var(--ids__spacer-s) var(--ids__spacer-m);
    overflow-x: auto;
    border-radius: var(--ids__radius-s);
    color: var(--ids__code);
    border: var(--ids__border-width-s) solid color-mix(in srgb, var(--ids__code) 10%, transparent);
    background: color-mix(in srgb, var(--ids__code) 6%, transparent);
}

.ids pre code {
    padding: 0;
    border: 0;
    background: none;
}

/* Сноски: css/components/footnotes.css из апстрима IDS сознательно не
   завендорен (assets/ids/SNAPSHOT.md, раздел «Что не скопировано осознанно») —
   поэтому список пояснений внизу собран на голых токенах, без сторонних
   классов и без JS (номер-ссылка работает как обычный якорь на #id). */
.footnotes {
    margin-top: var(--ids__spacer-m);
    padding-top: var(--ids__spacer-s);
    border-top: 1px solid var(--site__hairline);
    color: var(--ids__text-caption);
    font-size: 0.85em;
}

/* Стрелка возврата к месту сноски — символ, а не текстовая ссылка, поэтому
   подчёркивание только мешает её читать как глиф. */
.footnote-backref {
    text-decoration: none;
}

/* <abbr> без явного подчёркивания в браузерах не отличить от опечатки.
   Пунктир — токеном цвета подписи, а не текущим цветом текста (браузерный
   дефолт), чтобы расшифровка читалась как отдельный, более тихий элемент. */
abbr[title] {
    text-decoration: underline dotted;
    text-decoration-color: color-mix(in srgb, var(--ids__text-caption) 70%, transparent);
    cursor: help;
}