/*======================================================
        JUTICA TALENTOS v2.0
=======================================================*/

/*
Cores oficiais da marca
*/

:root{

    --primary:#016734;
    --primary-light:#1FA238;
    --secondary:#DEDC03;
    --orange:#E94F1D;

    --white:#ffffff;

    --background:#F5F7F6;

    --card:#FFFFFF;

    --text:#2D3436;

    --text-light:#6C757D;

    --border:#E5E7EB;

    --shadow:0 10px 30px rgba(0,0,0,.08);

    --shadow-hover:0 15px 40px rgba(0,0,0,.15);

    --radius:18px;

    --transition:.30s;

}

/*======================================================
RESET
=======================================================*/

*{

    margin:0;

    padding:0;

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    background:var(--background);

    color:var(--text);

    font-family:
    "Avenir Next",
    "Segoe UI",
    sans-serif;

    overflow-x:hidden;

}

/*======================================================
LINKS
=======================================================*/

a{

    text-decoration:none;

    transition:var(--transition);

}

a:hover{

    text-decoration:none;

}

/*======================================================
SCROLL
=======================================================*/

::-webkit-scrollbar{

    width:10px;

}

::-webkit-scrollbar-track{

    background:#f0f0f0;

}

::-webkit-scrollbar-thumb{

    background:var(--primary);

    border-radius:50px;

}

::-webkit-scrollbar-thumb:hover{

    background:var(--primary-light);

}

/*======================================================
CONTAINER PRINCIPAL 
=======================================================*/

.main{

    padding:35px;

    min-height:100vh;

}

@media(max-width:991px){

.main{

    padding:20px;

}

}

/*======================================================
CARDS
=======================================================*/

.card{

    border:none;

    border-radius:var(--radius);

    background:var(--card);

    box-shadow:var(--shadow);

    transition:.30s;

}

.card:hover{

    transform:translateY(-3px);

    box-shadow:var(--shadow-hover);

}

.card-header{

    background:transparent;

    border:none;

    padding:25px;

    font-weight:700;

}

.card-body{

    padding:25px;

}

/*======================================================
BOTÕES
=======================================================*/

.btn{

    border-radius:12px;

    font-weight:600;

    transition:.25s;

}

.btn-primary{

    background:var(--primary);

    border:none;

}

.btn-primary:hover{

    background:#02592d;

}

.btn-success{

    background:var(--primary-light);

    border:none;

}

.btn-success:hover{

    background:#198b30;

}

.btn-warning{

    color:#fff;

    background:var(--orange);

    border:none;

}

.btn-warning:hover{

    background:#cf4416;

}

.btn-danger{

    border:none;

}

.btn-secondary{

    border:none;

}

/*======================================================
FORMULÁRIOS
=======================================================*/
.form-control{

    height:50px;

    border-radius:12px;

    border:1px solid var(--border);

}

.form-select{

    height:50px;

    border-radius:12px;

}

.form-control:focus,

.form-select:focus{

    border-color:var(--secondary);

    box-shadow:0 0 0 .20rem rgba(222,220,3,.30);

}

/*======================================================
SIDEBAR
=======================================================*/

.sidebar{

    width:280px;

    min-height:100vh;

    background:linear-gradient(
        180deg,
        #016734 0%,
        #01552B 100%
    );

    color:#FFF;

    position:fixed;

    left:0;

    top:0;

    padding:30px 20px;

    display:flex;

    flex-direction:column;

    box-shadow:5px 0 25px rgba(0,0,0,.15);

    z-index:999;

    transition:.35s;

}

.main{

    margin-left:280px;

}

@media(max-width:991px){

.main{

    margin-left:0;

}

}

/*======================================================
LOGO
=======================================================*/

.logo{

    margin-bottom:30px;

}

.logo img{

    max-width:170px;

    transition:.4s;

}

.logo img:hover{

    transform:scale(1.05);

}

/*======================================================
FOTO USUARIO
=======================================================*/

.usuario{

    text-align:center;

    margin-bottom:25px;

}

.usuario img{

    width:90px;

    height:90px;

    border-radius:50%;

    object-fit:cover;

    border:4px solid rgba(255,255,255,.25);

    transition:.3s;

}

.usuario img:hover{

    transform:scale(1.05);

    border-color:#DEDC03;

}

.usuario div{

    margin-top:12px;

    font-size:17px;

    font-weight:600;

}

/* MENU */

.sidebar a{

    display:flex;

    align-items:center;

    gap:14px;

    color:#FFF;

    padding:14px 18px;

    border-radius:12px;

    margin-bottom:8px;

    font-size:15px;

    transition:.25s;

}

.sidebar a i{

    width:22px;

    text-align:center;

    font-size:18px;

}

.sidebar a:hover{

    background:#DEDC03;

    color:#016734;

    transform:translateX(5px);

}

/* MENU ATIVO */
.sidebar a.active{

    background:#DEDC03;

    color:#016734;

    font-weight:bold;

}

/* HR */
.sidebar hr{

    border-color:rgba(255,255,255,.15);

    margin:20px 0;

}

/* BOTÃO SAIR */

.logout{

    margin-top:auto;

    background:rgba(255,255,255,.08);

}

.logout:hover{

    background:#E94F1D !important;

    color:#FFF !important;

}

/* MOBILE*/

@media(max-width:991px){

.sidebar{

    left:-290px;

}

.sidebar.show{

    left:0;

}

}

/*BOTÃO MENU */

.menu-btn{

    position:fixed;

    top:15px;

    left:15px;

    width:50px;

    height:50px;

    border:none;

    border-radius:12px;

    background:#016734;

    color:#FFF;

    font-size:22px;

    display:none;

    z-index:9999;

    box-shadow:0 8px 20px rgba(0,0,0,.20);

}

@media(max-width:991px){

.menu-btn{

    display:block;

}

}

/* FUNDO ESCURO MOBILE */

.overlay{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.45);

    opacity:0;

    visibility:hidden;

    transition:.3s;

    z-index:998;

}

.overlay.show{

    opacity:1;

    visibility:visible;

}

/*======================================================
CARDS DASHBOARD
======================================================*/

.dashboard-card{

    position:relative;

    overflow:hidden;

    border:none;

    border-radius:20px;

    padding:28px;

    background:#FFF;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    transition:.35s;

}

.dashboard-card:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 45px rgba(0,0,0,.15);

}

.dashboard-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:6px;

    height:100%;

    background:#016734;

}

/*icone*/ 

.dashboard-icon{

    width:70px;

    height:70px;

    border-radius:18px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(1,103,52,.12);

    color:#016734;

    font-size:32px;

    margin-bottom:18px;

}

.dashboard-number{

    font-size:40px;

    font-weight:700;

    color:#016734;

    margin-bottom:8px;

}

.dashboard-title{

    color:#666;

    font-size:16px;

    margin-bottom:0;

}

.dashboard-card.green::before{

    background:#016734;

}

.dashboard-card.yellow::before{

    background:#DEDC03;

}

.dashboard-card.orange::before{

    background:#E94F1D;

}

.dashboard-card.light::before{

    background:#1FA238;

}


.chart-card{

    background:#FFF;

    border-radius:20px;

    padding:25px;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.btn-primary{

    background:#016734;

    border:none;

    border-radius:12px;

    padding:12px 22px;

    font-weight:600;

}

.btn-primary:hover{

    background:#02582d;

}

.table tbody tr{

    transition:.25s;

}

.table tbody tr:hover{

    background:#F8FBF8;

}

.badge{

    border-radius:20px;

    padding:8px 14px;

    font-size:13px;

}

.search-box{

    position:relative;

}

.search-box input{

    padding-left:45px;

}

.search-box i{

    position:absolute;

    top:15px;

    left:16px;

    color:#999;

}

/*==================================================
CARDS DE VAGAS
==================================================*/

.vaga-card{

    background:#FFF;

    border-radius:20px;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    padding:28px;

    transition:.30s;

    height:100%;

    position:relative;

    overflow:hidden;

}

.vaga-card:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 40px rgba(0,0,0,.15);

}

.vaga-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:6px;

    height:100%;

    background:#016734;

}

/*titulo*/

.vaga-title{

    font-size:24px;

    font-weight:700;

    color:#016734;

    margin-bottom:20px;

}

/*informações*/

.vaga-info{

    margin-bottom:12px;

    color:#555;

}

.vaga-info i{

    width:28px;

    color:#016734;

}

/*rodapé*/

.vaga-footer{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-top:30px;

}

/*botoes*/

.vaga-actions{

    display:flex;

    gap:10px;

}

.vaga-actions .btn{

    width:42px;

    height:42px;

    display:flex;

    justify-content:center;

    align-items:center;

}

.status-vaga{

    padding:8px 16px;

    border-radius:30px;

    font-weight:600;

}

.status-ativa{

    background:#DFF8E5;

    color:#198754;

}

.status-encerrada{

    background:#FDEAEA;

    color:#DC3545;

}

/*======================================================
PERFIL
======================================================*/

.profile-card{

    background:#FFF;

    border-radius:22px;

    box-shadow:0 15px 35px rgba(0,0,0,.08);

    overflow:hidden;

}

.profile-header{

    height:170px;

    background:
        linear-gradient(
            rgba(1,103,52,.90),
            rgba(31,162,56,.90)
        ),
        url('../img/bg-login.jpg');

    background-size:cover;

    background-position:center;

    position:relative;

}

.profile-photo{

    width:150px;

    height:150px;

    border-radius:50%;

    object-fit:cover;

    border:6px solid #FFF;

    position:absolute;

    left:50%;

    bottom:-75px;

    transform:translateX(-50%);

    box-shadow:0 10px 25px rgba(0,0,0,.20);

}

.profile-body{

    padding-top:95px;

    padding-bottom:30px;

    text-align:center;

}

.profile-name{

    font-size:30px;

    font-weight:700;

    color:#016734;

}

.profile-area{

    color:#777;

    font-size:18px;

}

.profile-city{

    color:#999;

    margin-bottom:30px;

}

.profile-info{

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:18px;

    padding:14px;

    border-radius:12px;

    transition:.25s;

}

.profile-info:hover{

    background:#F7F7F7;

}

.profile-info i{

    width:45px;

    height:45px;

    border-radius:12px;

    display:flex;

    justify-content:center;

    align-items:center;

    background:#016734;

    color:#FFF;

}

.profile-btn{

    margin-top:25px;

}

.profile-side{

    background:#FFF;

    border-radius:20px;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    padding:30px;

}

.profile-side h5{

    color:#016734;

    margin-bottom:20px;

}

.interview-card{

    border-left:6px solid #DEDC03;

    background:#FFFCE7;

    border-radius:15px;

    padding:18px;

    margin-bottom:20px;

}

.profile-status{

    padding:12px;

    border-radius:15px;

    text-align:center;

    font-weight:bold;

}