/* Scroll horizontal contido dentro do tab-panel em telas pequenas (NonCompliances) */
.nc-x-scroll {
  overflow-x: auto !important;
  min-width: 0 !important;
  width: 100% !important;
  -webkit-overflow-scrolling: touch;
}

/* Force navbar to be sticky */
.layout-navbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 1030 !important;
  height: auto;
}

/* Override any opacity/display rules that might hide the navbar */
.layout-navbar {
  opacity: 1 !important;
  pointer-events: auto !important;
  display: flex !important;
}

/* Mantém o dropdown do HelperBot acima do conteúdo e dos demais itens do menu. */
.helper-bot-menu-btn-container {
  position: relative;
  z-index: 1081;
  overflow: visible;
}

.helper-bot-menu-btn-container > .dropdown-menu {
  z-index: 1082;
  position: absolute;
  overflow: visible;
}

#helperbot-container {
  min-width: 24rem;
/*  max-width: calc(100vw - 2rem);*/
  max-width: 32rem !important;
  overflow: visible;
}

.helperbot-messages {
    padding-top: 0.5rem;
    border-radius: var(--bs-border-radius);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 1rem;
    overflow-y: auto;
    height: 25rem;
}

.helperbot-message {
    max-width: 75%;
    padding: 0.5rem;
    color: var(--bs-white);
    border-radius: var(--bs-border-radius);
/*    white-space: pre-line;*/
}

.helperbot-user-message {
    align-self: end;
    background-color: var(--bs-success);
}

.helperbot-bot-message {
    align-self: start;
    background-color: var(--bs-secondary);
}

.helperbot-plaintext {
/*    white-space: pre-wrap;*/
    overflow-wrap: anywhere;
}

.helperbot-markdown {
    overflow-wrap: anywhere;
}

.helperbot-markdown > *:first-child {
    margin-top: 0;
}

.helperbot-markdown > *:last-child {
    margin-bottom: 0;
}

.helperbot-markdown p,
.helperbot-markdown ul,
.helperbot-markdown ol,
.helperbot-markdown pre,
.helperbot-markdown blockquote,
.helperbot-markdown table {
    margin-bottom: 0.5rem;
}

.helperbot-markdown ul,
.helperbot-markdown ol {
    padding-left: 1.25rem;
}

.helperbot-markdown h1,
.helperbot-markdown h2,
.helperbot-markdown h3,
.helperbot-markdown h4,
.helperbot-markdown h5,
.helperbot-markdown h6 {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.375rem;
}

.helperbot-markdown h1 { font-size: 1.1rem; }
.helperbot-markdown h2 { font-size: 1.05rem; }

.helperbot-markdown a {
    color: var(--bs-white);
    text-decoration: underline;
}

.helperbot-markdown code {
    background: rgba(0, 0, 0, 0.25);
    padding: 0 0.25rem;
    border-radius: 3px;
    font-size: 0.85em;
}

.helperbot-markdown pre {
    background: rgba(0, 0, 0, 0.25);
    padding: 0.5rem;
    border-radius: var(--bs-border-radius);
    overflow-x: auto;
}

.helperbot-markdown pre code {
    background: transparent;
    padding: 0;
}

.helperbot-markdown blockquote {
    border-left: 3px solid rgba(255, 255, 255, 0.5);
    padding-left: 0.5rem;
    margin-left: 0;
}

.helperbot-markdown table {
    width: 100%;
    font-size: 0.875rem;
    border-collapse: collapse;
}

.helperbot-markdown th,
.helperbot-markdown td {
    border: 1px solid rgba(255, 255, 255, 0.35);
    padding: 0.25rem 0.375rem;
    text-align: left;
}

.helperbot-dropdown-detached {
  z-index: 2000 !important;
}

@media (max-width: 1199.98px) {
  .helper-bot-menu-btn-container {
    z-index: 1101;
  }

  .helper-bot-menu-btn-container > .dropdown-menu {
    z-index: 1102;
  }
}

/* Comportamento responsivo em telas pequenas (Bootstrap sm breakpoint < 576px) */
@media (max-width: 575.98px) {

  .helperbot-dropdown-detached {
    display: block !important;
    position: fixed !important;
    top: 4rem !important;
    left: 1rem !important;
    right: auto !important;
    bottom: auto !important;
    height: auto !important;
    margin: 0 !important;
    max-width: calc(100vw - 1rem);
    max-height: calc(100vh - 4.5rem);
    max-height: calc(100dvh - 4.5rem);
    overflow-y: auto;
    z-index: 2000;
    transform: none !important;
  }

  .helperbot-dropdown-detached .helperbot-container {
    width: 24rem;
    max-width: calc(100vw - 1rem);
  }
}

/* ------------------------------ */
/* ---- CSS DA TELA DE LOGIN ---- */
/* ------------------------------ */

#bg-img {
    animation: backgroundImgFade 3s ease-in;
}

@keyframes backgroundImgFade {
    from {
        opacity: 0;
    }
    
    to {
        opacity: 1;
    }
}

.bg-login-gradient {
    background: radial-gradient(rgba(51, 142, 66, 0.8), rgba(0, 0, 0, 0.8));
    animation: backgroundFade 0.2s ease-out;
}

@keyframes backgroundFade {
    from {
        opacity: 0;
    }
    
    to {
        opacity: 1;
    }
}

#login-card {
    animation: fadeInUp 0.8s ease-out;
}

/* Animação fade-in com movimento de baixo para cima */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Loader */
/* container full-screen */
/*.loading-screen {
    position: fixed;
    inset: 0;*/ /* top:0; right:0; bottom:0; left:0 */
    /*display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(0,120,60,0.9), rgba(0,160,90,0.85));*/ /* seu gradiente verde */
    /*z-index: 20000;
    transition: opacity 0.7s ease;
    -webkit-transition: opacity 0.7s ease;
    pointer-events: auto;
}*/

/* conteúdo interno — centraliza */
/*.loading-inner {
    display: flex;
    align-items: center;
    justify-content: center;
}*/

/* wrapper relativo para as duas camadas promoverem overlay corretamente */
/*.logo-wrapper {
    position: relative;
    width: 280px;*/ /* ajuste conforme sua logo */
    /*height: auto;*/
    /* forçar caixa de conteúdo consistente */
    /*display: block;
}*/

    /* imagens posicionadas absolutas para sobreposição perfeita */
    /*.logo-wrapper .logo {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;
        display: block;
        pointer-events: none;
    }*/

/* camada de baixo — transparente */
/*.logo-base {
    opacity: 0.25;
    filter: saturate(0.9);
    transform: translateY(0);
}*/

/* camada de cima — iniciará "invisível" por clip-path (cortada de baixo) */
/*.logo-fill {*/
    /* usa clip-path inset para esconder a parte superior; começa cortada 100% de baixo */
    /*-webkit-clip-path: inset(100% 0 0 0);
    clip-path: inset(100% 0 0 0);*/
    /* animação que move a inset de 100% para 0% */
    /*animation: logoFill 2.4s ease-in-out forwards;
    -webkit-animation: logoFill 2.4s ease-in-out forwards;
}*/

/* keyframes para o reveal bottom->top */
/*@keyframes logoFill {
    0% {
        clip-path: inset(100% 0 0 0);
        -webkit-clip-path: inset(100% 0 0 0);
    }

    100% {
        clip-path: inset(0% 0 0 0);
        -webkit-clip-path: inset(0% 0 0 0);
    }
}*/

/* classe para esconder o splash via opacity (fade-out) */
/*.loading-screen.hidden {
    opacity: 0;
    pointer-events: none;
}*/