@extends('layouts.home.index')
@section('title','Profil')
@include('profil-user._js.index')

@section('content')

@push('style')
    <style>
        .banner img {
            object-fit: cover !important;
            width: 100% !important;
        }

        .date {
            color: #085f94 !important;
        }

        .description {
            color: #000 !important;
        }
    </style>
@endpush

<div class="container">

    <div class="news">

        <div class="">
            <h1 class="section-title"><span>Profil</span></h1>
        </div>
        
        <div class="row mb-3">
            <div class="col-md-6">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Nama <span class="text-danger">*</span></label>
                    <input type="text" name="name" class="form-control">
                </div>
            </div>
            <div class="col-md-6">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Email <span class="text-danger">*</span></label>
                    <input type="email" name="email" class="form-control">
                </div>
            </div>
            <div class="col-md-4">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Instansi <span class="text-danger">*</span></label>
                    <input type="text" name="agency" class="form-control">
                </div>
            </div>
            <div class="col-md-4">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">No. Telepon <span class="text-danger">*</span></label>
                    <input type="number" name="phone" class="form-control">
                </div>
            </div>
            <div class="col-md-4">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">No. Fax</label>
                    <input type="text" name="fax" class="form-control">
                </div>
            </div>
            <div class="col-md-6">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Password </label>
                    <input type="password" name="password" class="form-control">
                </div>
            </div>
            <div class="col-md-6">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Konfirmasi Password </label>
                    <input type="password" name="password_confirmation" class="form-control">
                </div>
            </div>
            <div class="col-md-12">
                <div class="mb-3">
                    <label for="" class="mb-1 fw-semibold">Alamat <span class="text-danger">*</span></label>
                    <textarea name="address" rows="2" class="form-control" id="description-user"></textarea>
                </div>
            </div>
        </div>
        <div class="text-end">
            <button class="btn btn-success rounded btn-sm btn-update"><i class="fa-solid fa-floppy-disk"></i> Simpan</button>
            <a href="{{ route('home')}}" class="btn btn-danger rounded btn-sm"><i class="fa-solid fa-xmark"></i> Batalkan</a>
        </div>

    </div>

</div>

@endsection