@charset "UTF-8";

.extended-prop-container {
    display: grid;
    grid-template-columns: 600px;
    grid-template-rows: 50px 50px 240px 80px 40px 100px 60px;
    grid-template-areas: "extended-prop-title""extended-prop-doc-link""extended-prop-users-list""extended-prop-add-users" "extended-prop-notify" "extended-prop-text-notify" "extended-prop-btn-area";
    padding: 16px;
    border-radius: 10px;
    background: white;
    position: relative;
   z-index: 10002;
}

.extended-prop-title {
    grid-area: extended-prop-title;
}
.extended-prop-doc-link {
    grid-area: extended-prop-doc-link;
}

.extended-prop-users-list {
    grid-area: extended-prop-users-list;
}

.extended-prop-add-users {
    grid-area: extended-prop-add-users;
}

.extended-prop-btn-area {
    grid-area: extended-prop-btn-area;
    display: flex;
        align-items: flex-end;
}

.extended-prop-user-entry {
    display: grid;
    grid-template-columns: 50px 400px 70px 50px;
    grid-template-rows: 50px;
    grid-template-areas: "extended-prop-user-icon extended-prop-user-container extended-prop-access-level extended-prop-delete-entry";
    margin: 0px 5px;
}

.extended-prop-user-icon {
    grid-area: extended-prop-user-icon;
    width: 80%;
    height: 80%;
}

.extended-prop-access-level {
    grid-area: extended-prop-access-level;
    cursor: pointer;
}

.extended-prop-access-level-clickable {
	border-radius: 4px;
}

.extended-prop-access-level-clickable:hover{
	background: var(--col-console-bg);	
	border: 1px solid var(--col-btn-click);	
}

.extended-prop-access-level-clickable:active {
	background: var(--col-btn-click);
	border: 1px solid var(--col-btn-click);	
}

.extended-prop-delete-entry {
    grid-area: extended-prop-delete-entry;
    cursor: pointer;
}

.extended-prop-user-container {
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: 50% 50%;
    grid-template-areas: "extended-prop-user-name""extended-prop-user-email";
    grid-area: extended-prop-user-container;
}

.extended-prop-user-name {
    grid-area: extended-prop-user-name;
}

.extended-prop-user-email {
    grid-area: extended-prop-user-email;
}

.extended-prop-user-info {
    align-self: center;
    padding-left: 10px;
    font-size: 14px;
}

.extended-prop-center{
	margin: 0 auto;
}

.centred-element {
	align-self: center;
    justify-self: center;
    display: flex;
    align-items: center;
}

.extended-prop-user-separator {
    border-bottom: 1px solid var(--col-console-bg); 
}   

.extended-prop-additional-separator{
	border-top: 1px solid var(--col-console-bg);
}

.extended-prop-sub-title {
    padding: 10px 0px;
}

.extended-prop-panel-title {
    font-size: 20px;
}

.extended-prop-users-container {
    height: calc(100% - 40px);
    overflow: scroll;
    overflow-y: auto;
    overflow-x: hidden;
}

.extended-prop-input-container {}

.extended-prop-input {
    width: 98%;
    height: 20px;
}

.permission-selector-panel{
	background: white;
	z-index: 10010;
	position: relative;
	
}

.permission-selector-entry{
	height: 20px;
    width: 140px;
    padding: 6px;
}

.permission-selector-entry:hover {
	background-color: var(--col-btn-click);
}