[data-role="input"] { width:100%; position:relative; margin-bottom:1em; background-color:transparent !important; border-width:0px; }
[data-role="input"] > label { width:100%; }
[data-role="input"] > .description { padding-top:0.5em; padding-bottom:0.5em; }
[data-role="input"] > input { border-bottom-color:inherit !important; }
[data-role="input"] > select { border-bottom-color:inherit !important; }
[data-role="input"] > textarea { border-color:inherit !important; }
[data-role="input"] > select[multiple] { border-color:inherit !important; border-width:1px !important; }
[data-role="input"].checkbox { margin-bottom:1px; }

.form-group.inline > [data-role="input"] { display:inline-flex; margin-bottom:0px; }
.form-group.inline > [data-role="input"] > *:not(:last-child) { width:auto; margin-right:1em !important; }
.form-group.inline > [data-role="input"] > label { white-space:nowrap; }
.form-group.inline > [data-role="input"] > .description { padding:5px 0 0 0; }

.form-group.fit > [data-role="input"] > label { min-height:fit-content !important; }
.form-group.fit > [data-role="input"] > input { 
    min-height:fit-content; 
    max-height:fit-content; 
    max-width:100%;
    padding-top:0px; 
    padding-bottom:0px; 
    border-width:0px;
    outline-offset:0.3em;
}



[data-role="input"].checkbox {display:inline-flex;flex-direction:row-reverse;align-items:center;align-content:center;justify-content:flex-end;flex-wrap: nowrap;}
[data-role="input"].checkbox > label { position:relative; margin:0rem !important; padding:0 !important; height:fit-content; }
[data-role="input"].checkbox > input[type="checkbox"] { position:relative; display:flex; appearance:none; height:1em; width:1.5em; padding:0px; }
[data-role="input"].checkbox > input[type="checkbox"]:before {
    position:relative;
    display:block;
    height:1em; width:1.5em;
    font-family: "Font Awesome 6 Free";
    font-weight: 300;
    font-size: 1rem;
    content: "\f0c8";
    color:var(--cavelo-grey);
}
[data-role="input"].checkbox > input[type="checkbox"]:checked:before {
    content: "\f14a";
    color:var(--cavelo-green);
}

.form-group:not(.inline) [data-role="input"]:not(.checkbox) > label { font-size:1.15em; }

.form-group .description { color:inherit; padding-top:0.5em; padding-bottom:0.5em; }