@extends('estoque.estoque');

@section('content')
<div class="bg-white max-w-screen max-h-auto max-w-auto mx-auto sm:w-full xl:w-11/12  rounded-lg mt-16 mb-16 pb-8 pt-8">
    <h1 class="text-orangeblack text-lg font-bold flex text-center justify-center m-3 mt-3 mb-3 p-3">Estoque - <span class="text-lg">Fornecedores</span> </h1>

    <div class="rounded-lg mb-10 m-3 sm:p-2 p-1 lg:m-3 flex justify-center">
        <form method="GET" action="" class="bg-gray-200 rounded-lg p-3 max-w-full mx-auto m-0 mt-5 mb-3 sm:grid grid-flow-col">
          
            <input id="codigoBarras" name="codigoBarras" class="bg-gray-50 border border-gray-500 text-blueblack text-sm rounded-lg focus:ring-gray-50 sm:w-5/6 lg:w-auto h-10 w-11/12 p-2 m-2" placeholder="COD. de Barras">
            <input id="codigoSku" name="codigoSku" class="bg-gray-50 border border-gray-500 text-blueblack text-sm rounded-lg focus:ring-gray-50 sm:w-5/6 lg:w-auto w-11/12 p-2 m-2" placeholder="COD. SKU">
            <input id="cnpj" name="cnpj" class=" flex bg-gray-50 border border-gray-500 text-blueblack text-sm rounded-lg focus:ring-gray-50 sm:w-5/6 lg:w-auto w-11/12 p-2 m-2" placeholder="CNPJ">
            <input id="nome" name="nome" class=" flex bg-gray-50 border border-gray-500 text-blueblack text-sm rounded-lg focus:ring-gray-50 sm:w-5/6 lg:w-auto w-11/12 p-2 m-2" placeholder="Razão Social">
            <button type="submit" class="text-white bg-blueblack hover:bg-orangeblack text-base lg:rounded-lg rounded-md p-1 sm:w-5/6 m-2 lg:max-w-28">Pesquisar</button>
        </form>
    </div>

    <div class="relative overflow-x-auto shadow-md rounded m-3">
        <table class="w-full text-sm text-left rtl:text-right text-blueblack">
            <thead class="text-xs text-white  uppercase bg-blueblack rounded-lg">
                <tr>
                    <th scope="col" class="px-4 py-3 text-center">
                        SKU
                    </th>
                    <th scope="col" class="px-4 py-3 text-center">
                        Nome
                    </th>
                    <th scope="col" class="px-4 py-3 text-center">
                        QTD
                    </th>
                    <th scope="col" class="px-4 py-3 text-center">
                        Fornecedor
                    </th>
                    <th scope="col" class="px-4 py-3 text-center">
                       Detalhes
                    </th>
                </tr>
            </thead>
            <tbody>
                    
                <tr class="bg-white border-b hover:bg-gray-200 text-blueblack">
                        
                    <td class="px-6 py-4 text-center  text-base">
                    </td>
                    <td class="px-6 py-4 text-center">
                    </td>
                    <td class="px-6 py-4 text-center">
                    </td>
                    <td class="px-6 py-4 text-center">
                     </td>
                    <td class="px-6 py-4 text-center">
                        <button  id="btnDetalhes" name="btnDetalhes" class="btnDetalhes font-bold text-base bg-blueb hover:bg-blue-900 rounded p-1 text-white" value="" data-id="" data-modal-target="update-modal" data-modal-toggle="update-modal">Detalhes</button>
                    </td>
                </tr>
            
            </tbody>
        </table>
    </div>
</div>
</div> 

@endsection