{% extends '../_layouts/_main.twig' %}
{% block content %}
	<div class="panel panel-tabs">
		<ul class="nav nav-tabs nav-tabs_b">
			<li>
				<a href="uni-goods.html">Супергруппы</a>
			</li>
			<li>
				<a href="uni-goods--categories.html">Категории</a>
			</li>
			<li class="active">
				<a href="uni-goods--goods.html">Товары</a>
			</li>
		</ul>
		<div class="panel-body">

			<div class="cp-uni-goods">
				<form class="cpug-form">
					<div class="cpug-form__side">
						<div class="form-group">
							<div class="form-label">Найти</div>
							<div class="input-group">
								<input class="form-control" type="text" value="" />
								<div class="input-group-btn">
									<button class="btn btn-primary"><i class="fa fa-search"></i></button>
								</div>
							</div>
						</div>
					</div>
					<div class="cpug-form__body">
						<div class="form-group">
							<div class="form-label">Супергруппы</div>
							<div class="form-field watcher" data-reset-text="Сбросить">
								<select class="form-control selectpicker" data-container="body" multiple data-actions-box="true" data-select-all-text="Выбрать всё" data-deselect-all-text="Убрать всё" data-none-selected-text="Сделайте выбор">
									<option>Супергруппа</option>
									<option>Просмотры</option>
									<option>Покупки</option>
									<option>Покупки %</option>
									<option>Без «В корзину» %</option>
									<option>Фото 360 %</option>
									<option>Вес указан %</option>
								</select>
							</div>
						</div>
						<div class="form-group">
							<div class="form-label">Категории</div>
							<div class="form-field watcher" data-reset-text="Сбросить">
								<select class="form-control selectpicker" data-container="body" multiple data-actions-box="true" data-select-all-text="Выбрать всё" data-deselect-all-text="Убрать всё" data-none-selected-text="Сделайте выбор">
									<option>Супергруппа</option>
									<option>Просмотры</option>
									<option>Покупки</option>
									<option>Покупки %</option>
									<option>Без «В корзину» %</option>
									<option>Фото 360 %</option>
									<option>Вес указан %</option>
								</select>
							</div>
						</div>
						<div class="form-group">
							<div class="form-label">Показать колонки</div>
							<div class="form-field watcher" data-reset-text="Сбросить">
								<select class="form-control selectpicker" data-container="body" multiple data-actions-box="true" data-select-all-text="Выбрать всё" data-deselect-all-text="Убрать всё" data-none-selected-text="Сделайте выбор">
									<option>Кузов</option>
									<option>Оптика</option>
									<option>Запчасти для тюнинга</option>
									<option>Зеркала</option>
									<option>Фильтры</option>
									<option>Тормоза</option>
									<option>Подвеска и управление</option>
									<option>Амортизаторы и пружины</option>
									<option>Электрика</option>
									<option>Охлаждение</option>
									<option>Двигатель</option>
									<option>Привод</option>
									<option>Ремни и ролики</option>
									<option>Элементы подвески и системы управления</option>
									<option>Газовые пружины</option>
									<option>Элементы охраны</option>
									<option>Стеклоочистители</option>
									<option>Переключатели</option>
									<option>Салон</option>
								</select>
							</div>
						</div>
					</div>
				</form>

				<div class="cpug-table">
					<div class="scroller-x">
						<div class="sticky-header fixed" data-offset="40">
							<div class="sticky-header__head">
								<table class="table">
									<thead class="thead-clear">
									<tr>
										<th>Найдено: <strong>32</strong></th>
										<th></th>
										<th></th>
										<th class="rotate">
											<div class="rotate-title"><span title="Просмотры">Просмотры</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Покупки">Покупки</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Покупки %">Покупки %</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Без «В корзине»">Без «В корзине»</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Фото 360 %">Фото 360 %</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Вес указан">Вес указан</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Вес указан %">Вес указан %</span></div>
										</th>
									</tr>
									</thead>
									<thead class="thead-gray">
									<tr>
										<th>
											<span class="js-table-sort">Товар <i class="js-table-sort-arr"></i></span>
										</th>
										<th>
											<span class="js-table-sort">Категория <i class="js-table-sort-arr"></i></span>
										</th>
										<th>
											<span class="js-table-sort">Супергруппа <i class="js-table-sort-arr"></i></span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
									</tr>
									</thead>
									<thead class="thead-blue">
									<tr>
										<th></th>
										<th></th>
										<th></th>
										<th class="text-right">14093</th>
										<th class="text-right">298</th>
										<th class="text-right">15.8</th>
										<th class="text-right">2.3</th>
										<th class="text-right">0.6</th>
										<th class="text-right">0.8%</th>
										<th class="text-right">72.2%</th>
									</tr>
									</thead>
								</table>
							</div>
							<div class="sticky-header__body">
								<table class="table sticky-header__sizer">
									<thead class="thead-clear">
									<tr>
										<th>Найдено: <strong>32</strong></th>
										<th></th>
										<th></th>
										<th class="rotate">
											<div class="rotate-title"><span title="Просмотры">Просмотры</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Покупки">Покупки</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Покупки %">Покупки %</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Без «В корзине»">Без «В корзине»</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Фото 360 %">Фото 360 %</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Вес указан">Вес указан</span></div>
										</th>
										<th class="rotate">
											<div class="rotate-title"><span title="Вес указан %">Вес указан %</span></div>
										</th>
									</tr>
									</thead>
									<thead class="thead-gray">
									<tr>
										<th>
											<span class="js-table-sort">Товар <i class="js-table-sort-arr"></i></span>
										</th>
										<th>
											<span class="js-table-sort">Категория <i class="js-table-sort-arr"></i></span>
										</th>
										<th>
											<span class="js-table-sort">Супергруппа <i class="js-table-sort-arr"></i></span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
										<th>
											<span class="js-table-sort xs"><i class="js-table-sort-arr"></i>&nbsp;</span>
										</th>
									</tr>
									</thead>
									<thead class="thead-blue">
									<tr>
										<th></th>
										<th></th>
										<th></th>
										<th class="text-right">14093</th>
										<th class="text-right">298</th>
										<th class="text-right">15.8</th>
										<th class="text-right">2.3</th>
										<th class="text-right">0.6</th>
										<th class="text-right">0.8%</th>
										<th class="text-right">72.2%</th>
									</tr>
									</thead>
									<tbody>
									<tr>
										<td data-sort="защитная плёнка">
											<div class="cpug-table-product">
												<div class="image">
													<a href="/ru/kataloog/varuosa/13642675/" class="aimbox-link hover" title="Защитная пленка Romix"
														data-href="https://alpics.info/pics/spares/big/51228.jpg"
														data-msg="Нажмите ESC для выхода из полноэкранного режима"
														data-closer="Закрыть окно">
														<img src="https://pics1.alpics.info/pics/spares/big/13642675.jpg" alt="Защитная пленка Romix" />
													</a>
												</div>
												<div class="body">
													<a href="#">Защитная плёнка</a>
													<div class="color-gray">AL2093838</div>
												</div>
											</div>
										</td>
										<td data-sort="защитная пленка">Защитная пленка <span class="color-gray">(2)</span></td>
										<td data-sort="кузов">Кузов <span class="color-gray">(2)</span></td>
										<td data-sort="19345" class="text-right">19345</td>
										<td data-sort="267" class="text-right highlight-success">267</td>
										<td data-sort="19.4" class="text-right highlight-danger">19.4</td>
										<td data-sort="2.4" class="text-right highlight-danger">2.4</td>
										<td data-sort="0.3" class="text-right">0.3</td>
										<td data-sort="69.4" class="text-right">69.4</td>
										<td data-sort="15345" class="text-right">15345</td>
									</tr>
									<tr>
										<td data-sort="рамка номерного знака">
											<div class="cpug-table-product">
												<div class="image">
													<a href="/ru/kataloog/varuosa/200700/25443" class="aimbox-link hover click" title="Рамка номерного знака"
														data-href="https://pics1.alpics.info/pics/spares/big/200700.jpg"
														data-msg="Нажмите ESC для выхода из полноэкранного режима"
														data-closer="Закрыть окно">
														<img src="https://pics1.alpics.info/pics/spares/big/200700.jpg" alt="Рамка номерного знака" />
													</a>
												</div>
												<div class="body">
													<a href="#">Рамка номерного знака</a>
													<div class="color-gray">AL2093838</div>
												</div>
											</div>
										</td>
										<td data-sort="рамка номерного знака">Рамка номерного знака <span class="color-gray">(2)</span></td>
										<td data-sort="кузов">Кузов <span class="color-gray">(2)</span></td>
										<td data-sort="17882" class="text-right highlight-success">17882</td>
										<td data-sort="326" class="text-right highlight-danger">326</td>
										<td data-sort="17.4" class="text-right highlight-danger">17.4</td>
										<td data-sort="3.2" class="text-right highlight-success">3.2</td>
										<td data-sort="0.7" class="text-right">0.7</td>
										<td data-sort="56.75" class="text-right highlight-danger">56.75</td>
										<td data-sort="76155" class="text-right">76155</td>
									</tr>
									<tr>
										<td data-sort="комплект гидрофильтров, автоматическая коробка передач">
											<div class="cpug-table-product">
												<div class="image">
													<a href="https://carparts.alpics.info/pics/td/9/f/50_1246775.jpg" class="aimbox-link hover click"
														title="Комплект гидрофильтров, автоматическая коробка передач MEYLE 300 243 4108/S"
														data-href="https://carparts.alpics.info/pics/td/9/f/50_1246775.jpg"
														data-msg="Нажмите ESC для выхода из полноэкранного режима"
														data-closer="Закрыть окно">
														<img src="https://carparts.alpics.info/pics/td/9/f/50_1246775.jpg" alt="Комплект гидрофильтров, автоматическая коробка передач MEYLE 300 243 4108/S" />
													</a>
												</div>
												<div class="body">
													<a href="#">Рамка номерного знака</a>
													<div class="color-gray">AL2093838</div>
												</div>
											</div>
										</td>
										<td data-sort="комплект гидрофильтров, автоматическая коробка передач">Комплект гидрофильтров, автоматическая коробка передач <span class="color-gray">(2)</span></td>
										<td data-sort="фильтры">Фильтры <span class="color-gray">(2)</span></td>
										<td data-sort="21854" class="text-right">21854</td>
										<td data-sort="321" class="text-right highlight-success">321</td>
										<td data-sort="18.2" class="text-right highlight-success">18.2</td>
										<td data-sort="7.3" class="text-right highlight-success">7.3</td>
										<td data-sort="1.2" class="text-right">1.2</td>
										<td data-sort="76" class="text-right highlight-danger">76</td>
										<td data-sort="7522" class="text-right highlight-success">7522</td>
									</tr>
									<tr>
										<td data-sort="Наконечник рулевой тяги">
											<div class="cpug-table-product">
												<div class="image">
													<a href="/ru/kataloog/varuosa/31262579/2874" class="cpd-image__preview aimbox-link hover click" title="Наконечник рулевой тяги"
														data-href="https://alpics.info/pics/product_groups_default_pics/ww/ru/medium/1401.jpg"
														data-msg="Нажмите ESC для выхода из полноэкранного режима"
														data-closer="Закрыть окно">
														<img src="https://alpics.info/pics/product_groups_default_pics/ww/ru/medium/1401.jpg" alt="Наконечник рулевой тяги" />
													</a>
												</div>
												<div class="body">
													<a href="#">Рамка номерного знака</a>
													<div class="color-gray">AL2093838</div>
												</div>
											</div>
										</td>
										<td data-sort="наконечник рулевой тяги">Наконечник рулевой тяги <span class="color-gray">(2)</span></td>
										<td data-sort="подвеска и управление">Подвеска и управление <span class="color-gray">(2)</span></td>
										<td data-sort="23117" class="text-right">23117</td>
										<td data-sort="419" class="text-right">419</td>
										<td data-sort="21.8" class="text-right highlight-success">21.8</td>
										<td data-sort="3.7" class="text-right highlight-danger">3.7</td>
										<td data-sort="1.72" class="text-right highlight-success">1.72</td>
										<td data-sort="64.4" class="text-right highlight-success">64.4</td>
										<td data-sort="78188" class="text-right">78188</td>
									</tr>
									</tbody>
								</table>
							</div>
						</div>
					</div>
				</div>
			</div>

		</div>
	</div>
{% endblock %}