timesheet-tree-node-spent-hours-cell {
    /* This is to make sure that cell is above div, which simulates background color */
    z-index: 2;
}

.timesheetTreeNodeSpentHoursCellContainer {
    height: 100%;
    width: 40px;
    position: relative;
}

.timesheetTreeNodeSpentHoursCellContainer.blured {
    -webkit-filter: blur(8px);
    filter: blur(8px);
}

.timesheetTreeNodeSpentHoursCellContainer.updateIsNotFinished.timesheetAssignment:not(.isTotal) .timesheetTreeNodeSpentHoursCell,
.timesheetTreeNodeSpentHoursCellContainer.updateIsNotFinished .timesheetTreeNodeSpentHoursCell {
    color: #EC4A43;
}

.timesheetTreeNodeSpentHoursCellContainer.isTotal {
    width: 80px;
}

    .timesheetTreeNodeSpentHoursCellContainer.isSelected {
        background-color: #D9EEFE !important;
    }

    .timesheetTreeNodeSpentHoursCellContainer .highlightOverBackgroundColor {
        top: 0;
    }

    .timesheetTreeNodeSpentHoursCellContainer .timesheetTreeNodeSpentHoursCell {
        height: 100%;

        padding-top: 4px;
        text-align: center;
        font-size: 14px;

        align-self: center;
        cursor: default;
        color: #B6B6B6;
    }

        .timesheetTreeNodeSpentHoursCellContainer .timesheetTreeNodeSpentHoursCell .plusIcon {
            display: none;
        }

        .timesheetTreeNodeSpentHoursCellContainer .timesheetTreeNodeSpentHoursCell:hover .plusIcon {
            display: block;
        }

        .timesheetTreeNodeSpentHoursCellContainer .timesheetTreeNodeSpentHoursCell .dotInsteadZeroHours {
            height: 2px;
            width: 2px;
            background-color: #B6B6B6;
            border-radius: 50%;
            display: inline-block;
            vertical-align: middle;
        }

        .timesheetTreeNodeSpentHoursCellContainer .timesheetTreeNodeSpentHoursCell.editable .dotInsteadZeroHours {
            background-color: #5774E7;
        }

        .timesheetTreeNodeSpentHoursCellContainer .timesheetTreeNodeSpentHoursCell.editable:hover {
            background-color: #dae1ff;
        }

    /* Group, Project, Summary, Task in Total column is regular, but not editable */
    .timesheetTreeNodeSpentHoursCellContainer.group.isTotal .timesheetTreeNodeSpentHoursCell,
    .timesheetTreeNodeSpentHoursCellContainer.project.isTotal .timesheetTreeNodeSpentHoursCell,
    .timesheetTreeNodeSpentHoursCellContainer.summary.isTotal .timesheetTreeNodeSpentHoursCell,
    .timesheetTreeNodeSpentHoursCellContainer.task.isTotal .timesheetTreeNodeSpentHoursCell {
        font-family: GlowRegular;
    }

    /* Group, Project, Summary, Task not in Total column is regular, not editable */
    .timesheetTreeNodeSpentHoursCellContainer.group:not(.isTotal) .timesheetTreeNodeSpentHoursCell,
    .timesheetTreeNodeSpentHoursCellContainer.project:not(.isTotal) .timesheetTreeNodeSpentHoursCell,
    .timesheetTreeNodeSpentHoursCellContainer.summary:not(.isTotal) .timesheetTreeNodeSpentHoursCell,
    .timesheetTreeNodeSpentHoursCellContainer.task:not(.isTotal) .timesheetTreeNodeSpentHoursCell {
        font-family: GlowRegular;
    }

    /* For Timesheet Assignment */
    .timesheetTreeNodeSpentHoursCellContainer.timesheetAssignment.isTotal .timesheetTreeNodeSpentHoursCell {
        font-family: GlowRegular;
    }

    .timesheetTreeNodeSpentHoursCellContainer.timesheetAssignment:not(.isTotal) .timesheetTreeNodeSpentHoursCell {
        font-family: GlowRegular;
        color: #4a4a4a;
    }

        .timesheetTreeNodeSpentHoursCellContainer.timesheetAssignment:not(.isTotal) .timesheetTreeNodeSpentHoursCell.editable {
            cursor: pointer;
        }

        .timesheetTreeNodeSpentHoursCellContainer.timesheetAssignment:not(.isTotal) .spentHoursInput {
            width: 100%;
            padding-left: 2px;
            padding-right: 2px;
            text-align: right;
        }