/**
 * Theme
 */
:root {
    --font-size-sm: 14px
}

.font-size-sm{
    font-size: 14px;
}

.hidden-overflow{
    overflow: hidden!important;
}

*[data-selection="false"]{
    cursor:default;
}

.inline-block{
	display:-moz-inline-stack;
	display:inline-block;
	zoom:1;
	*display:inline;
}

.nav-fixed .topbar,
.nav-fixed .navbar-content > .accordion-sidebar{
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1038;
    margin-bottom: 0;
}

.nav-fixed .topbar .sidebar-brand{
    width: 13rem;
}

.nav-fixed .topbar .sidebar-brand img{
    width: 70%;
    height: auto;
}

.nav-fixed .navbar-content{
    display: flex;
    width: 100%;
}

.nav-fixed .navbar-content > .accordion-sidebar .sidebar{
    width: 100%!important;
}

.nav-fixed .navbar-content > .accordion-sidebar{
    width: 6.5rem;
    height: 100vh;
    z-index: 1030;
    overflow-y: auto;
    overflow-x: hidden;
    right: unset;
}

.nav-fixed .navbar-content > .accordion-sidebar.accordion-sidebar-mobile{
    overflow: unset;
}

.nav-fixed .navbar-content > .accordion-sidebar.toggled{
    width: 0 !important;
}

.nav-fixed .navbar-content > .content-wrapper{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
    flex-grow: 1;
    min-height: 100vh;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 1;
}

.nav-fixed .navbar-content > .content-wrapper > #content,
.nav-fixed .navbar-content > .content-wrapper > footer{
    padding-left: 6.5rem;
}

.sidebar-toggled.nav-fixed .navbar-content > .content-wrapper > #content,
.sidebar-toggled.nav-fixed .navbar-content > .content-wrapper > footer{
    padding-left: 0;
}

@media (min-width: 768px) {
    .nav-fixed .navbar-content > .accordion-sidebar{
      width: 14rem !important;
    }

    .nav-fixed .navbar-content > .accordion-sidebar.toggled {
        overflow: visible;
        width: 6.5rem !important;
    }

    .nav-fixed .navbar-content > .content-wrapper > #content,
    .nav-fixed .navbar-content > .content-wrapper > footer{
        padding-left: 14rem !important;
    }

    .sidebar-toggled.nav-fixed .navbar-content > .content-wrapper > #content,
    .sidebar-toggled.nav-fixed .navbar-content > .content-wrapper > footer{
        padding-left: 6.5rem !important;
    }
}

footer.sticky-footer{
    padding: 1rem;
}

/**
 * Components
 */

/* Main Menu */
#accordion-sidebar > li > a > .fa,
#accordion-sidebar > li > a > .fas,
#accordion-sidebar > li > a > .far,
#accordion-sidebar > li > a > .fal,
#accordion-sidebar > li > a > .fad,
#accordion-sidebar > li > a > .fab{
    min-width: 20px;
    text-align: left;
}

#accordion-sidebar.toggled > li > a > .fa,
#accordion-sidebar.toggled > li > a > .fas,
#accordion-sidebar.toggled > li > a > .far,
#accordion-sidebar.toggled > li > a > .fal,
#accordion-sidebar.toggled > li > a > .fad,
#accordion-sidebar.toggled > li > a > .fab{
    min-width: unset;
    text-align: center;
}

/* Form Control */
.form-group.has-error label{
    color:#a94442;
}

.form-group.has-error .form-control, 
.form-group.has-error .input-group-addon{
    border-color:#a94442;
    color:#a94442;
}

.form-group.has-error .form-control:focus{
    box-shadow: 0 0 0 .2rem rgba(238,164,163,.25);
}

.form-group.has-error .form-control::placeholder{
    color:#a94442;
}

.col-form-label-sm {
    margin-bottom: 0;
}

.form-group-label-sm-form-control .col-form-label-sm{
    line-height: 1.9;
}

/* Alert */
.alert-sm{
    font-size: 0.9rem;
}

.alert-sm.alert-dismissible{
    padding-right: 2rem;
}

.alert-sm.alert-dismissible .close{
    padding: 0;
    top: 50%;
    right: 9px;
    margin-top: -13px;
}

/* Messages */
.error-block {
    margin-top: 5px;
    margin-bottom: 10px;
    color: #a94442;
    font-size:13px;
}

.success-block {
    margin-top: 5px;
    margin-bottom: 10px;
    color: var(--success);
    font-size:13px;
}

/* Preloader */
.admin-preloader,.admin-preloader .loader{
    display:flex;
    align-content:center;
}

.admin-preloader{
    position:fixed;
    width:100%;
    height:100%;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index:999999;
    padding:20px 0;
    flex-flow:column wrap;
    justify-content:center;
    align-items:center;
    perspective:700;
}

.admin-preloader .loader{
    text-align:center;
    margin:5px;
    border-radius:50%;
    border:4px solid #fff;
    flex-flow:column wrap;
    justify-content:center;
    align-items:center;
    transform-style:preserve-3d;
    position:relative;
}

.admin-preloader .admin-preloader .loader-inner-1{
    animation:admin_preloader_change_first_circle 2s ease-in-out infinite;
}

.admin-preloader .loader-inner-2{
    animation:admin_preloader_change_second_circle 2s ease-in-out infinite;
}

.admin-preloader .loader-inner-3{
    width:100px;
    height:100px;
    animation:admin_preloader_change_last_circle 3s linear infinite;
}

@keyframes admin_preloader_change_first_circle{
    50%{transform:rotateX(360deg) scale(.8)}
}

@keyframes admin_preloader_change_second_circle{
    50%{transform:rotateY(360deg) scale(.8)}
}

@keyframes admin_preloader_change_last_circle{
    50%{transform:rotateX(360deg) scale(.8)}
}

/* Container */
@media (min-width: 576px) {
    .container-sm, .container {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .container-md, .container-sm, .container {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .container-lg, .container-md, .container-sm, .container {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1140px;
    }
}

@media (min-width: 1500px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1440px;
    }
}

/* Password input */
input[type="text"].password {
    font-family: "text-security-disc";
}

/* Label */
.status-label{
    display: inline;
    padding: .2em .6em .3em;
    font-size:86%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
    cursor:default;
}

.status-label-active,
.status-label-yes,
.status-label-completed{
    background-color: var(--success) !important;
}

.status-label-inactive,
.status-label-no{
    background-color: var(--danger) !important;
}

.status-label-deleted{
    background-color: var(--warning) !important;
}

.status-label-processing{
    background-color: var(--primary) !important;
}

.status-label-pending{
    background-color: var(--dark) !important;
}

.status-label-uploading{
    background-color: var(--purple) !important;
}


/* FileStyle */
.bootstrap-filestyle > input[type="text"]{
    color:#777!important;
}

/* Plugin List */
.plugin-identifier{
    font-size:12px;
    color:#777;
}

.plugin-identifier-id{
    font-weight: bold;
    font-size:11px;
    color:#777;
}

/* Table */
table.table.table-vertical-align-middle tbody > tr > td{
    vertical-align: middle;
}

/* Dropdown */
.dropdown-menu.show{
    transform: unset!important;
}

.dropdown-toggle::after{
    vertical-align: middle;
}

/* Jodit Editor */
.jodit-filebrowser-tree__item{
    text-decoration: none!important;
}
.jodit-toolbar-collection .jodit-toolbar-content_sort{
    display: none!important;
}

/* Modal */
.modal .modal-header button.close{
    outline: 0;
}

.modal.modal-full {
    padding: 0 !important;
}

.modal.modal-full.show {
    display: flex !important;
    flex-direction: column !important;
}

.modal.modal-full .modal-dialog {
    max-width: 100% !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    flex: 1 !important;
}

.modal.modal-full .modal-dialog .modal-content {
    border: none !important;
    border-radius: unset !important;
    height: 100% !important;
}

/**
 * Pages
 */

/* Login Page */
.login-image-logo{
    width: auto;
    height: auto;
    max-width: 74%;
}


/*
 * Custom for current project
 */
body.admin #top-navbar{
    background: #3e57a2 !important;
}

body.admin  #top-navbar .navbar-search,
body.admin  #top-navbar #searchDropdown{
    display:none !important;
}

body.admin #top-navbar .topbar-divider{
    border-color: rgba(255,255,255,0.2);
}

body.admin #top-navbar > .navbar-nav > .nav-item > a,
body.admin #top-navbar > .navbar-nav > .nav-item > a > *,
body.admin #top-navbar > .navbar-nav > .nav-item > a:hover{
    color: rgba(255,255,255,0.7) !important;
}

body.admin #top-navbar > .navbar-nav > .nav-item > a:active,
body.admin #top-navbar > .navbar-nav > .nav-item.dropdown.show > a,
body.admin #top-navbar > .navbar-nav > .nav-item.dropdown.show > a > *{
    color: #ffffff !important;
}

body.admin .sidebar > li.nav-item:hover > a,
body.admin .sidebar > li.nav-item.active > a{
    background-color: rgba(255,255,255,0.1);
}

body.admin .sidebar .nav-item .nav-link{
    padding: 0.5rem 1rem;
}

body.admin .sidebar .nav-item > div[id^="menu-collapse"]{
    margin: 0;
}

body.admin .sidebar .nav-item > div[id^="menu-collapse"] > div{
    border-radius: 0 !important;
}

body.admin .navbar-content > .accordion-sidebar .sidebar{
    background: #4564c2!important;
}

body.site .bg-login-image{
    background-color: #3e57a2;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

body.site .card{
    border-radius: 4px;
    border: none;
    overflow: unset !important;
}

/**
 * Mobile
 */
@media (max-width: 767.98px) {
    .nav-username {
        font-size: 14px;
    }

    table.dataTable td, 
    table.dataTable th{
        font-size: 14px;
        padding: .55rem;
    }
}

@media (max-width: 575.98px) {
    .nav-username {
        font-size: 10px;
    }

    .nav-fixed .topbar .sidebar-brand img {
        width: 55%;
    }

    table.dataTable td, 
    table.dataTable th{
        font-size: 13px;
    }
}

@media (max-width: 450px) {
    .nav-username {
        font-size: 10px;
    }

    .nav-fixed .topbar .sidebar-brand img {
        width: 65%;
    }
}

@media (max-width: 400px) {
    .nav-username {
        font-size: 10px;
    }

    .nav-fixed .topbar .sidebar-brand img {
        width: 75%;
    }

    table.dataTable td, 
    table.dataTable th{
        font-size: 12px;
    }
}

@media (max-width: 350px) {
    #sidebarToggleTop.mr-3, 
    #sidebarToggleTop.mx-3 {
        margin-right: 5px !important;
    }

    .nav-fixed .topbar .sidebar-brand img {
        width: 85%;
    }
}