@if (is_array($result) && !empty($result) && isset($result['scoring'][$subject.'_final_score']))
    @php
    $passageCount = isset($passageCount) ? $passageCount : ($subject === 'listening' ? 4 : 3);

    // 각 passage의 정답 개수는 이미 컨트롤러에서 계산되어 $correctPassages로 전달됨

    // 내 정답률 계산
    $totalAnswered = $result['scoring'][$subject.'_answered_questions'];
    $totalCorrect = $result['scoring'][$subject.'_correct_count'];

    $totalPer = $totalAnswered > 0 ? ($totalCorrect / $totalAnswered) * 100 : 0;

    // 점수표 데이터 생성
    if ($subject == 'reading') {
        if ($enrollmentCdtSet->cdtSet->module == "academic") {
            $scoreTable = [
                ['9', '39~40'],
                ['8.5', '37~38'],
                ['8', '35~36'],
                ['7.5', '33~34'],
                ['7', '30~32'],
                ['6.5', '27~29'],
                ['6', '23~26'],
                ['5.5', '19~22'],
                ['5', '15~18'],
                ['4.5', '13~14'],
                ['4', '10~12'],
                ['3.5', '8~9'],
                ['3', '6~7'],
                ['2.5', '4~5']
            ];
        } else {
            // GT 모듈
            $scoreTable = [
                ['9', '40'],
                ['8.5', '39'],
                ['8', '37~38'],
                ['7.5', '36'],
                ['7', '34~35'],
                ['6.5', '32~33'],
                ['6', '30~31'],
                ['5.5', '27~29'],
                ['5', '23~26'],
                ['4.5', '19~22'],
                ['4', '15~18'],
                ['3.5', '12~14'],
                ['3', '9~11'],
                ['2.5', '6~9']
            ];
        }
    } else {
        // listening용 점수 테이블
        $scoreTable = [
            ['9', '39~40'],
            ['8.5', '37~38'],
            ['8', '35~36'],
            ['7.5', '32~34'],
            ['7', '30~31'],
            ['6.5', '26~29'],
            ['6', '23~25'],
            ['5.5', '18~22'],
            ['5', '16~17'],
            ['4.5', '13~15'],
            ['4', '10~12'],
            ['3.5', '8~9'],
            ['3', '6~7'],
            ['2.5', '4~5']
        ];
    }

    // 현재 점수에 해당하는 밴드 스코어 찾기
    $currentBandScore = '';
    foreach ($scoreTable as $score) {
        $range = $score[1];
        
        // 범위 검사
        if (strpos($range, '~') !== false) {
            list($min, $max) = explode('~', $range);
            if ($totalCorrect >= (int)$min && $totalCorrect <= (int)$max) {
                $currentBandScore = $score[0];
                break;
            }
        } else {
            // 단일 값
            if ($totalCorrect == (int)$range) {
                $currentBandScore = $score[0];
                break;
            }
        }
    }

    @endphp

    <input type="hidden" id="subjectType" value="{{ $subject }}">
    @if ($subject == 'listening')
    <input type="hidden" id="listeningSoundSection1" value="{{ $config['passage1_audio'] }}">
    <input type="hidden" id="listeningSoundSection2" value="{{ $config['passage2_audio'] }}">
    <input type="hidden" id="listeningSoundSection3" value="{{ $config['passage3_audio'] }}">
    <input type="hidden" id="listeningSoundSection4" value="{{ $config['passage4_audio'] }}">
    @endif

    <p class="title-1">Test Result <span>{{ ucfirst($subject) }}</span></p>

    <div class="infoArea result">
        <div class="info scoreWrap flex">
            <div class="roundBox band">
                <p class="subject">Band Score</p>
                <p class="score"><strong>{{ number_format($result['scoring'][$subject.'_final_score'], 1) }}</strong></p>
            </div>
            <ul class="roundBox other flex">
                <li>
                    <p class="subject">All Passage</p>
                    <p class="score"><b>{{ $result['scoring'][$subject.'_correct_count'] }}</b>/{{ $result['scoring'][$subject.'_total_questions'] }}</p>
                </li>
                @for ($i = 1; $i <= $passageCount; $i++)
                <li>
                    <p class="subject">{{ $subject === 'listening' ? 'Section' : 'Passage' }}{{ $i }}</p>
                    <p class="score"><b>{{ $correctPassages[$i] }}</b>/{{ isset($config["passage{$i}_count"]) ? $config["passage{$i}_count"] : ($subject === 'listening' ? 10 : floor(40/$passageCount)) }}</p>
                </li>
                @endfor
            </ul>
        </div>
        <div class="info table">
            <div class="roundBox">
                <p class="sub-title">{{ ucfirst($subject) }} 채점기준 및 점수표</p>
                <div class="tableWrap">
                    <table>
                        <thead>
                            <tr>
                                <th class="first">Band Score</th>
                                @foreach ($scoreTable as $item)
                                    <th @class(['point' => $item[0] == $currentBandScore])>{{ $item[0] }}</th>
                                @endforeach
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="first">Score/40</td>
                                @foreach ($scoreTable as $item)
                                    <td @class(['point' => $item[0] == $currentBandScore])>{{ $item[1] }}</td>
                                @endforeach
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="infoArea reviewing">
        <p class="title-2">문제 다시보기</p>
        <div class="info">
            <div class="roundBox">
                @if ($subject == 'listening')
                <div class="sectionBtnWrap flex">
                    <a href="" class="btn active"><p>Section1</p><b>음성듣기</b><i></i></a>
                    <a href="" class="btn"><p>Section2</p><b>음성듣기</b><i></i></a>
                    <a href="" class="btn"><p>Section3</p><b>음성듣기</b><i></i></a>
                    <a href="" class="btn"><p>Section4</p><b>음성듣기</b><i></i></a>
                </div>
                @endif
                <div class="sectionContents">
                    @if(isset($showContent) && $showContent)
                        @include($contentPartial)
                    @endif
                </div>
                <div class="sectionPageBtn flex">
                    <a href="#none" class="prev btn">이전</a>
                    <a href="#none" class="next btn">다음</a>
                </div>
            </div>
        </div>
    </div>

    <div class="infoArea checkOut">
        <p class="title-2">정답 확인하기</p>
        <div class="info">
            <div class="roundBox">
                <div class="sectionBtnWrap flex">
                    @for ($p = 1; $p <= $passageCount; $p++)
                        @php
                            // 패시지 시작 문제 번호와 끝 문제 번호 계산
                            $startQuestion = 1;
                            $endQuestion = 0;
                            
                            // 이전 패시지의 문항 수를 더해서 시작 번호 계산
                            for ($prev = 1; $prev < $p; $prev++) {
                                $prevCountKey = "passage{$prev}_count";
                                $startQuestion += isset($config[$prevCountKey]) ? $config[$prevCountKey] : ($subject === 'listening' ? 10 : floor(40/$passageCount));
                            }
                            
                            // 현재 패시지의 문항 수를 더해서 마지막 번호 계산
                            $countKey = "passage{$p}_count";
                            $questionsInPassage = isset($config[$countKey]) ? $config[$countKey] : ($subject === 'listening' ? 10 : floor(40/$passageCount));
                            $endQuestion = $startQuestion + $questionsInPassage - 1;
                        @endphp
                        <a href="javascript:void(0)" class="btn section-tab {{ $p == 1 ? 'active' : '' }}" data-section="{{ $p }}">
                            <b>{{ $subject === 'listening' ? 'Section' : 'Passage' }}{{ $p }}</b>
                            <p>(Q. {{ $startQuestion }}~{{ $endQuestion }})</p>
                        </a>
                    @endfor
                </div>
    
                @for ($p = 1; $p <= $passageCount; $p++)
                    @php
                        // 패시지 시작 문제 번호와 끝 문제 번호 계산
                        $startQuestion = 1;
                        $endQuestion = 0;
                        
                        // 이전 패시지의 문항 수를 더해서 시작 번호 계산
                        for ($prev = 1; $prev < $p; $prev++) {
                            $prevCountKey = "passage{$prev}_count";
                            $startQuestion += isset($config[$prevCountKey]) ? $config[$prevCountKey] : ($subject === 'listening' ? 10 : floor(40/$passageCount));
                        }
                        
                        // 현재 패시지의 문항 수를 더해서 마지막 번호 계산
                        $countKey = "passage{$p}_count";
                        $questionsInPassage = isset($config[$countKey]) ? $config[$countKey] : ($subject === 'listening' ? 10 : floor(40/$passageCount));
                        $endQuestion = $startQuestion + $questionsInPassage - 1;
                    @endphp
                    
                    <div class="section-content" id="section-content-{{ $p }}" style="{{ $p == 1 ? '' : 'display:none;' }}">
                        @for ($i = $startQuestion; $i <= $endQuestion; $i++)
                            @php 
                                $isCorrect = isset($result['scoring'][$subject.$i.'_correct']) && $result['scoring'][$subject.$i.'_correct'] ? true : false;
                                $responseField = $subject.'_response'.$i;
                                $userAnswer = $enrollmentCdtSet->$responseField ?? null;
                                $correctAnswer = $result['correct_answers'][$subject.$i] ?? '-';
                            @endphp
                            
                            <div class="box">
                                <div class="top style1">
                                    <b class="area-1">문제</b>
                                    <b class="area-2">정답</b>
                                    <b class="area-3">내답안</b>
                                    <b class="area-4">정답여부</b>
                                </div>
                                <div class="text style1">
                                    <p class="area-1">{{ $i }}</p>
                                    <p class="area-2">
                                        @if (preg_match('/\|/', $correctAnswer))
                                            {{ str_replace("|", " 또는 ", $correctAnswer) }}
                                        @elseif (preg_match('/\;/', $correctAnswer))
                                            {{ str_replace(";", " 그리고 ", $correctAnswer) }}
                                        @else
                                            {{ $correctAnswer }}
                                        @endif
                                    </p>
                                    <p class="area-3 {{ !$isCorrect ? 'error' : '' }}">{{ !empty($userAnswer) ? $userAnswer : '없음' }}</p>
                                    <p class="area-4 {{ !$isCorrect ? 'error' : '' }}">{{ $isCorrect ? "O" : "X" }}</p>
                                </div>
                                
                                @if (isset($result['explanations']) && isset($result['explanations'][$subject.$i]))
                                    <div class="explanation">
                                        <div class="wrap">
                                            <b>해설</b>
                                            <p>{{ $result['explanations'][$subject.$i] }}</p>
                                        </div>
                                    </div>
                                @endif
                            </div>
                        @endfor
                    </div>
                @endfor
            </div>
        </div>
    </div>
@else
    <div class="p-3 bg-danger text-white rounded mb-3">
        <h3>시험 결과 없음</h3>
        <p>아직 제출된 결과가 없거나 데이터 형식이 올바르지 않습니다.</p>
    </div>
@endif

<script>
    // 윈도우 창크기를 800 * 800으로 설정
    /*window.resizeTo(800, 800);

    // 창을 열 때 중앙에 위치시키기
    window.onload = function() {
        var width = 800;
        var height = 800;
        var left = (screen.width / 2) - (width / 2);
        var top = (screen.height / 2) - (height / 2);
        window.moveTo(left, top);
    };*/

    $(document).ready(function() {
        // 문제 다시보기 섹션 초기화
        initContentReview();
        
        // 섹션 탭 전환 기능 (정답 확인하기)
        $('.section-tab').on('click', function() {
            // 모든 탭에서 active 클래스 제거
            $('.section-tab').removeClass('active');
            // 클릭한 탭에 active 클래스 추가
            $(this).addClass('active');
            
            // 섹션 번호 가져오기
            var sectionNum = $(this).data('section');
            
            // 모든 섹션 내용 숨기기
            $('.section-content').hide();
            // 선택한 섹션 내용만 보이기
            $('#section-content-' + sectionNum).show();
        });
        
        // 문제 다시보기 섹션 탭 기능
        $('.infoArea.reviewing .sectionBtnWrap .btn').on('click', function(e) {
            e.preventDefault();
            
            // 모든 탭에서 active 클래스 제거
            $('.infoArea.reviewing .sectionBtnWrap .btn').removeClass('active');
            // 클릭한 탭에 active 클래스 추가
            $(this).addClass('active');
            
            // 탭 인덱스 가져오기 (0부터 시작)
            const index = $(this).index();
            
            // 모든 컨텐츠 숨기기
            $('.sectionContents .cdt-content').hide();
            // 해당 인덱스의 컨텐츠만 표시
            $('.sectionContents .cdt-content').eq(index).show();
        });
        
        // 이전/다음 버튼 이벤트 처리
        $('.infoArea.reviewing .sectionPageBtn .prev').on('click', function() {
            navigateCdtContent('prev');
        });
        
        $('.infoArea.reviewing .sectionPageBtn .next').on('click', function() {
            navigateCdtContent('next');
        });
    });
    
    /**
     * 문제 다시보기 섹션 초기화
     */
    function initContentReview() {
        // 첫 번째 탭과 컨텐츠 활성화
        $('.infoArea.reviewing .sectionBtnWrap .btn').first().addClass('active');

        
        // 사용자 응답과 정답 하이라이트
        highlightUserResponses();
        
        // 오디오 컨트롤 생성 (listening인 경우)
        if ($('#subjectType').val() === 'listening') {
            setupAudioControls();
        }
    }
    
    /**
     * 사용자 응답과 정답 하이라이트
     */
    function highlightUserResponses() {
        // 라디오 버튼과 체크박스 응답 하이라이트
        $('.sectionContents input[type="radio"], .sectionContents input[type="checkbox"]').each(function() {
            const isChecked = $(this).prop('checked');
            const isCorrect = $(this).hasClass('correct-answer');
            
            if (isChecked) {
                const $label = $(this).next('label');
                if (isCorrect) {
                    $label.addClass('user-correct');
                } else {
                    $label.addClass('user-wrong');
                }
            }
            
            // 사용자가 선택하지 않은 정답 하이라이트
            if (isCorrect && !isChecked) {
                $(this).next('label').css({
                    'border': '1px dashed #2ecc71',
                    'background-color': 'rgba(46, 204, 113, 0.1)'
                });
            }
        });
        
        // 텍스트 입력 응답 하이라이트
        $('.sectionContents input[type="text"]').each(function() {
            const isCorrect = $(this).hasClass('correct-answer');
            
            if ($(this).val()) {
                if (isCorrect) {
                    $(this).addClass('user-correct');
                } else {
                    $(this).addClass('user-wrong');
                }
            }
        });
    }
    
    /**
     * 오디오 컨트롤 설정 (listening 시험용)
     */
    function setupAudioControls() {
        // 각 섹션별 오디오 요소 ID와 URL
        const audioSections = [
            { id: 'sndSection1', url: $('#listeningSoundSection1').val() },
            { id: 'sndSection2', url: $('#listeningSoundSection2').val() },
            { id: 'sndSection3', url: $('#listeningSoundSection3').val() },
            { id: 'sndSection4', url: $('#listeningSoundSection4').val() }
        ];
        
        // 오디오 요소들을 DOM에 추가
        const audioElements = $('<div class="audio-elements" style="display:none;"></div>');
        audioSections.forEach(section => {
            if (section.url) {
                audioElements.append(`<audio id="${section.id}" src="${section.url}"></audio>`);
            }
        });
        $('body').append(audioElements);
        
        // 오디오 컨트롤 UI 추가
        $('.sectionContents').before(`
            <div class="audio-control">
                <button class="audio-playpause-button play">재생</button>
                <button class="audio-stop-button">정지</button>
                <button class="audio-back-button">10초 뒤로</button>
                <button class="audio-forward-button">10초 앞으로</button>
                <div class="audio-progress">
                    <div class="progress-bar"></div>
                </div>
            </div>
        `);
        
        // 현재 활성화된 오디오 요소
        let currentAudio = null;
        let progressInterval = null;
        
        // 각 섹션 버튼에 오디오 재생 기능 추가
        $('.infoArea.reviewing .sectionBtnWrap .btn').each(function(index) {
            const audioSection = audioSections[index];
            if (audioSection && audioSection.url) {
                $(this).on('click', function(e) {
                    e.preventDefault();
                    
                    // 모든 오디오 일시 정지
                    $('audio').each(function() { 
                        this.pause(); 
                        this.currentTime = 0;
                    });
                    
                    // 현재 오디오 참조 업데이트
                    currentAudio = document.getElementById(audioSection.id);
                    
                    // 진행 표시줄 초기화
                    updateProgressBar(0);
                    clearInterval(progressInterval);
                    
                    // 버튼 상태 초기화
                    $('.audio-playpause-button').text('재생').removeClass('pause').addClass('play');
                    
                    // console.log('오디오 섹션 클릭:', audioSection.id, audioSection.url);
                });
            }
        });
        
        // 재생/일시정지 버튼 이벤트
        $('.audio-playpause-button').on('click', function() {
            const activeIndex = $('.infoArea.reviewing .sectionBtnWrap .btn.active').index();
            const audioId = audioSections[activeIndex]?.id;
            currentAudio = document.getElementById(audioId);
            
            if (!currentAudio) {
                console.error('현재 오디오 요소를 찾을 수 없습니다:', audioId);
                return;
            }
            
            if (currentAudio.paused) {
                // 재생 시작
                const playPromise = currentAudio.play();
                if (playPromise !== undefined) {
                    playPromise.then(() => {
                        $(this).text('일시정지').removeClass('play').addClass('pause');
                        
                        // 진행 표시줄 업데이트 시작
                        clearInterval(progressInterval);
                        progressInterval = setInterval(() => {
                            const progress = (currentAudio.currentTime / currentAudio.duration) * 100;
                            updateProgressBar(progress);
                        }, 100);
                        
                    }).catch(e => {
                        console.error('오디오 재생 실패:', e);
                        alert('오디오 파일을 재생할 수 없습니다. URL을 확인해 주세요.');
                    });
                }
            } else {
                // 일시 정지
                currentAudio.pause();
                $(this).text('재생').removeClass('pause').addClass('play');
                clearInterval(progressInterval);
            }
        });
        
        // 정지 버튼 이벤트
        $('.audio-stop-button').on('click', function() {
            if (!currentAudio) return;
            
            currentAudio.pause();
            currentAudio.currentTime = 0;
            $('.audio-playpause-button').text('재생').removeClass('pause').addClass('play');
            clearInterval(progressInterval);
            updateProgressBar(0);
        });
        
        // 10초 뒤로 버튼 이벤트
        $('.audio-back-button').on('click', function() {
            if (!currentAudio) return;
            currentAudio.currentTime = Math.max(0, currentAudio.currentTime - 10);
            updateProgressBar((currentAudio.currentTime / currentAudio.duration) * 100);
        });
        
        // 10초 앞으로 버튼 이벤트
        $('.audio-forward-button').on('click', function() {
            if (!currentAudio) return;
            currentAudio.currentTime = Math.min(currentAudio.duration, currentAudio.currentTime + 10);
            updateProgressBar((currentAudio.currentTime / currentAudio.duration) * 100);
        });
        
        // 오디오 진행률 표시줄 업데이트 함수
        function updateProgressBar(percent) {
            $('.audio-progress .progress-bar').css('width', percent + '%');
        }
        
        // 오디오 재생 종료 시 버튼 상태 변경
        $('audio').on('ended', function() {
            $('.audio-playpause-button').text('재생').removeClass('pause').addClass('play');
            clearInterval(progressInterval);
            updateProgressBar(100);
        });
        
        // 디버깅용 메시지
        // console.log('오디오 설정 완료', audioSections);
    }
    
    /**
     * 컨텐츠 네비게이션 (이전/다음)
     */
    function navigateCdtContent(direction) {
        // 현재 활성화된 컨텐츠 찾기
        const $visibleContent = $('.sectionContents .cdt-content:visible');
        const $allContents = $('.sectionContents .cdt-content');
        
        // 현재 인덱스 찾기
        const currentIndex = $allContents.index($visibleContent);
        
        // 다음/이전 인덱스 계산
        let targetIndex;
        if (direction === 'prev') {
            targetIndex = (currentIndex > 0) ? currentIndex - 1 : $allContents.length - 1;
        } else {
            targetIndex = (currentIndex < $allContents.length - 1) ? currentIndex + 1 : 0;
        }
        
        // 모든 컨텐츠 숨기고 타겟 컨텐츠만 보이기
        $allContents.hide();
        $allContents.eq(targetIndex).show();
        
        // 탭 활성화 상태 업데이트
        // $('.infoArea.reviewing .sectionBtnWrap .btn').removeClass('active');
        // $('.infoArea.reviewing .sectionBtnWrap .btn').eq(targetIndex).addClass('active');
        
        // // 오디오 정지 (있는 경우)
        // $('audio').each(function() { this.pause(); });
        // $('.audio-playpause-button').text('재생').removeClass('pause').addClass('play');
    }
</script>