.userFunctionality-module-block {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.userFunctionality-module-unselected,
.userFunctionality-module-selected {
    position: relative;
    padding: 12px 20px 12px 20px;
    font-weight: bold;
    cursor: pointer;
}

.userFunctionality-module-unselected {
    background-color: #cccccc;
    color: black;
}

.userFunctionality-module-selected {
    background-color: #444444;
    color: white;
}


.userFunctionality-module-functionality-count {
    position:absolute;
    right: 0;
    top: 0;
    padding: 1px;
    color: red;
    border-style: solid;
    border-color: red;
    border-width: 1px;
    font-size: .8em;
    text-align: center;
}


.userFunctionality-functionality-block {
    display: flex;
    flex-direction: column;
    gap: 10px;
}


.userFunctionality-functionality-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}


.userFunctionality-functionality-list-row,
.userFunctionality-functionality-list-row-hidden {
    display: flex;
    flex-direction: row;
    gap: 12px;
    align-items: center;
}

.userFunctionality-functionality-list-row-hidden {
    display: none;
}

.userFunctionality-functionality-type {
    padding: 0 4px;
    font-size: .8em;
}

.userFunctionality-functionality-admin {
    color: red;
}




.userFunctionality-role-title {
    display: flex;
    flex-direction: row;
    gap: 10px;
}

.userFunctionality-role-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.userFunctionality-role-line {
    display: flex;
    flex-direction: row;
    gap: 20px;
}

.userFunctionality-role-button-block {
    display: flex;
    flex-direction: row;
    gap: 5px;
}

.userFunctionality-role-label {
    max-width: 200px;
    cursor: pointer;
}




.userFunctionality-role-diff {
    display: flex;
    flex-direction: column;
    gap: 8px;
    cursor: pointer;
}