import React from "react";
import Head from 'next/head';
import Image from 'next/image';

import Header from './components/Header';
import Footer from './components/Footer';

export default function AdditionalPage() {
	return (
		<React.Fragment>
			<Head>
				<title>ЛК Эволюция автолизинга</title>
				<meta
					name="description"
					content="ЛК Эволюция автолизинга"
				/>
			</Head>
			<Header />
			<main>
				<section>
					<div className="clear"></div>
					<div className="container">
						<div className="title_wrapper">
							<div className="left">
								<h1 className="section_title">Договор №1234/2021 от 10.01.2021</h1>
							</div>
							<div className="right">
								<p align="right">
									<b>ООО “Друзья и КО”</b><br />
									ИНН: 12345678765 КПП: 13432-02
								</p>
							</div>
						</div>


						<div className="aside_container about">
							<aside>
								<ul className="aside_nav">
									<li>
										<a href="#">График платежей</a>
									</li>
									<li>
										<a href="#" className="active">Дополнительные услуги</a>
									</li>
									<li>
										<a href="#">Договор</a>
									</li>
									<li>
										<a href="#">Документы по сделке</a>
									</li>
								</ul>
							</aside>
							<article>
								<div className="dropdown_blocks_list filled">
									<div className="dropdown_block">
										<div className="block_header">
											<p className="with-icon">
												<img src="/assets/images/lk/additional-1.svg" alt="Карта РАТ" width="32px" height="32px" />
												Карта РАТ
											</p>
											<button className="block_toggle"></button>
										</div>

										<div className="block_body">
											<div className="company">
												<p className="title">Каско</p>

												<ul>
													<li>Страховая компания: <b>Согласие</b></li>
													<li>Сайт: <b>www.sog.ru</b></li>
													<li>Телефон: <b>+74951112233</b></li>
													<li>Номер полиса: <b>34234324324324</b></li>
													<li>Период действия: <b>01/01/2020 - 01/01/2025</b></li>
													<li>Страховая сумма: <b>3 400 000,00 р.</b></li>
												</ul>
											</div>

											<p>Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент Текстовый контент</p>
										</div>
									</div>

									<div className="dropdown_block">
										<div className="block_header">
											<p className="with-icon">
												<img src="/assets/images/lk/additional-2.svg" alt="Страхование" width="32px" height="32px" />
												Страхование
											</p>
											<button className="block_toggle"></button>
										</div>

										<div className="block_body">

										</div>
									</div>

									<div className="dropdown_block">
										<div className="block_header">
											<p className="with-icon">
												<img src="/assets/images/lk/additional-3.svg" alt="Регистрация" width="32px" height="32px" />
												Регистрация
											</p>
											<button className="block_toggle"></button>
										</div>

										<div className="block_body">

										</div>
									</div>

									<div className="dropdown_block">
										<div className="block_header">
											<p className="with-icon">
												<img src="/assets/images/lk/additional-4.svg" alt="Телематика" width="32px" height="32px" />
												Телематика
											</p>
											<button className="block_toggle"></button>
										</div>

										<div className="block_body">

										</div>
									</div>
								</div>
							</article>
						</div>
					</div>
				</section>

				<section id="order">
					<div className="container wide">
						<h2 className="section_title">Купить в лизинг?</h2>
						<div className="order_form">
							<div className="order_email">
								<p>Напишите на <a href="mailto:">buy@domain.ru</a> или заполните форму</p>
							</div>
							<form>
								<div className="form_field">
									<input type="text" value="" placeholder="Имя" />
								</div>
								<div className="form_field">
									<input type="tel" value="" placeholder="Телефон" />
								</div>
								<div className="form_field">
									<input type="email" value="" placeholder="E-mail" />
								</div>
								<div className="form_field">
									<input type="text" value="" placeholder="Организация" />
								</div>
								<div className="policy">
									<input type="checkbox" name="policy" id="policy" hidden checked />
									<label for="policy">Даю свое согласие на обработку моих персональных данных</label>
								</div>
								<button className="button">Отправить</button>
							</form>
						</div>
					</div>
				</section>
			</main>
			<Footer authenticated={ true }/>
		</React.Fragment>
	)
}
