@props(['value' => '', 'size' => 'md', 'label' => ''])

@php
$sizeMap = [
    'sm' => 'h-24 w-24',
    'md' => 'h-32 w-32',
    'lg' => 'h-48 w-48',
];
$sizeClass = $sizeMap[$size] ?? $sizeMap['md'];
@endphp

<div class="flex flex-col items-center gap-2">
    <div class="{{ $sizeClass }} bg-white dark:bg-slate-800 border-2 border-slate-200 dark:border-slate-600 rounded-lg flex items-center justify-center">
        {{-- Placeholder QR pattern --}}
        <div class="grid grid-cols-5 gap-0.5 p-2">
            @for($i = 0; $i < 25; $i++)
                <div class="w-2 h-2 {{ ($i % 3 === 0 || $i % 7 === 0) ? 'bg-slate-900 dark:bg-slate-100' : 'bg-slate-200 dark:bg-slate-600' }} rounded-sm"></div>
            @endfor
        </div>
    </div>
    @if($label)
        <p class="text-xs text-slate-500 dark:text-slate-400">{{ $label }}</p>
    @endif
</div>