:root {
    --organization-list-header-height: 22px;
    --organization-list-search-height: 35px;
    --organization-list-padding: 10px;
}

.organization-list-view {
    color: var(--whispr-white);

    margin-left: var(--organization-list-padding);
    margin-top: 7px;
    width: calc(100% - var(--organization-list-padding));
}

.organization-list-container {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--organization-list-search-height) - 3*var(--organization-list-padding));
}

.organization-list {
    box-sizing: border-box;
    position: absolute;
    top: 80px;
    bottom: 0px;
    overflow: auto;
    width: 100%;
}


.organization-list-view .search-container {
    padding-top: 10px;
    /* min-height: var(--organization-list-search-height); */
}

.organization-list-view .search-container input {
    width: calc(100% - 2em - 2px);
}

.organization-list-view .search-container i {
    color: var(--whispr-dark-grey);
}

.organization-list-item {
    color: var(--whispr-light-grey);
    font-size: 12px;
    line-height: 20px;
    padding-top: 0.25em;
    padding-bottom: 0.25em;
    margin-right: 1em;
    cursor: pointer;
}
.organization-list-item:hover {
    color: var(--whispr-dark-grey);
    background-color: var(--whispr-white);
}

.organization-list-item.selected {
    color: var(--whispr-white);
    background-color: var(--whispr-dark-red);
}