@php($title = 'Контакты')

@extends('layouts.app')
@section('content')
    <div class="">
        <div class=" d-flex gap-2 p-1 flex-row mb-3 sticky-top bg-light rounded-3" method="GET" action="{{ route('clients.table') }}">
            <div class="w-100">
                @livewire('clients.search.input')
            </div>
            <div class="ms-auto p-0 d-none d-md-block">
                <button type="button" class="btn btn-primary h-100 py-2 px-3 fs-5" data-bs-toggle="modal"
                    data-bs-target="#createClientModal">
                    <i class="bi bi-person-plus"></i> <span class="d-inline d-none">Добавить клиента</span>
                </button>
            </div>
            <div class="d-block d-md-none position-fixed bottom-0 end-0 me-3" style="margin-bottom:90px;">
                <button type="button" class="shadow btn btn-primary p-2 fs-3 rounded-pill"
                    style="width:4rem;height:4rem" data-bs-toggle="modal"
                    data-bs-target="#createClientModal">
                    <i class="bi bi-person-plus"></i>
                </button>
            </div>
        </div>
            <div class="fs-5 mb-2">
                @livewire('clientsTable')
            </div>
    </div>

    <!-- Modal -->
    <div class="modal fade" id="createClientModal" tabindex="-1" aria-labelledby="createAgentModalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-scrollable modal-fullscreen-sm-down">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Добавить клиента</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body" style="">
                    <livewire:ClientCreator />
                </div>
            </div>
        </div>
    </div>
@endsection