/*
	This file defines the CSS variables reused all over the page.
	
	Zoltán Hosszú, applying to 37signals
	05. 2025
*/

:root {
	--bold-weight: 600;
	--font-s: 0.75rem;
	
	--color-background: #FFFCFA;
	--color-background-tabs: #FFFCFACC;
	--color-background-card: #FFFFFF;
	--color-background-stack: #FFFFFF88;
	--color-background-highlight: #11060210;
	--color-background-highlight-light: #F7F5F3;
	--color-background-highlight-dark: #E7E3E0;
	--color-background-highlight-extradark: #D1CCC8;
	--color-background-highlight-transparent: #11060200;
	--color-background-navbar: #F7F3EE;
	--color-background-button: #197F21;
	--color-background-button-hover: #116A18;
	--color-background-inverted: #0B1215;
	--color-background-jump: #8150C5;
	--color-background-jump-input: #7448B1;
	--color-background-jump-result: #9571C6;
	--color-background-jump-hover: #946ACE;
	--color-background-event: #4D3BEF;
	
	--color-text-primary: #0B1215;
	--color-text-primary-hover: #335B6C;
	--color-text-secondary: #6F686C;
	--color-text-disabled: #8A8B8C;
	--color-text-link: #2A57E1;
	--color-text-on-background: #FFFFFF;
	--color-text-jump-placeholder: #FFFFFF88;
	
	--color-functional-error: #C53B2E;
	--color-functional-error-background: #C53B2E26;
	--color-functional-warning: #FDD137;
	--color-functional-warning-background: #FDD13726;
	--color-functional-success: #207C47;
	--color-functional-success-background: #207C4726;
	--color-functional-info: #2B7BC1;
	--color-functional-info-background: #2B7BC120;
	--color-functional-notification: #F96243;
	--color-functional-neutral: rgba(0, 0, 0, 0.1);
	
	--color-theme-yellow: #F9E08C;
	--color-theme-pink: #F9D4ED;
	--color-theme-green: #C9EDC4;
	--color-theme-blue: #C7E5FD;
	
	--color-stroke: rgba(0, 0, 0, 0.1);
	--color-input-stroke: rgba(0, 0, 0, 0.2);
	--color-button-stroke: rgba(0, 0, 0, 0.2);
	
	--color-jump-icon-default: #DFD3F0;
	
	--bu: 8px;
	--radius-min: calc(var(--bu) / 2);
	--radius-1: var(--bu);
	--radius-2: calc(var(--bu) * 2);
	--radius-3: calc(var(--bu) * 3);
	--radius-max: 999px;
	
	--shadow: 0px 4px 8px -2px rgba(129, 124, 117, 0.1), 0px 2px 4px -1px rgba(129, 124, 117, 0.1), 0px 1px 2px -0.5px rgba(129, 124, 117, 0.1), 0px -1px 1px rgba(129, 124, 117, 0.05), 0px 0px 1px rgba(129, 124, 117, 0.1);
	
	--shadow-hover: 0px 6px 40px -10px rgba(129, 124, 117, 0.3), 0px 3px 6px -1px rgba(129, 124, 117, 0.1), 0px 1px 2px -0.5px rgba(129, 124, 117, 0.1), 0px -1px 1px rgba(129, 124, 117, 0.05), 0px 0px 1px rgba(129, 124, 117, 0.1);
	
}