@extends('admin.layouts.app')
@section('title', $conference->exists ? 'Edit Conference' : 'Create Conference')
@section('page-title', $conference->exists ? 'Edit Conference' : 'Create Conference')
@section('page-subtitle','Setup conference details, dates, venue and contacts')
@section('conferences-active','active')
@section('content')

@if(session('success'))<div class="alert alert-success">{{ session('success') }}</div>@endif
@if($errors->any())
    <div class="alert alert-danger"><ul class="mb-0">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul></div>
@endif

<form method="POST" action="{{ $conference->exists ? route('admin.conferences.update', $conference) : route('admin.conferences.store') }}" enctype="multipart/form-data">
    @csrf
    @if($conference->exists) @method('PUT') @endif

    <div class='row g-4'>
        <div class='col-lg-8'>
            <div class='cardx p-4'>
                <div class='row g-3'>
                    <div class='col-md-8'>
                        <label class='form-label'>Conference Name *</label>
                        <input name="name" class='form-control' value='{{ old('name', $conference->name) }}' required>
                    </div>
                    <div class='col-md-4'>
                        <label class='form-label'>Conference Year *</label>
                        <input type="number" name="conference_year" class='form-control' value='{{ old('conference_year', $conference->conference_year ?? date('Y')) }}' required>
                    </div>
                    <div class='col-md-12'>
                        <label class='form-label'>Theme *</label>
                        <input name="theme" class='form-control' value='{{ old('theme', $conference->theme) }}' required>
                    </div>
                    <div class='col-md-12'>
                        <label class='form-label'>Description</label>
                        <textarea name="description" class='form-control' rows="3">{{ old('description', $conference->description) }}</textarea>
                    </div>
                    <div class='col-md-12'>
                        <label class='form-label'>Venue *</label>
                        <input name="venue" class='form-control' value='{{ old('venue', $conference->venue) }}' required>
                    </div>
                    <div class='col-md-4'>
                        <label class='form-label'>City</label>
                        <input name="city" class='form-control' value='{{ old('city', $conference->city) }}'>
                    </div>
                    <div class='col-md-4'>
                        <label class='form-label'>State</label>
                        <select name="state_id" class="form-select">
                            <option value="">Select state</option>
                            @foreach($states as $state)
                                <option value="{{ $state->id }}" @selected(old('state_id', $conference->state_id) == $state->id)>{{ $state->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class='col-md-4'>
                        <label class='form-label'>Status</label>
                        <select name="status" class="form-select">
                            @foreach(['draft','active','completed','archived'] as $s)
                                <option value="{{ $s }}" @selected(old('status', $conference->status ?? 'draft') === $s)>{{ ucfirst($s) }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class='col-md-4'>
                        <label class='form-label'>Attendance Mode *</label>
                        <select name="attendance_mode" id="attendance_mode" class="form-select" required>
                            @foreach(['physical' => 'Physical Only', 'virtual' => 'Virtual Only', 'hybrid' => 'Hybrid (Physical & Virtual)'] as $val => $label)
                                <option value="{{ $val }}" @selected(old('attendance_mode', $conference->attendance_mode ?? 'physical') === $val)>{{ $label }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-4">
                        <div class="form-check mt-4"><input type="checkbox" name="allow_spouse_registration" value="1" class="form-check-input" @checked(old('allow_spouse_registration', $conference->allow_spouse_registration ?? true))><label class="form-check-label">Allow Spouse Registration</label></div>
                    </div>
                    <div class='col-md-6'>
                        <label class='form-label'>Conference Start Date *</label>
                        <input type='date' name="conference_start_date" class='form-control' value='{{ old('conference_start_date', ($conference->conference_start_date ?? $conference->start_date)?->format('Y-m-d')) }}'>
                    </div>
                    <div class='col-md-6'>
                        <label class='form-label'>Conference End Date *</label>
                        <input type='date' name="conference_end_date" class='form-control' value='{{ old('conference_end_date', ($conference->conference_end_date ?? $conference->end_date)?->format('Y-m-d')) }}'>
                    </div>
                </div>

                <hr class="my-4" id="paper-submission-module">
                <h6 class="fw-bold mb-3">Paper Submission Module</h6>
                <p class="text-muted small mb-3">
                    Authors must pay the <strong>paper review fee</strong> (fee code <code>paper_review</code> under Admin → Fees Setup) before submitting.
                    <strong>One fee covers one paper.</strong> Payment opens and closes with the <strong>Full Paper Submission</strong> dates below.
                </p>
                <div class="row g-3">
                    <div class="col-md-12">
                        <div class="form-check">
                            <input type="checkbox" name="internal_paper_submission_enabled" value="1" class="form-check-input" id="internal_paper_submission_enabled"
                                @checked(old('internal_paper_submission_enabled', $conference->internal_paper_submission_enabled ?? true))>
                            <label class="form-check-label" for="internal_paper_submission_enabled">Enable in-system paper submission</label>
                        </div>
                        <small class="text-muted">Uncheck when papers are submitted on an external platform (e.g. Microsoft CMT). Participants pay the paper review fee here, then use your external link.</small>
                    </div>
                    <div class="col-md-12" id="externalPaperSubmissionWrap" style="display:none">
                        <label class="form-label">External paper submission URL *</label>
                        <input type="url" name="external_paper_submission_url" id="external_paper_submission_url" class="form-control"
                            value="{{ old('external_paper_submission_url', $conference->external_paper_submission_url) }}"
                            placeholder="https://cmt3.research.microsoft.com/...">
                        <small class="text-muted">Shown to participants after they pay the paper review fee.</small>
                    </div>
                    <div class="col-md-12" id="internalPaperReviewWrap">
                        <hr class="my-2">
                        <label class="form-label">In-app review mode</label>
                        <select name="paper_review_mode" class="form-select">
                            <option value="">Use system default</option>
                            <option value="single" @selected(old('paper_review_mode', $conference->paper_review_mode ?? '') === 'single')>Single review</option>
                            <option value="double_blind" @selected(old('paper_review_mode', $conference->paper_review_mode ?? '') === 'double_blind')>Double-blind review</option>
                        </select>
                        <small class="text-muted d-block mt-1">Applies only to in-app submissions. External portal papers follow their platform rules.</small>
                    </div>
                    <div class="col-md-4" id="paperReviewersPerPaperWrap">
                        <label class="form-label">Reviewers per paper</label>
                        <input type="number" name="paper_reviewers_per_paper" class="form-control" min="1" max="5"
                            value="{{ old('paper_reviewers_per_paper', $conference->paper_reviewers_per_paper ?? 2) }}">
                    </div>
                    <div class="col-md-4" id="paperReviewerMaxLoadWrap">
                        <label class="form-label">Max papers per reviewer</label>
                        <input type="number" name="paper_reviewer_max_load" class="form-control" min="1" max="20"
                            value="{{ old('paper_reviewer_max_load', $conference->paper_reviewer_max_load ?? 5) }}">
                    </div>
                    <div class="col-md-4" id="paperReviewDurationWrap">
                        <label class="form-label">Typical review duration (weeks)</label>
                        <input type="number" name="paper_review_duration_weeks" class="form-control" min="1" max="52"
                            value="{{ old('paper_review_duration_weeks', $conference->paper_review_duration_weeks ?? 4) }}">
                    </div>
                    <div class="col-md-4" id="reviewerAbstractFeeWrap">
                        <label class="form-label">Reviewer fee — abstract (per paper)</label>
                        <input type="number" step="0.01" min="0" name="reviewer_abstract_fee" class="form-control"
                            value="{{ old('reviewer_abstract_fee', $conference->reviewer_abstract_fee) }}" placeholder="0.00">
                    </div>
                    <div class="col-md-4" id="reviewerFullPaperFeeWrap">
                        <label class="form-label">Reviewer fee — full paper (per paper)</label>
                        <input type="number" step="0.01" min="0" name="reviewer_full_paper_fee" class="form-control"
                            value="{{ old('reviewer_full_paper_fee', $conference->reviewer_full_paper_fee) }}" placeholder="0.00">
                        <small class="text-muted">Used to estimate reviewer compensation totals in admin reports.</small>
                    </div>
                </div>

                @php
                    $subThemeRows = old('sub_themes');
                    if ($subThemeRows === null) {
                        $subThemeRows = $conference->exists
                            ? $conference->subThemes->map(fn ($t) => [
                                'id' => $t->id,
                                'title' => $t->title,
                                'description' => $t->description,
                                'status' => $t->status,
                            ])->values()->all()
                            : [];
                    }
                @endphp
                <div class="mt-4" id="subThemesSection">
                    <label class="form-label fw-semibold">Tracks / Sub-themes</label>
                    <p class="text-muted small mb-2">
                        Each sub-theme is a paper <strong>track</strong>. Authors pick one when submitting.
                        Track chairs can be scoped to a sub-theme under <strong>Paper Roles</strong> on the conferences list.
                        These are separate from the conference <em>Theme</em> and <em>Description</em> fields above.
                    </p>
                    <div id="subThemesContainer">
                        @foreach($subThemeRows as $index => $row)
                            @include('admin.partials.conference-sub-theme-row', ['index' => $index, 'row' => $row, 'showStatus' => $conference->exists])
                        @endforeach
                    </div>
                    <button type="button" class="btn btn-sm btn-outline-green mt-2" id="addSubThemeBtn">
                        <i class="fa fa-plus me-1"></i>Add track
                    </button>
                </div>

                <hr class="my-4" id="important-dates">
                <h6 class="fw-bold mb-3">Important Dates</h6>
                <p class="text-muted small mb-3">
                    <strong>Paper deadlines:</strong> Full Paper Submission Opens / Deadline control when paper review fee payment is accepted.
                    Abstract dates are shown publicly; some authors submit full papers directly.
                    The legacy <em>Paper Submission Deadline</em> column is kept in sync with the abstract deadline for older modules.
                </p>
                <div class="row g-3">
                    @php
                        $dateFields = [
                            ['abstract_submission_open_date', 'Abstract Submission Opens'],
                            ['abstract_submission_deadline', 'Abstract Submission Deadline'],
                            ['abstract_acceptance_notification_date', 'Abstract Acceptance Notification'],
                            ['full_paper_submission_open_date', 'Full Paper Submission Opens'],
                            ['full_paper_submission_deadline', 'Full Paper Submission Deadline'],
                            ['full_paper_acceptance_notification_date', 'Full Paper Acceptance Notification'],
                            ['camera_ready_submission_open_date', 'Camera-Ready Submission Opens'],
                            ['camera_ready_submission_deadline', 'Camera-Ready Submission Deadline'],
                            ['early_bird_registration_open_date', 'Early Bird Registration Opens'],
                            ['early_bird_registration_close_date', 'Early Bird Registration Closes'],
                            ['regular_registration_open_date', 'Regular Registration Opens'],
                            ['regular_registration_close_date', 'Regular Registration Closes'],
                            ['late_registration_open_date', 'Late Registration Opens'],
                            ['late_registration_close_date', 'Late Registration Closes'],
                            ['onsite_registration_open_date', 'On-site Registration Opens'],
                            ['onsite_registration_close_date', 'On-site Registration Closes'],
                        ];
                        $virtualDateFields = [
                            ['virtual_registration_open_date', 'Virtual Registration Opens'],
                            ['virtual_registration_close_date', 'Virtual Registration Closes'],
                        ];
                    @endphp
                    @foreach($dateFields as [$field, $label])
                        <div class="col-md-6">
                            <label class="form-label">{{ $label }}</label>
                            <input type="date" name="{{ $field }}" class="form-control" value="{{ old($field, $conference->{$field}?->format('Y-m-d')) }}">
                        </div>
                    @endforeach
                </div>

                <div class="row g-3 mt-1" id="virtualRegistrationDates">
                    @foreach($virtualDateFields as [$field, $label])
                        <div class="col-md-6 virtual-date-field">
                            <label class="form-label">{{ $label }}</label>
                            <input type="date" name="{{ $field }}" class="form-control virtual-date-input" value="{{ old($field, $conference->{$field}?->format('Y-m-d')) }}">
                        </div>
                    @endforeach
                </div>

                <div class="row g-3 mt-1">
                    <div class='col-md-6'>
                        <label class='form-label'>Registration Opens</label>
                        <input type='date' name="registration_open_date" class='form-control' value='{{ old('registration_open_date', $conference->registration_open_date?->format('Y-m-d')) }}'>
                    </div>
                    <div class='col-md-6'>
                        <label class='form-label'>Registration Closes</label>
                        <input type='date' name="registration_close_date" class='form-control' value='{{ old('registration_close_date', $conference->registration_close_date?->format('Y-m-d')) }}'>
                        <small class="text-muted">Legacy field — synced with Regular Registration Closes above.</small>
                    </div>
                    <div class='col-md-6'>
                        <label class='form-label'>Official Email</label>
                        <input name="official_email" class='form-control' value='{{ old('official_email', $conference->official_email) }}'>
                    </div>
                    <div class='col-md-6'>
                        <label class='form-label'>Contact Phone</label>
                        <input name="contact_phone" class='form-control' value='{{ old('contact_phone', $conference->contact_phone) }}'>
                    </div>
                    <div class='col-md-6'>
                        <label class='form-label'>Contact WhatsApp</label>
                        <input name="contact_whatsapp" class='form-control' value='{{ old('contact_whatsapp', $conference->contact_whatsapp) }}'>
                    </div>
                    <div class="col-md-3">
                        <div class="form-check"><input type="checkbox" name="payment_enabled" value="1" class="form-check-input" @checked(old('payment_enabled', $conference->payment_enabled ?? true))><label class="form-check-label">Payment Enabled</label></div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-check"><input type="hidden" name="certificate_download_enabled" value="0"><input type="checkbox" name="certificate_download_enabled" value="1" class="form-check-input" @checked(old('certificate_download_enabled', $conference->certificate_download_enabled ?? false))><label class="form-check-label">Release certificate user access (or manage on Certificates → User Access Release)</label></div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-check"><input type="checkbox" name="agm_enabled" value="1" class="form-check-input" @checked(old('agm_enabled', $conference->agm_enabled))><label class="form-check-label">AGM Enabled</label></div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-check"><input type="checkbox" name="election_enabled" value="1" class="form-check-input" @checked(old('election_enabled', $conference->election_enabled))><label class="form-check-label">Election Enabled</label></div>
                    </div>
                </div>

                <hr class="my-4">
                <h6 class="fw-bold mb-3">Post-Conference & Presentation Settings</h6>
                <div class="row g-3">
                    <div class="col-md-4">
                        <div class="form-check"><input type="checkbox" name="allow_post_conference_documents" value="1" class="form-check-input" @checked(old('allow_post_conference_documents', $conference->allow_post_conference_documents ?? true))><label class="form-check-label">Allow Post-Conference Documents</label></div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-check"><input type="checkbox" name="allow_presentation_upload" value="1" class="form-check-input" @checked(old('allow_presentation_upload', $conference->allow_presentation_upload ?? true))><label class="form-check-label">Allow Presentation Upload</label></div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-check"><input type="checkbox" name="allow_presentation_replacement" value="1" class="form-check-input" @checked(old('allow_presentation_replacement', $conference->allow_presentation_replacement ?? true))><label class="form-check-label">Allow Presentation Replacement</label></div>
                    </div>
                    <div class="col-md-4">
                        <label class="form-label">Presentation Upload Deadline</label>
                        <input type="date" name="presentation_upload_deadline" class="form-control" value="{{ old('presentation_upload_deadline', $conference->presentation_upload_deadline?->format('Y-m-d')) }}">
                    </div>
                    <div class="col-md-4">
                        <label class="form-label">Max File Size (KB)</label>
                        <input type="number" name="presentation_file_max_size" class="form-control" value="{{ old('presentation_file_max_size', $conference->presentation_file_max_size ?? 20480) }}" min="1024" max="102400">
                        <small class="text-muted">Default 20480 KB (20 MB)</small>
                    </div>
                    <div class="col-md-4">
                        <label class="form-label">Allowed File Types</label>
                        <input name="allowed_presentation_file_types" class="form-control" value="{{ old('allowed_presentation_file_types', $conference->allowed_presentation_file_types ?? 'ppt,pptx,pdf') }}" placeholder="ppt,pptx,pdf">
                    </div>
                    <div class="col-md-6">
                        <label class="form-label">Presentation Download Visibility</label>
                        <select name="presentation_download_visibility" class="form-select">
                            @foreach(['admin_only' => 'Admin Only', 'registered_participants' => 'Registered Participants', 'public' => 'Public'] as $val => $label)
                                <option value="{{ $val }}" @selected(old('presentation_download_visibility', $conference->presentation_download_visibility ?? 'registered_participants') === $val)>{{ $label }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class='text-end mt-4'>
                    <a href="{{ route('admin.conferences.index') }}" class='btn btn-light'>Cancel</a>
                    <button type="submit" class='btn btn-green'>Save Conference</button>
                </div>
            </div>
        </div>
        <div class='col-lg-4'>
            <div class='cardx p-4'>
                <label class='form-label'>Conference Logo</label>
                @if($conference->logo)
                    <div class="mb-2">
                        <img src="{{ asset('storage/'.$conference->logo) }}" alt="Logo" class="img-fluid rounded border" style="max-height:80px">
                    </div>
                @endif
                <input type="file" name="logo" class="form-control mb-3" accept="image/*">
                <label class='form-label'>Conference Banner</label>
                @if($conference->banner)
                    <div class="mb-2">
                        <img src="{{ asset('storage/'.$conference->banner) }}" alt="Banner" class="img-fluid rounded border" style="max-height:100px">
                    </div>
                @endif
                <input type="file" name="banner" class="form-control mb-3" accept="image/*">
                <label class='form-label'>Conference Flyer</label>
                <small class="text-muted d-block mb-2">Optional. Upload when ready — PDF or image (JPG, PNG, WebP). Shown on participant dashboards.</small>
                @if($conference->hasFlyer())
                    <div class="mb-2 p-2 border rounded bg-light">
                        @if($conference->flyerIsPdf())
                            <div class="text-muted small"><i class="fas fa-file-pdf text-danger me-1"></i> {{ $conference->flyerDownloadName() }}</div>
                        @else
                            <img src="{{ $conference->flyerUrl() }}" alt="Flyer preview" class="img-fluid rounded" style="max-height:120px">
                        @endif
                    </div>
                    @if($conference->exists)
                    <div class="form-check mb-2">
                        <input type="checkbox" name="remove_flyer" value="1" class="form-check-input" id="remove_flyer">
                        <label class="form-check-label" for="remove_flyer">Remove current flyer</label>
                    </div>
                    @endif
                @endif
                <input type="file" name="flyer" class="form-control" accept=".pdf,image/jpeg,image/png,image/webp">
            </div>
        </div>
    </div>
</form>

@push('scripts')
<script>
(function () {
    const modeSelect = document.getElementById('attendance_mode');
    const virtualSection = document.getElementById('virtualRegistrationDates');

    function toggleVirtualRegistrationDates() {
        if (!modeSelect || !virtualSection) return;
        const showVirtual = modeSelect.value === 'virtual' || modeSelect.value === 'hybrid';
        virtualSection.style.display = showVirtual ? '' : 'none';
        if (!showVirtual) {
            virtualSection.querySelectorAll('.virtual-date-input').forEach(function (input) {
                input.value = '';
            });
        }
    }

    if (modeSelect) {
        modeSelect.addEventListener('change', toggleVirtualRegistrationDates);
        toggleVirtualRegistrationDates();
    }

    const internalPaperToggle = document.getElementById('internal_paper_submission_enabled');
    const externalPaperWrap = document.getElementById('externalPaperSubmissionWrap');
    const externalPaperUrl = document.getElementById('external_paper_submission_url');

    function toggleExternalPaperFields() {
        if (!internalPaperToggle || !externalPaperWrap) return;
        const useExternal = !internalPaperToggle.checked;
        externalPaperWrap.style.display = useExternal ? '' : 'none';
        if (externalPaperUrl) {
            externalPaperUrl.required = useExternal;
        }
        ['internalPaperReviewWrap', 'paperReviewersPerPaperWrap', 'paperReviewerMaxLoadWrap', 'paperReviewDurationWrap'].forEach(id => {
            const el = document.getElementById(id);
            if (el) el.style.display = useExternal ? 'none' : '';
        });
    }

    if (internalPaperToggle) {
        internalPaperToggle.addEventListener('change', toggleExternalPaperFields);
        toggleExternalPaperFields();
    }

    const subThemesContainer = document.getElementById('subThemesContainer');
    const addSubThemeBtn = document.getElementById('addSubThemeBtn');
    let subThemeIndex = subThemesContainer ? subThemesContainer.querySelectorAll('.sub-theme-row').length : 0;

    function bindRemoveSubTheme(row) {
        row.querySelector('.remove-sub-theme')?.addEventListener('click', function () {
            row.remove();
        });
    }

    subThemesContainer?.querySelectorAll('.sub-theme-row').forEach(bindRemoveSubTheme);

    addSubThemeBtn?.addEventListener('click', function () {
        const row = document.createElement('div');
        row.className = 'sub-theme-row border rounded p-3 mb-2 bg-light';
        row.innerHTML = `
            <div class="d-flex justify-content-between align-items-start mb-2">
                <span class="small text-muted fw-semibold">Track ${subThemeIndex + 1}</span>
                <button type="button" class="btn btn-sm btn-outline-danger remove-sub-theme" title="Remove track">&times;</button>
            </div>
            <div class="row g-2">
                <div class="col-md-12">
                    <label class="form-label small mb-1">Track title *</label>
                    <input type="text" name="sub_themes[${subThemeIndex}][title]" class="form-control form-control-sm" maxlength="255" placeholder="e.g. Artificial Intelligence in Education">
                </div>
                <div class="col-md-12">
                    <label class="form-label small mb-1">Track description <span class="text-muted">(optional)</span></label>
                    <textarea name="sub_themes[${subThemeIndex}][description]" class="form-control form-control-sm" rows="2" placeholder="Brief scope for authors and reviewers"></textarea>
                </div>
            </div>`;
        subThemesContainer.appendChild(row);
        bindRemoveSubTheme(row);
        subThemeIndex += 1;
    });
})();
</script>
@endpush

@endsection