@extends('layouts.master', ['hide_sidebar' => 'ok'])

@section('title', 'title')

@section('titlePageHeading', '') 
@section('content') 
<style>
    ._top-bar {
    display: none !important;
}
._content {
    padding: 10px 10px 10px 10px;
}
#wrapper #content-wrapper {
    background-color: #ffffff;
}
</style>
<link rel='stylesheet' href='/assets/css/styles.css?v=20'>

<div class="partigau">
        <div class="part2">
            <div class="infocl">
                <div class="codecl">Code client</div>
                <div class="codecl1">ABC01245</div>
            </div>

            <div class="infocl">
                <div class="codecl">Client</div>
                <div class="codecl1">Said SAidi</div>
            </div>


            <div class="infocl">
                <div class="codecl">Canal</div>
                <div class="codecl1">Superette</div>
            </div>


            <div class="infocl">
                <div class="codecl">Ville</div>
                <div class="codecl1">Casablanca</div>
            </div>


            <div class="infocl">
                <div class="codecl">Téléphone</div>
                <div class="codecl1">0661 33 43 93</div>
            </div>


            <div class="infocl">
                <div class="codecl">Statut</div>
                <div class="codecl1">Actif</div>
            </div>


            <div class="clr"></div>
        </div>

        <div class="clr"></div>
        <div class="parts2">

            <div class="menu1">
                <div class="imagemenu">
                     <img src="/assets/images/r1.png" class="r1"></div>
                <div class="r1txt">Boulangerie</div>
            </div>

            <div class="menu2">
                <div class="imagemenu">
                     <img src="/assets/images/r2.png" class="r1"></div>
                <div class="r2txt">Viennoiserie</div>
            </div>

            <div class="menu2">
                <div class="imagemenu">
                     <img src="/assets/images/r3.png" class="r1"></div>
                <div class="r2txt">Pâtisserie</div>
            </div>

            <div class="menu2">
                <div class="imagemenu">
                     <img src="/assets/images/r4.png" class="r1"></div>
                <div class="r2txt">Snaking</div>
            </div>


            <div class="xotak5">
                <div class="textlilxi">Rechercher par paroduits</div>
                <input class="datelil2i" type="text" placeholder="ex : Flûte semoule, Macron, ...">
            </div>

            <div class="menu9">
                <div class="imagexmenu">
                     <img src="/assets/images/liste-a-puces.png" class="r1"></div>
            </div>
            <div class="activeb menu9">
                <div class="imagexmenu">
                     <img src="/assets/images/tile.png" class="r1"></div>
            </div>


            <div class="clr"></div>
            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p01.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="disposi"> <img src="/assets/images/box2.png" class="box2">Dispo : 15</div>
                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>



            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p02.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="disposi"> <img src="/assets/images/box2.png" class="box2">Dispo : 15</div>
                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>




            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p03.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="disposi"> <img src="/assets/images/box2.png" class="box2">Dispo : 15</div>
                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>


            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p04.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="disposi"> <img src="/assets/images/box2.png" class="box2">Dispo : 15</div>
                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>


            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p05.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>



            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p06.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>

            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p01.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="disposi"> <img src="/assets/images/box2.png" class="box2">Dispo : 15</div>
                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>



            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p02.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="disposi"> <img src="/assets/images/box2.png" class="box2">Dispo : 15</div>
                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>




            <div class="backyello">
                <div class="backyello2">
                     <img src="/assets/images/p03.png" class="image36">

                    <div class="titlo1">PFU000386</div>
                    <div class="titlo2">Mini pain au chocolat</div>
                    <div class="igramme">60g</div>
                    <div class="igramme">80 U/C</div>
                    <div class="clr"></div>
                    <div class="igramme2">Pré poussé</div>

                    <div class="disposi"> <img src="/assets/images/box2.png" class="box2">Dispo : 15</div>
                    <div class="hab25"> <img src="/assets/images/pic37.png" class="image37">Hab : 25</div>
                </div>

                <div class="clr"></div>
                <div class="linshop"></div>
                <div class="clr"></div>
                <div class="partla1">
                    <div class="pricela2">P.U : 3.5 Dh</div>
                    <div class="price1fs">119<span>.00 Dh</span></div>

                    <div class="clr"></div>
                </div>
                <div class="pluscart">+</div>
                <div class="">

                </div>


                <div class="clr"></div>
            </div>




        </div>
    </div>




    <div class="partidro">
        <div class="part1">
            <div class="part02">
                <div class="titra">Suivi Objectif</div>
            </div>


            <div class="halfpart">
                 <img src="/assets/images/pic20.png" class="pic20">
                <div class="textboul">Boulangerie</div>
                <div class="backbleu">
                    <div class="pikiop">
                        <div class="clr"></div>
                        <div class="txtl">Mn</div>
                        <div class="txtl2">Id</div>
                        <div class="txtl3">Mx</div>
                        <div class="clr"></div>
                        <div class="">
                            <div class="araysi" style="">
                                <div class="progress progress-striped active">
                                    <div role="progressbar " style="width: 30%;" class="progress-bar progress-bar-danger"></div>
                                </div>
                            </div>
                            <div class="clr"></div>
                        </div>
                        <div class="clr"></div>
                        <div class="txtl01">Nt</div>
                        <div class="txtl02">18</div>
                        <div class="txtl03">30</div>
                        <div class="clr"></div>
                    </div>
                     <img src="/assets/images/pic21.png" class="pic21">
                    <div class="clr"></div>
                </div>

                <div class="clr"></div>
            </div>



            <div class="halfpart2">
                 <img src="/assets/images/pic22.png" class="pic20">
                <div class="textboul">Viennoiserie</div>
                <div class="backbleu">
                    <div class="pikiop">
                        <div class="clr"></div>
                        <div class="txtl">Mn</div>
                        <div class="txtl2">Id</div>
                        <div class="txtl3">Mx</div>
                        <div class="clr"></div>
                        <div class="">
                            <div class="araysi" style="">
                                <div class="progress progress-striped active">
                                    <div role="progressbar " style="width: 70%;" class="progress-bar progress-bar-success"></div>
                                </div>
                            </div>
                            <div class="clr"></div>
                        </div>
                        <div class="clr"></div>
                        <div class="txtl01">Nt</div>
                        <div class="txtl02">18</div>
                        <div class="txtl03">30</div>
                        <div class="clr"></div>
                    </div>
                     <img src="/assets/images/pic21.png" class="pic21">
                    <div class="clr"></div>
                </div>
                <div class="clr"></div>
                <div class="clr"></div>
            </div>

            <div class="clr"></div>



            <div class="halfparts2">
                <div class="textboul">Min CA</div>
                <div class="backbleuxs">
                    <div class="pikiop">
                        <div class="clr"></div>

                        <div class="clr"></div>
                        <div class="">
                            <div class="araysi" style="">
                                <div class="progress progress-striped active">
                                    <div role="progressbar " style="width: 20%;" class="progress-bar progress-bar-danger"></div>
                                </div>
                            </div>
                            <div class="clr"></div>
                        </div>
                        <div class="clr"></div>

                        <div class="txtl03ss">2000 Dh</div>
                        <div class="clr"></div>
                    </div>
                     <img src="/assets/images/pic21.png" class="pic2xs1">
                    <div class="clr"></div>
                </div>

                <div class="clr"></div>
            </div>



            <div class="halfparts2">
                <div class="textboul">Min SKU</div>
                <div class="backbleuxs">
                    <div class="pikiop">
                        <div class="clr"></div>

                        <div class="clr"></div>
                        <div class="">
                            <div class="araysi" style="">
                                <div class="progress progress-striped active">
                                    <div role="progressbar " style="width: 70%;" class="progress-bar progress-bar-success"></div>
                                </div>
                            </div>
                            <div class="clr"></div>
                        </div>
                        <div class="clr"></div>

                        <div class="txtl03ss">10 Sku</div>
                        <div class="clr"></div>
                    </div>
                     <img src="/assets/images/pic21.png" class="pic2xs1">
                    <div class="clr"></div>
                </div>
                <div class="clr"></div>
                <div class="clr"></div>
            </div>


            <div class="halfparts3">
                <div class="textboul">CA objectif</div>
                <div class="backbleuxs">
                    <div class="pikiop">
                        <div class="clr"></div>

                        <div class="clr"></div>
                        <div class="">
                            <div class="araysi" style="">
                                <div class="progress progress-striped active">
                                    <div role="progressbar " style="width: 70%;" class="progress-bar progress-bar-warning"></div>
                                </div>
                            </div>
                            <div class="clr"></div>
                        </div>
                        <div class="clr"></div>

                        <div class="txtl03ss">10 000 Dh</div>
                        <div class="clr"></div>
                    </div>
                     <img src="/assets/images/pic21.png" class="pic2xs1">
                    <div class="clr"></div>
                </div>
                <div class="clr"></div>
                <div class="clr"></div>
            </div>


            <div class="clr"></div>
        </div>
        <div class="clr"></div>
        <div class="parts1">
            <div class="titpanie">Panier</div>
            <div class="men1">
                 <img src="/assets/images/f3.png" class="pics20">

            </div>
            <div class="men1">
                 <img src="/assets/images/f2.png" class="pics20">

            </div>
            <div class="activeb men1">
                 <img src="/assets/images/f1-ac.png" class="pics20">

            </div>
            <div class="clr"></div>
        </div>

        <div class="clr"></div>
        <div class="parts3">
             <img src="/assets/images/d1.png" class="pd120">
            <div class="titpanie2">Boulangerie</div>
            <div class="clr"></div>
            <div class="lignou"></div>

            <div class="dep1">
                 <img src="/assets/images/p1.png" class="imagio">
                <div class="righto">
                    <div class="pr1">PFU000386</div>
                    <div class="pr2">Flûte semoule</div>
                </div>
                <div class="righto2">
                    <div class="number-input">
                        <button onclick="this.parentNode.querySelector('input[type=number]').stepDown()"></button>
                        <input class="quantity" min="0" name="quantity" value="1" type="number">
                        <button onclick="this.parentNode.querySelector('input[type=number]').stepUp()" class="plus"></button>
                    </div>
                </div>

                <div class="righto3">
                    <div class="price1">172 Dh</div>
                    <div class="price2">502 Dh</div>
                </div>
                <div class="righto4">
                     <img src="/assets/images/marque-de-croix.png" class="trash">
                </div>
                <div class="clr"></div>
            </div>
            <div class="clr"></div>
            <div class="dep1">
                 <img src="/assets/images/p2.png" class="imagio">
                <div class="righto">
                    <div class="pr1">PFU000386</div>
                    <div class="pr2">Flûte semoule</div>
                </div>
                <div class="righto2">
                    <div class="number-input">
                        <button onclick="this.parentNode.querySelector('input[type=number]').stepDown()"></button>
                        <input class="quantity" min="0" name="quantity" value="1" type="number">
                        <button onclick="this.parentNode.querySelector('input[type=number]').stepUp()" class="plus"></button>
                    </div>
                </div>

                <div class="righto3">
                    <div class="price1">172 Dh</div>
                    <div class="price2">502 Dh</div>
                </div>
                <div class="righto4">
                     <img src="/assets/images/marque-de-croix.png" class="trash">
                </div>
                <div class="clr"></div>
            </div>
            <div class="clr"></div>
            <div class="btnsug">Compléter DN</div>
            <div class="total">Total Boulangerie</div>
             <img src="/assets/images/pw1.png" class="pw1">

            <div class="total2">1004 Dh</div>

            <div class="clr"></div>
            <div class="parti002">
                 <img src="/assets/images/d1.png" class="pd120">
                <div class="titpanie2">Boulangerie</div>
                <div class="clr"></div>
                <div class="lignou"></div>

                <div class="dep1">
                     <img src="/assets/images/p1.png" class="imagio">
                    <div class="righto">
                        <div class="pr1">PFU000386</div>
                        <div class="pr2">Flûte semoule</div>
                    </div>
                    <div class="righto2">
                        <div class="number-input">
                            <button onclick="this.parentNode.querySelector('input[type=number]').stepDown()"></button>
                            <input class="quantity" min="0" name="quantity" value="1" type="number">
                            <button onclick="this.parentNode.querySelector('input[type=number]').stepUp()" class="plus"></button>
                        </div>
                    </div>

                    <div class="righto3">
                        <div class="price1">172 Dh</div>
                        <div class="price2">502 Dh</div>
                    </div>
                    <div class="righto4">
                         <img src="/assets/images/marque-de-croix.png" class="trash">
                    </div>
                    <div class="clr"></div>
                </div>
                <div class="clr"></div>
                <div class="dep1">
                     <img src="/assets/images/p2.png" class="imagio">
                    <div class="righto">
                        <div class="pr1">PFU000386</div>
                        <div class="pr2">Flûte semoule</div>
                    </div>
                    <div class="righto2">
                        <div class="number-input">
                            <button onclick="this.parentNode.querySelector('input[type=number]').stepDown()"></button>
                            <input class="quantity" min="0" name="quantity" value="1" type="number">
                            <button onclick="this.parentNode.querySelector('input[type=number]').stepUp()" class="plus"></button>
                        </div>
                    </div>

                    <div class="righto3">
                        <div class="price1">172 Dh</div>
                        <div class="price2">502 Dh</div>
                    </div>
                    <div class="righto4">
                         <img src="/assets/images/marque-de-croix.png" class="trash">
                    </div>
                    <div class="clr"></div>
                </div>
                <div class="clr"></div>
                <div class="btnsug">Compléter DN</div>
                <div class="total">Total Boulangerie</div>
                 <img src="/assets/images/pw1.png" class="pw1">

                <div class="total2">1004 Dh</div>


            </div>
            <div class="clr"></div>
            <div class="parti002">
                 <img src="/assets/images/d1.png" class="pd120">
                <div class="titpanie2">Boulangerie</div>
                <div class="clr"></div>
                <div class="lignou"></div>

                <div class="dep1">
                     <img src="/assets/images/p1.png" class="imagio">
                    <div class="righto">
                        <div class="pr1">PFU000386</div>
                        <div class="pr2">Flûte semoule</div>
                    </div>
                    <div class="righto2">
                        <div class="number-input">
                            <button onclick="this.parentNode.querySelector('input[type=number]').stepDown()"></button>
                            <input class="quantity" min="0" name="quantity" value="1" type="number">
                            <button onclick="this.parentNode.querySelector('input[type=number]').stepUp()" class="plus"></button>
                        </div>
                    </div>

                    <div class="righto3">
                        <div class="price1">172 Dh</div>
                        <div class="price2">502 Dh</div>
                    </div>
                    <div class="righto4">
                         <img src="/assets/images/marque-de-croix.png" class="trash">
                    </div>
                    <div class="clr"></div>
                </div>
                <div class="clr"></div>
                <div class="dep1">
                     <img src="/assets/images/p2.png" class="imagio">
                    <div class="righto">
                        <div class="pr1">PFU000386</div>
                        <div class="pr2">Flûte semoule</div>
                    </div>
                    <div class="righto2">
                        <div class="number-input">
                            <button onclick="this.parentNode.querySelector('input[type=number]').stepDown()"></button>
                            <input class="quantity" min="0" name="quantity" value="1" type="number">
                            <button onclick="this.parentNode.querySelector('input[type=number]').stepUp()" class="plus"></button>
                        </div>
                    </div>

                    <div class="righto3">
                        <div class="price1">172 Dh</div>
                        <div class="price2">502 Dh</div>
                    </div>
                    <div class="righto4">
                         <img src="/assets/images/marque-de-croix.png" class="trash">
                    </div>
                    <div class="clr"></div>
                </div>
                <div class="clr"></div>
                <div class="btnsug">Compléter DN</div>
                <div class="total">Total Boulangerie</div>
                 <img src="/assets/images/pw1.png" class="pw1">

                <div class="total2">1004 Dh</div>


            </div>
        </div>

        <div class="clr"></div>
        <div class="carii">
            <div class="remise"> <img src="/assets/images/discount.png" style="width: 19px;margin: -3px 0 0 0;"class="pictay2">Remise</div>
            <div class="remise"> <img src="/assets/images/documents.png"  style="width: 15px;margin: -3px 0 0 0;" class="pictay2"> Note</div>
            <div class="remise2"> <img src="/assets/images/calculator.png" style="width: 15px;margin: -3px 0 0 0;" class="pictay2"> Calculatrice</div>
            <div class="clr"></div>
        </div>
        <div class="clr"></div>
        <div class="box">
            <dl class="dlist-align">
                <dt class="tax1">Total: </dt>
                <dd class="text-right">1600 Dh</dd>
            </dl>
            <dl class="dlist-align">
                <dt class="tax1">Tva:</dt>
                <dd class="text-right">20%</dd>
            </dl>
            <dl class="dlist-align">
                <dt class="tax1"><b>Total à payer:</b></dt>
                <dd class="text-right" style="font-size: 18px;"><b>2310 Dh</b></dd>
            </dl>

            <div class="row" style="    padding: 10px 0 0px 0;
            margin: 7px 0 0 0;
            border-top: 1px dashed #fff;">
                <div class="totak5">
                    <div class="textlili">Infos livraison</div>
                    <input class="datelili" type="date" id="name" name="name" required minlength="4" maxlength="8" size="10" />
                </div>
                <div class="Batati">Valider </div>

            </div>
        </div>

    </div>





    <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js'></script>

@endsection