@php
    $locales = ['en' => 'English', 'nl' => 'Nederlands', 'de' => 'Deutsch', 'fr' => 'Français', 'pl' => 'Polski', 'es' => 'Español'];
    $currentLocale = app()->getLocale();
    $fieldId = $name . '_' . uniqid();
@endphp

<div class="translatable-field" data-field="{{ $name }}" data-model-type="{{ $modelType ?? '' }}" data-model-id="{{ $modelId ?? '' }}">
    <ul class="nav nav-tabs nav-tabs-sm mb-2" role="tablist">
        @foreach($locales as $locale => $localeName)
            <li class="nav-item">
                <a class="nav-link {{ $locale === 'en' ? 'active' : '' }}" 
                   data-toggle="tab" 
                   href="#{{ $fieldId }}_{{ $locale }}" 
                   role="tab">
                    {{ strtoupper($locale) }}
                    @if($locale === 'en')
                        <span class="badge badge-primary badge-sm">{{ __('Source') }}</span>
                    @endif
                </a>
            </li>
        @endforeach
    </ul>
    
    <div class="tab-content">
        @foreach($locales as $locale => $localeName)
            <div class="tab-pane fade {{ $locale === 'en' ? 'show active' : '' }}" 
                 id="{{ $fieldId }}_{{ $locale }}" 
                 role="tabpanel">
                @if($type === 'textarea')
                    <textarea name="{{ $name }}[{{ $locale }}]" 
                              class="form-control translatable-textarea" 
                              data-locale="{{ $locale }}"
                              rows="{{ $rows ?? 3 }}"
                              {{ isset($required) && $required && $locale === 'en' ? 'required' : '' }}>{{ $model ? $model->getTranslation($name, $locale, false) : old($name . '.' . $locale) }}</textarea>
                @else
                    <input type="text" 
                           name="{{ $name }}[{{ $locale }}]" 
                           class="form-control translatable-input" 
                           data-locale="{{ $locale }}"
                           value="{{ $model ? $model->getTranslation($name, $locale, false) : old($name . '.' . $locale) }}"
                           {{ isset($required) && $required && $locale === 'en' ? 'required' : '' }}>
                @endif
            </div>
        @endforeach
    </div>
    
    @if(config('services.google_translate.key'))
        <div class="mt-2">
            <button type="button" class="btn btn-sm btn-outline-secondary auto-translate-btn" 
                    data-field="{{ $name }}" 
                    data-field-id="{{ $fieldId }}">
                <i class="fa fa-language"></i> {{ __('Auto-translate from English') }}
            </button>
            <span class="translate-status text-muted small ml-2"></span>
        </div>
    @endif
</div>