@props(['project' => null, 'categories', 'technologies'])

{{-- --- Basic Information (Section 9.23) ------------------------------- --}}
<div class="admin-card p-4 mb-4">
    <h2 class="h6 mb-3">Basic Information</h2>

    <div class="mb-3">
        <label for="title" class="form-label">Project Title</label>
        <input type="text" name="title" id="title" class="form-control @error('title') is-invalid @enderror" value="{{ old('title', $project->title ?? '') }}" required>
        @error('title')<div class="invalid-feedback">{{ $message }}</div>@enderror
    </div>

    <div class="mb-3">
        <label for="slug" class="form-label">Slug <span class="text-muted">(auto-generated if left blank)</span></label>
        <input type="text" name="slug" id="slug" class="form-control @error('slug') is-invalid @enderror" value="{{ old('slug', $project->slug ?? '') }}">
        @error('slug')<div class="invalid-feedback">{{ $message }}</div>@enderror
    </div>

    <div class="mb-3">
        <label for="portfolio_category_id" class="form-label">Category</label>
        <select name="portfolio_category_id" id="portfolio_category_id" class="form-select @error('portfolio_category_id') is-invalid @enderror" required>
            <option value="">Select a category…</option>
            @foreach($categories as $category)
                <option value="{{ $category->id }}" @selected(old('portfolio_category_id', $project->portfolio_category_id ?? '') == $category->id)>{{ $category->name }}</option>
            @endforeach
        </select>
        @error('portfolio_category_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
        <div class="form-text">
            <a href="{{ route('admin.portfolio-categories.index') }}" target="_blank">Manage categories</a>
        </div>
    </div>

    <div class="mb-3">
        <label for="short_description" class="form-label">Short Description <span class="text-muted">(used on cards &amp; SEO fallback, max 320 chars)</span></label>
        <textarea name="short_description" id="short_description" class="form-control @error('short_description') is-invalid @enderror" rows="2" maxlength="320" required>{{ old('short_description', $project->short_description ?? '') }}</textarea>
        @error('short_description')<div class="invalid-feedback">{{ $message }}</div>@enderror
    </div>

    <div class="mb-3">
        <label for="full_description" class="form-label">Full Description <span class="text-muted">(rich text — Project Overview section)</span></label>
        <textarea
            name="full_description"
            id="full_description"
            class="form-control @error('full_description') is-invalid @enderror"
            rows="8"
            data-rich-text-editor
        >{{ old('full_description', $project->full_description ?? '') }}</textarea>
        @error('full_description')<div class="invalid-feedback">{{ $message }}</div>@enderror
        <div class="form-text">Supports basic HTML: paragraphs, lists, links, headings, code blocks.</div>
    </div>

    <div class="mb-3">
        <label for="featured_image" class="form-label">Featured Image</label>
        @if(($project->featured_image_path ?? null))
            <div class="mb-2">
                <img src="{{ $project->featuredImageUrl() }}" alt="" style="max-height: 120px; border-radius: var(--radius-card);">
            </div>
        @endif
        <input type="file" name="featured_image" id="featured_image" class="form-control @error('featured_image') is-invalid @enderror" accept="image/jpeg,image/png,image/webp" @if(! $project) required @endif>
        @error('featured_image')<div class="invalid-feedback">{{ $message }}</div>@enderror
        @if($project)<div class="form-text">Leave blank to keep the current image.</div>@endif
    </div>
</div>

{{-- --- Project Details (Section 9.2) ------------------------------------ --}}
<div class="admin-card p-4 mb-4">
    <h2 class="h6 mb-3">Project Details</h2>

    <div class="row">
        <div class="col-md-12 mb-3">
            <label for="client_name" class="form-label">Client Name <span class="text-muted">(optional)</span></label>
            <input type="text" name="client_name" id="client_name" class="form-control" value="{{ old('client_name', $project->client_name ?? '') }}">
        </div>
    </div>

    <div class="row">
        <div class="col-md-6 mb-3">
            <label for="country" class="form-label">Country <span class="text-muted">(shown as "Client Location")</span></label>
            <input type="text" name="country" id="country" class="form-control" value="{{ old('country', $project->country ?? '') }}">
        </div>
        <div class="col-md-6 mb-3">
            <label for="project_type" class="form-label">Project Type</label>
            <input type="text" name="project_type" id="project_type" class="form-control" value="{{ old('project_type', $project->project_type ?? '') }}" placeholder="e.g. E-commerce Platform">
        </div>
    </div>

    <div class="mb-3">
        <label for="live_preview_url" class="form-label">Live Preview URL <span class="text-muted">(optional)</span></label>
        <input type="url" name="live_preview_url" id="live_preview_url" class="form-control @error('live_preview_url') is-invalid @enderror" value="{{ old('live_preview_url', $project->live_preview_url ?? '') }}" placeholder="https://…">
        @error('live_preview_url')<div class="invalid-feedback">{{ $message }}</div>@enderror
    </div>
</div>