@import url('header.css');
@import url('aura-hero.css');
@import url('aura-shop.css');
@import url('aura-product.css');
@import url('aura-cart.css');
@import url('middle.css');
@import url('footer.css');
@import url('resp.css');
@import url('checkout.css');
@import url('elegant-icons/style.min.css');

/* После всех @import: иначе браузер не загружает импорты (правило CSS) */
:root {
	--site-content-max: 1400px;
	/* Один отступ с шапкой/футером: контентная колонка 1400px + одинаковые поля по краям */
	--site-gutter-x: clamp(20px, 4vw, 48px);
	--site-announcement-height: 38px;
	/* Финальные значения (импорты идут раньше — здесь гарантия для кэша и порядка) */
	--site-header-bar-height: 72px;
	--site-content-pad-top: calc(var(--site-announcement-height, 38px) + var(--site-header-bar-height));
}

@media (max-width: 1024px) {
	:root {
		/* Синхронно с .site-header__inner min-height в header.css (моб.) */
		--site-header-bar-height: 50px;
		--site-content-pad-top: calc(var(--site-announcement-height, 38px) + var(--site-header-bar-height));
	}
}

/* Смартфоны: ниже ряд шапки и меньше отступ у main.content */
@media (max-width: 576px) {
	:root {
		--site-header-bar-height: 46px;
		--site-content-pad-top: calc(var(--site-announcement-height, 38px) + var(--site-header-bar-height));
	}
}

/* Полоса объявлений выключена в стиле шаблона — без отступа под неё */
body.mainBody--no-announcement {
	--site-announcement-height: 0px;
}

/*
 * Глобально: отступ под position:fixed баннер + .site-header.
 * !important — чтобы перебить com_crm/css/template.css и др., подключаемые после шаблона.
 */
@media (max-width: 1024px) {
	/*
	 * Не трогаем: PDP (aura-product), full-bleed hero/about/contact (:has).
	 * !important — перебить стили, подключённые после шаблона (com_crm и т.д.).
	 */
	body.mainBody:not(.page-product) main.content:not(:has(.aura-hero)):not(:has(.aura-about)):not(:has(.aura-contact)) {
		padding-top: calc(var(--site-announcement-height, 38px) + var(--site-header-bar-height, 50px)) !important;
	}

	#bread {
		margin: 0;
		padding: 0;
	}

	#bread .wrapper {
		padding-top: 0.25rem;
		padding-bottom: 0;
	}
}