- var page_Title = 'POS Dashboard';
- var form_validation       = true;
- var theme_customizer      = true;
- var sidebar               = true;
- var slick                 = true;
- var header_slider         = true;
- var animate               = true;
- var scrollbar             = true;
- var height_equal          = true;
- var dashboard_8           = true;
- var touchspin_2           = true;
- var swiper                = true;
doctype html
html(lang='en')
  include ../../components/header-files
  body
    include ../../components/loader
    include ../../components/taptop
    // page-wrapper Start
    #pageWrapper.page-wrapper.compact-wrapper
      include ../../components/header
      // Page Body Start
      .page-body-wrapper
        include ../../components/sidebar
        .page-body
          .container.w-full
            .page-title
              .grid.grid-cols-12.mx-2.items-center
                div(class="col-span-6 sm:col-span-12")
                  h3
                    | POS
                div(class="col-span-6 sm:col-span-12")
                  ol.breadcrumb.flex
                    li.breadcrumb-item
                      a(href='index.html')                                        
                        svg.stroke-icon
                          use(href='../assets/svg/icon-sprite.svg#stroke-home')
                    li.breadcrumb-item Dashboard
                    li.breadcrumb-item.active POS
          // Container-fluid starts
          .container.dashboard-8
            .grid.grid-cols-12.card-gap
                div(class="col-span-9 xxl:col-span-8 xl:col-span-12 box-col-8")
                    .grid.grid-cols-12 
                        div(class="col-span-12") 
                            .card
                                .card-header.card-no-border 
                                    .header-top  
                                        h5 Product Categories
                                        div.card-header-right-btn
                                            a.c-o-light(href="products-list.html") View All 
                                .card-body.pt-0
                                    .slider-wrapper.arrow-round 
                                        .swiper.shop-category-slider
                                            .swiper-wrapper
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/phone.png", alt="phone")
                                                    span.m-t-10.category-title.font-medium.text-gray Phone
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/camera.png", alt="Camera")
                                                    span.m-t-10.category-title.font-medium.text-gray Camera
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/laptop.png", alt="Laptop")
                                                    span.m-t-10.category-title.font-medium.text-gray Laptop
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/mouse.png", alt="Mouse")
                                                    span.m-t-10.category-title.font-medium.text-gray Mouse
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/tv.png", alt="tv")
                                                    span.m-t-10.category-title.font-medium.text-gray TV
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/drone.png", alt="Drone")
                                                    span.m-t-10.category-title.font-medium.text-gray Drone
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/watch.png", alt="watch")
                                                    span.m-t-10.category-title.font-medium.text-gray Watch
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/headphone.png", alt="headphone")
                                                    span.m-t-10.category-title.font-medium.text-gray Headphone
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/speaker.png", alt="speaker")
                                                    span.m-t-10.category-title.font-medium.text-gray Speaker
                                                .swiper-slide
                                                    a.shop-box(href="#!")
                                                        img(src="../assets/images/dashboard-8/shop-categories/controller.png", alt="Game-controller")
                                                    span.m-t-10.category-title.font-medium.text-gray Games
                        div(class="col-span-12")
                            .card 
                                .card-header.card-no-border 
                                    div.main-product-wrapper
                                        .product-header
                                            h5 Products
                                            p.f-m-light.mt-1.text-gray.font-medium
                                                | Browse & Discover thousands of products here!
                                        .product-body 
                                            .input-group.product-search
                                                span.input-group-text
                                                    i.search-icon.text-gray(data-feather='search')
                                                input.form-control(type='text' placeholder='Search Product...' list='datalistOptionssearch' id='exampleDataList1')
                                                datalist#datalistOptionssearch
                                                    option(value='Bluetooth Calling Smartwatch')
                                                    option(value='Microsoft Surface Laptop')
                                                    option(value='Gaming Over Ear Headphone')
                                                    option(value='Apple iPhone 14 Plus')
                                .card-body.main-our-product
                                    .grid.grid-cols-12.gap-3
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4")
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/watch-2.png", alt="watch") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 Bluetooth Calling Smartwatch
                                                    div
                                                        h6.txt-primary $109.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/laptop.png", alt="laptop") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 Microsoft Surface Laptop
                                                    div
                                                        h6.txt-primary $187.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/headphone.png", alt="headphone") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 Gaming Over Ear Headphone
                                                    div
                                                        h6.txt-primary $76.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/phone.png", alt="phone") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 Apple iPhone 14 Plus
                                                    div
                                                        h6.txt-primary $132.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/dvd.png", alt="DVD player") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 Apple Smart HD TV
                                                    div
                                                        h6.txt-primary $789.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/mac-laptop.png", alt="pink laptop") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 Apple iPhone 14 Plus
                                                    div
                                                        h6.txt-primary $809.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/speaker.png", alt="speaker") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 Speakers Wireless
                                                    div
                                                        h6.txt-primary $541.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/mouse.png", alt="mouse") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 M185 Compact Wireless Mouse
                                                    div
                                                        h6.txt-primary $200.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/wireless-headphone.png", alt="wireless-headphone") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 Wireless Headphone
                                                    div
                                                        h6.txt-primary $333.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/keyboard.png", alt="keyboard") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 RGB Gaming Keyboard
                                                    div
                                                        h6.txt-primary $198.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/ipad.png", alt="ipad") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 MacBook Air 13.3-inch
                                                    div
                                                        h6.txt-primary $409.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                                        div(class="col-span-3 xxl:col-span-4 md:col-span-6 sm:col-span-12 box-col-4") 
                                            .our-product-wrapper.h-full.widget-hover
                                                .our-product-img
                                                    img(src="../assets/images/dashboard-8/product-categories/drone.png", alt="drone") 
                                                .our-product-content
                                                    h6.f-14.font-medium.pt-2.pb-1 SYMA X5SW Remote control..
                                                    div
                                                        h6.txt-primary $341.00
                                                        .common-f-start
                                                            div.add-quantity.btn.border.text-gray.font-medium
                                                                i.fa-solid.fa-minus.decrement-btn
                                                                input.countdown-remove(type='text' value='1')
                                                                i.fa-solid.fa-plus.increment-btn
                                                            div.btn.border.font-medium
                                                                span.text-gray Add
                div(class="col-span-3 xxl:col-span-4 xl:col-span-12 box-col-4e")
                    .card.customer-sticky
                        .card-header.card-no-border.pb-3
                            .header-top.border-bottom.pb-3
                                h5.m-0 Customer 
                                .card-header-right-icon.create-right-btn
                                    a.btn.btn-light-primary.font-medium(href="#!" data-bs-toggle='modal' data-bs-target='#dashboard8')
                                        | Create +
                                // Modal
                                #dashboard8.modal.fade(tabindex='-1' aria-labelledby='dashboard8' aria-hidden='true')
                                    .modal-dialog.modal-dialog-centered.modal-lg
                                        .modal-content.create-customers.custom-input
                                            .modal-header
                                                h5#modaldashboard.modal-title Create Customer
                                                button.btn-close(type='button', data-bs-dismiss='modal', aria-label='Close')
                                            .modal-body.p-0
                                                .text-start.dark-sign-up
                                                    .modal-body
                                                        form.grid.grid-cols-12.gap-3.needs-validation(novalidate='')
                                                            div(class="col-span-6 md:col-span-12")
                                                                label.form-label(for='validationCustom-8') First Name
                                                                    span.txt-danger *
                                                                input#validationCustom-8.form-control(type='text' placeholder='Enter your first-name' required='')
                                                                .valid-feedback
                                                                    | Looks good!
                                                            div(class="col-span-6 md:col-span-12")
                                                                label.form-label(for='validationCustom09') Last Name
                                                                    span.txt-danger *
                                                                input#validationCustom09.form-control(type='text' placeholder='Enter your last-name' required='')
                                                                .valid-feedback
                                                                    | Looks good!
                                                            div(class="col-span-6 md:col-span-12")
                                                                label.form-label(for='validationCustom08') Mobile Number
                                                                    span.txt-danger *
                                                                input#validationCustom08.form-control(type='number' placeholder='Mobile number' required='')
                                                                .valid-feedback
                                                                    | Looks good!
                                                            div(class="col-span-6 md:col-span-12")
                                                                .mb-3
                                                                    label.form-label(for='exampleFormControlInput8') Email
                                                                        span.txt-danger *
                                                                    input#exampleFormControlInput8.form-control(type='email' placeholder='customername@gmail.com')
                                                            div(class="col-span-12").flex.justify-end
                                                                button.btn.btn-primary.text-white(type='submit') Create +

                        .card-body.pt-0.order-details
                            .search-items
                                .input-group.common-search
                                    span.input-group-text
                                        i.search-icon.text-gray(data-feather='search')
                                    input.form-control(type='text' placeholder='Search Customer...')
                                .common-flex
                                    a(href="cart.html" target="_blank").btn.btn-primary.text-white Add to Cart
                                    a(href="#!").btn.button-light-secondary Empty Cart 
                            h5.m-0 Billings
                            .input-group.common-search.p-b-15
                                span.input-group-text
                                    i.search-icon.text-gray(data-feather='search')
                                input.form-control(type='text' placeholder='Search Product...')
                            .order-quantity.p-b-20.border-bottom
                                div(class="[@media(min-width:576px)_and_(max-width:1199px)]:!flex-row")
                                    .order-details-wrapper
                                        .left-details
                                            .order-img.widget-hover(class="[@media(min-width:1400px)_and_(max-width:1920px)]:!w-[calc(50px_+_(100_-_50)_*_((100vw_-_320px)_/_(1920_-_320)))] [@media(min-width:1400px)_and_(max-width:1920px)]:!h-[calc(45px_+_(100_-_45)_*_((100vw_-_320px)_/_(1920_-_320)))]")
                                                img(src="../assets/images/dashboard-8/product-categories/phone.png", alt="phone") 
                                        .category-details
                                            div.order-details-right
                                                span.text-gray.mb-1 Category : 
                                                    span.font-dark Phone
                                                h6.f-14.font-medium.mb-3 Apple iPhone 14 Plus
                                                .last-order-detail
                                                    h6.txt-primary $987.00
                                                    a(href="#!") 
                                                        i.fa-solid.fa-trash.trash-remove
                                            .right-details
                                                .touchspin-wrapper
                                                    button.decrement-touchspin.btn-touchspin
                                                        i.fa-solid.fa-minus.text-gray
                                                    input#inputData.input-touchspin(type='number' value='9')
                                                    button.increment-touchspin.btn-touchspin
                                                        i.fa-solid.fa-plus.text-gray
                                            
                                    .order-details-wrapper
                                        .left-details
                                            .order-img.widget-hover(class="[@media(min-width:1400px)_and_(max-width:1920px)]:!w-[calc(50px_+_(100_-_50)_*_((100vw_-_320px)_/_(1920_-_320)))] [@media(min-width:1400px)_and_(max-width:1920px)]:!h-[calc(45px_+_(100_-_45)_*_((100vw_-_320px)_/_(1920_-_320)))]")
                                                img(src="../assets/images/dashboard-8/product-categories/watch-2.png", alt="watch") 
                                        .category-details
                                            div.order-details-right
                                                span.text-gray.mb-1 Category : 
                                                    span.font-dark Watch
                                                h6.f-14.font-medium.mb-3 Bluetooth Calling Smartwatch
                                                .last-order-detail
                                                    h6.txt-primary $109.00
                                                    a(href="#!")
                                                        i.fa-solid.fa-trash.trash-remove
                                            .right-details
                                                .touchspin-wrapper
                                                    button.decrement-touchspin.btn-touchspin
                                                        i.fa-solid.fa-minus.text-gray
                                                    input#inputData1.input-touchspin(type='number' value='9')
                                                    button.increment-touchspin.btn-touchspin
                                                        i.fa-solid.fa-plus.text-gray
                                    .card-body.p-0.empty-card.trash-items
                                        .empty-cart-wrapper
                                            .empty-cart-content
                                                img(src="../assets/images/dashboard-8/order-trash.gif", alt="order-trash")
                                            h6.text-gray Your cart is empty!!!
                                            a(href="category.html") 
                                .coupon-code
                                    .input-group.flex
                                        input.form-control.rounded-e-none(type='text' placeholder="Enter Coupon Code..." aria-label="Enter Code" aria-describedby='button-addon2')
                                        button#button-addon2.btn.bg-light-secondary.rounded-s-none(type='button') Apply
                            .total-item
                                .item-number
                                    span.text-gray Item
                                    span 2 (Items)
                                .item-number
                                    span.text-gray Product Discount
                                    span $20
                                .item-number
                                    span.text-gray Coupon Discount
                                    span $0.00
                                .item-number.border-bottom
                                    span.text-gray Subtotal
                                    span $1,186
                                .item-number.pt-3.pb-0
                                    span.font-medium Total
                                    h6.font-medium $1,186
                            h5.m-0.p-t-40 Payment Method
                            .payment-methods
                                div
                                    .bg-payment.widget-hover 
                                        img(src="../assets/images/dashboard-8/payment-option/cash.svg", alt="cash")
                                    span.font-medium.text-gray Cash
                                div
                                    .bg-payment.widget-hover 
                                        img(src="../assets/images/dashboard-8/payment-option/card.svg", alt="card")
                                    span.font-medium.text-gray Card
                                div 
                                    .bg-payment.widget-hover 
                                        img(src="../assets/images/dashboard-8/payment-option/wallet.svg", alt="wallet")
                                    span.font-medium.text-gray E-Wallet
                            .place-order
                                button.btn.btn-primary.btn-hover-effect.w-full.text-white.font-medium(type="button") Place Order
                              
          // Container-fluid Ends
        include ../../components/footer
    include ../../components/footer-files
