/* *********************************************************************************************************************************************************************** */
/* SECTION ( 6 / 8 ) APPROVAL FLOW DESIGN																																   */
/* *********************************************************************************************************************************************************************** */

.cl_approval_flg {
  color: var(--color-text) !important;
}

.cl_approval_flg:disabled {
  color: var(--color-text) !important;
}

.form_header_approval_status {
  vertical-align: bottom;
  width: var(--approval-flow-width);
}

.approval_status_container {
  display: inline-block;
  white-space: nowrap;
}

@media (max-width: 605px) {
  .approval_status_container {
	margin-left: 0px;
  }
}

@media (max-width: 580px) {
  .approval_status_container {
	margin-top: 25px;
  }
}

/* Prevents elements inside container from being dragged */
.approval_status_container > * {
  -webkit-user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

/* Prevents elements inside container from moving to new line */
.approval_flow_container {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  white-space: nowrap !important;
}

@media (max-width: 680px) {
  .approval_flow_container {
	display: inline !important;
	white-space: normal !important;
  }
}

/* =========== Approval Status ========== */
.approval_status_tag{
  margin: auto;
  padding: 0px var(--font-base);
  text-align: center;
  margin-left: inherit;
  border-radius: var(--approval-icon-height);
  height: var(--approval-icon-height);
  display: flex;
  justify-content: center;
  align-items: center;
}
.approval_unproccessed{
  background:var(--color-approval-unprocessed-background);
  color: var(--color-approval-unprocessed-text);
}
.approval_approving{
  background:var(--color-approval-approving-background);
  color: var(--color-approval-approving-text);
}
.approval_approved{
  background:var(--color-approval-approved-background);
  color: var(--color-approval-approved-text);
}
.approval_include_denials,
.approval_denied{
  background:var(--color-approval-denied-background);
  color: var(--color-approval-denied-text);
}
.approval_withdrawal,
.approval_deleted{
  background:var(--color-approval-withdrawal-background);
  color: var(--color-approval-withdrawal-text);
}

.approval_noapprovalrequired{
  background:var(--color-approval-noapprovalrequired-background);
  color: var(--color-approval-noapprovalrequired-text);
}