@import "_variables.css";
@import "_tables.css";
@import "_grid.css";
@import "_select2.css";
@import "_i18n.css";

.user-panel small{
    color: var(--gray);
}

/*for align actions buttons on index list's to right. */
.column-actions {
    text-align: center;
    /*width: 20%;*/
    width: 210px;
    min-width: 200px;
    max-width: 200px;
}

.navbar-nav > .user-menu > .dropdown-menu > .user-footer .btn-default:hover {
    color: rgba(0,0,0,.9);
    background-color: rgba(255,255,255,.1);
    border-color: #6c757d;
}

.user-avatar-image {
    width: 2.1rem !important;
    height: 2.1rem !important;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
    height: auto;
}

/*for align class="form-group col-md-4 no-padding-left" elements*/
.no-padding-left {
    padding-left: 0px;
}

.no-border {
    border: 0px none;
}

/*apply custom CSS styles to input(s) that have validation error, like below.*/
input.input-validation-error {
    border-color: red;
}

textarea.input-validation-error {
    border-color: red;
}

/*apply custom CSS styles to btn-darkorange. */
.btn-darkorange {
    background-color: darkorange;
    color: white;
}

.btn-lightgrey {
        background-color: lightgrey;
        color: white;
        }

    .btn-darkorange:hover {
        /*background-color: #ff8c00;*/ 
        background-color: #ff7008;
        color: white;
    }

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active, 
.sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active {
    background-color: darkorange;
    color: white;
}

/*cursor pointer on custom-switch-contro*/
.custom-switch {
    cursor: pointer;
    width: max-content;
}

.custom-control-label {
    cursor: pointer;
    width: max-content;
}

/* to use in the views' background*/
.content-wrapper {
    background-color: white;
}

/* to hidde elements*/
.hidden {
    display: none;
}

/*to customize select2-selection clear button*/
.select2-container--bootstrap4 .select2-selection__clear:hover {
    background-color: darkorange!important;
}


/*<modal style classes to print>*/
@media print {
    /* on modal open bootstrap adds class "modal-open" to body, so you can handle that case and hide body */
/*    body * {
        visibility: hidden;
    }*/
    
/*    body.modal-open {
        visibility: hidden;
    }*/

        body.modal-open .modal .modal-header,
        body.modal-open .modal .modal-body {
            visibility: visible; /* make visible modal body and header */
        }

        body.modal-open .modal .modal-footer {
            visibility: hidden; /* make visible modal body and header */
        }

    .no-print {
        visibility: hidden !important;
    }

    .modal-backdrop.show {
        opacity: 0;
        visibility: hidden !important;
    }
    .modal-backdrop {
        z-index: 1;
        background-color: transparent !important;
        visibility: hidden !important;
    }

    .printZoom80 {
        zoom: 80%;
    }
}
/*</modal style classes to print>*/

/*</formValidateFunction>*/
.HasError {
    border: solid 1px red;
    box-shadow: 0 0 10px red;
}

.alert2 {
    border: solid red 1px !important;
    border-radius: 5px;
}

li.checkImages img{
    max-block-size: 64px;
}