{{-- Key-Value 테이블 표시용 Partial --}}
@php
    /**
     * JSON 데이터를 Key-Value 테이블로 렌더링
     * 중첩 배열/객체는 재귀적으로 표시
     */
    if (!function_exists('renderJsonValue')) {
        function renderJsonValue($value, $depth = 0) {
            if (is_null($value)) {
                return '<span class="text-gray-400 italic">null</span>';
            }
            if (is_bool($value)) {
                return $value
                    ? '<span class="text-green-600 font-medium">true</span>'
                    : '<span class="text-red-500 font-medium">false</span>';
            }
            if (is_numeric($value)) {
                return '<span class="font-mono text-blue-600">' . e($value) . '</span>';
            }
            if (is_string($value)) {
                return '<span class="text-gray-700">' . e($value) . '</span>';
            }
            if (is_array($value)) {
                // 순차 배열인지 연관 배열인지 확인
                if (empty($value)) {
                    return '<span class="text-gray-400 italic">[]</span>';
                }
                if (array_keys($value) === range(0, count($value) - 1)) {
                    // 순차 배열: 인라인으로 표시
                    if (count($value) <= 5 && !array_filter($value, 'is_array')) {
                        // 단순 배열이면 인라인 표시
                        $items = array_map(fn($v) => is_string($v) ? e($v) : e(json_encode($v, JSON_UNESCAPED_UNICODE)), $value);
                        return '<span class="text-gray-600">[' . implode(', ', $items) . ']</span>';
                    }
                    // 복잡한 배열은 리스트로 표시
                    $html = '<div class="ml-2 border-l-2 border-gray-200 pl-2 mt-1 space-y-1">';
                    foreach ($value as $idx => $item) {
                        $html .= '<div class="flex items-start gap-1">';
                        $html .= '<span class="text-gray-400 text-xs">[' . $idx . ']</span>';
                        $html .= '<div>' . renderJsonValue($item, $depth + 1) . '</div>';
                        $html .= '</div>';
                    }
                    $html .= '</div>';
                    return $html;
                } else {
                    // 연관 배열: 중첩 테이블로 표시
                    $html = '<div class="ml-2 border-l-2 border-gray-200 pl-2 mt-1">';
                    foreach ($value as $k => $v) {
                        $html .= '<div class="flex items-start gap-2 py-0.5">';
                        $html .= '<span class="text-gray-500 font-medium text-xs shrink-0">' . e($k) . ':</span>';
                        $html .= '<div class="text-xs">' . renderJsonValue($v, $depth + 1) . '</div>';
                        $html .= '</div>';
                    }
                    $html .= '</div>';
                    return $html;
                }
            }
            return '<span class="text-gray-400">' . e(gettype($value)) . '</span>';
        }
    }
@endphp

@if(is_array($data) && !empty($data))
    <table class="w-full text-xs">
        <thead>
            <tr class="border-b">
                <th class="text-left py-1 text-gray-500 font-medium w-1/3">Key</th>
                <th class="text-left py-1 text-gray-500 font-medium">Value</th>
            </tr>
        </thead>
        <tbody>
            @foreach($data as $key => $value)
                <tr class="border-b border-gray-100 last:border-0 align-top">
                    <td class="py-1.5 font-mono text-gray-600 font-medium">{{ $key }}</td>
                    <td class="py-1.5">{!! renderJsonValue($value) !!}</td>
                </tr>
            @endforeach
        </tbody>
    </table>
@else
    <span class="text-xs text-gray-400">데이터 없음</span>
@endif