@use 'iro-sass/src/props';

@use 'core';

$vlpnBg: props.def(--vlpnBg, props.get(core.$theme, --base, --75));

$vlpnLink: props.def(--vlpnLink, props.get(core.$theme, --red, --1000));
$vlpnLinkUnderline: props.def(--vlpnLinkUnderline, props.get(core.$theme, --red, --400));
$vlpnLinkFg: props.def(--vlpnLinkFg, props.get(core.$theme, --red, --1000-text));
$vlpnLinkActive: props.def(--vlpnLinkActive, props.get(core.$theme, --red, --1300));
$vlpnLinkActiveFg: props.def(--vlpnLinkActiveFg, props.get(core.$theme, --red, --1300-text));

$vlpnSmileySize: props.def(--vlpnSmileySize, 28px);

$wcfFontSizeHeadline: props.def(--wcfFontSizeHeadline, 16px);

$wcfHeaderBackground: props.def(--wcfHeaderBackground, props.get(core.$theme, --base, --700));
$wcfHeaderMenuBackground: props.def(--wcfHeaderMenuBackground, props.get(core.$theme, --base, --800));
$wcfHeaderMenuLinkBackground: props.def(--wcfHeaderMenuLinkBackground, props.get(core.$theme, --base, --800));
$wcfHeaderMenuLinkBackgroundActive: props.def(--wcfHeaderMenuLinkBackgroundActive, props.get(core.$theme, --base, --700));
$wcfHeaderMenuDropdownBackground: props.def(--wcfHeaderMenuDropdownBackground, props.get(core.$theme, --base, --800));
$wcfHeaderMenuDropdownBorder: props.def(--wcfHeaderMenuDropdownBorder, props.get(core.$theme, --base, --800));
$wcfHeaderMenuDropdownBackgroundActive: props.def(--wcfHeaderMenuDropdownBackgroundActive, props.get(core.$theme, --base, --700));

$wcfNavigationBackground: props.def(--wcfNavigationBackground, props.get(core.$theme, --base, --100));
$wcfNavigationText: props.def(--wcfNavigationText, props.get(core.$theme, --base, --500));
$wcfNavigationLink: props.def(--wcfNavigationLink, props.get(core.$theme, --base, --800));
$wcfNavigationLinkActive: props.def(--wcfNavigationLinkActive, props.get(core.$theme, --base, --800));

$wcfContentBackground: props.def(--wcfContentBackground, rgb(242, 242, 242));
$wcfContentBorder: props.def(--wcfContentBorder, var(--wcfContentBorderInner));
$wcfContentDimmedText: props.def(--wcfContentDimmedText, rgba(0, 0, 0, .6));
$wcfContentDimmedLink: props.def(--wcfContentDimmedLink, rgba(0, 0, 0, .6));

$wcfFooterBoxBackground: props.def(--wcfFooterBoxBackground, props.get(core.$theme, --base, --100));
$wcfFooterBoxText: props.def(--wcfFooterBoxText, props.get(core.$theme, --base, --800));
$wcfFooterBoxHeadlineText: props.def(--wcfFooterBoxText, props.get(core.$theme, --base, --900));

$wcfFooterBackground: props.def(--wcfFooterBackground, props.get(core.$theme, --base, --700));
$wcfFooterText: props.def(--wcfFooterText, props.get(core.$theme, --base, --100));
$wcfFooterLink: props.def(--wcfFooterLink, props.get(core.$theme, --base, --75));
$wcfFooterLinkActive: props.def(--wcfFooterLinkActive, props.get(core.$theme, --base, --75));

$wcfFooterCopyrightBackground: props.def(--wcfFooterCopyrightBackground, props.get(core.$theme, --base, --800));
$wcfFooterCopyrightText: props.def(--wcfFooterCopyrightText, props.get(core.$theme, --base, --75));
$wcfFooterCopyrightLink: props.def(--wcfFooterCopyrightLink, props.get(core.$theme, --base, --50));
$wcfFooterCopyrightLinkActive: props.def(--wcfFooterCopyrightLinkActive, props.get(core.$theme, --base, --50));

$wcfSidebarBackground: props.def(--wcfSidebarBackground, $wcfContentBackground);
$wcfSidebarDimmedText: props.def(--wcfSidebarDimmedText, props.get($wcfContentDimmedText));

$wcfButtonBackground: props.def(--wcfButtonBackground, props.get(core.$theme, --base, --100));
$wcfButtonText: props.def(--wcfButtonText, props.get(core.$theme, --base, --100-text));
$wcfButtonBackgroundActive: props.def(--wcfButtonBackgroundActive, props.get(core.$theme, --base, --500));
$wcfButtonTextActive: props.def(--wcfButtonTextActive, props.get(core.$theme, --base, --500-text));

$wcfButtonPrimaryBackground: props.def(--wcfButtonPrimaryBackground, props.get(core.$theme, --red, --800));
$wcfButtonPrimaryText: props.def(--wcfButtonTextBackground, props.get(core.$theme, --red, --800-text));
$wcfButtonPrimaryBackgroundActive: props.def(--wcfButtonPrimaryBackgroundActive, props.get(core.$theme, --red, --1200));
$wcfButtonPrimaryTextActive: props.def(--wcfButtonTextBackgroundActive, props.get(core.$theme, --red, --1200-text));

$wcfBoxShadowCard: props.def(--wcfBoxShadowCard, none);

$wcfContentContainerBorder: props.def(--wcfContentContainerBorder, var(--wcfContentContainerBackground));

$wcfContentLink: props.def(--wcfContentLink, props.get($vlpnLink));
$wcfContentLinkActive: props.def(--wcfContentLinkActive, props.get($vlpnLinkActive));

$wcfSidebarLink: props.def(--wcfSidebarLink, props.get($vlpnLink));
$wcfSidebarLinkActive: props.def(--wcfSidebarLinkActive, props.get($vlpnLinkActive));

$wcfFooterBoxLink: props.def(--wcfFooterBoxLink, props.get($vlpnLink));
$wcfFooterBoxLinkActive: props.def(--wcfFooterBoxLinkActive, props.get($vlpnLinkActive));

$wcfTabularBoxHeadline: props.def(--wcfTabularBoxHeadline, props.get($vlpnLink));
$wcfTabularBoxHeadlineActive: props.def(--wcfTabularBoxHeadlineActive, props.get($vlpnLinkActive));

$wcfStatusInfoBackground: props.def(--wcfStatusInfoBackground, props.get(core.$theme, --blue, --200));
$wcfStatusInfoText: props.def(--wcfStatusInfoText, props.get(core.$theme, --blue, --1200));