{{--
    Full-page / Section Loader
    Props:
      $fullpage – covers the entire viewport when true
      $size     – sm|md|lg spinner size
      $label    – loading label text
--}}
@props(['fullpage' => false, 'size' => 'md', 'label' => 'Loading…'])

@php
    $spinSize = match($size) {
        'sm' => 'h-6 w-6',
        'lg' => 'h-16 w-16',
        default => 'h-10 w-10',
    };
@endphp

<div {{ $attributes }} @class([
    'flex flex-col items-center justify-center gap-3',
    'fixed inset-0 z-50 bg-white/80 dark:bg-surface-950/80 backdrop-blur-sm' => $fullpage,
    'py-16' => !$fullpage,
])>
    <svg
        class="animate-spin {{ $spinSize }} text-primary-600"
        fill="none"
        viewBox="0 0 24 24"
        aria-hidden="true"
    >
        <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"/>
        <path class="opacity-75" fill="currentColor"
              d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"/>
    </svg>
    @if($label)
        <p class="text-sm text-surface-500 dark:text-surface-400 animate-pulse">{{ $label }}</p>
    @endif
</div>