.container-signin {
  display: flex;
}

.half-signup,
.half-signin {
  flex: 1;
  height: 100vh;
}

.signin-img {
  background-image: url("/assets/background-login-e6bc9b72.jpg");
  background-repeat: no-repeat;
  background-position: top-left;
  background-size: cover;
}

.password-container {
  position: relative;
}

#togglePassword {
  position: absolute;
  top: 5px; /* Ajuste a distância do ícone do campo de senha */
  right: 10px; /* Alinha o ícone à direita, dentro do container */
  font-size: 18px;
  color: #0F3544; /* Ajuste conforme sua cor preferida */
}

.form-control.input-signin {
  padding-right: 30px; /* Espaço à direita do campo para não sobrepor o ícone */
}

.authentication-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    min-height: 100vh;
    width: 100%
}

.authentication-wrapper .authentication-inner {
    width: 100%
}

.authentication-wrapper.authentication-1,
.authentication-wrapper.authentication-2,
.authentication-wrapper.authentication-4 {
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.authentication-wrapper.authentication-1 .authentication-inner {
    max-width: 400px
}

.authentication-wrapper.authentication-2 .authentication-inner {
    max-width: 380px
}

.authentication-wrapper.authentication-3 {
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch
}

.authentication-wrapper.authentication-3 .authentication-inner {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-flex-pack: stretch;
    justify-content: stretch
}

.authentication-wrapper.authentication-4 .authentication-inner {
    max-width: 800px
}

.notification-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 12px;
  height: 12px;
  background: red;
  border-radius: 50%;
  border: 2px solid #fff;
  z-index: 1;
}

/* largura/estilo do dropdown */
.notification-menu {
  width: 360px;
}

#notification-dropdown .dropdown-toggle::after {
  display: none !important;
}

/* scroll igual lista da imagem 2 */
.notification-scroll {
  max-height: 420px;
  overflow-y: auto;
}

/* item com “cara de lista” e divisória */
.notification-item {
  cursor: pointer;
  border-bottom: 1px solid rgba(0,0,0,.08);
  white-space: normal;
}

/* título: até 2 linhas */
.notif-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}

.notif-text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}

/* remove scroll horizontal de vez */
.notification-scroll {
  overflow-x: hidden;
}

.notification-item:hover { 
  background: rgba(0,0,0,.03); 
}

/* “lidas” mais suaves */
.notification-item.is-read .fw-semibold {
  font-weight: 500;
  opacity: .85;
}

/* bolinha de status */
.notif-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  margin-top: .45rem; /* alinha com o texto */
  background: #f0ad4e; /* “amarelinho” parecido */
  flex: 0 0 auto;
}

/* se for lida, some a bolinha */
.notif-dot.is-read {
  background: transparent;
}

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
    .authentication-wrapper:after {
        content: '';
        display: block;
        -ms-flex: 0 0 0%;
        flex: 0 0 0%;
        min-height: inherit;
        width: 0;
        font-size: 0
    }
}


@media (max-width: 767.98px) {
  .container-signin {
    flex-direction: column;
  }

  .signin-img {
    display: none;
  }

  .half-signin {
    width: 100%;
    height: auto;
  }

  .authentication-wrapper {
    min-height: auto;
    padding: 40px 20px;
  }

  .authentication-inner {
    max-width: 100%;
  }

  .form-signin {
    width: 100%;
  }
}