<div class="cell">
    <div [matTooltip]="justification.name" class="table-item-title" matTooltipPosition="above">
        {{ justification.name }}
    </div>
</div>

<div class="cell">
    <span [matTooltip]="justification.reason" class="small-label clamp-4" matTooltipPosition="above"> {{ justification.reason }} </span>
</div>

<div class="cell">
    <span [matTooltip]="justification.description" class="small-label clamp-4" matTooltipPosition="above">
        {{ justification.description }}
    </span>

    <div class="action-buttons">
        <ng-container *ngIf="canAddEditJustifications">
            <iqser-circle-button
                (action)="openEditJustificationDialog()"
                [tooltip]="'justifications-listing.actions.edit' | translate"
                icon="iqser:edit"
            ></iqser-circle-button>

            <iqser-circle-button
                (action)="openConfirmDeleteDialog()"
                [tooltip]="'justifications-listing.actions.delete' | translate"
                icon="iqser:trash"
            ></iqser-circle-button>
        </ng-container>
    </div>
</div>
