@push('head')
@endpush

<div class="container-fluid ppt4">


    <div class="d-block bg-theme-box rounded p-3 mb-3">
        <h4 class="">Appearance Settings</h4>

        <div class="page-title-right">
            <ol class="breadcrumb m-0">
                <li class="breadcrumb-item">Settings</li>
                <li class="breadcrumb-item active">Appearance</li>
            </ol>
        </div>
    </div>

    <div class="d-block bg-theme-box rounded p-3 mb-3">
        <p class="fw-bold fs-4">
            <i class="fad fa-palette"></i>
            <span class="ms-2">Tema dashbaord</span>
        </p>
        <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Eligendi laborum similique odio quos saepe
            debitis animi alias quo, architecto, perspiciatis, ea cum nostrum aut deleniti atque libero ratione
            aliquid praesentium.</p>
        <div class="d-flex align-items-center justify-content-between bg-theme-box-secondary rounded p-3">
            <label for="tema" class="form-label fw-bold m-0">Tema aplikasi</label>
            <select name="themes" class="form-select" style="width: 200px" wire:model.live="theme">
                <option value="light">Light</option>
                <option value="dark">Dark</option>
                <option value="system">System</option>
            </select>
        </div>
    </div>
</div>

@push('script')
@endpush