@extends('layouts.syndron.app')

@section('content')
<div class="container py-5" dir="rtl">
    <!-- Hero -->
    <div class="row align-items-center g-4 mb-4">
        <div class="col-lg-7">
            <h1 class="fw-bold mb-3 text-primary">نظرات شما چراغ راه ماست</h1>
            <p class="lead text-muted mb-3">
                ما باور داریم که بهترین ایده‌ها و بهبودها از دل نظرات شما به دست می‌آیند.
                هر پیشنهاد یا بازخورد شما به ما کمک می‌کند خدمات بهتری ارائه کنیم.
            </p>
            <div class="d-flex gap-2">
                <a href="{{ route('admin.suggestion.form') }}" class="btn btn-primary">ارسال نظر</a>
                <a href="#why" class="btn btn-outline-primary">چرا بازخورد مهم است؟</a>
            </div>
        </div>
        <div class="col-lg-5">
            <div class="card shadow-sm border-0 text-center">
                <div class="card-body">
                    <h5 class="mb-2">ارتباط مستقیم</h5>
                    <p class="text-muted small mb-3">
                        از طریق لینک زیر می‌توانید بدون واسطه با ما در ارتباط باشید و نظرات خود را ثبت کنید.
                    </p>
                    <a href="mailto:e-commerce@alireza-hadizadeh.ir" class="btn btn-success w-100">ارتباط مستقیم</a>
                </div>
            </div>
        </div>
    </div>

    <!-- Why feedback -->
    <div id="why" class="mb-5">
        <h2 class="h4 fw-bold mb-3">چرا بازخورد شما برای ما مهم است؟</h2>
        <div class="row g-3">
            <div class="col-md-6 col-lg-4">
                <div class="card h-100 border-0 shadow-sm">
                    <div class="card-body">
                        <h5 class="card-title">بهبود کیفیت</h5>
                        <p class="card-text text-muted">با پیشنهادهای شما می‌توانیم مشکلات احتمالی را سریع‌تر رفع کنیم.</p>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-lg-4">
                <div class="card h-100 border-0 shadow-sm">
                    <div class="card-body">
                        <h5 class="card-title">توسعه امکانات</h5>
                        <p class="card-text text-muted">نیازهای واقعی شما مسیر توسعه ویژگی‌های جدید ما را مشخص می‌کند.</p>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-lg-4">
                <div class="card h-100 border-0 shadow-sm">
                    <div class="card-body">
                        <h5 class="card-title">اعتماد و شفافیت</h5>
                        <p class="card-text text-muted">نشان می‌دهیم که به صدای شما گوش می‌دهیم و تغییرات را بر اساس آن انجام می‌دهیم.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- CTA -->
    <div class="bg-light rounded-3 p-4 d-flex flex-column flex-md-row align-items-center justify-content-between">
        <div class="mb-3 mb-md-0">
            <h5 class="mb-1">همین حالا با ما در ارتباط باشید</h5>
            <p class="text-muted mb-0 small">نظرات و پیشنهادات شما مستقیماً به تیم ما ارسال خواهد شد.</p>
        </div>
        <div class="d-flex gap-2">
            <a href="mailto:info@alireza-hadizadeh.ir" class="btn btn-success">ارسال ایمیل مستقیم</a>
            <a href="{{ route('admin.suggestion.form') }}" class="btn btn-outline-primary">تکمیل فرم</a>
        </div>
    </div>
</div>
@endsection