@extends('layouts.admin.main')
@section('main-section')
<div id="layoutSidenav_content" class=" position-relative d-flex flex-column min-vh-100 justify-content-between flex-grow-1 " style="min-width: 0;">
    <main>
        <nav class="sb-topnav navbar navbar-expand justify-content-between py-3 px-3 px-md-5">
            <div class="order-1 order-lg-0">
                <a class=" me-lg-0 text-dark bg-transparent d-lg-none" id="sidebarToggle" href="#!"><i class="bi bi-justify-right font-20px"></i></a>
            </div>

            <div class="logo-sm d-block d-lg-none">
                <img src="../assets/images/logo.png" alt="" class="width-50 width-md-80" draggable="false" loading="lazy">
            </div>
            <div class="d-none d-lg-block">
                <div class="d-flex align-items-center justify-content-between gap-3 flex-wrap">
                    <h2 class=" font-28px fw-600 m-0">Maintenance Coverage</h2>
                </div>
            </div>
            @include('layouts.admin.adminProfileDropdown')
        </nav>
        <div class="cover-all-content">
            <div class="d-block d-lg-none mb-3">
                <div class="d-flex align-items-center justify-content-between gap-3 flex-wrap">
                    <h2 class="font-22px font-md-28px fw-600">Maintenance Coverage</h2>
                </div>
            </div>
            <div class="p-4 rounded-3 bg-white border">
                <div class="rounded-3 float-start me-0 me-md-4 width-100 width-md-35 mb-3" style="box-shadow: 1px 1px 4px 0px #1F1F1F40;">
                    <div class="row g-4 py-4 px-3">
                        <div class="col-lg-3">
                            <h5 class=" font-16px fw-600 m-0" style=" white-space: pre-line;">Property :</h5>
                        </div>
                        <div class="col-lg-9">
                            <h5 class="font-16px fw-500 m-0">Lorem ipsum dolor sit amet,
                                consectetur adipiscing elit.</h5>
                        </div>
                        <div class="col-lg-3">
                            <h5 class=" font-16px fw-600 m-0" style=" white-space: pre-line;">No. Of
                                Bedroom:</h5>
                        </div>
                        <div class="col-lg-9 d-flex align-items-center">
                            <h5 class="font-16px fw-500 m-0">4</h5>
                        </div>
                        <div class="col-lg-3">
                            <h5 class=" font-16px fw-600 m-0" style=" white-space: pre-line;">AMC Provider: </h5>
                        </div>
                        <div class="col-lg-9 d-flex align-items-center">
                            <h5 class="font-16px fw-500 m-0">-</h5>
                        </div>
                    </div>

                </div>
                <p class=" font-15px font-lg-16px">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Dicta delectus a deserunt distinctio vel inventore itaque ratione dolor nisi at reiciendis amet fuga officiis unde impedit ipsum blanditiis magni error cum voluptatum, odio soluta. Praesentium nam error aspernatur accusamus cum! Iusto quibusdam saepe recusandae non nisi similique expedita corporis ab. Illum fuga, nobis consectetur temporibus ipsam praesentium atque? Impedit cupiditate non amet? Ratione, enim laboriosam praesentium quae delectus asperiores repellat facilis odit facere suscipit ut quasi officiis rerum fuga ab inventore sed vero mollitia dicta distinctio est nesciunt! Maiores, eum veritatis. Dignissimos animi deserunt voluptas velit recusandae, dolor quibusdam similique id deleniti dolores delectus laudantium quia non tenetur et? Deleniti doloremque aliquam corporis odit incidunt vero suscipit consequuntur eum repellendus alias doloribus dolor nemo, vel atque culpa. Quae magnam aut eius doloribus maiores unde exercitationem esse rerum eligendi dolorum repudiandae dignissimos cumque accusamus magni animi, molestias cupiditate ipsum excepturi dolorem distinctio vel deleniti porro illum odio. Veritatis similique repellendus laboriosam quaerat asperiores vero sunt! Modi nam illo tempora saepe iure veritatis at, rerum cum ea obcaecati mollitia ipsa provident quas maxime impedit suscipit animi eum in aliquid, consectetur nostrum quisquam voluptate. Tempore, expedita suscipit dolorum iusto nam quasi cupiditate possimus enim laboriosam officiis est modi neque, minus fuga facere atque hic quos nulla nisi veritatis necessitatibus ea. Omnis a nesciunt perspiciatis quis consectetur? Commodi iusto repudiandae dolores sequi aliquam quasi deserunt nisi odit nihil suscipit ipsa, perferendis delectus quis placeat quam eaque, nesciunt recusandae perspiciatis provident molestiae officiis soluta, asperiores explicabo architecto. Fuga quisquam quidem corrupti obcaecati qui accusamus similique rem recusandae enim, impedit minima, aperiam velit cumque quis nihil ut excepturi facilis inventore odio nesciunt quo magnam vero! Placeat officia illo nobis adipisci nisi unde. Doloribus temporibus veniam quisquam nobis iure vitae reprehenderit perferendis praesentium nihil sequi, repellendus et.</p>

                <!-- table -->
                <div class="table-responsive">
                    <table class="table table-bordered align-middle">
                        <thead>
                            <tr>
                                <th class="p-4 fw-600 font-15px text-nowrap">Package Name</th>
                                <th class="p-4 fw-600 font-15px text-nowrap">Extra Care</th>
                                <th class="p-4 fw-600 font-15px text-nowrap">Super Care</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr class="">
                                <td class="p-4 font-15px font-md-16px fw-400">Package #01</td>
                                <td class="p-4 font-15px font-md-16px fw-400" style="    min-width: 290px; max-width: 298px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</td>
                                <td class="p-4 font-15px font-md-16px fw-400" style=" min-width: 290px; max-width: 298px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</td>
                            </tr>
                            <tr style="background: #E0E0E0;">
                                <th class="p-3">&nbsp;</th>
                                <th class="p-3">
                                    <div class="d-flex align-items-center justify-content-between">
                                        <h4 class=" font-13px m-0 fw-600 flex-1 text-center">Annually</h4>
                                        <h4 class=" font-13px m-0 fw-600 flex-1 text-center">Monthly</h4>
                                    </div>
                                </th>
                                <th class="p-3">
                                    <div class="d-flex align-items-center justify-content-between">
                                        <h4 class=" font-13px m-0 fw-600 flex-1 text-center">Annually</h4>
                                        <h4 class=" font-13px m-0 fw-600 flex-1 text-center">Monthly</h4>
                                    </div>
                                </th>
                            </tr>
                            <tr>
                                <td class="p-3 font-15px font-md-16px fw-600 text-center">STU/1BR</td>
                                <td class="p-3 font-15px font-md-16px fw-400">
                                    <div class=" d-flex align-items-center justify-content-between">
                                        <p class="m-0 lh-1 flex-1 text-center">AED 2,200</p>
                                        <p class="m-0 lh-1 flex-1 text-center">AED 2,200</p>
                                    </div>
                                </td>
                                <td class="p-3 font-15px font-md-16px fw-400">
                                    <div class=" d-flex align-items-center justify-content-between">
                                        <p class="m-0 lh-1 flex-1 text-center">AED 2,200</p>
                                        <p class="m-0 lh-1 flex-1 text-center">AED 2,200</p>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="p-3 font-15px font-md-16px fw-600 text-center">STU/1BR</td>
                                <td class="p-3 font-15px font-md-16px fw-400">
                                    <div class=" d-flex align-items-center justify-content-between">
                                        <p class="m-0 lh-1 flex-1 text-center">AED 2,200</p>
                                        <p class="m-0 lh-1 flex-1 text-center">AED 2,200</p>
                                    </div>
                                </td>
                                <td class="p-3 font-15px font-md-16px fw-400">
                                    <div class=" d-flex align-items-center justify-content-between">
                                        <p class="m-0 lh-1 flex-1 text-center">AED 2,200</p>
                                        <p class="m-0 lh-1 flex-1 text-center">AED 2,200</p>
                                    </div>
                                </td>
                            </tr>


                        </tbody>
                    </table>

                </div>

            </div>


        </div>
    </main>
</div>
@endsection