/* Light Mode */
body.dlan-body
{
	/*#region General */
	--body-back-color-top: var(--dlan-blue-grey);
	--body-back-color-bottom: var(--dlan-blue-mid);
	--body-container-back-color: var(--dlan-white);
	--text-color: var(--dlan-black);
	--border-color: var(--dlan-black);
	--border-color-alt: var(--dlan-blue-mid);
	--button-color: var(--dlan-white);
	--button-back-color: var(--dlan-blue-mid);
	--button-border-color: var(--dlan-blue-mid);
	--scroll-thumb-color: var(--dlan-blue-mid);
	--title-color: var(--dlan-blue-mid);
	--error-message-color: var(--dlan-red);
	--general-anchor-color: var(--dlan-blue-bright);
	--general-anchor-hover-color: var(--dlan-blue-dark);
	/*#endregion*/

	/*#region Inputs */
	--inputs-container-back-color: var(--dlan-white);
	--inputs-back-color: var(--dlan-white);
	--input-border-color: var(--dlan-grey-kinda-dark);
	--input-label-color: var(--dlan-grey-kinda-dark);
	--input-active-border-color: var(--dlan-blue-bright);
	--input-active-label-color: var(--dlan-blue-bright);
	--input-text-color: var(--dlan-black);
	/*#endregion*/
}

/* Dark Mode */
@media (prefers-color-scheme: dark), (prefers-dark-interface)
{
	body.dlan-body:not(.light-mode)
	{
		/*#region General */
		--body-back-color-top: var(--dlan-grey-very-dark);
		--body-back-color-bottom: var(--dlan-black);
		--body-container-back-color: var(--dlan-grey-dark);
		--text-color: var(--dlan-grey);
		--border-color: var(--dlan-black);
		--border-color-alt: var(--dlan-cop-purple);
		--button-color: var(--dlan-white);
		--button-back-color: var(--dlan-black);
		--button-border-color: var(--dlan-black);
		--scroll-thumb-color: var(--dlan-cop-purple);
		--title-color: var(--dlan-cop-purple);
		--error-message-color: var(--dlan-red);
		--general-anchor-color: var(--dlan-grey-kinda-dark);
		--general-anchor-hover-color: var(--dlan-grey-light);
		/*#endregion*/
		/*#region Inputs */
		--inputs-container-back-color: var(--dlan-grey-dark);
		--inputs-back-color: var(--dlan-grey-dark);
		--input-border-color: var(--dlan-grey-kinda-dark);
		--input-label-color: var(--dlan-grey-kinda-dark);
		--input-active-border-color: var(--dlan-cop-purple);
		--input-active-label-color: var(--dlan-cop-purple);
		--input-text-color: var(--dlan-white);
		/*#endregion*/
	}
}

body.dlan-body.dark-mode
{
	/*#region General */
	--body-back-color-top: var(--dlan-grey-very-dark);
	--body-back-color-bottom: var(--dlan-black);
	--body-container-back-color: var(--dlan-grey-dark);
	--text-color: var(--dlan-grey);
	--border-color: var(--dlan-black);
	--border-color-alt: var(--dlan-cop-purple);
	--button-color: var(--dlan-white);
	--button-back-color: var(--dlan-black);
	--button-border-color: var(--dlan-black);
	--scroll-thumb-color: var(--dlan-cop-purple);
	--title-color: var(--dlan-cop-purple);
	--error-message-color: var(--dlan-red);
	--general-anchor-color: var(--dlan-grey-kinda-dark);
	--general-anchor-hover-color: var(--dlan-grey-light);
	/*#endregion*/
	/*#region Inputs */
	--inputs-container-back-color: var(--dlan-grey-dark);
	--inputs-back-color: var(--dlan-grey-dark);
	--input-border-color: var(--dlan-grey-kinda-dark);
	--input-label-color: var(--dlan-grey-kinda-dark);
	--input-active-border-color: var(--dlan-cop-purple);
	--input-active-label-color: var(--dlan-cop-purple);
	--input-text-color: var(--dlan-white);
	/*#endregion*/
}