@import url('./fonts/figtree/figtree.css');

:root {
	/* #region Color */
	--psy-color-primary-strongest: #333;
	--psy-color-primary-strong: #666;
	--psy-color-primary-moderate: #767676;
	--psy-color-primary-weak: #ccc;
	--psy-color-primary-weakest: #e7e7e7;
	--psy-color-secondary-strongest: #004d85;
	--psy-color-secondary-strong: #036ea4;
	--psy-color-secondary-moderate: #2097d7;
	--psy-color-secondary-weak: #3ebafc;
	--psy-color-secondary-weakest: #e6f6fe;
	--psy-color-neutral-strongest: #262626;
	--psy-color-neutral-stronger: #575757;
	--psy-color-neutral-strong: #B1BBBC;
	--psy-color-neutral-moderate: #D9DEDE;
	--psy-color-neutral-weak: #F4F4F4;
	--psy-color-neutral-weakest: #FEFEFE;
	--psy-color-black: #011011;
	--psy-color-white: #FEFEFE;
	--psy-color-text-standard: var(--psy-color-neutral-strongest);
	--psy-color-text-subtle: var(--psy-color-neutral-strongest);
	--psy-color-text-quiet: var(--psy-color-neutral-stronger);
	--psy-color-text-inverse: var(--psy-color-white);
	--psy-color-text-inverse-quiet: var(--psy-color-white);
	--psy-color-text-standard-hover-quiet: var(--psy-color-primary-strong);
	--psy-color-text-standard-link: var(--psy-color-primary-strong);
	--psy-color-text-standard-link-hover: var(--psy-color-primary-strong);
	--psy-color-text-inverse-link: var(--psy-color-white);
	--psy-color-text-inverse-link-hover: var(--psy-color-white);
	--psy-color-selection-background: #cbe8f1; 
	--psy-color-selection-text: var(--psy-color-text-standard);
	--psy-color-success-strong: #287A00;
	--psy-color-success-moderate: #99E573;
	--psy-color-success-weak: #EBFAE1; 
	--psy-color-info-strong: #006EA6;
	--psy-color-info-moderate: #73BFE5;
	--psy-color-info-weak: #EDF6FA;
	--psy-color-warning-strong: #8A7000;
	--psy-color-warning-moderate: #F5DC36;
	--psy-color-warning-weak: #FCFADB;
	--psy-color-warning-weaker: #FCFADB;
	--psy-color-error-strong: #CC2F2F;
	--psy-color-error-moderate: #F2AAAA;
	--psy-color-error-weak: #FAEDED;
	--psy-color-core-ai-strongest: var(--psy-color-orchid-800);
	--psy-color-core-ai-strong: var(--psy-color-orchid-700);
	--psy-color-core-ai-moderate: var(--psy-color-orchid-500);
	--psy-color-core-ai-weak: var(--psy-color-orchid-300);
	--psy-color-core-ai-weakest: var(--psy-color-orchid-100);
	--psy-color-text-ai-standard: var(--psy-color-orchid-900);
	--psy-color-text-ai-subtle: var(--psy-color-orchid-700);
	--psy-color-text-ai-quiet: var(--psy-color-orchid-500);
	--psy-color-structure-surface-ai-high: var(--psy-color-orchid-50);
	--psy-color-structure-surface-ai-middle: var(--psy-color-orchid-100);
	--psy-color-structure-surface-ai-low: var(--psy-color-orchid-50);
	--psy-color-structure-border-ai-strongest: var(--psy-color-orchid-500);
	--psy-color-structure-border-ai-strong: var(--psy-color-orchid-400);
	--psy-color-structure-border-ai-moderate: var(--psy-color-orchid-200);
	--psy-color-structure-border-ai-weak: var(--psy-color-orchid-100);
	--psy-color-chart-dark-red: #F6E1E1;
	--psy-color-chart-red: #FEF4F4;
	--psy-color-chart-orange: #FCEFE1;
	--psy-color-chart-dark-yellow: #F6EFDF;
	--psy-color-chart-yellow: #FAF9DE;
	--psy-color-chart-blue: #DEECF3;
	--psy-color-chart-green: #EFF6E0;
	--psy-color-nav-background: var(--psy-color-white);
	--psy-color-nav-text: var(--psy-color-text-standard);
	--psy-color-nav-hover: var(--psy-color-neutral-weak);
	--psy-color-nav-current: var(--psy-color-white);
	--psy-color-backdrop: var(--psy-color-neutral-weakest); 
	--psy-color-curtain: rgba(0, 0, 0, 0.5);
	--psy-color-surface-high: var(--psy-color-neutral-weakest);
	--psy-color-surface-middle: var(--psy-color-neutral-weak);
	--psy-color-surface-low: var(--psy-color-neutral-weakest);
	--psy-color-surface-highlight: var(--psy-color-warning-weaker);
	--psy-color-text-icon-hover: var(--psy-color-neutral-weak);
	--psy-color-text-icon-active: var(--psy-color-neutral-moderate);
	--psy-color-border-strongest: var(--psy-color-neutral-strongest);
	--psy-color-border-strong: var(--psy-color-neutral-stronger);
	--psy-color-border-moderate: var(--psy-color-neutral-strong);
	--psy-color-border-weak: var(--psy-color-neutral-moderate);
	--psy-color-border-dialog: transparent;
	/* #endregion Color */

	/* #region Font */
	--psy-font-family-heading: FigTree, sans-serif;
	--psy-font-family-body: FigTree, sans-serif;
	--psy-font-family-code: monospace;
	--psy-font-size-root: 16px;
	--psy-font-size-xxs: 0.75rem;
	--psy-font-size-xs: 0.875rem;
	--psy-font-size-s: 1rem;
	--psy-font-size-m: 1.25rem;
	--psy-font-size-l: 1.5rem;
	--psy-font-size-xl: 1.75rem;
	--psy-font-size-xxl: 2.25rem;
	--psy-font-weight-heavy: 700;
	--psy-font-weight-medium: 600;
	--psy-font-weight-regular: 500;
	--psy-font-weight-light: 400;
	--psy-font-height-comfortable: 1.75;
	--psy-font-height-cozy: 1.5;
	--psy-font-height-compact: 1.15;
	--psy-link-decoration-standard: none;
	--psy-link-decoration-hover: underline;
	--psy-link-decoration-inverse: none;
	--psy-link-decoration-inverse-hover: underline;
	/* #endregion Font */

	/* #region Space */
	--psy-space-xxs: 0.125rem;
	--psy-space-xs: 0.25rem;
	--psy-space-s: 0.5rem;
	--psy-space-m: 0.75rem;
	--psy-space-l: 1rem;
	--psy-space-xl: 1.5rem;
	--psy-space-xxl: 2rem;
	/* #endregion Space */

	/* #region Object Styles */
	--psy-border-weight-heavy: 4px;
	--psy-border-weight-medium: 2px;
	--psy-border-weight-light: 1px;
	--psy-corner-sharp: 0px;
	--psy-corner-subtle: 2px;
	--psy-corner-smooth: 4px;
	--psy-corner-round: 8px;
	--psy-corner-convex: 12px;
	--psy-corner-orbicular: 24px;
	--psy-corner-full: 999px;
	--psy-shadow-high: 0 0.125rem 0.625rem 0 rgba(119,129,141,0.1);
	--psy-shadow-middle: 0 0.0625rem 0.3125rem 0 rgba(0,0,0,0.10);
	--psy-shadow-low: 0 0.0625rem 0.125rem 0 rgba(0,0,0,0.05);
	--psy-shadow-dialog: 0 0.5rem 1rem 0 rgba(0,0,0,0.15);
	--psy-shadow-tooltip: var(--psy-shadow-low);
	/* #endregion Object Styles */

	/* #region Interaction */ 
	--psy-focus-border: unset;
	--psy-focus-box-shadow: 0 0 0 5px var(--psy-color-info-moderate);
	--psy-focus-outline: unset;
	--psy-focus-error-border: unset;
	--psy-focus-error-box-shadow: 0 0 0 5px var(--psy-color-error-strong);
	--psy-focus-error-outline: unset;
	--psy-hover-panel: #FDF7D5;
	--psy-disabled-opacity: 0.4;
	--psy-active-opacity: 0.8;
	/* #endregion Interaction */
 
	/* #region Components */

	/* #region Banner */

	/* Error */
	--psy-banner-error-background: var(--psy-color-error-weak);
	--psy-banner-error-border: var(--psy-border-weight-light) solid var(--psy-color-error-moderate);
	--psy-banner-error-icon-color: var(--psy-color-error-strong);
	--psy-banner-error-content-color: var(--psy-color-text-standard);
	--psy-banner-error-link-color: var(--psy-color-text-standard-link);
	--psy-banner-error-link-decoration: var(--psy-link-decoration-standard);
	--psy-banner-error-link-color-hover: var(--psy-color-text-standard-link-hover);
	--psy-banner-error-link-decoration-hover: var(--psy-link-decoration-hover);

	/* Success */
	--psy-banner-success-background: var(--psy-color-success-weak);
	--psy-banner-success-border: var(--psy-border-weight-light) solid var(--psy-color-success-moderate);
	--psy-banner-success-icon-color: var(--psy-color-success-strong);
	--psy-banner-success-content-color: var(--psy-color-text-standard);
	--psy-banner-success-link-color: var(--psy-color-text-standard-link);
	--psy-banner-success-link-decoration: var(--psy-link-decoration-standard);
	--psy-banner-success-link-color-hover: var(--psy-color-text-standard-link-hover);
	--psy-banner-success-link-decoration-hover: var(--psy-link-decoration-hover);

	/* #endregion Banner */

	/* #region Rich Text Editor */
	--psy-rich-text-editor-toolbar-menu-button-width: 9.2em;

	--psy-rich-text-editor-body-color: var(--psy-color-text-standard);
	--psy-rich-text-editor-body-font-family: var(--psy-font-family-body);
	--psy-rich-text-editor-body-font-size: var(--psy-font-size-root);
	--psy-rich-text-editor-body-line-height: var(--psy-font-height-cozy);

	--psy-rich-text-editor-p-margin: 0 0 var(--psy-space-s);
	--psy-rich-text-editor-p-padding: 0;

	--psy-rich-text-editor-h2-font-family: var(--psy-font-family-heading);
	--psy-rich-text-editor-h2-font-size: var(--psy-font-size-xl);
	--psy-rich-text-editor-h2-font-weight: var(--psy-font-weight-regular);
	--psy-rich-text-editor-h2-line-height: var(--psy-font-height-compact);
	--psy-rich-text-editor-h2-margin: var(--psy-space-l) 0;
	--psy-rich-text-editor-h2-padding: 0;

	--psy-rich-text-editor-h3-font-family: var(--psy-font-family-heading);
	--psy-rich-text-editor-h3-font-size: var(--psy-font-size-l);
	--psy-rich-text-editor-h3-font-weight: var(--psy-font-weight-regular);
	--psy-rich-text-editor-h3-line-height: var(--psy-font-height-compact);
	--psy-rich-text-editor-h3-padding: 0;
	--psy-rich-text-editor-h3-margin: 0 0 var(--psy-space-s) 0;

	--psy-rich-text-editor-h4-color: var(--psy-color-text-subtle);
	--psy-rich-text-editor-h4-font-family: var(--psy-font-family-body);
	--psy-rich-text-editor-h4-font-size: var(--psy-font-size-m);
	--psy-rich-text-editor-h4-font-weight: var(--psy-font-weight-medium);
	--psy-rich-text-editor-h4-line-height: var(--psy-font-height-cozy);
	--psy-rich-text-editor-h4-padding: 0;
	--psy-rich-text-editor-h4-margin: var(--psy-space-s) 0 0 0;

	--psy-rich-text-editor-ol-margin: 0;
	--psy-rich-text-editor-ol-padding: 0 0 0 25px;
	--psy-rich-text-editor-ol-li-style-type: decimal;
	--psy-rich-text-editor-ol-li-background-image: none;
	--psy-rich-text-editor-ol-margin-first-child: var(--psy-space-m);

	--psy-rich-text-editor-ul-margin: 0 0 0 var(--psy-space-m);
	--psy-rich-text-editor-ul-padding: 0;
	--psy-rich-text-editor-ul-li-background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNSIgaGVpZ2h0PSIxOCI+PGNpcmNsZSBjeD0iNiIgY3k9IjkiIHI9IjIiIGZpbGw9IiNCNEI0QjQiLz48L3N2Zz4=) no-repeat left 1px;
	--psy-rich-text-editor-ul-li-background-size: 15px 18px;
	--psy-rich-text-editor-ul-li-style-type: none;
	--psy-rich-text-editor-ul-li-margin: var(--psy-space-xxs) 0;
	--psy-rich-text-editor-ul-li-padding: 0 0 0 var(--psy-space-m);
	--psy-rich-text-editor-ul-margin-first-child: var(--psy-space-m);

	--psy-rich-text-editor-hr-margin: var(--psy-space-m) auto;

	--psy-rich-text-editor-blockquote-bl: var(--psy-border-weight-medium) solid var(--psy-color-border-strong);
	--psy-rich-text-editor-blockquote-margin: 0 0 0 25px;
	--psy-rich-text-editor-blockquote-padding: 0 0 0 var(--psy-space-m);
	/* #endregion Rich Text Editor */

	/* #endregion Components */

	/* #region Mixins */

	/* #region Input */
	--psy-input-border-hover: 1px solid var(--psy-color-secondary-moderate);
	/* #endregion Input */

	/* #endregion Mixins */
}