@charset "UTF-8";

#header {
    z-index: 4 !important;
}


.modulo-tooltip {
    background: #3b3b3b;
    position: relative;
    color: white;
    padding: 10px;
    margin-right: 20px !important;
    border-radius: 8px;
}

.card-header .gerar-pdf {
    position: absolute;
    top: 15px;
    right: 0;
}

.flex {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.flex-center {
    display: flex;
    justify-content: center;
}

.flex-column {
    display: flex;
    flex-direction: column;
}

#reciclagemLoading {
    width: 100vw;
    height: 100vh;
    position: fixed;
    z-index: 9999;
    display: flex;
    background: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center;
    align-content: center;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.spinner-loader {
    width: 100px;
    height: 100px;
    border-radius: 100%;
    position: relative;
    margin: 0 auto;
}

.spinner-loader[small] {
    width: 65px;
    height: 65px;
}

.spinner-loader:before,
.spinner-loader:after {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    border: 10px solid transparent;
    border-top-color: #3498db;
}

.spinner-loader:after {
    border: 10px solid #ccc;
}

.spinner-loader:before {
    z-index: 100;
    animation: spin 1s infinite;
}


.titulos {
    text-align: center;
    font-size: 16px;
    background-color: #f1f4f9;
    border: 1px solid #c9d3dd;
    height: 45px;
    margin-top: 13%;
    padding-top: 15px;
    line-height: 120%;
}

.top-menu > li > a {
    padding: 12px;
}

.top-menu {
    display: flex;
    align-items: baseline;
}

[data-current-skin="green"] {
    background-color: #009688;
}

[data-current-skin="blue"] {
    background-color: var(--main-color);
}

/*.btn.dropdown-toggle{
  padding: 8px 12px;
}*/

.modulo-item:hover {
    transform: scale(1.2);
}

#loading {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 3;
    background: url(../img/loading-graph.gif) center center no-repeat;
    background-color: white;
    opacity: 1;
    display: none;
}

#loadingDt {
    /* width: 100%;
    height: 100%; */
    position: fixed;
    top: 0;
    left: 0;
    z-index: 3;
    background: url(../img/loading-graph.gif) center center no-repeat;
    background-color: white;
    opacity: 1;
    display: none;
}

#main {
    padding-bottom: 0px;
    padding-top: 0px;
}

.k-grid-content {
    overflow-y: hidden;
}

.card-header.titulo {
    margin-top: 18%;
}

.card-header.report {
    background-color: var(--main-color) !important;
    color: #fff;
}

.card-header {
    font-size: 15px;
}

.titulos {
    text-align: center;
    font-size: 16.8px;
    background-color: #f1f4f9;
    border: 1px solid #c9d3dd;
    height: 45px;
    margin-top: 13%;
    padding-top: 15px;
    line-height: 120%;
}

/* .lc-block:not(.lcb-alt) {
  padding: 0 0 0;
} */

.lc-block:not(.lcb-alt) {
    padding-left: 10px;
    padding-right: 50px;
}

@media screen and (max-width: 991px) {
    .titulos {
        margin-top: 100px;
    }

    ul.k-pager-numbers {
        position: relative !important;
        left: 30% !important;
        top: 30px;
    }
}

.detail {
    /*padding: 0 0 6%;*/
    border-bottom: 1px solid #c9d3dd;
    border-left: 1px solid #c9d3dd;
    border-right: 1px solid #c9d3dd;
    background-color: #fff;
}

.detail form {
    padding: 0 0 6%;
}

.rodape {
    background-color: #f1f4f9;
    border: 1px solid #c9d3dd;
    font-size: 16.8px;
    height: 60px;
    line-height: 120%;
    /*     padding-bottom: 15px; */
    margin-bottom: 13%;
    position: inherit;
}

.right {
    float: right;
}

.rodape .btn-left {
    float: left;
    margin: 1%;
    width: 150px;
}

.rodape .btn-right {
    float: right;
    margin: 1%;
    width: 150px;
}

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

textarea.form-control:not(.fc-alt) {
    border-left: 1px;
    border-right: 1px;
    border-top: 1px;
    /*border-bottom: 1px;*/
}

.noUppercase {
    text-transform: none !important;
}

#rodape {
    margin-top: 20px;
}

#notification {
    z-index: 20000;
}

.cliente_cancelado {
    background: #ebccd1;
}

.cliente_bonificado {
    background: #d8f6ce;
}

.k-picker-wrap {
    padding: 0;
}

.k-picker-wrap .k-select {
    width: 3.9em;
}

.k-datetimepicker {
    width: 17.8em;
}

.k-datetimepicker,
.k-datepicker {
    display: table;
}

.card-header:not(.ch-alt):not([class*="bgm-"]) + .card-padding {
    padding-top: 23px;
}

/*CSS PARA AJUSTAR OS COMPONENTES DE COMBOBOX, DATEPICKER, NUMERIC, TIMEPICKER, DROPDOWN, ETC....ESTES NÃO FICAM COM WIDTH 100% NATURALMENTE O QUE DIFICULTA O AJUSTE DE RESPONSIVIDADE*/
.k-autocomplete,
.k-colorpicker,
.k-combobox,
.k-datepicker,
.k-datetimepicker,
.k-dropdown,
.k-numerictextbox,
.k-selectbox,
.k-textbox,
.k-timepicker,
.k-toolbar .k-split-button {
    display: inherit;
    width: 100%;
}

.k-grid-header,
.k-header,
.k-toolbar {
    background-color: #fafafa;
}

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

.fg-line .form-control {
    /*position: relative;*/
    background: transparent;
    z-index: 1;
}

.fg-line .form-control::-moz-placeholder {
    color: #ffffff;
    opacity: 1;
}

.fg-line .form-control:-ms-input-placeholder {
    color: #ffffff;
}

.fg-line .form-control::-webkit-input-placeholder {
    color: #ffffff;
}

.fg-line .fg-label {
    -webkit-transition: all;
    -o-transition: all;
    transition: all;
    -webkit-transition-duration: 200ms;
    transition-duration: 200ms;
    position: absolute;
    /*top: 5px;*/
    font-weight: 400;
    color: #959595;
    pointer-events: none;
    z-index: 0;
    left: 0;
    white-space: nowrap;
    top: -20px;
    /*font-size: 13px;*/
}

.fg-line .fg-toggled .fg-label {
    top: -20px;
    font-size: 11px;
}

span.k-dropdown-wrap.k-state-default,
span.k-dropdown-wrap.k-state-default > .k-input,
span.k-dropdown-wrap.k-state-default > .k-select {
    height: 33px;
    line-height: 33px;
}

.form-group > .fg-line > .k-dropdown .k-state-default {
    background-color: #e6e6e6;
}

hr {
    margin-bottom: 40px;
}

.zmdi-custom,
.zmdi-custom + span {
    font-size: 18px;
    vertical-align: middle;
    margin-right: 10px;
}

.zmdi-custom {
    font-size: 20px;
}

.btn-default:hover {
    background-color: #008275;
}

html, body {
    height: 100%;
    margin: 0;
}

.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -50px; /* Adjust based on footer height */
}

.footer, .push {
    height: 50px; /* Adjust based on footer height */
}

.footer {
    background: #141414;
    padding: 10px;
    color: #d1d1d1;
    display: inline-table;
    position: relative;
    bottom: 0;
    width: 100%;
}

.left {
    text-align: left;
}

.avsi-footer {
    font-size: 14px;
    position: absolute;
    /* top: 0; */
    left: 0;
    width: 100%;
    /* height: 100%; */
    z-index: 1;
    color: white;
    padding: 10px;
    display: inline-grid;
    justify-content: center;
    align-items: center;
}

.center {
    text-align: center;
}

.push {
    height: 50px; /* Same as footer height */
}

.footer a {
    color: #d1d1d1;
}

.footer img {
    width: 70px;
}

.sub-menu i {
    margin-right: 5px;
}

img[filter-white] {
    filter: brightness(0) invert(1);
}

/**/
.stepper .nav-tabs {
    position: relative;
    display: flex;
    justify-content: center;
}

.stepper .nav-tabs > li {
    width: 25%;
    position: relative;
    text-align: center;
}

.stepper .nav-tabs > li:after {
    content: "";
    position: absolute;
    background: #f1f1f1;
    display: block;
    width: 100%;
    height: 5px;
    top: 30px;
    left: 50%;
    z-index: 0;
}

.stepper .nav-tabs .completed .round-tab {
    background: #34bc9b;
    border: 2px solid #34bc9b;
}

.stepper .nav-tabs > li.completed::after {
    background: #34bc9b;
    border: 2px solid #34bc9b;
}

.stepper .nav-tabs > li:last-child::after {
    background: transparent;
}

.stepper .nav-tabs .completed:last-child .round-tab::after {
    content: "✔";
    color: #fff;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 0;
    display: block;
}

.stepper .nav-tabs [data-toggle="tab"] {
    width: 25px;
    height: 25px;
    margin: 20px auto;
    border-radius: 100%;
    border: none;
    padding: 0;
    color: #f1f1f1;
    pointer-events: none;
    z-index: 999;
}

.stepper .nav-tabs [data-toggle="tab"]:hover {
    background: transparent;
    border: none;
}

.stepper .nav-tabs > .active > [data-toggle="tab"],
.stepper .nav-tabs > .active > [data-toggle="tab"]:hover,
.stepper .nav-tabs > .active > [data-toggle="tab"]:focus {
    color: #34bc9b;
    cursor: default;
    border: none;
}

.stepper .tab-pane {
    position: relative;
}

.stepper .tab-pane.fade {
    display: none;
}

.stepper .tab-pane.active {
    display: initial;
}

.stepper .round-tab {
    width: 25px;
    height: 25px;
    line-height: 22px;
    display: inline-block;
    border-radius: 25px;
    background: #fff;
    border: 2px solid #f1f1f1;
    color: #f1f1f1;
    z-index: 1;
    /* position: absolute; */
    left: 0;
    text-align: center;
    font-size: 14px;
}

.stepper .active .title-tab {
    text-align: center;
    color: #34bc9b;
}

.stepper .active .round-tab {
    background: #fff;
    border: 2px solid #34bc9b;
    color: #34bc9b;
}

.stepper .active .round-tab:hover {
    background: #fff;
    border: 2px solid #34bc9b;
}

.stepper .active .round-tab::after {
    display: none;
}

.stepper .disabled .round-tab {
    background: #fff;
    color: #f1f1f1;
    border-color: #f1f1f1;
}

.stepper .disabled .round-tab:hover {
    color: #4dd3b6;
    border: 2px solid #a6dfd3;
}

.stepper .disabled .round-tab::after {
    display: none;
}

.stepper .next-step,
.stepper .prev-step {
    background: #008275;
    color: #fff;
}

.stepper .next-step:focus,
.stepper .prev-step:focus {
    background: #2196f3;
    color: #fff;
}

.dt-buttons {
    display: flex; /* Arrange buttons in a row */
    gap: 10px; /* Add some spacing between buttons */
    margin-bottom: 10px; /* Add some space below the buttons */
    flex-wrap: wrap; /* Allow buttons to wrap to the next line on smaller screens */
}

.dt-button-collection {
    display: flex;
    align-items: end;
}

.dt-button-collection.dropdown-menu {
    position: absolute !important; /* Ensure it's positioned relative to the viewport or a parent */
    z-index: 1000; /* Make sure it's above other elements */
    /* Add any other desired styling for the dropdown */
}

@charset "UTF-8";