@props(['form' => null])

<div class="card border shadow-none mb-4">
    <div class="card-body">
        <div class="d-flex align-items-center gap-2 mb-1">
            <span class="badge bg-label-primary rounded-2 p-2 lh-1"><i class="ti tabler-settings ti-sm"></i></span>
            <h6 class="mb-0 fw-bold text-uppercase text-primary">{{ __('Machine status & core specifications') }}</h6>
        </div>
        <p class="text-muted small mb-4 ms-1">{{ __('Basic operational details and power requirements.') }}</p>

        <div class="row g-4">
            {{-- Status column --}}
            <div class="col-md-6">
                <div class="border rounded p-3 h-100">
                    <label class="form-label" for="ms_status">{{ __('Machine status') }} <span class="text-danger">*</span></label>
                    <div class="input-group input-group-merge">
                        <span class="input-group-text"><i class="ti tabler-activity"></i></span>
                        <select id="ms_status" class="form-select @error('form.machineSpecs.status') is-invalid @enderror" wire:model.live="form.machineSpecs.status">
                            <option value="">{{ __('Select machine status') }}</option>
                            <option value="working">{{ __('In working condition') }}</option>
                            <option value="stopped">{{ __('Not connected/Off') }}</option>
                            <option value="other">{{ __('Other') }}</option>
                        </select>
                    </div>
                    @error('form.machineSpecs.status') <div class="text-danger small mt-1">{{ $message }}</div> @enderror

                    @if (($form->machineSpecs['status'] ?? '') === 'other')
                        <div class="mt-3">
                            <label class="form-label" for="other_status">{{ __('Describe other status') }} <span class="text-danger">*</span></label>
                            <textarea id="other_status" rows="2" class="form-control @error('form.machineSpecs.other_status_description') is-invalid @enderror"
                                wire:model.defer="form.machineSpecs.other_status_description"
                                placeholder="{{ __('Enter status description') }}"></textarea>
                            @error('form.machineSpecs.other_status_description') <div class="text-danger small mt-1">{{ $message }}</div> @enderror
                        </div>
                    @endif

                    @if (($form->machineSpecs['status'] ?? '') === 'stopped')
                        <div class="mt-3">
                            <label class="form-label" for="stopped_since">{{ __('Stopped since') }} <span class="text-danger">*</span></label>
                            <div class="input-group input-group-merge">
                                <span class="input-group-text"><i class="ti tabler-calendar"></i></span>
                                <input type="date" id="stopped_since" class="form-control @error('form.machineSpecs.stopped_since') is-invalid @enderror"
                                    wire:model.defer="form.machineSpecs.stopped_since">
                            </div>
                            @error('form.machineSpecs.stopped_since') <div class="text-danger small mt-1">{{ $message }}</div> @enderror
                        </div>
                    @endif
                </div>
            </div>

            {{-- Core specs column --}}
            <div class="col-md-6">
                <label class="form-label" for="movement_type">{{ __('Movement type') }} <span class="text-danger">*</span></label>
                <div class="input-group input-group-merge">
                    <span class="input-group-text"><i class="ti tabler-settings-2"></i></span>
                    <select id="movement_type" class="form-select @error('form.machineSpecs.movement_type') is-invalid @enderror" wire:model.live="form.machineSpecs.movement_type">
                        <option value="">{{ __('Select movement type') }}</option>
                        <option value="dobby">{{ __('Dobby') }}</option>
                        <option value="crank">{{ __('Crank') }}</option>
                        <option value="cams">{{ __('Cams') }}</option>
                        <option value="jacquard">{{ __('Jacquard') }}</option>
                        <option value="e-sheet">{{ __('E-sheet') }}</option>
                    </select>
                </div>
                @error('form.machineSpecs.movement_type') <div class="text-danger small mt-1">{{ $message }}</div> @enderror

                <div class="row g-4 mt-0">
                    <div class="col-6">
                        <label class="form-label" for="voltage">{{ __('Voltage (V)') }} <span class="text-danger">*</span></label>
                        <div class="input-group input-group-merge">
                            <span class="input-group-text"><i class="ti tabler-bolt"></i></span>
                            <input type="text" id="voltage" inputmode="decimal" maxlength="10" class="form-control @error('form.machineSpecs.voltage') is-invalid @enderror"
                                wire:model.defer="form.machineSpecs.voltage" placeholder="{{ __('e.g. 380') }}">
                        </div>
                        @error('form.machineSpecs.voltage') <div class="text-danger small mt-1">{{ $message }}</div> @enderror
                    </div>
                    <div class="col-6">
                        <label class="form-label" for="frequency">{{ __('Frequency (Hz)') }} <span class="text-danger">*</span></label>
                        <div class="input-group input-group-merge">
                            <span class="input-group-text"><i class="ti tabler-wave-sine"></i></span>
                            <input type="text" id="frequency" inputmode="decimal" maxlength="10" class="form-control @error('form.machineSpecs.frequency') is-invalid @enderror"
                                wire:model.defer="form.machineSpecs.frequency" placeholder="{{ __('e.g. 50') }}">
                        </div>
                        @error('form.machineSpecs.frequency') <div class="text-danger small mt-1">{{ $message }}</div> @enderror
                    </div>
                </div>
            </div>

            <div class="col-12">
                <label class="form-label" for="fabric_type">{{ __('Type of fabric produced') }} <span class="text-danger">*</span></label>
                <div class="input-group input-group-merge">
                    <span class="input-group-text"><i class="ti tabler-shirt"></i></span>
                    <input type="text" id="fabric_type" class="form-control @error('form.machineSpecs.fabric_type') is-invalid @enderror"
                        wire:model.defer="form.machineSpecs.fabric_type" placeholder="{{ __('e.g. Cotton, Denim, Silk') }}">
                </div>
                @error('form.machineSpecs.fabric_type') <div class="text-danger small mt-1">{{ $message }}</div> @enderror
            </div>
        </div>
    </div>
</div>