@use "../variables";
[data-nav-layout="horizontal"] {
    @media (min-width: 992px) {
        .sidemenu-layout-styles {
            display: none;
        }
        .main-menu {
            height: auto !important;
            display: flex !important;
            transition: all 0.5s ease;
            // flex-wrap: wrap; // To enable wrap version of horizontal
            &-container {
                display: inline-flex;
            }
        }
        .mega-menu {
            columns: 3;
            -webkit-columns: 3;
            -moz-columns: 3;
        }
        .app-header {
            padding-inline-start: 0 !important;
            z-index: 101;
            box-shadow: none;
        }
        .app-content {
            margin-block-start: 7rem;
            margin-inline-start: 0rem !important;
            > .container-fluid {
                width: 94%;
                margin-inline-start: auto;
                margin-inline-end: auto;
            }
        }
        .app-sidebar {
            position: relative;
            .main-sidebar,
            .simplebar-mask {
                overflow: visible;
            }
            .side-menu__item .badge {
                display: none;
            }
            &.sticky {
                position: fixed;
            }
        }
        .main-sidebar .simplebar-vertical {
            visibility: hidden !important;
        }
        .main-sidebar,
        .main-header-container {
            width: 100%;
            margin: 0 auto;
        }
        .horizontal-logo {
            padding: 0.3rem;
            display: block;
            @media (min-width: 992px) {
                .header-logo {
                    .desktop-logo {
                        display: block;
                    }
                    .desktop-dark,
                    .toggle-logo,
                    .toggle-dark {
                        display: none;
                    }
                }
            }
        }
        .main-header-container .sidemenu-toggle {
            display: none;
        }
        .app-sidebar {
            width: 100% !important;
            height: 3rem;
            inset-block-start: 3.75rem;
            border-block-end: 1px solid variables.$default-border;
            .slide-menu.child1,
            .slide-menu.child2,
            .slide-menu.child3 {
                li {
                    padding-inline-start: 0.5rem;
                }
                .side-menu__item:before {
                    // inset-block-start: 1rem;
                    border-color: variables.$primary;
                }
            }
            .simplebar-content {
                padding: 0 !important;
                overflow: hidden;
            }
            .simplebar-content-wrapper {
                overflow: visible !important;
                height: auto;
            }
            .main-sidebar {
                height: 3rem !important;
                padding: 0;
            }
            .slide.has-sub .slide-menu {
                &.child1 {
                    inset-inline-start: 1.5rem !important;
                }
                &.child2,
                &.child3 {
                    inset-inline-end: 100% !important;
                }
                &.active {
                    inset-inline-start: auto !important;
                    inset-inline-end: auto !important;
                }
            }
            .slide-menu.child1 {
                position: absolute !important;
            }
            .side-menu__item {
                display: flex;
            }
            .side-menu__angle {
                inset-inline-end: 0;
                display: block;
            }
            .side-menu__icon {
                margin-inline-end: 0.25rem;
                margin-block-end: 0;
            }
            .slide.has-sub .slide-menu.child1 {
                background-color: var(--menu-bg);
                inset-block-start: 100% !important;
                box-shadow: 0.063rem 0.188rem 0.5rem variables.$black-1;
                min-width: 12rem;
            }
            .slide {
                padding: 0;
            }
            .slide-menu {
                &.child1,
                &.child2,
                &.child3 {
                    border-radius: 0 0 0.25rem 0.25rem;
                    .slide.has-sub {
                        width: 100%;
                    }
                }
            }
            .slide,.slide.has-sub {
                position: static;
            }
            .main-menu {
                margin-block-end: 0;
            }
        }
        .main-sidebar-header {
            display: none !important;
        }
        .main-sidebar {
            margin-block-start: 0;
            padding-block-end: 3rem;
        }
        .slide__category {
            display: none;
        }
        /* horizontal arrows */
        .main-menu-container .slide-left {
            inset-inline-start: 1.438rem;
        }
        .main-menu-container .slide-left,
        .main-menu-container .slide-right {
            position: absolute;
            top: 0.563rem;
            padding: 0.375rem;
            color: variables.$custom-white;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 1;
            cursor: pointer;
            border: 1px solid variables.$default-border;
            border-radius: 3.125rem;
        }

        .main-menu-container .slide-left,
        .main-menu-container .slide-right {
            position: absolute;
            top: 0.313rem;
            padding: 0.375rem;
            color: variables.$custom-white;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 1;
            cursor: pointer;
            border: 1px solid variables.$default-border;
            border-radius: 3.125rem;
            background: variables.$custom-white;
        }

        .main-menu-container {
            .slide-right {
                inset-inline-end: -3%;
            }
            .slide-left {
                inset-inline-start: -3%;
            }
        }
        &[page-style="classic"] {
            .app-sidebar {
                border-block-end: 1px solid variables.$default-border;
            }
        }
    }
}


/* Start:: Landing Body */
.landing-body {
    .app-header .horizontal-logo {
        padding: 0.9rem 1rem;
    }
    @media (max-width: 991.98px) {
        .sidemenu-toggle {
            padding: 12px 18px !important;
            border: 0px;
            border-radius: 0;
            font-size: 1.25rem;
            background-color: variables.$light;
        }
        .main-sidebar {
            margin-block-start: 0;
            padding-block-start: 0;
        }
        .app-sidebar {
            .side-menu__item {
               padding: 0.75rem 1rem !important;
            }
            .slide.has-sub.open > .side-menu__item .side-menu__angle {
                transform: rotate(0);
            }
            .slide-menu {
                &.child1,&.child2,&.child3 {
                    .slide {
                        .side-menu__item {
                           padding: 0.5rem 1rem !important;
                           position: relative;
                           &:before {
                                display: block !important;
                                inset-inline-start: 0rem;
                                width: .375rem;
                                height: .375rem;
                            }
                        }
                    }
                }
            }
        }
        .app-header {
            position: relative;
            &.sticky {
                position: fixed;
                top: 0;
            }
        }
    }
}
@media (max-width: 991.98px) {
    .landing-body {
        .app-sidebar {
            padding: 0.75rem 0.5rem;
        }
    }
}
/* End:: Landing Body */