@extends('admin.settings.layout')

@section('settings-content')
<div class="card border-0 shadow-sm">
    <div class="card-body p-4">
        <form action="{{ route('admin.settings.update', 'notification') }}" method="POST">
            @csrf
            
            <h5 class="fw-bold text-primary mb-4">Channel Toggles</h5>
            <div class="row g-4">
                <div class="col-md-4">
                    <div class="card border p-3 border-light bg-light text-center">
                        <i class="bi bi-envelope-check display-6 text-primary mb-2"></i>
                        <div class="form-check form-switch d-inline-block">
                             <input class="form-check-input" type="checkbox" name="email_notif_enabled" id="nEmail" value="1" {{ setting_checked('email_notif_enabled', true) }}>
                             <label class="form-check-label fw-bold" for="nEmail">Email Alerts</label>
                        </div>
                    </div>
                </div>

                <div class="col-md-4">
                    <div class="card border p-3 border-light bg-light text-center">
                        <i class="bi bi-chat-dots display-6 text-success mb-2"></i>
                        <div class="form-check form-switch d-inline-block">
                             <input class="form-check-input" type="checkbox" name="sms_notif_enabled" id="nSms" value="1" {{ setting_checked('sms_notif_enabled', true) }}>
                             <label class="form-check-label fw-bold" for="nSms">SMS Alerts</label>
                        </div>
                    </div>
                </div>

                <div class="col-md-4">
                    <div class="card border p-3 border-light bg-light text-center">
                        <i class="bi bi-bell-fill display-6 text-warning mb-2"></i>
                        <div class="form-check form-switch d-inline-block">
                             <input class="form-check-input" type="checkbox" name="push_notif_enabled" id="nPush" value="1" {{ setting_checked('push_notif_enabled', true) }}>
                             <label class="form-check-label fw-bold" for="nPush">Web Push</label>
                        </div>
                    </div>
                </div>
            </div>

            <hr class="my-5">

            <h5 class="fw-bold text-primary mb-4">Alert Recipient Preferences</h5>
            <div class="row g-3">
                <div class="col-md-12">
                     <h6>User Events</h6>
                     <div class="form-check">
                         <input class="form-check-input" type="checkbox" name="notify_order_placed" value="1" {{ setting_checked('notify_order_placed', true) }}>
                         <label class="form-check-label">Notify customer on order placement</label>
                     </div>
                     <div class="form-check">
                         <input class="form-check-input" type="checkbox" name="notify_order_shipped" value="1" {{ setting_checked('notify_order_shipped', true) }}>
                         <label class="form-check-label">Notify customer on order status update</label>
                     </div>
                </div>

                <div class="col-md-12 mt-4">
                     <h6>Admin & Vendor Events</h6>
                     <div class="form-check">
                         <input class="form-check-input" type="checkbox" name="admin_notify_new_order" value="1" {{ setting_checked('admin_notify_new_order', true) }}>
                         <label class="form-check-label">Notify Admin on new order</label>
                     </div>
                     <div class="form-check">
                         <input class="form-check-input" type="checkbox" name="vendor_notify_new_order" value="1" {{ setting_checked('vendor_notify_new_order', true) }}>
                         <label class="form-check-label">Notify Vendor on new order</label>
                     </div>
                </div>
            </div>

            <div class="mt-5 border-top pt-4">
                <button type="submit" class="btn btn-primary px-5 fw-bold shadow-sm">
                    <i class="bi bi-save me-1"></i> Save Preferences
                </button>
            </div>
        </form>
    </div>
</div>
@endsection