/*Tema vermelho com body branco*/
/* ========================================================================
   Component: layout
 ========================================================================== */
/*Fundo*/
body, .wrapper .section-container {
  background-color: #f5f7fa;
}

.wrapper .aside-container {
  background-color: #f5f7fa;
}

/*Cabeçalho*/
.content-wrapper .content-heading {
  background-color: #fff;
  color: #656565;
  border-bottom: 1px solid #d9d9d9;
}

/*Rodapé*/
.footer-container {
  background-color: #fff;
  color: #656565;
  border-top: 1px solid #d9d9d9 !important;
}

/* ========================================================================
   Component: top-navbar
 ========================================================================== */
.topnavbar {
  background-color: #F44733;
  background-image: linear-gradient(to right, #FF7464 0%, #F44733 100%);
  background-repeat: repeat-x;
}

@media (min-width: 992px) {
  .topnavbar .navbar-nav > .nav-item.show > .nav-link, .topnavbar .navbar-nav > .nav-item.show > .nav-link:hover, .topnavbar .navbar-nav > .nav-item.show > .nav-link:focus {
    box-shadow: 0 -3px 0 rgba(244, 71, 51, 0.5) inset;
  }
}

.topnavbar .navbar-nav > .nav-item > .navbar-text {
  color: #fff;
}

.topnavbar .navbar-nav > .nav-item > .nav-link,
.topnavbar .navbar-nav > .nav-item.show > .nav-link {
  color: #fff;
}

  .topnavbar .navbar-nav > .nav-item > .nav-link:hover, .topnavbar .navbar-nav > .nav-item > .nav-link:focus,
  .topnavbar .navbar-nav > .nav-item.show > .nav-link:hover,
  .topnavbar .navbar-nav > .nav-item.show > .nav-link:focus {
    color: #656565;
  }

.topnavbar .dropdown-item.active, .topnavbar .dropdown-item:active {
  background-color: #F44733;
}

/* ========================================================================
   Component: sidebar (menu esquerdo)
 ========================================================================== */
.sidebar {
  background-color: #fff;
}

  .sidebar .nav-heading {
    color: #919DA8;
  }

.sidebar-nav > li > a, .sidebar-nav > li > .nav-item {
  color: #505050;
}

  .sidebar-nav > li > a:focus, .sidebar-nav > li > a:hover, .sidebar-nav > li > .nav-item:focus, .sidebar-nav > li > .nav-item:hover {
    color: #F44733;
  }

  .sidebar-nav > li > a > em, .sidebar-nav > li > .nav-item > em {
    color: inherits;
  }

.sidebar-nav > li.active, .sidebar-nav > li.active > a, .sidebar-nav > li.active > .nav-item, .sidebar-nav > li.active .sidebar-nav, .sidebar-nav > li.open, .sidebar-nav > li.open > a, .sidebar-nav > li.open > .nav-item, .sidebar-nav > li.open .sidebar-nav {
  background-color: #fcfcfc;
  color: #F44733;
}

  .sidebar-nav > li.active > .nav-item > em, .sidebar-nav > li.active > a > em, .sidebar-nav > li.open > .nav-item > em, .sidebar-nav > li.open > a > em {
    color: #F44733;
  }

.sidebar-nav > li.active {
  border-left-color: #F44733;
}

.sidebar-subnav {
  background-color: #fff;
}

  .sidebar-subnav > .sidebar-subnav-header {
    color: #505050;
  }

  .sidebar-subnav > li > a:focus, .sidebar-subnav > li > a:hover, .sidebar-subnav > li > .nav-item:focus, .sidebar-subnav > li > .nav-item:hover {
    color: #F44733;
  }

  .sidebar-subnav > li.active > a, .sidebar-subnav > li.active > .nav-item {
    color: #F44733;
  }

    .sidebar-subnav > li.active > a:after, .sidebar-subnav > li.active > .nav-item:after {
      border-color: #F44733;
      background-color: #F44733;
    }

.divRelatorioSidebar {
  padding: 6px 15px;
  cursor: pointer;
}

  .divRelatorioSidebar:focus, .divRelatorioSidebar:hover {
    color: #F44733;
  }

/* ========================================================================
   Component: offsidebar (menu direito)
 ========================================================================== */
.offsidebar {
  border-left: 1px solid #d9d9d9 !important;
  background-color: #fff;
  color: #505050;
}

/* ========================================================================
   Component: list-group (Menus edição)
 ========================================================================== */
.list-group, .list-group-item {
  background-color: #fff;
  color: #656565;
}

.list-group-item-action:hover {
  background-color: #ededed;
}

.list-group-item.active {
  background-color: #F44733;
  border-color: #F44733;
  color: #fff;
}

/* ========================================================================
   Component: btn-padrao
 ========================================================================== */
.btn-padrao {
  color: #fff;
  background-color: #F44733;
  border-color: #DB3F2D;
}

  .btn-padrao:hover {
    color: #fff;
    background-color: #C33828;
    border-color: #AA3123;
  }

  .btn-padrao:focus, .btn-padrao.focus {
    box-shadow: 0 0 0 0.2rem rgba(244, 71, 51, 0.5);
  }

  .btn-padrao:not(:disabled):not(.disabled):active, .btn-padrao:not(:disabled):not(.disabled).active,
  .show > .btn-padrao.dropdown-toggle {
    color: #fff;
    background-color: #C33828;
    border-color: #C33828;
  }

    .btn-padrao:not(:disabled):not(.disabled):active:focus, .btn-padrao:not(:disabled):not(.disabled).active:focus,
    .show > .btn-padrao.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(244, 71, 51, 0.5);
    }

/*Checkbox*/
.c-checkbox input[type=checkbox]:checked + span {
  background-color: #F44733;
  border-color: #C33828;
}

.c-checkbox input[type=checkbox]:disabled + span, .c-checkbox input[type=radio]:disabled + span, .c-radio input[type=checkbox]:disabled + span, .c-radio input[type=radio]:disabled + span {
  background-color: #ddd;
  border-color: #ddd;
  color: #656565;
  pointer-events: none;
  opacity: 0.65;
}

.c-checkbox:hover span,
.c-radio:hover span {
  border-color: #F44733;
}

/*Btn-default do rodapé*/
.modal-footer .btn-default {
  background-color: #e0e0e0;
  box-shadow: 0 0 0 0.5px #838383 !important;
}

  .modal-footer .btn-default:not([disabled]):hover {
    background-color: rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 0.5px #505050 !important;
  }

/* ========================================================================
   Component: btn-outline
 ========================================================================== */
.btn-outline {
  color: #F44733;
  border-color: #F44733;
}

  .btn-outline:hover {
    color: #fff;
    background-color: #F44733;
    border-color: #DB3F2D;
  }

  .btn-outline:focus, .btn-outline.focus {
    box-shadow: 0 0 0 0.2rem #C33828;
  }

  .btn-outline.disabled, .btn-outline:disabled {
    color: #C33828;
    background-color: transparent;
  }

  .btn-outline:not(:disabled):not(.disabled):active, .btn-outline:not(:disabled):not(.disabled).active,
  .show > .btn-outline.dropdown-toggle {
    color: #fff;
    background-color: #F44733;
    border-color: #DB3F2D;
  }

    .btn-outline:not(:disabled):not(.disabled):active:focus, .btn-outline:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem #C33828;
    }

/* ========================================================================
   Component: btn-outline-secondary
 ========================================================================== */
.btn-secondary, .calendar-app .fc-button {
  background-color: #fff;
  border-color: #dde6e9;
  color: #333;
}

  .btn-secondary:hover, .calendar-app .fc-button:hover {
    background-color: #edf1f2;
  }

  .btn-secondary:not(:disabled):not(.disabled):active, .calendar-app .fc-button:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, .calendar-app .fc-button:not(:disabled):not(.disabled).active,
  .show > .btn-secondary.dropdown-toggle,
  .calendar-app .show > .dropdown-toggle.fc-button {
    background-color: #edf1f2;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  }

.btn-outline-secondary {
  border-color: #dde6e9 !important;
  color: #333;
}

  .btn-outline-secondary:hover {
    color: #333;
    background-color: #edf1f2 !important;
  }

  .btn-outline-secondary:focus {
    box-shadow: 0 0 0 0.2rem rgba(234, 234, 234, 0.5);
  }

  .btn-outline-secondary:disabled {
    background-color: #edf1f2;
    color: #656565;
    pointer-events: none;
  }

/* ========================================================================
   Component: botões
 ========================================================================== */
/*Botões do controle de acesso (Cor texto, sem borda)*/
.btn-icon {
  color: #656565;
}

  .btn-icon:hover {
    color: #F44733;
  }

  .btn-icon:disabled {
    pointer-events: none;
  }

  .btn-icon:focus {
    box-shadow: 0 0 0 0;
  }

/*Botão pesquisar cabeçalho*/
.btn-pesquisar {
  color: #fff;
}

/*Botões do SearchTextBox (mostrar somente itens da filial corrente) e do Grid (exibir todos os registros)*/
.btn-light-notsel {
  color: #656565;
  background-color: #fff;
  border-color: #fff;
}

  .btn-light-notsel:disabled {
    pointer-events: none;
  }

.btn-light-select {
  color: #656565;
  background-color: rgba(0, 0, 0, 0.03);
  border-color: rgba(0, 0, 0, 0.2);
}

  .btn-light-select:hover {
    background-color: rgba(0, 0, 0, 0.05);
    border-color: #cfdbe2;
  }

  .btn-light-select:disabled {
    pointer-events: none;
  }

/* ========================================================================
   Component: swal-modal
 ========================================================================== */
.swal-modal {
  background-color: #fff !important;
}

.swal-content__input:focus {
  border-color: #F44733;
}

/* ========================================================================
   Component: swal-button
 ========================================================================== */
.swal-button {
  box-shadow: 0 0 0 0;
}

.swal-button--confirm {
  background-color: #F44733;
  border-color: #F44733;
  box-shadow: 0 0 0 0.2px #F44733 !important;
}

  .swal-button--confirm:not([disabled]):hover {
    background-color: #C33828;
    border-color: #C33828;
    box-shadow: 0 0 0 0.5px #F44733 !important;
  }

.swal-button.swal-button--confirm:active {
  box-shadow: 0 0 0 0.2rem rgba(244, 71, 51, 0.5) !important;
}

.swal-button.swal-button--cancel {
  background-color: #e0e0e0;
  box-shadow: 0 0 0 0.5px #838383 !important;
}

  .swal-button.swal-button--cancel:not([disabled]):hover {
    background-color: rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 0.5px #505050 !important;
  }

/* ========================================================================
   Component: swal-fire
 ========================================================================== */
.swal2-styled.swal2-confirm {
  color: #fff;
  background-color: #F44733 !important;
  border-color: #F44733 !important;
  font-size: 14px !important;
}

  .swal2-styled.swal2-confirm:active {
    color: #fff;
    background-color: #C33828;
    border-color: #C33828;
  }

  .swal2-styled.swal2-confirm:not([disabled]):hover {
    color: #fff;
    background-color: #C33828;
    border-color: #C33828;
    box-shadow: 0 0 0 3px #F44733;
  }

  .swal2-styled.swal2-confirm:focus {
    box-shadow: 0 0 0 0;
  }

.swal2-styled.swal2-cancel {
  color: #555;
  background-color: #efefef;
  font-size: 14px !important;
}

  .swal2-styled.swal2-cancel:not([disabled]):hover {
    background-color: #e8e8e8;
    color: #C33828;
    box-shadow: 0 0 0 2px #C33828;
  }

  .swal2-styled.swal2-cancel:active {
    background-color: #d7d7d7;
  }

  .swal2-styled.swal2-cancel:focus {
    box-shadow: 0 0 0 2px #fff;
  }

/* ========================================================================
   Component: float button
 ========================================================================== */
.fab button.main {
  background-color: #F44733;
  border-color: #F44733;
}

/* ========================================================================
   Component: borda padrao
 ========================================================================== */
.borderColor {
  border-color: #F44733;
}

  .borderColor:focus {
    border-color: #F44733;
  }

  .borderColor:active {
    border-color: #F44733;
  }

  .borderColor:hover {
    border-color: #F44733;
  }

/* ========================================================================
   Diversos
 ========================================================================== */
/*Cor do cabeçalho da coluna de botões fixa do grid pesquisa (SearchTextBox)**/
.fixed-header-right {
  background-color: #fff;
}

/*Cor do cabeçalho da coluna de botões fixa do grid pesquisa (Expression)**/
.fixed-header-left {
  background-color: #fff;
}

/*Cabeçalho do grid*/
.fixedHeader {
  background-color: #fff;
}

/*Cor das linhas grid*/
.table {
  background-color: #fff;
}

  /*Linha da tabela (grids)*/
  .table tbody tr {
    background-color: #fff;
  }

    /*Hover linha da tabela (grids)*/
    .table tbody tr:hover {
      background-color: #ededed !important;
    }

    /*Segunda cor de fundo linha da tabela*/
    .table tbody tr:nth-of-type(odd) {
      background-color: #fafafa;
    }

/*Texto informação página do grid(mostrando...)*/
.infos {
  color: #656565;
}

/*Hover do check do grid*/
.bootgrid .table > thead > tr > .select-cell:hover {
  background-color: #fff !important;
}

/*Letras dropdown paginação ativa*/
.bootgrid-header .dropdown .active > .dropdown-item {
  color: #F44733;
}

/*Borda dos inputs*/
.form-control:focus {
  border-color: #F44733;
}

/*Inputs desabilitados*/
.form-control:disabled, .form-control[readonly] {
  background-color: #edf1f2;
}

/*Input-group with-focus com class with-focus(tem na tela login)*/
.input-group.with-focus .form-control:focus + .input-group-append > .input-group-text {
  border-color: #F44733;
}

/*Cor preenchimento automático usuário e senha login*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px #dde6e9 inset !important;
}

/*Borda do combobox*/
.custom-select:focus, .custom-select:hover {
  border-color: #F44733;
  box-shadow: 0 0 0 0;
}

/*Componente data - borda*/
.dx-texteditor.dx-state-active.dx-editor-filled, .dx-texteditor.dx-state-active.dx-editor-outlined, .dx-texteditor.dx-state-active.dx-editor-underlined, .dx-texteditor.dx-state-focused.dx-editor-filled, .dx-texteditor.dx-state-focused.dx-editor-outlined, .dx-texteditor.dx-state-focused.dx-editor-underlined {
  border-color: #F44733 !important;
}

/*Combobox idioma tela Login*/
.ulcustomCombobox {
  background-color: #fff;
  color: #656565;
  border: 1px solid #dde6e9;
}

  .ulcustomCombobox li:hover {
    background-color: #dde6e9;
  }

/*Itens rotina configurar atalhos personalizados*/
.itemMenu {
  background-color: white;
}

  .itemMenu:hover {
    background-color: #d5d8d9;
  }

.itemMenuPrincipal {
  background-color: white;
}

  .itemMenuPrincipal:hover {
    background-color: #d5d8d9;
  }

.divIcone {
  border: 0.5px solid #cbcfd0;
}

  .divIcone:hover {
    background-color: #656565;
    color: white;
  }

/*Cor do texto Logout*/
.user-block-role > a {
  color: #F44733 !important;
}

/*Borda*/
.bordalight {
  border: 1px solid rgba(0, 0, 0, 0.05);
}

/*Fundo preto (usado nas TreeViews)*/
.backgroundColorTreeView {
  border: 1px solid #cfdbe2;
}

/*Cor > TreeView*/
.gj-tree-material-icons-expander {
  color: #656565;
}

/*Cor linha selecionada TreeView filiais*/
.corLinhaFilialIdLogout {
  background-color: #edf1f2;
}

/*Hover botões grid*/
.bootgrid-header .btn-default:hover {
  color: #cfdbe2;
}

.link {
  color: #656565;
}

/*Cor do texto mensagens de alarmes do cabeçalho*/
.media-body > a {
  color: #656565;
}

/*Dropdown-menu*/
.dropdown-item:hover {
  background-color: #edf1f2;
}

.dropdown-menu > a {
  cursor: pointer;
}

/*Dropdown-menu pesquisa do cabeçalho*/
.dropdownUl .dropdownUl .dropdownUl {
  border: 1px solid #fff;
  background-color: #fff;
}

.dropdownUl .dropdownUl {
  border: 1px solid #d9d9d9;
  background-color: #fff;
}

.dropdownUl {
  background-color: #fff;
}

  .dropdownUl
  .dropdownLi
  a:hover {
    color: #F44733;
  }
