:root {
    --mm-size: 80%;
    --mm-min-size: 375px;
    --mm-max-size: 375px;
}

header {
    --textColor: #fff;
}

#charts {
    overflow: auto;
    position: relative;
}

/*------------mmenu-colors------------*/
#mmenu {
    --textColor: rgb(0 0 0 / 0.8);
    --bgColor: #f3f3f3;

    /*--textHover:;*/
    /*--bgHover:;*/
}
.mm-listview, .mm-navbars--top .mm-navbar {
    background: var(--bgColor) !important;
}
.mm-listitem, .mm-panel.mm-panel--opened ul li a span, .mm-panel__noresults {
    color: var(--textColor);
}
.mm-btn--next:after {
    border-color: var(--textColor) !important;
}
.mm-panel.mm-panel--opened ul li.mm-listitem--selected a, .mm-panel.mm-panel--opened ul li:hover a {
    color: var(--primary) !important;
    background-color: var(--white);
}

/*------------/mmenu-colors------------*/

body {
    font-family: 'Almarai', sans-serif;
    overflow-x: hidden;
    overflow-y: hidden;
}

body *::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

body *::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

body *::-webkit-scrollbar-thumb {
    background-color: var(--darkgrey);
}

body *::-webkit-scrollbar-thumb:hover {
    background-color: var(--secondary);
}
.border-white {
    border-color: var(--textColor, var(--white)) !important;
}
/*-------------------------svg login template-------------------------*/
.bg-login .cls-1 {
    opacity: 0.41;
}

.bg-login .cls-2 {
    fill: var(--warning);
}

.bg-login .cls-3 {
    fill: var(--warning);
}

.bg-login .cls-3, .bg-login  .cls-7 {
    opacity: 0.5;
}

.bg-login .cls-4 {
    fill: #ecf1f7;
}

.bg-login .cls-5 {
    fill: #1e1e1e;
}

.bg-login .cls-12, .cls-6 {
    fill: #fff;
}

.bg-login .cls-8 {
    fill: var(--primary);
}

.bg-login .cls-9 {
    fill: #ccc;
    opacity: 0.43;
}
.bg-login .cls-10 {
    opacity: 0.26;
}

.bg-login .cls-11 {
    fill: var(--warning);
}

.bg-login .cls-12 {
    opacity: 0.25;
}

.bg-login .cls-13 {
    fill: #1e1e1e;
}

.bg-login .cls-14 {
    fill: var(--primary);
    font-size: 50px;
    font-family: SegoeUI-Bold, Segoe UI;
    font-weight: 700;
}

/* -------------------------/svg login template------------------------- */
.toolbar > div.row::after {
    content: "";
    position: absolute;
    top: calc(100% - 2px);
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--light);
    z-index: 0;
}

.toolbar > div.row ul.navbar-nav {
    position: relative;
    z-index: 1;
}

.toolbar > div.row ul.navbar-nav::-webkit-scrollbar-track {
    box-shadow: none;
}

#page {
    display: none;
}

i {
    cursor: pointer !important;
    transition: all .3s !important;
}

.w-handle {
    padding-left: .5rem;
    text-align: start;
    min-width: 60% !important;
    max-width: 65% !important;
}

.k-i-calendar:before {
    content: "\f272";
    font-family: "Font Awesome 6 Free";
}

.login .logo {
    width: 25%;
}

.login .gap {
    gap: 16px;
}

.navbar form.search input, input[type="text"], input[type="search"], input[type="password"], textarea, .form-control, button, .login .dropdown a, .login .dropdown-menu, .k-dropdown, .k-dropdown-wrap .k-state-default
.k-autocomplete, span.k-autocomplete, .k-block, .k-calendar-container, .k-colorpicker, .k-combobox, .k-datepicker, .k-datetimepicker, .k-drag-clue, .k-dropdown, .k-dropdown-wrap, .k-editor-inline, .k-gantt-views, .k-gantt-views > .k-current-view, .k-grid .k-filter-options, .k-grouping-header .k-group-indicator, .k-inline-block, .k-list-container, .k-multiselect, .k-numeric-wrap, .k-numerictextbox, .k-picker-wrap, .k-slider-selection, .k-slider-track, .k-textbox, .k-timepicker, .k-touch-scrollbar, .k-treeview .k-in, .k-upload, .k-state-default > .k-select {
    border-radius: 0 !important;
    box-shadow: none !important;
}

span.k-autocomplete, .k-icon-button {
    border: 0;
}

.navbar {
    padding: 0.2rem 0rem;
}

header .navbar .k-animation-container {
    top: 55px !important;
    left: auto !important;
    right: 20px !important;
    width: 350px !important;
    position: fixed !important;
}

header .navbar .k-menu .k-animation-container .k-menu-group, header .k-menu-popup.k-popup {
    width: 100%;
    margin-left: 0 !important;
}


.fa-1-5x {
    font-size: 1.5rem !important;
}

.fa-2-2x {
    font-size: 2.2em !important;
}

.line-h {
    margin: 0rem .7rem;
    width: 1px;
    height: 40px;
    background: var(--textColor);
}

.navbar form.search {
    position: relative;
}

.navbar form.search input {
    display: block !important;
    margin: 0 !important;
    padding-right: 2rem;
    border: 0 !important;
}

.navbar form.search button {
    padding: 0rem .5rem;
    position: absolute;
    top: 50%;
    right: 0.5rem;
    height: 95%;
    color: gray;
    background: transparent;
    border: 0;
    transform: translateY(-50%);
    z-index: 9;
}

.login .row .col-lg-6 {
    height: 100vh;
}

.login .lan > div {
    height: 100% !important;
}

.login .lan > div {
    background-size: 50%;
    background-position: center center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
}

.login .form {
    width: 60%;
}

.login form .form-group, .reset form .form-group {
    position: relative;
}

.login form .form-group label, .reset form > .form-group label {
    position: absolute;
    color: #fff;
    background: #8B8B8B !important;
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.login form .form-group input[type="text"], .login form .form-group input[type="password"], .reset form .form-group input[type="text"] {
    padding-right: 55px;
}

.reset > div {
    width: 40%;
}


.login .dropdown a {
    padding: .01rem 0rem .01rem .01rem !important;
}

.login .dropdown-menu .dropdown-item {
    margin-bottom: 2px;
    padding: 0rem 0.7rem !important;
}

.lang span {
    font-size: .9rem;
}

.tc-color {
    margin: 0rem .07rem;
    border-radius: 50%;
    display: inline-block;
    width: 10px;
    height: 10px;
    box-shadow: 0px 0px 5px #555555;
}

.k-menu .k-item > .k-link {
    position: relative;
}

.navbar .k-menu .k-menu-link .k-menu-expand-arrow {
    position: absolute;
    right: calc(100% - .5em);
}

.k-menu .k-item .k-i-arrow-60-down {
    display: none !important;
}

header ul.navbar-nav li a i {
    margin-left: .5rem;
    padding: .7rem;
    color: var(--textColor);
    border: 1px solid var(--textColor);
    border-radius: 50%;
}

header ul.navbar-nav li a i.fa-face-smile {
    padding: 0.5rem;
    font-size: 1.4rem;
    font-weight: 500;
}

header ul.navbar-nav li a i.fa-face-smile:hover::before {
    content: "\f119";
}

.highcharts-credits {
    display: none !important;
}

#charts .container-drag .box {
    color: var(--black);
    background: var(--light) !important;
}


.mm-navbar {
    flex-direction: column-reverse;
}
.mm-navbar .mm-searchfield__input input {
    height: auto !important;
}
.mm-navbar .mm-navbar__breadcrumbs {
    padding-top: 0.7rem;
}

.mm-panels {
    text-align: start;
}

.mm-counter {
    padding-right: 20px;
    padding-left: 0;
}

.mm-listitem__btn {
    padding: 20px;
}

.tabs .k-tabstrip {
    padding: 0;
    background: transparent !important;
    border: none !important;
    font-size: inherit;
}

.k-grid, .k-table, .k-splitter, .title{
    font-size: inherit;
}

.tabs .k-tabstrip-content, .tabs .k-tabstrip > .k-content {
    border: 0;
    padding: 0 1px;
}

.tabs {
    position: relative;
}

.tabs .quick-icons-one-invoice {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9;
}

.tabs .title {
    padding: .2rem 0rem;
    font-size: 1rem;
    background: var(--warning);
    border-bottom: 0.01em dotted white;
}

header .navbar .collapse .theme-lang .lang svg {
    width: 2rem !important;
}
header .navbar .collapse .theme-lang .lang svg path {
    fill: var(--textColor) !important;
}

header .navbar .collapse .theme-lang .theme div {
    width: 12px;
    height: 23px;
}

.tabs #tabstrip .info .border.border-light {
    border-width: 2px !important;
}

.k-splitter {
    height: 100vh;
    overflow-x: clip;
}

.k-splitter .k-scrollable {
    background: var(--white) !important;
    z-index: 9;
}

.k-splitter .k-splitbar-horizontal.k-splitbar-draggable-horizontal {
    z-index: 9;
}

.k-splitbar-horizontal .k-icon {
    left: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.k-treeview span.k-in {
    border-radius: 5px !important;
    padding: .3rem .9rem;
}

.window-save {
    width: 50%;
}

.window-errors, .window-warnings {
    width: 65%;
}

.window-errors .container, .window-warnings .container {
    max-height: 70vh;
    overflow: auto;
}

.window-errors .bg-danger {
    background: red !important;
}

.window-warnings .bg-danger {
    background: yellow !important;
}

.window-errors .bg-danger a.text-white i {
    font-size: 1.2rem;
}

.window-warnings .bg-danger a.text-black i {
    font-size: 1.2rem;
}

.window-printing, .window-errors, .window-save, .window-warnings {
    top: 70px;
    left: 50%;
    transform: translate(-50%);
    z-index: 9999999999;
}

.window-printing > div, .window-errors > div, .window-warnings > div {
    background: var(--white);
}

.window-errors > div {
    border: 1px solid red !important;
}

.window-warnings > div {
    border: 1px solid yellow !important;
}

.window-printing .container a {
    text-decoration: none;
    transition: all .3s !important;
}

.window-printing .container p {
    font-size: .95rem;
}

.btn-printing i {
    transform: scaleX(-1);
}

.btn-close-printing, .btn-close-save, .btn-close-errors {
    color: var(--white) !important;
}

.k-upload .k-upload-button {
    margin: 0 !important;
}

.k-upload .k-dropzone {
    padding: .4rem;
    background: transparent !important;
    border: 1px solid var(--secondary) !important;
    border-radius: 0 !important;
}

.k-rtl .k-dropzone em {
    font-style: normal !important;
}

.employee-img {
    height: 290px;
    background: var(--light);
    border: 1px solid var(--secondary);
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

/*.k-list-item.k-focus, .k-list-item:focus {*/
/*    box-shadow: none;*/
/*}*/

.tabs #tabstrip.tab-strip div.info.k-rtl {
    height: calc(100vh - (48px + 44px + 54px + 30px));
    padding-bottom: 4rem !important;
}


/*---------------------------- mainColors -----------------------------------*/
.k-column-menu ul li:hover span.k-link.k-menu-link {
    background: var(--darkgrey) !important;
}

.k-input-button.k-button {
    color: var(--secondary) !important;
    background: transparent !important;
}

.k-input-button.k-button:hover {
    color: var(--primary) !important;
    background: transparent !important;
}

.k-button {
    border-color: var(--darkgrey) !important;
    box-shadow: none !important;
    transition: all .3s !important;
}

.k-button i {
    transition: all 0s !important;
}

.k-action-buttons .k-button.k-upload-selected.k-primary {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
}

.k-upload-status .k-upload-action {
    border-radius: 50% !important;
}

.k-button:active, .k-button:hover {
    color: var(--white) !important;
    background: var(--primary) !important;
    border-color: var(--primary) !important;
}

.k-radio:checked {
    color: var(--primary) !important;
}

.border-secondary {
    border: 1px solid var(--secondary) !important;
}

.border-primary, ._ref:has(.k-focus):not(.nama-disabled), .k-table-td.k-focus, .cellInEdit.k-focus, .n-rich-text:focus {
    border: 1px solid var(--primary) !important;
    box-shadow: none;
}


.mm-listitem--selected {
    color: var(--primary) !important;
}

.bg-primary {
    background-color: var(--primary) !important;
}

.text-primary, #gridAllVoice table tbody td .text-primary {
    color: var(--primary) !important;
}

a.text-primary:hover {
    color: var(--primary) !important;
}

.btn {
    transition: all .3s !important;
}

.btn-primary, .btn-warning:hover, .btn-outline-primary:hover {
    color: var(--white) !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.btn-outline-primary {
    color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.btn-warning, .btn-primary:hover {
    color: var(--white) !important;
    background-color: var(--warning) !important;
    border-color: var(--warning) !important;
}

.bg-warning {
    background: var(--warning) !important;
}

.text-secondary {
    color: var(--secondary) !important;
}

.text-light {
    color: var(--light) !important;
}

.text-white {
    color: var(--textColor, var(--white)) !important;
}
.bg-light {
    background: var(--light) !important;
}

.border-light {
    border-color: var(--light) !important;
}

#Loading-Message {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    display: grid;
    place-items: center;
    background: var(--white);
    z-index: 9999999999999999999999999999999999999999999999999999999999999999;
}

#Loading-Message .head {
    position: relative;
}

#Loading-Message .logo svg #Path_4, #Loading-Message .logo svg #Path_5 {
    fill: rgba(0, 0, 0, .15) !important;
    transition: fill .2s !important;
}

#Loading-Message .logo svg #Path_6, #Loading-Message .logo svg #Path_7, #Loading-Message .logo svg #Path_8, #Loading-Message .logo svg #Path_1, #Loading-Message .logo svg #Path_2, #Loading-Message .logo svg #Path_3 {
    fill: rgba(0, 0, 0, .15) !important;
    transition: fill .2s !important;
}

#Loading-Message .percentage {
    color: rgba(0, 0, 0, .2) !important;
    transition: color .2s !important;
}

#Loading-Message.inner {
    background: rgba(0, 0, 0, .5) !important;
}


/*---------------- capital ---------------------*/
.capital .cls-1 {
    fill: url(#radial-gradient);
}

.capital .cls-2 {
    fill: url(#radial-gradient-2);
}

.capital .cls-3 {
    fill: url(#radial-gradient-3);
}

.capital .cls-4 {
    fill: url(#radial-gradient-4);
}

.capital .cls-5, .capital .cls-6, .capital .cls-7 {
    isolation: isolate;
}

.capital .cls-6, .capital .cls-7 {
    font-size: 8.72px;
    font-family: ArialMT, Arial;
}

.capital .cls-6 {
    fill: #232323;
}

.capital .cls-7 {
    fill: #174e9b;
}
/*---------------- /capital ---------------------*/

/*---------------- exceed ---------------------*/
.exceed .cls-1 {
    fill: var(--warning);
}
.exceed .cls-4 {
    fill: var(--primary);
}
.exceed .cls-2 {
    fill: #676767;
}

.exceed .cls-3 {
    fill: var(--primary);
}
/*---------------- /exceed ---------------------*/

/*---------------- softvision ---------------------*/
.cls-1 {
    fill: var(--primary);
}
/*---------------- /softvision ---------------------*/

.spinner {
    animation: rotate 3.5s linear infinite;
    background: rgba(0, 0, 0, .15);
    border-radius: 50%;
    height: 250px;
    width: 250px;
    position: relative;
    margin: auto;
}

.spinner::before,
.spinner::after {
    content: '';
    position: absolute;
}

.spinner::before {
    border-radius: 50%;
    background: linear-gradient(0deg, hsla(0, 0%, 100%, 1) 50%, hsla(0, 0%, 100%, 0.9) 100%) 0% 0%,
    linear-gradient(90deg, hsla(0, 0%, 100%, 0.9) 0%, hsla(0, 0%, 100%, 0.6) 100%) 100% 0%,
    linear-gradient(180deg, hsla(0, 0%, 100%, 0.6) 0%, hsla(0, 0%, 100%, 0.3) 100%) 100% 100%,
    linear-gradient(360deg, hsla(0, 0%, 100%, 0.3) 0%, hsla(0, 0%, 100%, 0) 100%) 0% 100%;
    background-repeat: no-repeat;
    background-size: 50% 50%;
    top: -1px;
    bottom: -1px;
    left: -1px;
    right: -1px;
}

.spinner::after {
    background: var(--white);
    border-radius: 50%;
    top: 1.3%;
    bottom: 1.3%;
    left: 1.3%;
    right: 1.3%;
}

.spinner div {
    width: 20px;
    height: 20px;
    background: rgb(214, 214, 214);
    border: 3px solid var(--white);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-7px, -50%);
    z-index: 9999999999;
    transition: all .2s !important;
}

#Loading-Message .logo {
    padding: 2rem;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    transform: translate(-50%, -50%);
    box-shadow: 0px 0px 12px -5px #888;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.login h2 {
    color: var(--warning);
}

.login #forgotPassword {
    color: var(--primary);
}

.reset {
    background-color: var(--primary);
}

.reset form p {
    color: var(--warning);
}

.reset .sent_code label span, .reset .sent_code label i {
    color: var(--secondary);
}

input[type="radio"]:checked + label * {
    color: var(--primary);
}

.k-checkbox:checked, .k-checkbox.k-checked {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.k-checkbox:focus {
    box-shadow: 0px 0px 6px -2px var(--primary) !important;
}

.login .k-picker {
    color: var(--white) !important;
    background-color: transparent !important;
    border-color: var(--white) !important;
}

.login .k-picker button,
.login .k-picker button:hover {
    color: var(--white) !important;
}

.login .k-picker.k-focus, .login .k-picker:focus {
    border-color: var(--white) !important;
    box-shadow: 0 0 10px 0 var(--warning) !important;
}

.k-datepicker .k-input-button {
    position: absolute;
    right: 0;
    z-index: 99;
}

.k-dropdown, .k-dropdown-wrap .k-state-default
    /*.k-autocomplete, .k-block, .k-calendar-container, .k-colorpicker, .k-combobox, .k-datepicker, .k-datetimepicker, .k-drag-clue, .k-dropdown, .k-dropdown-wrap, .k-editor-inline, .k-gantt-views, .k-gantt-views > .k-current-view, .k-grid .k-filter-options, .k-grouping-header .k-group-indicator, .k-inline-block, .k-list-container, .k-multiselect, .k-numeric-wrap, .k-numerictextbox, .k-picker-wrap, .k-slider-selection, .k-slider-track, .k-timepicker, .k-touch-scrollbar, .k-treeview .k-in, .k-upload {*/
    /*    border-color: var(--white) !important;*/
    /*}*/
.k-dropdown .k-input, .k-dropdown .k-state-focused .k-input, .k-multiselect .k-button, .k-button-solid-primary, .k-button-solid.k-selected, .k-multiselect .k-button:hover, .k-table-row.k-selected a {
    color: var(--white) !important;
}

.k-dropdown .k-input, .k-dropdown .k-state-focused .k-input, .k-multiselect .k-button, .k-button-solid-primary, .k-button-solid.k-selected, .k-table-row.k-selected, .k-master-row.k-table-row.k-selected td.k-grid-content-sticky, .k-multiselect .k-button:hover {
    background-color: var(--primary) !important;
}

.k-list > .k-state-focused.k-state-selected, .k-listview > .k-state-focused.k-state-selected, .k-state-focused.k-state-selected, td.k-state-focused.k-state-selected {
    box-shadow: inset 0 0 3px 1px var(--primary);
}

.k-draghandle.k-state-selected:hover, .k-ghost-splitbar-horizontal, .k-ghost-splitbar-vertical, .k-list > .k-state-highlight, .k-list > .k-state-selected, .k-marquee-color, .k-panel > .k-state-selected, .k-scheduler .k-today.k-state-selected, .k-state-selected, .k-state-selected:link, .k-state-selected:visited {
    color: var(--white) !important;
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.k-menu, .k-menu .k-item > .k-link, .k-menu-scroll-wrapper .k-item > .k-link, .k-popups-wrapper .k-item > .k-link,
.k-menu .k-item, .k-menu-scroll-wrapper .k-item, .k-menu-scroll-wrapper.horizontal > .k-item, .k-popups-wrapper .k-item, .k-popups-wrapper.horizontal > .k-item, .k-widget.k-menu-horizontal > .k-item {
    color: var(--textColor, var(--white)) !important;
    background-color: var(--primary) !important;
    background-image: none !important;
    /*border: none !important;*/
}

.k-menu .k-item > .k-link .fa-user, header .navbar .k-menu-group > .k-item #template .fa-user {
    margin: 0rem .2rem 0rem 0rem;
    padding: .5rem .6rem;
    font-size: 1.2rem;
    color: var(--textColor);
    background-color: var(--warning);
    border-radius: 50%;
}

header .navbar .k-menu-group > .k-item #template *, .tabs .k-widget *, .k-widget * {
    box-sizing: border-box !important;
}

header .navbar .k-menu-group > .k-item #template .optins .chang-color .k-dropdown-wrap, header .navbar .k-menu-group > .k-item #template .optins .change-font .k-dropdown-wrap {
    padding: 0;
}

header .navbar .k-menu-group > .k-item #template .optins .chang-color .k-dropdown-wrap .k-input, header .navbar .k-menu-group > .k-item #template .optins .change-font .k-dropdown-wrap .k-input {
    color: var(--black) !important;
    background: var(--light) !important;
    border-radius: 0 !important;
    transition: all .3s;
}

header .navbar .k-menu-group > .k-item #template .optins .chang-color .k-dropdown-wrap .k-input:hover, header .navbar .k-menu-group > .k-item #template .optins .change-font .k-dropdown-wrap .k-input:hover {
    color: var(--white) !important;
    background: var(--primary) !important;
}

header .navbar .k-menu-group > .k-item #template .optins .chang-color .k-select, header .navbar .k-menu-group > .k-item #template .optins .change-font .k-select {
    display: none !important;
}

header ul.navbar-nav li {
    position: relative;
}

header ul.navbar-nav li a span {
    position: absolute;
    top: -.1rem;
    left: 70%;
    width: 17px;
    height: 17px;
    font-size: .7rem;
    color: var(--textColor);
    background-color: var(--warning);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.quick-icons a, .quick-icons-one-invoice a {
    margin-left: 1rem;
    font-size: 1.3rem;
    transition: all .1s !important;
}

.toolbar ul.navbar-nav li a {
    margin: 0;
}

.toolbar ul.navbar-nav li {
    margin-right: 1rem;
}

.toolbar ul.navbar-nav li:last-child {
    margin-right: 2px !important;
}

.btn-printing svg {
    width: 1.4rem;
    margin-top: -2px;
    transition: all .3s !important;
}

.info .info-body i {
    transition: all .17s !important;
}

._ref a:hover i.text-secondary, a.text-secondary:hover, .quick-icons a.text-secondary:hover, .quick-icons-one-invoice a.text-secondary:hover, .info .info-body a:hover i.text-secondary, .info .info-body .k-state-default > .k-select:hover, ._ref .k-state-default > .k-select:hover {
    color: var(--primary) !important;
}

.k-picker-solid {
    border-color: var(--secondary);
}

.tabs .quick-icons .col-md-10 a, .tabs .quick-icons-one-invoice .col-md-10 a {
    margin-right: 0;
    margin-left: .6rem;
}

.tabs .quick-icons .col-md-10 a.text-light, .tabs .quick-icons-one-invoice .col-md-10 a.text-light {
    color: var(--light) !important;
}

#charts .container-drag .box .icons i {
    margin-right: .7rem;
    font-size: 1.2rem;
    color: var(--secondary) !important;
}

.grid-header-icons {
    cursor: default;
}
.mm-searchfield__input button {
    display: none !important;
}

.mm-menu--theme-light {
    --mm-color-focusring: var(--primary) !important;
}

header .navbar .k-menu-group > .k-item #template .k-button {
    transition: all .3s !important;
}

header .navbar .k-menu-group > .k-item #template .fa-user {
    padding: .7rem .8rem;
    font-size: 1.6rem;
}

.info .k-state-default > .k-select, .windowAccept .k-state-default > .k-select {
    color: var(--white);
    background-color: var(--secondary);
}

input, .info input, .windowAccept input, .windowAccept textarea, .k-numerictextbox {
    border: 1px solid var(--secondary) !important;
}

.k-numerictextbox input {
    border: none !important;
}

input.k-textbox, input[type="text"], input[type="password"], textarea {
    display: block;
    height: 100%;
    padding: 0.375rem 0.75rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    outline: none;
}

.k-edit-cell input.k-textbox, .k-edit-cell input[type="text"], .k-edit-cell input[type="password"], .k-edit-cell textarea {
    padding: 0.4rem 0.2rem;
}

.login input.form-control, .reset input.form-control {
    height: calc(1.5em + .75rem + 2px) !important;
}

.k-numerictextbox.k-focus, input:focus, .form-control:focus, .k-input:focus, .windowAccept input:focus, textarea:focus {
    outline: none !important;
    border: 1px solid var(--primary) !important;
    box-shadow: none !important;
}

.k-numerictextbox input:focus {
    border: none !important;
}

.info .k-input.p-2 {
    padding-top: .45rem !important;
    padding-bottom: .45rem !important;
}

.info .toggle-info {
    cursor: pointer;
}

.info .toggle-info:hover > i {
    color: var(--primary) !important;
}

.info .toggle-info i {
    transition: all .5s !important;
}

.info .toggle-info i.rotate, .grid a.toggle-grid i.rotate {
    transform: rotate(180deg);
}

ul.k-list.k-reset {
    text-align: right;
}

.report-icons a[role=button]:hover {
    cursor: pointer;
}

.tabs .k-tabstrip-items-wrapper {
    padding: 0rem .5rem;
    background: var(--warning) !important;
    border: none !important;
}

.tabs #tabstrip .k-tabstrip-items .k-tabstrip-item span {
    color: var(--white) !important;
    border: 0;
}

.tabs #tabstrip .k-tabstrip-items .k-tabstrip-item {
    padding: 0rem .1rem 0rem .1rem;
    font-weight: 200 !important;
    background: transparent;
    border: 0 !important;
    border-radius: 0 !important;
}

.tabs #tabstrip .k-tabstrip-items li.k-active {
    background: var(--white);
}

.tabs #tabstrip .k-tabstrip-items li.k-active span {
    color: var(--primary) !important;
}

.tabs .line-h {
    margin: 0;
    margin-left: 1rem;
    width: 2px;
    height: 25px;
    background: var(--light);
}

.tabs .info .line-w {
    width: 100%;
    height: 2px;
}


.k-tabstrip-prev {
    color: var(--white) !important;
}

.k-tabstrip-next {
    color: var(--white) !important;
}


.k-i-arrow-end-right, .k-i-arrow-end-left, .k-i-arrow-60-right, .k-i-arrow-60-left {
    font-family: "Font Awesome 6 Free";
    font-weight: 600;
}

.k-i-arrow-end-right:before {
    content: "\f04e";
}

.k-i-arrow-end-left::before {
    content: "\f04a";
}

.k-i-arrow-60-right::before {
    content: "\f0da";
}

.k-i-arrow-60-left::before {
    content: "\f0d9";
}


th, .k-grid-header, .k-grouping-header {
    background: var(--light) !important;
}
.k-grid .k-header.k-filterable {
    padding-right: 4px;
    padding-left: 4px;
}

.tabs .info .details tbody tr:hover, #windowSelect tbody tr:hover {
    background: var(--light);
}

tbody tr td {
    border-bottom: 1px solid #c5c5c5 !important;
}

td.checkbox-align, th.checkbox-align, .line-number-header {
    text-align: center;
    text-overflow: clip !important;
}

.k-grid td {
    text-overflow: clip !important;
}

thead tr:first-child th {
    text-align: center !important;
}

tbody tr td.k-command-cell a.k-button {
    margin: 0 !important;
    padding: 0rem 0.5rem !important;
    min-width: 0 !important;
    color: var(--warning) !important;
    background: none !important;
    border: 0 !important;
}

tbody tr td.k-command-cell a.k-button:hover {
    color: var(--primary) !important;
}

#gridOneVoice .k-dropdown .k-input, #gridAllVoice .k-dropdown .k-input, #gridSelectInner .k-dropdown .k-input {
    padding-left: .7rem;
    color: var(--secondary) !important;
    background: var(--white) !important;
    border: 1px solid var(--secondary) !important;
    border-radius: 0 !important;
}

.k-close-treeview-mobile {
    /*display:none;!*TODO: needs fix*!*/
}

.k-pager-numbers li span, .k-pager-numbers li:hover {
    min-width: auto;
    height: auto;
    color: var(--secondary) !important;
    background: var(--white) !important;
    border: none !important;
    box-shadow: none !important;
    transition: all .3s !important;
}

.k-pager-nav {
    border: none !important;
}

.k-button-flat-primary {
    color: var(--primary) !important;
    border: 0;
}

.tabs .info .details .k-pager-numbers li {
    padding: 0;
}

.k-animation-container .k-menu, .k-animation-container .k-menu .k-item, .k-animation-container .k-menu .k-item .k-link.k-menu-link, .k-animation-container .k-group, .k-animation-container .k-menu .k-item > .k-link::after {
    color: var(--black) !important;
    background: var(--light) !important;
}

.k-popup-header.k-group {
    top: 20px;
    width: 40vw;
    right: 20vw;
    background: var(--white) !important;
    border-top: 0;
}

.k-popup-header ol {
    max-height: 60vh;
    overflow-y: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

#notificationsPopup.k-popup-header ol li {
    margin: 1rem 0rem 3rem 0rem;
}

#acceptPopup.k-popup-header ol li {
    margin: .5rem 0rem;
}

.navbar-nav #notifications.k-state-border-down i, .navbar-nav #accept.k-state-border-down i {
    position: relative;
}

.navbar-nav #notifications.k-state-border-down i::after, .navbar-nav #accept.k-state-border-down i::after {
    content: "";
    position: absolute;
    top: calc(100% + 12px);
    left: calc(50% - 2px);
    width: 15px;
    height: 15px;
    background: var(--light);
    transform: rotate(45deg) translateX(-50%);
}

.k-popup-header ol li a {
    color: var(--primary) !important;
}

#notifications.k-state-border-down i,
#accept.k-state-border-down i {
    color: var(--warning) !important;
    background: var(--white) !important;
}

.dropright .dropdown-toggle::after {
    content: none !important;
}

.dropright .dropdown-toggle i {
    font-size: 1.3rem !important;
}

#acceptPopup ol.list-unstyled li {
    position: relative;
    padding: .5rem 1rem;
    border: 1px solid var(--light) !important;
    display: flex;
}

#acceptPopup ol.list-unstyled li a {
    display: inherit;
    color: var(--warning) !important;
    transition: all .3s !important;
}

#acceptPopup ol.list-unstyled li a:hover {
    color: var(--primary) !important;
}

#acceptPopup ol.list-unstyled li .btn {
    position: absolute;
    top: 50%;
    left: 90%;
    height: 100%;
    padding: 0rem 1.2rem;
    color: var(--darkgrey) !important;
    background: transparent !important;
    border: 0;
    transform: translateY(-50%);
}

#acceptPopup ol.list-unstyled li .btn:hover {
    color: var(--primary) !important;
}

.k-widget.k-window[aria-labelledby="windowQrCode_wnd_title"] {
    top: 50px !important;
    max-height: 85vh !important;
}

._ref {
    width: 100%;
    padding: 0;
    display: flex;
    align-items: center;
    border: 1px solid var(--secondary);
    transition: all .3s;
}

._ref input {
    border: 0 !important;
}


.info .details > div .icons a {
    margin-right: 0.5rem;
    font-size: 1.2rem;
    transition: all .17s !important;
}

.info .info-body .k-state-default > .k-select, ._ref .k-state-default > .k-select {
    color: var(--secondary) !important;
    background: transparent !important;
    transition: all .3s !important;
}

.info .info-body ._col .k-state-default > .k-select .k-icon.k-i-arrow-60-down, ._ref .k-state-default > .k-select .k-icon.k-i-arrow-60-down {
    left: -5px;
}

._ref .k-dropdown-wrap, .info .info-body .k-dropdown-wrap, .k-picker-wrap, .window-select .row .k-dropdown-wrap, .b-filter .row .k-dropdown-wrap {
    padding-left: 0 !important;
}

.info .info-body .k-picker-wrap .k-select {
    border: 0 !important;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: .7rem;
}

.k-email input, .k-location input {
    padding-left: 2rem !important;
}

.k-mobile-wa input {
    padding-left: 3.8rem !important;
}

.k-email a, .k-mobile-wa > div, .k-location a {
    position: absolute;
    top: 50%;
    left: 4px;
    transform: translateY(-50%);
}

.k-mobile-wa > div a i.fa-whatsapp {
    font-size: 1.2rem;
}

._ref a .fa-arrow-right, .k-email a .fa-arrow-right, .gridRefToGo .fa-arrow-right {
    font-size: 1.2rem;
    transform: rotate(-45deg);
}

.gridRefToGo .fa-arrow-right {
    transform: translate(4px, 2px) rotate(-45deg);
}

.k-clear-value {
    display: none !important;
}

#windowSelect .position-relative input {
    padding-right: 40px;
}

#windowSelect .position-relative a.search {
    position: absolute;
    top: 0;
    right: 0;
    width: 35px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

#windowSelect .row .k-dropdown .k-input, .b-filter .row .k-dropdown .k-input {
    color: var(--black) !important;
    background: var(--light) !important;
    border: 1px solid var(--darkgrey) !important;
    border-radius: 0 !important;
    transition: all .2s;
}

.b-filter {
    display: none;
}

.b-filter .row .k-state-default > .k-select {
    color: var(--black);
    background-color: transparent;
}

#windowSelect .row .k-dropdown:hover .k-input, .b-filter .row .k-dropdown:hover .k-input {
    color: var(--white) !important;
    background: var(--primary) !important;
    border-color: var(--primary) !important;
}

#windowSelect .row .k-dropdown:hover .k-select, .b-filter .row .k-dropdown:hover .k-select {
    color: var(--white) !important;
}

.b-filter .border-top {
    border-top: 2px solid var(--light) !important;
}

.b-filter .check-search input[type="checkbox"]:checked + label i.fa-thumbtack {
    color: var(--primary) !important;
    transform: rotate(-45deg);
}

._ref .k-input.combobox, #windowSelect .row .k-input.combobox {
    background: var(--white) !important;
    border: 0 !important;
}

._ref .k-dropdown-wrap:hover .k-input.combobox {
    background: var(--white) !important;
}

.k-picker.k-focus, .k-picker:focus, .k-widget.k-picker.k-focus, .k-widget.k-picker:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 4px 0 var(--primary) !important;
}

.k-list-item.k-selected.k-focus, .k-list-item.k-selected, .k-selected.k-list-optionlabel {
    background-color: var(--primary) !important;
}

.k-calendar td.k-state-selected .k-link {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.k-calendar .k-calendar-header .k-nav-today, .k-calendar .k-footer .k-nav-today,
.k-calendar .k-today .k-link,
.k-calendar .k-calendar-header .k-nav-today:focus, .k-calendar .k-calendar-header .k-nav-today:hover, .k-calendar .k-footer .k-nav-today:focus, .k-calendar .k-footer .k-nav-today:hover {
    color: var(--primary) !important;
}

.k-calendar td.k-state-focused .k-link,
.k-calendar .k-today .k-link {
    box-shadow: inset 0 0 4px 0 var(--primary) !important;
}

.k-treeview-leaf.k-selected {
    background-color: var(--primary) !important;
}

/*---------------------------- /mainColors -----------------------------------*/


.form-group .row .no-gutters.col-md-12 {
    padding: 0 !important;
}

.form-group .row .no-gutters.col-md-12 .k-picker.k-dropdownlist {
    border-radius: 0 !important;
}

.k-grid.k-widget {
    border: 0;
}

.k-animation-container:has( .k-notification-info ) {
    top: auto !important;
    bottom: 20px;
    left: auto !important;
    right: 20px !important;
    border: 2px solid var(--primary);
    border-radius: 0;
    box-shadow: 0px 3px 10px -5px #000;
    overflow-y: auto;
    overflow-x: auto;
    max-height: 60vh;
    max-width: 75vw;
}

.k-notification-info {
    padding: 0rem 1rem;
    color: #000;
    background-color: var(--white);
    border: none;
    text-align: start;
    line-height: 1.2rem;
}

.k-notification-info a {
    color: var(--primary) !important;
}

.k-animation-container:has( .k-notification-error ), .k-animation-container:has( .k-notification-success ) {
    top: 50px !important;
    margin: auto !important;
    left: 25% !important;
}

.k-notification-error {
    color: #000;
    background-color: #fff;
    right: auto;
    border: 2px solid red;
    border-radius: 0;
    box-shadow: 0px 3px 10px -5px #000;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 60vh;
}

.k-notification-error .row {
    margin-bottom: 1rem;
    padding: 0.5rem 1rem;
    color: #fff;
    background: red;
    display: flex;
    justify-content: center;
    align-items: center;
}

.k-notification-error .row #title {
    margin-bottom: 0;
    text-align: start;
}

.k-notification-error .row .col-md-2 {
    text-align: end;
}

.k-notification-error .row a {
    padding: 0rem 0.2rem;
    font-size: 1rem;
    color: var(--white) !important;
    text-decoration: none;
}

.k-notification-success {
    text-align: center;
    border: 0;
    border-radius: 0;
}

.k-animation-container:has( .k-tooltip.k-popup.k-group.k-reset.k-state-border-up ) {
    width: 100vw !important;
    height: 100vh !important;
}

.k-tooltip.k-popup.k-group.k-reset.k-state-border-up {
    bottom: 20px !important;
    left: 20px !important;
    text-align: start;
    background: white !important;
    border: 2px solid var(--primary);
    border-radius: 0;
    padding: 0.5rem;
    line-height: 1.2rem;
}

.k-tooltip.k-popup.k-group.k-reset.k-state-border-up .k-tooltip-content table tbody tr:first-child {
    font-weight: 600;
    background: var(--light) !important;
}

.k-tooltip.k-popup.k-group.k-reset.k-state-border-up .k-tooltip-content table td {
    padding: .2rem .4rem;
    text-align: center;
    border: 1px solid #dee2e6;
}

.k-tooltip.k-popup.k-group.k-reset.k-state-border-up .k-callout.k-callout-n {
    display: none !important;
}

.gridLineEditorHeader {
    margin-top: 1rem;
    margin-bottom: .5rem;
    padding: .5rem;
}

#supportEndDate{
    color: var(--warning);
}

.nama-link, .k-grid a, a, .nama-link:hover, a:hover {
    color: var(--primary);
}

.k-table-row.k-selected a {
    text-decoration: underline !important;
}

.navbar-brand {
    width: 100px;
    margin-right: 0 !important;
    margin-left: 1rem !important;
}
.capital-logo {
    width: 50px;
}
.softvision-logo {
    width: 150px;
}

i.fa-backward, i.fa-caret-left, i.fa-forward, i.fa-caret-right {
    transform: rotate(180deg);
}

i.fa-caret-left.fa-1-5x, i.fa-caret-right.fa-1-5x {
    margin-top: 5px;
}

.n-text-right {
    text-align: start;
}

.check-box-label {
    text-align: left !important;
}

.n-text-left {
    text-align: end;
}

.text-center {
    text-align: center !important;;
}

.search-window-label {
    text-align: start !important;
}

.k-rtl .k-pager-sizes .k-dropdown, .k-rtl .k-pager-sizes .k-dropdownlist, .k-rtl .k-pager-sizes > select, [dir=rtl] .k-pager-sizes .k-dropdown, [dir=rtl] .k-pager-sizes .k-dropdownlist, [dir=rtl] .k-pager-sizes > select {
    margin-left: 0;
    margin-right: 1ex;
}

.k-i-arrow-60-right, .k-i-arrow-end-right, .k-i-arrow-60-left, .k-i-arrow-end-left {
    transform: rotate(0deg) !important;
}

.k-window-content ul.ra-well-overlay.k-panelbar {
    border: 0;
}

.k-window-content ul.ra-well-overlay.k-panelbar li.k-state-active {
    overflow: hidden;
}

.k-window-content ul.ra-well-overlay.k-panelbar li.k-state-active div.info.k-rtl {
    overflow-y: scroll !important;
}

.k-window-content ul.ra-well-overlay.k-panelbar li.k-state-active #grid #splitter {
    width: 100%;
}

.k-dropdownlist, .k-list-item {
    border-radius: 0;
}

.k-list-item {
    margin-bottom: 2px;
}


.no-gutters .col-lg-8 {
    padding-left: 0.5rem;
    padding-right: 0;
}

.aloneFieldWithoutImg{
    padding-left: 0 !important;
}

.k-grid-header {
    padding-left: 0 !important;
}

.k-rtl .k-grid tbody td:last-child, .k-rtl .k-grid thead th:last-child {
    border-left-width: thin;
}

.menuSeparator {
    background-color: black;
    height: 2px;
}


.gridBtnsContainer {
    display: flex;
}
.grid-ref-row{
    margin-inline-end: -20px;
}
#grid.searchWindowContent:has( .nama-more-menu ) {
    margin: 0;
}

.moreActionsContainer {
    max-height: 95%;
    overflow: auto;
}

#copyToClipboard {
    color: var(--primary);
}

.nama-more-menu ul#moreActionsMenu {
    border: 0;
}

.nama-more-menu ul#moreActionsMenu li {
    border: 0;
    padding-inline-start: 5px;
    transform: translateX(5px);
}

.nama-more-menu ul#moreActionsMenu li.menuSeparator {
    background: var(--light);
    margin-bottom: 0.5rem;
    transform: translateX(5px);
}

.nama-more-menu ul#moreActionsMenu li span {
    margin-bottom: 0.5rem;
    padding: 0;
    color: var(--primary);
    background: none;
    box-shadow: none;
    cursor: pointer;
}

.nama-more-menu ul#moreActionsMenu li:hover span {
    text-decoration: underline;
}

.nama-more-menu ul#moreActionsMenu li span .k-icon {
    top: 4px;
}

.nama-more-menu ul#moreActionsMenu li span.k-state-selected .k-icon {
    color: var(--white) !important;
}

.nama-more-menu ul#moreActionsMenu li ul {
    padding: 0rem 1rem;
}

.form-group .col-lg-11.px-1 {
    padding: 0 0.1rem !important;
}

.highlightedField {
    border: 5px solid red !important;
}

.highlightedCell {
    background-color: red !important;
}

.k-list-ul {
    text-align: start !important;
}

.nama-disabled {
    opacity: 0.6;
    cursor: default !important;
}

.k-notification {
    background-image: none !important;
}

.k-notification-success {
    padding: 0.2rem;
    height: auto !important;
    background: #28a745 !important;
}

.window-printing:has( .animate__zoomIn ):after {
    content: "";
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: -70px;
    left: -50%;
    background: rgba(0, 0, 0, .5);
    z-index: -1;
}

.export-button {
    cursor: pointer;
}

.parent-qr {
    width: 100%;
    height: 100%;
    overflow: auto;
    text-align: center;
}

.k-grid-header-locked, #gridAllVoice .k-grid-content {
    border-left: 0 !important;
}

.k-grid-content-locked {
    border-right: 1px transparent !important;
    border-left: 1px solid #d5d5d5 !important;
}

.k-grid-header-locked {
    border-color: #d5d5d5 !important;
}

.k-grid-header-locked input.k-checkbox, .k-grid-content-locked input.k-checkbox {
    width: 15px !important;
    height: 15px !important;
}

.k-grid-content-locked tr.k-master-row td, .k-grid-header-locked th.k-header {
    border-left-color: #d5d5d5 !important;
    border-right-color: #d5d5d5 !important;
}

.k-rtl div.k-grid-footer {
    padding-left: 0 !important;
}

.invalidInput {
    border: 1px solid red;
}

.invalidCell {
    background-color: red;
}

.pointer-events-all {
    pointer-events: all !important;
}

.k-window:has( #aboutDialog ) {
    height: 95vh !important;
    border-radius: 0 !important;
}

.k-window-content:has( #aboutDialog ) {
    overflow: hidden;
}

#grid:has( #aboutDialog ) {
    overflow: auto;
}

#aboutDialog {
    padding: 15px 15px 0px 15px;
}

#aboutDialog .col-md-3 {
    padding: 5px 15px;
    background: rgba(0, 0, 0, .15);
}

#aboutDialog .col-md-9 {
    padding: 5px 15px;
    background: var(--light);
}

#aboutDialog .topBordered {
    margin: auto;
    margin-bottom: 2px;
}

#aboutDialog .topBordered .textAlignCenter {
    text-align: center;
}

.edit-view .k-grid-content, .edit-view .k-grid-content-locked {
    height: auto !important;
    min-height: 150px;
    max-height: 400px;
}

.edit-view .k-pane-wrapper.k-widget {
    height: auto !important;
}

.edit-view .k-grid {
    height: auto !important;
}

#gridAllVoice {
    min-height: 300px !important;
}

.width-fit-content {
    width: fit-content;
}

.lockColumn:before {
    content: "\e113";
}

.unlockColumn:before {
    content: "\e114";
}

.aggregatesColumn:before {
    content: "\e933";
    color: black;
}

.k-splitbar:focus, .k-splitbar.k-focus {
    background: var(--primary) !important;
}

.k-animation-container:has( #acceptPopup ), .k-animation-container:has( #notificationsPopup ) {
    width: fit-content;
    min-width: 30vw;
    max-width: 95vw;
    transform: translateX(calc(50vw - 50%)) translateY(50px) !important;
    top: .2rem !important;
    left: 200px !important;
}

.k-child-animation-container:has( #acceptPopup ), .k-child-animation-container:has( #notificationsPopup ) {
    width: 100% !important;
}

.k-window:has( .info.k-rtl ) .info-body.widgetsList {
    height: auto !important;
}

.nama-aggregates .k-expander-header {
    padding: 4px 8px 4px 8px;

}

.nama-aggregates .k-expander-title {
    text-transform: none;
    color: initial;
}

.nama-aggregates.k-expander-content {
    padding: 0;
}

.direction-ltr {
    direction: ltr;
}

#notificationsPopup .dropleft .dropdown-toggle::before, #acceptPopup .dropleft .dropdown-toggle::before {
    content: none;
}

.required-field:after {
    content: " *";
    color: var(--primary)
}

.uploadRemoveBtn {
    display: contents !important;
}

input::placeholder, .k-chip-label {
    padding-bottom: 4px;
}

.navbar-toggler:focus {
    outline: 0 !important;
}

.k-grid .k-pager-numbers-wrap select.k-dropdown {
    color: var(--black) !important;
    background-color: var(--white) !important;
}
.k-grid .k-pager-numbers-wrap select.k-dropdown:focus > option:checked {
    color: var(--white) !important;
    background-color: var(--primary) !important;
}

.edit-view .nama-collapsable.details {
    overflow: hidden;
}
.edit-view .nama-collapsable.details .info-body.widgetsList {
    overflow: auto;
}
.searchWindowContent.gridSelectInner td.line-number-header input.k-textbox {

    padding: 0.2rem;
    border: 1px dotted var(--darkgrey) !important;
    background: none !important;
}
.searchWindowContent.gridSelectInner colgroup col:first-child {
    width: 60px !important;
}
.searcherWindowBtns button.k-button {
    margin: 8px 0px;
    padding: 0.4rem 0.8rem;
}

.chartHeaderTitle {
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
}

.k-tabstrip-content:focus, .k-tabstrip-content.k-focus, .k-tabstrip > .k-content:focus, .k-tabstrip > .k-content.k-focus {
    outline: none;
}
.k-window:has(.windowSelect.window-select) {

}
.windowSelect.window-select .k-button-group.justify-content-center {
    padding: 0px 15px !important;
}
.n-rich-text {
    min-height: 4em;
    max-height: 6em;
    display: inline-block; /*note: wee had to add this line because display:flex caused bold and italic words to take a separate line*/
}
.spanned2.n-rich-text{
    min-height: 4em;
    max-height: 12em;
}
#ascDescGroup button, #conditionsGroup button {
    padding: 0.2rem 0.8rem;
}

.k-child-animation-container:has( .k-notification-info )  {
    width: fit-content !important;
}

/* Large devices (desktops, 992px and up) */
@media (max-width: 992px) {
    .login .row .col-lg-6 {
        height: 50vh !important;
    }

    .login .row .col-lg-6.lan {
        height: 50vh !important;
    }

    #tabstrip .info-body ._col, #tabstrip .info-body .k-input.p-2 {
        margin-bottom: 2px;
    }

    .custome-width {
        max-width: 100% !important;
    }
    .k-animation-container:has( .k-notification-info ) {
        width: 90%;
    }
    .k-animation-container:has( .k-notification-info ) .nama-info-notification {
        width: 100% !important;
    }
    .k-animation-container:has( #acceptPopup ), .k-animation-container:has( #notificationsPopup ) {
        top: 2.8rem !important;
        left: 0 !important;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 768px) {
    .k-animation-container:has( #acceptPopup ), .k-animation-container:has( #notificationsPopup ) {
        min-width: 50vw;
    }

    .reset > div {
        width: 90% !important;
    }

    .tabs .title {
        padding-top: .5rem !important;
    }

    .window-printing, .window-errors, .window-warnings {
        width: 90vw !important;
    }

    .window-save {
        width: 80vw !important;
    }

    body *::-webkit-scrollbar {
        width: 2px;
        height: 2px;
    }

    .k-popup-header.k-group {
        width: 70vw !important;
        right: 15vw !important;
    }

    .info .container-fluid {
        padding-left: 0;
        padding-right: 0;
    }

    .info .details > div .icons a {
        font-size: 1rem !important;
    }

    .navbar form.search button {
        right: 0 !important;
    }

    .no-gutters .col-lg-8 {
        margin-top: 0.25rem !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
    }

    .col-form-label.control-label {
        padding-bottom: 0 !important;
    }

    .fieldLabel.mb-2.mb-lg-0 {
        margin-bottom: 0 !important;
    }
    #gridAllVoice {
        height: 100% !important;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) {
    :root {
        --mm-size: 100%;
        --mm-min-size: 280px;
        --mm-max-size: 280px;
    }



    .k-animation-container:has( #acceptPopup ), .k-animation-container:has( #notificationsPopup ) {
        min-width: 80vw;
    }

    .login .row .col-lg-6 {
        height: auto !important;
    }

    .login .row .col-lg-6.lan {
        height: auto !important;
    }

    .login .form {
        width: 90% !important;
    }

    .login .lan > div {
        align-items: center !important;
        background-image: none !important;
    }

    .login #forgotPassword, .login .save-login label {
        font-size: .85rem;
    }

    header .navbar .k-animation-container {
        top: 250px !important;
        left: 50% !important;
        width: 95% !important;
        position: fixed !important;
        transform: translateX(-50%) !important;
    }

    header .navbar .k-menu .k-animation-container .k-menu-group {
        width: 100%;
        margin-left: 0 !important;
    }

    .tabs .k-tabstrip-items-wrapper {
        padding: .4rem 0rem 0rem 0rem !important;
    }

    .tabs .info.k-tabstrip-content, .tabs .info.k-tabstrip > .k-content {
        padding: 1em 0em !important;
    }

    .k-popup-header.k-group {
        width: 90vw !important;
        right: 5vw !important;
    }

    .k-widget.k-window.k-rtl.k-display-inline-flex {
        width: 95vw !important;
        left: 2.5vw !important;
    }

    .window-printing {
        width: 90vw;
    }

    #splitter.k-splitter #paneTreeView.k-scrollable {
        right: 0;
        transition: all .3s;
    }

    #splitter.k-splitter #paneTreeView .k-close-treeview-mobile {

        position: fixed;
        top: 0;
        left: 100%;
        right: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .7) !important;
        transition: all .3s;
    }

    #splitter.k-splitter #paneTreeView.k-state-collapsed .k-close-treeview-mobile {
        width: 0;
        opacity: 0;
    }

    .tabs #tabstrip .info .border.border-light.details .info-body .k-pane-wrapper.k-widget:has( .k-pane:empty ) {
        height: 0 !important;
    }
    .searcherWindowBtns button.k-button {
        padding: 0.25rem 0.4rem;
    }
    .k-window:has( .searcherWindowBtns ) {
        height: 95vh !important;
    }
}

/* DO NOT PUT ANY THING HERE, Media queries should be at the end of the file always*/