.display_none {
display: none;
}
.display_flex {
display: flex;
}

#pagina img{
max-width: 100% !important;
width: auto !important;
height: auto !important;
object-fit: contain;
margin: 15px auto;
}
.answerquestion img {
max-width: 100% !important;
height: auto !important;
}
#titulo{
display:flex;
justify-content: center;
flex-wrap: wrap;
color:#2f7d32;
font-weight: 500;
letter-spacing:-.5px;
padding-top: 8px;
padding-bottom: 8px;
margin: -80px auto -50px auto;
background: #f8f9fa;

}
#titulo span{
font-size: 2.1em;
}
#cabecalho-info{
display: flex;
flex-direction: row;
gap:5px;
margin: auto;
max-width: 920px;
}

#printbutton {
display: inline-flex;
align-items: center;
background-color: #ffffff;
color: #2b2b2b;
font-size: 0.9rem;
font-weight: 500;
height: 42px;
padding: 0px 18px;
border: 1px solid #e0e0e0;
border-radius: 6px;
cursor: pointer;
transition: all 0.2s ease;
margin-top: -20px;
margin-bottom: -10px;
}

#printbutton:hover {
background-color: #f7f7f7;
border-color: #cccccc;
color: #000000;
}

#printbutton:active {
background-color: #eee;
}

#cronus{
align-items: center;
gap: 8px;
background-color: #ffffff;
color: #333333;
border: 1px solid #e0e0e0;
height: 42px;
padding: 9px 18px;
border-radius: 6px;
font-size: 0.95rem;
font-weight: 500;
letter-spacing: 0.5px;
position: fixed;
right: 80px;
top: 228px;
}

#resultados{
display: flex;
justify-content: center;
gap: 15px;
flex-wrap: wrap;
margin: 50px auto 25px auto;
max-width: 950px;
}

.resultado-card{
background: #fff;
border: 1px solid #e0e0e0;
border-radius: 8px;
padding: 18px 25px;
min-width: 215px;
text-align: center;
transition: .2s ease;
box-shadow: 0 2px 8px rgba(0,0,0,.04);
}

.resultado-card:hover{
transform: translateY(-2px);
box-shadow: 0 6px 14px rgba(0,0,0,.08);
}

.resultado-titulo{
font-size: .78rem;
color: #777;
margin-bottom: 8px;
text-transform: uppercase;
letter-spacing: .8px;
font-weight: 600;
line-height: 1.2;
white-space: normal;
word-break: break-word;
}

.resultado-valor{
font-size: 1.8rem;
color: #2f7d32;
font-weight: 700;
}

@media (max-width: 443px) {
.resultado-restante .resultado-titulo{
    width: 80px;
    margin: 0 auto 8px;
    white-space: normal;
}
}

@media (max-width: 768px){

    #printbutton {
    margin-left: 10px;
    }
    #resultados{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    max-width: 430px;
    margin: 0px auto 20px auto;
    padding: 0 12px;
    }

    .resultado-card,
    .cronus-final{
    width: 100%;
    min-width: 0;
    padding: 16px 12px;
    box-sizing: border-box;
    }

    .resultado-titulo{
        font-size: .75rem;
        line-height: 1.2;
    }

    .resultado-valor{
        font-size: 1.6rem;
    }
}

@media (max-width: 850px) {
    #titulo{
    margin-top: -30px;
    margin-bottom: 10px;
    }
    #titulo span{
    font-size: 1.8em;
    }
}
@media (max-width: 1000px){
#cronus{
    position: static; 
    bottom: auto;
    right: auto;
    left: auto;
    top: auto;
    margin-top: -20px;
    margin-bottom: -10px;
}
}



/*==================================================
                MONTE SEU SIMULADO
==================================================*/

.simulado-box{
    max-width:980px;
    margin: 20px auto -100px;
    padding:0 18px;
}

.simulado-header{
    text-align:center;
    margin-bottom:18px;
}

.simulado-header h1{
    margin:0 0 5px;
    font-size:2.0rem;
    font-weight:500;
    color:#2f7d32;
    letter-spacing:-.5px;
    margin-bottom:8px;
}

.simulado-header p{
    max-width:620px;
    margin:0 auto;
    color:#6b7280;
    font-size:.9rem;
    line-height:1.5;
}

/*==================================================
                    CARD
==================================================*/

.simulado-card{

    background:#f8faf6;

    border:1px solid #d8ddd4;

    border-radius:12px;

    padding:18px;

    box-shadow:0 3px 12px rgba(0,0,0,.05);

}

/*==================================================
                    GRID
==================================================*/

.simulado-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:14px;

    align-items:start;

}

/*==================================================
                    CAMPOS
==================================================*/

.campo{

    background:#fff;

    border:1px solid #d8dde2;

    border-radius:10px;

    padding:12px 13px;

    transition:.18s;

}

.campo:hover{
    box-shadow:0 2px 8px rgba(0,0,0,.05);

}

.campo label{

    display:flex;

    align-items:center;

    gap:8px;

    min-height:24px;

    margin-bottom:8px;

    color:#374151;

    font-size:.92rem;

    font-weight:600;

}

.campo label i{

    color:#678142;

    font-size:17px;

}

.campo select{

    width:100%;

}

/*==================================================
                MULTI SELECT
==================================================*/

.multi-select-tag{

    width:100% !important;

}

.multi-select-tag .wrapper{

    min-height:40px !important;

    border-radius:8px !important;

    border:1px solid #d8dde2 !important;

    padding:4px 8px !important;

    box-shadow:none !important;

    transition:.18s;

}

.multi-select-tag:focus-within .wrapper{

    border-color:#92b562 !important;

    box-shadow:0 0 0 3px rgba(146,181,98,.12) !important;

}

.multi-select-tag .body{

    gap:5px !important;

}

.multi-select-tag .input{

    font-size:.88rem !important;

    color:#374151 !important;

}

.multi-select-tag .item-container{

    background:#eef6e5 !important;

    border:1px solid #92b562 !important;

    border-radius:16px !important;

    padding:2px 7px !important;

}

.multi-select-tag .item-label{

    color:#46682d !important;

    font-size:.8rem !important;

}

.multi-select-tag .item-close-container{

    color:#46682d !important;

}

.multi-select-tag .dropdown-content{

    border-radius:8px !important;

    max-height:220px !important;

}

.multi-select-tag .item2{

    padding:9px 12px !important;

    font-size:.88rem !important;

}

.multi-select-tag .item2:hover{

    background:#eef4e7 !important;

}

.multi-select-tag .item2.selected{

    background:#eef6e5 !important;

    color:#2f7d32 !important;

}

/*==================================================
                    BOTÃO
==================================================*/

.btn-gerar{

    width:100%;

    height:46px;

    margin-top:15px;

    border:none;

    border-radius:10px;

    background:#92b562;

    color:#fff;

    font-size:.95rem;

    font-weight:600;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:8px;

    cursor:pointer;

    transition:.18s;

}

.btn-gerar:hover{

    background:#7ea34c;

    transform:translateY(-2px);

}

.btn-gerar:active{

    transform:scale(.985);

}

.btn-gerar i{

    font-size:17px;

}


/*==================================================
                RESPONSIVO
==================================================*/

@media (max-width:900px){

    .simulado-box{
        max-width:700px;
    }

    .simulado-grid{
        grid-template-columns:1fr;
        gap:12px;
    }

    .resumo{
        flex-wrap:wrap;
        gap:14px;
    }

    .resumo .info{
        width:48%;
    }

}

@media (max-width:650px){

    .simulado-box{
        margin-top:40px;
        padding:0 12px;
    }

    .simulado-header{
        margin-bottom:15px;
    }

    .simulado-header h1{
        font-size:1.55rem;
    }

    .simulado-header p{
        font-size:.85rem;
    }

    .simulado-card{
        padding:14px;
        border-radius:10px;
    }

    .campo{
        padding:10px;
    }

    .campo label{
        font-size:.88rem;
        margin-bottom:6px;
    }

    .campo label i{
        font-size:16px;
    }

    .multi-select-tag .wrapper{
        min-height:38px !important;
        padding:4px 7px !important;
    }

    .multi-select-tag .item-container{
        padding:2px 6px !important;
    }

    .multi-select-tag .item-label{
        font-size:.75rem !important;
    }

    .multi-select-tag .input{
        font-size:.82rem !important;
    }

    .multi-select-tag .item2{
        font-size:.82rem !important;
        padding:8px 10px !important;
    }

    .resumo{
        padding:12px;
        gap:12px;
    }

    .resumo .info{
        width:100%;
        text-align:center;
    }

    .resumo span{
        font-size:.7rem;
    }

    .resumo strong{
        font-size:1.1rem;
    }

    .btn-gerar{
        height:44px;
        font-size:.9rem;
    }

}

@media (max-width:450px){

    .simulado-box{
        padding:0 8px;
    }

    .simulado-header h1{
        font-size:1.35rem;
    }

    .simulado-header p{
        font-size:.8rem;
    }

    .simulado-card{
        padding:12px;
    }

    .campo{
        padding:9px;
    }

    .campo label{
        font-size:.82rem;
    }

    .campo label i{
        font-size:15px;
    }

    .btn-gerar{
        height:42px;
        font-size:.88rem;
        gap:6px;
    }

    .btn-gerar i{
        font-size:15px;
    }

}

/*==================================================
            MELHORIAS VISUAIS
==================================================*/

.simulado-card,
.campo,
.resumo,
.btn-gerar{
    box-sizing:border-box;
}

.simulado-card *{
    font-family:inherit;
}

.multi-select-tag .dropdown-content{

    overflow-y:auto;

    scrollbar-width:thin;

    scrollbar-color:#92b562 #ececec;

}

.multi-select-tag .dropdown-content::-webkit-scrollbar{

    width:6px;

}

.multi-select-tag .dropdown-content::-webkit-scrollbar-track{

    background:#ececec;

}

.multi-select-tag .dropdown-content::-webkit-scrollbar-thumb{

    background:#92b562;

    border-radius:20px;

}

.multi-select-tag .dropdown-content::-webkit-scrollbar-thumb:hover{

    background:#7ea34c;

}

.campo,
.resumo{

    transition:border-color .18s ease,
               box-shadow .18s ease,
               transform .18s ease;

}

.campo:focus-within{

    border-color:#92b562;

    box-shadow:0 0 0 3px rgba(146,181,98,.12);

}

.btn-gerar{

    transition:background .18s ease,
               transform .18s ease,
               box-shadow .18s ease;

}

.btn-gerar:hover{

    box-shadow:0 5px 14px rgba(146,181,98,.28);

}

.btn-gerar:active{

    transform:scale(.985);

}

.resumo .info:not(:last-child){

    padding-right:18px;

}

@media(max-width:650px){

    .resumo .info:not(:last-child){

        padding-right:0;

    }

}