<x-conference-layout>
<x-slot name="title">Scientific Committee – {{ $conference['title'] ?? 'Conference' }}</x-slot>

    {{-- HERO --}}
    <x-conference-inner-hero
    pageTitle="Scientific Committee"
    label="Expertise"
    subtitle="Our scientific review committee comprises globally recognized scholars who ensure rigorous academic review."
/>

<section class="bg-white">
    <div class="max-w-7xl mx-auto px-6 lg:px-8">

        {{-- Intro + Stats --}}
        <div class="py-16 border-b border-gray-100">
            <div class="grid grid-cols-1 lg:grid-cols-3 gap-12 items-start">
                <div class="lg:col-span-2">
                    <p class="text-xl text-gray-600 font-light leading-relaxed">
                        All papers submitted to the conference undergo rigorous double-blind peer review conducted by an international panel of expert academics. Our reviewers are drawn from leading universities and research institutes worldwide.
                    </p>
                </div>
                <div class="grid grid-cols-2 gap-4">
                    @foreach([['40+','Expert Reviewers'],['25+','Countries'],['100%','Double-Blind'],['<4 Wks','Avg. Decision']] as $stat)
                    <div class="border border-gray-100 rounded-xl px-5 py-6 text-center">
                        <p class="text-2xl font-black text-gray-900 mb-1">{{ $stat[0] }}</p>
                        <p class="text-[10px] text-gray-400 font-bold uppercase tracking-widest">{{ $stat[1] }}</p>
                    </div>
                    @endforeach
                </div>
            </div>
        </div>

        {{-- Review Process --}}
        <div class="py-16 border-b border-gray-100">
            <div class="grid grid-cols-1 lg:grid-cols-3 gap-16">
                <div>
                    <h2 class="text-2xl font-bold font-serif text-gray-900 mb-4">Review Process</h2>
                    <p class="text-gray-500 text-sm leading-relaxed">All submissions are reviewed under a strict double-blind protocol in adherence with COPE guidelines.</p>
                </div>
                <div class="lg:col-span-2">
                    <ol class="space-y-8">
                        @foreach([
                            ['Submission','Author submits through the online portal. Manuscript is assigned a reference number.'],
                            ['Desk Review','Editor checks compliance with submission guidelines before sending for peer review.'],
                            ['Peer Review','Two independent expert reviewers evaluate the manuscript. Neither party knows the other\'s identity.'],
                            ['Decision','Editor compiles reviews and issues one of: Accept, Minor Revision, Major Revision, or Reject.'],
                            ['Revision','Where revisions are required, the author has 14 days to resubmit an updated manuscript.'],
                            ['Final Decision','Revised paper is re-evaluated by the original reviewers before a final editorial decision is made.'],
                        ] as $idx => $step)
                        <li class="flex gap-6 items-start">
                            <span class="text-sm font-black text-orange-500 mt-0.5 w-6 shrink-0">{{ str_pad($idx+1, 2, '0', STR_PAD_LEFT) }}</span>
                            <div>
                                <p class="font-bold text-gray-900 mb-1">{{ $step[0] }}</p>
                                <p class="text-sm text-gray-500 leading-relaxed">{{ $step[1] }}</p>
                            </div>
                        </li>
                        @endforeach
                    </ol>
                </div>
            </div>
        </div>

        {{-- Members --}}
        <div class="py-16 border-b border-gray-100">
            <h2 class="text-2xl font-bold font-serif text-gray-900 mb-10">Committee Members</h2>
            <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-5">
                @foreach([
                    ['Prof. James Carter','Scientific Committee Chair','Oxford University, UK'],
                    ['Dr. Aiko Yamamoto','Associate Professor','University of Tokyo, Japan'],
                    ['Prof. Maria Sanchez','Research Director','IE Business School, Spain'],
                    ['Dr. Chen Wei','Senior Lecturer','NUS Business School, Singapore'],
                    ['Prof. David Müller','Dean of Faculty','TU Munich, Germany'],
                    ['Dr. Priya Nair','Associate Professor','IIM Ahmedabad, India'],
                    ['Prof. Williams Adeyemi','Research Fellow','Univ. Cape Town, S. Africa'],
                    ['Dr. Sophie Laurent','Senior Researcher','INSEAD, France'],
                ] as $m)
                <div class="flex flex-col gap-4 p-6 bg-gray-50 border border-gray-100 rounded-2xl hover:border-orange-100 hover:bg-white hover:shadow-md transition-all duration-300 group">
                    <div class="w-14 h-14 rounded-xl overflow-hidden border border-gray-200 shrink-0">
                        <img src="{{ asset('images/speaker_portrait.png') }}" alt="{{ $m[0] }}" class="w-full h-full object-cover">
                    </div>
                    <div>
                        <h4 class="font-bold text-gray-900 text-sm mb-0.5 group-hover:text-orange-600 transition-colors leading-snug">{{ $m[0] }}</h4>
                        <p class="text-[10px] text-orange-500 font-bold uppercase tracking-wider mb-1">{{ $m[1] }}</p>
                        <p class="text-[11px] text-gray-400">{{ $m[2] }}</p>
                    </div>
                </div>
                @endforeach
            </div>
        </div>

        {{-- Apply as Reviewer CTA --}}
        <div class="py-16">
            <div class="bg-gray-950 rounded-2xl p-10 md:p-14 grid grid-cols-1 lg:grid-cols-2 gap-10 items-center">
                <div>
                    <p class="text-orange-400 text-xs font-bold tracking-widest uppercase mb-4">Open Call</p>
                    <h3 class="text-2xl font-bold font-serif text-white mb-4">Apply to Join the Scientific Committee</h3>
                    <p class="text-gray-400 text-sm leading-relaxed mb-8">We are seeking qualified academics with a strong publication record to serve as peer reviewers. Reviewers are acknowledged in all printed proceedings.</p>
                    <a href="{{ route('conference.contact-us', $conference['slug']) }}" class="inline-flex items-center gap-3 px-8 py-4 bg-orange-500 hover:bg-orange-600 text-white font-bold text-sm rounded-xl transition-colors uppercase tracking-wide">
                        Apply to Review <i class="fas fa-arrow-right text-xs"></i>
                    </a>
                </div>
                <ul class="space-y-5">
                    @foreach([
                        'Hold a PhD in a relevant academic discipline',
                        'Have a minimum of 3 publications in peer-reviewed journals',
                        'Commit to reviewing 2–3 manuscripts per submission cycle',
                        'Agree to comply with COPE double-blind review guidelines',
                    ] as $req)
                    <li class="flex gap-3 items-start text-sm text-gray-300">
                        <i class="fas fa-check text-orange-400 text-xs mt-1 shrink-0"></i>
                        <span>{{ $req }}</span>
                    </li>
                    @endforeach
                </ul>
            </div>
        </div>

    </div>
</section>

</x-conference-layout>
