@extends('layouts.app')

@section('content')
<div class="page-wrapper">
    <div class="page-content">
        <h6 class="mb-0 text-uppercase">Settings</h6>
        <hr class="border-top" />

        <div class="row row-cols-1 row-cols-md-3 row-cols-lg-3 row-cols-xl-3 g-3">
            <div class="col">
                <div class="card h-100 border">
                    <div class="card-body">
                        <span class="d-inline-flex align-items-center justify-content-center bg-light-success text-success rounded-3 mb-3" style="width: 42px; height: 42px; font-size: 20px;">
                            <i class="bx bx-cog"></i>
                        </span>
                        <h5 class="card-title">General Setting</h5>
                        <p class="card-text">Open and manage all settings where type is <code>general</code>.</p>
                        <a href="{{ route('settings.general') }}" class="btn btn-success">Open General Settings</a>
                    </div>
                </div>
            </div>

            <div class="col">
                <div class="card h-100 border">
                    <div class="card-body">
                        <span class="d-inline-flex align-items-center justify-content-center bg-light-primary text-primary rounded-3 mb-3" style="width: 42px; height: 42px; font-size: 20px;">
                            <i class="bx bx-calendar-check"></i>
                        </span>
                        <h5 class="card-title">Booking Settings</h5>
                        <p class="card-text">Open and manage all booking-related settings.</p>
                        <a href="{{ route('settings.booking') }}" class="btn btn-primary">Open Booking Settings</a>
                    </div>
                </div>
            </div>

            <div class="col">
                <div class="card h-100 border">
                    <div class="card-body">
                        <span class="d-inline-flex align-items-center justify-content-center bg-light-warning text-warning rounded-3 mb-3" style="width: 42px; height: 42px; font-size: 20px;">
                            <i class="bx bx-lock-alt"></i>
                        </span>
                        <h5 class="card-title">Auth Settings</h5>
                        <p class="card-text">Open and manage authentication-related settings.</p>
                        <a href="{{ route('settings.auth') }}" class="btn btn-warning">Open Auth Settings</a>
                    </div>
                </div>
            </div>

            <div class="col">
                <div class="card h-100 border">
                    <div class="card-body">
                        <span class="d-inline-flex align-items-center justify-content-center bg-light-info text-info rounded-3 mb-3" style="width: 42px; height: 42px; font-size: 20px;">
                            <i class="bx bx-shield"></i>
                        </span>
                        <h5 class="card-title">Security Settings</h5>
                        <p class="card-text">Open and manage KYC and panic button controls.</p>
                        <a href="{{ route('settings.security') }}" class="btn btn-info">Open Security Settings</a>
                    </div>
                </div>
            </div>

            <div class="col">
                <div class="card h-100 border">
                    <div class="card-body">
                        <span class="d-inline-flex align-items-center justify-content-center bg-light-danger text-danger rounded-3 mb-3" style="width: 42px; height: 42px; font-size: 20px;">
                            <i class="bx bx-wallet"></i>
                        </span>
                        <h5 class="card-title">Payment Settings</h5>
                        <p class="card-text">Open and manage all payment-related settings.</p>
                        <a href="{{ route('settings.payment') }}" class="btn btn-danger">Open Payment Settings</a>
                    </div>
                </div>
            </div>

            <div class="col">
                <div class="card h-100 border">
                    <div class="card-body">
                        <span class="d-inline-flex align-items-center justify-content-center bg-light-secondary text-secondary rounded-3 mb-3" style="width: 42px; height: 42px; font-size: 20px;">
                            <i class="bx bx-world"></i>
                        </span>
                        <h5 class="card-title">Auto Translate Settings</h5>
                        <p class="card-text">Configure auto translate on create/update and default locale.</p>
                        <a href="{{ route('settings.auto_translate') }}" class="btn btn-secondary">Open Auto Translate</a>
                    </div>
                </div>
            </div>

            <div class="col">
                <div class="card h-100 border">
                    <div class="card-body">
                        <span class="d-inline-flex align-items-center justify-content-center bg-light-dark text-dark rounded-3 mb-3" style="width: 42px; height: 42px; font-size: 20px;">
                            <i class="bx bx-user-check"></i>
                        </span>
                        <h5 class="card-title">Partner Settings</h5>
                        <p class="card-text">Open and manage partner-related rules and settings.</p>
                        <a href="{{ route('settings.partner') }}" class="btn btn-dark">Open Partner Settings</a>
                    </div>
                </div>
            </div>

            <div class="col">
                <div class="card h-100 border">
                    <div class="card-body">
                        <span class="d-inline-flex align-items-center justify-content-center bg-light-primary text-primary rounded-3 mb-3" style="width: 42px; height: 42px; font-size: 20px;">
                            <i class="bx bx-server"></i>
                        </span>
                        <h5 class="card-title">System Settings</h5>
                        <p class="card-text">Manage system limits, file upload sizes, and settings.</p>
                        <a href="{{ route('settings.system') }}" class="btn btn-primary">Open System Settings</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection