@extends('Admin.layout')
@section('content')
<div class="card p-5">
    <div class="form-section">
        <h3>Alarm</h3>
        <form id="groupForm">
            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="stateName"> Alarm</label>
                    <input type="text" class="form-control" id="stateName" placeholder="Enter alarm">
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="stateLogo">Logo</label>
                    <input type="file" class="form-control" id="stateLogo">
                </div>

                <div class="col-lg-4 mb-2">
                    <label class="form-label">State</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Special Community</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Religion</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Service Type</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Package List</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Live Video Record</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Watermark</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Member Qty</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Wishes</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Invite Request For Group</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Message Viewed</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Public Creation</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Group Verification</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Image Verification</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Keyword</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Auto Mapping</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Request</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Join</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Add Group</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Web Login</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
                <div class="col-lg-4 mb-2">
                    <label class="form-label">Status(on/off)</label>
                    <select class="form-select">
                        <option>Select</option>
                    </select>
                </div>
            </div>
            <div class="form-actions mt-4">
                <button type="button" class="btn btn-primary me-3" data-bs-toggle="modal"
                    data-bs-target="#basicModal">Create Alarm</button>
                <button type="reset" class="btn btn-secondary">Discard</button>
            </div>
        </form>
    </div>
    <div class="modal fade" id="basicModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-md modal-dialog-centered">
            <div class="modal-content  rounded-4 text-center p-4 py-5">

                <h5 class="fw-bold mb-2">Are you sure!!</h5>
                <p class="text-muted">Are you confirm to submit ?</p>
                <div class="d-flex justify-content-center align-items-center gap-3 mt-4">
                    <button type="button" class="btn btn-outline-primary py-4 fw-semibold w-25 me-3"
                        data-bs-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-primary py-4 fw-semibold w-25">Yes,Sure</button>

                </div>
            </div>
        </div>
    </div>
</div>
@endsection