@props([
    'name' => null,
    'id' => null,
    'label' => null,
    'placeholder' => 'Select option...',
    'required' => false,
    'disabled' => false,
    'helper' => null,
    'error' => null,
    'containerClass' => 'w-full',
    'multiple' => false,
    'options' => [],
    'selected' => [],
    'variant' => 'default', // Options: default, underlined, floating
    'textColor' => 'text-base-content', // Add text color property with default
    'optionsTextColor' => 'text-base-content', // Add options text color property with default
])

@php
    $selectId = $id ?? $name ?? 'select-' . Str::random(6);
    $selected = is_array($selected) ? $selected : [$selected];
    
    // Get text color from attributes or use default
    $textColorClass = $attributes['text-color'] ?? $textColor;
    $optionsTextColorClass = $attributes['options-text-color'] ?? ($attributes['optionsTextColor'] ?? 'text-black');
    
    // Define classes for different variants
    $variantClasses = [
        'default' => 'advance-select-toggle ' . $textColorClass,
        'underlined' => 'advance-select-toggle !pl-0 border-0 border-b border-white focus:border-white hover:border-white focus:ring-0 bg-transparent rounded-none ' . $textColorClass,
        'floating' => 'advance-select-toggle pt-4 ' . $textColorClass,
    ];
    
    // Get the appropriate class for the selected variant
    $variantClass = $variantClasses[$variant] ?? $variantClasses['default'];
    
    // Build the select configuration object
    $selectConfig = [
        'placeholder' => $placeholder,
        'toggleTag' => '<button type="button" aria-expanded="false"></button>',
        'toggleClasses' => $variantClass,
        'dropdownClasses' => 'advance-select-menu bg-white',
        'optionClasses' => 'advance-select-option selected:active',
        'optionTemplate' => '<div class="flex justify-between items-center w-full"><span data-title class="' . $optionsTextColorClass . '"></span><span class="icon-[tabler--check] flex-shrink-0 size-4 text-primary hidden selected:block"></span></div>',
        'extraMarkup' => '<span class="icon-[tabler--chevron-down] flex-shrink-0 size-4 ' . $textColorClass . ' absolute top-1/2 end-3 -translate-y-1/2"></span>'
    ];
    
    // Options for floating labels need special handling
    if ($variant === 'floating') {
        $selectConfig['placeholder'] = ' ';
    }
    
    $selectConfigJson = json_encode($selectConfig);
@endphp

<div class="{{ $containerClass }}">
    @if($label && $variant !== 'floating')
        <label class="label mb-1 !pl-0 {{ $textColorClass }}" for="{{ $selectId }}">
            {{ $label }}
            @if($required)
                <span class="text-error ml-1">*</span>
            @endif
        </label>
    @endif

    <div class="relative">
        <select
            name="{{ $name }}{{ $multiple ? '[]' : '' }}"
            id="{{ $selectId }}"
            {{ $multiple ? 'multiple' : '' }}
            @if($required) required @endif
            @if($disabled) disabled @endif
            data-select='{{ $selectConfigJson }}'
            class="hidden {{ $error ? 'select-error' : '' }}"
            {{ $attributes->except(['text-color', 'options-text-color']) }}
        >
            @unless($required)
                <option value="">{{ $placeholder }}</option>
            @endunless
            
            @foreach($options as $value => $label)
                @php
                    if (is_array($label)) {
                        $optionValue = $label['value'] ?? $value;
                        $optionLabel = $label['label'] ?? '';
                        $optionDisabled = $label['disabled'] ?? false;
                    } else {
                        $optionValue = $value;
                        $optionLabel = $label;
                        $optionDisabled = false;
                    }
                @endphp
                <option 
                    value="{{ $optionValue }}"
                    @if(in_array($optionValue, $selected)) selected @endif
                    @if($optionDisabled) disabled @endif
                >
                    {{ $optionLabel }}
                </option>
            @endforeach
            
            {{ $slot }}
        </select>
        
        @if($variant === 'floating')
            <label for="{{ $selectId }}" class="absolute text-sm {{ $textColorClass }}/70 duration-300 transform -translate-y-4 scale-75 top-2 z-10 origin-[0] px-2 peer-focus:px-2 peer-focus:text-primary start-1 cursor-text">
                {{ $label }}
                @if($required)
                    <span class="text-error ml-1">*</span>
                @endif
            </label>
        @endif
    </div>

    @if($helper && !$error)
        <div class="text-xs {{ $textColorClass }}/70 mt-1">{{ $helper }}</div>
    @endif

    @if($error)
        <div class="text-xs text-error mt-1">{{ $error }}</div>
    @endif
</div>