/* core/_variables.css */
:root {
	/* --------------------------- background colors */
	/* body */
	--body-bg : #E9DCC9;
	
	/* form */
	--form-bg : #275971;
	--panel-bg : var(--form-bg);

	/* popup*/
	--modal-bg: #00000080;
	--popup-bg : var(--form-bg);
	
	/* tab */
	--inactive-tab-bg : #5085A5;
	--inactive-tab-bg-hover : #5085A580;
	--active-tab-bg : #99CCFF80;
	
	/* menu */
	--main-menu-bg: #31708E;
	--menu-hover-bg: #4A88A8;
	--menu-active-bg: #6B9BC0;
	--menu-logo-hover-bg: rgba(255, 255, 255, 0.05);
	
	
	/* buttons */
	--action-bg : #99CCFF;
	--action-bg-hover : #7299BF;
	
	/* --------------------------- text color */
	/* base */
	--main-text-color : #F7F9FB;
	--error-color : red;
	--alert-color: #D9512C;
	--success-color : #4BB543;

	--action-color : #13232F;

	--req-color : var(--alert-color);
	--link-color : #99CCFF;
	--link-color-hover : #7299BF;
	
	/* components */
	--tab-text-color : var(--main-text-color);
	
	/* --------------------------- borders */
	--input-border-color : #A0B3B0;
	
	/* --------------------------- radius */
	--shared-radius : 20px;
	
	--input-radius : var(--shared-radius);
	--tab-radius: var(--shared-radius);
	--button-radius: var(--shared-radius);
	--popup-radius:var(--shared-radius);
	--form-radius:var(--shared-radius);
	--panel-radius:var(--shared-radius);

	
	/* --------------------------- shadows */
	--box-shadow : #27597154;

	--form-shadow : 0px 4px 10px 4px var(--box-shadow);
	--panel-shadow : 0px 4px 10px 4px var(--box-shadow);
	--input-shadow : 0px 4px 10px 4px var(--box-shadow);
	


	
	/* --------------------------- Transition timing */
 	--transition-fast: 150ms;    /* quick micro-interactions */
 	--transition-medium: 300ms;  /* most hover/focus/slide animations */
  	--transition-slow: 600ms;    /* more pronounced reveals or complex motion */

	/* Easing (optional) */
	--easing-standard: ease-in-out;
	
	--default-animation : animatezoom 0.5s;
}