@extends('layouts.app')
@section('title', $user->exists ? 'Edit User' : 'Add User')
@section('content')

@php $editing = $user->exists; @endphp

<div class="d-flex align-items-center justify-content-between mb-4">
    <h4 class="fw-bold mb-0">{{ $editing ? 'Edit User' : 'Add User' }}</h4>
    <a href="{{ route('admin.users.index') }}" class="btn btn-outline-secondary">
        <i class="bi bi-arrow-left me-1"></i>Back
    </a>
</div>

@if($errors->any())
<div class="alert alert-danger">
    <div class="fw-semibold mb-1">Please fix the following:</div>
    <ul class="mb-0 small">
        @foreach($errors->all() as $error)<li>{{ $error }}</li>@endforeach
    </ul>
</div>
@endif

<div class="row g-4">
    <div class="col-lg-8">
        <form method="POST" action="{{ $editing ? route('admin.users.update', $user) : route('admin.users.store') }}">
            @csrf
            @if($editing) @method('PUT') @endif

            <div class="card border-0 shadow-sm mb-4">
                <div class="card-header bg-transparent fw-semibold">Account details</div>
                <div class="card-body">
                    <div class="mb-3">
                        <label class="form-label fw-semibold">Full name <span class="text-danger">*</span></label>
                        <input type="text" name="name" class="form-control @error('name') is-invalid @enderror"
                               value="{{ old('name', $user->name) }}" required>
                        @error('name')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-semibold">Email <span class="text-danger">*</span></label>
                        <input type="email" name="email" class="form-control @error('email') is-invalid @enderror"
                               value="{{ old('email', $user->email) }}" required>
                        @error('email')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    @unless($editing)
                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Password <span class="text-danger">*</span></label>
                            <input type="password" name="password" class="form-control @error('password') is-invalid @enderror" required>
                            @error('password')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            <div class="form-text">Minimum 8 characters.</div>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label fw-semibold">Confirm password <span class="text-danger">*</span></label>
                            <input type="password" name="password_confirmation" class="form-control" required>
                        </div>
                    </div>
                    @endunless

                    <div class="form-check form-switch mt-3">
                        <input type="hidden" name="is_active" value="0">
                        <input type="checkbox" class="form-check-input" role="switch" id="is_active"
                               name="is_active" value="1" @checked(old('is_active', $user->is_active ?? true))>
                        <label class="form-check-label" for="is_active">Account active</label>
                        <div class="form-text">Inactive users are blocked at login.</div>
                    </div>
                </div>
            </div>

            <div class="card border-0 shadow-sm mb-4">
                <div class="card-header bg-transparent fw-semibold">Roles <span class="text-danger">*</span></div>
                <div class="card-body">
                    <p class="text-muted small">A user may hold several roles — each one adds its permissions.</p>
                    @foreach($roles as $role)
                    <div class="form-check">
                        <input type="checkbox" class="form-check-input role-check" id="role_{{ $role }}"
                               name="roles[]" value="{{ $role }}"
                               @checked(in_array($role, old('roles', $assigned), true))>
                        <label class="form-check-label" for="role_{{ $role }}">
                            {{ ucwords(str_replace('_', ' ', $role)) }}
                            @if($role === 'superadmin')<span class="badge bg-danger-subtle text-danger ms-1">full access</span>@endif
                        </label>
                    </div>
                    @endforeach
                </div>
            </div>

            <div class="card border-0 shadow-sm mb-4 d-none" id="studentFields">
                <div class="card-header bg-transparent fw-semibold">Student settings</div>
                <div class="card-body">
                    <label class="form-label fw-semibold">Current semester</label>
                    <select name="current_semester_id" class="form-select">
                        <option value="">— Not set —</option>
                        @foreach($semesters as $sem)
                        <option value="{{ $sem->id }}"
                            @selected(old('current_semester_id', $user->studentProfile->current_semester_id ?? null) == $sem->id)>
                            {{ $sem->name }}
                        </option>
                        @endforeach
                    </select>
                    <div class="form-text">A student profile is created automatically if one does not exist.</div>
                </div>
            </div>

            <button class="btn btn-primary">
                <i class="bi bi-check-lg me-1"></i>{{ $editing ? 'Save changes' : 'Create user' }}
            </button>
        </form>
    </div>

    @if($editing)
    <div class="col-lg-4">
        @can('users.password')
        <div class="card border-0 shadow-sm mb-4">
            <div class="card-header bg-transparent fw-semibold">Reset password</div>
            <div class="card-body">
                <form method="POST" action="{{ route('admin.users.password', $user) }}">
                    @csrf @method('PUT')
                    <div class="mb-2">
                        <label class="form-label small fw-semibold">New password</label>
                        <input type="password" name="password" class="form-control form-control-sm" required minlength="8">
                    </div>
                    <div class="mb-3">
                        <label class="form-label small fw-semibold">Confirm</label>
                        <input type="password" name="password_confirmation" class="form-control form-control-sm" required minlength="8">
                    </div>
                    <button class="btn btn-sm btn-outline-danger w-100"
                            onclick="return confirm('Set a new password for {{ $user->name }}?')">
                        <i class="bi bi-key me-1"></i>Set password
                    </button>
                </form>
            </div>
        </div>
        @endcan

        @can('users.impersonate')
        @unless($user->is(auth()->user()))
        <div class="card border-0 shadow-sm mb-4">
            <div class="card-header bg-transparent fw-semibold">View as this user</div>
            <div class="card-body">
                <p class="text-muted small">
                    Sign in as {{ $user->name }} to see exactly what they see. A banner stays on
                    screen so you can return to your own account at any time.
                </p>
                @if($user->is_active)
                <form method="POST" action="{{ route('admin.users.impersonate', $user) }}">
                    @csrf
                    <button class="btn btn-sm btn-outline-warning w-100">
                        <i class="bi bi-eye me-1"></i>View as {{ Str::limit($user->name, 18) }}
                    </button>
                </form>
                @else
                <div class="alert alert-secondary py-2 small mb-0">
                    This account is inactive. Activate it first to view as this user.
                </div>
                @endif
            </div>
        </div>
        @endunless
        @endcan

        <div class="card border-0 shadow-sm">
            <div class="card-header bg-transparent fw-semibold">Account</div>
            <ul class="list-group list-group-flush small">
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-muted">Created</span><span>{{ $user->created_at?->format('d M Y') }}</span>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-muted">Google linked</span>
                    <span>{{ $user->google_id ? 'Yes' : 'No' }}</span>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span class="text-muted">Status</span>
                    <span class="badge bg-{{ $user->is_active ? 'success' : 'danger' }}">{{ $user->is_active ? 'Active' : 'Inactive' }}</span>
                </li>
            </ul>
        </div>
    </div>
    @endif
</div>

@push('scripts')
<script>
    (function () {
        const studentBox = document.getElementById('studentFields');
        const studentRole = document.getElementById('role_student');

        function sync() {
            if (studentBox) studentBox.classList.toggle('d-none', !studentRole?.checked);
        }

        document.querySelectorAll('.role-check').forEach(c => c.addEventListener('change', sync));
        sync();
    })();
</script>
@endpush
@endsection