@extends('layouts.app')
@section('title', $mode === 'create' ? 'Thêm User Mới' : 'Chi tiết User')

@section('content')
<div class="mb-6 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 pl-1">
    <div>
        <h1 class="text-[28px] font-extrabold text-[#1a2b49] flex items-center gap-2 mb-1.5 tracking-tight">
            {{ $mode === 'create' ? 'Thêm User Mới' : 'Chi tiết User' }}
        </h1>
        <p class="text-gray-500 font-medium text-[14px]">
            {{ $mode === 'create' ? 'Tạo tài khoản nhân viên mới và thiết lập các thông tin cơ bản.' : 'Quản lý thông tin thẻ và theo dõi lịch sử nhận gửi của nhân viên.' }}
        </p>
    </div>
</div>

<x-user-page :mode="$mode" :user="$user ?? null" :administrations="$administrations ?? null" :selectedMonth="$selectedMonth ?? null" :addCards="$addCards ?? null" :admins="$admins ?? null" />
@endsection

@push('modals')
    @if($mode === 'edit' && $user)
        <x-confirm-modal id="deleteModal" title="Xác nhận nghỉ việc" confirmText="Xác nhận Nghỉ việc" />
    @endif
@endpush