:root {
    --bs-logo-lg-height: 24px;
    --bs-logo-sm-height: 26px;
    --bs-main-nav-width: 280px;
    --bs-main-nav-width-sm: 75px;
    --bs-main-nav-item-icon-size: 22px;
    --bs-main-nav-item-font-size: 15px;
    --bs-main-nav-item-padding-x: 25px;
    --bs-main-nav-item-padding-y: 10px;
    --bs-topbar-height: 100px;
    --bs-footer-height: 60px;
    --bs-headings-color: #313b5e;
    --bs-input-border-color: #d8dfe7;
    --bs-input-focus-border-color: #b0b0bb;
}
.main-nav, body{
    direction: rtl;
}
.topbar{
    padding-left:0px;
}
.page-content{
    margin-left:0px !important;
    margin-right: var(--bs-main-nav-width);
}

.wrapper .main-nav .menu-arrow::after {
    left: calc(var(--bs-main-nav-item-padding-x) * 1) ;
    right:0;
    margin-right: auto;
    position: relative;
    margin-left:20px
}

.button-sm-hover {

    left: calc(var(--bs-main-nav-item-padding-x) * 0.5);
   right: 0 !important;
}
.button-sm-hover-icon{
    float:left;
}