@import url("/css/materialize.css");

/* BUTTON */
.btn, 
.btn-small, 
.btn-large:not(.btn-floating) {
    border-radius: 8px !important;
    font-family: "Montserrat", sans-serif;
    text-transform: none !important;
    font-weight: 500 !important;
}

.btn.disabled, 
.btn-small.disabled, 
.btn-large:not(.btn-floating).disabled {
    opacity: 0.5;
}

.btn-flat {
    border-radius: 8px !important;
    color: var(--comuns__cor-do-texto) !important;
    font-family: "Montserrat", sans-serif;
    text-transform: none !important;
}

.btn-large {
    font-size: 16px !important;
}

/* CARD */
.card {
    background-color: var(--comuns__cor-do-container) !important;
}

.card.arredondado {
    border-radius: 8px !important;
}

.card.arredondado .card-image img {
    border-radius: 8px 8px 0 0;
}

.card.arredondado .card-title {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.card .card-title {
    padding: 4px 24px 8px 24px;
}

.card.conteudo {
    box-shadow: none;
}

.card.fundo-invertido {
    background-color: var(--comuns__cor-do-fundo) !important;
}

.card .card-reveal {
    background-color: var(--comuns__cor-do-container) !important;
}

.card .card-reveal .card-texto {
    color: var(--comuns__cor-do-texto) !important;
}

/* CHECKBOX */
[type="checkbox"] + span:not(.lever){
    color: var(--comuns__cor-do-texto) !important;
    font-size: 15px !important;
}

[type="checkbox"]:disabled + span:not(.lever){
    opacity: 0.5 !important;
    cursor: default !important;
    text-decoration: line-through;
}

[type="checkbox"]:checked + span:not(.lever):after {
	border: 2px solid var(--comuns__cor-primaria) !important;
	background-color: var(--comuns__cor-primaria) !important;
}

[type="checkbox"]:not(.filled-in):checked + span:not(.lever):before {
	border-bottom: 2px solid var(--comuns__cor-primaria) !important;
	border-right: 2px solid var(--comuns__cor-primaria) !important;
}

input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,
input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {
	opacity: 0.5 !important;
}

/* CHIPS */
.chips input {
    color: var(--comuns__cor-do-texto) !important;
}

.chips .chip:active, 
.chips .chip:focus {
    background-color: var(--comuns__cor-primaria) !important;
}

.chips.chips-placeholder input {
    border-bottom: none !important;
    width: 240px !important;
}

.chips.chips-placeholder input.input {
    border-bottom: none !important;
}

.chips.focus {
    border-bottom: 1px solid var(--comuns__cor-primaria) !important;
    box-shadow: 0 1px 0 0 var(--comuns__cor-primaria) !important;
}

/* COLLAPSIBLE */
.collapsible {
    border-color: var(--comuns__cor-do-separador) !important;
    border-radius: 8px !important;
    overflow: hidden;
}

.collapsible .collapsible-header {
    background-color: var(--comuns__cor-do-container) !important;
    border-bottom-color: var(--comuns__cor-do-separador) !important;
    padding: 16px !important;
}

.collapsible .collapsible-header i {
    margin: 0 !important;
    width: auto !important;
}

.collapsible .collapsible-header p {
    margin: 0 !important;
}

.collapsible .collapsible-body {
    background-color: var(--comuns__cor-do-fundo) !important;
    border-bottom-color: var(--comuns__cor-do-separador) !important;
    padding: 18px !important;
}

/* COLLECTION */
.collection {
    border: solid 1px var(--comuns__cor-do-separador) !important;
}

.collection.sem-borda {
    border: none !important;
}

.collection.fundo-padrao {
    background-color: var(--comuns__cor-do-container) !important;
}

.collection.fundo-invertido {
    background-color: var(--comuns__cor-do-fundo) !important;
}

.collection .collection-item {
    background-color: transparent !important;
    border-bottom: solid 1px var(--comuns__cor-do-separador) !important;
    user-select: none;
    -webkit-user-select: none;
}

.collection .collection-item.borda-separador {
    border-bottom: solid 1px var(--comuns__cor-do-separador) !important;
}

.collection .collection-item.sem-borda {
    border-bottom: none !important;
}

.collection .collection-item.sem-recuo-lateral {
    padding: 10px 0 !important;
}

.collection .collection-item.inativo .flex-icon {
    filter: saturate(25%);
    opacity: 0.5;
}

.collection .collection-item.inativo .flex-content {
    opacity: 0.5;
}

.collection .collection-item.clicavel:hover {
    background-color: var(--comuns__cor-de-hover) !important;
}

/* DATEPICKER */
.datepicker-container .datepicker-date-display {
    background-color: var(--comuns__cor-primaria) !important;
}

.datepicker-container .datepicker-date-display .year-text {
    background-color: transparent !important;
    color: white !important;
    opacity: 0.75 !important;
}

.datepicker-container .datepicker-date-display .date-text {
    color: white !important;
}

.datepicker-container .datepicker-calendar .datepicker-controls .select-month input {
    width: 80px !important;
}

.datepicker-container .datepicker-calendar .datepicker-controls .month-prev svg,
.datepicker-container .datepicker-calendar .datepicker-controls .month-next svg {
    fill: white !important;
}

.datepicker-container .datepicker-calendar .datepicker-controls .month-prev:active,
.datepicker-container .datepicker-calendar .datepicker-controls .month-next:active,
.datepicker-container .datepicker-calendar .datepicker-controls .month-prev:focus,
.datepicker-container .datepicker-calendar .datepicker-controls .month-next:focus {
    background-color: var(--comuns__cor-primaria) !important;
}

.datepicker-container .datepicker-calendar .datepicker-table abbr,
.datepicker-container .datepicker-calendar .datepicker-table th {
    background-color: var(--comuns__cor-do-container) !important;
}

.datepicker-container .datepicker-calendar .datepicker-table td.is-disabled {
    background-color: transparent;
    color: var(--comuns__cor-do-texto) !important;
    opacity: 0.3;
}

.datepicker-container .datepicker-calendar .datepicker-table td.is-selected {
    background-color: var(--comuns__cor-primaria) !important;
    color: var(--comuns__cor-do-texto) !important;
}

.datepicker-container .datepicker-calendar .datepicker-table td.is-today {
    color: var(--comuns__cor-primaria) !important;
}

.datepicker-container .datepicker-calendar .datepicker-table td.is-today.is-selected {
    color: var(--comuns__cor-do-texto) !important;
}

.datepicker-container .datepicker-clear,
.datepicker-container .datepicker-cancel {
    color: var(--comuns__cor-do-contexto) !important;
}

.datepicker-container .datepicker-done {
    color: var(--comuns__cor-do-texto) !important;
}

/* DIVIDER */
.divider {
    background-color: var(--menu_cor-do-separador) !important;
}

/* DROPDOWN */
.dropdown-content li:hover, .dropdown-content li.active {
    background-color: rgba(0, 0, 0, 0.16) !important;
}

/* INPUTS */
input:not([type]),
input[type=text]:not(.browser-default),
input[type=password]:not(.browser-default),
input[type=email]:not(.browser-default),
input[type=url]:not(.browser-default),
input[type=time]:not(.browser-default),
input[type=date]:not(.browser-default),
input[type=datetime]:not(.browser-default), 
input[type=datetime-local]:not(.browser-default),
input[type=tel]:not(.browser-default),
input[type=number]:not(.browser-default),
input[type=search]:not(.browser-default),
textarea.materialize-textarea {
    border-bottom: solid 1px var(--input_cor-da-base) !important;
    color: var(--input_cor-do-texto);
    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 400;
}

input:not([type]):disabled,
input[type=text]:not(.browser-default):disabled,
input[type=password]:not(.browser-default):disabled,
input[type=email]:not(.browser-default):disabled,
input[type=url]:not(.browser-default):disabled,
input[type=time]:not(.browser-default):disabled,
input[type=date]:not(.browser-default):disabled,
input[type=datetime]:not(.browser-default):disabled, 
input[type=datetime-local]:not(.browser-default):disabled,
input[type=tel]:not(.browser-default):disabled,
input[type=number]:not(.browser-default):disabled,
input[type=search]:not(.browser-default):disabled,
textarea.materialize-textarea:disabled {
    border-bottom: dotted 1px var(--input_cor-da-base) !important;
    color: var(--texto_cor-do-contexto) !important;
    opacity: 0.5 !important;
}

input:not([type]):disabled + label,
input[type=text]:not(.browser-default):disabled + label,
input[type=password]:not(.browser-default):disabled + label,
input[type=email]:not(.browser-default):disabled + label,
input[type=url]:not(.browser-default):disabled + label,
input[type=time]:not(.browser-default):disabled + label,
input[type=date]:not(.browser-default):disabled + label,
input[type=datetime]:not(.browser-default):disabled + label, 
input[type=datetime-local]:not(.browser-default):disabled + label,
input[type=tel]:not(.browser-default):disabled + label,
input[type=number]:not(.browser-default):disabled + label,
input[type=search]:not(.browser-default):disabled + label,
textarea.materialize-textarea:disabled + label {
    color: var(--input_cor-do-label) !important;
    opacity: 0.5 !important;
}

.input-field input::placeholder,
.input-field textarea::placeholder {
    opacity: 0.5;
}

.input-field > label {
    color: var(--input_cor-do-label) !important;
}

.input-field:has(:focus) > label, textarea.materialize-textarea:focus + label {
    color: var(--input_cor-do-label-selecionado) !important;
}

.input-field input:focus, textarea.materialize-textarea:focus {
	border-bottom: solid 1px var(--input_cor-da-base-selecionada) !important;
	box-shadow: 0 1px 0 0 var(--input_cor-da-base-selecionada) !important;
}

.input-field > span.helper-text {
    color: var(--input_cor-do-label) !important;
    display: inline-block;
    width: 90%;
}

.input-field:disabled > span{
    color: var(--input_cor-do-label) !important;
    opacity: 0.5 !important;
}

/* LABEL */
label {
    color: var(--comuns__cor-do-contexto) !important;
}

/* MODAL */
.modal {
    background-color: #333333 !important;
}

/* NAV & SIDE NAV */
nav:not(.breadcrumb-nav) {
    background-color: var(--comuns__cor-do-fundo) !important;
    position: fixed;
    top: 0;
    z-index: 900;
}

nav:not(.breadcrumb-nav) .stack {
    padding-top: 4px;
}

nav:not(.breadcrumb-nav), .collapsible, .sidenav {
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
}

nav:not(.breadcrumb-nav) {
	display: none;
}

nav:not(.breadcrumb-nav) .sidenav-trigger {
    color: var(--menu_cor-do-texto) !important;
}

nav:not(.breadcrumb-nav) .titulo {
    color: white !important;
}

nav:not(.breadcrumb-nav) .titulo {
	padding: 0 20px 0 20px !important;
}

/* SIDENAV */
.sidenav {
    background-color: var(--menu_cor-do-fundo) !important;
    background-image: url("/img/comuns/bg-left.png?a=34");
    background-position: left top;
    background-repeat: no-repeat;
    background-size: auto 100%;
    height: 100%;
    padding-left: 24px !important;
    position: fixed;
    overflow-x: hidden;
    overflow-y: auto;
}

.sidenav .menu-espacador {
    margin: 12px 0;
}

.sidenav .menu-espacador-2x {
    margin: 24px 0;
}

.sidenav .menu-espacador-3x {
    margin: 32px 0;
}

.sidenav .menu-espacador-4x {
    margin: 48px 0;
}

.sidenav .menu-fechar {
    color: var(--menu_cor-do-separador) !important;
    display: none;
    padding-top: 16px;
    padding-right: 16px;
}

.sidenav .menu-logo {
    content: var(--menu__caminho-do-icone);
    margin-top: 40px; 
    margin-bottom: 40px;
    margin-left: 30px;
    opacity: 0.9;
    width: 80px; 
    height: auto;
}

.sidenav li {
    color: var(--menu_cor-do-texto);
}

.sidenav li.active {
    background-color: transparent !important;
}

.sidenav li.active:not(.divider) > a {
    background-color: transparent !important;
    border-left: 6px solid var(--menu_cor-da-borda-do-item-selecionado);
    color: var(--menu_cor-do-texto-ativo) !important;
    font-weight: 600;
}

.sidenav li.active:not(.divider) > a:hover {
    background-color: transparent !important;
}

.sidenav li:not(.divider) > a {
    border-left: 6px solid transparent;
    color: var(--menu__cor-do-texto);
    font-size: 18px;
    font-weight: 500;
    height: 36px;
    line-height: 36px;
    margin-left: 4px !important;
    margin-top: 16px;
    padding-left: 20px;
    padding-top: 1px;
}

.sidenav li:not(.divider) > a:hover {
    background-color: transparent !important;
}

.sidenav li.desconectar {
    border-left: 6px solid transparent;
    color: var(--menu_cor-do-texto-descontectar);
    font-size: 18px;
    font-weight: 500;
    line-height: 36px;
    margin-left: 4px !important;
    margin-top: 16px;
    min-height: 36px;
    padding-left: 20px;
    padding-top: 1px;
}

.sidenav li.suporte {
    bottom: 32px;
    color: var(--comuns__cor-do-contexto);
    font-size: 13px;
    font-weight: 400;
    line-height: 36px;
    margin-top: 16px;
    min-height: 36px;
    padding-left: 4px;
    position: fixed;
    text-shadow: var(--comuns__cor-do-container) 4px 0 8px;
    transition: 250ms;
}

.sidenav li.suporte > i {
    font-size: 13px;
}

.sidenav li.suporte:hover {
    color: var(--comuns__cor-do-texto);
}

.sidenav li:not(.active):not(.desconectar, .suporte) > a {            
    transition: 250ms;
}

.sidenav li:not(.active):not(.nav-botao) > a:hover {
    border-left: 6px solid var(--menu_cor-da-borda-do-item-selecionado-com-hover);
}

.sidenav li.divider {
    margin-top: 16px !important;
    border: solid 1px var(--menu_cor-do-separador) !important;
}

/* SELECT */
select:disabled + label {
    color: var(--comuns__cor-do-texto) !important;
    opacity: 0.48;
}

.select-wrapper .caret {
    fill: var(--comuns__cor-do-texto) !important;
}

input.select-dropdown {
    color: var(--comuns__cor-do-texto);
}

ul.dropdown-content {
    background-color: var(--select_cor-do-dropdown) !important;
}

ul.dropdown-content.select-dropdown {
    background-color: var(--cor-do-menu);
}

ul.dropdown-content.select-dropdown li span {
    color: var(--comuns__cor-do-contexto);
}

ul.dropdown-content.select-dropdown li.disabled {
    cursor: default !important;
}

ul.dropdown-content.select-dropdown li:not(.disabled) span {
    color: var(--comuns__cor-do-texto);
}

ul.dropdown-content.select-dropdown li.optgroup {
    background: transparent !important;
    border-top: solid 1px var(--comuns__cor-do-separador) !important;
    cursor: default !important;
}

ul.dropdown-content.select-dropdown li.optgroup span {
    font-weight: 500 !important;
}

/* SPINNER */
.spinner-layer.spinner-auxiliar-only {
    border-color: var(--comuns__cor-auxiliar) !important;
}

.spinner-layer.spinner-selo-azul-only {
    border-color: var(--comuns__cor-selo-azul) !important;
}

.spinner-layer.spinner-white-only {
    border-color: white !important;
}

/* TAB */
.tabs.arredondado {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.tabs .tab:has(a.disabled) a {
    color: var(--comuns__cor-do-separador) !important;
    pointer-events: none;
}

.tabs .tab:not(:has(a.disabled)) a:hover {
    color: var(--cor-do-primaria) !important;
}

.tabs .tab.fundo-invertido > a {
    background-color: var(--comuns__cor-do-container) !important;
    color: var(--comuns__cor-do-contexto) !important;
    filter: saturate(80%);
}

.tabs .tab.fundo-invertido > a.active {
    background-color: var(--comuns__cor-do-container) !important;
    color: var(--comuns__cor-do-texto) !important;
}

.tabs .tab:not(.fundo-invertido) > a {
    background-color: var(--comuns__cor-do-fundo) !important;
    color: var(--comuns__cor-do-contexto) !important;
    filter: saturate(80%);
}

.tabs .tab:not(.fundo-invertido) > a.active {
    background-color: var(--comuns__cor-do-fundo) !important;
    color: var(--comuns__cor-do-texto) !important;
}

.tabs .indicator {
    background-color: var(--comuns__cor-auxiliar) !important;
}

.tab-content {
    background-color: var(--comuns__cor-do-fundo) !important;
    padding: 24px;
}

/* TIMERPICKER */
.timepicker-container .timepicker-digital-display {
    background-color: var(--comuns__cor-primaria) !important;
}

.timepicker-container .timepicker-analog-display .timepicker-canvas line {
    stroke: var(--comuns__cor-primaria-transparente) !important;
}

.timepicker-container .timepicker-analog-display .timepicker-canvas circle {
    fill: var(--comuns__cor-primaria-transparente) !important;
}

.timepicker-container .timepicker-analog-display .timepicker-footer button {
    color: var(--comuns__cor-do-contexto) !important;
}

/* TOAST */
.toast {
    background-color: var(--toast_cor-do-fundo) !important;
    color: var(--toast_cor-do-texto) !important;
    font-weight: 500;
}

/* TOOLTIPPED */
.tooltipped {
    cursor: pointer;
    z-index: 100;
}

.material-tooltip {
    background-color: var(--comuns__cor-do-fundo);
    border-radius: 8px;
}

@media only screen and (max-width: 992px) {

    nav:not(.breadcrumb-nav) {
        display: block;
    }

    .sidenav .menu-fechar {
        display: block;
    }

}