body {
    background-color: #f2f4f8;
}

@font-face {
    font-family: nexxunFont;
    src: url(/assets/fonts/canaro/canaro-light.otf);
}

/* fundo dos campos */
select, input {
    background: #F7F8F9 !important;
    border: solid 1px #ddd !important;
}

/*Simular campo inativo */
select[readonly],input[type="checkbox"][readonly],input[type="radio"][readonly] {
    background: #ccc;
    pointer-events: none;
    touch-action: none;
}

/* Tamanho */
input[type="checkbox"],input[type="radio"] {
    width: 15px; 
    height: 15px; 
}

/* spinner */
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: Verdana,Arial,sans-serif;
    font-size: 1em;
    outline: 0px; /* add this bit */
}

/* Estilo do Loading Overlay */
.loading-overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 999999;
    text-align: center;
    min-height: 100%;
    background-color: rgba(0,0,0,.3);
}

.loading-overlay-icon {
    margin-top: 25%;
}

/* Personalizacao do tooltip do jquery-ui */

.ui-tooltip {
    background-color: #FBF7AA;
    color: #1A1D21;
    padding: 10px;
    font-weight: normal;
    font-size: 14px;
}

/* Modificações no main.css */

body:before {
    background: transparent;
}

.all-wrapper {
    box-shadow: none;
}

.all-wrapper.with-pattern {
	background-image: none;
}
  
/* Cor do fundo do auth */
body.auth-wrapper:before {
    background: #033158;
}

/* Tabelas */

.table td,
.table th {
    border-color: #eee !important;
}

.table thead th {
    font-size: 16px;
    font-weight: bold;
    color: #6a6c6d !important;
    text-transform: none;
}

/* Cor das listras das tabelas */
.table-striped > tbody > tr:nth-child(2n+2) > td, .table-striped > tbody > tr:nth-child(2n+2) > th {
    background-color: white;
}

.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #F7F8F9;
}

/* DataTables */
.dt-bootstrap4 {
    margin: 0;
    padding: 0;
}

.dt-bootstrap4 .table thead th {
    font-size: 16px;
    font-weight: bold;
    color: #6a6c6d !important;
    text-transform: none;
}

.dt-bootstrap4 .row,
.dt-bootstrap4 .col-sm-12 {
    padding: 0;
    margin: 0;
    border: none !important;
}

.dt-bootstrap4 .row:first-child {
    margin-bottom: 10px;
}

.dt-bootstrap4 .row:last-child {
    margin-top: 10px;
}

/* Paginação */
.dt-bootstrap4 .dataTables_paginate .paginate_button {
    margin: 0;
    padding: 3px;
}

/* Ao passar o mouse pela paginação */
.dt-bootstrap4 li.paginate_button.page-item:hover{
    background: transparent !important;
    border: none !important;
}

/* Menu lateral */
.main-menu span,
.main-menu .fa,
.main-menu .os-icon,
.main-menu a,
.main-menu .selected .sub-menu a {
    color: white;
    opacity: 0.8;
}

.main-menu .selected span,
.main-menu .selected .fa,
.main-menu .selected .os-icon,
.main-menu .selected a,
.main-menu .sub-menu .selected span,
.main-menu .sub-menu .selected .fa,
.main-menu .sub-menu .selected .os-icon,
.main-menu .sub-menu .selected a {
    opacity: 1;
}

.main-menu .back span,
.main-menu .back .fa {
    color: yellow;
    opacity: 0.7;
}

/* Elemntos */

.el-tablo {
    padding: 20px;
}

.el-tablo .value{
    font-size: 22px;
}

.element-box{
    font-size: 14px;
    background-color: #F7F8F9;
    border: solid 1px #ddd;
    box-shadow: none;
}

/* Textos */

b, strong {
  font-weight: bold;
}

.max-100{
    max-width: 100px; 
    word-wrap:break-word
}

.max-200{
    max-width: 200px; 
    word-wrap:break-word
}

.max-300{
    max-width: 300px; 
    word-wrap:break-word
}

.max-400{
    max-width: 400px; 
    word-wrap:break-word
}

.text-grey{
	color: #ccc;
}

/* Tags Input */

.bootstrap-tagsinput {
    padding: 10px;
    width: 100%;
}

.bootstrap-tagsinput input {
    margin: 10px 2px 0 0 !important;
    padding: 5px;
}

.bootstrap-tagsinput .tag {
    margin: 2px 2px 0 0 !important;
    color: black !important;
    background-color: rgb(226,235,255);
    border: solid 1px rgb(71,133,210);
    padding: 5px;
}

/* O icone do swal fica muito grande no Chrome */
.swal2-icon {
    font-size: 12px !important;
}

/* O swal desconfigura o menu lateral ao ser acionado */
.swal2-shown {
    height: 100% !important;
}

/* Caixa para Pro6*/
span.pro6, span.sw {
    padding: 1px;
}

/* Botões */
.btn-grey{
    background-color: #F0F0F0;
}

.btn i {
    margin: 0;
    padding: 0;
}

.input-group .input-group-append .input-group-text, .input-group .input-group-prepend .input-group-text{
    background-color: #eee;
}

.default-wrapper{
    margin-top: -10px;
}

/* Usado nas divisões de seções no modal */
.rowSection {
    margin: 10px; 
    padding: 10px 5px 20px 5px; 
    background-color: #EBF1F5;
}

.rowSection .title{
    margin: 5px 0 5px 0;
    font-size: 16px;
    font-weight: bold;
}