/* lh-icons.css — иконки ЛК: токены вида и общий класс.
 * Собран build_icons.py из data/tokens/kit/icons.py. Руками не править.
 *
 * Разделение ответственности:
 *   рисунок   → спрайт `ui/_icons.html` (из того же icons.py);
 *   где какая → `SECTIONS` в `observe_user/ui/shell.py`;
 *   как выглядит (размер, толщина, цвет) → токены ниже.
 *
 * Поэтому «сделать все иконки темнее» или «на 2 px крупнее» — это одна
 * строка здесь, а не обход вёрстки.
 *
 * Цвет по умолчанию — `currentColor`: иконка внутри пункта меню или кнопки
 * красится вместе с подписью, и наведение с активным состоянием получаются
 * одним правилом элемента. Токены `--lh-ico-fg*` нужны иконкам, которые
 * стоят сами по себе.
 *
 * Токены объявлены со запасным значением (`var(--lh-fg-muted, …)`):
 * палитра 2.0 пока живёт в области пилота, а не глобально. Когда она
 * выедет в `:root`, запасные значения отсюда уходят сами — это
 * сгенерированный файл.
 *
 * Вне реестра (следующий проход):
 *   • observe_user/_arb_court_ico.html — значок акта суда, 14 px, обводка 1.2;
 *   • worker_login.html + registration_all.html — логотип ВКонтакте, чужой цвет, дубль в двух файлах;
 */

:root {
	/* Размеры. Значение по умолчанию — M. */
	--lh-ico-size-s: 1rem;     /* 16 px — внутри строки текста, в бейдже, в подсказке */
	--lh-ico-size-m: 1.25rem;  /* 20 px — значение по умолчанию: меню, кнопки, шапки разделов */
	--lh-ico-size-l: 1.5rem;   /* 24 px — крупный акцент: пустое состояние, заголовок карточки */

	/* Толщина контура. px: волосяная линия, растить её со шрифтом незачем
	   (закрытый список исключений — data/design/units.md). */
	--lh-ico-stroke: 1.8px;
}

/* Цвет — только ссылки на семантические токены палитры. Своих значений
 * у иконок нет. Объявлены и на `.lh-shell`: палитра темы живёт на оболочке,
 * а `var()` в пользовательском свойстве раскрывается там, где свойство
 * объявлено. Объявленные только в `:root`, они брали светлый запасной цвет,
 * и в тёмной теме иконка суда оставалась чёрной (найдено 09.10.2026). */
:root,
.lh-shell {
	--lh-ico-fg: var(--lh-fg-muted, #6E6C6A);  /* иконка в покое рядом с приглушённым текстом */
	--lh-ico-fg-brand: var(--lh-accent-base, #43A388);  /* иконка в фирменном цвете: пункт меню в покое, ссылка */
	--lh-ico-fg-strong: var(--lh-fg-primary, #181615);  /* иконка рядом с основным текстом — заголовок, строка дела */
	--lh-ico-fg-active: var(--lh-accent-strong, #25765F);  /* активный пункт, наведение, выбранное состояние */
	--lh-ico-fg-inverse: var(--lh-fg-inverse, #FFFFFF);  /* иконка на тёмной или цветной заливке */
}

/* Общий класс: `<svg class="lh-ico"><use href="#lh-ico-<ключ>"></svg>`.
 *
 * Заливка и обводка здесь НЕ задаются: способ окраски стоит на самом
 * `<symbol>` в спрайте. `<use>` разворачивает символ в теневое дерево, до
 * содержимого которого селектор снаружи не достаёт — правило вида
 * `.lh-ico path { fill: none }` молча не сработало бы. Наследуемые
 * свойства (`color`, `stroke-width`) внутрь проходят, поэтому толщина
 * контура задаётся здесь и остаётся токеном. */
.lh-ico {
	flex: 0 0 auto;
	width: var(--lh-ico-size, var(--lh-ico-size-m));
	height: var(--lh-ico-size, var(--lh-ico-size-m));
	stroke-width: var(--lh-ico-stroke);
	stroke-linecap: round;
	stroke-linejoin: round;
}
.lh-ico--s { --lh-ico-size: var(--lh-ico-size-s); }
.lh-ico--m { --lh-ico-size: var(--lh-ico-size-m); }
.lh-ico--l { --lh-ico-size: var(--lh-ico-size-l); }

/* Спрайт в потоке не участвует. */
.lh-ico-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
