/* Тема NIO — базовый слой.
   Намеренно тонкий: всю видимую вёрстку рисует Elementor, а тема отвечает
   только за каркас документа и за те немногие элементы, которые Elementor
   не рисует вовсе (запасная шапка/подвал, ссылка «к содержимому»). */

/* Страховка от горизонтальной прокрутки. xStore заворачивала весь сайт в
   .template-container с overflow:hidden, и любой перелив по ширине она гасила
   молча — из-за этого переливы годами не были видны, а с уходом темы вылезли
   разом. Возвращаем страховку, но через `clip`, а не `hidden`: hidden делает
   элемент прокручиваемым контейнером и ломает position:sticky у потомков,
   clip же просто обрезает. Это именно подстраховка — сами переливы всё равно
   надо чинить по месту, иначе часть содержимого окажется недоступной. */
html { overflow-x: clip; }

/* Полоса прокрутки скрыта на всём сайте — сознательное решение владельца.
   Она забирала ~15px ширины, из-за чего при каждой блокировке прокрутки
   (раскрытие мега-меню, модалка) окно становилось шире и вся вёрстка вместе
   с логотипом слегка дёргалась вбок; в углу шапки при этом просвечивала
   незакрашенная полоска. Скрываем и полосу, и вызванные ею прыжки разом.
   Прокрутка колесом, клавишами и тачем работает как обычно. */
html {
	scrollbar-width: none;          /* Firefox */
	-ms-overflow-style: none;       /* старый Edge */
}
html::-webkit-scrollbar,
body::-webkit-scrollbar { width: 0; height: 0; }

/* Единая блочная модель. xStore задавала её глобально, и вся вёрстка сайта —
   и плагинов в том числе — рассчитана именно на неё. Без этой строки любое
   поле с `width:100%` плюс внутренние отступы вылезает за свой контейнер, а
   круги радиокнопок (26px + padding 4px + рамка 1.5px) вырастают до 37px.
   Тема обязана вернуть это правило, раз оно исчезло вместе со старой темой. */
*,
*::before,
*::after { box-sizing: border-box; }

/* Ширина и отступы контейнера приходят переменными из настроек темы
   (inc/dynamic-css.php). Значения здесь — запасные, на случай если блок
   настроек по какой-то причине не напечатался. */
.nio-container {
	width: 100%;
	max-width: var(--nio-content-width, 1170px);
	margin-inline: auto;
	padding-inline: var(--nio-container-pad, 15px);
	box-sizing: border-box;
}

/* «Липкий» подвал: когда содержимого мало — на витрине магазина отфильтровали
   пару машин, на странице авто часть блоков пуста — страница всё равно занимает
   высоту экрана, и подвал не подпрыгивает вверх, оставляя под собой пустоту.
   Шапка в этой раскладке не участвует: она вне потока (absolute/fixed).
   Раньше то же самое делал CSS на витрине, но привязанный к узлам xStore
   (.template-content, .page-wrapper) — с их исчезновением приём перестал
   работать, поэтому он и переехал в тему, где действует на всех страницах.
   100svh рядом со 100vh — ради мобильных браузеров, где адресная строка
   то скрывается, то появляется, и 100vh даёт лишнюю прокрутку. */
body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100svh;
}
.nio-main { display: block; flex: 1 0 auto; }
.elementor-location-footer,
.nio-fallback-footer { flex: 0 0 auto; }

/* Поток текста в запасных шаблонах: Elementor свои отступы задаёт сам, так
   что это правило действует только там, где его разметки нет. */
.nio-flow > * + * { margin-top: 1rem; }
.nio-flow { padding-block: 2rem; }

.nio-fallback-header,
.nio-fallback-footer { padding-block: 1rem; }
.nio-fallback-header__title {
	font-size: 1.25rem;
	font-weight: 600;
	text-decoration: none;
	color: inherit;
}

/* Ссылка для клавиатурной навигации: не мешает мышке, но доступна с Tab. */
.skip-link.screen-reader-text {
	position: absolute;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}
.skip-link.screen-reader-text:focus {
	position: fixed;
	top: 8px; left: 8px;
	z-index: 1000000;
	width: auto; height: auto;
	margin: 0; padding: 10px 16px;
	clip-path: none;
	background: #fff;
	color: #111;
	box-shadow: 0 2px 12px rgba(0, 0, 0, .2);
}

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

/* ── Проза в текстовых виджетах Elementor ─────────────────────────────
   Эти правила раньше задавала xStore. С её уходом остались браузерные
   значения по умолчанию: отступ списков 40px (слишком много) и ссылки
   дефолтным синим (#0000ee). */

/* Списки: 20px на компьютере, 10px на телефоне. */
.elementor-widget-text-editor ul,
.elementor-widget-text-editor ol {
	padding-inline-start: 20px;
}
@media (max-width: 767px) {
	.elementor-widget-text-editor ul,
	.elementor-widget-text-editor ol {
		padding-inline-start: 10px;
	}
}

/* Ссылки в тексте. Цвет НАСЛЕДУЕМ от окружающего текста, а не прибиваем
   белым намертво: на тёмных страницах (витрина) они и так выйдут белыми,
   как и просили, а на светлых — например, SEO-блок на /l80/ — останутся
   читаемыми. Жёсткий белый сделал бы их там невидимыми. От обычного
   текста отличаются насыщенностью, а подчёркивание появляется при
   наведении — иначе ссылку в тексте нечем отличить от простого слова. */
.elementor-widget-text-editor a {
	color: inherit;
	font-weight: 600;
	text-decoration: none;
}
.elementor-widget-text-editor a:hover,
.elementor-widget-text-editor a:focus-visible {
	text-decoration: underline;
}