.ufSeparator {
	background-color: #8CC93F;
	color: #FFFFFF;
	font-family: Segoe UI, Arial, sans-serif;
	font-size: 10pt;
	margin-top: 3px;
	margin-bottom: 3px;
	min-height: 30px;
	height: 30px;
	display: -webkit-box !important;
	display: -ms-flexbox !important;
	display: flex !important;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	padding-left: 8px;
}

/*#region Actions Log*/
div.ufLog ul li ul li {
	display: list-item !important;
}

div.ufLog ul.ufLog li {
	display: block;
}

div.ufLog {
	padding: 0;
}

div.ufLog ul.ufLog {
	margin: 0 0 2px 0;
}

div.ufLog ul.ufLog li ul.ufLog {
	margin-left: 17px;
	display: list-item;
}

div.ufLog li,
div.ufLog ul li ul li,
div.ufLog ul.ufLog li ul.ufLog,
div.ufLog ul.ufLog li ul.ufLog li {
	list-style-type: disc !important;
}

div.ufLog > ul.ufLog,
div.ufLog > ul.ufLog li {
	margin: auto;
}

div.ufLog ul.ufLog > li {
	color: inherit;
	padding-bottom: 2px;
}

ul.ufLog.ufAsyncLog[ufNewLog='1'] {
	font-weight: bold;
}

div.ufLog ul.ufLog li {
	font-weight: 700;
}

div.ufLog ul.ufLog li ul,
div.ufLog ul.ufLog li ul li {
	font-weight: normal;
}

/*#region File*/
.ufFile {
	vertical-align: bottom;
	flex: 1 1 100% !important;
	display: flex;
	align-items: center;
}

.ufFile .uffName,
.ufFile.empty:before {
	background-color: white;
	margin-right: 3px;
	border: 1px solid #BCBCBC;
	border-radius: 4px;
	padding: 5px 10px;
	margin-right: 3px;
	flex: 1 1 auto;
	width: auto;
}

.ufFile .uffName:empty:before,
.ufFile.empty:before {
	content: '\00a0';
}

.ufFile .uffButton {
	cursor: pointer;
	margin: 0;
	margin-right: 3px;
	vertical-align: bottom;
}
.ufFile.disabled .uffButton
{
	cursor: default;
}
.ufFile .uffButton.open
{
	/*voir aussi .psButton.open dans default.css*/
}
.ufFile.disabled .uffButton.open
{
	cursor: pointer;
}
.ufFile .uffButton.select
/*voir aussi .psSelect dans default.css*/
{
}
.ufFile .uffButton.clear
/*voir aussi .psClear dans default.css*/
{
}
.ufFile.empty .uffButton.open,
.ufFile.empty .uffButton.clear,
.ufFile.empty .uffName
{
	display: none;
}
/*#endregion File*/

/*#region Workflow*/

.wfManager.wfTab .wfIcon::before {
	font-weight: 900;
	padding-right: 14px;
	content: "\f0a1";
	font-family: "Font Awesome 6 Pro";
}

/*#region Control*/
.ufWorkflow {
	display: -ms-grid;
	display: grid;
	width: 100%;
	border: 1px solid #D9DADD;
	border-radius: 12px;
	padding: 10px 16px;
	background: #FFFFFF;
	margin-bottom: 8px !important;
	-ms-grid-columns: 50px auto auto auto 40px;
	grid-template-columns: 50px auto auto auto 40px;
	-ms-grid-rows: (1fr)[2];
	grid-template-rows: repeat(2, 1fr);
	text-align: start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-ms-grid-row-align: center;
	align-items: center;
	overflow: hidden;
}

.ufWorkflow.new {
	display: none;
}

.ufWorkflow.new > div.data {
	width: 124px;
}

.ufWorkflow.new > div.details {
	display: none;
}

div.icon.wfIcon {
	width: 32px;
	height: 32px;
	color: #41454D;
	padding: 8px;
	background: #EAEAEB;
	border-radius: 8px;
	grid-area: 1 / 1 / 3 / 2;
}

div.icon.wfIcon:before {
	content: "\f0a1";
	font-family: "Font Awesome 6 Pro";
	font-size: 16px;
	font-weight: bold;
}

.ufWorkflow > div.icon {
	margin: auto 0;
}

.ufWorkflow > div.data > span.title,
.ufWorkflow > div.data > span {
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	line-height: 20px;
	color: #41454D;
	margin: 0;
}

.ufWorkflow > div.data > span {
	font-weight: 400;
}

.ufWorkflow > div.data > span.title::after {
	content: ":";
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	line-height: 20px;
	color: #41454D;
	padding: 0 2px;
}

.ufWorkflow div.data {
	width: 100%;
}

.ufWorkflow div.data.status {
	grid-area: 2 / 2 / 3 / 5;
}

.ufWorkflow div.data.name {
	grid-area: 1 / 2 / 2 / 5;
}

.ufWorkflow > div.details {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	text-align: center;
	margin: auto 0 auto auto;
	grid-area: 1 / 5 / 3 / 6;
}

.ufWorkflow > div.details:before {
	content: "\f141";
	font-family: "Font Awesome 6 Pro";
	cursor: pointer;
	font-size: 12px;
	color: #0F59BA;
	z-index: 1;
	width: 22px;
	height: 22px;
	border: 2px solid #0F59BA;
	border-radius: 50%;
	padding: 3px 0 0 1px;
}

.ufWorkflow > div.details:after {
	position: absolute;
	content: "";
	width: 22px;
	height: 22px;
	background: white;
	border-radius: 50%;
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	-webkit-animation: fadeIn 0.6s ease-in-out 0.1s infinite;
			animation: fadeIn 0.6s ease-in-out 0.1s infinite;
}

.ufWorkflow > div.details:hover:before {
	color: white;
}

.ufWorkflow > div.details:hover:after {
	background: #0F59BA;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	-webkit-animation: resetHover 0.6s ease-in-out 0.1s infinite;
			animation: resetHover 0.6s ease-in-out 0.1s infinite;
}

@-webkit-keyframes fadeIn {
	0% {
		background: white;
		opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	}

	50% {
		background: #0F59BA;
		opacity: 0.5;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	}

	100% {
		background: white;
		opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	}
}

@keyframes fadeIn {
	0% {
		background: white;
		opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	}

	50% {
		background: #0F59BA;
		opacity: 0.5;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	}

	100% {
		background: white;
		opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	}
}

@-webkit-keyframes resetHover {
	0% {
		background: #0F59BA;
		opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	}

	100% {
		background: #0F59BA;
		opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	}
}

@keyframes resetHover {
	0% {
		background: #0F59BA;
		opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	}

	100% {
		background: #0F59BA;
		opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	}
}

@media (max-width: 700px) {
	.ufWorkflow {
		display: block;
	}

	.ufWorkflow > div.data {
		margin: 8px 0;
	}
}

/*#endregion Control*/

div.wfManager.overlay
{
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	z-index: 50000;
	background-color: Black;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
	filter: alpha(opacity=85);
	opacity: 0.85;
}

div.wfManager.overlay,
div.wfManager.wfDetailsPopup
{
	-moz-transition: opacity ease-in 0.1s;
	-o-transition: opacity ease-in 0.1s;
	-webkit-transition: opacity ease-in 0.1s;
	transition: opacity ease-in 0.1s;
}

/*#region Details popup*/
div.wfManager.wfDetailsPopup {
	background: #FFFFFF;
	box-sizing: border-box;
	border-radius: 12px;
	display: block;
	max-width: 800px;
	width: 94%;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	position: fixed;
	z-index: 50001;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}

div.wfManager.wfDetailsPopup > div.content {
	background-color: #FAFAFA;
	border-radius: 0 0 12px 12px;
}

div.wfManager.wfDetailsPopup > div.header {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin: 0;
	height: -webkit-fit-content;
	height: -moz-fit-content;
	height: fit-content;
	width: 100%;
	padding: 16px 24px;
	-ms-flex-line-pack: center;
		align-content: center;
	border-bottom: 1px solid #D9DADD;
}

div.wfManager.wfDetailsPopup > div.header > div.title,
div.wfManager.wfDetails > div.header > span.title {
	font-family: 'Fira Sans', sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 20px;
	line-height: 24px;
	margin: 0;
	color: #41454D;
}

div.wfManager.wfDetailsPopup > div.header > div.title:before {
	content: "\f0a1";
	font-family: "Font Awesome 6 Pro";
	font-weight: 900;
	font-size: 20px;
	padding-right: 8px;
}

div.wfManager.wfDetailsPopup > div.header > div.closeIcon {
	margin: 0;
	cursor: pointer;
	position: absolute;
	right: 24px;
	top: 16px;
	background: url(../media/images/ic-svg_modal-close-btn.svg) no-repeat center;
	width: 24px;
	height: 24px;
	display: inline;
}

div.wfManager.wfDetailsPopup > div.content {
	background-color: #FAFAFA;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
/*#endregion Details popup*/

/*#region Details*/
div.wfManager.wfDetails {
	overflow-y: auto;
	overflow-x: hidden;
	position: relative;
	width: 100%;
	padding: 16px 24px 0;
}

div.wfManager.wfTab.expanded > div.body > div.content > div.wfManager.wfDetails {
	padding: 0;
}

div.wfManager.wfDetails span.title {
	font-family: 'Fira Sans', sans-serif;
	font-style: normal;
	font-size: 16px;
	font-weight: 600;
}

div.wfManager.wfDetailsPopup > div.content > div > div.approval > div > span.title {
	font-weight: 600;
	color: #41454D;
	padding: 0 0 4px 0;
}

div.wfManager.wfDetailsPopup > div.content > div > div.approval > div > span:nth-child(2) {
	font-weight: 400;
	color: #838791;
}

div.wfManager.wfDetails span {
	display: block;
}
/*#region Header*/
div.wfManager.wfDetails.approver > div.header > span.approver {
	position: absolute;
	top: 2px;
	right: 2px;
	max-width: 300px;
	color: #41454D;
	font-weight: 400;
	font-size: 14px;
}

div.wfManager.wfDetails > div.header,
div.wfManager.wfDetails.running > div.header {
	border-bottom: 1px solid #D9DADD;
	padding-bottom: 16px;
	margin-bottom: 16px;
	display: inline;
}

div.wfManager.wfDetails > div.header > span.title {
	margin-bottom: 8px;
}

div.wfManager.wfDetails > div.header > span.status {
	border-bottom: 1px solid #D9DADD;
	padding-bottom: 16px;
}

div.wfManager.wfTab.expanded > div.body > div.content > div > div.header > span.status {
	border: none;
}

div.wfManager.wfDetails > div.header > span.status,
div.wfManager.wfDetails > div.header > span.step {
	font-family: 'Fira Sans', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	margin: 0;
	color: #41454D;
}

div.wfManager.wfDetails:not(.approver) > div.header > span.approver
{
	display: none;
}


/*#endregion Header*/

/*#region Approval*/
div.wfManager.wfDetails > div.log > div.section.actions,
div.wfManager.wfDetails > div.approval {
	display: -ms-grid;
	display: grid;
	-ms-grid-rows: auto;
		grid-template-rows: auto;
	grid-gap: 8px;
}

div.wfManager.wfDetails > div.approval {
	-ms-grid-columns: (1fr)[2];
		grid-template-columns: repeat(2, 1fr);
	border-bottom: 1px solid #D9DADD;
	padding: 16px 0;
	margin-bottom: 16px;
}

div.wfManager.wfDetails > div.log > div.section.actions {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: center;
		-ms-flex-pack: center;
			justify-content: center;
	text-align: center;
	margin-top: 14px;
	position: -webkit-sticky;
	position: sticky;
	bottom: 0;
}

div.wfManager.wfDetails > div.log > div.section.actions > div.action {
	-ms-flex: 0 1 fit-content;
	-webkit-box-flex: 0;
			flex: 0 1 fit-content;
	-ms-flex-item-align: auto;
	align-self: auto;
	cursor: pointer;
	font-size: clamp(10px, 6.153px + 1.0256vw, 14px);
	font-size: clamp(0.625rem, 0.3846rem + 1.0256vw, 0.875rem);
	font-weight: 600;
	padding: 0 14px;
	color: #606570;
}


div.wfManager.wfDetails > div.log > div.section.actions > div.action > span {
	margin-top: 4px;
}

div.wfManager.wfDetails > div.approval > div.section {
	width: 100% !important;
	overflow: auto !important;
	max-height: 120px;
}

div.wfManager.wfDetails.running > div.approval > div.section.planning {
	width: 200px;
	border-right: 1px solid #D9DADD;
}

div.wfManager.wfDetails > div.approval > div.section.note
{
	width: 796px;
	overflow-y: auto;
}

div.wfManager.wfDetails.running.approver > div.approval > div.section.note
{
	width: 338px;
}

div.wfManager.wfDetails.running.approver > div.approval > div.section.actions
{
	display: inline-block;
	text-align: center;
	width: 250px;
}

div.wfManager.wfDetails.running > div.approval > div.section.note
{
	width: 592px;
}

div.wfManager.wfDetails > div.approval > div.section {
	box-sizing: border-box;
	display: inline-block;
	height: 100%;
	margin-left: 2px;
	margin-right: 2px;
	overflow: hidden;
	padding: 2px;
	vertical-align: top;
}

div.wfManager.wfDetails:not(.running) > div.approval > div.section.planning
{
	display: none;
}

div.wfManager.wfDetails > div.approval > div.section.actions
{
	display: none;
}


/*#region Actions*/
div.wfManager.wfDetails > div.approval > div.section.actions > div.action,
div.rwwApprovalActions > div.action	/*actions dans recherches avec workflows*/
{
	cursor: pointer;
	display: inline-block;
	font-size: 7pt;
	width: 50px;
	overflow: hidden;
	vertical-align: top;
}

div.wfManager.wfDetails > div.approval > div.section.actions > div.action {
	width: 25%;
}

div.wfManager.wfDetails.readonly > div.approval > div.section.actions > div.action:not(.message)
{
	cursor: default;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	opacity: 0.5;
}

div.wfManager.wfDetails > div.log > div.section.actions > div.action > div.icon,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action > div.icon,
div.wfManager.approval.action.icon /*icon dans popup de saisie de note*/,
div.rwwApprovalActions > div.action /*actions dans recherches avec workflows*/
{
	background-position: center center;
	background-repeat: no-repeat;
	height: 32px;
}

div.rwwApprovalActions > div.action /*actions dans recherches avec workflows*/ 
{
	width: 43px;
}

div.wfManager.approval.action.icon
{
	display: inline-block;
}
/*#region Actions icons*/
div.wfManager.wfDetails > div.log > div.section.actions > div.action.approve > div.icon,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action.approve > div.icon {
	background-image: url("../media/images/workflows/fa-svg_approve.svg") /*../media/images/workflows/approve.png*/;
	background-size: 32px 32px;
	background-position: center center;
}

div.wfManager.approval.action.approve.icon,
div.rwwApprovalActions > div.action.approve,
div.rwwApprovalActions.rwwApprovalGroup > div.action.approve,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action.deny > div.icon,
div.wfManager.approval.action.deny.icon,
div.rwwApprovalAction > div.action.deny,
div.rwwApprovalActions.rwwApprovalGroup > div.action.deny,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action.back > div.icon,
div.wfManager.approval.action.back.icon,
div.rwwApprovalActions > div.action.back,
div.rwwApprovalActions.rwwApprovalGroup > div.action.back,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action.cancel > div.icon,
div.wfManager.approval.action.cancel.icon,
div.rwwApprovalActions > div.action.cancel,
div.rwwApprovalActions.rwwApprovalGroup > div.action.cancel,
div.wfManager.approval.action.message.icon,
div.rwwApprovalActions > div.action.messagee {
	background-size: 32px 32px;
	background-position: center center;
	width: 32px;
	height: 32px;
}

div.rwwApprovalActions.rwwApprovalGroup > div.action.approve /*actions dans recherches avec workflows*/ {
	background-image: url("../media/images/workflows/fa-svg_approve_group.svg") /*../media/images/workflows/approveB.png*/;
}

div.section.actions div.icon {
	filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur in="SourceAlpha" stdDeviation="2" /><feOffset dx="1" dy="2" result="offsetblur" /><feFlood flood-color="rgba(0,0,0,0.24)" /><feComposite in2="offsetblur" operator="in" /><feMerge><feMergeNode /><feMergeNode in="SourceGraphic" /></feMerge></filter></svg>#filter');
	-webkit-filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.24));
			filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.24));
}

div.wfManager.wfDetails > div.log > div.section.actions > div.action.approve > div.icon,
.wfManager.approval.icon.action.approve,
div.rwwApprovalActions > div.action.approve /*actions dans recherches avec workflows*/ {
	background-image: url("../media/images/workflows/fa-svg_approve.svg") /*../media/images/workflows/fa-svg_approve.svg*/;
}

div.wfManager.wfDetails > div.log > div.section.actions > div.action.deny > div.icon,
.wfManager.approval.icon.action.deny,
div.rwwApprovalActions > div.action.deny,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action.deny > div.icon {
	background-image: url("../media/images/workflows/fa-svg_refuse.svg") /*../media/images/workflows/fa-svg_refuse.svg*/;
}

div.rwwApprovalActions.rwwApprovalGroup > div.action.deny /*actions dans recherches avec workflows*/ {
	background-image: url("../media/images/workflows/fa-svg_refuse_group.svg") /*../media/images/workflows/denyB.png*/;
}
div.wfManager.wfDetails > div.log > div.section.actions > div.action.back > div.icon,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action.back > div.icon {
	background-image: url("../media/images/workflows/fa-svg_sendBack-n-1.svg");
}

div.rwwApprovalActions.rwwApprovalGroup > div.action.back {
	background-image: url("../media/images/workflows/fa-svg_sendBack-n-1_group.svg");
}

.wfManager.approval.icon.action.back,
div.rwwApprovalActions > div.action.back {
	background-image: url("../media/images/workflows/fa-svg_sendBack-n-1.svg");
}

div.wfManager.wfDetails > div.log > div.section.actions > div.action.cancel > div.icon,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action.cancel > div.icon {
	background-image: url("../media/images/workflows/fa-svg_sendBack.svg") /*../media/images/workflows/cancel.png*/;
}

div.rwwApprovalActions.rwwApprovalGroup > div.action.cancel /*actions dans recherches avec workflows*/ {
	background-image: url("../media/images/workflows/fa-svg_sendBack_group.svg") /*../media/images/workflows/cancelB.png*/;
}

.wfManager.approval.icon.action.cancel,
div.rwwApprovalActions > div.action.cancel /*actions dans recherches avec workflows*/ {
	background-image: url("../media/images/workflows/fa-svg_sendBack.svg") /*../media/images/workflows/fa-svg_sendBack.svg*/;
}

div.wfManager.wfDetails > div.log > div.section.actions > div.action.message > div.icon,
div.wfManager.wfDetails > div.approval > div.section.actions > div.action.message > div.icon {
	background-image: url("../media/images/workflows/fa-svg_file.svg") /*../media/images/workflows/msg.png*/;
}

div.rwwApprovalActions > div.action.message,
div.wfManager.approval.action.message.icon,
div.rwwApprovalActions > div.action.messagee /*actions dans recherches avec workflows*/ {
	background-image: url("../media/images/workflows/fa-svg_file.svg") /*../media/images/workflows/msgB.png*/;
}

/*#endregion Actions icons*/
/*#endregion Actions*/
/*#endregion Approval*/

/*#region Log*/

div.wfManager.wfDetails > div.log > div.content {
	width: 100%;
	height: 210px;
	margin: 0;
}

div.wfManager.wfDetails > div.log {
	width: 100%;
	height: auto;
	position: relative;
	vertical-align: top;
}

div.wfManager.wfDetailsPopup > div.content > div > div.log > span.title {
	font-family: 'Fira Sans', sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	line-height: 20px;
	margin: 0 0 8px;
	color: #41454D;
}

div.wfManager.wfDetails > div.log > div.content > iframe {
	width: 100%;
	height: 100%;
	border-radius: 4px !important;
}
/*#endregion Log*/
/*#endregion Details*/
/*#region Tab*/
div.wfManager.wfTab {
	border-radius: 12px 12px 0 0;
	display: block;
	position: fixed;
	bottom: 0;
	height: 56px;
	left: 30px;
	-webkit-transition: opacity ease-in 0.1s;
	transition: opacity ease-in 0.1s;
	z-index: 850;
	-webkit-transition: bottom ease-in-out 0.5s;
	transition: bottom ease-in-out 0.5s;
	width: calc(100% - 300px);
	-webkit-animation-duration: 2s;
			animation-duration: 2s;
	-webkit-animation-fill-mode: both;
			animation-fill-mode: both;
	-webkit-animation-name: bounce;
			animation-name: bounce;
	-webkit-animation-delay: 1s;
			animation-delay: 1s;
	-webkit-animation-timing-function: ease-in;
			animation-timing-function: ease-in;
}

@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
		-webkit-transform: translateY(0);
				transform: translateY(0);
	}

	40% {
		-webkit-transform: translateY(-30px);
				transform: translateY(-30px);
	}

	60% {
		-webkit-transform: translateY(-15px);
				transform: translateY(-15px);
	}
}

@media (min-width: 1370px) {
	div.wfManager.wfTab {
		left: 32px;
		width: calc(100% - 390px);
	}
}

@media (min-width: 1415px) {
	div.wfManager.wfTab {
		left: 32px;
		width: calc(100% - 440px);
	}
}

div.wfManager.wfTab.collapsed {
	height: 550px;
	bottom: -550px;
	border-radius: 0 !important;
}

div.wfManager.wfTab .header {
	margin-top: -56px;
}

div.wfManager.wfTab.expanded {
	z-index: 50001;
	height: 550px;
	font-family: 'Fira Sans', sans-serif;
}

@media (max-width: 1160px) {
	div.wfManager.wfTab,
	div.wfManager.wfTab > div.header,
	div.wfManager.wfTab > div.body {
		left: 50%;
		-webkit-transform: translate(-50%);
				transform: translate(-50%);
	}

	div.wfManager.wfTab.expanded:not(.wfCollapsed)::after,
	div.wfManager.wfTab > div.header,
	div.wfManager.wfTab > div.body {
		left: 0 !important;
	}
}

@media (max-width: 825px) {
	div.wfManager.wfTab.expanded:not(.wfCollapsed)::after,
	div.wfManager.wfTab,
	div.wfManager.wfTab > div.header,
	div.wfManager.wfTab > div.body {
		width: calc(100% - 10px) !important;
	}

	div.wfManager.wfTab.expanded:not(.wfCollapsed)::after,
	div.wfManager.wfTab > div.body,
	div.wfManager.wfTab > div.header {
		left: 0 !important;
	}
}

@media (max-width: 768px) {
	div.wfManager.wfDetails {
		padding: 24px;
		height: calc(100% - 77px);
	}

	div.wfManager.wfDetails.approver > div.header > span.approver {
		position: relative;
		font-size: 16px;
		top: 0;
		right: 0;
		margin-top: 16px;
	}

	div.wfManager.wfDetails.running > div.approval > div.section.planning {
		border-right: none;
		border-top: 1px solid #D9DADD;
		border-bottom: 1px solid #D9DADD;
		padding: 16px 0;
		margin: 8px 0;
	}

	div.wfManager.wfDetails > div.approval {
		-ms-grid-columns: (1fr)[1];
			grid-template-columns: repeat(1, 1fr);
	}

	div.wfManager.wfDetails > div.approval > div.section {
		height: auto;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action {
		-webkit-box-flex: 0;
			-ms-flex: 0 1 100%;
				flex: 0 1 100%;
		padding: 0;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action > div.icon {
		background-size: 25px 25px !important;
		width: 25px;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action {
		display: none;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
			-ms-flex-direction: column;
				flex-direction: column;
		-webkit-box-align: center;
			-ms-flex-align: center;
				align-items: center;
		-webkit-box-pack: center;
			-ms-flex-pack: center;
				justify-content: center;
		padding: 16px 0;
		border-right: 2px solid #EAEAEB;
		height: 90px
	}

	div.wfManager.wfDetails > div.header > span.status {
		border: none !important;
		padding-bottom: 0;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action > span {
		margin-top: 0;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action.approve {
		color: #1477F8 !important;
	}

	div.section.actions div.icon {
		filter: none;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action.deny > div.icon {
		background-image: none;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action.deny > div.icon::before {
		content: "\e59b";
		font-size: 14px !important;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action.deny {
		color: #F03738 !important;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action.cancel {
		padding: 0 8px;
	}

	div.wfManager.wfDetails > div.log > div.section.actions > div.action.cancel > span {
		width: 100%;
		line-height: 12px;
	}

	div.wfManager.wfDetails > div.log > div.section.actions {
		background: #FFF;
		box-shadow: 0 -10px 10px rgba(0, 0, 0, .05);
		grid-gap: 0;
		position: fixed;
		left: 0;
		bottom: 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		width: 100%;
		z-index: 2;
		-webkit-box-pack: normal;
			-ms-flex-pack: normal;
				justify-content: normal;
	}
}

div.wfManager.wfTab.multi
{
	height: 420px;
}

div.wfManager.wfTab > div > div.bg
{
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

/*#region Header*/
div.wfManager.wfTab > div.header {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	border-radius: 12px 12px 0 0;
	color: #ffffff;
	cursor: pointer;
	position: relative;
	text-align: center;
	vertical-align: middle;
	height: 56px;
	width: 806px;
	left: 50%;
	-webkit-transform: translateX(-50%);
			transform: translateX(-50%);
	overflow: hidden;
	box-sizing: content-box;
	z-index: 1;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
}

div.wfManager.wfTab > div.header:hover::before {
	content: '';
	background-color: rgba(0, 0, 0, 0.05);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

div.wfManager.wfTab > div.header > div.icon {
	z-index: 1;
}

div.wfManager.wfTab > div.header > div.bg
{
	background-color: #8CC93F;
}

.backgroundOverlay {
	background-color: rgba(0, 0, 0, .7);
	-webkit-backdrop-filter: blur(5px);
			backdrop-filter: blur(5px);
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10000;
	-webkit-transition: all ease-in-out 0.5s;
	transition: all ease-in-out 0.5s;
	box-shadow: 0px -8px 16px rgba(0, 0, 0, 0.12);
	-webkit-animation: opacityIn 0.5s ease 1 normal forwards;
			animation: opacityIn 0.5s ease 1 normal forwards;
}

.backgroundOverlay.close {
	-webkit-animation: opacityOut 0.5s ease 1 normal forwards;
			animation: opacityOut 0.5s ease 1 normal forwards;
	pointer-events: none;
}

@-webkit-keyframes opacityIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes opacityIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-webkit-keyframes opacityOut {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		pointer-events: none;
	}
}

@keyframes opacityOut {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		pointer-events: none;
	}
}
/*#region Arrows*/
div.wfManager.wfTab > div.header > div.arrow {
	background-position: center center;
	background-repeat: no-repeat;
	width: 18px;
	position: absolute;
	right: 14px;
	-webkit-transition: opacity ease-in 0.2s;
	transition: opacity ease-in 0.2s;
	display: block;
	z-index: 2;
}

div.wfManager.wfDetails > div.log > div.section.actions > div.action.deny > div.icon::before,
div.wfManager.wfTab > div.header > div.arrow.collapse::before,
div.wfManager.wfTab > div.header > div.arrow.expand::before {
	font-family: "Font Awesome 6 Pro";
	font-size: 18px;
}

div.wfManager.wfTab > div.header > div.arrow.expand::before {
	content: '\f077';
}

div.wfManager.wfTab > div.header > div.arrow.collapse::before {
	content: '\f078';
}

div.wfManager.wfTab.expanded > div.header > div.arrow.collapse
{
	opacity: 1;
}
div.wfManager.wfTab.collapsed > div.header > div.arrow.collapse
{
	opacity: 0;
}

div.wfManager.wfTab.collapsed > div.header > div.arrow.expand
{
	opacity: 1;
}
div.wfManager.wfTab.expanded > div.header > div.arrow.expand
{
	opacity: 0;
}
/*#endregion Arrows*/
div.wfManager.wfTab > div.header > span {
	font-size: 20px;
	font-weight: 600;
	z-index: 1;
	width: 0;
	padding-left: 14px;
}
/*#endregion Header*/

/*#region Body*/
div.wfManager.wfTab > div.body {
	display: inline-block;
	position: absolute;
	width: 806px;
	height: 550px;
	box-sizing: content-box;
	left: 50%;
	transform: translateX(-50%);
	color: #41454D;
}

div.wfManager.wfTab > div.body > div.content {
	height: 100%;
	padding: 14px;
	display: flex;
}

div.wfDetails:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1;
	-webkit-animation: opacityOut 0.5s ease 0.6s 1 normal forwards;
			animation: opacityOut 0.5s ease 0.6s 1 normal forwards;
}

div.wfManager.wfTab > div.body > div.bg {
	background-color: #FAFAFA;
}

div.wfManager.wfTab > div.body > div.nav
{
	height: 20px;
	position: absolute;
	right: 2px;
	bottom: 0px;
	padding-right: 5px;
}

div.wfManager.wfTab > div.body > div.nav > div
{
	display: inline-block;
	margin-left: 10px;
	height: 100%;
	vertical-align: middle;
}

div.wfManager.wfTab > div.body > div.nav > div.button
{
	cursor: pointer;
}
/*#endregion Body*/

/*#endregion Tab*/

.wfCollapsed,
.expanded {
	-webkit-transition: .5s ease-in-out all !important;
	transition: .5s ease-in-out all !important;
}

div.wfManager.wfTab.expanded.expanded:not(.wfCollapsed),
.expanded:not(.wfCollapsed) .body {
	height: 0 !important;
}

.expanded:not(.wfCollapsed) .body {
	position: absolute;
	top: -90px;
	z-index: 1;
	height: 56px !important;
}

.expanded:not(.wfCollapsed) div.body > div.bg {
	background-color: transparent !important;
}

.expanded div.body:not(div.wfManager.wfTab.expanded.expanded.wfCollapsed div.body) {
	width: 530px !important;
}

.expanded:not(.wfCollapsed) .wfDetails .log .content,
.expanded:not(.wfCollapsed) .wfDetails .log .title,
.expanded:not(.wfCollapsed) .wfDetails .approval,
.expanded:not(.wfCollapsed) .wfDetails .header .step,
.expanded:not(.wfCollapsed) .wfDetails .header .status,
.expanded:not(.wfCollapsed) .wfDetails .header .approver {
	display: none !important;
}

.expanded:not(.wfCollapsed) .wfDetails .title {
	pointer-events: all !important;
	position: absolute;
	bottom: -52px;
	left: -103px;
	color: #FFFFFF !important;
	font-weight: 400 !important;
	font-size: 14px !important;
}

.expanded.wfManager.wfTab:not(.wfCollapsed) .wfIcon:before {
	position: absolute !important;
	top: 50% !important;
	left: 18px !important;
	-webkit-transform: translateY(-50%) !important;
			transform: translateY(-50%) !important;
}

.expanded.wfManager.wfTab:not(.wfCollapsed) .wfIcon {
	margin-top: -14px;
	margin-left: 35px;
}

.expanded:not(.wfCollapsed) div.wfManager.wfDetails > div.log .action span {
	white-space: nowrap;
	max-width: 8px;
	margin-top: 0 !important;
	padding-left: 8px;
	text-align: left;
	-webkit-transition: .2s ease-in-out all;
	transition: .2s ease-in-out all;
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	line-height: 16px;
	color: #FFFFFF;
}

.expanded:not(.wfCollapsed) div.wfManager.wfDetails > div.log .action:hover span {
	max-width: 95px;
	white-space: initial;
	-webkit-animation: fadeIn .2s forwards;
	animation: fadeIn .2s forwards;
	-webkit-animation-delay: .2s;
			animation-delay: .2s;
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.expanded:not(.wfCollapsed) div.wfManager.wfDetails > div.log,
.expanded:not(.wfCollapsed) .bg,
.expanded:not(.wfCollapsed) .content,
.expanded:not(.wfCollapsed) .body {
	pointer-events: none;
}

.expanded:not(.wfCollapsed) div.wfManager.wfDetails > div.log {
	height: 56px;
}

.expanded:not(.wfCollapsed) div.wfManager.wfTab > div.body {
	overflow: initial !important;
}

.expanded:not(.wfCollapsed) div.wfManager.wfTab > div.body > div.content {
	padding: 0 !important;
	height: auto !important;
}

.expanded:not(.wfCollapsed) div.wfManager.wfDetails {
	overflow: initial !important;
}

.expanded:not(.wfCollapsed) div.wfManager.wfDetails > div.log > div.section.actions > div.action {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	padding: 0 !important;
	-webkit-box-pack: center;
		-ms-flex-pack: center;
			justify-content: center;
	overflow: hidden;
}

.expanded:not(.wfCollapsed) div.wfManager.wfDetails > div.log > div.section.actions,
.expanded:not(.wfCollapsed) .arrow.collapse {
	background-color: rgba(0, 0, 0, 0.4);
}

.expanded:not(.wfCollapsed) div.wfManager.wfDetails > div.log > div.section.actions {
	margin-top: 20px;
	height: 52px;
	-webkit-box-pack: end;
		-ms-flex-pack: end;
			justify-content: flex-end;
	position: absolute;
	right: -115px;
	top: 4px;
	pointer-events: all;
	padding: 8px 8px 8px 13px;
	border-radius: 8px 0 0 0;
}

.expanded:not(.wfCollapsed) div.section.actions div.icon {
	-webkit-filter: none !important;
			filter: none !important;
}

.expanded:not(.wfCollapsed) .arrow.collapse {
	-webkit-transform: rotate(180deg);
			transform: rotate(180deg);
	height: 52px;
	display: -webkit-box !important;
	display: -ms-flexbox !important;
	display: flex !important;
	-webkit-box-align: center !important;
		-ms-flex-align: center !important;
			align-items: center !important;
	width: 33px !important;
	-webkit-box-pack: end !important;
		-ms-flex-pack: end !important;
			justify-content: end !important;
	right: 4px !important;
	border-radius: 0 0 0 8px;
	top: 4px;
}

.expanded:not(.wfCollapsed) .arrow.collapse:before {
	font-weight: 600;
	color: #FFFFFF;
}

.expanded:not(.wfCollapsed) .action .icon {
	height: 32px !important;
	width: 32px !important;
}

div.wfManager.wfTab.expanded:not(.wfCollapsed):after {
	content: '';
	background: #FAFAFA;
	position: absolute !important;
	top: 0 !important;
	width: 806px;
	height: 1000px !important;
	z-index: 10000000 !important;
	left: 50%;
	-webkit-transform: translateX(-50%) !important;
			transform: translateX(-50%) !important;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	pointer-events: none;
}

@keyframes fadeIn {
	0% {
		opacity: 0;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	}

	100% {
		opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	}
}

@media (max-width: 825px) {
	div.wfManager.wfDetails > div.header > span.title,
	.expanded:not(.wfCollapsed) .section.actions {
		display: none !important;
	}

	.expanded:not(.wfCollapsed) .arrow.collapse {
		background-color: transparent !important;
	}

	.expanded.wfManager.wfTab:not(.wfCollapsed) .wfIcon {
		margin-top: 0;
	}
}

/*#endregion Workflow*/