/**************************************************************************************************/
/********* DISPLAY PROFILE 
/**************************************************************************************************/
.profile {
    display: flex;
    flex-direction: column;
    margin-left: var(--space-out);
    margin-right: var(--space-out);
}

.com-users-profile__core {
    order:1;
}
.com-users-profile__core legend {
    display: none;
}
.com-users-profile__core dl {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid;
    margin: 2rem 0;
}
.com-users-profile__core dl dt {
    width: 10rem;
    padding: 1rem 0;
    border-bottom: 1px solid;
}
.com-users-profile__core dl dd {
    width: calc(100% - 10rem);
    padding: 1rem 0;
    border-bottom: 1px solid;
}
.com-users-profile__edit {
    order:2;
}
ul.com-users-profile__edit .btn {
    display: inline-block;
    border: none;
    background: #000;
    color: #fff;
}

/**************************************************************************************************/
/********* EDIT PROFILE 
/**************************************************************************************************/
div.com-users-profile__edit {
    margin-left: var(--space-out);
    margin-right: var(--space-out);
    --label-width : 10rem;
}

div.com-users-profile__edit legend {
    display: block;
    font-size: 3.43rem;
    margin: .5em 0;
}

div.com-users-profile__edit .control-group {
    position:relative;
    display:flex;
    border-top: 1px solid;
}

div.com-users-profile__edit .control-group .form-control-feedback {
    position:absolute;
    max-width:100%;
    bottom:0;
    left: var(--label-width);
    padding-bottom: .5em;
    color: red;
}
div.com-users-profile__edit .invalid {
    color:red;
}

div.com-users-profile__edit .control-group .control-label {
    width: var(--label-width);
}
div.com-users-profile__edit .control-group .control-label label {
    display:flex;
    align-items:center;
    height: var(--field-height);
}
div.com-users-profile__edit .control-group .controls {
    flex:1; 
}

div.com-users-profile__edit input {
    display:block;
    width:100%;
    font: inherit;
    font-size:1.8rem;
    border:none;
    outline: none;
    background: none;
    padding: var(--field-vt-padding) 1em;
    height: var(--field-height);
    line-height: var(--field-line-height);
}

/** Hide identifiant field **/
div.com-users-profile__edit .control-group:nth-child(4) {
    display: none;
}

/** Password fields **/
div.com-users-profile__edit .text-muted {
    position: absolute;
    top: 0;
    padding: .5rem 0 .5rem 1.8rem;
}
div.com-users-profile__edit .input-password-toggle {
    position: absolute;
    right: 0; top: 50%;
    transform: translateY(-50%);
    font-size: .8rem;
    padding: .5rem 1rem;
}
@media screen and (max-width: 500px) {
    div.com-users-profile__edit .input-password-toggle {
        display: none;
    }
}
div.com-users-profile__edit .password-group meter {
    width: 100%;
    height: 4px;
    background: none;
    border-radius: 0;
    margin-left: 1.8rem;
} 
div.com-users-profile__edit #password-0 {
    position: absolute;
    bottom: 0;
    padding: .5rem 0 .5rem 1.8rem;
}

#jform_password1-lbl .form-control-feedback {
    display: none;
}

/** Form buttons **/
.com-users-profile__edit-submit .controls {
    margin: 3rem 0;
    display: flex;
}
.com-users-profile__edit-submit .controls .btn {
    margin-right: 1rem;
    background: #000;
    color: #fff;
    border:0;
}