:root {

    --cor-primaria: #11181F;
    --cor-secundaria: #1d2731;
    --cor-terciaria: #04070A;
    --cor-fundo-escuro: #070C11;
    --cor-fundo-modal: #0F1419;
    --cor-fundo-campo-piloto: #141B22;
    --cor-fundo-help: #171f25;


    --cor-azul-claro: #2ec2c5;
    --cor-azul-escuro: #03646C;

    --cor-azul-escuro-hover: #034749;
    --cor-azul-escuro-active: #012323FF;
    
    --cor-azul-escuro-btn-hover: #023236;
    
    --cor-cinza-progress-bar: #929292;
    --cor-cinza-escuro: #555555;
    --cor-cinza-claro: #D9D9D9;
    --cor-cinza-medio: #858585;

    --cor-menu-selecionado: #2ec2c5;

    --cor-background-input: #141B22;
    --cor-border-input: #434343;
    --border-input: 0.5px solid var(--cor-border-input);

    /*--cor-primaria: #0E0E0E;*/
    --side-color: #FFFFFF;
    --weak-text: #7e7f7f;

    --zeus-btn-gradient:
        radial-gradient(155% 100% at 60% 50%,  /* size + anchor point   */
        #33c7ca   0%,   /* bright core (≈ #2EC2C5) */
        #2E9193  35%,   /* mid-teal ring          */
        #165E5F 100%    /* dark edge              */
    );

    --zeus-shadow: 0 6px 12px rgba(0,0,0,.25);

    --backgroud-card: #EBE9E9;
    --box-shadow-padrao: rgba(0, 0, 0, 0.25) 0 2px 5px;
    --box-shadow-input: 0px 2px 5px 0px #00000040;
    --area-card-color: #d2d2d2;
    --background-geral: #F5F6F7;

    --border-radius-padrao: 8px;
    --border-radius-dialogs: 12px;
    --gap-padrao: 1rem;

    --header-min-heigth: 110px;
    --botao-desativado: #858585;
    --margin-link: 0 15px;
    --heigth-input-select: 56px;
    --padding-select-small: 6px;

    /*  FONT SIZES  */
    --fs-0: 16px;
    --fs-1: 15px;
    --fs-2: 16px;
    --fs-3: 17px;
    --fs-4: 18px;
    --fs-5: 19px;

    --sidebar-size: clamp(200px, 15vw, 260px);

}

textarea.form-control {
    background-color: rgb(255, 255, 255) !important;
    min-height: calc(1.5em + .75rem + calc(var(--bs-border-width)* 2));
    color: dimgrey;
} 

textarea.form-control:focus{
    background-color: rgb(255, 255, 255);
    min-height: calc(1.5em + .75rem + calc(var(--bs-border-width)* 2));
    color: dimgrey;
}
.form-label{
    margin-bottom: 0;
}
.div-interrogacao{
    margin-bottom: 5px;
}
.btn-transparente-padrao{
    background: rgba(3, 100, 108, 0.3) !important;
    background-color: rgba(3, 100, 108, 0.3) !important;
    border:1px solid var(--cor-azul-claro) !important;
    font-weight: 500;
    font-size: 14px;
}
.btn-transparente-padrao:hover{
    background: var(--zeus-btn-gradient) !important;
}
* {
    font-family: 'Poppins', sans-serif;
    margin: 0;
    padding: 0;
}
.title-azul-claro{
    color: var(--cor-azul-claro) !important;
}
body {
    position: relative;
}

.nota_bookmark{
    display: none !important;
}

.select-empresas-configuracoes {
    width: 90%;
    margin-inline: auto;
    height: 37px;
}

.table>:not(caption)>*>* {
    padding: .5rem .5rem;
    /* color: var(--bs-table-color-state, var(--bs-table-color-type, #fff)) !important; */
    /* background-color: var(--bs-table-bg); */
    /* border-bottom-width: var(--bs-border-width); */
    /* box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state, var(--bs-table-bg-type, var(--bs-table-accent-bg))); */
}

.accordion-button:not(.collapsed) {
    color: black;
}

.accordion-item:first-of-type>.accordion-header .accordion-button {
    background-color: rgba(240, 236, 236, 1);
    backdrop-filter: blur(5px);
}


.nav-link:active,
.nav-link:focus {
    color: #cecece;
    text-decoration: none;
    /* Opcional: para remover sublinhado */
    outline: none;
    /* Opcional: para remover a borda de foco */
}


::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-size: 16px;
}

.btn-warning {
    border: none;
    --bs-btn-active-bg: var(--cor-menu-selecionado);
    --bs-btn-active-border-color: none;
}

.botao_padrao:hover {
    color: var(--side-color);
    background-color: var(--cor-menu-selecionado);
}

.texto-azul-escuro{
    color: var(--cor-azul-escuro);
}
.texto-azul-claro{
    color: var(--cor-azul-claro);
}
.default-color {
    filter: brightness(0) saturate(100%) invert(1);
    /* Torna a imagem branca */
}

.clicked-color {
    filter: none;
    /* Remove o filtro para mostrar a cor original */
}

#load {
    position: fixed;
    display: block;
    z-index: 2147483647;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(128, 128, 128, 0.5);
    align-content: center;
}

#load>div {
    animation: is-rotating 1s infinite;
    border: 6px solid #e5e5e5;
    border-radius: 50%;
    border-top-color: #51d4db;
    height: 50px;
    width: 50px;
    margin: auto;
}

@keyframes is-rotating {
    to {
        transform: rotate(1turn);
    }
}

.link-sidebar>b {
    font-family: 'Ubuntu', sans-serif !important;
    line-height: 20.7px;
   
}

body {
    height: fit-content;
    min-height: 100svh;
    display: grid;
    /* Activates the grid layout for children of this container */
    grid-template-columns: var(--sidebar-size) 1fr;
    /* Defines the number and size of columns, or 33% 34% 33% or 50% 50%...*/
    grid-template-rows: var(--header-min-heigth) 1fr;
    /* Defines the number and size of rows */
    margin: 0;
    background-color: var(--cor-primaria);
    overflow-x: hidden;
}

.nav-link.active_resp{
    color: var(--cor-azul-claro);
}

.hidden {
    display: none !important;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: var(--cor-secundaria);
    color: var(--cor-azul-claro) !important;
    height: 100%;
    width: 98%;
}

.nav-link.active {
    background-color: var(--cor-fundo-campo-piloto);
}

.botao_proximo {
    gap: 17px;
}

.card {
    --bs-card-border-color: none !important;
}

header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.dropdown-usuario {
    display: grid;
    grid-template-columns: 10.25em 3.75em;
    grid-template-rows: 1.88em 1.88em;
    align-content: center;
    text-align: -webkit-center;
}

.navbar-empresa-usuario {
    margin-block: auto;
    display: flex;
    flex-direction: row;
    cursor: pointer;
    justify-self: end;
    margin-right: 10%;
}


.texto-progresso{
    font-size: 16px;
    text-align: center;
}

.dias_restantes {
    justify-self: center;
    align-self: center;
    color: var(--cor-menu-selecionado);
}

.empresa-selecionada {
    width: 120px;
    height: 75px;
    border-radius: 10px;
    text-align: center;
    color: var(--side-color);
    border: 2.5px solid rgba(255, 255, 255, 0.4);
    align-content: center;
    box-shadow: var(--box-shadow-padrao);
}

.texto-usuario {
    margin-right: 1em;
    font-size: 1.3em;
    color: var(--side-color);
}

.texto-role-usuario {
    margin-right: 1em;
    margin-top: -0.2em;
    color: var(--weak-text);
}

.barra-pesquisa {
    width: 100%;
    display: flex;
    margin-bottom: 0 !important;
}

.input-pesquisar {
    width: max(250px, 50%);
    box-sizing: border-box;
    border: 2px solid var(--side-color);
    border-radius: var(--border-radius-padrao);
    font-size: 1.3em;
    background-color: var(--side-color);
    background-image: url(../../imgs/icons/pesquisa.png);
    background-position: 10px 19px;
    background-repeat: no-repeat;
    padding: 12px 20px 12px 40px;
    background-size: 20px 20px;
    height: 55px;
    min-height: 55px;
    margin: auto;
}

.header-grid-responsivo {
    display: grid;
    grid-template-columns: 106% 35%;
    grid-template-rows: 1fr;
    width: 100%;
    padding: 20px;
    min-height: 110px;
    margin-left: auto;
    margin-right: 15px;
}

.header {
    background-color: var(--cor-primaria);
    grid-column: 2 / 2;
    grid-row: 1 / 1;
    height: var(--header-min-heigth);
    min-height: var(--header-min-heigth);
}

.sidebar {
    background-color: var(--cor-primaria);
    grid-column: 1 / 1;
    grid-row: 1 / -1;
    border-right: 1px solid #575757;
}

.main {
    background-color: var(--cor-fundo-escuro);
    grid-column: 2 / 2;
    grid-row: 1 / 3;
    position: relative;
}

.main-border {
    background-color: var(--cor-fundo-escuro);
    width: 100%;
    height: fit-content;
    min-height: 100vh;
    z-index: 10;
    position: relative;
    padding: 40px;
}


li.item-menu > a.nav-link.link-sidebar.active {
    border-radius: 0;
}


.div-logo-titan {
    width: var(--sidebar-size);
}

button[disabled] {
    cursor: not-allowed;
    background-color: var(--botao-desativado) !important;
    background: var(--botao-desativado) !important;
}
.btn-passo-a-passo{
    font-weight: 500 !important;
    font-size: 14px !important;
}

.disabled-link {
    pointer-events: none;
    /* Prevents click events */
    cursor: default;
    /* Changes the cursor to the default arrow */
    color: gray;
    /* Changes the text color to gray */
    text-decoration: none;
    /* Removes underline */
}

.logo-titan {
    width: clamp(100px ,166px, 12vw);
    margin-inline: auto;
    margin-top: 10%;
}

.lista-menu {
    margin-top: 20px;
    gap: 10px;
    margin-left: auto;
    font-size: 18px;
    font-weight: 500 !important;
    font-family: Montserrat, sans-serif;
}

.item-menu:not(:has(.dropdown-sidebar-toggle)) {
    height: 4.6vh;
    width: 100%;
    margin: 7px 2px;
}

.dropdown-sidebar-menu li.embreve {
    pointer-events: none;          /* realmente desativa clique */
    cursor: default;
    display: flex;
    flex-direction: column;
    align-items: flex-start;       /* mantém alinhamento à esquerda */
    background: transparent !important;
}

/* link principal em cinza fraco (usa já seu token de cor fraca) */
.dropdown-sidebar-menu li.embreve > .dropdown-item {
    color: var(--weak-text) !important;
}

/* selo EM BREVE */
.badge-breve {
    font-size: 0.70rem;            /* um pouco menor que o corpo */
    line-height: 1;
    margin-top: -10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--cor-azul-claro);  /* azul-claro do tema */
    user-select: none;
    margin-left: 80px;
}

/* opcional: suave animação “pulso” para chamar atenção */
@keyframes pulse-breve {
    0%, 100% { opacity: 1; transform: translateY(0); }
    50%      { opacity: .4; transform: translateY(1px); }
}
.badge-breve {
    animation: pulse-breve 3s ease-in-out infinite;
}



.dropdown-sidebar-menu {

    list-style-type: none;
    padding-left: 0;
    
    a {
        color: var(--cor-cinza-claro);
        font-size: clamp(12px, 0.85rem, 18px);
        min-height: 4.2vh;
        height: 4.2vh;
        position: relative;
        display: flex;
        flex-direction: row;
        align-items: center;
        margin-left: 55px;
    }

    a:hover, 
    a:focus,
    a:active {
        color: var(--cor-azul-claro);
        cursor: pointer;
    }

    li:hover, li.active {

        background-color: var(--cor-secundaria);
        width: 98%;

        a {
            color: var(--cor-azul-claro) !important;
        }

    }

    .dropdown-item.active, .dropdown-item:active {

        color: var(--cor-azul-claro) !important;
        text-decoration: none;
        background-color: none;

    }

}

.lista-menu{
    .dropdown-toggle::after {
        display: none !important;
    }
}

.container-icone-nome-dropwdown {

    b {
        font-family: 'Montserrat', sans-serif !important;
        line-height: 20.7px;
        font-weight: 500 !important;
    }
}


.item-menu>.active {
    background-color: var(--background-geral);
}

.icone-menu {
    width: 30px;
    height: 30px;
    margin-right: 10px;
}

.nav-link {
    color: var(--cor-cinza-claro);
    font-size: clamp(14px, 1rem, 20px);
    min-height: 50px;
    position: relative;
    display: flex;
    flex: row;
    align-items: center;
    /* justify-content: center; */
}

.nav-link:hover {
    color: var(--cor-menu-selecionado);
    background-color: var(--cor-secundaria);
}

.fixed-bottom {
    bottom: 15px;
    position: fixed;
    width: var(--sidebar-size);
}

.link-sidebar-pai.dropdown-toggle {

    cursor: pointer;
    height: 4.6vh;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    
    b {
        margin-right: 10px;
    }

    > .icone-menu-dropdown {
        margin-right: 15px;
        transition: transform .2s;
    }

    .icone-menu-dropdown-open {
        transform: rotate(180deg);
    }

}

.dropdown-sidebar-menu {
    display: none;
}

.fixed-middle {
    top: 17.5%;
    position: fixed;
    width: var(--sidebar-size);
    resize: none;
    overflow-y: scroll;
    height: 100%;
    overflow-x: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.fixed-top {
    top: 0;
    position: fixed;
    width: var(--sidebar-size);
    z-index: 100 !important;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.fixed-bottom {
    z-index: 100 !important;
}

.botao-sidebar-responsivo {
    display: none !important;
}

.logo-responsivo {
    display: none !important;
}

.navbar-collapse {
    display: none;
}

.card {
    box-shadow: var(--box-shadow-padrao);
    padding: 3px 8px 3px 8px;
    background-color: var(--backgroud-card);
}

.card-generico {
    width: 90%;
    height: fit-content;
    margin-top: 15px;
}

/* .item-menu>.active::before,
.item-menu>.active::after {

    --border-radius-link: 1rem;

    content: '';
    position: absolute;
    width: var(--border-radius-link);
    height: var(--border-radius-link);
    right: 18px;
    border-radius: 100vw;
}

.item-menu>.active::before {
    top: calc(var(--border-radius-link) * -1);
    border-radius: 0 0 100vw 0;
    box-shadow: 10px 10px 0 10px var(--background-geral);
}

.item-menu>.active::after {
    bottom: calc(var(--border-radius-link) * -1);
    border-radius: 0 100vw 0 0;
    box-shadow: 10px -10px 0 10px var(--background-geral);
} */

.div-titulo-pag-flex {
    align-items: center;
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-bottom: 52px;
}

.div-titulo-pag-flex::after {
    content: '';
    position: absolute;
    left: 25px;
    bottom: 4px;
    width: 98%;
    border-bottom: 1px solid #ABAAAA;
}

.div-titulo {
    width: 90%;
    /* margin-left: 12px; */
    display: flex;
    align-items: center;
}

.div-titulo-btn {
    /* margin-right: 33px; */
    height: 14%;
    width: 40%;
    display: flex;
    justify-content: end;
}

* {
    font-family: 'Poppins', sans-serif;
}


.texto-perfil {
    color: var(--weak-text);
    margin: 25px;
    font-family: Poppins, sans-serif;
}

.fundo-clientes {
    width: 100% !important;
    /* background-color: var(--backgroud-card) !important; */
 
    margin-right: 0px;
    border-radius: var(--border-radius-padrao);
   

}

.titulo-perfil {
    font-weight: 700;
    font-family: Poppins, sans-serif;
    margin: 9px 0px;
    color: white;
    font-size: 19px;
}

.sidebar, .menu-dropdown {
    z-index: 9;     /* smaller than Bootstrap’s 1050/1055 */
}

/* —or— raise the modal */
.modal {
    z-index: 12;
}

.div-titulo {
    gap: 33px;
    /* width: 229%; */
    margin-left: 7px;
    display: flex;
    align-items: center;
}

.titulo-txt-campanha {
    margin: 2px !important;
}

.btn-padrao-laranja {
    align-items: center;
    display: flex;
    background-color: var(--cor-menu-selecionado);
    color: white;
    font-size: 16px;
    font-family: Poppins, sans-serif;
    font-weight: 700;
    /* width: 63%; */
    border-radius: 8px;
    border: none;
    padding: 8px 34px;
    gap: 11px;
}

.btn-padrao-preto {
    align-items: center;
    display: flex;
    background-color: var(--cor-primaria) !important;
    color: white;
    font-size: 16px;
    font-family: Poppins, sans-serif;
    font-weight: 600;
    /* width: 63%; */
    border-radius: 8px;
    border: none;
    padding: 8px 34px;
    gap: 11px;
    justify-content: center;
}

.btn-padrao-vermelho {
    align-items: center;
    display: flex;
    background-color: #e80707;
    color: white;
    font-size: 16px;
    font-family: Poppins, sans-serif;
    font-weight: 600;
    /* width: 63%; */
    border-radius: 8px;
    border: none;
    padding: 8px 34px;
    gap: 11px;
    justify-content: center;
}

.btn-padrao-cinza {
    align-items: center;
    display: flex;
    background-color: var(--botao-desativado);
    color: white;
    font-size: 16px;
    font-family: Poppins, sans-serif;
    font-weight: 700;
    /* width: 63%; */
    border-radius: 8px;
    border: none;
    padding: 8px 34px;
    gap: 11px;
}

.btn-transparente-form-passo{
    border-radius: 10px;
    padding: 10px 40px 10px 40px;
    border: 1px solid #03646CFF;
    background-color: var(--backgroud-card);
    color: var(--cor-azul-escuro);
    font-size: 18px;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    opacity: 0.96;
    transition: background-color 0.05s ease-in-out 0.05s, color 0.05s ease-in-out 0.05s;
}
.btn-transparente-form-passo:hover{
    background-color: var(--cor-azul-escuro);
    color: #fff;
    cursor: pointer;
}
.btn-transparente-form-passo:active{
    background-color: var(--cor-azul-escuro-active);
}
.btn-escuro-form-passo{
    border-radius: 10px;
    padding: 10px 40px 10px 40px;
    border: none;
    background-color: var(--cor-azul-escuro);
    color: #fff;
    font-size: 18px;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
}
.btn-escuro-form-passo:hover{
    background-color: var(--cor-azul-escuro-hover);
}
.btn-escuro-form-passo:disabled{
    background: #6c6c6c;
    cursor: not-allowed;
}

.div-btn-salvar-card {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 17px 0;
    gap: 19px;
}

.botao-padrao {
    background-color: #0E0E0E;
    font-weight: 700;
    font-size: 14px;
    color: #FFFFFF;
    border-radius: 10px;
    border: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    box-shadow: var(--box-shadow-padrao);
    height: 46px;
    padding: 0px 42px;
}

.botao-padrao:hover {
    background-color: var(--cor-menu-selecionado);
}

.card-body-clientes .botao-padrao {
    height: 36px;
    margin-top: 15px;
    cursor: pointer;
}

.card-body-clientes .botao-padrao:hover {
    background-color: var(--cor-menu-selecionado);
}

.btn-duvida {
    
    background-color: var(--cor-cinza-claro);
    border-radius: 100px;
    width: 28px;
    height: 28px;
    color: #fff;
    font-size: 19px;
    font-weight: 700;
    font-family: 'Ubuntu', sans-serif;
    border: none;
    cursor: pointer;
}


.btn-duvida:hover{
    background-color: var(--cor-menu-selecionado);
}

.weak-text {
    color: var(--weak-text) !important;
}

.strong-text{
    font-weight: bold
}

.menu-link-disabled {
    pointer-events: none;
    /* Disable clicking */
    cursor: default;
    /* Change the cursor */
    color: grey;
    /* Optional: change text color */
    text-decoration: none;
    /* Optional: remove underline */
}

.select_input {
    padding: 6px;
    border-radius: 8px;
    border: none;
    font-size: 18px;
    font-weight: 600;
    font-family: "Poppins", sans-serif;
    color: rgba(23, 25, 32, 1);
    width: 100%;
}




.div-modal-info {
    position: relative;
    height: auto;
    width: 80%;
    display: flex;
    justify-content: end;
    align-items: center;
    margin-top: 30px;
}


.div-flex-modal-info {
    gap: 13px;
    display: flex;
    align-items: start;
    justify-content: start;
}


.btn-duvida {
    cursor: pointer;
    /* Indica que é clicável */
}


.btn-duvida-orcamento {
    position: relative;
    right: 0 !important;
}

.modal-info {
    padding: 13px;
    border-radius: 15px;
    display: none;
    position: absolute;
    top: 102%;
    left: -54px;
    background-color: #dee2e6;
    z-index: 100;
    width: 100%;
    height: 92px;
}

.texto-modal-duvida {
    font-size: 14px;
    font-weight: 500;
    color: var(--botao-desativado);
    font-family: 'Poppins', sans-serif;

}

.btn-duvida:hover+.modal-info,
.btn-duvida:focus+.modal-info {
    display: block;
}

.img-icone-info {
    width: 16px;
    height: 14px;

}


.btn-duvida-clientes {
    position: absolute !important;
    left: 0 !important;

}

.modal-info-clientes-salvo {

    padding: 13px;
    border-radius: 15px;
    display: none;
    position: absolute;
    top: 89%;
    right: -54px;
    background-color: #dee2e6;
    z-index: 100;
    width: 100%;
    height: 67px;
}

.modal-info-clientes {
    top: -47px !important;
    padding: 13px;
    border-radius: 15px;
    display: none;
    position: absolute;
    /* top: 98%; */
    right: -51px;
    background-color: #dee2e6;
    z-index: 100;
    width: 99%;
    height: 82px;
}


.div-modal-info-clientes {
    z-index: 300;
    position: relative;
    height: auto;
    width: 64%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* margin-top: 30px; */
}


.btn-duvida-clientes:hover+.modal-info-clientes,
.btn-duvida-clientes:focus+.modal-info-clientes {
    display: block;
}


.btn:hover {
    border: none;
    color: var(--bs-btn-hover-color);
    background-color: var(--cor-menu-selecionado);
    border-color: none;
}

.div-titulo-passos::after {
    content: '';
    position: absolute;
    left: 1px !important;
    bottom: -14px;
    width: 100% !important;
    border-bottom: 1px solid #ABAAAA;
}

.icone_enviar {
    width: 22px;
    height: auto;
}

.nav-link-disabled {

    color: #ccc !important;
    pointer-events: none;
    cursor: default !important;

}

#negocioDropdownResponsivo {
    width: 70%;
    min-width: 250px;
    align-self: center;
    margin: 20px;
    .dropdown-button {
        width: 100%;
        margin: auto;
    }

    .menu-dropdown  {
        width: 90%;
        left: 50%;
        transform: translateX(-50%);
    }
}


#negocioDropdown {

    .dropdown-button {
        width: 90%;
        margin: auto;
    }

    .menu-dropdown  {
        width: 90%;
        left: 50%;
        transform: translateX(-50%);
    }

}


#sidebarIdentidadeVisual {
    font-size: clamp(12px, 0.85rem, 18px);
}


/* CELULAR */
@media (max-width: 1000px) {
    body {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: max(100px, 12vh) 1fr;
        margin: 0;
        background-color: var(--cor-primaria);
        width: 100%;
        max-width: 100%;
    }

    .header {
        background-color: var(--cor-primaria);
        grid-column: 1;
        grid-row: 1;
        display: flex !important;
        z-index: 200;
    }

    .main {
        background-color: var(--cor-primaria);
        grid-column: 1;
        grid-row: 2;
        width: 100%;
        justify-content: center;
        min-height: 90svh;
    }

    .main-border {
        display: flex;
        flex-direction: column;
        align-items: center;
        border-radius: 25px;
        width: 98%;
        margin: auto;
        padding: 35px 20px;
    }

    .navbar-empresa-usuario {
        display: none;
    }

    .header-grid-responsivo {
        display: grid;
        /* Activates the grid layout for children of this container */
        grid-template-columns: 0% 1fr 65px;
        /* Defines the number and size of columns, or 33% 34% 33% or 50% 50%...*/
        grid-template-rows: 100%;
        /* Defines the number and size of rows */
        width: 100%;
        margin-right: 0;
        align-items: center;
    }

    .barra-pesquisa {
        grid-column: 1 / 3 span;
        grid-row: 2;
        width: 100%;
        margin: 0 0 0 -4.75vw !important;
        align-content: center;
        justify-content: center;
    }

    .dropdown-usuario {
        grid-column: 1;
        grid-row: 1;
        margin-left: auto;
    }

    .botao-sidebar-responsivo {
        display: block !important;
        grid-column: 3;
        grid-row: 1;
        width: fit-content;
    }

    .logo-responsivo {
        display: block !important;
        grid-column: 2;
        grid-row: 1;
        margin-right: auto;
    }

    .logo-titan {
        width: max(160px, 12vw);
        /* height: max(30px, 3.5vw); */
    }

    .btn-sidebar {
        width: 50px;
        height: 50px;
        margin-left: 50px;
    }

    .html-responsivo {
        width: 100% !important;
    }

    .fixed-bottom,
    .fixed-middle,
    .fixed-top,
    .texto-role-usuario,
    .texto-usuario,
    .empresa-selecionada {
        display: none !important;
    }

    .btn-navbar {
        width: 50px;
        height: 50px;
        color: var(--cor-primaria);
        border: 1px solid var(--cor-primaria);
        border-radius: 50%;
        background-color: var(--side-color);
    }

    .navbar-collapse.collapsing,
    .navbar-collapse.show {
        background-color: var(--cor-fundo-campo-piloto) ;
        backdrop-filter: blur(10px);
        margin-top: 20vh;
        /* Ajuste este valor para mover o conteúdo para baixo conforme necessário */
        display: block !important;
        border: 1px solid var(--cor-primaria);
        z-index: 1000;
    }

    .navbar-collapse {
        min-width: max(96%, 300px);
        border-radius: 10px;
        position: absolute !important;
        left: 2%;
        top: -8vh;
    }

    .nav-item {
        padding: 2px 5px;
        font-size: 1.2em;
        text-align: center;
        color: var(--cor-cinza-claro);
        width: 100%;
        border: 1px solid var(--cor-primaria);
    }

    .nav-item .dropdown-menu {
        position: static;
        width: 100%;
        border: none;
        background-color: inherit;
        display: flex;
        flex-direction: column;
        text-align: center;
        color: var(--cor-cinza-claro);
    }

    .nav-item a {
        color: inherit;
        text-align: left;
        width: 100%;
        padding: 5px 0;
    }

    .nav-item a:active {
        color: var(--cor-azul-escuro-active) !important;
    }
    .nav-link {
        color: var(--cor-primaria);
    }

    .link-nav-responsiva:hover,
    .link-nav-responsiva:active {
       
        color: var(--cor-azul-claro);
       
    }
    .help-popup{
        left: 0;
        width: 90vw;
        transform: translateX(-63%);
    }
}

/* RESTO */
@media (min-width: 1001px) and (max-width: 1400px) {
    .header-grid-responsivo {
        grid-template-columns: 111% 50%;
        grid-template-rows: 1fr;
        width: 100%;
        margin-right: 0;
    }

    .navbar-empresa-usuario {
        gap: max(15px, 10%);
    }

    .barra-pesquisa {
        width: 100%;
    }

    .input-pesquisar {
        width: max(250px, 100%) !important;
        margin-left: 0 !important;
    }
    .navbar-nav {
        --bs-nav-link-padding-x: 0;
        --bs-nav-link-padding-y: 0.5rem;
        --bs-nav-link-font-weight: ;
        --bs-nav-link-color: var(--bs-navbar-color);
        --bs-nav-link-hover-color: var(--bs-navbar-hover-color);
        --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color);
        display: flex;
        flex-direction: column;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        align-items: center;
    }

}




.nav-item .dropdown-menu {
    display: none;
    position: static;
    width: 100%;
    border: none;
    background-color: inherit;
}
/* .nav-item:hover .dropdown-menu {
    display: block; 
} */



@media (max-width: 768px) {
    .card-title{
        font-size: 16px;
        font-weight: 500;
    }

    .nav-link {
        color: var(--cor-cinza-claro);
        font-size: clamp(14px, 1rem, 20px);
        min-height: 50px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: start;
    }

    .dropdown-item:focus, .dropdown-item:hover {
        color: var(--cor-azul-escuro-hover);
        background-color: unset;
    }

    .nav-item .dropdown-menu {
        display: none;
        position: static;
        width: 100%;
        border: none;
        background-color: inherit;
        display: flex;
        flex-direction: column;
        text-align: center;
    }

   .ul_menu_clientes {
        display: none !important;
    }  

    .flex-header-seletor {
        display: none !important;
    }

/* 
 */

    .navbar-nav {
        --bs-nav-link-padding-x: 0;
        --bs-nav-link-padding-y: 0.5rem;
        --bs-nav-link-font-weight: ;
        --bs-nav-link-color: var(--bs-navbar-color);
        --bs-nav-link-hover-color: var(--bs-navbar-hover-color);
        --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color);
        display: flex;
        flex-direction: column;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        align-items: flex-start;
    }


/* 
    .div-titulo-passos::after {
        display: none;
    } */

    .div-titulo-btn {
        display: none !important;
        /* margin-right: 33px; */
        height: 14%;
        width: 40%;
        display: flex;
        justify-content: end;
    }

    .div-titulo {
        gap: 2px;
        width: 100%;
        margin-left: 7px;
        display: flex;
        align-items: center;
    }


    /*  btn */

    .card-body-clientes .botao-padrao {
        height: 36px;
        margin-top: 15px;
        cursor: pointer;
        width: 100%;
    }

    .help-popup-container{
        display: none !important;
    }

    .header{
        background-color: transparent !important;
    }


}



@media (min-width: 769px) and (max-width: 1000px) {
    .ul_menu_clientes {
        position: absolute;
        top: -42px !important;
        width: fit-content !important;
        display: flex;
        justify-content: space-between;
        background-color: #0E0E0E;
        border-radius: 10px 10px 0 0;
        align-items: center;
        color: var(--cor-cinza-claro);
        font-weight: 700;
        font-family: 'Ubuntu', sans-serif;
        font-size: 14px;
        cursor: pointer;
        list-style: none;
        left: 0 !important;
    }

}



@media (min-width: 1001px) and (max-width: 1400px) {
    .main-border {
        padding: 1px 40px 0px 40px;
        border-radius: 15px;
        width: 100%;
        /*padding: 40px;*/
        height: fit-content;
        min-height: 100svh;
        z-index: 10;
        position: relative;
    }


    /* .flex-header-seletor {
        display: none !important;
    } */

}
@media (max-width: 1400px){
    .dropdown-sidebar-menu {
        a {
            margin-left: 15px;
        }
    }
    .badge-breve{
        margin-left: 40px;
    }
}