@use "../variables";
[data-vertical-style="icontext"][data-toggled="icon-text-close"] {
    @media (min-width: 992px) {
        &:not([data-icon-text="open"]) {
            .app-sidebar {
                position: absolute;
                width: 9rem;
                .main-sidebar {
                    overflow: visible;
                }
                .main-sidebar-header {
                    width: 9rem;
                    justify-content: center;
                }
                .side-menu__icon {
                    margin-inline-end: 0;
                    margin-block-end: 0.5rem;
                }
                .slide {
                    padding: 0;
                }
                .slide__category,
                .side-menu__angle {
                    display: none;
                }
                .slide.has-sub.open {
                    .slide-menu {
                        display: none !important;
                    }
                }    
                .side-menu__item {
                    border-radius: 0;
                }
                .side-menu__item,
                .side-menu__label {
                    display: block;
                    text-align: center;
                }
            }
            &[data-menu-position="fixed"] {
                .app-sidebar {
                    position: fixed;
                }
            } 
            .app-header {
                padding-inline-start: 9rem;
            }
        }
        .app-content {
            margin-inline-start: 9rem;
        }
        &[data-icon-text="open"] {
            .app-sidebar {
                width: 16rem;
                .main-sidebar-header {
                    width: 16rem;
                }
                .side-menu__icon { 
                    margin-block-end: 0;
                    margin-inline-end: 0.75rem;
                }
                .slide {
                    padding: 0rem 0.625rem; 
                }
                .slide-menu {
                    &.child1,.child2,.child3 {
                        li {
                            padding: 0;
                        }
                    }
                    &.child1 li {
                        padding-inline-start: 2.25rem;
                    }
                    &.child2 li {
                        padding-inline-start: 1.5rem;
                    }
                    &.child3 li {
                        padding-inline-start: 1rem;
                    }
                }
            }
            .app-header {
                padding-inline-start: 9rem;
            }
        }
    }
}
@media (min-width: 992px) {
    [data-nav-layout="vertical"] {
        &[data-vertical-style="icontext"][data-toggled="icon-text-close"] { 
            .app-sidebar {
                .slide .side-menu__label {
                    .badge {
                        display: none;
                    }
                }
            }
            &[data-icon-text="open"] {
                .app-sidebar {
                    .slide .side-menu__label {
                        .badge {
                            display: block;
                        }
                    }
                }
            }
        }
    }
}