@import "/console/style/global.less";

table.permissions-table {
    clear: left;
    border: none;
    table-layout: fixed;

    thead > tr > th,
    tbody > tr > td,
    tfoot > tr > td {
        .text-overflow();
        background-color: #fff;
        color: #333;
        border: none;
        text-align: center;

        &:first-child {
            text-align: left;
        }
    }

    thead > tr:first-child > th {
        border-top: none;
    }

    tbody > tr > td {
        vertical-align: middle;
    }

    thead > tr > th {
        line-height: 30px;
        border-top: 1px solid @dividerColor;

        &:first-child {
            overflow: visible;
            width: 26%;
        }

        h3 {
            display: inline-block;
            font-size: @font-size-default;
            width: 9.5em;

            + .button {
                height: 30px;
                line-height: 30px;
            }
        }
    }

    tbody > tr.permission-error {
        border-top: 2px solid @contentBackgroundColor; // 2px = override border-bottom border (AUI's tables.css)

        > td {
            color: @errorTextColor;
            font-weight: bold;
        }
    }

    input[type=checkbox] + .spinner {
        margin-top: 11px;
    }

    .delete-button + .spinner {
        margin-top: 10px;
        margin-left: -2px;
    }

    .delete-button {
      visibility: hidden;
    }

    tr:hover .delete-button {
      visibility: visible;
      color: #bbb;
    }

    tr:hover .delete-button:hover {
      color: #333;
    }

    .permissions-item {
        display: inline;

        .user-avatar,
        .group-avatar {
            vertical-align: middle;
        }

        .display-name {
            .text-overflow();
            display: inline;
            width: 100%;
            vertical-align: middle;
        }
    }

    .permissions-spinner {
        height: 18px;
        width: 18px;
        display: inline-block;
        margin-left: 8px;
        vertical-align: middle;
    }

    .added-column {
        width: 48px;
    }

    .remove-permissions-column {
        width: 20px;
    }

    .no-results-row td div {
        display: none;
    }

    .load-more-row {
        border: none;
    }

    .lozenge.user-added,
    .lozenge.group-added {
        border-color: @lozengeAddedColor;
        background-color: @lozengeAddedColor;
        color: @invertedBodyTextColor;
        text-transform: uppercase;
        font-weight: bold;
        cursor: default;
    }

    .error-message {
        color: @errorTextColor;
    }

} // table.permissions-table

@permissionDescriptionColumnPaddingLeft: 40px;

.aui-group > .aui-item.permission-description-column {
    padding-left: @permissionDescriptionColumnPaddingLeft;
    width: 240px;

    h5 {
        margin: 2ex 0 1ex;
        font-size: 13px;
    }
}

#user-permissions-table .permission-error {
    padding: 0 0 7px 5px;
}

#group-permissions-table .permission-error {
    padding: 0 0 7px @baseSpacing;
}

.permission-multi-selector-container form.aui .permission-multi-selector {
    max-width: none;
    vertical-align: top;
    background-color: #fff;
}

#group-permissions-table {
    .stash-theme &.aui > tbody > tr.permission-error:hover { // selectivity required to override the style from stash-theme.css
        background-color: inherit; // disable highlight of the current row on hover
    }
}

table.permissions-table .permission-multi-selector-container th {
    background-color: #F5F5F5;
}
