@extends('admin.layouts.base')
@section('title', 'Create Additional Service')

@section('content')
<div id="kt_app_content_container" class="app-container">
    <div class="card">
        <div class="card-header border-0 pt-6">
            <div class="card-title">
                <h3 class="fw-bold">Create Additional Service</h3>
            </div>
        </div>

        <div class="card-body py-4">
            <form action="{{ route('admin.additional-services.store') }}" method="POST">
                @csrf
                
                <div class="mb-5">
                    <label class="form-label required">Service Name</label>
                    <input type="text" name="name" class="form-control form-control-solid @error('name') is-invalid @enderror" value="{{ old('name') }}" required>
                    @error('name')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>

                <div class="mb-5">
                    <label class="form-label">Description</label>
                    <textarea name="description" class="form-control form-control-solid @error('description') is-invalid @enderror" rows="3">{{ old('description') }}</textarea>
                    @error('description')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>

                <div class="row mb-5">
                    <div class="col-md-6">
                        <label class="form-label required">Price Type</label>
                        <select name="price_type" class="form-select form-select-solid @error('price_type') is-invalid @enderror" required>                            
                            <option value="per_unit" {{ old('price_type') == 'per_unit' ? 'selected' : '' }}>Per Unit</option>
                            <option value="per_hour" {{ old('price_type') == 'per_hour' ? 'selected' : '' }}>Per Hour</option>
                            <option value="fixed_fee" {{ old('price_type') == 'fixed_fee' ? 'selected' : '' }}>Fixed Fee</option>
                        </select>
                        @error('price_type')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-md-6">
                        <label class="form-label required">Base Price ($)</label>
                        <input type="number" step="0.01" name="base_price" class="form-control form-control-solid @error('base_price') is-invalid @enderror" value="{{ old('base_price') }}" required>
                        @error('base_price')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="mb-5">
                    <label class="form-label">Unit Label (Optional)</label>
                    <input type="text" name="unit_label" class="form-control form-control-solid @error('unit_label') is-invalid @enderror" value="{{ old('unit_label') }}" placeholder="e.g., per pallet, per hour">
                    <div class="form-text">Required if Price Type is "Per Unit"</div>
                    @error('unit_label')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>

                <div class="mb-5">
                    <div class="form-check form-switch form-check-custom form-check-solid">
                        <input class="form-check-input" type="checkbox" name="is_active" value="1" id="is_active" {{ old('is_active', '1') == '1' ? 'checked' : '' }} />
                        <label class="form-check-label" for="is_active">
                            Active Status
                        </label>
                    </div>
                </div>

                <div class="d-flex justify-content-end">
                    <a href="{{ route('admin.additional-services.index') }}" class="btn btn-light me-3">Cancel</a>
                    <button type="submit" class="btn btn-primary">Create Service</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection