/* Widgets - Table - Bulk Actions */
////
/// @group Widgets-Table-Bulk_Actions
/// Widgets - Table - Bulk Actions

///
.table {
	// Add this selector to fix the horizontal align of checkbox enclosed on a container
	div span [data-checkbox] {
		display: inline-block;
		vertical-align: middle;
	}

	[data-checkbox] {
		display: block;
		height: 16px;
		width: 16px;

		&:before {
			height: 14px;
			width: 14px;
		}

		&:checked:after {
			border: var(--border-size-m) solid var(--color-neutral-0);
			border-right: var(--border-size-none) !important;
			border-top: var(--border-size-none) !important;
			display: block;
			height: 2px;
			left: 4px;
			top: 5px;
			width: 7px;
		}
	}

	.checkbox-intermediate {
		&:before {
			background-color: var(--color-primary);
			border: var(--border-size-s) solid var(--color-primary);
		}

		&:after {
			background-color: var(--color-neutral-0);
			content: '';
			height: 2px;
			left: 50%;
			position: absolute;
			top: 50%;
			transform: translateY(-50%) translateX(-50%);
			width: 8px;

			// Service Studio Preview
			& {
				-servicestudio-border-width: 1px !important;
				-servicestudio-left: 8px !important;
				-servicestudio-top: 7px !important;
			}
		}
	}
}
