<?if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();
/** @var array $arParams */
/** @var array $arResult */
/** @global CMain $APPLICATION */
/** @global CUser $USER */
/** @global CDatabase $DB */
/** @var CBitrixComponentTemplate $this */
/** @var string $templateName */
/** @var string $templateFile */
/** @var string $templateFolder */
/** @var string $componentPath */
/** @var CBitrixComponent $component */
$this->setFrameMode(true);
?>
<section data-page="catalog" id="catalog">
	<div class="container">
		<div id="view"></div>
		<div class="pageWithSide">
			<div class="leftColumn">
			<h1 class="section_title">Каталог автомобилей</h1>
			<div class="special_detail">
				<? if(!$arParams['top_banners']): ?>
				<? else: ?>
					<div class="special_offer">
						<h2>СКИДКИ ДО <span>1,5%</span> <mark>+</mark> СПЕЦТАРИФ НА КАСКО</h2>
						<ul class="list-column">
							<li>Скидки до 1,5% при покупке</li>
							<li>Land Rover в лизинг</li>
							<li>Специальный тариф на каско</li>
						</ul>
						<button class="button button-blue">Отправить заявку</button>
						<img src="/images/special_offer.jpg" alt="" />
					</div>
				<? endif; ?>
				<div id="catalog_small_filter" style="<?= $arResult['EXTENDED'] ? "display:none;" : $arResult['FILTER_SMALL'] ? "display:none;" : ""; ?>">
					<form id="catalog_small_form" method="get" action="/catalog/">
						<div class="filter_body">
							<div class="form_field">
								<select name="brand" id="small_filter_brands">
									<option disabled selected value="">Марка</option>
								</select>
							</div>
							<div class="form_field">
								<select name="model" id="small_filter_models">
									<option disabled selected value="">Модель</option>
								</select>
							</div>
							<button class="button  button-blue" id="catalog_small_find"></button>
							<button class="button button-blue" id="rich_filter_toggle">
								<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
									<path d="M2.63025 3H13.3697C13.4666 3 13.5613 3.02814 13.6425 3.08099C13.7237 3.13384 13.7878 3.20914 13.827 3.29772C13.8661 3.38631 13.8788 3.48437 13.8633 3.57999C13.8478 3.6756 13.8048 3.76466 13.7397 3.83634L9.63 8.35697C9.54633 8.449 9.49997 8.56892 9.49997 8.6933V12.2324C9.49997 12.3147 9.47965 12.3958 9.44081 12.4683C9.40197 12.5409 9.34581 12.6028 9.27732 12.6484L7.27732 13.9818C7.20202 14.032 7.11451 14.0608 7.02412 14.0652C6.93372 14.0695 6.84384 14.0493 6.76404 14.0066C6.68425 13.9639 6.61755 13.9003 6.57104 13.8227C6.52454 13.745 6.49997 13.6562 6.49997 13.5657V8.6933C6.49997 8.56892 6.45361 8.449 6.36994 8.35697L2.26028 3.83634C2.19512 3.76466 2.15218 3.6756 2.13669 3.57999C2.12119 3.48437 2.13381 3.38631 2.17299 3.29772C2.21218 3.20914 2.27625 3.13384 2.35743 3.08099C2.4386 3.02814 2.53338 3 2.63025 3V3Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
								</svg>

								Фильтр
							</button>
						</div>
					</form>
				</div>
				<div id="filter" class="filter_in_catalog" style="<?= $arResult['EXTENDED'] ? "display:block;" : ""; ?>">
					<div class="container">
						<? $APPLICATION->IncludeComponent(
							"evolution:form.catalog.filter",
							"",
							Array(
								"SELECTED" => $arResult['SELECTED'], 
								"PATH" => $arParams['PATH'], 
								"SORTING" => true, 
								"PROGRAM" => $arParams['PROGRAM'], 
								"SCROLL" => $arResult['SCROLL'], 
							)
						); ?>
					</div>
				</div>
				<? $APPLICATION->IncludeComponent(
					"evolution:catalog.sort",
					"",
					Array(
						"SORT" => $arParams['SORT'], 
						"FILTER" => $arResult['FILTER_SMALL'], 
					)
				); ?>
				<? if(count($arResult['ITEMS']) > 0): ?>
					<div id="list" class="catalog_list">
						<? foreach($arResult['ITEMS'] AS $arItem): ?>
							<div class="catalog_item">
								<a href="/car/<?= $arItem['CODE']; ?>/" class="item_link" area-label="<?= $arItem['PROPERTIES']['BRAND']['RELATED']['NAME']; ?> <?= $arItem['PROPERTIES']['MODEL']['RELATED']['NAME']; ?>"></a>
								<img src="<?= $arItem['PROPERTIES']['IMAGE_URL']['VALUE']; ?>" alt="<?= $arItem['PROPERTIES']['BRAND']['RELATED']['NAME']; ?> <?= $arItem['PROPERTIES']['MODEL']['RELATED']['NAME']; ?> <?= $arItem['PROPERTIES']['BODY']['VALUE']; ?>" />
								<p class="item_class"><?= $arItem['PROPERTIES']['BRAND']['RELATED']['NAME']; ?> <?= $arItem['PROPERTIES']['MODEL']['RELATED']['NAME']; ?> <?= $arItem['PROPERTIES']['BODY']['VALUE']; ?></p>
								<p class="item_model">
									<b><?= $arItem['PROPERTIES']['MODIFICATION']['RELATED']['PROPERTIES']['TITLE']['VALUE']; ?></b>
									<?= $arItem['PROPERTIES']['ENGINE_FUEL']['VALUE']; ?>, <?= $arItem['PROPERTIES']['GEAR']['VALUE']; ?>, <?= $arItem['PROPERTIES']['ENGINE_POWER']['VALUE']; ?> л.с.
								</p>
								<ul>
									<li class="pay">
										<p>Ежемесячный платёж (от)</p>
										<p><?= $arItem['CALCULATION']['MONTHLY']; ?> р.</p>
									</li>
									<li>
										<p>Стоимость автомобиля (от)</p>
										<p><?= number_format($arItem['PROPERTIES']['PRICE']['VALUE'], 0, ".", " "); ?> р.</p>
									</li>
									<li>
										<p>Экономия по налогу на прибыль (до)</p>
										<p><?= $arItem['CALCULATION']['SAVINGS_TAX']; ?> р.</p>
									</li>
									<li>
										<p>НДС к возмещению из бюджета (до)</p>
										<p><?= $arItem['CALCULATION']['SAVINGS_VAT']; ?> р.</p>
									</li>
								</ul>
								<div class="item_footer">
									<span class="button button-blue">Рассчитать график</span>
								</div>
								<p></p>
							</div>
						<? endforeach; ?>
					</div>
				<? endif; ?>
				
				<div class="recom_models">
					<p class="title">Рекомендуемые модели Audi для вас</p>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>
				</div>
				
				<div class="other_models">
					<p class="title">Седаны в лизинг</p>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>

					<div class="oher_item">
						<a href="#">
							<span>Haval</span>
							<img src="https://evo.quickcode.ru/upload/iblock/192/5zet0bmwmm1ahj66fizv0hdz0f1z5m2l.jpg" alt="" loading="lazy" />
						</a>
					</div>
				</div>


				<button id="showMore" class="button">Показать еще</button>
				
				<?= $arResult['NAV_STRING']; ?>
			</div>


			</div>


			<aside class="rightColumn">
				<div class="banner special">
					<img src="https://evo.quickcode.ru/upload/iblock/e1d/jfbovbbwqj02dezcj5w81xte2cz2pgg4.jpg" alt="" width="254px" height="238px" />
					<p class="title">СКИДКИ ДО <big>1,5%</big> <span>+</span> СПЕЦТАРИФ НА КАСКО </p>
					<ul>
						<li>Скидки до 1,5% при покупке Land Rover в лизинг</li>
						<li>Специальный тариф на каско</li>
					</ul>
					<a href="#" aria-label="Подробнее" title="Подробнее"></a>
				</div>

				<div class="banner consultation">
					<p>Не можете найти нужный автомобиль?</p>
					<img src="/images/man.png" loading="lazy" alt="" width="131px" height="192px" />
					<div>
						<p>Спросите у консультанта</p>
						<a class="button">Задать вопрос</a>
					</div>
				</div>
			</aside>
		</div>
	</div>
</section>