/* --------------------------------------
$Author: ThemeMascot
$URL: https://themeforest.net/user/ThemeMascot

----------------------------------------- */
$total-theme-colors: 4;

$theme-color1: #4f3dff;
$theme-color2: #003a66;
$theme-color3: #ff6e2f;
$theme-color4: #87C03D;

@function hexToRGB($hex) {
  @return red($hex), green($hex), blue($hex);
}

// text color over theme color bg
$text-color-over-bg-theme-color1: #fff;
$text-color-over-bg-theme-color2: #fff;
$text-color-over-bg-theme-color3: #fff;
$text-color-over-bg-theme-color4: #fff;


//lighter darker
$theme-color1-lighter: lighten($theme-color1, 11%);
$theme-color1-darker: darken($theme-color1, 11%);
$theme-color2-lighter: lighten($theme-color2, 11%);
$theme-color2-darker: darken($theme-color2, 11%);
$theme-color3-lighter: lighten($theme-color3, 11%);
$theme-color3-darker: darken($theme-color3, 11%);
$theme-color4-lighter: lighten($theme-color4, 11%);
$theme-color4-darker: darken($theme-color4, 11%);

:root{
	--theme-color1: #{$theme-color1};
	--theme-color1-rgb: #{hexToRGB($theme-color1)};
	--theme-color1-lighter: #{$theme-color1-lighter};
	--theme-color1-darker: #{$theme-color1-darker};
	--theme-color2: #{$theme-color2};
	--theme-color2-rgb: #{hexToRGB($theme-color2)};
	--theme-color2-lighter: #{$theme-color2-lighter};
	--theme-color2-darker: #{$theme-color2-darker};
	--theme-color3: #{$theme-color3};
	--theme-color3-rgb: #{hexToRGB($theme-color3)};
	--theme-color3-lighter: #{$theme-color3-lighter};
	--theme-color3-darker: #{$theme-color3-darker};
	--theme-color4: #{$theme-color4};
	--theme-color4-rgb: #{hexToRGB($theme-color4)};
	--theme-color4-lighter: #{$theme-color4-lighter};
	--theme-color4-darker: #{$theme-color4-darker};

	--text-color-bg-theme-color1: #{$text-color-over-bg-theme-color1};
	--text-color-bg-theme-color2: #{$text-color-over-bg-theme-color2};
	--text-color-bg-theme-color3: #{$text-color-over-bg-theme-color3};
	--text-color-bg-theme-color4: #{$text-color-over-bg-theme-color4};

	--hover-theme-color: #{$theme-color1};
	--sidebar-default-theme-color: var(--theme-color1);
	--footer-default-theme-color: var(--theme-color3);
	--footer-default-hover-theme-color: var(--theme-color3);
	--footer-default-text-color-on-bg-theme-color: var(--text-color-bg-theme-color3);
}
@import "parts/loader";