@extends('layouts.app')

@section('title', 'Nueva Empresa')
@section('page-title', 'Crear Nueva Empresa')

@section('content')
<div class="row justify-content-center">
    <div class="col-lg-8">
        <div class="card">
            <div class="card-header bg-white d-flex justify-content-between align-items-center">
                <h5 class="mb-0">Información de la Empresa</h5>
                <a href="{{ route('companies.index') }}" class="btn btn-sm btn-outline-secondary">
                    <i class="bi bi-arrow-left"></i> Volver
                </a>
            </div>
            <div class="card-body">
                <form action="{{ route('companies.store') }}" method="POST">
                    @csrf
                    
                    <div class="mb-3">
                        <label for="name" class="form-label">
                            Nombre de la Empresa <span class="text-danger">*</span>
                        </label>
                        <input 
                            type="text" 
                            class="form-control @error('name') is-invalid @enderror" 
                            id="name" 
                            name="name" 
                            value="{{ old('name') }}" 
                            required
                            placeholder="Ej: Empresa ABC S.A."
                        >
                        @error('name')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="contact_email" class="form-label">
                                Email de Contacto
                            </label>
                            <input 
                                type="email" 
                                class="form-control @error('contact_email') is-invalid @enderror" 
                                id="contact_email" 
                                name="contact_email" 
                                value="{{ old('contact_email') }}"
                                placeholder="contacto@empresa.com"
                            >
                            @error('contact_email')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="col-md-6 mb-3">
                            <label for="contact_phone" class="form-label">
                                Teléfono de Contacto
                            </label>
                            <input 
                                type="text" 
                                class="form-control @error('contact_phone') is-invalid @enderror" 
                                id="contact_phone" 
                                name="contact_phone" 
                                value="{{ old('contact_phone') }}"
                                placeholder="+502 2345-6789"
                            >
                            @error('contact_phone')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>

                    <div class="mb-3">
                        <label for="address" class="form-label">
                            Dirección
                        </label>
                        <textarea 
                            class="form-control @error('address') is-invalid @enderror" 
                            id="address" 
                            name="address" 
                            rows="3"
                            placeholder="Dirección completa de la empresa"
                        >{{ old('address') }}</textarea>
                        @error('address')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="mb-3">
                        <label for="is_active" class="form-label">
                            Estado <span class="text-danger">*</span>
                        </label>
                        <select 
                            class="form-select @error('is_active') is-invalid @enderror" 
                            id="is_active" 
                            name="is_active"
                            required
                        >
                            <option value="1" {{ old('is_active', '1') == '1' ? 'selected' : '' }}>Activa</option>
                            <option value="0" {{ old('is_active') == '0' ? 'selected' : '' }}>Inactiva</option>
                        </select>
                        @error('is_active')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                        <div class="form-text">
                            Solo las empresas activas pueden crear proyectos y tickets
                        </div>
                    </div>

                    <hr class="my-4">

                    <div class="d-flex justify-content-end gap-2">
                        <a href="{{ route('companies.index') }}" class="btn btn-secondary">
                            <i class="bi bi-x-circle"></i> Cancelar
                        </a>
                        <button type="submit" class="btn btn-primary">
                            <i class="bi bi-check-circle"></i> Crear Empresa
                        </button>
                    </div>
                </form>
            </div>
        </div>

        <!-- Información adicional -->
        <div class="alert alert-info mt-3">
            <i class="bi bi-info-circle me-2"></i>
            <strong>Nota:</strong> Después de crear la empresa, podrás:
            <ul class="mb-0 mt-2">
                <li>Agregar proyectos asociados a esta empresa</li>
                <li>Asignar usuarios como clientes de la empresa</li>
                <li>Configurar técnicos y supervisores por defecto</li>
            </ul>
        </div>
    </div>
</div>
@endsection

@push('styles')
<style>
    .form-label {
        font-weight: 500;
        color: #495057;
    }
    
    .card {
        box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.075);
    }
</style>
@endpush