/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
.main-menu .navbar-header .navbar-brand .brand-text {
    color: #4C64E6;
    padding-left: 1rem;
    margin-bottom: 0;
    font-weight: 600;
    letter-spacing: 0.01rem;
    font-size: 1.25rem;
    animation: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s normal forwards 1 fadein;
}

er {
    color: #ea5455;
}

.brand-text-pos:hover:not(.disabled):not(:disabled) {
    background-color: transparent !important;
}

.brand-logo-img {
    max-width: 170px !important;
}

.letter_head {
    height: 80px;
    width: 100%;
}

.print_body_margin {
    margin: 20px;

}


.hidden_border {
    border-style: hidden;
}

@media (min-width: 576px) {
    .modal-slide-in .modal-dialog-view {
        width: 50rem !important;
    }
}

.brand-text-paydart {
    margin-bottom: -5px !important;
    color: #00389D;
    font-weight: 600;
    letter-spacing: 0.01rem;
    font-size: 1.00rem;
    animation: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s normal forwards 1 fadein;
}

.scroll_bar {
    overflow-y: scroll;
    max-height: 300px;
    width: fit-content;

}

.scroll_bar::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.scroll_bar {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

#uparrow:before {
    content: '\276F';
    transform: rotate(90deg) !important;
}


#downarrow:before {
    content: '\276E';

}

#uparrow,
#downarrow {
    font-size: 1.00rem;
    color: #4C64E6;
    display: inline-block;
    -ms-transform: rotate(90deg) !important;
    -webkit-transform: rotate(90deg) !important;

    padding: 10px;
}

.brand-logo-img-login {
    width: 170px;
}

.table_view> :not(caption)>*>* {
    padding: 1rem 0rem !important;
    border-bottom-width: 0px !important;
    word-break: break-all;
}

.margin-link-item {}

@media (min-width: 576px) {
    .modal-slide-in .modal-dialog-branding {
        width: 60rem !important;
    }
}

.form-switch-mode {
    width: 5.5rem !important;
    margin-right: 10px !important;
}

.form-switch-mode:not(:checked) {
    background-color: #ff9f43 !important;
    color: white
}

.color-white {
    color: white
}

.w-37 {
    width: 37% !important;
}

.ml-10 {
    margin-left: 10px;
}

.graph-no-data {
    height: 400px !important;
    vertical-align: middle !important;
    position: relative;
    top: 50%;
    ;
}

.color-dashboard-label {
    color: #6e6b7b
}

.badge-dot {
    display: inline-block !important;
    margin: 0;
    padding: 0;
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 0%;
    vertical-align: middle;
}

.info-badge-container {
    padding: 10px;
}

.badge {
    margin: 5px;
}

html.dark-layout .swal2-popup {
    background: rgba(15, 2, 2) !important;
    color: white !important;
}

.breadcrumb:not([class*='breadcrumb-']) .breadcrumb-item+.breadcrumb-item:before {
    margin-top: 0px !important;
}

.breadcrumb:not([class*='breadcrumb-']) .breadcrumb-item+.breadcrumb-item.dashboard:before {
    margin-top: 5px !important;
}

label input[type=checkbox] {
    margin-top: 5px !important;
}

.code {
    padding: 20px;
    background-color: #292d3e;
    border-radius: 20px;
    font-size: 14px;
    margin: 20px 0px !important;
}

.link {
    padding: 13px;
    background-color: #292d3e;
    border-radius: 5px;
    font-size: 14px;
    color: lightgray;
    margin: 20px 0px !important;
}

.color-purple {
    color: rgb(199, 146, 234);
    font-size: 20px !important;
}

.color-skyblue {
    color: rgb(137, 221, 255);
}

.color-blue {
    color: rgb(199, 146, 234);
}

.color-yellow {
    color: yellow;
    font-size: 13px;
}

.color-grey {
    color: rgb(191, 199, 213);
}

.color-orange {
    color: rgb(247, 140, 108);
}

.vertical-top {
    vertical-align: top !important;
}

.small-amount {
    float: right !important;
}

a.disabled {
    pointer-events: none;
    cursor: default;
}

.logo-wrapper img {
    width: 150px;
    height: auto;
}

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

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

.invoice-download {
    padding: 50px 100px;
}

.width-40 {
    width: 40% !important;
}

/* The message box is shown when the user clicks on the password field */
#message {
    display: none;
    background: #fefefe;
    color: #000;
    position: relative;
    padding: 10px;

}

#message p {
    padding: 0px 35px;
    margin-bottom: -6px;

}

/* Add a green text color and a checkmark when the requirements are right */
.valid {
    color: green;
}

.valid:before {
    position: relative;
    left: -45px;
    content: "✔";
    margin-right: -30px;
}

/* Add a red text color and an "x" when the requirements are wrong */
.invalid {
    color: red;
}

.invalid:before {
    position: relative;
    left: -35px;
    content: "✖";
    margin-right: -30px;
}

.blockOverlay {
    position: fixed !important;
}

.picker {
    margin-left: -4px;
    width: 106%;
    text-align: left;
    position: absolute;
    top: 100%;
    margin-top: 0;
    z-index: 990;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-top: -14px;
}

.picker__select--month {
    width: 44%;
}

.picker__select--year {
    width: 27.5%;
}

.tooltip {
    z-index: 1040 !important;
}

.doc_label {
    font-size: 14px;
}

.row-above {
    border-top: solid 1px #ccc;
    padding-top: 20px;
}
.sort-header {
    cursor: pointer;
  }
  .sorted-asc:after {
    content: " ▲";
  }
  .sorted-desc:after {
    content: " ▼";
  }
  .action_btn_group{
    z-index: 9;
  }
  .export-group-buttons{
    z-index: 9;
  }
.sidebar-icon{
    width: 25px!important;
    height: 25px!important;
}
.header-navbar .navbar-container ul.navbar-nav li {
    margin:0px 5px!important;
}
.list-icon{
    border-radius: 0px;
    padding: 5px 10px;
    border: 1px solid #000;
    border-left: 1px solid #000;
    font-size: 38px;
    box-shadow: 0 10px 5px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    overflow: hidden;
    transition: background-color 0.3s, box-shadow 0.3s;
}
.badge-full-width span{
    width: 100% !important;
}
.badge.badge-light-expired {
    background-color: rgb(255 100 0 / 12%);
    color: #FF8C00!important;
}
.badge.badge-light-info {
    background-color:rgb(91 16 242 / 12%) !important;
    color: #001fe8 !important;
}