html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

main {
    min-height: calc(100vh - 59px);    
}

footer {
    position: fixed;
    bottom: 0;
    width: 100%;
}


/* Menu */
.narvar-custom-class {
    padding: 0.23rem;
}

    .narvar-custom-class .navbar-brand {
        display: flex;
        align-items: center;
    }

    .narvar-custom-class .dx-icon-user-custom {
        padding: 0rem 0rem !important;
    }

        .narvar-custom-class .dx-icon-user-custom i {
            padding: 0.4rem;
        }

    .narvar-custom-class.nav-link-me {
        margin-right: 0.5rem;
    }


    .narvar-custom-class a.nav-link {
        font-weight: 500;
        margin-right: 0.1rem;
        margin-left: 0.5rem;
        border-radius: 6px;
        padding: 0.5rem 1rem;
        display: flex;
        align-items: center;
        transition: background 0.2s, color 0.2s;
    }

    .narvar-custom-class a.dropdown-item {
        display: flex;
        align-items: center;
    }

    .narvar-custom-class .nav-link i {
        font-size: 20px;
        margin-right: 0.3rem;
    }

    .narvar-custom-class .dropdown-item i {
        font-size: 20px;
        margin-right: 1rem;
    }


.narvar-sub-menu {
    /*width: 180px;*/
    height: 100%;
    align-items: flex-start;
}

    .narvar-sub-menu li.narvar-menu-separator {
        margin: 1.5rem;
    }


    .narvar-sub-menu li.narvar-menu-title {
        padding: 0.5rem 0.5rem;
        font-weight: 700;
        font-size: 18px;
    }


    .narvar-sub-menu a.nav-link {
        /*   margin-top: 0.5rem;*/
        margin-bottom: 0.5rem;
        margin-left: 0.1rem;
        margin-right: 0.1rem;
    }

    .narvar-sub-menu .nav-link i {
        margin-right: 0.8rem;
    }




/*body {
  margin-bottom: 60px;
}*/



/* APP */
.center-screen {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 90vh;
    min-width: 100vw;
}

.center-screen .dx-box-flex {
    align-items: center !important;
}


.dx-icon-right {
    font-size: 18px !important;
    margin-left: 0.3rem;
}

.dx-icon-left {
    font-size: 18px !important;
    margin-right: 0.3rem;
}


.cursor-pointer {
    cursor: pointer;
}


/* Login page */
.login-center-screen {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 90vh;
    min-width: 20vw;
}

    .login-center-screen .dx-box-flex {
        align-items: center !important;
    }


.dx-validationsummary-item-content {
    font-weight: 900 !important;
}


.justify-items-center {
    justify-items: center;
}



/*Menu*/
.menu-left {
    width: 200px !important;
}

.menu-right {
    width: calc(100vw - 200px) !important;
}


/* Home page */
.home-center-screen {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 80vh;
    min-width: 100vw;
}



/*Go back button*/
.div-go-back {
    text-align: right;
    font-size: 14px;
    margin-bottom: 0.5rem;
}




/*Headers*/
h4 {
    font-weight: 700;
}

/*Bootstrap offcanvas-end*/
.offcanvas-end {   
    width: 600px !important;
}



/* Devextreme  loadpanel*/
.dx-loadpanel-wrapper {
    z-index: 2000 !important
}


/*Devextreme forms*/
.last-group .dx-field-item {
    padding: 0 !important;
}

.buttons-group {
    display: flex;
    width: 100%;
    justify-content: end;
}

    .buttons-group .dx-item-content {
        gap: 10px;
    }


/* Devextreme  scheduler tooltip*/
.dx-popup-wrapper.dx-scheduler-appointment-tooltip-wrapper .dx-popup-content .dx-list-item,
.dx-scheduler-overlay-panel .dx-popup-content .dx-list-item {
    width: 460px !important;
}