/*This import is done for time being. have to find a common scss file to import this.*/

@import "../../../assets/styles/variables.scss";
@import "../../../assets/styles/mixins.scss";
.roles-container {
    font-size: inherit;
    padding:$gutter-zero !important;
    .role-list-head {
        padding: $gutter-base*3;
        font-weight: bold;
        display: flex;
        flex-grow: 1;
        justify-content: center;
        align-items: center;
    }
    .application-head {
        line-height: $gutter-base*6;
        font-weight: bold;
        background: $color-grey-2;
        text-transform: uppercase;
        .app-sub-head {
            padding-left: $gutter-base*3;
        }
    }
    .application-list {
        margin: $gutter-zero auto;
        padding: $gutter-zero;
        list-style: none;
        .permission-head {
            height: $gutter-base*3 * 3;
            padding-left: $gutter-base*3;
            font-size: $font-size-medium;
            display: flex;
            align-items: center;
            .xpo-info-icon {
                height: auto;
                color : $color-grey-6;
                font-size: $font-size-medium;
            }
            .tooltip-container {
                display: flex;
                justify-content: center;
            }
        }
        .access-list {
            height: $gutter-base*3 * 3;
            padding-left: $gutter-base*3;
            font-size: $font-size-medium;
            display: flex;
            align-items: center;
            justify-content: center;
        }
    }
}

.border-right {
    @include border-right( $border-base, $border-default-pattern, $color-grey-3);
}

.card-content {
    padding: $gutter-zero;
}
.border-top{
    @include border-top( $border-base, $border-default-pattern, $color-grey-3);
}
.add-role-btn xpo-icon{
    margin-right: $gutter-base*2 !important;
}
.permission-tooltip /deep/ .popover-wrapper{
    margin-top: 0px !important;
}
@media (max-width: $mobile-screen) {
.roles-container .role-list-head {
        padding: $gutter-base*2;
}
}