/*
* demo.css
* File include item demo only specific css only
******************************************************************************/

.menu .app-brand.demo {
    height: 64px;
    margin-top: 12px;
}

.app-brand-logo.demo svg {
    width: 22px;
    height: 38px;
}

.app-brand-text.demo {
    font-size: 1.75rem;
    letter-spacing: -0.5px;
    text-transform: lowercase;
}

/* ! For .layout-navbar-fixed added fix padding top tpo .layout-page */
/* Detached navbar */
.layout-navbar-fixed
    .layout-wrapper:not(.layout-horizontal):not(.layout-without-menu)
    .layout-page {
    padding-top: 76px !important;
}
/* Default navbar */
.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
    padding-top: 64px !important;
}

/* Navbar page z-index issue solution */
.content-wrapper .navbar {
    z-index: auto;
}

/*
* Content
******************************************************************************/

.demo-blocks > * {
    display: block !important;
}

.demo-inline-spacing > * {
    margin: 1rem 0.375rem 0 0 !important;
}

/* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
.demo-vertical-spacing > * {
    margin-top: 1rem !important;
    margin-bottom: 0 !important;
}
.demo-vertical-spacing.demo-only-element > :first-child {
    margin-top: 0 !important;
}

.demo-vertical-spacing-lg > * {
    margin-top: 1.875rem !important;
    margin-bottom: 0 !important;
}
.demo-vertical-spacing-lg.demo-only-element > :first-child {
    margin-top: 0 !important;
}

.demo-vertical-spacing-xl > * {
    margin-top: 5rem !important;
    margin-bottom: 0 !important;
}
.demo-vertical-spacing-xl.demo-only-element > :first-child {
    margin-top: 0 !important;
}

.rtl-only {
    display: none !important;
    text-align: left !important;
    direction: ltr !important;
}

[dir="rtl"] .rtl-only {
    display: block !important;
}

/*
* Layout demo
******************************************************************************/

.layout-demo-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 1rem;
}
.layout-demo-placeholder img {
    width: 900px;
}
.layout-demo-info {
    text-align: center;
    margin-top: 1rem;
}
.alert {
    margin: 12px 24px;
}

div.table-responsive>div.dataTables_wrapper>div.row:first-child {
    margin: 0 22px;
}
div.table-responsive>div.dataTables_wrapper>div.row:last-child {
    margin: 0 22px 8px 22px;
}

.dataTables_paginate .paginate_button a {
    margin: 0 !important;
    height: 100%;
}
.pull-right {
    float: right;
}
.permission_tabs.nav-align-top .nav-pills{
    background: #f9f9f9;
}
.permission_tabs ul li {
    border-bottom: 1px solid #d9dee3;
}
.mr-12 {
    margin-right: 12px;
}
.start-mark {
    color: red;
    font-size: 15px;
    padding-left: 3px;
}

@media (max-width: 768px) {
    .p-xs-0 {
        padding: 0;
    }
}

@media (max-width: 575px) {
    .approver {
        width: 100%;
    }

}
@media (min-width: 576px) {
    .approver {
        width: 100%;
    }
}
@media (min-width: 768px) {
    .approver {
        width: 50%;
    }
    .border-right {
        border-right: 1px solid #d9dee3;
    }
}
@media (min-width: 992px) {
    .approver {
        width: 20%;
    }
}
@media (min-width: 1200px) {
    .approver {
        width: 20%;
    }
}
@media (min-width: 1400px) {
    .approver {
        width: 20%;
    }
}


.approver-flex {
    margin-left: -0.5rem;
    padding-right: 0;
}
.action-divider-left {
    width: 80%;
    display: inline;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-right: 0;
}

.action-divider-right {
    border: 1px solid #d9dee3;
    margin-left: -4px;
    margin-top: -3px;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    line-height: 1.53;
    width: 15%;
    padding: 7px 10px;
}

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

tr.readonly select, tr.readonly input, tr.readonly .vendor_btn, tr.readonly .btn-outline-danger {
    background-color: #eceef1;
    opacity: 1;
    cursor: not-allowed;
    pointer-events: none;
}

.comment_date {
    font-size: 11px;
}

.red {
    color: #d60000c9;
}

.green {
    color: #016c01cf;
}
.preloader {
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 1001;
    background: #ffffff7d;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    vertical-align: middle;
    height: 100%;
}
.preloader .spinner-border {
    margin: auto;
}
select {
    width: 100%;
    display: block;
    width: 100%;
    padding: 0.4375rem 1.875rem 0.4375rem 0.875rem;
    -moz-padding-start: calc(0.875rem - 3px);
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.53;
    color: #697a8d;
    background-color: #fff;
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%2867, 89, 113, 0.6%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e);
    background-repeat: no-repeat;
    background-position: right 0.875rem center;
    background-size: 17px 12px;
    border: 1px solid #d9dee3;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.dropdown.bootstrap-select{
    width: 100% !important;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.53;
    color: #697a8d;
    background-color: #fff;
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%2867, 89, 113, 0.6%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e);
    background-repeat: no-repeat;
    background-position: right 0.875rem center;
    background-size: 17px 12px;
    border: 1px solid #d9dee3;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.bootstrap-select .dropdown-menu {
    min-width: 100% !important;
}

.bootstrap-select.multiselect-dropdown .dropdown-toggle{
    white-space: break-spaces;
    padding: 0;
    padding: 10px;
}

.bootstrap-select.multiselect-dropdown .dropdown-toggle .filter-option {
    position: relative;
    padding: 0;
}

.bootstrap-select.multiselect-dropdown .dropdown-toggle:before {
    content: none;
}

.dropup .bootstrap-select.multiselect-dropdown .dropdown-toggle::after {
    position: absolute;
    right: 6px;
    bottom: 32px;
}

.bootstrap-select.multiselect-dropdown .filter-option-inner-inner{
    margin-bottom: -45px;
}

.bootstrap-select.multiselect-dropdown .btn-light:hover {
    transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
}
.indent_counts .card-body {
    padding: 1.5rem 0.5rem;
}

.indent_counts .fw-semibold {
    font-size: 14px;
}
.auto_margin {
    margin: auto;
}
.fw-semibold-13 {
    font-size: 13px;
    font-weight: 600 !important;
}

.dataTables_length {
    margin-bottom: 13px;
    margin-left: 12px;
}

.dataTables_filter{
    margin-right: 12px;
}

.pagination{
    margin-bottom: 16px;
}
.center-align {
    text-align: center;
}
.vendor_error{
    text-transform: none;
    display: block;
}
.dropdown.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
}

.dropdown.bootstrap-select .btn-light:hover {
    transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
}

#indent_item_table td, #indent_payment_table td {
    padding: 0.625rem 0.25rem;
}
h5 span {
    font-size: 14px;
}
.vertically-middle {
    vertical-align: middle;
}