/* COLORS */
/* Primary */
/* Secondary */
/* Support */
/* END COLORS */
/* TYPOGRAPHY */
/* Font Family */
/* Font Weight */
/* Font Size */
/* Font Line Height */
/* END TYPOGRAPHY */
/* STYLING TOKENS */
/* Spacing */
/* Radius */
/* Border */
/* Thickness */
/* Opacity */
/* Shadow */
/* Animation */
/* z-index */
/* Others */
.home__container {
  margin: 0 16px;
}
@media (width >= 768px) {
  .home__container {
    margin: 0 40px;
  }
}
@media (width >= 1200px) {
  .home__container {
    margin: 0 148px;
  }
}

.home__content {
  max-width: 100%;
}

.home__filtros {
  display: flex;
}
@media (width <= 767px) {
  .home__filtros {
    flex-direction: column;
  }
}

.home__filtros-espaco {
  width: 40px;
}
@media (width <= 767px) {
  .home__filtros-espaco {
    width: 0;
    height: 24px;
  }
}

.home__filtros-item {
  width: 100%;
}/* COLORS */
/* Primary */
/* Secondary */
/* Support */
/* END COLORS */
/* TYPOGRAPHY */
/* Font Family */
/* Font Weight */
/* Font Size */
/* Font Line Height */
/* END TYPOGRAPHY */
/* STYLING TOKENS */
/* Spacing */
/* Radius */
/* Border */
/* Thickness */
/* Opacity */
/* Shadow */
/* Animation */
/* z-index */
/* Others */
.banner {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #fff;
  border-bottom: 1px solid #cdd3cd;
}

.banner__container {
  display: flex;
  max-width: 100% !important;
  align-items: center;
  margin: 0;
}
@media (width <= 767px) {
  .banner__container {
    flex-direction: column;
    align-items: stretch;
  }
}

.banner__illustration {
  display: flex;
  flex: 1;
  justify-content: end;
}
@media (width <= 767px) {
  .banner__illustration {
    justify-content: center;
  }
}

.banner__content {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  max-width: 50%;
}
@media (width <= 767px) {
  .banner__content {
    max-width: 100%;
  }
}

.banner__title .diana-title {
  color: #33820d !important;
}

.banner__title,
.banner__subtitle {
  margin: 0;
}.seletor-periodo-mensal__input {
  padding-right: 0;
}

.seletor-periodo-mensal__campos {
  display: flex;
  place-content: flex-start space-between;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
}

.seletor-periodo-mensal__campo {
  width: 100%;
  min-width: 0;
}
.seletor-periodo-mensal__campo input {
  width: auto !important;
}

.seletor-periodo-mensal__campo--oculto {
  visibility: hidden;
}

.seletor-periodo-mensal__espacador {
  width: 48px;
}

.seletor-periodo-mensal__seletor {
  display: flex;
  margin-top: 48px;
}

.seletor-periodo-mensal__rotulo {
  margin-left: 8px;
}.tabela-lancamentos {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}.mobile-overlay {
  position: absolute;
  z-index: 1000;
  margin: 0;
  overflow: hidden auto;
  overscroll-behavior: contain;
  background: #fafafa;
  color: #3b3c3b;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
}
.mobile-overlay *,
.mobile-overlay *::before,
.mobile-overlay *::after {
  box-sizing: border-box;
  max-width: 100%;
}

.mobile-overlay__cabecalho {
  position: relative;
  display: flex;
  min-height: 72px;
  padding: 20px 56px 20px 16px;
  align-items: center;
  border-bottom: 1px solid #cdd3cd;
  background: #fafafa;
}
.mobile-overlay__cabecalho h2 {
  color: #323c32;
  margin: 0;
  font-family: "Exo 2", sans-serif;
  font-size: 24px;
  font-weight: 300;
  line-height: 1.3;
}

.mobile-overlay__fechar {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #3b3c3b;
  font: inherit;
  font-size: 32px;
  line-height: 1;
  transform: translateY(-50%);
  cursor: pointer;
}

.mobile-overlay__corpo {
  width: 100%;
  overflow-x: hidden;
}.alterar-periodo-overlay__conteudo {
  padding: 32px;
  max-width: 100%;
  box-sizing: border-box;
}
@media (max-width: 767px) {
  .alterar-periodo-overlay__conteudo {
    padding: 16px;
    width: 100%;
    overflow-x: hidden;
  }
}

.alterar-periodo-overlay__rodape {
  padding: 32px;
}
@media (max-width: 767px) {
  .alterar-periodo-overlay__rodape {
    padding: 16px;
    width: 100%;
    flex-direction: column;
    gap: 12px;
  }
}
@media (max-width: 767px) {
  .alterar-periodo-overlay__rodape button {
    width: 100%;
  }
}/* COLORS */
/* Primary */
/* Secondary */
/* Support */
/* END COLORS */
/* TYPOGRAPHY */
/* Font Family */
/* Font Weight */
/* Font Size */
/* Font Line Height */
/* END TYPOGRAPHY */
/* STYLING TOKENS */
/* Spacing */
/* Radius */
/* Border */
/* Thickness */
/* Opacity */
/* Shadow */
/* Animation */
/* z-index */
/* Others */
.extrato__container {
  min-width: 0;
  margin: 0 16px;
}
@media (width >= 768px) {
  .extrato__container {
    margin: 0 40px;
  }
}
@media (width >= 1200px) {
  .extrato__container {
    margin: 0 148px;
  }
}

.cabecalho {
  display: flex;
  align-items: stretch;
  width: 100%;
}
.cabecalho > *:not(.extrato__cabecalho-espaco) {
  flex: 1 1 0;
  min-width: 0;
}
.cabecalho div {
  display: flex;
  width: 100%;
}
.cabecalho dl {
  width: 100%;
}
@media (width < 1200px) {
  .cabecalho {
    flex-direction: column;
  }
}

.extrato__cabecalho-espaco {
  flex: 0 0 40px;
  width: 40px;
}
@media (width < 1200px) {
  .extrato__cabecalho-espaco {
    flex: 0 0 24px;
    width: 0;
    height: 24px;
  }
}

.extrato__filtros-acoes {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (width < 1200px) {
  .extrato__filtros-acoes {
    flex-direction: column;
    align-items: flex-start;
  }
}

.extrato__periodo {
  display: flex;
  align-items: center;
}
@media (width < 1200px) {
  .extrato__periodo {
    justify-content: space-between;
    width: 100%;
  }
}

.extrato__periodo-datas {
  display: flex;
  align-items: center;
}
@media (width < 1200px) {
  .extrato__periodo-datas {
    flex-direction: column;
    align-items: flex-start;
  }
}

.extrato__periodo-divisor {
  width: 1px;
  margin-left: 16px;
  margin-right: 16px;
  height: 24px;
  background: #5a645a;
}
@media (width < 1200px) {
  .extrato__periodo-divisor {
    display: none;
  }
}

.extrato__periodo-botao {
  margin-left: 40px;
}
@media (width < 1200px) {
  .extrato__periodo-botao {
    margin-left: 16px;
    margin-top: 0;
  }
}

.extrato__acoes {
  display: flex;
  align-items: center;
}
@media (width < 1200px) {
  .extrato__acoes {
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 16px;
  }
}

.extrato__acoes-botao-secundario {
  margin-left: 16px;
}
@media (width < 1200px) {
  .extrato__acoes-botao-secundario {
    margin-left: 0;
  }
}

.extrato__saldos {
  display: flex;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

.extrato__paginacao {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}/* COLORS */
/* Primary */
/* Secondary */
/* Support */
/* END COLORS */
/* TYPOGRAPHY */
/* Font Family */
/* Font Weight */
/* Font Size */
/* Font Line Height */
/* END TYPOGRAPHY */
/* STYLING TOKENS */
/* Spacing */
/* Radius */
/* Border */
/* Thickness */
/* Opacity */
/* Shadow */
/* Animation */
/* z-index */
/* Others */
.navigation-bar {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 56px;
  background-color: #33820d;
}
@media (width >= 768px) {
  .navigation-bar {
    min-height: 72px;
  }
}

.navigation-bar__brand {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex: 0 0 auto;
  padding: 0 16px;
}
@media (width >= 768px) {
  .navigation-bar__brand {
    padding: 0 40px;
  }
}
@media (width >= 1200px) {
  .navigation-bar__brand {
    padding: 0 148px;
  }
}

.navigation-bar__logo {
  display: block;
  max-height: 32px;
  width: auto;
}
@media (width >= 768px) {
  .navigation-bar__logo {
    max-height: 40px;
  }
}/* COLORS */
/* Primary */
/* Secondary */
/* Support */
/* END COLORS */
/* TYPOGRAPHY */
/* Font Family */
/* Font Weight */
/* Font Size */
/* Font Line Height */
/* END TYPOGRAPHY */
/* STYLING TOKENS */
/* Spacing */
/* Radius */
/* Border */
/* Thickness */
/* Opacity */
/* Shadow */
/* Animation */
/* z-index */
/* Others */
html,
body {
  width: 100%;
  height: 100%;
  background: #fafafa;
  -webkit-font-smoothing: antialiased;
}

body {
  color: #323c32;
  font-family: "Nunito", sans-serif;
}
body *,
body *::after,
body *::before {
  font-family: inherit;
}
body.sicredi-focus-disabled *:focus {
  outline: none;
}

html,
body,
#root {
  width: 100%;
  min-height: 100vh;
  margin: 0;
  padding: 0;
}

main {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

thead button {
  background: #fafafa;
}

a {
  color: #323c32;
}.not-found-container {
  max-width: 630px;
  display: flex;
  text-align: center;
  place-self: center center;
}