{{-- resources/views/components/plan/tabs.blade.php --}}
@props([
    'class' => '',
    'labelClass'   => 'font-semibold pb-1',
    'activeClass'  => 'border-b-[length:var(--border)] border-b-base-content/50',
    'labelDivClass'=> 'border-b-[length:var(--border)] border-b-base-content/10 flex overflow-x-auto',
])

<nav class="relative w-full {{ $class }}">
    <div class="{{ $labelDivClass }} scrollbar-hide">
        {{-- Pacientes --}}
        <a
            wire:navigate wire:navigate.hover
            href="{{ route('plan-de-atencion.pacientes') }}"
            class="tab whitespace-nowrap {{ $labelClass }}
                {{ request()->routeIs('day-hospital.pacientes', 'plan-de-atencion') ? 'tab-active '.$activeClass : 'text-base-content/60 hover:text-base-content' }}">
            <x-mary-icon name="o-users" class="me-2" />
            Pacientes
        </a>

        {{-- Consultas --}}
        <a
            wire:navigate wire:navigate.hover
            href="{{ route('plan-de-atencion.consultas') }}"
            class="tab whitespace-nowrap {{ $labelClass }}
                {{ request()->routeIs('day-hospital.consultas') ? 'tab-active '.$activeClass : 'text-base-content/60 hover:text-base-content' }}">
            <x-mary-icon name="o-queue-list" class="me-2" />
            Consultas
        </a>

    </div>
</nav>