@extends('admin.layout.master')
@section('content')
<div class="container">
    <div class="row justify-content-between p-1 rounded m-2  bg-light">
        <div class="col-12 col-md-6 align-self-center">
            <a class='text-decoration-none fw-bold  text-dark' href="">
            Home/Order #123434
            </a>
        </div>
        <div class="col-12 col-md-6 align-self-center float-end ">
             <div class='align-self-center  text-center justify-content-center mt-2'>
                <div class="row ">
                 <div class="col-6 offset-6 ">
                    <div class="mb-3 ">
                       <select id=" Select" class="form-select rounded-pill">
                            <option> Status</option>
                            <option> 1</option>
                            <option>2</option>
                        </select>
                        </div>
                    </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="container">
    <div class="row p-2">
        <div class="col-sm-5">
            <div class="card">
                <table class='table table-borderless'>
                    <tr class='t_P_10 '>
                        <td>
                        Ticket ID
                        </td>
                        <td class='text-end text-dark fw-bold'>
                            1234
                        </td>
                    </tr>
                    <tr class='t_P_10'>
                        <td>
                        Customer Name
                        </td>
                        <td class='text-end text-dark fw-bold'>
                            Smit
                        </td>
                    </tr>
                    <tr class='t_P_10'>
                        <td>
                        Type
                        </td>
                        <td class='text-end text-dark fw-bold'>
                        order
                        </td>
                    </tr>
                    <tr class='t_P_10'>
                        <td>
                        Date
                        </td>
                        <td class='text-end text-dark fw-bold'>
                        2021-09-20
                        </td>
                    </tr>
                    <tr class='border-bottom ' style="margin:10px; height:10px"></tr>
                    <!-- this only bottom border  -->
                    <tr class='p-2'>
                        <td>
                        <p class='text-muted mt-2'>Message</p>
                        <p>
                        Cras gravida bibendum dolor eu varius. Morbi fermentum velit nisl, 
                        eget vehicula lorem sodales eget.
                        Donec quis volutpat orci. Sed ipsum felis, tristique id egestas.
                        </p>
                        </td>
                    </tr>
                    <br>
                </table>
            </div>
            <div class="row my-3 p-2">
                <div class="col-sm-4 col-6 p-1">
                    <div>
                        <div>
                            <span class="cros" onclick="this.parentElement.style.display='none';">
                            <i class="bi bi-x-circle-fill"  style='font-size:17px;color:red;'></i>
                            </span>
                            <div class="card">
                            <img src="{{asset('images/user/user_img.png')}}" class='img-fluid' alt="">
                        </div>
                        </div>
                    </div>
                </div> 
                <!-- end col-4  -->
                <div class="col-sm-4  col-6 p-1">
                    <div>
                        <div>
                            <span class="cros" onclick="this.parentElement.style.display='none';">
                            <i class="bi bi-x-circle-fill"  style='font-size:17px;color:red;'></i>
                            </span>
                            <div class="card">
                            <img src="{{asset('images/user/user_img.png')}}" class='img-fluid' alt="">
                        </div>
                        </div>
                    </div>
                </div> 
                <!-- end col-4  -->
                <div class="col-sm-4  col-6 p-1">
                    <div >
                        <div>
                            <span class="cros" onclick="this.parentElement.style.display='none';">
                            <i class="bi bi-x-circle-fill"  style='font-size:17px;color:red;'></i>
                            </span>
                            <div class="card">
                            <img src="{{asset('images/user/user_img.png')}}" class='img-fluid' alt="">
                        </div>
                        </div>
                    </div>
                </div> 
                <!-- end col-4  -->
            </div>
        </div>
        <!-- col-5 ended here  -->
        <div class="col-7">
            chate
        </div>
    </div>
</div>
@endsection