@php
    $items = $items ?? [];
    $active = $active ?? null;
    $mode = $mode ?? 'side';

    $title = $title ?? null;
    $subtitle = $subtitle ?? null;
@endphp

@if($mode === 'tabs')
    <nav class="subnav subnav--tabs" aria-label="서브메뉴 탭">
        @foreach($items as $it)
            @php $isActive = ($active && $active === ($it['key'] ?? $it['url'])); @endphp
            <a href="{{ $it['url'] ?? '#' }}"
               class="subnav-tab {{ $isActive ? 'is-active' : '' }}"
               @if($isActive) aria-current="page" @endif>
                {{ $it['label'] ?? '' }}
            </a>
        @endforeach
    </nav>
@else
    <nav class="subnav subnav--side" aria-label="서브메뉴">

        {{-- ✅ 박스 wrapper: 헤더도 박스 안으로 --}}
        <div class="subnav-box">

            @if($title || $subtitle)
                <div class="subnav-head">
                    @if($title)
                        <div class="subnav-title">{{ $title }}</div>
                    @endif

                    @if($subtitle)
                        <div class="subnav-subtitle">{{ $subtitle }}</div>
                    @endif
                </div>
                <div class="subnav-divider"></div>
            @endif

            <ul class="subnav-list">
                @foreach($items as $it)
                    @php $isActive = ($active && $active === ($it['key'] ?? $it['url'])); @endphp
                    <li>
                        <a href="{{ $it['url'] ?? '#' }}"
                           class="subnav-link {{ $isActive ? 'is-active' : '' }}"
                           @if($isActive) aria-current="page" @endif>
                            {{ $it['label'] ?? '' }}
                        </a>
                    </li>
                @endforeach
            </ul>

        </div>
    </nav>
@endif