@extends('layouts.app')

@section('title', 'About Us Section Management')

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">About Us Section Management</h1>
        <div class="page-subtitle">Update dealership heritage story, stats metrics, and showroom highlights.</div>
    </div>
</div>

@if(session('success'))
    <div class="alert alert-success border-0 shadow-sm" role="alert" style="border-radius: 12px; background-color: #DCFCE7; color: #15803D;">
        <i class="bi bi-check-circle-fill me-2"></i> {{ session('success') }}
    </div>
@endif

<div class="content-card">
    <div class="content-card-header">
        <h5 class="content-card-title"><i class="bi bi-info-circle"></i> Heritage & Brand Story Content</h5>
    </div>
    <div class="content-card-body">
        <form action="{{ route('admin.settings.update') }}" method="POST">
            @csrf
            <div class="row g-3">
                <div class="col-md-6">
                    <label class="form-label font-weight-bold">Section Eyebrow</label>
                    <input type="text" name="about_eyebrow" class="form-control" value="OUR HERITAGE">
                </div>
                <div class="col-md-6">
                    <label class="form-label font-weight-bold">Section Title</label>
                    <input type="text" name="about_title" class="form-control" value="A DECADE OF AUTOMOTIVE PERFECTION">
                </div>

                <div class="col-md-12">
                    <label class="form-label font-weight-bold">About Description Body</label>
                    <textarea name="about_body" class="form-control" rows="4">Founded in 2011, TNG Motors has established itself as a premier boutique automotive dealership...</textarea>
                </div>

                <div class="col-md-3">
                    <label class="form-label font-weight-bold">Vehicles Sold Metric</label>
                    <input type="text" name="stat_vehicles" class="form-control" value="4,500+">
                </div>
                <div class="col-md-3">
                    <label class="form-label font-weight-bold">Client Satisfaction Rate</label>
                    <input type="text" name="stat_satisfaction" class="form-control" value="99.4%">
                </div>
                <div class="col-md-3">
                    <label class="form-label font-weight-bold">Years of Heritage</label>
                    <input type="text" name="stat_years" class="form-control" value="15+ Years">
                </div>
                <div class="col-md-3">
                    <label class="form-label font-weight-bold">Master Technicians</label>
                    <input type="text" name="stat_techs" class="form-control" value="12 ASE Certified">
                </div>

                <div class="col-12 mt-4 text-end">
                    <button type="submit" class="btn btn-luxury-red px-4 py-2">
                        <i class="bi bi-check-circle-fill me-1"></i> Save About Us Details
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>
@endsection