@extends('layouts.app')

@section('content')
<div class="container mt-5">
    <div class="card shadow-lg rounded-lg">
        <div class="card-header bg-secondary text-white">
            <h2 class="h4">Add Event Category</h2>
        </div>
        <div class="card-body">
            <form action="{{ route('events.store-category') }}" method="POST">
                @csrf

                <!-- Category Name -->
                <div class="mb-3">
                    <label for="category_name" class="form-label">Category Name*</label>
                    <input type="text" name="category_name" id="category_name"
                           class="form-control @error('category_name') is-invalid @enderror"
                           value="{{ old('category_name') }}">
                    @error('category_name')
                    <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>

                <!-- Category Description -->
                <div class="mb-3">
                    <label for="category_description" class="form-label">Category Description</label>
                    <textarea name="category_description" id="category_description" rows="4"
                              class="form-control @error('category_description') is-invalid @enderror">{{ old('category_description') }}</textarea>
                    @error('category_description')
                    <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>

                <!-- Submit Button -->
                <div class="d-grid mt-4">
                    <button type="submit" class="btn btn-primary">
                        Submit
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>


<script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/6.8.2/tinymce.min.js"></script>
<script>
    document.addEventListener("DOMContentLoaded", function () {
        tinymce.init({
            selector: '#category_description',
            plugins: 'lists link image table code help wordcount',
            toolbar: 'undo redo | formatselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
            menubar: false,
            height: 200,
        });
    });
</script>

@endsection