:root {
	/* View button */
	--view-icon-color: #0EA5E9;
	--view-icon-hover: #0284C7;
	--view-icon-disabled: #e0f2fe;
	--edit-icon-color: #14B8A6;
	--edit-icon-hover: #0D9488;
	--edit-icon-disabled: #ccfbf1;
	--add-icon-color: #10B981;
	--add-icon-hover: #059669;
	--add-icon-disabled: #ccfbf1;
	--delete-icon-color: #EF4444;
	--delete-icon-hover: #DC2626;
	--delete-icon-disabled: #ffd9d4;
	--leave-icon-color: #F97316;
	--leave-icon-hover: #EA580C;
	--leave-icon-disabled: #ffd9d4;
	--report-icon-color: #0aa859;
	--report-icon-hover: #0d7340;
	--report-icon-disabled: #999e9c;
}

/* ================================
   VIEW ICON BUTTON
   ================================ */
/* NORMAL rectangle + icon */
.icon-btn-view.mud-icon-button {
	border-color: var(--view-icon-color) !important;
	background-color: transparent !important;
}

	.icon-btn-view.mud-icon-button .mud-icon-root,
	.icon-btn-view.mud-icon-button .mud-svg-icon {
		color: var(--view-icon-color) !important;
	}

	/* HOVER (when not disabled) */
	.icon-btn-view.mud-icon-button:hover:not(:disabled) {
		border-color: var(--view-icon-hover) !important;
		background-color: rgba(2, 132, 199, 0.12) !important;
	}

		.icon-btn-view.mud-icon-button:hover:not(:disabled) .mud-icon-root,
		.icon-btn-view.mud-icon-button:hover:not(:disabled) .mud-svg-icon {
			color: var(--view-icon-hover) !important;
		}

	/* DISABLED */
	.icon-btn-view.mud-icon-button:disabled {
		border-color: var(--view-icon-disabled) !important;
		background-color: rgba(224, 242, 254, 0.5) !important;
	}

		.icon-btn-view.mud-icon-button:disabled .mud-icon-root,
		.icon-btn-view.mud-icon-button:disabled .mud-svg-icon {
			color: var(--view-icon-disabled) !important;
		}



/* ================================
   EDIT ICON BUTTON
   ================================ */
/* NORMAL rectangle + icon */
.icon-btn-edit.mud-icon-button {
	border-color: var(--edit-icon-color) !important;
	background-color: transparent !important;
}

	.icon-btn-edit.mud-icon-button .mud-icon-root,
	.icon-btn-edit.mud-icon-button .mud-svg-icon {
		color: var(--edit-icon-color) !important;
	}

	/* HOVER (when not disabled) */
	.icon-btn-edit.mud-icon-button:hover:not(:disabled) {
		border-color: var(--edit-icon-hover) !important;
		background-color: rgba(2, 132, 199, 0.12) !important;
	}

		.icon-btn-edit.mud-icon-button:hover:not(:disabled) .mud-icon-root,
		.icon-btn-edit.mud-icon-button:hover:not(:disabled) .mud-svg-icon {
			color: var(--edit-icon-hover) !important;
		}

	/* DISABLED */
	.icon-btn-edit.mud-icon-button:disabled {
		border-color: var(--edit-icon-disabled) !important;
		background-color: rgba(224, 242, 254, 0.5) !important;
	}

		.icon-btn-edit.mud-icon-button:disabled .mud-icon-root,
		.icon-btn-edit.mud-icon-button:disabled .mud-svg-icon {
			color: var(--edit-icon-disabled) !important;
		}


/* ================================
   ADD ICON BUTTON
   ================================ */
/* NORMAL rectangle + icon */
.icon-btn-add.mud-icon-button {
	border-color: var(--add-icon-color) !important;
	background-color: transparent !important;
}

	.icon-btn-add.mud-icon-button .mud-icon-root,
	.icon-btn-add.mud-icon-button .mud-svg-icon {
		color: var(--add-icon-color) !important;
	}

	/* HOVER (when not disabled) */
	.icon-btn-add.mud-icon-button:hover:not(:disabled) {
		border-color: var(--add-icon-hover) !important;
		background-color: rgba(2, 132, 199, 0.12) !important;
	}

		.icon-btn-add.mud-icon-button:hover:not(:disabled) .mud-icon-root,
		.icon-btn-add.mud-icon-button:hover:not(:disabled) .mud-svg-icon {
			color: var(--add-icon-hover) !important;
		}

	/* DISABLED */
	.icon-btn-add.mud-icon-button:disabled {
		border-color: var(--add-icon-disabled) !important;
		background-color: rgba(224, 242, 254, 0.5) !important;
	}

		.icon-btn-add.mud-icon-button:disabled .mud-icon-root,
		.icon-btn-add.mud-icon-button:disabled .mud-svg-icon {
			color: var(--add-icon-disabled) !important;
		}

/* ================================
   DELETE ICON BUTTON
   ================================ */
/* NORMAL rectangle + icon */
.icon-btn-delete.mud-icon-button {
	border-color: var(--delete-icon-color) !important;
	background-color: transparent !important;
}

	.icon-btn-delete.mud-icon-button .mud-icon-root,
	.icon-btn-delete.mud-icon-button .mud-svg-icon {
		color: var(--delete-icon-color) !important;
	}

	/* HOVER (when not disabled) */
	.icon-btn-delete.mud-icon-button:hover:not(:disabled) {
		border-color: var(--delete-icon-hover) !important;
		background-color: rgba(2, 132, 199, 0.12) !important;
	}

		.icon-btn-delete.mud-icon-button:hover:not(:disabled) .mud-icon-root,
		.icon-btn-delete.mud-icon-button:hover:not(:disabled) .mud-svg-icon {
			color: var(--delete-icon-hover) !important;
		}

	/* DISABLED */
	.icon-btn-delete.mud-icon-button:disabled {
		border-color: var(--delete-icon-disabled) !important;
		background-color: rgba(224, 242, 254, 0.5) !important;
	}

		.icon-btn-delete.mud-icon-button:disabled .mud-icon-root,
		.icon-btn-delete.mud-icon-button:disabled .mud-svg-icon {
			color: var(--delete-icon-disabled) !important;
		}


/* ================================
   LEAVE ICON BUTTON
   ================================ */
/* NORMAL rectangle + icon */
.icon-btn-leave.mud-icon-button {
	border-color: var(--leave-icon-color) !important;
	background-color: transparent !important;
}

	.icon-btn-leave.mud-icon-button .mud-icon-root,
	.icon-btn-leave.mud-icon-button .mud-svg-icon {
		color: var(--leave-icon-color) !important;
	}

	/* HOVER (when not disabled) */
	.icon-btn-leave.mud-icon-button:hover:not(:disabled) {
		border-color: var(--leave-icon-hover) !important;
		background-color: rgba(2, 132, 199, 0.12) !important;
	}

		.icon-btn-leave.mud-icon-button:hover:not(:disabled) .mud-icon-root,
		.icon-btn-leave.mud-icon-button:hover:not(:disabled) .mud-svg-icon {
			color: var(--leave-icon-hover) !important;
		}

	/* DISABLED */
	.icon-btn-leave.mud-icon-button:disabled {
		border-color: var(--leave-icon-disabled) !important;
		background-color: rgba(224, 242, 254, 0.5) !important;
	}

		.icon-btn-leave.mud-icon-button:disabled .mud-icon-root,
		.icon-btn-leave.mud-icon-button:disabled .mud-svg-icon {
			color: var(--leave-icon-disabled) !important;
		}


/* ================================
   REPORT ICON BUTTON
   ================================ */
/* NORMAL rectangle + icon */
.icon-btn-report.mud-icon-button {
	border-color: var(--report-icon-color) !important;
	background-color: transparent !important;
}

	.icon-btn-report.mud-icon-button .mud-icon-root,
	.icon-btn-report.mud-icon-button .mud-svg-icon {
		color: var(--report-icon-color) !important;
	}

	/* HOVER (when not disabled) */
	.icon-btn-report.mud-icon-button:hover:not(:disabled) {
		border-color: var(--report-icon-hover) !important;
		background-color: rgba(2, 132, 199, 0.12) !important;
	}

		.icon-btn-report.mud-icon-button:hover:not(:disabled) .mud-icon-root,
		.icon-btn-report.mud-icon-button:hover:not(:disabled) .mud-svg-icon {
			color: var(--report-icon-hover) !important;
		}

	/* DISABLED */
	.icon-btn-report.mud-icon-button:disabled {
		border-color: var(--report-icon-disabled) !important;
		background-color: rgba(224, 242, 254, 0.5) !important;
	}

		.icon-btn-report.mud-icon-button:disabled .mud-icon-root,
		.icon-btn-report.mud-icon-button:disabled .mud-svg-icon {
			color: var(--report-icon-disabled) !important;
		}