@model ContactViewModel
@{
    ViewData["Title"] = "Контакты";
}

<div class="page-head">
    <span class="section-overline">Контакты</span>
    <h1 class="page-title">Свяжитесь с нами</h1>
    <p class="page-subtitle">Ответим в ближайшее время в рабочие часы.</p>
</div>

<div class="contacts-panel">
    <div class="row g-4">

        
        <div class="col-md-5">
            <h2 class="form-heading">Наши контакты</h2>

            
            <div class="contact-row">
                <span class="contact-row__icon"><i class="bi bi-geo-alt"></i></span>
                <div>
                    <div class="contact-row__label">Адрес</div>
                    <p class="contact-row__value">г. Москва, ул. Примерная, д. 42, офис 101</p>
                </div>
            </div>

            
            <div class="contact-row">
                <span class="contact-row__icon"><i class="bi bi-telephone"></i></span>
                <div>
                    <div class="contact-row__label">Телефон</div>
                    <p class="contact-row__value">
                        <a href="tel:+79991234567">+7 (999) 123-45-67</a>
                    </p>
                </div>
            </div>

            
            <div class="contact-row">
                <span class="contact-row__icon"><i class="bi bi-envelope"></i></span>
                <div>
                    <div class="contact-row__label">Почта</div>
                    <p class="contact-row__value">
                        <a href="mailto:info@technomir.ru">info@technomir.ru</a>
                    </p>
                </div>
            </div>

            
            <div class="contact-row">
                <span class="contact-row__icon"><i class="bi bi-clock"></i></span>
                <div>
                    <div class="contact-row__label">Режим работы</div>
                    <p class="contact-row__value">Пн–Вс: 10:00 — 20:00</p>
                </div>
            </div>
        </div>

        
        <div class="col-md-7">
            <h2 class="form-heading">Напишите нам</h2>

            
            @if (TempData["ContactSuccess"] != null)
            {
                <div class="alert alert-success alert-dismissible fade show" role="alert">
                    @TempData["ContactSuccess"]
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Закрыть"></button>
                </div>
            }

            
            <form asp-action="Contacts" method="post">
                
                <div class="mb-3">
                    <label asp-for="Name" class="form-label">Ваше имя</label>
                    <input asp-for="Name" class="form-control" placeholder="Иван Иванов" />
                    
                    <span asp-validation-for="Name" class="field-validation-error"></span>
                </div>

                
                <div class="mb-3">
                    <label asp-for="Phone" class="form-label">Телефон</label>
                    <input asp-for="Phone" class="form-control" placeholder="+7 (999) 123-45-67" />
                    <span asp-validation-for="Phone" class="field-validation-error"></span>
                </div>

                
                <div class="mb-3">
                    <label asp-for="Message" class="form-label">Сообщение</label>
                    <textarea asp-for="Message" class="form-control" rows="4" placeholder="Ваш вопрос или пожелание..."></textarea>
                    <span asp-validation-for="Message" class="field-validation-error"></span>
                </div>

                <button type="submit" class="btn btn-primary">Отправить сообщение</button>
            </form>
        </div>
    </div>
</div>

@section Scripts {
    <script src="~/lib/jquery/dist/jquery.min.js"></script>
    <script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
    <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
}