@extends('tenant.layouts.master')

@section('style')
    <link rel="stylesheet" href="{{ asset('css/accounting/main.css') }}">
@endsection

@section('breadcrumb')
    @include('tenant.layouts.breadcrumb', [
        'items' => [
            __('breadcrumb.home') => '/',
            __('breadcrumb.accounting') => '#',
        ],
    ])
@endsection

@section('sidebar')
    @include('tenant.layouts.sidebar', ['activeItem' => 'accounting'])
@endsection

@section('content')
    <div>
        <h2 class="text-center my-5"> @lang('accounting/show.account_sections')</h2>

        <div class="d-flex flex-row flex-wrap justify-content-around">
            <div class="col-6 col-sm-5 col-lg-3 my-4 mx-3 item">
                <a href="{{ route('tenant.accounting.accounts.index') }}"
                    class="d-flex flex-column justify-content-center align-items-center text-decoration-none w-100 h-100 rounded-3 shadow-lg">
                    <h3> @lang('accounting/show.general_ledger_index')</h3>
                    <img src="{{ asset('images/accounting/accounts-tree-card.png') }}" alt="receivables">
                </a>
            </div>

            <div class="col-6 col-sm-5 col-lg-3 my-4 mx-3 item">
                <a href="{{ route('tenant.receivables.index', ['module' => 'accounting']) }}"
                    class="d-flex flex-column justify-content-center align-items-center text-decoration-none w-100 h-100 rounded-3 shadow-lg">
                    <h3>@lang('accounting/show.receivables')</h3>
                    <img src="{{ asset('images/accounting/receivable-card.png') }}" alt="receivables">
                </a>
            </div>

            <div class="col-6 col-sm-5 col-lg-3 my-4 mx-3 item">
                <a href="{{ route('tenant.accounting.entries.index') }}"
                    class="d-flex flex-column justify-content-center align-items-center text-decoration-none w-100 h-100 rounded-3 shadow-lg">
                    <h3>@lang('accounting/show.entries')</h3>
                    <img src="{{ asset('images/accounting/entry-card.png') }}" alt="receivables">
                </a>
            </div>

            <div class="col-6 col-sm-5 col-lg-3 my-4 mx-3 item">
                <a href="{{ route('tenant.accounting.receipts.index') }}"
                    class="d-flex flex-column justify-content-center align-items-center text-decoration-none w-100 h-100 rounded-3 shadow-lg">
                    <h3>@lang('accounting/show.receipts')</h3>
                    <img src="{{ asset('images/accounting/receipt-card.png') }}" alt="receivables">
                </a>
            </div>

            <div class="col-6 col-sm-5 col-lg-3 my-4 mx-3 item">
                <a href="{{ route('tenant.accounting.exchanges.index') }}"
                    class="d-flex flex-column justify-content-center align-items-center text-decoration-none w-100 h-100 rounded-3 shadow-lg">
                    <h3>@lang('accounting/show.exchange')</h3>
                    <img src="{{ asset('images/accounting/exchange-card.png') }}" alt="receivables">
                </a>
            </div>

            <div class="col-6 col-sm-5 col-lg-3 my-4 mx-3 item">
                <a href="{{ route('tenant.accounting.services-invoices.index') }}"
                    class="d-flex flex-column justify-content-center align-items-center text-decoration-none w-100 h-100 rounded-3 shadow-lg">
                    <h3>@lang('accounting/show.service_invoices')</h3>
                    <img src="{{ asset('images/accounting/invoice-card.png') }}" alt="receivables">
                </a>
            </div>

            <div class="col-6 col-sm-5 col-lg-3 my-4 mx-3 item">
                <a href="{{ route('tenant.accounting.returned-services-bonds.index') }}"
                    class="d-flex flex-column justify-content-center align-items-center text-decoration-none w-100 h-100 rounded-3 shadow-lg">
                    <h3>@lang('accounting/show.returned_service_bonds')</h3>
                    <img src="{{ asset('images/accounting/invoice-card.png') }}" alt="receivables">
                </a>
            </div>
        </div>
    </div>
@endsection