/*
Style Colors
Version: 2.1
Theme_URI: https://www.lemon.nl
Date: 05/2025
Author: Roeland ten Holder | Lemon
Author URI: roeland@lemon.nl
*/

/** ******************************** **/
/**      _____                       **/
/**    _(  _  )__________________    **/
/**   ( | (___)     | ____ |  _  |   **/
/**   |_|_______|_|_|______|_| |_|   **/
/**                                  **/
/**            www.lemon.nl          **/
/**                                  **/
/** ******************************** **/

/*************** COLORS ***************/

:root {
	--lightpurple: 			#e1e6fb;
	--purple: 				#c5b6f1;
	--darkpurple: 			#8c76c9;
	--lightgreen: 			#00d37f;
	--darkgreen: 			#014751;
	--lightpurple-hover: 	#c9d1f3;
	--purple-hover: 		#ae9de1;
	--darkpurple-hover: 	#7a64b9;
	--lightgreen-hover: 	#02bd73;
	--darkgreen-hover: 		#00272c;
	--white: 				#ffffff;
	--grey-light: 			#c8c8c8;
	--grey: 				#787878;
	--black: 				#003237;


	--submenu: 				#f9faff;
}


.lightpurple { color: var(--lightpurple); }
.purple { color: var(--purple); }
.darkpurple { color: var(--darkpurple); }
.lightgreen { color: var(--lightgreen); }
.darkgreen { color: var(--darkgreen); }
.lightpurple-hover { color: var(--lightpurple-hover); }
.purple-hover { color: var(--purple-hover); }
.darkpurple-hover { color: var(--darkpurple-hover); }
.lightgreen-hover { color: var(--lightgreen-hover); }
.darkgreen-hover { color: var(--darkgreen-hover); }
.white { color: var(--white); }
.grey-light { color: var(--grey-light); }
.grey { color: var(--grey); }
.black { color: var(--black); }


.border-lightpurple { border-color: var(--lightpurple); }
.border-purple { border-color: var(--purple); }
.border-darkpurple { border-color: var(--darkpurple); }
.border-lightgreen { border-color: var(--lightgreen); }
.border-darkgreen { border-color: var(--darkgreen); }
.border-lightpurple-hover { border-color: var(--lightpurple-hover); }
.border-purple-hover { border-color: var(--purple-hover); }
.border-darkpurple-hover { border-color: var(--darkpurple-hover); }
.border-lightgreen-hover { border-color: var(--lightgreen-hover); }
.border-darkgreen-hover { border-color: var(--darkgreen-hover); }
.border-white { border-color: var(--white); }
.border-grey-light { border-color: var(--grey-light); }
.border-grey { border-color: var(--grey); }
.border-black { border-color: var(--black); }


.card-header .card-header { background-color: unset; }
.border-lightpurple .card-header { background-color: var(--lightpurple); }
.border-purple .card-header { background-color: var(--purple); }
.border-darkpurple .card-header { background-color: var(--darkpurple); }
.border-lightgreen .card-header { background-color: var(--lightgreen); }
.border-darkgreen .card-header { background-color: var(--darkgreen); }
.border-lightpurple-hover .card-header { background-color: var(--lightpurple-hover); }
.border-purple-hover .card-header { background-color: var(--purple-hover); }
.border-darkpurple-hover .card-header { background-color: var(--darkpurple-hover); }
.border-lightgreen-hover .card-header { background-color: var(--lightgreen-hover); }
.border-darkgreen-hover .card-header { background-color: var(--darkgreen-hover); }
.border-white .card-header { background-color: var(--white); }
.border-grey-light .card-header { background-color: var(--grey-light); }
.border-grey .card-header { background-color: var(--grey); }
.border-black .card-header { background-color: var(--black); }


.bg-lightpurple { background-color: var(--lightpurple); }
.bg-purple { background-color: var(--purple); }
.bg-darkpurple { background-color: var(--darkpurple); }
.bg-lightgreen { background-color: var(--lightgreen); }
.bg-darkgreen { background-color: var(--darkgreen); }
.bg-lightpurple-hover { background-color: var(--lightpurple-hover); }
.bg-purple-hover { background-color: var(--purple-hover); }
.bg-darkpurple-hover { background-color: var(--darkpurple-hover); }
.bg-lightgreen-hover { background-color: var(--lightgreen-hover); }
.bg-darkgreen-hover { background-color: var(--darkgreen-hover); }
.bg-white { background-color: var(--white); }
.bg-grey-light { background-color: var(--grey-light); }
.bg-grey { background-color: var(--grey); }
.bg-black { background-color: var(--black); }


.btn-lightpurple { background-color: var(--lightpurple); }
.btn-purple { background-color: var(--purple); }
.btn-darkpurple { background-color: var(--darkpurple); }
.btn-lightgreen { background-color: var(--lightgreen); }
.btn-darkgreen { background-color: var(--darkgreen); }
.btn-lightpurple-hover { background-color: var(--lightpurple-hover); }
.btn-lightpurple:hover { background-color: var(--lightpurple-hover); }
.btn-purple-hover { background-color: var(--purple-hover); }
.btn-purple:hover { background-color: var(--purple-hover); }
.btn-darkpurple-hover { background-color: var(--darkpurple-hover); }
.btn-darkpurple:hover { background-color: var(--darkpurple-hover); }
.btn-lightgreen-hover { background-color: var(--lightgreen-hover); }
.btn-lightgreen:hover { background-color: var(--lightgreen-hover); }
.btn-darkgreen-hover { background-color: var(--darkgreen-hover); }
.btn-darkgreen:hover { background-color: var(--darkgreen-hover); }
.btn-white { background-color: var(--white); }
.btn-grey-light { background-color: var(--grey-light); }
.btn-grey { background-color: var(--grey); }
.btn-black { background-color: var(--black); }


/* .content { color: unset; } */

.content a:not(.btn) { color: var(--black); }
.link, .content a:not(.btn):hover { color: var(--black); }

/* .btn-purple, .bg-purple h1, .bg-purple h2, .bg-purple h3, .bg-purple h4, .bg-purple h5, .bg-purple h6, .bg-purple p, .bg-purple td, .bg-purple, .bg-purple a, .bg-purple a:hover, */
.btn-darkpurple, .bg-darkpurple h1, .bg-darkpurple h2, .bg-darkpurple h3, .bg-darkpurple h4, .bg-darkpurple h5, .bg-darkpurple h6, .bg-darkpurple p, .bg-darkpurple td, .bg-darkpurple, .bg-darkpurple a, .bg-darkpurple a:hover,
.btn-darkgreen, .bg-darkgreen h1, .bg-darkgreen h2, .bg-darkgreen h3, .bg-darkgreen h4, .bg-darkgreen h5, .bg-darkgreen h6, .bg-darkgreen p, .bg-darkgreen td, .bg-darkgreen, .bg-darkgreen a, .bg-darkgreen a:hover,
/* .btn-purple:hover, .btn-purple-hover, .bg-purple-hover h1, .bg-purple-hover h2, .bg-purple-hover h3, .bg-purple-hover h4, .bg-purple-hover h5, .bg-purple-hover h6, .bg-purple-hover p, .bg-purple-hover td, .bg-purple-hover, .bg-purple-hover a, .bg-purple-hover a:hover, */
.btn-darkpurple:hover, .btn-darkpurple-hover, .bg-darkpurple-hover h1, .bg-darkpurple-hover h2, .bg-darkpurple-hover h3, .bg-darkpurple-hover h4, .bg-darkpurple-hover h5, .bg-darkpurple-hover h6, .bg-darkpurple-hover p, .bg-darkpurple-hover td, .bg-darkpurple-hover, .bg-darkpurple-hover a, .bg-darkpurple-hover a:hover,
.btn-darkgreen:hover, .btn-darkgreen-hover, .bg-darkgreen-hover h1, .bg-darkgreen-hover h2, .bg-darkgreen-hover h3, .bg-darkgreen-hover h4, .bg-darkgreen-hover h5, .bg-darkgreen-hover h6, .bg-darkgreen-hover p, .bg-darkgreen-hover td, .bg-darkgreen-hover, .bg-darkgreen-hover a, .bg-darkgreen-hover a:hover,
.btn-black, .bg-black h1, .bg-black h2, .bg-black h3, .bg-black h4, .bg-black h5, .bg-black h6, .bg-black p, .bg-black td, .bg-black, .bg-black a, .bg-black a:hover,
.bg-dark { color: var(--white); }
