1<x-card title="Personal Information">
 2    <x-errors class="mb-4" />
 3 
 4    <div class="grid grid-cols-1 sm:grid-cols-2 gap-6">
 5        <x-input label="First Name" placeholder="First Name" wire:model.defer="user.first_name" />
 6        <x-input label="Last Name"  placeholder="Last Name" wire:model.defer="user.last_name" />
 7 
 8        <div class="col-span-1 sm:col-span-2 sm:grid sm:grid-cols-7 sm:gap-5">
 9            <div class="col-span-1 sm:col-span-4">
10                <x-input label="Email" placeholder="[email protected]" wire:model.defer="user.email" />
11            </div>
12 
13            <div class="col-span-1 sm:col-span-3">
14                <x-inputs.phone label="Phone" placeholder="Phone" wire:model.defer="user.phone" />
15            </div>
16        </div>
17 
18        <x-select
19            label="Country"
20            placeholder="Country"
21            wire:model.defer="user.country"
22            :options="$this->countries()"
23        />
24 
25        <x-datetime-picker label="Birthdate" placeholder="Birthdate" wire:model.defer="user.birthdate" />
26 
27        <div class="col-span-1 sm:col-span-2">
28            <x-input label="Street Address" placeholder="Street Address" wire:model.defer="user.street" />
29        </div>
30 
31        <div class="col-span-1 sm:col-span-2 sm:grid sm:grid-cols-3 sm:gap-6">
32            <x-input label="City" placeholder="City" wire:model.defer="user.city" />
33            <x-input label="State" placeholder="State" wire:model.defer="user.state" />
34            <x-input label="Postal Code" placeholder="Postal Code" wire:model.defer="user.postal_code" />
35        </div>
36 
37        <x-toggle label="Accept the terms and conditions" wire:model.defer="user.terms" />
38    </div>
39 
40    <x-slot name="footer">
41        <div class="flex items-center gap-x-3 justify-end">
42            <x-button wire:click="cancel" label="Cancel" flat />
43            <x-button wire:click="save" label="Save" spinner="save" primary />
44        </div>
45    </x-slot>
46</x-card>