@extends('layouts.admin')

@section('title', 'Add Attribute')

@section('content')
<div class="admin-page-header">
    <h1>Add Attribute</h1>
    <a href="{{ route('admin.attributes.index') }}" class="admin-btn-primary">
        <i class="bi bi-arrow-left"></i> Back to List
    </a>
</div>

<div class="admin-card">
    <div class="card-body">
        <form action="{{ route('admin.attributes.store') }}" method="POST">
            @csrf

            <div class="row">
                <div class="col-md-6 mb-3">
                    <label class="admin-form-label">Attribute Name *</label>
                    <input type="text" 
                           name="name" 
                           class="admin-form-control form-control @error('name') is-invalid @enderror" 
                           value="{{ old('name') }}" 
                           placeholder="e.g., Size, Color, Material"
                           required
                           maxlength="255">
                    @error('name')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                    <small class="form-text text-muted">
                        Examples: Size, Color, Material, Brand, etc.
                    </small>
                </div>
                <div class="col-md-6 mb-3">
                    <label class="admin-form-label">Status *</label>
                    <select name="status" 
                            class="admin-form-control form-select @error('status') is-invalid @enderror" 
                            required>
                        <option value="active" {{ old('status', 'active') === 'active' ? 'selected' : '' }}>Active</option>
                        <option value="inactive" {{ old('status') === 'inactive' ? 'selected' : '' }}>Inactive</option>
                    </select>
                    @error('status')
                        <div class="invalid-feedback">{{ $message }}</div>
                    @enderror
                </div>
            </div>

            <div class="mt-4">
                <button type="submit" class="admin-btn-primary">
                    <i class="bi bi-save"></i> Create Attribute
                </button>
                <a href="{{ route('admin.attributes.index') }}" class="btn btn-outline-secondary">
                    Cancel
                </a>
            </div>
        </form>
    </div>
</div>
@endsection
