taxbaik/TaxBaik.Web/Pages/Contact.cshtml

@page
@model TaxBaik.Web.Pages.ContactModel
@{
    ViewData["Title"] = "상담 신청 | 백원숙 세무회계";
}

<div class="container py-5" style="max-width: 600px;">
    <div class="d-flex align-items-center justify-content-between gap-3 mb-4">
        <h1 class="fw-bold mb-0">상담 신청</h1>
        <a href="/taxbaik" class="btn btn-outline-secondary btn-sm"
           onclick="if (history.length > 1) { history.back(); return false; }">
            뒤로가기
        </a>
    </div>

    @if (TempData["Success"] != null)
    {
        <div id="contact-success" class="alert alert-success alert-dismissible fade show" role="alert" role="status" style="font-size: 1.05rem;">
            <strong>✅ 성공!</strong> @TempData["Success"]
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
        <script>
            // 성공 메시지를 3초 후 자동 숨김 (사용자 클릭 가능)
            setTimeout(() => {
                const alert = document.getElementById('contact-success');
                if (alert) {
                    const bsAlert = new bootstrap.Alert(alert);
                    bsAlert.close();
                }
            }, 5000);
            // 폼 자동 초기화
            setTimeout(() => {
                document.querySelector('form').reset();
                document.getElementById('agree').checked = false;
            }, 1000);
        </script>
    }

    <form method="post" id="contactForm">
        @Html.AntiForgeryToken()
        <div asp-validation-summary="ModelOnly" class="text-danger mb-3"></div>

        <div class="mb-3">
            <label for="name" class="form-label">이름 <span class="text-danger">*</span></label>
            <input type="text" class="form-control" id="name" name="Name" required />
        </div>

        <div class="mb-3">
            <label for="phone" class="form-label">전화번호 <span class="text-danger">*</span></label>
            <input type="tel" class="form-control" id="phone" name="Phone" placeholder="010-0000-0000" required />
            <small class="form-text text-muted">형식: 010-0000-0000</small>
        </div>

        <div class="mb-3">
            <label for="email" class="form-label">이메일</label>
            <input type="email" class="form-control" id="email" name="Email" />
        </div>

        <div class="mb-3">
            <label for="service" class="form-label">상담분야</label>
            <select class="form-select" id="service" name="ServiceType">
                <option value="기장">사업자 기장</option>
                <option value="양도세">부동산 양도세</option>
                <option value="종소세">종합소득세</option>
                <option value="증여상속">증여상속세</option>
                <option value="기타">기타</option>
            </select>
        </div>

        <div class="mb-3">
            <label for="message" class="form-label">문의내용 <span class="text-danger">*</span></label>
            <textarea class="form-control" id="message" name="Message" rows="5" required></textarea>
        </div>

        <div class="mb-3 form-check">
            <input type="checkbox" class="form-check-input" id="agree" name="Agree" required />
            <label class="form-check-label" for="agree">
                개인정보 수집·이용에 동의합니다
            </label>
        </div>

        <button type="submit" class="btn btn-primary btn-lg w-100">상담신청</button>
    </form>

    <hr class="my-5" />

    <h5 class="fw-bold mb-3">빠른 상담을 원하시나요?</h5>
    <p>카카오톡 채널을 통해 더 빠르게 상담받을 수 있습니다.</p>
    <div class="gap-2 d-flex flex-wrap">
        <a href="http://pf.kakao.com/_xoxchTX" target="_blank" class="btn btn-warning">카카오톡 채널 문의</a>
        <a href="tel:010-4122-8268" class="btn btn-outline-primary">전화 상담</a>
    </div>
</div>