- var theme_customizer      = true;
- var ckeditor              = true;
- var email_app             = true;

doctype html
html(lang='en')
    include ../../components/header-files
    body
        include ../../components/loader
        // page-wrapper Start
        #pageWrapper.page-wrapper
            include ../../components/header
            // Page Body Start
            .page-body-wrapper.horizontal-menu
                include ../../components/sidebar
                .page-body
                    .container-fluid
                        .page-header
                            .row
                                .col-sm-6
                                    h3
                                      | Email Application
                                    ol.breadcrumb
                                      li.breadcrumb-item
                                        a(href='index.html')
                                         | Home
                                      li.breadcrumb-item Apps   
                                      li.breadcrumb-item Email
                                      li.breadcrumb-item.active Email App
                                .col-sm-6
                                  include ../../components/bookmark
                    // Container-fluid starts
                    .container-fluid
                      .email-wrap
                        .row
                          .col-xl-3.box-col-6
                            .email-left-aside
                              .card
                                .card-body
                                  .email-app-sidebar
                                    .media
                                      .media-size-email
                                        img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                      .media-body
                                        h6.f-w-600 MARKJENCO
                                        p Markjecno@gmail.com
                                    ul.nav.main-menu(role='tablist')
                                      li.nav-item
                                        a#pills-darkhome-tab.btn-primary.btn-block.btn-mail.w-100(data-bs-toggle='pill', href='#pills-darkhome', role='tab', aria-controls='pills-darkhome', aria-selected='true')
                                          i.icofont.icofont-envelope.me-2
                                          |  NEW MAIL
                                      li.nav-item
                                        a#pills-darkprofile-tab.show(data-bs-toggle='pill', href='#pills-darkprofile', role='tab', aria-controls='pills-darkprofile', aria-selected='false')
                                          span.title
                                            i.icon-import
                                            |  Inbox
                                          span.badge.pull-right (236)
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-folder
                                            |  All mail
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-new-window
                                            |  Sent
                                          span.badge.pull-right (69)
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-pencil-alt
                                            |  DRAFT
                                          span.badge.pull-right (59)
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-trash
                                            |  TRASH
                                          span.badge.pull-right (99)
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-info-alt
                                            |  IMPORTANT
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-star
                                            |  Starred
                                      li
                                        hr
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-email
                                            |  UNREAD
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-export
                                            |  SPAM
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-share
                                            |  OUTBOX
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-file
                                            |  UPDATE
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-bell
                                            |  ALERT
                                      li
                                        a(href='#')
                                          span.title
                                            i.icon-notepad
                                            |  NOTES
                                          span.badge.pull-right (20)
                          .col-xl-9
                            .email-right-aside
                              .card.email-body
                                .row.email-profile
                                  .col-xl-4.col-md-6.box-md-12.pr-0
                                    .pe-0.b-r-light
                                    .email-top
                                      .row
                                        .col
                                          h5 Inbox
                                        .col.text-end
                                          .dropdown
                                            button#dropdownMenuButton.btn.bg-transparent.dropdown-toggle.p-0.font-primary.f-w-600(type='button', data-bs-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
                                              | More
                                            .dropdown-menu(aria-labelledby='dropdownMenuButton')
                                              a.dropdown-item(href='javascript:void(0)') Action
                                              a.dropdown-item(href='javascript:void(0)') Another action
                                              a.dropdown-item(href='javascript:void(0)') Something else here                                        
                                    .inbox
                                      .media
                                        .media-size-email
                                          img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                        .media-body
                                          h6
                                            | Pork Lorn  
                                            small
                                              span (15
                                              |  July 
                                              span 2024)
                                          p Mattis luctus. Donec nisi diam,
                                      .media.active
                                        .media-size-email
                                          img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                        .media-body
                                          h6
                                            | Lorm lpsa  
                                            small
                                              span.digits (20
                                              |  January)
                                          p Mattis luctus. Donec nisi diam,
                                      .media
                                        .media-size-email
                                          img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                        .media-body
                                          h6
                                            | Hileri makr  
                                            small
                                              span (20
                                              |  Aug
                                              span  2024)
                                          p Mattis luctus. Donec nisi diam,
                                      .media
                                        .media-size-email
                                          img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                        .media-body
                                          h6
                                            | Lion Lorpa  
                                            small
                                              span (02
                                              |  Jun 
                                              span 2024)
                                          p Mattis luctus. Donec nisi diam,
                                      .media
                                        .media-size-email
                                          img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                        .media-body
                                          h6.mt-0
                                            | Solvn Relto  
                                            small
                                              span (25
                                              |  July 
                                              span 2024)
                                          p Mattis luctus. Donec nisi diam,
                                      .media
                                        .media-size-email
                                          img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                        .media-body
                                          h6
                                            | Repro Soft  
                                            small
                                              span (15
                                              |  July 
                                              span 2024)
                                          p Mattis luctus. Donec nisi diam,
                                      .media
                                        .media-size-email
                                          img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                        .media-body
                                          h6
                                            | Lion Lorpa  
                                            small
                                              span (02
                                              |  Jun 
                                              span 2024)
                                          p Mattis luctus. Donec nisi diam,
                                  .col-xl-8.col-md-6.box-md-12.pl-0
                                    .email-right-aside
                                      .email-body.radius-left
                                        .ps-0
                                          .tab-content
                                            #pills-darkhome.tab-pane.fade(role='tabpanel', aria-labelledby='pills-darkhome-tab')
                                              .email-compose
                                                .email-top.compose-border
                                                  .row
                                                    .col-sm-8.xl-50
                                                      h4.mb-0 New Message
                                                    .col-sm-4.btn-middle.xl-50
                                                      button.btn.btn-primary.btn-block.btn-mail.text-center.mb-0.mt-0.w-100(type='button')
                                                        i.fa.fa-paper-plane.me-2
                                                        |  SEND
                                                .email-wrapper
                                                  form.theme-form
                                                    .mb-3
                                                      label.col-form-label.pt-0(for='exampleInputEmail1') To
                                                      input#exampleInputEmail1.form-control(type='email')
                                                    .mb-3
                                                      label(for='exampleInputPassword1') Subject
                                                      input#exampleInputPassword1.form-control(type='text')
                                                    div
                                                      label.text-muted Message
                                                      textarea#text-box(name='text-box', cols='10', rows='2')                                                             
                                            #pills-darkprofile.tab-pane.fade.active.show(role='tabpanel', aria-labelledby='pills-darkprofile-tab')
                                              .email-content
                                                  .email-top
                                                    .row
                                                      .col-xl-6.xl-100.col-sm-12
                                                        .media
                                                          img.me-3.rounded-circle(src='../assets/images/user/user.png', alt='')
                                                          .media-body
                                                            h6
                                                              | Lorm lpsa  
                                                              small
                                                                span.digits (20
                                                                |  January) 
                                                                span.digits 6:00
                                                                |  AM
                                                            p Mattis luctus. Donec nisi diam text.
                                                      .col-md-6.col-sm-12
                                                        .email-right
                                                          p.user-emailid
                                                            | Lormlpsa
                                                            span.digits 23
                                                            | @company.com
                                                          i.fa.fa-star-o.f-18.mt-1
                                                  .email-wrapper
                                                    p Hello
                                                    p Dear Sir Good Morning,
                                                    h5 Elementum varius nisi vel tempus. Donec eleifend egestas viverra.
                                                    p.m-b-20
                                                      | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur non diam facilisis, commodo libero et, commodo sapien. Pellentesque sollicitudin massa sagittis dolor facilisis, sit amet vulputate nunc molestie. Pellentesque maximus nibh id luctus porta. Ut consectetur dui nec nulla mattis luctus. Donec nisi diam, congue vitae felis at, ullamcorper bibendum tortor. Vestibulum pellentesque felis felis. Etiam ac tortor felis. Ut elit arcu, rhoncus in laoreet vel, gravida sed tortor.
                                                    p
                                                      | In elementum varius nisi vel tempus. Donec eleifend egestas viverra. Donec dapibus sollicitudin blandit. Donec scelerisque purus sit amet feugiat efficitur. Quisque feugiat semper sapien vel hendrerit. Mauris lacus felis, consequat nec pellentesque viverra, venenatis a lorem. Sed urna lectus.Quisque feugiat semper sapien vel hendrerit
                                                    hr
                                                    .d-inline-block
                                                      h6.text-muted
                                                        i.icofont.icofont-clip
                                                        |  ATTACHMENTS
                                                      a.text-muted.font-primary.right-download.f-w-600(href='javascript:void(0)')
                                                        i.fa.fa-long-arrow-down.me-2
                                                        | Download All
                                                      .clearfix
                                                    .attachment
                                                      ul.list-inline
                                                        li.list-inline-item
                                                          img.img-fluid(src='../assets/images/email/1.jpg', alt='')
                                                        li.list-inline-item
                                                          img.img-fluid(src='../assets/images/email/2.jpg', alt='')
                                                        li.list-inline-item
                                                          img.img-fluid(src='../assets/images/email/3.jpg', alt='')
                                                    hr
                                                    .action-wrapper
                                                      ul.actions
                                                        li
                                                          a.text-muted(href='javascript:void(0)')
                                                            i.fa.fa-reply.me-2
                                                            | Reply
                                                        li
                                                          a.text-muted(href='javascript:void(0)')
                                                            i.fa.fa-reply-all.me-2
                                                            | Reply All
                                                        li
                                                          a.text-muted(href='javascript:void(0)')
                                                            i.fa.fa-share.me-2
                                                          | Forward
                    // Container-fluid Ends
                include ../../components/footer
        include ../../components/footer-files