/*
 * Конвертер единиц (профиль 'conv', разметка — ui/conv.php, поведение —
 * ui/conv.js): две панели «число + единица» по
 * бокам, кнопка ⇄ между ними, всё по центру узкой колонки.
 * Конкретных цветов нет — только токены из ui/tokens.php.
 */

:root { --sk-conv-w: 760px; }  /* ширина страницы конвертера: её же берёт шапка и статья (theme.css) */
.sk-calc--conv {
	background: none;
	padding: 8px 0 20px;
	max-width: var(--sk-conv-w);
	margin-left: auto;
	margin-right: auto;
}

.sk-conv {
	padding: 26px 26px 22px;
	background: var(--sk-tint);
	border: 1px solid var(--sk-line);
}

.sk-conv__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr);
	align-items: center;
	gap: 0 16px;
}

.sk-conv__side { display: flex; flex-direction: column; gap: 12px; min-width: 0; }

/* Поле числа и список единиц — стандартные, как у лестниц (14.10.2026,
   заказчик: «используй стандартные поля ввода»): поле 34 px (sk-input),
   список 40 px (sk-select). Свои здесь только ширина на всю панель. */
.sk-conv__side { --sk-num-w: 100%; }
.sk-conv__side .sk-input { width: 100%; }
.sk-conv__side .sk-input.is-bad { border-color: var(--sk-bad); }
.sk-conv__side .sk-input--text { font-family: var(--sk-font-mono); font-size: 16px; font-weight: 600; }

.sk-conv__swap {
	justify-self: center;
	width: 52px;
	height: 52px;
	display: grid;
	place-items: center;
	padding: 0;
	color: var(--sk-ink);
	background: none;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color .15s, transform .2s;
}
.sk-conv__swap:hover { background: var(--sk-paper); }
.sk-conv__swap:active { transform: rotate(180deg); }

.sk-conv__note {
	min-height: 1.4em;
	margin: 18px 0 0;
	text-align: center;
	font-size: 14px;
	color: var(--sk-muted-2);
}
.sk-conv__note.is-bad { color: var(--sk-bad); }


/* таблицы пары [sk-conv-table] в статье: две рядом, на телефоне — друг под другом */
.sk-conv-tables { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 0 24px; }

/* узкий экран: панели друг под другом, ⇄ между ними, развёрнута вертикально */
@media screen and (max-width: 640px) {
	.sk-conv { padding: 18px 12px 16px; }
	.sk-conv__row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
	.sk-conv__swap { transform: rotate(90deg); }
	.sk-conv__swap:active { transform: rotate(270deg); }
}

/* печать и PDF: заголовок расчёта и подвал с адресом, без кнопки обмена */
@media print {
	.sk-conv .sk-board__ptitle { display: block; }
	.sk-conv__swap { visibility: hidden; }
}
.sk-conv.sk-capture .sk-board__ptitle { display: block; }
.sk-conv.sk-capture .sk-board__pfoot { display: flex; }
.sk-conv.sk-capture .sk-conv__swap { visibility: hidden; }
/* «Сбросить» — в правом верхнем углу панели конвертера (sk_reset_html) */
.sk-conv { position: relative; }
.sk-conv__tools { position: absolute; top: 8px; right: 14px; padding: 0; z-index: 1; }
@media print { .sk-conv__tools { display: none; } }
/* На телефоне угол панели занят полем: «Сбросить» поверх поля закрывал число
   (20.10.2026). Кнопка уходит в поток — строкой над полями, справа. */
@media screen and (max-width: 640px) {
	.sk-conv__tools { position: static; display: flex; justify-content: flex-end; margin: -8px -2px 6px; }
}