.titulo-formulario {
    margin-left: 5px; /*Pra alinhar com os subtitulos*/
    box-shadow: none !important;
}


.formulario {
    width: 100%;
    padding: 25px;
    flex-direction: column;
    display: flex;
}



.formulario .subtitulo {
    align-items: center;
    display: flex;
    padding-left: 5px;
    /**/
    /* //Testando sem a borda...
    border-bottom: 1px solid rgba(0,0,0, .05);
    padding-bottom: 15px; /*10px de margem da fonte*/ 
    
}

.formulario .subtitulo .label {
}

.formulario .subtitulo .label .descricao {
    color: grey;
    font-weight: 100;
    margin-top: 5px;
}


.centro .formulario .subtitulo:first-child,
.centro .formulario .subtitulo:nth-child(2) {
    margin-top: 0px;
}


.formulario .subtitulo .icone {
    height: 25px;
    width: 25px;
    margin-right: 25px;
    fill: rgba(0, 0, 0, .05);
    display: none;
}


.formulario .legenda {
    font-size: 11px;
    text-transform: uppercase;
    padding-left: 5px;
    letter-spacing: 2px;
    font-weight: 100; /*era 200*/
    margin-top: 25px;
    margin-bottom: 15px;
    /*
    border-bottom: 1px dashed rgba(0,0,0,.05);
    padding-bottom: 10px;*/
    color: grey;
}

.formulario .legenda:first-child{
    margin-top: 0px;
}




.formulario .secao {
    padding-bottom: 25px;
    padding-left: 0;
    padding-right: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.formulario .subtitulo + .secao { /* Seção que vem logo depois do título */
    padding-top: 25px;
}

.formulario .secao + .secao { /* Seção que vem logo depois de outra seção */

    padding-top: 50px;
    border-top: 1px solid rgba(0,0,0, .05);
}




.formulario .secao:not(:last-child) {
    margin-bottom: 25px;
}

.formulario .flex {
    display: flex;
    align-items: center;
    gap: 10px;
}

.formulario .flex.centro {
    justify-content: center;
}



.formulario .flex .campo-container {
    display: flex;
    align-items: center;
    width: 100%;
}









.formulario .flex .campo {
    width: 100%;
    flex: 1;
    display: flex;
    align-items: center;
    /**/
    background-color: rgba(0, 0, 0, .05);
    /*background-color: #e9e7e8; /* Mesma cor que o de cima, mas não transparente. */
    /**/
    border-radius: 10px;
    padding-left: 15px;
    padding-right: 15px;
    /**/
    z-index: 5;
}

.formulario .flex .campo.area {
    align-items: flex-start;
}

.formulario .flex .campo-container[data-orientacao='Vertical'] .campo {

    flex-direction: column;
    align-items: flex-start;
}




.formulario .flex .campo.desabilitado {
    opacity: .3;
    cursor: not-allowed;
}


.formulario .flex .campo .label {
    font-weight: 600;
    margin-right: 15px;
    white-space: nowrap;
    /**/
    display: flex;
    /*flex-direction: column;*/ /*Tirei pra fazer o tooltip*/
    /**/
    align-items: center;
}


.formulario .flex .campo .label .tooltip {
    display: flex;
    opacity: .1;
    cursor: help;
    transition: .2s ease-in-out;
}



.formulario .flex .campo .label .tooltip:hover {
    opacity: .3;
}


.formulario .flex .campo .label .tooltip .icone {
    display: flex;
    height: 13px;
    width: 13px;
    margin-left: 7px;
}


.formulario .flex .campo-container.focus .campo:not(.opcional):not(.valido) .label {
    color: #e77a1d;
}

.formulario .flex .campo-container .campo.valido .label {
    color: #4caf50;
}

.formulario .flex .campo-container:not(.focus) .campo.alerta .label {
    color: #F44336;
}




.formulario .flex .campo.area .label,
.formulario .flex .campo-container[data-orientacao='Vertical'] .campo .label {
    margin-top: 16.5px;
}

.formulario .flex .campo .prefixo {
    margin-right: 4px;
    white-space: nowrap;
    font-weight: 200;
}

.formulario .flex .campo .sufixo {
    margin-left: 4px;
    font-weight: 200;
}


.formulario .flex .campo .helper {
    white-space: nowrap;
    font-weight: 200;
    color: grey;
    margin-left: 10px;
    display: none;
}

.formulario .flex .campo .helper.visivel {
    display: flex;
}






.formulario .flex .tag-auxiliar {
    font-weight: 200;
    font-size: 7px;
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: .4;
    transition: .2s ease-in-out;
    /**/

    border-radius: 10px;
    display: flex;
    align-items: center;
    opacity: 1;
    color: rgba(0,0,0, .7);
    justify-content: center;
    /**/
    height: 25px;
    /**/
    width: 0px;
    overflow: hidden;
    /**/
    position: absolute;
    z-index: 200;
    right: 5px;
    background: #fff;

}

.formulario .flex .campo-container.focus .campo:not(.valido) + .tag-auxiliar,
.formulario .flex .campo-container .campo.alerta + .tag-auxiliar {
    width: 75px;
}



.formulario .flex .tag-auxiliar.obrigatorio {
    /*border: 1px solid rgba(231, 122, 29, .1);*/
    color: #e77a1d;
}

.formulario .flex .campo.alerta + .tag-auxiliar.obrigatorio {
    color: #F44336;
    font-weight: 400;

}








.formulario .flex .campo .inp {
    background-color: transparent;
    width: 100%;
    border: 0px;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
    -webkit-appearance: none;
    font-family: inherit;
    font-size: inherit;
    padding: 0px;
    height: 50px;
    transition: .2s ease-in-out;
    color: rgba(0,0,0, .8);
    border-radius: 0px;
}

.formulario .flex .campo .inp:focus {
    outline: none;
    color: rgba(0,0,0, 1);
}

.formulario .flex .campo.opcional .inp:focus {
    border-bottom-color: #1d1d1f;
}

.formulario .flex .campo:not(.opcional) .inp:focus {
    border-bottom-color: #e77a1d;
}



.formulario .flex .campo .inp:disabled {
    cursor: not-allowed;
    color: grey;
}


.formulario .flex .campo .inp::placeholder,
.formulario .flex .campo select.inp:invalid:not(:focus) {
    font-weight: 200;
    color: rgba(0, 0, 0, .3);
}


.formulario .flex .campo.alerta .inp {
    border-bottom-color:  #F44336;
}

.formulario .flex .campo.valido .inp:focus {
    border-bottom-color: #4caf50;
}


.formulario .flex .campo.alerta input[type='file'] {
    color: #F44336;
}


.formulario .flex .campo textarea.inp {
    height: 200px;
    resize: none;
    padding-top: 5px;
    padding-bottom: 15px;
    line-height: 21px;
}

.formulario .flex .campo-container[data-orientacao='Horizontal'] .campo textarea.inp {
    padding-top: 14px;
}


.formulario .flex .campo textarea.inp:focus {
    outline: none;
}

.formulario .flex .campo textarea.inp::-webkit-scrollbar {
    width: 3px;
    background-color: transparent;
}

.formulario .flex .campo textarea.inp::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .1);
    border-radius: 10px;
}


.formulario .btn-container {
    justify-content: center;
    margin-top: 25px;
}


.formulario .btn-container .btn {
    -webkit-appearance: none;
    font-family: inherit;
    font-size: inherit;
}

.formulario .btn-container .btn:not(.ghost) {
    border: none;
}





.formulario .flex .campo.arquivo 
{
    padding-left: 0px;
}

.formulario .flex .campo.arquivo .label {
    margin-left: 15px;
}


.formulario .flex .campo input[type='file'].inp {
    font-family: inherit;
    width: 100%;
    font-size: 14px;
    color: grey;
    font-weight: 200;
    color: rgba(0, 0, 0, .3);
    /*height: auto;*/
    height: 50px;
}

.formulario .flex .campo input[type='file'].inp.preenchido {
    color: #da6601;
    font-weight: 700;
}

.formulario .flex .campo input[type='file'].inp::-webkit-file-upload-button {
    border: 0px;
    font-family: inherit;
    background-color: rgba(0, 0, 0, .05);
    border-radius: 4px;
    margin-right: 10px;
    cursor: pointer;
    color: grey;
    transition: .2s ease-in-out;
    height: 25px;
    margin-top: 12.5px;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 12px !important;
}



.formulario .flex .campo input[type='file'].inp::-webkit-file-upload-button:hover {
    opacity: .7;
}


.formulario .flex .campo.check {
    height: 50px;
    background: transparent;
    border: 1px solid rgba(0, 0, 0, .05);
}

.formulario .flex .campo.check .label {
    font-weight: 400;
    cursor: pointer;
    margin-right: 0px;
}

.formulario .flex .campo.check input[type='checkbox'] {
    margin: 0;
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin-right: 10px;
}


.formulario .flex .campo.grupo-checks {
    display: flex;
    align-items: center;
    height: 50px;
    padding-right: 5px;
}

.formulario .flex .campo.grupo-checks .container {
    display: flex;
    align-items: center;
    flex-grow: 1;
}

.formulario .flex .campo.grupo-checks .campo.check {
    height: 40px;
    flex-grow: 1;
    justify-content: center;
    border: none;
    background-color: rgba(0, 0, 0, 0.02);
}

.formulario .flex .campo.grupo-checks .campo.check:not(:last-child) {
    margin-right: 5px;
}




.formulario .flex .campo.cor {
    height: 50px;
}

.formulario .flex .campo.cor input {
    cursor: pointer;
}






.formulario .texto {
    color: grey;
}


.formulario .sliders .flex {
    margin-bottom: 10px;
}

.formulario .campo.slider {
    width: 100%;
    display: flex;
    align-items: center;
    background: rgba(0, 0, 0, .03);
    padding: 25px;
    border-radius: 10px;
}

.formulario .flex .campo.slider .label {
    margin-bottom: 0px;
    margin-right: 25px;
    white-space: nowrap;
    width: 25%;
    overflow: hidden;
    text-overflow: ellipsis;
}



.formulario .campo.slider input[type='range'] {
    flex-grow: 1;
    cursor: pointer;
}

.formulario .campo.slider .valor {
    border-left: 1px solid rgba(0, 0, 0, .05);
    height: 100%;
    padding: 5px;
    padding-left: 25px;
    margin-left: 25px;
    font-weight: 600;
    width: 25%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.formulario .campo.slider .opcoes {
    display: none;
}




.formulario .campo.estrelas {
    display: flex;
    align-items: center;
    background: rgba(0, 0, 0, .05);
    border-radius: 10px;
    padding: 10px;
    padding-left: 25px;
}

.formulario .campo.estrelas:not(:last-child) {
}


.formulario .campo.estrelas.alerta {
    border-bottom: 2px solid #F44336;
}

.formulario .flex .campo.estrelas .container-labels {
    display: flex;
    align-items: center;
}

.formulario .flex .campo.estrelas .container-labels .icone {
    height: 20px;
    width: 20px;
    display: flex;
    margin-right: 10px;
}


.formulario .flex .campo.estrelas .labels {
    font-weight: 600;
}

.formulario .flex .campo.estrelas .itens {
    margin-left: auto;
    display: flex;
    align-items: center;
    padding: 25px;
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: 10px;
}



.formulario .flex .campo.estrelas .itens .item {
    cursor: pointer;
}


.formulario .flex .campo.estrelas .itens .item:not(:last-child) {
    margin-right: 10px;
}

.formulario .flex .campo.estrelas .itens .item .icone {
    height: 25px;
    width: 25px;
    fill: rgba(0, 0, 0, .05);
    display: flex;
    transition: .1s ease-in-out;
}

.formulario .flex .campo.estrelas .itens .item:hover .icone {
    fill: rgba(0, 0, 0, .1);
}


.formulario .flex .campo.estrelas .itens .item.ativo .icone {
    fill: #08ace3;
}




.formulario .container-blocos {
    display: flex;
    align-items: flex-start;
}


.formulario .container-blocos .bloco {
    width: 100%;
}


.formulario .container-blocos .bloco:not(:last-child) {
    margin-right: 25px;
}



.formulario .explicacao {

    transition: .2s ease-in-out;
    padding-left: 5px;
}

.formulario .explicacao:hover {
}


.formulario .subtitulo + .explicacao {
    margin-top: 10px;
}




.formulario .explicacao .bloco {
    display: flex;
    align-items: flex-start;
}

.formulario .explicacao .bloco:not(:last-child) {
    margin-bottom: 25px;
}


.formulario .explicacao .bloco .item {
    flex: 1;
}

.formulario .explicacao .bloco .item:not(:last-child) {
    margin-right: 25px;
}


.formulario .explicacao .bloco .item .titulo {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}

.formulario .explicacao .bloco .item .titulo .label {
    font-weight: 700;
}

.formulario .explicacao .bloco .item .titulo .icones {
    display: flex;
    margin-left: 10px;
}

.formulario .explicacao .bloco .item .titulo .icones .icone {
    height: 15px;
    width: 15px;
    fill: black;
    margin-right: 5px;
}


.formulario .explicacao .bloco .item .texto {
    font-size: 12px;
    line-height: 18px;
    text-align: justify;
    font-weight: 200;
}

.formulario .selecao-opcoes {
}

.formulario .selecao-opcoes .item {
    background: linear-gradient(45deg, rgba(0, 0, 0, .05), transparent);
    display: flex;
    align-items: center;
    padding: 25px;
    border-radius: 10px;
    cursor: pointer;
    transition: .2s ease-in-out;
}

.formulario .selecao-opcoes .item:not(:last-child) {
    margin-bottom: 10px;
}


.formulario .selecao-opcoes .item:hover {
    background: linear-gradient(45deg, rgba(0, 0, 0, .05) 70%, #f1ddcd);
    background: linear-gradient(45deg, #f1ddcd, transparent);
    transform: translateX(10px);
}

.formulario .selecao-opcoes .item .icone {
    fill: #e77a1d;
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    margin-right: 25px;
}



.formulario .caixa {
    border: 1px solid rgba(0,0,0, .05);
    padding: 25px;
    border-radius: 10px;
}


.formulario .caixa:not(:last-child) {
    margin-bottom: 25px;
}

.formulario .caixa .container-titulo {
    display: flex;
    align-items: center;
}


.formulario .caixa:not(.fechada) .container-titulo {
    padding-bottom: 25px;
    border-bottom: 1px solid rgba(0,0,0, .05);
}


.formulario .caixa.colapsavel .container-titulo {
    cursor: pointer;
}

.formulario .caixa .container-titulo .colapsar .icone {
    width: 15px;
    height: 9px;
    margin-right: 20px;
    display: flex;
    transform: rotate(180deg);
    fill: rgba(0, 0, 0, .3);
    transition: .2s ease-in-out;
}

.formulario .caixa:not(.colapsavel) .container-titulo .colapsar .icone {
    display: none;
}

.formulario .caixa.colapsavel .container-titulo:hover .icone {
    fill: rgba(0, 0, 0, .7);
}


.formulario .caixa.fechada .container-titulo .colapsar .icone {
    transform: rotate(90deg);
}

.formulario .caixa.fechada .container-titulo:hover .colapsar .icone {
    transform: rotate(95deg);
}


.formulario .caixa .container-titulo .titulo {
    display: flex;
    align-items: center;
    transition: .2s ease-in-out;
    width: 100%;
}


.formulario .caixa .secao:last-child {
    padding-bottom: 0px;
}

.formulario .caixa.fechada .secao {
    display: none;
}


.formulario .flex .campo.codigo-acesso {
    background-color: transparent;
}

.formulario .flex .campo.codigo-acesso:hover {
    background-color: transparent;
}

.formulario .flex .campo.codigo-acesso .label {
    margin-right: 25px;
}

.formulario .flex .campo.codigo-acesso .digitos {
    display: flex;
}


.formulario .flex .campo.codigo-acesso .digitos .inp {
    border: 2px solid;
    border-radius: 10px;
    text-align: center;
    height: 50px;
    width: 50px;
}

.formulario .flex .campo.codigo-acesso .digitos .inp:focus {
    background: rgba(255, 255, 255, .05);
}

.formulario .flex .campo.codigo-acesso .digitos .inp:not(:last-child) {
    margin-right: 10px;
}



.formulario .flex .campo.radio {
    min-height: 50px;
    /**/
    background: transparent;
    border: 1px solid rgba(0, 0, 0, .05);
}


.formulario .flex .campo.radio .container-opcoes {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 5px;
    padding-right: 0px;
    /**/
    flex-grow: 1;
    /**/
    margin-right: -10px;
}


.formulario .flex .campo.radio .container-opcoes .opcao {
    transition: .2s ease-in-out;
    display: flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
    /**/

    padding: 10px;
    border-radius: 10px;
    /**/
    /*
    border: 1px solid rgba(0, 0, 0, .05);
    flex-basis: 25%; /*Deixa a linha de 3 em 3*/
    /**/


}


.formulario .flex .campo.radio .container-opcoes .opcao:hover {
    opacity: .9;
}


.formulario .flex .campo.radio .container-opcoes .opcao label {
    cursor: pointer;
    /**/
    flex-grow:1;
    /**/
    font-weight: 200;
}


.formulario .flex .campo.radio .container-opcoes .opcao input {
    margin: 0;
}

.formulario .flex .campo.radio .container-opcoes .opcao input:checked + label {
    color: initial;
    font-weight: initial;
}





@media screen and (max-width: 1000px) {
    .formulario {
        padding: 0px;
    }


    .formulario .secao {
        gap: 5px;
    }

    .formulario .secao .flex {
        gap: 5px;
    }

    .formulario .btn-container {
        margin-top: 0px;
    }

    .formulario .btn-container .btn {
        width: 100%;
    }

    .formulario .subtitulo {
        margin-top: 15px;
        padding-bottom: 10px; /*Compensar 5px de margem da fonte*/
        margin-bottom: 15px;
        padding-left: 14px; /*Compensar 1px de margem da fonte*/
    }

    .formulario .legenda {
 
        margin-top: 30px;
        padding-bottom: 0px;
        border-bottom: 0px;
        padding-left: 15px;
        font-weight: 400;
        opacity: .7;
    }

    .formulario .secao {
        padding-bottom: 15px;
    }

    .formulario .subtitulo + .secao {
        padding-top: 0px;
    }

    .formulario .secao:not(:last-child) {
        margin-bottom: 15px;
    }

    .formulario .flex {
        flex-direction: column;
    }



    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/

    .formulario .flex .campo .label {
        white-space: normal;
    }

    .formulario .flex .campo.area .label {
        margin-top: 0px;
    }


    .formulario .flex .campo {
        flex-direction: column;
        align-items: flex-start;
        padding-top: 15px;
    }

    .formulario .flex .campo .inp {
        height: 45px;
    }

    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/
    /*--------------------------------------------------------------------------------*/



    .formulario .flex .campo.radio .container-opcoes {
        padding-left: 0px;
    }

    .formulario .flex .campo.radio .container-opcoes .opcao {
        padding-left: 0px;
        white-space: normal;
    }




    .formulario .flex .campo.area textarea.inp {
        padding-top: 0px;
        margin-top: 15px;
    }

    .formulario .flex .campo-container[data-orientacao='Horizontal'] .campo textarea.inp {
        padding-top: 0px;
    }
    


    .formulario .flex .campo.area ~ .tag-auxiliar {
        height:250px;
    }


   

    .formulario .flex .tag-auxiliar {
        height: 60px;
    }

    .formulario .flex .campo.check {
        height: 60px;
        flex: auto;
    }

    .formulario .flex .campo input[type='file'].inp {
        height: 60px;
    }

    .formulario .flex .campo input[type='file'].inp::-webkit-file-upload-button {
        height: 30px;
        margin-top: 15px;
    }


    .formulario .flex .campo.check input[type='checkbox'] {
        height: 25px;
        width: 25px;
        margin-right: 15px;
    }

    .formulario .flex .campo.check .label {
        white-space: normal;
    }

    .formulario .flex .campo.area .label, 
    .formulario .flex .campo-container[data-orientacao='Vertical'] .campo .label {
        margin-top: 0px;
    }


    .formulario .flex .campo.cor {
        height: 60px;
        flex: auto;
    }


    .formulario .flex .campo.codigo-acesso {
        flex-direction: column;
    }

    .formulario .flex .campo.codigo-acesso .label {
        margin-right: 0px;
        margin-bottom: 30px;
        font-size: 21px;
    }

    .formulario .flex .campo.codigo-acesso .digitos {
        justify-content: space-between;
        width: 100%;
    }


    .formulario .subtitulo + .explicacao {
        margin-top: -15px;
    }

    .formulario .explicacao {
        margin-bottom: 15px;
        margin-top: 15px;
        padding-left: 15px;
        padding-right: 15px;
    }


    .formulario .flex .campo .prefixo {
        display: none;
    }

    .formulario .flex .campo .sufixo {
        display: none;
    }
}