@extends('layouts.master')
@section('title')
    Service Sub Categories
@endsection

@section('content')
    @section('content')
    @component('components.breadcrumb')
    @slot('li_1')
        Services
    @endslot
    @slot('title')
        Service Sub Categories
    @endslot
    @endcomponent

    <div class="card info-card pt-5 ps-3">
        <div class="card-body">
            <form action="{{ route('service_sub_categories.store') }}" method="post">
                @csrf

                <div class="row">
                    <div class="col-6 mb-3">
                        <label for="name" class="form-label">Name</label>
                        <input type="text" class="form-control" name="name" value="{{ old('name') }}" />
                        @error('name')
                            <span class="text-danger">{{ $message }}</span>
                        @enderror
                    </div>

                    <div class="col-6 mb-3">
                        <div class="form-group">
                            <label for="category_id">Category</label>
                            <select name="category_id" id="category_id" class="form-select">
                                <option value="" selected="" disabled="">Select Category</option>
                                @foreach ($categories as $category)
                                    <option value="{{ $category->id }}">{{ $category->name }}</option>
                                @endforeach
                            </select>
                            @error('category_id')
                                <span class="text-danger">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>

                    <div class="col-3 mb-3 mt-4 ms-2">
                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox" id="flexSwitchCheckChecked" name="published" checked>
                            <label class="form-check-label" for="flexSwitchCheckChecked">Active</label>
                        </div>
                        @error('published')
                            <span class="text-danger">{{ $message }}</span>
                        @enderror
                    </div>
                </div>

                <hr>
                <button type="submit" class="btn btn-round btn-success col-md-1 me-2">Save</button>
                <a href="{{ route('service_sub_categories.all') }}" style="width: 200px" class="btn btn-secondary"><i class="fa fa-chevron-circle-left" aria-hidden="true"></i> Back</a>
            </form>
        </div>
    </div>
@endsection