/* INFORMAÇÂO: O mesmo layout é utilizado nas views: AdicionarEmpresa, EditarEmpresa */
.layout-adicionarempresa {
    height: 100%;
    width: 100%;
    background-color: whitesmoke;
}

/* Formulario */
.adicionarempresa-box-form {
    display: flex;
    width: 100%;
    justify-content: center;
}

/* Caractere especial > * */
.span-caractere-especial {
    color: crimson;
}

/* Status do usuario disponivel na view EditarUsuario */
.adicionarempresa-body select {
    padding: 10px;
    border-radius: 8px;
    border: 1px solid lightgray;
    font-size: 1em;
    color: gray;
    outline: none;
}


/* Funções de bloquear e deletar empresa */
.adicionarempresa-body-funcoes {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 20px;
}

.adicionarempresa-body-funcoes h6 {
    cursor: pointer;
    transition: 0.5s;
}

.adicionarempresa-body-funcoes h6:hover {
    color: red;
    transition: 0.5s;
}

/* Button para retornar para o inicio */
.adicionarempresa-btn-voltar {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.adicionarempresa-btn-voltar h5 {
    color: gray;
    font-weight: 100;
    font-size: 0.85em;
    margin-left: 10px;
    margin-top: 5px;
}

.adicionarempresa-btn-voltar button {
    background-color: transparent;
    border: none;
    font-size: 1.5em;
    margin-right: 10px;
    margin-top: 3px;
    cursor: pointer;
    transition: 0.5s;
}

.adicionarempresa-btn-voltar button:hover {
    padding-left: -20px;
    color: orange;
    transition: 0.5s;
}

.layout-adicionarempresa form {
    max-width: 1000px;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    background-color: white;
}

/* Nome da página */
.adicionarempresa-nav {
    font-weight: 400;
    font-size: 0.9em;
    padding: 10px;
    color: #001E4D;
    max-width: 900px;
    margin: 10px auto;
}

.adicionarempresa-nav h1 {
    font-weight: 500;
}

/* Corpo do formulario */
.adicionarempresa-body {
    height: 80vh;
    margin: 0px 20px 20px 20px;
    overflow-x: auto;
}

.adicionarempresa-body h6 {
    font-weight: 300;
    font-size: 1em;
    color: gray;
}

.adicionarempresa-body input {
    border: 1px solid lightgray;
    height: 40px;
    border-radius: 5px;
    font-weight: 300;
    font-size: 1em;
    color: gray;
    padding-left: 10px;
}

.adicionarempresa-form-inputs {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 10px;
}

/*.adicionarempresa-form-inputs input[type="tel"] {
    width: 200px;
}
*/

/* Box com nome e cargo */
.adicionarempresa-form-box-inputs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* Buttons do formulario */
./* INFORMAÇÂO: O mesmo layout é utilizado nas views: adicionarempresa, AdicionarUsuario e EditarUsuario */
.layout-adicionarempresa {
    height: 100%;
    width: 100%;
    background-color: whitesmoke;
}

/* Formulario */
.adicionarempresa-box-form {
    display: flex;
    width: 100%;
    justify-content: center;
}

/* Caractere especial > * */
.span-caractere-especial {
    color: crimson;
}

/* Status do usuario disponivel na view EditarUsuario */
.adicionarempresa-body select {
    padding: 10px;
    border-radius: 8px;
    border: 1px solid lightgray;
    font-size: 1em;
    color: gray;
    outline: none;
}


/* Button para retornar para o inicio */
.adicionarempresa-btn-voltar {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.adicionarempresa-btn-voltar h5 {
    color: gray;
    font-weight: 100;
    font-size: 0.85em;
    margin-left: 10px;
    margin-top: 5px;
}

.adicionarempresa-btn-voltar button {
    background-color: transparent;
    border: none;
    font-size: 1.5em;
    margin-right: 10px;
    margin-top: 3px;
    cursor: pointer;
    transition: 0.5s;
}

.adicionarempresa-btn-voltar button:hover {
    padding-left: -20px;
    color: orange;
    transition: 0.5s;
}

.layout-adicionarempresa form {
    max-width: 1000px;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    background-color: white;
}

/* Nome da página */
.adicionarempresa-nav {
    font-weight: 400;
    font-size: 0.9em;
    padding: 10px;
    color: #001E4D;
    max-width: 900px;
    margin: 10px auto;
}

.adicionarempresa-nav h1 {
    font-weight: 500;
}

/* Corpo do formulario */
.adicionarempresa-body {
    height: 80vh;
    margin: 0px 20px 20px 20px;
    overflow-x: auto;
}

.adicionarempresa-body h6 {
    font-weight: 300;
    font-size: 1em;
    color: gray;
}

.adicionarempresa-body input {
    border: 1px solid lightgray;
    height: 40px;
    border-radius: 5px;
    font-weight: 300;
    font-size: 1em;
    color: gray;
    padding-left: 10px;
    width: 400px;
}

.adicionarempresa-form-inputs {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 10px;
}

/* Box com nome e cargo */
.adicionarempresa-form-box-inputs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* Buttons do formulario */
.adicionarempresa-btns {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    margin-left: 20px;
}

.adicionarempresa-btns button{
    background-color: orange;
    padding: 10px;
    border: none;
    border-radius: 5px;
    transition: 0.5s;
    cursor: pointer;
    color: white;
    font-weight: 600;
    font-size: 0.9em;
}

.adicionarempresa-btns button:hover{
    background-color: darkorange;
    transition: 0.5s;
}

@media (max-width: 460px) {

    .adicionarempresa-body input[type="tel"] {
        width: 300px;
    }

    .adicionarempresa-body input[type="text"] {
        width: 300px;
    }

    .adicionarempresa-box-inputs {
        width: 100%;
    }

}

@media (min-width: 460px) {

    .layout-adicionarempresa form {
        height: calc(95vh - 100px);    
    }

    .adicionarempresa-body input[type="text"] {     
        width: 400px;       
    }
} 


/* TESTE view Usuários */
.adicionarempresa-box-dados {
    background-color: whitesmoke;
    padding: 30px 20px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}-btns {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    margin-left: 20px;
}

.dadosgeraus-btns button{
    background-color: orange;
    padding: 10px;
    border: none;
    border-radius: 5px;
    transition: 0.5s;
    cursor: pointer;
    color: white;
    font-weight: 600;
    font-size: 0.9em;
}

.dadosgeraus-btns button:hover{
    background-color: darkorange;
    transition: 0.5s;
}

@media (max-width: 460px) {

    .adicionarempresa-form-inputs input {
        width: 100%;
    }

    .adicionarempresa-box-inputs {
        width: 100%;
    }

    /* Quantidade de usuarios e licenças na edição da empresa */
    .adicionarempresa-form-box-inputs-quantidades {       
        flex-wrap: wrap;
    }
}

@media (min-width: 460px) {

    .layout-adicionarempresa form {
        height: calc(95vh - 100px);    
    }

    .adicionarempresa-body input[type="text"] {     
        width: 400px;       
    }
} 


/* TESTE view Usuários */
.adicionarempresa-box-dados {
    background-color: whitesmoke;
    padding: 30px 20px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Quantidade de usuarios e licenças na view de edição da empresa */
.adicionarempresa-form-box-inputs-quantidades {
    display: flex;
    width: 100%;
    gap: 10px;
}

.adicionarempresa-form-box-quantidade {
    width: 50%;
}