@extends('layouts.admin')

@section('title', 'Editar Usuário')

@section('content')
<div class="container-fluid">
    <!-- Header Section -->
    <div class="d-flex justify-content-between align-items-center mb-4 p-4 rounded" style="background-color: #f8fafc; border-left: 4px solid #334155;">
        <div>
            <h3 class="mb-1" style="color: #334155; font-weight: 600;">Editar Usuário</h3>
            <p class="text-muted mb-0">Altere os dados do usuário {{ $user->name }}</p>
        </div>
        <a href="{{ route('admin.users.index') }}" class="btn btn-outline-secondary px-4 py-2" style="border-radius: 8px;">
            <i class="fas fa-arrow-left me-2"></i>Voltar à Lista
        </a>
    </div>

    <!-- User Data Form -->
    <div class="mb-4">
        <div class="rounded-lg shadow-sm" style="background-color: white; border: 1px solid #e2e8f0;">
            <div class="px-4 py-3" style="background-color: #334155; border-radius: 8px 8px 0 0;">
                <h6 class="mb-0 text-white" style="font-weight: 500;">
                    <i class="fas fa-user-edit me-2"></i>Dados do Usuário
                </h6>
            </div>
            <div class="p-4">
                <form method="POST" action="{{ route('admin.users.update', $user->id) }}">
                    @csrf
                    @method('PUT')
                    
                    <div class="row g-4">
                        <div class="col-md-6">
                            <label for="name" class="form-label fw-medium" style="color: #334155;">Nome Completo *</label>
                            <input type="text" 
                                   class="form-control @error('name') is-invalid @enderror" 
                                   id="name" 
                                   name="name" 
                                   value="{{ old('name', $user->name) }}" 
                                   required
                                   style="border-color: #d1d5db; padding: 12px;">
                            @error('name')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        
                        <div class="col-md-6">
                            <label for="email" class="form-label fw-medium" style="color: #334155;">Endereço de Email *</label>
                            <input type="email" 
                                   class="form-control @error('email') is-invalid @enderror" 
                                   id="email" 
                                   name="email" 
                                   value="{{ old('email', $user->email) }}" 
                                   required
                                   style="border-color: #d1d5db; padding: 12px;">
                            @error('email')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>

                    <div class="row g-4 mt-2">
                        <div class="col-md-6">
                            <label for="password" class="form-label fw-medium" style="color: #334155;">Nova Senha</label>
                            <input type="password" 
                                   class="form-control @error('password') is-invalid @enderror" 
                                   id="password" 
                                   name="password"
                                   placeholder="Deixe em branco para manter a atual"
                                   style="border-color: #d1d5db; padding: 12px;">
                            <small class="text-muted">Mínimo 8 caracteres</small>
                            @error('password')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        
                        <div class="col-md-6">
                            <label for="type" class="form-label fw-medium" style="color: #334155;">Tipo de Usuário *</label>
                            <select class="form-select @error('type') is-invalid @enderror" 
                                    id="type" 
                                    name="type" 
                                    required
                                    style="border-color: #d1d5db; padding: 12px;">
                                <option value="">Selecione o tipo</option>
                                <option value="lawyer" {{ old('type', $user->type) === 'Lawyer' ? 'selected' : '' }}>Individual</option>
                                <option value="firm" {{ old('type', $user->type) === 'Firm' ? 'selected' : '' }}>Empresa</option>
                                <option value="admin" {{ old('type', $user->type) === 'Admin' ? 'selected' : '' }}>Administrador</option>
                            </select>
                            @error('type')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>

                    <div class="row mt-4">
                        <div class="col-12">
                            <div class="form-check">
                                <input class="form-check-input" 
                                       type="checkbox" 
                                       id="is_active" 
                                       name="is_active" 
                                       value="1" 
                                       {{ old('is_active', $user->is_active) ? 'checked' : '' }}
                                       style="border-color: #334155;">
                                <label class="form-check-label fw-medium" for="is_active" style="color: #334155;">
                                    Usuário Ativo
                                </label>
                                <small class="text-muted d-block">Usuários inativos não podem fazer login no sistema</small>
                            </div>
                        </div>
                    </div>

                    <div class="text-end mt-4 pt-3" style="border-top: 1px solid #e2e8f0;">
                        <button type="submit" class="btn text-white px-4 py-2" style="background-color: #334155; border-radius: 6px;">
                            <i class="fas fa-save me-2"></i>Atualizar Usuário
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- Subscriptions Section -->
    <div class="rounded-lg shadow-sm" style="background-color: white; border: 1px solid #e2e8f0;">
        <div class="px-4 py-3 d-flex justify-content-between align-items-center" style="background-color: #334155; border-radius: 8px 8px 0 0;">
            <h6 class="mb-0 text-white" style="font-weight: 500;">
                <i class="fas fa-credit-card me-2"></i>Assinaturas do Usuário
            </h6>
            <button type="button" class="btn btn-light btn-sm px-3" data-bs-toggle="modal" data-bs-target="#addSubscriptionModal" style="border-radius: 6px;">
                <i class="fas fa-plus me-1"></i>Nova Assinatura
            </button>
        </div>
        
        @if($user->subscriptions && $user->subscriptions->count() > 0)
            <div class="table-responsive">
                <table class="table table-hover mb-0">
                    <thead style="background-color: #f8fafc;">
                        <tr>
                            <th class="px-4 py-3 fw-medium" style="color: #334155; border-color: #e2e8f0;">Plano</th>
                            <th class="px-4 py-3 fw-medium" style="color: #334155; border-color: #e2e8f0;">Início</th>
                            <th class="px-4 py-3 fw-medium" style="color: #334155; border-color: #e2e8f0;">Término</th>
                            <th class="px-4 py-3 fw-medium" style="color: #334155; border-color: #e2e8f0;">Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($user->subscriptions as $subscription)
                        <tr style="border-color: #f1f5f9;">
                            <td class="px-4 py-3">
                                <strong style="color: #334155;">{{ $subscription->plan->name ?? 'N/A' }}</strong>
                            </td>
                            <td class="px-4 py-3" style="color: #6b7280;">{{ \Carbon\Carbon::parse($subscription->starts_at)->format('d/m/Y') }}</td>
                            <td class="px-4 py-3" style="color: #6b7280;">{{ \Carbon\Carbon::parse($subscription->ends_at)->format('d/m/Y') }}</td>
                            <td class="px-4 py-3">
                                @if($subscription->status === 'active')
                                    <div class="d-flex align-items-center">
                                        <div class="rounded-circle me-2" style="width: 8px; height: 8px; background-color: #10b981;"></div>
                                        <span style="color: #334155; font-size: 0.875rem;">Ativa</span>
                                    </div>
                                @elseif($subscription->status === 'cancelled')
                                    <div class="d-flex align-items-center">
                                        <div class="rounded-circle me-2" style="width: 8px; height: 8px; background-color: #6b7280;"></div>
                                        <span style="color: #6b7280; font-size: 0.875rem;">Cancelada</span>
                                    </div>
                                @elseif($subscription->status === 'expired')
                                    <div class="d-flex align-items-center">
                                        <div class="rounded-circle me-2" style="width: 8px; height: 8px; background-color: #f59e0b;"></div>
                                        <span style="color: #6b7280; font-size: 0.875rem;">Expirada</span>
                                    </div>
                                @else
                                    <span class="badge px-2 py-1" style="background-color: #f8fafc; color: #334155; border: 1px solid #334155; font-size: 0.75rem;">{{ ucfirst($subscription->status) }}</span>
                                @endif
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @else
            <div class="text-center py-5">
                <div class="mb-3">
                    <div class="rounded-circle mx-auto d-flex align-items-center justify-content-center" 
                         style="width: 64px; height: 64px; background-color: #f8fafc; color: #334155;">
                        <i class="fas fa-credit-card fa-2x"></i>
                    </div>
                </div>
                <h5 style="color: #334155; font-weight: 500;">Nenhuma assinatura encontrada</h5>
                <p style="color: #6b7280; margin-bottom: 0;">Este usuário ainda não possui assinaturas ativas.</p>
            </div>
        @endif
    </div>
</div>

<!-- Modal Add Subscription -->
<div class="modal fade" id="addSubscriptionModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content" style="border-radius: 12px; border: none;">
            <form method="POST" action="{{ route('admin.users.add-subscription', $user->id) }}">
                @csrf
                <div class="modal-header" style="background-color: #334155; border-radius: 12px 12px 0 0;">
                    <h5 class="modal-title text-white fw-medium">
                        <i class="fas fa-plus me-2"></i>Nova Assinatura
                    </h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body p-4">
                    <div class="mb-4">
                        <label for="plan_id" class="form-label fw-medium" style="color: #334155;">Selecionar Plano *</label>
                        <select class="form-select" id="plan_id" name="plan_id" required style="border-color: #d1d5db; padding: 12px;">
                            <option value="">Escolha um plano</option>
                            @foreach($plans as $plan)
                                <option value="{{ $plan->id }}">{{ $plan->name }} - R$ {{ number_format($plan->price, 2, ',', '.') }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="row g-3">
                        <div class="col-6">
                            <label for="starts_at" class="form-label fw-medium" style="color: #334155;">Data de Início *</label>
                            <input type="date" class="form-control" id="starts_at" name="starts_at" required style="border-color: #d1d5db; padding: 12px;">
                        </div>
                        <div class="col-6">
                            <label for="ends_at" class="form-label fw-medium" style="color: #334155;">Data de Término *</label>
                            <input type="date" class="form-control" id="ends_at" name="ends_at" required style="border-color: #d1d5db; padding: 12px;">
                        </div>
                    </div>
                </div>
                <div class="modal-footer" style="border-top: 1px solid #e2e8f0;">
                    <button type="button" class="btn btn-outline-secondary px-4" data-bs-dismiss="modal" style="border-radius: 6px;">
                        Cancelar
                    </button>
                    <button type="submit" class="btn text-white px-4" style="background-color: #334155; border-radius: 6px;">
                        <i class="fas fa-plus me-1"></i>Adicionar Assinatura
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection