/* 
    Document   : styles
    Created on : 01/11/2023, 14:16:44
    Author     : Diego
    Description:
        Purpose of the stylesheet follows.
*/

/*Estilos gerais*/
* {
    color: #25282e;
}

#img-arredondadas{
    border-radius: 25px;
}

a, i {
    transition: 0.5s;
    text-decoration: none;
}

.secundary-color {
    color: #555555
}

/*Header*/
#header {
    text-align: center;
    padding-top: 1rem;
    background-color: #ffffff;
    border-bottom: 1px solid #ccc;
}


#empresa-container {
    display: flex;
    justify-content: center;
}


/*Navbar*/
#navbar {
    padding: 10px;
    margin: 10px auto;
    background-color: #ffffff;
}

#navbar a {
    width: 80px;
    color: #444444;
    background-color: #ffffff;
}

#navbar a:hover {
    color: #C1B696
}

#navbar span {
    width: auto;
    color: #444444;
    background-color: #ffffff;
    text-align: center;
    align-items: center;
    padding: 0;
    padding-right: 10px;
}

#navbar .btn.btn-outline-danger{
    padding: 0;
    background-color: #ffffff;
    color: #ff0000;
}

#navbar .btn.btn-outline-danger:hover{
    padding: 0;
    background-color: #ff0000;
    color: #ffffff;
}


/*Form*/
#login {
    background-color: #ffffff;
    border-radius: 20px;
    box-shadow: 5px 10px 15px rgba(0, 0, 0, .2);
    margin: .5rem auto;
    margin-top: 2rem;
    padding: .5rem;
    padding-bottom: 3rem;
    margin-bottom: 3rem;
}

@media(min-width: 768px) {
    #login {
        height: 80vh;
        margin-bottom: 5rem;
    }
    
}

#login h2 {
    font-weight: 900;
    text-align: center;
}

#login form {
    padding: 2rem;
}

#login .form-control {
    border: none;
    border-bottom: 1px solid #CCCCCC;
    border-radius: 0;
}

#login .form-control:focus {
    box-shadow: none;
}

#login .form-floating label {
    color: #CCCCCC;
}

#login .form-floating > .form-control:focus~label {
    color: #222222;
}

#login a {
    color: #444444;
    transition: .5s;
}

#login a:hover {
    color: #C1B696;
}

#login a {
    text-align: center;
}

#login a[type="submit"] {
    text-decoration: none;
    color: #ffffff;
    margin: .2rem auto;
}

.btn.btn-primary {
    width: 100%;
}

@media(min-width: 768px) {
    .btn.btn-primary {
        width: 50%;
        margin-right: 15%;
    }
}

#link-recupera-senha{
    text-align: center;
    padding-top: 3.2rem;
}

/*Imagem*/
.row.align-items-center.gx-5 {
    align-content: center;
    height: 100%;
    padding: 1rem 0;
}

#link-container {
    text-align: center;
    padding-top: 2rem;
}

/*Vagas*/
#vagas {
    background-color: #ffffff;
    border-radius: 20px;
    box-shadow: .5px 10px 15px rgba(0, 0, 0, .2);
    margin: .2rem auto;
    margin-top: 2rem;
    margin-bottom: 2rem;
    padding: .5rem;
    margin-top: .5rem;
}

@media(min-width: 768px) {
    #vagas {
        height: 70vh;
    }
}

#vagas h2 {
    font-weight: 900;
    margin-bottom: 30px;
    text-align: center;
}

#vagas p {
    text-align: center;
}

/*Imagem*/
.row-vagas {
    text-align: center;
    padding-top: .5rem;
    padding-left: 5rem;
    width: 100%;
}

@media(max-width: 768px) {
    .row-vagas {
        width: 100%;
        padding: 0 auto;
        padding-left: 0;
        padding-bottom: 1rem;
    }
}


#link-container {
    text-align: center;
    padding-top: 2rem;
    font-size: 20px;
}

/*Form*/
#erro {
    background-color: #ffffff;
    border-radius: 20px;
    box-shadow: .5px 10px 15px rgba(0, 0, 0, .2);
    margin: .2rem auto;
    padding: .5rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
    height: 80%;
}

@media(min-width: 768px) {
    #erro {
        height: 80vh;
        align-content: center;
    }
}

#erro h2 {
    font-weight: 900;
    margin-bottom: 1rem;
    text-align: center;
}

#erro p {
    margin-bottom: 1rem;
    text-align: center;
}

#erro a[type="submit"] {
    text-decoration: none;
    color: #ffffff;
    margin: .2rem auto;
}

.voltar-btn {
    text-align: center;
    padding-top: .5rem;
    padding-left: .5rem;
    padding-right: .5rem;
}


@media(min-width: 768px) {
    #erro .btn.btn-primary {
        width: 50%;
    }
}

#logado {
    background-color: #ffffff;
    border-radius: 20px;
    box-shadow: 5px 10px 15px rgba(0, 0, 0, .2);
    margin: .5rem auto;
    padding: .5rem;
    margin-bottom: 5rem;
}

@media(min-width: 768px) {
    #logado {
        height: 70vh;
    }
}

#logado h2 {
    font-weight: 900;
    margin-bottom: 30px;
    text-align: center;
}

#logado a {
    text-align: center;
}

#logado a[type="submit"] {
    text-decoration: none;
    color: #ffffff;
    margin: .2rem auto;
}

#logado p {
    text-align: center;
}

#logado .row.editar-btn {
    width: 100%;
    margin: 0;
    padding-bottom: 1rem;
}

@media(min-width: 768px) {
    .btn.btn-primary {
        width: 50%;
        margin-right: 15%;
    }
}

/* Estilo para o rodapé */
#rodape { 
    width: 100%; 
    background: #ffffff; 
    border-top: 1px solid #ccc; 
    bottom: 0; 
    text-align: center; 
    color: #888888; 
    font-size: 14px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    height: auto;
}

.texto-footer {
    margin-bottom: 0;
}

@media(min-width: 768px) {
    .footer {
        height: 30px;
        padding-top: 1rem;
    }
}


#botoes-pesquisa.row {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-bottom: 0;
    padding-top: 1em;
}

#botao-pesquisa.btn.btn-primary{
    padding: 0;
    width: 100%;  
    height: 2.5em;
    margin-bottom: 1em;
}

#voltar-pesquisa.btn.btn-warning {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 2.5em;
    }

@media(min-width: 768px) {
    #botao-pesquisa.btn.btn-primary{
    padding: 0;
    width: 5em;  
    height: 3em;
    }
    
    #voltar-pesquisa.btn.btn-warning {
    width: 5em;  
    height: 3em;
    text-align: center;
    }
    
    #botoes-pesquisa.row {
    margin-top: 1em;
    margin-bottom: 0;
    }
    
    #label-vagas {
        display: flex;
        padding-bottom: .5em;
    }
    
    #label-cargo {
        display: flex;
        padding-bottom: .5em;
        padding-top: .5em;
    }
    
}

@media(max-width: 768px) {
        
    #voltar-candidatar.btn.btn-warning {
        width: 100%;  
        height: 3em;
        text-align: center;
        margin-bottom: 1em;
    }
    
}

.voltar { 
    background: url('../img/btVoltar.png') no-repeat; 
    display: block; 
    height: 25px; 
    width: 85px; 
    margin: 0 auto; 
    border: 0px; 
    padding: 0px; 
    cursor: pointer; 
    border: none;
}

.voltar:hover { background: url('../img/btVoltarHover.png') no-repeat;}

.container-botoes {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 2em;
}

#col-botaosalvar{
    display: flex;
    justify-content: center;
    align-items: center;
}

#btsalvar { 
    background: url('../img/btSalvar.png') no-repeat; 
    display: block; 
    height: 1em; 
    width: 1em; 
    float: left; 
    border: 0px; 
    margin-right: 10px; 
    padding: 0px; 
    cursor: pointer; 
    border: none;
}

#enviar { 
    background: url('../img/btSalvar.png') no-repeat; 
    display: block;  
    float: left; 
    border: 0px; 
    margin-right: 10px; 
    padding: 0px; 
    cursor: pointer; 
    border: none;
}

#concluido {
    background-color: #ffffff;
    border-radius: 20px;
    box-shadow: .5px 10px 15px rgba(0, 0, 0, .2);
    margin: .2rem auto;
    padding: .5rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
    height: 80%;
}

@media(min-width: 768px) {
    #concluido {
        height: 60vh;
        align-content: center;
    }
}

#concluido h2 {
    font-weight: 900;
    margin-bottom: 1rem;
    text-align: center;
}

.btn.btn-info {
    width: 100%;
}

#voltaConcluido {
    width: 100%;
}

@media(min-width: 768px) {
    .btn.btn-info {
        width: 10em;
    }
    
    #voltaConcluido {
        width: 10em;
    }
}

#concluir {
    display: block;  
    float: left; 
    border: 0px; 
    width: auto;
    height: auto;
    margin-right: 10px; 
    padding: 0px; 
    cursor: pointer; 
    border: none;
}

@media(min-width: 768px) {
    #concluir {
        width: auto;
    }
}