@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <div class="row mb-4">
        <div class="col-12">
            <h1 class="page-title"><i class="bi bi-plus-circle"></i> Nuevo Artículo</h1>
            <p class="text-muted">Crear un nuevo artículo en la base de conocimiento</p>
        </div>
    </div>

    <div class="row">
        <div class="col-lg-10 mx-auto">
            <div class="card shadow-sm">
                <div class="card-body">
                    <form method="POST" action="{{ route('knowledge-base.store') }}">
                        @csrf

                        <div class="mb-3">
                            <label class="form-label">Título <span class="text-danger">*</span></label>
                            <input type="text" name="title" class="form-control @error('title') is-invalid @enderror" value="{{ old('title') }}" required>
                            @error('title')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>

                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Categoría <span class="text-danger">*</span></label>
                                <select name="category" class="form-select @error('category') is-invalid @enderror" required>
                                    <option value="">Seleccionar...</option>
                                    <option value="faq" {{ old('category') == 'faq' ? 'selected' : '' }}>FAQ</option>
                                    <option value="tutorial" {{ old('category') == 'tutorial' ? 'selected' : '' }}>Tutorial</option>
                                    <option value="troubleshooting" {{ old('category') == 'troubleshooting' ? 'selected' : '' }}>Solución de Problemas</option>
                                    <option value="documentation" {{ old('category') == 'documentation' ? 'selected' : '' }}>Documentación</option>
                                </select>
                                @error('category')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            </div>

                            <div class="col-md-6 mb-3">
                                <label class="form-label">Proyecto (Opcional)</label>
                                <select name="project_id" class="form-select">
                                    <option value="">General - Sin proyecto</option>
                                    @foreach($projects as $project)
                                        <option value="{{ $project->id }}" {{ old('project_id') == $project->id ? 'selected' : '' }}>{{ $project->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label class="form-label">Contenido <span class="text-danger">*</span></label>
                            <textarea name="content" class="form-control @error('content') is-invalid @enderror" rows="15" required>{{ old('content') }}</textarea>
                            @error('content')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            <small class="form-text text-muted">Soporta Markdown para formato</small>
                        </div>

                        <div class="mb-3">
                            <label class="form-label">Tags (separados por comas)</label>
                            <input type="text" name="tags" class="form-control" value="{{ old('tags') }}" placeholder="error, configuración, instalación">
                            <small class="form-text text-muted">Ejemplo: error, configuración, base de datos</small>
                        </div>

                        <div class="mb-3">
                            <div class="form-check form-switch">
                                <input class="form-check-input" type="checkbox" name="is_public" id="is_public" {{ old('is_public') ? 'checked' : '' }}>
                                <label class="form-check-label" for="is_public">Visible para clientes</label>
                            </div>
                        </div>

                        <div class="mb-3">
                            <div class="form-check form-switch">
                                <input class="form-check-input" type="checkbox" name="is_featured" id="is_featured" {{ old('is_featured') ? 'checked' : '' }}>
                                <label class="form-check-label" for="is_featured">Artículo destacado</label>
                            </div>
                        </div>

                        <div class="d-flex justify-content-end gap-2">
                            <a href="{{ route('knowledge-base.index') }}" class="btn btn-secondary">Cancelar</a>
                            <button type="submit" class="btn btn-primary"><i class="bi bi-check-circle"></i> Crear Artículo</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection