@extends('manager.layouts.app')
@section('page_title') {{ $page_title ?? 'Create FAQs' }} @endsection
@push('head-scripts')
    <style>
        img { max-width: 100%; }
        .form-label { font-weight: 600; font-size: 0.875rem; }
        .input-group-text { font-size: 0.85rem; background-color: #f8f9fa; }
    </style>
@endpush

@section('content')
    <div class="card mt-3">
        <div class="card-body">
            {{-- Page Header --}}
            <x-page-header :title="$p_title" :summary="$p_summary" :url="auth()->user()->can('manager_transaction_faqs-list') ? $url : null" :urlText="$url_text"/>

            <form method="{{ $method }}" action="{{ $action }}" enctype="{{ $enctype }}">
                @csrf

                <div class="row g-3 mb-4">
                    <div class="col-md-6">
                        <label class="form-label" for="question">Question</label>
                        <input type="text" name="question" id="question" required 
                               class="form-control @error('question') is-invalid @enderror" 
                               placeholder="e.g. FSC" value="{{ old('question') }}">
                        @error('question') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>

                    <div class="col-md-3">
                        <label class="form-label" for="status">Status</label>
                        <select name="status" class="form-select">
                            <option value="1" {{ old('status') == '1' ? 'selected' : '' }}>Active</option>
                            <option value="0" {{ old('status') == '0' ? 'selected' : '' }}>Inactive</option>
                        </select>
                    </div>

                    <div class="col-md-3">
                        <label class="form-label" for="sort_order">Sort Order</label>
                        <input type="text" name="sort_order" id="sort_order" required 
                               class="form-control @error('sort_order') is-invalid @enderror" 
                               placeholder="Enter sort order" value="{{ old('sort_order') }}">
                        @error('sort_order') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>

                    <div class="col-md-12">
                        <label class="form-label" for="answer">Answer</label>
                        <textarea name="answer" id="answer" required 
                               class="form-control @error('answer') is-invalid @enderror" 
                               placeholder="Enter the answer">{{ old('answer') }}</textarea>
                        @error('answer') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>
                </div>

                <div class="card-footer bg-transparent border-0 px-0">
                    <button type="submit" class="btn btn-success px-4 text-white">
                        <i class="cil-save"></i> Save FAQ
                    </button>
                </div>
            </form>

            @if(!empty($p_description))
                <div class="alert alert-light border mt-4">
                    <p class="mb-0 small text-muted">{{ $p_description }}</p>
                </div>
            @endif
        </div>
    </div>
@endsection

@push('footer-scripts')
    @if(Session::has('messages'))
        <script>noti({!! json_encode(Session::get('messages')) !!});</script>
    @endif
@endpush