/*!
 * Оформление пользовательской документации ППО Палладиум.
 *
 * Палитра, шрифт и геометрия взяты из портала (см. src/shared/assets/styles
 * в проекте portal), чтобы переход из продукта в документацию не читался
 * как переход на другой сайт.
 */

/* ==========================================================================
   Шрифт
   ========================================================================== */

@font-face {
	font-family: Inter;
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
	src: url("../fonts/inter_normal_cyrillic.woff2") format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: Inter;
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
	src: url("../fonts/inter_normal_latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
		U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   Токены
   ========================================================================== */

:root {
	/* Поверхности */
	--pal-surface: #ffffff;
	--pal-inset: #f0f1f3;
	--pal-active: #d5d8de;

	/* Текст */
	--pal-ink: #131313;
	--pal-ink-muted: #6d7885;

	/* Линии */
	--pal-rule: #e7e9eb;
	--pal-rule-strong: #d5d8de;

	/* Акценты: синий — «по этому можно перейти», бирюзовый — «вы здесь» */
	--pal-accent: #005ff9;
	--pal-mark: #00b6c5;

	/* Геометрия */
	--pal-rail: 281px;
	--pal-gutter: 48px;
	--pal-radius: 8px;

	/* Типографика */
	--pal-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
		sans-serif;
	--pal-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
		"Liberation Mono", monospace;
}

/* ==========================================================================
   Основа
   ========================================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;

	font-family: var(--pal-sans);
	font-size: 16px;
	font-weight: 400;
	font-synthesis: none;
	line-height: 1.65;
	color: var(--pal-ink);
	text-rendering: optimizelegibility;

	background-color: var(--pal-surface);

	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

a {
	color: var(--pal-accent);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

:focus-visible {
	outline: 2px solid var(--pal-accent);
	outline-offset: 2px;
	border-radius: 2px;
}

img {
	max-width: 100%;
	height: auto;
}

hr {
	display: none;
}

.pal-skip {
	position: absolute;
	top: 8px;
	left: 8px;
	z-index: 50;

	padding: 10px 16px;
	border-radius: var(--pal-radius);

	color: var(--pal-surface);
	background: var(--pal-ink);

	transform: translateY(-200%);
}

.pal-skip:focus {
	transform: none;
}

/* ==========================================================================
   Каркас страницы
   ========================================================================== */

.pal-shell {
	display: grid;
	grid-template-columns: var(--pal-rail) minmax(0, 1fr);
	min-height: 100vh;
}

/* --- Боковая панель ------------------------------------------------------ */

.pal-rail {
	position: sticky;
	top: 0;

	display: flex;
	flex-direction: column;

	height: 100vh;
	padding: 24px 16px 0 16px;

	background-color: var(--pal-inset);
}

.pal-brand {
	flex-shrink: 0;
	display: block;
	margin: 0 11px 32px 11px;
}

.pal-brand img {
	display: block;
	width: 194px;
	height: 40px;
}

.pal-rail-scroll {
	/* Точка отсчёта для offsetTop пунктов оглавления (см. docs.js). */
	position: relative;

	overflow-y: auto;
	flex: 1 1 auto;
	padding-bottom: 24px;

	overscroll-behavior: contain;
	scrollbar-width: thin;
	scrollbar-color: var(--pal-rule-strong) transparent;
}

.pal-rail-scroll::-webkit-scrollbar {
	width: 8px;
}

.pal-rail-scroll::-webkit-scrollbar-thumb {
	border: 2px solid var(--pal-inset);
	border-radius: 4px;
	background: var(--pal-rule-strong);
}

.pal-rail-foot {
	flex-shrink: 0;

	padding: 14px 12px;
	border-top: 1px solid var(--pal-rule-strong);

	font-size: 13px;
	color: var(--pal-ink-muted);
}

/* --- Колонка с содержимым ------------------------------------------------ */

.pal-main {
	min-width: 0;
	padding: 32px var(--pal-gutter) 120px var(--pal-gutter);
}

.pal-column {
	max-width: 780px;
}

/* Текст держится в пределах комфортной длины строки, а код, таблицы и
   иллюстрации могут занимать всю ширину колонки. */
.pal-column p,
.pal-column li,
.pal-column dd {
	max-width: 68ch;
}

/* ==========================================================================
   Оглавление в боковой панели
   ========================================================================== */

.pal-rail-scroll .toc ul,
.pal-rail-scroll ul.toc {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pal-rail-scroll li {
	margin: 0;
}

.pal-rail-scroll a {
	display: block;
	padding: 6px 12px;
	border-radius: var(--pal-radius);

	font-size: 14px;
	line-height: 1.4;
	color: var(--pal-ink);
}

.pal-rail-scroll a:hover {
	background-color: rgb(222 222 230);
	text-decoration: none;
}

/* Верхний уровень — руководства. */
.pal-rail-scroll > .toc > ul > li {
	margin-bottom: 4px;
}

.pal-rail-scroll > .toc > ul > li > span > a {
	font-size: 14px;
	font-weight: 600;
}

/* Вложенные уровни: направляющая слева показывает глубину. */
.pal-rail-scroll > .toc > ul ul {
	margin: 2px 0 8px 20px;
	padding-left: 8px;
	border-left: 1px solid var(--pal-rule-strong);
}

.pal-rail-scroll > .toc > ul ul a {
	font-size: 13.5px;
	color: #3c4450;
}

.pal-rail-scroll > .toc > ul ul ul a {
	font-size: 13px;
}

/* Руководства, в которых читатель не находится, свёрнуты: полное оглавление
   книги не помещается на экран. Без JS всё раскрыто — это рабочий вариант. */
.pal-rail-scroll li.pal-folded > ul {
	display: none;
}

/* Текущая страница: фон как у активного пункта меню портала плюс
   бирюзовая метка — она же единственный маркер «вы здесь». */
.pal-rail-scroll a.pal-here {
	font-weight: 600;
	color: var(--pal-ink);

	background-color: var(--pal-active);
	box-shadow: inset 3px 0 0 var(--pal-mark);
}

.pal-rail-scroll a.pal-here:hover {
	background-color: var(--pal-active);
}

/* Раздел, внутри которого находится читатель. */
.pal-rail-scroll a.pal-here-parent {
	font-weight: 600;
	color: var(--pal-ink);
}

/* ==========================================================================
   Хлебные крошки
   ========================================================================== */

.pal-crumbs {
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 1.4;
	color: var(--pal-ink-muted);
}

.pal-crumbs a {
	color: var(--pal-ink-muted);
}

.pal-crumbs a:hover {
	color: var(--pal-accent);
}

.pal-crumbs a + a::before {
	content: "/";
	margin: 0 8px;
	color: var(--pal-rule-strong);
}

/* ==========================================================================
   Заголовки
   ========================================================================== */

.pal-column .titlepage {
	margin: 0;
}

.pal-column .title {
	margin: 0;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--pal-ink);
}

/* Размер подзаголовка определяется глубиной вложенности раздела, а не
   уровнем тега: в DocBook один и тот же <h3> на разных страницах может
   означать разный уровень. */
/* Цепочка «>» отсчитывает уровень от корня страницы: один и тот же <h3> в
   DocBook на разных страницах означает разную глубину, поэтому опираться на
   уровень тега нельзя. */
.pal-column > * > .section > .titlepage .title,
.pal-column > * > .appendix > .titlepage .title {
	margin-top: 48px;
	margin-bottom: 12px;
	font-size: 25px;
	letter-spacing: -0.015em;
}

.pal-column > * > .section > .section > .titlepage .title {
	margin-top: 36px;
	font-size: 20px;
	letter-spacing: -0.01em;
}

.pal-column > * > .section > .section > .section > .titlepage .title {
	margin-top: 32px;
	margin-bottom: 8px;
	font-size: 17px;
	letter-spacing: 0;
}

.pal-column > * > .section > .section > .section > .section > .titlepage .title {
	margin-top: 28px;
	font-size: 16px;
}

/* Заголовок самой страницы. */
.pal-column > .book > .titlepage .title,
.pal-column > .article > .titlepage .title,
.pal-column > .section > .titlepage .title,
.pal-column > .appendix > .titlepage .title,
.pal-column > .preface > .titlepage .title,
.pal-column > .chapter > .titlepage .title {
	margin-top: 0;
	margin-bottom: 0;
	font-size: 31px;
	letter-spacing: -0.02em;
}

/* Короткая бирюзовая черта отделяет заголовок страницы от остального.
   Черта висит на самом заголовке, а не на .titlepage: у руководств в
   .titlepage лежат ещё версия, ссылка на источник и аннотация. */
.pal-column > .book > .titlepage,
.pal-column > .article > .titlepage,
.pal-column > .section > .titlepage,
.pal-column > .appendix > .titlepage,
.pal-column > .preface > .titlepage,
.pal-column > .chapter > .titlepage {
	margin-bottom: 32px;
}

.pal-column > .book > .titlepage .title::after,
.pal-column > .article > .titlepage .title::after,
.pal-column > .section > .titlepage .title::after,
.pal-column > .appendix > .titlepage .title::after,
.pal-column > .preface > .titlepage .title::after,
.pal-column > .chapter > .titlepage .title::after {
	content: "";
	display: block;
	width: 44px;
	height: 3px;
	margin-top: 20px;
	border-radius: 2px;
	background-color: var(--pal-mark);
}

.pal-column .subtitle {
	margin: 8px 0 0;
	font-size: 20px;
	font-weight: 400;
	color: var(--pal-ink-muted);
}

.pal-column .releaseinfo {
	margin: 12px 0 0;
	font-size: 14px;
	color: var(--pal-ink-muted);
}

/* ==========================================================================
   Текст
   ========================================================================== */

.pal-column p {
	margin: 0 0 16px;
}

.pal-column strong {
	font-weight: 600;
}

.pal-column .itemizedlist,
.pal-column .orderedlist {
	margin: 0 0 16px;
}

.pal-column .itemizedlist ul,
.pal-column .orderedlist ol {
	margin: 0;
	padding-left: 22px;
}

.pal-column .itemizedlist li,
.pal-column .orderedlist li {
	margin-bottom: 6px;
}

.pal-column .itemizedlist li::marker {
	color: var(--pal-rule-strong);
}

.pal-column .orderedlist li::marker {
	font-variant-numeric: tabular-nums;
	color: var(--pal-ink-muted);
}

.pal-column li > p:last-child {
	margin-bottom: 0;
}

/* --- Списки определений: справочники параметров и переменных -------------- */

.pal-column .variablelist-title {
	margin: 32px 0 12px;
	font-size: 17px;
	font-weight: 600;
}

.pal-column .variablelist dl {
	margin: 0 0 16px;
}

.pal-column .variablelist dt {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid var(--pal-rule);
	font-weight: 600;
}

.pal-column .variablelist dt:first-of-type {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.pal-column .variablelist dd {
	margin: 4px 0 0;
	color: #303740;
}

.pal-column .term {
	font-family: var(--pal-mono);
	font-size: 14.5px;
	font-weight: 500;
	color: var(--pal-ink);
}

/* Справочник функций расчёта порога: термины списка — названия функций, а не
   имена переменных, поэтому здесь отменяется моноширинное оформление .term и
   название читается как подзаголовок. Ограничено разделом, чтобы справочники
   переменных окружения в других руководствах остались как есть. */

[id="pal.core.ug.thresholds"] .variablelist dt {
	margin-top: 34px;
	padding-top: 20px;
	border-top-color: var(--pal-rule-strong);
}

[id="pal.core.ug.thresholds"] .variablelist dt .term {
	font-family: var(--pal-sans);
	font-size: 19px;
	font-weight: 650;
	letter-spacing: -0.01em;
}

[id="pal.core.ug.thresholds"] .variablelist dd {
	margin-top: 8px;
}

/* ==========================================================================
   Код
   ========================================================================== */

.pal-column code,
.pal-column .command,
.pal-column .option,
.pal-column .filename,
.pal-column .literal,
.pal-column .varname,
.pal-column .parameter {
	font-family: var(--pal-mono);
	font-size: 0.885em;
	font-weight: 500;
	color: var(--pal-ink);

	overflow-wrap: break-word;
}

/* Внутри моноширинного блока лишняя подсветка только мешает. */
.pal-column pre code,
.pal-column pre .command,
.pal-column pre .option,
.pal-column pre .filename {
	padding: 0;
	font-size: 1em;
	font-weight: inherit;
	background: none;
}

.pal-column p > code,
.pal-column li > code,
.pal-column dd > code,
.pal-column p > .command,
.pal-column li > .command,
.pal-column p > .option,
.pal-column li > .option,
.pal-column p > .filename,
.pal-column li > .filename {
	padding: 1px 5px;
	border-radius: 4px;
	background-color: var(--pal-inset);
}

.pal-column pre {
	overflow-x: auto;

	margin: 0 0 20px;
	padding: 16px 18px;
	border: 1px solid var(--pal-rule);
	border-radius: var(--pal-radius);

	font-family: var(--pal-mono);
	font-size: 14px;
	line-height: 1.6;
	tab-size: 4;

	background-color: #f7f8f9;
}

/* --- Выноски ------------------------------------------------------------- */

.pal-column .calloutlist {
	margin: 0 0 20px;
}

.pal-column .calloutlist td {
	padding: 4px 10px 4px 0;
	vertical-align: top;
}

.pal-column .calloutlist td:first-child {
	font-variant-numeric: tabular-nums;
	color: var(--pal-ink-muted);
	white-space: nowrap;
}

.pal-column .calloutlist p {
	margin: 0;
}

/* ==========================================================================
   Врезки
   ========================================================================== */

.pal-column .note,
.pal-column .tip,
.pal-column .important,
.pal-column .warning,
.pal-column .caution {
	margin: 0 0 20px;
	padding: 2px 0 2px 20px;
	border-left: 3px solid var(--pal-mark);
}

.pal-column .warning,
.pal-column .caution {
	border-left-color: #e64646;
}

.pal-column .important {
	border-left-color: var(--pal-accent);
}

.pal-column .note h3.title,
.pal-column .note .title,
.pal-column .tip .title,
.pal-column .important .title,
.pal-column .warning .title,
.pal-column .caution .title {
	margin: 0 0 4px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0;
	color: var(--pal-ink-muted);
}

.pal-column .note p:last-child,
.pal-column .tip p:last-child,
.pal-column .important p:last-child,
.pal-column .warning p:last-child,
.pal-column .caution p:last-child {
	margin-bottom: 0;
}

/* --- Аннотация и правовые сведения ---------------------------------------- */

.pal-column .abstract {
	margin: 24px 0 32px;
	font-size: 17px;
	color: #303740;
}

.pal-column .abstract-title {
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 600;
	color: var(--pal-ink-muted);
}

.pal-column .titlepage .legalnotice {
	margin-top: 12px;
	padding-top: 0;
	border-top: 0;
	font-size: 14px;
}

.pal-column .titlepage .legalnotice p {
	margin: 0;
}

.pal-column .legalnotice {
	margin-top: 48px;
	padding-top: 20px;
	border-top: 1px solid var(--pal-rule);
	font-size: 14px;
	color: var(--pal-ink-muted);
}

/* ==========================================================================
   Иллюстрации
   ========================================================================== */

.pal-column .figure {
	margin: 0 0 28px;
}

.pal-column .figure-contents {
	padding: 16px;
	border: 1px solid var(--pal-rule);
	border-radius: var(--pal-radius);
	background-color: #fbfbfc;
}

.pal-column .figure-contents img {
	display: block;
	margin: 0 auto;
}

.pal-column .figure-title {
	margin: 10px 0 0;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--pal-ink-muted);
}

.pal-column .figure-title b,
.pal-column .figure-title strong {
	font-weight: 600;
	color: var(--pal-ink);
}

.pal-column .figure-break,
.pal-column .table-break {
	display: none;
}

/* ==========================================================================
   Таблицы
   ========================================================================== */

.pal-column .table,
.pal-column .informaltable {
	margin: 0 0 28px;
}

.pal-column .table-contents,
.pal-column .informaltable {
	overflow-x: auto;
}

.pal-column table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.pal-column table {
	border: 0 none !important;
}

.pal-column th,
.pal-column td {
	padding: 10px 14px;
	/* DocBook расставляет рамки атрибутами и инлайновыми стилями. */
	border: 0 none !important;
	border-bottom: 1px solid var(--pal-rule) !important;
	text-align: left;
	vertical-align: top;
}

.pal-column thead th {
	border-bottom: 1px solid var(--pal-rule-strong) !important;
	font-size: 13px;
	font-weight: 600;
	color: var(--pal-ink-muted);
}

.pal-column tbody tr:last-child td {
	border-bottom: 0 none !important;
}

.pal-column .table-title {
	margin: 0 0 10px;
	font-size: 14px;
	font-weight: 400;
	color: var(--pal-ink-muted);
}

.pal-column .table-title b,
.pal-column .table-title strong {
	font-weight: 600;
	color: var(--pal-ink);
}

/* ==========================================================================
   Титульная страница: содержание книги
   ========================================================================== */

.pal-column > .book > .toc {
	margin-top: 8px;
}

.pal-column .toc-title {
	margin-bottom: 16px;
	font-size: 14px;
	font-weight: 600;
	color: var(--pal-ink-muted);
}

.pal-column .toc ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pal-column .toc > ul > li {
	padding-top: 20px;
	margin-top: 20px;
	border-top: 1px solid var(--pal-rule);
}

.pal-column .toc > ul > li:first-child {
	padding-top: 0;
	margin-top: 0;
	border-top: 0;
}

.pal-column .toc > ul > li > span > a {
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--pal-ink);
}

.pal-column .toc > ul > li > span > a:hover {
	color: var(--pal-accent);
	text-decoration: none;
}

.pal-column .toc > ul ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 2px 28px;
	margin-top: 12px;
}

.pal-column .toc > ul ul li {
	max-width: none;
}

.pal-column .toc > ul ul a {
	font-size: 15px;
	color: var(--pal-accent);
}

/* Вложенность глубже второго уровня на титульной странице только
   утяжеляет список — она доступна в боковой панели. */
.pal-column .toc > ul ul ul {
	display: none;
}

/* Списки иллюстраций и таблиц — справочные, поэтому уводим их вниз. */
.pal-column .list-of-figures,
.pal-column .list-of-tables {
	margin-top: 48px;
	padding-top: 20px;
	border-top: 1px solid var(--pal-rule);
	font-size: 14px;
}

.pal-column .list-of-figures .toc-title,
.pal-column .list-of-tables .toc-title {
	margin-bottom: 8px;
}

.pal-column .list-of-figures ul,
.pal-column .list-of-tables ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pal-column .list-of-figures li,
.pal-column .list-of-tables li {
	margin-bottom: 2px;
	color: var(--pal-ink-muted);
}

/* ==========================================================================
   Переход к соседним разделам
   ========================================================================== */

.pal-pagenav {
	display: flex;
	gap: 16px;
	margin-top: 64px;
	padding-top: 24px;
	border-top: 1px solid var(--pal-rule);
}

.pal-pagenav a {
	display: block;
	flex: 1 1 0;

	padding: 14px 18px;
	border: 1px solid var(--pal-rule);
	border-radius: var(--pal-radius);

	color: var(--pal-ink);
}

.pal-pagenav a:hover {
	border-color: var(--pal-accent);
	text-decoration: none;
}

.pal-pagenav-next {
	text-align: right;
}

.pal-pagenav-dir {
	display: block;
	margin-bottom: 2px;
	font-size: 13px;
	color: var(--pal-ink-muted);
}

.pal-pagenav-title {
	display: block;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.4;
}

.pal-pagenav a:hover .pal-pagenav-title {
	color: var(--pal-accent);
}

/* ==========================================================================
   Кнопка оглавления (узкие экраны)
   ========================================================================== */

.pal-rail-toggle {
	position: fixed;
	z-index: 30;
	top: 12px;
	left: 12px;

	display: none;
	gap: 10px;
	align-items: center;

	padding: 9px 14px;
	border: 1px solid var(--pal-rule-strong);
	border-radius: var(--pal-radius);

	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	color: var(--pal-ink);

	background-color: var(--pal-inset);
	cursor: pointer;
}

.pal-rail-toggle-bars,
.pal-rail-toggle-bars::before,
.pal-rail-toggle-bars::after {
	display: block;
	width: 16px;
	height: 2px;
	border-radius: 1px;
	background-color: currentcolor;
}

.pal-rail-toggle-bars {
	position: relative;
}

.pal-rail-toggle-bars::before,
.pal-rail-toggle-bars::after {
	content: "";
	position: absolute;
	left: 0;
}

.pal-rail-toggle-bars::before {
	top: -5px;
}

.pal-rail-toggle-bars::after {
	top: 5px;
}

/* ==========================================================================
   Адаптивность
   ========================================================================== */

@media (max-width: 1180px) {
	:root {
		--pal-gutter: 32px;
	}
}

@media (max-width: 900px) {
	.pal-shell {
		grid-template-columns: minmax(0, 1fr);
	}

	.pal-rail-toggle {
		display: inline-flex;
	}

	.pal-rail {
		position: fixed;
		z-index: 40;
		top: 0;
		left: 0;

		width: min(320px, 86vw);

		transform: translateX(-100%);
		transition: transform 0.2s ease;
	}

	.pal-rail.pal-rail-open {
		transform: none;
		box-shadow: 0 0 0 100vmax rgb(19 19 19 / 35%);
	}

	.pal-main {
		padding-top: 64px;
	}

	.pal-column > .book > .titlepage .title,
	.pal-column > .article > .titlepage .title,
	.pal-column > .section > .titlepage .title,
	.pal-column > .appendix > .titlepage .title {
		font-size: 26px;
	}

	.pal-column > * > .section > .titlepage .title {
		font-size: 21px;
	}

	.pal-pagenav {
		flex-direction: column;
	}

	.pal-pagenav-next {
		text-align: left;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* ==========================================================================
   Печать
   ========================================================================== */

@media print {
	.pal-rail,
	.pal-rail-toggle,
	.pal-pagenav,
	.pal-crumbs,
	.pal-skip {
		display: none;
	}

	.pal-shell {
		display: block;
	}

	.pal-main {
		padding: 0;
	}

	.pal-column {
		max-width: none;
	}

	.pal-column pre {
		white-space: pre-wrap;
	}
}
