/*Aplicação de classe modificada, atrelando todas as modififcações, nos estilos dentro dessa div, somente quando a classe dela é alinhada com essa outra classe, utilizando ela como gatilho para montar todos os estilos desse pop up, definindo a autura e o posicionamneto do pop up*/
.PopPainel.CriacaoAmbientes {
    height: 80vh;

    top: 5vh;
    left: 40vw;

}

/*====================== Painel de encerramento =======================================*/

/*Aplica*/
.PopPainel.CriacaoAmbientes .fecharPainel {
    width: 100%;
    height: 12vh;
    display: flex;
    justify-content: start;
    align-items: center;
}

.PopPainel.CriacaoAmbientes .fecharPainel button {
    background: none;
    border: none;
    outline: none;

    width: 8vw;
    height: 5vh;
    background-color: #c6c6c6;
    box-shadow: 5px 5px 0px #9a9a9a;

    font-size: 1vw;
    color: var(--Matriz);
    transition: 1s ease;

    cursor: pointer;
}

.PopPainel.CriacaoAmbientes .fecharPainel button:hover {
    background-color: var(--Cor_Segundaria_5_1);
    box-shadow: -5px 5px 0px var(--Cor_Segundaria_5_2);
}


/*====================== Fechamento ====================================================*/


/*====================== Inicio do formulario =======================================*/


.PopPainel.CriacaoAmbientes #formulario {

    width: 100%;
    height: 70vh;
    padding-top: 2vh;
    overflow-y: auto;

    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;

    gap: 2vh;

}

.PopPainel.CriacaoAmbientes #formulario .Bloco_1,
.PopPainel.CriacaoAmbientes #formulario .Bloco_2,
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 {

    width: 90%;

    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;

    gap: 2vh;

}

.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .TituloCampo,
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .TituloCampo,
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .TituloCampo {
    width: 100%;
    display: flex;
    justify-content: start;

    font-family: var(--font_titulo);
    color: var(--Matriz);
    font-size: 1.2vw;
}

.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .TituloCampo h2,
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .TituloCampo h2,
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .TituloCampo h2 {

    background-color: var(--Cor_Segundaria_5_1);
    box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
    padding: 1vw;

}

.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campo,
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .Campo,
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .Campo {
    width: 100%;
    height: 6vh;

    display: flex;
    justify-content: space-around;
    align-items: center;

    background-color: var(--Cor_Segundaria_5_1);
    box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);

}

.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campo label,
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .Campo label,
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .Campo label {

    font-family: var(--font_titulo);
    color: var(--Matriz);
    font-size: 1.2vw;
}

.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campo input,
.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .Campo input,
.PopPainel.CriacaoAmbientes #formulario .Bloco_3 .Campo input {

    background: none;
    border: none;
    outline: none;

    height: 1vh;
    width: 70%;
    padding: 0.8vw;

    background-color: var(--Matriz);

}


/*====================== Fechamento ====================================================*/



/*====================== Configuração ES B1 ++++=======================================*/


.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campolong {

    width: 100%;
    padding-top: 2vh;
    padding-bottom: 2vh;

    display: flex;
    justify-content: space-around;
    align-items: start;

    background-color: var(--Cor_Segundaria_5_1);
    box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);


}

.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campolong label {

    font-family: var(--font_titulo);
    color: var(--Matriz);
    font-size: 1.2vw;

}

.PopPainel.CriacaoAmbientes #formulario .Bloco_1 .Campolong textarea {

    background: none;
    border: none;
    outline: none;

    height: 14vh;
    width: 70%;
    padding: 0.8vw;

    background-color: var(--Matriz);


}


/*====================== Fechamento ====================================================*/



/*====================== Configuração ES B2 ++++=======================================*/


.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .CampoInsercao {

    width: 100%;
    padding-top: 2vh;
    padding-bottom: 2vh;

    display: flex;
    justify-content: space-around;
    align-items: center;

    background-color: var(--Cor_Segundaria_5_1);
    box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);


}

.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .CampoInsercao label {

    font-family: var(--font_titulo);
    color: var(--Matriz);
    font-size: 1.2vw;

}

.PopPainel.CriacaoAmbientes #formulario .Bloco_2 .CampoInsercao button {

    background: none;
    border: none;
    outline: none;

    height: 8vh;
    width: 70%;
    padding: 0.8vw;

    background-color: var(--Matriz);
    color: var(--Cor_Segundaria_5_1);

    font-family: var(--font_titulo);
    color: var(--Cor_Segundaria_5_1);
    font-size: 1.6vw;

    background-size: contain;
    background-repeat: no-repeat;

    cursor: pointer;

}



/*====================== Fechamento ====================================================*/



/*====================== Configuração ES B3 =========================================*/

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs {

    width: 90%;
    padding: 2vw;
    margin-top: 0.8vh solid var(--Matriz);

    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;

    background-color: var(--Cor_Segundaria_5_1);
    box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);

    margin-bottom: 2vh;

}

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 {
    width: 100%;

    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;

}

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .TitutloPopup {

    width: 40%;
    height: 8vh;

    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;

    font-family: var(--font_titulo);
    color: var(--Matriz);
    font-size: 1vw;

}

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .PesquisaPopup {

    width: 70%;
    height: 8vh;

    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;

}

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .PesquisaPopup input {
    background: none;
    outline: none;
    border: none;

    width: 15vw;
    height: 4vh;

    background-color: var(--Matriz);
    border: 0.4vw solid var(--Cor_Segundaria_2_1);
    box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2);

    padding-left: 1vw;
    padding-right: 1vw;

    font-size: 0.8vw;
    font-family: var(--font_titulo);
    color: var(--Cor_Segundaria_2_1);



}

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .PesquisaPopup button {
    background: none;
    outline: none;
    border: none;

    width: 4vw;
    height: 6vh;

    background-color: var(--Cor_Segundaria_2_1);
    box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2);

    cursor: pointer;


}

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_1 .PesquisaPopup img {
    width: 2vw;
}

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2 {

    width: 100%;
    height: 30vh;
    margin-top: 2vh;
    padding-top: 2vh;
    overflow-y: auto;

    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    align-content: center;



    background-color: var(--Matriz);

    gap: 1vw;
}


.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2 .DashbordItem {

    width: 18vw;
    height: 8vh;

    display: flex;
    align-items: center;
    justify-content: space-around;
    align-content: center;

    font-family: var(--font_titulo);
    color: var(--Matriz);
    font-size: 0.6vw;


    background-color: var(--Cor_Segundaria_5_1);
    box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2);
}


.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2 .DashbordItem button {
    background: none;
    border: none;
    outline: none;

    width: 6vw;
    height: 3vh;
    background-color: #c6c6c6;
    box-shadow: 5px 5px 0px #9a9a9a;
    font-size: 1vw;
    color: var(--Matriz);
    transition: 1s ease;

    cursor: pointer;

}

.PopPainel.CriacaoAmbientes .Bloco_3 .PainelDasborhs .Coluna_2 .DashbordItem button:hover {
    background-color: var(--Cor_Segundaria_2_1);
    box-shadow: -5px 5px 0px var(--Cor_Segundaria_2_2);
}

/*=============================== fechamento ===========================================*/