@props(['active' => 'services'])

<div class="border-b border-gray-200 dark:border-gray-700">
    <nav class="-mb-px flex space-x-8">
        <a href="{{ route('provider.appointment-settings.index', ['tab' => 'services']) }}" 
           class="{{ $active === 'services' ? 'text-primary dark:text-primary-400' : 'text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300' }} whitespace-nowrap py-2 px-1 text-sm font-medium transition-colors">
            Services & Tarifs
        </a>
    </nav>
</div>