html {
    width: 100%;
}

body {
    overflow-x: hidden !important;
}

body.show-spinner > main {
    overflow: hidden !important;
}

/* Hide everything under body tag */
body.show-spinner > * {
    opacity: 0;
}

/* Spinner */
body.show-spinner::after {
    content: " ";
    display: inline-block;
    width: 30px;
    height: 30px;
    border: 2px solid rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    border-top-color: rgba(0, 0, 0, 0.3);
    animation: spin 1s ease-in-out infinite;
    -webkit-animation: spin 1s ease-in-out infinite;
    left: calc(50% - 15px);
    top: calc(50% - 15px);
    position: fixed;
    z-index: 1;
}

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

@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}

.background .mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

small.help-block {
    color: red;
}

.has-error input, .has-error select {
    border: 1px solid red;
}

.has-error .select2-dropdown, .has-error .select2-selection {
    border-color: red !important;
}

.form-control-feedback {
    width: 15px;
    margin: -25px 16px;
    float: right;
}

.has-error .form-control-feedback {
    color: red;
}

.has-success .form-control-feedback {
    color: #32CD32;
}

::-webkit-scrollbar {
    width: 3px;
}

/* Track */
::-webkit-scrollbar-track {
    background: var(--foreground-color);
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #555;
    border-radius: 3px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: var(--theme-color-1);
}

input[type="text"][disabled] {
    background: var(--foreground-color);
}

input[type="date"][disabled] {
    background: var(--foreground-color);
}

textarea [disabled] {
    background: var(--foreground-color) !important;
}

.uploadAutorizacao {
    border-radius: 4px;
}

.div_logoCliente{
    margin-top: 0.8rem;
}

.div_Cliente{
    margin-top: 0.8rem;
}

.logoCliente{
    border-radius: 4px;
}

.link-login {
    color: white !important;
}

.link-login:hover {
    color: #2ca02c;
}

.menu .main-menu ul li i {
    font-size: 27px;
    line-height: 39px;
}

.logo {
    width: 250px;
}

.bordstyle {
    background: linear-gradient(90deg, #E43C3C 5px, rgb(35, 34, 35) 4px);
}

.filter-search {
    background-color: var(--separator-color);
    color: var(--primary-color);
}

.filter-search:hover {
    background-color: var(--second-color);
    color: var(--foreground-color);
}
.filter-search:not(:disabled):not(.disabled).active,.btn-primary:not(:disabled):not(.disabled):active,.show>.btn-primary.dropdown-toggle{
    background-color: var(--theme-color-1);
    color: #FFFFFF;
}

.card-disabled, .card-disabled input, .card-disabled select {
    filter: grayscale(100%) brightness(50%);
    cursor: not-allowed;
}

#delete-notification{
    background-color: transparent;
    border: none;
}
#delete-notification:hover{
    background-color: #dc3545;
    border-radius: 2px;
    padding-top: 3px;
}

#delete-notification-jobs{
    background-color: transparent;
    border: none;
}
#delete-notification-jobs:hover{
    color: var(--second-color);
}

.remover:hover{
    background-color: #dc3545;
}

.btn-lg{
    border-radius: 0.35rem !important;
}
.btn{
    border-radius: 0.35rem !important;
}

.logo-single{
    width: 280px;
}

div#usersenha label{
    color: var(--third-color);
}

table#datatableRowsClient, table#datatableRows{
    border-collapse: unset;
}

table#datatableRowsWorker, table#datatableRows{
    border-collapse: unset;
}
table.data-table-funcionarios{
    border-collapse: unset !important;
}
.col-md-3 img.funcionarios {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    vertical-align: middle;
}
.required:after {
    content:" *";
    color: red;
}
.destaque-cliente{
    border-color: var(--theme-color-1);
}
.doc{
    font-size: 11px;
 }

.text-feedback, .text-feedback:hover{
    color: var(--primary-color);
}

.ck.ck-reset_all, .ck.ck-reset_all * {
    color: var(--primary-color) !important;
}

.small-collaborators{
    height: 50px;
}

.uppercase-text {
    text-transform: uppercase;
}

.linha-vertical {
    height: 100%;/*Altura da linha*/
    border-left: 1px solid;/* Adiciona borda esquerda na div como ser fosse uma linha.*/
    color: var(--separator-color);
    margin-right: 10px;
    margin-left: 8px;
}

.left-border-0{
    border-radius: 0 0.35rem 0.35rem 0 !important;
    margin-left: -1px;
}

.select2-dropdown{
    background-color: var(--foreground-color) !important;
}

.select2-container--bootstrap .select2-results__option[aria-selected=true] {
    background-color: var(--separator-color) !important;
    color: var(--primary-color) !important;
}

.select2-container--bootstrap .select2-search--dropdown .select2-search__field {
    background-color: var(--foreground-color)!important;
    color: var(--second-color)!important;
}

.select2-container--bootstrap .select2-dropdown {
    border-radius: 4px !important;
}

/* Quando a largura da viewport for 768px ou mais */
@media (min-width: 1080px) {
    .custom-truncate {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }
}

@media screen and (min-width: 760px) and (max-width: 1250px) {
    /* Your CSS styles for screens between 760px and 1250px go here */
    /* For example, you can change the background color */
    .logo {
        width: 160px;
    }
}

#selectable .ui-selecting { background: var(--second-color); }
#selectable .ui-selected { background: var(--third-color); color: white; }
#selectable { list-style-type: none; margin: 0; padding: 0; width: 450px; }
#selectable li { margin: 3px; padding: 1px; float: left; width: 100px; height: 80px; font-size: 4em; text-align: center; }

.field-container {margin-bottom: 10px;padding-right: 25px;position: relative;}
.field-container>i.fa-times {position: absolute;right: 0;top: 8px;}
.fixedHeader {position: fixed;top: 90px;background-color: var(--foreground-color);z-index: 100000;height: 45px; width: 87%;}


#clear-button-filter{
    padding: 4px;
}

#clear-button-filter:hover{
    background-color: red;
    padding: 4px;
    padding-top: 4px;
    border-radius: 3px;
    cursor: pointer;
}
.bg-card{
    background: var(--separator-color);
}

.select2-selection{
    background: var(--foreground-color) !important;
    color: var(--primary-color) !important;
    border: 1px solid var(--separator-color) !important;
    min-height: 38.39px !important;
}

.select2-selection__choice{
    background: var(--separator-color) !important;
    color: var(--primary-color) !important;
    border-color: var(--separator-color) !important;
}
/*Icone galeria*/
.baguetteBox-button#close-button:before {
    font-family: "Font Awesome 6 Pro" !important;
    content: "\f00d" !important;
}

.baguetteBox-button#next-button:before {
    font-family: "Font Awesome 6 Pro" !important;
    content: "\f054" !important;
}

.baguetteBox-button#previous-button:before {
    font-family: "Font Awesome 6 Pro" !important;
    content: "\f053" !important;
}