:root {
    /**************************/
    /******** GENERAL *********/
    /**************************/
    --default-border-radius: 16px;
    --small-border-radius: 8px;
    --xsmall-border-radius: 4px;
    --xxsmall-border-radius: 2px;
    
    --thick-border-width: 2px; /*focus-visible (link) */

    --primary-shadow: 0 2px 8px 0 #71809580;

    --white: #fff;

    /*************************/
    /********* TEXTS *********/
    /*************************/
    --link-color: #1474c4;
    --hovered-link-color: #1474c4;
    --link-text-decoration: none;
    --hovered-link-text-decoration: underline;
    --disabled-link-color: #C1CAD6;
    --font-size-wellcome: 16px;
    --line-height-wellcome: 24px;
    --headline-color-wellcome:  #001b41;  
    

    --default-text-color: #001b41;
    --disabled-text-color: #718095;
    --default-font-regular: "OpenSansRegular", arial, arial narrow, sans-serif;
    --default-text-size: 14px;
    --default-text-line-height: 20px;
    --default-font-bold: "OpenSansSemibold", arial, sans-serif;
    --font-size-small: 12px;


    --first-level-headline-family: var(--default-font-regular);
    --first-level-headline-size: 32px;
    --first-level-headline-line-height: 42px;
    --second-level-headline-family: var(--default-font-bold);
    --second-level-headline-size: 22px;
    --second-level-headline-line-height: 30px;
    --third-level-headline-family: var(--default-font-bold);
    --third-level-headline-size: 16px;
    --third-level-headline-line-height: 24px;
    --fourth-level-headline-family: var(--default-font-bold);
    --fourth-level-headline-size: 14px;
    --fourth-level-headline-line-height: 20px;
    --first-level-mobile-headline-family: var(--default-font-bold);
    --first-level-mobile-headline-size: 22px;
    --first-level-mobile-headline-line-height: 30px;
    --second-level-mobile-headline-family: var(--default-font-bold);
    --second-level-mobile-headline-size: 16px;
    --second-level-mobile-headline-line-height: 24px;
    --third-level-mobile-headline-family: var(--default-font-bold);
    --third-level-mobile-headline-size: 14px;
    --third-level-mobile-headline-line-height: 20px;



    /*************************/
    /********* SHEET *********/
    /*************************/
    --sheet-background-color: #fff;
    --sheet-border: 0 none #0000;
    --sheet-shadow: none;

    --sheet-section-padding: 28px 30px;

    --sheet-footer-gap: 12;
    --sheet-header-background-color: #fff;

    --advertising-background-gradient-start: #003d8f;
    --advertising-background-gradient-end: #1474c4;

    --semantic-section-border-width: 2px;
    --activating-shape-color: #08a5c5;
    --success-shape-color: #0fa954;
    --warning-shape-color: #fa0;
    --critical-shape-color: #ff6159;
    --neutral-shape-color: #97a3b4;
    --corporate-shape-color: #95caeb;
    --promoting-shape-color: #e480f8;
    --caution-shape-color: #ffd176;
    --tertiary-shape-color: #bcc8d4;

    --solid-activating-background-color: #11c7e6;
    --solid-success-background-color: #12cf76;
    --solid-warning-background-color: #fa0;
    --solid-critical-background-color: #ff6159;
    --solid-neutral-background-color: #bcc8d4;
    --solid-corporate-background-color: #0b2a63;
    --solid-promoting-background-color: #e480f8;

    /***************************/
    /****** SNACKBAR ***********/
    /***************************/

    /* container */
    --snackbar-container-bottom: 20px;
    --snackbar-container-pointer-events: none;
    --snackbar-container-width: 100%;
    --snackbar-container-z-index: 81;

    /* animtion */
    --snackbar-animation-duration: .2s;
    --snackbar-animation-in-from-opacity: 0;
    --snackbar-animation-in-from-translate: translateY(100%);
    --snackbar-animation-in-to-opacity: 1;
    --snackbar-animation-in-to-translate: translateY(0);
    --snackbar-animation-out-from-opacity: 1;
    --snackbar-animation-out-from-translate: translateY(0);
    --snackbar-animation-out-to-opacity: 0;
    --snackbar-animation-out-to-translate: translateY(100%);

    /* typography */
    --snackbar-font-family: var(--default-font-regular);
    --snackbar-font-size: var(--default-text-size);
    --snackbar-line-height: 18px;

    /* shape */
    --snackbar-max-width: 320px;
    --snackbar-padding: 16px 14px;
    --snackbar-border-radius: var(--small-border-radius);

    /* success solid */
    --snackbar-success-solid-background-color: #12cf76;
    --snackbar-success-solid-text-color: var(--default-text-color);

    /* warning solid */
    --snackbar-warning-solid-background-color: #ffaa00;
    --snackbar-warning-solid-text-color: var(--default-text-color);

    /* critical solid */
    --snackbar-critical-solid-background-color: #ff6159;
    --snackbar-critical-solid-text-color: var(--default-text-color);

    /* neutral solid */
    --snackbar-neutral-solid-background-color: #bcc8d4;
    --snackbar-neutral-solid-text-color: var(--default-text-color);

    /* activating solid */
    --snackbar-activating-solid-background-color: #11c7e6;
    --snackbar-activating-solid-text-color: var(--default-text-color);

    /**************************/
    /******* INPUTS ***********/
    /**************************/

    /* typography (shared by all input types) */
    --input-font-family: var(--default-font-regular);
    --input-font-size: var(--default-text-size);
    --input-line-height: var(--default-text-line-height);
    --input-text-color: var(--default-text-color);

    /* shape (shared) */
    --input-border-width: 1px;
    --input-border-color: #718095;
    --input-border-radius: 8px;
    --input-height: 36px;
    --input-padding: 4px 12px;

    /* colors: default state */
    --input-placeholder-color: #97a3b4;
    --input-background-color: transparent;
    
    --interactive-input-color: #1474c4; /* hover inputs */
    --critical-input-color: #ff6159; /* critical inputs */
    --warning-input-color: #fa0; /* warning inputs */

    /* colors: hover */
    --hovered-input-border-color: #095bb1;
    --hovered-input-background-color: #dbedf8;

    /* colors: focus */
    --focused-input-color: #1474c4;
    --focused-input-border-color: #095bb1;
    --focused-input-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #1474c4;

    /* colors: error */
    --error-input-border-color: #c80a00;
    --focused-error-input-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #c80a00;

    /* colors: warning */
    --warning-input-border-color: #ef8300;
    --focused-warning-input-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #ef8300;

    /* filled modifier (secondary bg) */
    --filled-input-background-color: #dbe2e8;
    --hovered-filled-input-background-color: var(--hovered-input-background-color);

    /* readonly modifier */
    --readonly-input-background-color: #f4f7fa;
    --readonly-input-border-color: #bcc8d4;

    /* bright modifier (on dark backgrounds) */
    --bright-input-background-color: #fff;
    --bright-input-border-color: transparent;

    /* disabled */
    /*--input-disabled-opacity: 0.38;*/

    /* select */
    --input-select-height: 36px;

    /* textarea */
    --input-textarea-min-height: 34px;
    --input-textarea-max-height: 74px;
    --input-textarea-line-height: 18px;
    --input-textarea-padding: 8px 12px;
    --hovered-input-textarea-background-color: var(--hovered-input-background-color);
    --filled-input-textarea-background-color: #fff;
    --hovered-filled-input-textarea-background-color: #fff;
    --secondary-textarea-background-color: #dbe2e8;
    --code-textarea-font-family: Courier New, Courier, Lucida Sans Typewriter, Lucida Typewriter, monospace;

    /* checkbox */
    --input-checkbox-square-size: 20px;
    --input-checkbox-border-width: 2px;
    --input-checkbox-border-radius: var(--xsmall-border-radius);
    --input-checkbox-border-color: #095bb1;
    --input-checkbox-icon-background-color: #095bb1;
    --input-checkbox-checkmark-color: #f4f7fa;
    --hovered-input-checkbox-inner-background-color: #95caeb;
    --hovered-input-checkbox-outer-background-color: var(--hovered-input-background-color);
    --focused-input-checkbox-border-color: #3196d6;
    --filled-input-background-color: #fff;
    --disabled-input-border-color: #bcc8d4;
    --input-checkbox-checkmark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1.5 6L4.5 9L10.5 3'/%3E%3C%2Fsvg%3E");
    --disabled-input-checkbox-border-color: #bcc8d4;

    /* radio */
    --input-radio-border-width: 2px;
    --input-radio-border-color: #095bb1;
    --input-radio-icon-background-color: #095bb1;
    --hovered-input-radio-inner-background-color: #95caeb;
    --hovered-input-radio-outer-background-color: var(--hovered-input-background-color);

    /* switch */
    --input-switch-height: 19px;
    --input-switch-width: 39px;
    --input-switch-background-color: #97a3b4;
    --input-switch-toogle-size: 15px;
    --input-switch-toogle-background-color: #fff;
    --input-switch-toogle-border-radius: 8px;
    --activated-input-switch-background-color: #095bb1;
    --hovered-input-switch-background-color: var(--hovered-input-background-color);
    --input-switch-checkmark-color: #fff;
    --input-switch-checkmark-size: 11px;
    --disabled-input-switch-background-color: #bcc8d4;

    /* byline */
    --input-byline-margin-top: 6px;
    --emphasized-error-input-byline-text-color: #fff;
    --emphasized-error-input-byline-background: #ff6159;

    /* counter */
    --input-counter-font-family: var(--default-font-regular);
    --input-counter-font-size: var(--default-text-size);
    --input-counter-line-height: var(--default-text-line-height);
    --input-counter-text-color: #465a75;
    --error-input-counter-text-color: var(--critical-text-color);




    /*************************/
    /******** BUTTON *********/
    /*************************/

    /*button*/
    --button-font-family: "OpenSansSemibold", arial, sans-serif;
    --button-font-size: 14px;
    --button-line-height: 24px;
    --button-padding: 4px 20px;
    --button-border-radius: 24px;
    --button-border-width: 2px;
    --button-margin-right: 12px; /* optional */


    /* primary button */
    --primary-button-background-color: #0b2a63;
    --primary-button-border-color: #0b2a63;
    --primary-button-text-color: #fff;
    --hovered-primary-button-background-color: #1474c4;
    --hovered-primary-button-border-color: #1474c4;
    --hovered-primary-button-text-color: #fff;

    /* secondary button */
    --secondary-button-border-color: #0b2a63;

    /* link and visited */
    --button-outline-link: 0 none;

    /* focus visible */
    /*
    --focused-visible-primary-button-first-box-shadow: #fff;
    --focused-visible-primary-button-second-box-shadow: #1474c4;
    --focused-visible-primary-button: 0 0 0 2px var(--focused-visible-primary-button-first-box-shadow, #fff), 0 0 0 4px var(--focused-visible-primary-button-second-box-shadow, #1474c4);;
    */
    --focused-visible-primary-button: 0 0 0 2px #fff, 0 0 0 4px #1474c4;


    /* button disabled */
    --button-disabled-opacity: .62;

    /* secondary button */
    --secondary-button-background-color: #0000;
    --secondary-button-text-color: #0b2a63;
    --hovered-secondary-button-background-color: #0b2a63;
    --hovered-secondary-button-border-color: #0b2a63;
    --hovered-secondary-button-text-color: #fff;

    /* ghost button */
    --ghost-button-background-color: #0000;
    --ghost-button-text-color: #1474c4;
    --hovered-ghost-button-background-color: var(--hovered-input-background-color);
    --hovered-ghost-button-text-color: #095bb1;
    --ghost-button-disabled-opacity: .38;

    /* ghost button only icon*/
    --ghost-button-icon-color: var(--default-text-color);
    --hovered-ghost-button-icon-color: #095bb1;



    /* Semantic colors */
    --success-text-color: #096b35;
    --warning-text-color: #8e4e00;
    --critical-text-color: #c80a00;
    --neutral-text-color: #465a75;
    --activating-text-color: #005b72;


    /* Activating */
    --activating-primary-button-background-color: #11c7e6;
    --activating-primary-button-border-color: #11c7e6;
    --activating-primary-button-text-color: #0b2a63;

    --hovered-activating-primary-button-background-color: #7fe4f6;
    --hovered-activating-primary-button-border-color: #7fe4f6;
    --hovered-activating-primary-button-text-color: #0b2a63;

    --activating-secondary-button-background-color: #0000;
    --activating-secondary-button-border-color: #11c7e6;
    --activating-secondary-button-text-color: #11c7e6;

    --hovered-activating-secondary-button-background-color: #11c7e6;
    --hovered-activating-secondary-button-border-color: #11c7e6;
    --hovered-activating-secondary-button-text-color: #0b2a63;

    /* Promoting */
    --promoting-primary-button-background-color: #e480f8;
    --promoting-primary-button-border-color: #e480f8;
    --promoting-primary-button-text-color: #fff;

    --hovered-promoting-primary-button-background-color: #f0b7fb;
    --hovered-promoting-primary-button-border-color: #f0b7fb;
    --hovered-promoting-primary-button-text-color: #fff;

    --promoting-secondary-button-background-color: #0000;
    --promoting-secondary-button-border-color: #e480f8;
    --promoting-secondary-button-text-color: #e480f8;

    --hovered-promoting-secondary-button-background-color: #f0b7fb;
    --hovered-promoting-secondary-button-border-color: #f0b7fb;
    --hovered-promoting-secondary-button-text-color: #fff;




    /**************************/
    /******* LINK *************/
    /**************************/

    /* colors */
    --link-text-decoration: none;
    --link-text-color: #1474c4;
    --hovered-link-text-color: #1474c4;
    --hovered-link-text-decoration: underline;
    --active-link-text-color: #1474c4;
    --active-link-text-decoration: underline;
    --link-shape-color: #1474c4;
    --disabled-link-opacity: 0.5;
    --disabled-link-text-color: #1474c4;
    --disabled-link-text-decoration: none;
    --hovered-disabled-link-text-decoration: none;

    /* semantic link colors */
    --hovered-success-link-text-color: #1474c4;
    --activated-success-link-text-color: #1474c4;
    --hovered-warning-link-text-color: #1474c4;
    --activated-warning-link-text-color: #1474c4;
    --hovered-critical-link-text-color: #1474c4;
    --activated-critical-link-text-color: #1474c4;
    --hovered-neutral-link-text-color: #1474c4;
    --activated-neutral-link-text-color: #1474c4;
    --hovered-activating-link-text-color: #1474c4;
    --activated-activating-link-text-color: #1474c4;
    
    /* bright variant (on dark/coloured backgrounds) */
    --bright-link-text-color: #fff;
    --hovered-bright-link-text-color: #fff;
    --activated-bright-link-text-color: #1474c4;

    /************************************/
    /****** LOADING INDICATOR ***********/
    /************************************/

    /* circle (three-dot inline loader) */
    --loading-circle-dot-size: 8px;
    --loading-circle-dot-size-small: 6px;
    --loading-circle-gap: 4px;
    --loading-circle-primary-color: #1474c4;
    --loading-circle-secondary-color: #97a3b4;
    --loading-circle-bright-color: #fff;

    /* spin (circular arc page/section loader) */
    --loading-spin-size: 40px;
    --loading-spin-size-small: 24px;
    --loading-spin-border-width: 3px;
    --loading-spin-track-color: #dbe2e8;
    --loading-spin-arc-color: #1474c4;
    --loading-spin-bright-track-color: rgba(255, 255, 255, 0.3);
    --loading-spin-bright-arc-color: #fff;

    /* square (shimmer skeleton loader) */
    --loading-square-color-base: #dbe2e8;
    --loading-square-color-highlight: #f4f7fa;
    --loading-square-border-radius: 4px;
    --loading-square-min-height: 16px;

    /**************************/
    /******* AI CHAT **********/
    /**************************/

    /* Header */
    --ai-header-bg: #003d8f;
    --ai-header-fg: #ffffff;
    --ai-header-fg-hover: #ffffff;
    --ai-header-fg-active: #ffffff;
    --ai-header-fg-focus-visible-color: #1474c4;
    --ai-header-fg-focus-visible-border-width: 2px;

    /* Panel */
    --ai-panel-position-bottom: 16px;
    --ai-panel-position-right: 16px;
    --ai-panel-bg: #ffffff;
    --ai-panel-shadow: 0 8px 32px 0 rgba(0, 61, 143, .18);
    --ai-panel-radius: 16px;
    --ai-panel-z: 200;
    --ai-panel-width: 400px;
    --ai-panel-width-wide: 640px;
    --ai-panel-right: 24px;
    --ai-panel-height: calc(100vh - 96px);
    --ai-panel-max-height: calc(100vh - 24px);
    --ai-panel-max-width: calc(100vw - 32px);

    /* Navigation */
    --ai-nav-bg: #ffffff;
    --ai-nav-fg: #1474c4;
    --ai-nav-fg-hover: #003d8f;
    --ai-divider: #bcc8d4;

    /* Body */
    --ai-body-bg: #ffffff;
    --ai-body-scrollbar-thumb-bg: #D6DEE3;;

    /* Suggestions */
    --ai-suggestion-color: #646E80;

    /* Bubbles */
    --ai-bubble-user-bg: #dbedf8;
    --ai-bubble-user-fg: #001b41;
    --ai-bubble-bot-bg: #f4f6f8;
    --ai-bubble-bot-fg: #001b41;

    /* Avatar */
    --ai-avatar-fg: #003d8f;
    --ai-avatar-bg: #ffffff;
    --ai-avatar-size: 32px;

    /* Chips */
    --ai-chip-bg: #f4f7fa;
    --ai-chip-bg-hover: #dbedf8;

    /* Feedback */
    --ai-feedback-border: #bcc8d4;
    --ai-feedback-fg: #646e80;
    --ai-feedback-active-fg: #0b9dcc;

    /* Articles */
    --ai-articles-border: #bcc8d4;
    --ai-articles-border-color: #bcc8d4;
    --ai-articles-link-fg: #1474c4;

    /* Buttons */
    --ai-button-padding: 8px 20px;
    --ai-button-border-radius: 24px;
    --disabled-ai-button-opacity: 0.62;

    --ai-primary-button-border-color: #0b2a63;
    --ai-primary-button-bg-color: #0b2a63;
    --ai-primary-button-color: #fff;
    --ai-primary-button-border-color-hover: #1474c4;
    --ai-primary-button-bg-color-hover: #1474c4;
    --ai-primary-button-color-hover: #fff;

    --ai-secondary-button-border-color: #0b2a63;
    --ai-secondary-button-bg-color: transparent;
    --ai-secondary-button-color: #0b2a63;
    --ai-secondary-button-border-color-hover: #0b2a63;
    --ai-secondary-button-bg-color-hover: #0b2a63;
    --ai-secondary-button-color-hover: #fff;

    /* Footer & Input */
    --ai-footer-bg: #ffffff;
    --ai-input-border: #97a3b4;
    --ai-input-border-radius: 8px;
    --ai-input-border-hover: #1474c4;
    --ai-input-border-focus: #1474c4;

    /* Send button */
    --ai-send-bg: #001b41;
    --ai-send-bg-hover: #1474c4;
    --ai-send-bg-disabled: #c1cad6;

    /* Typing & disclaimer */
    --ai-typing-dot: #646e80;
    --ai-disclaimer-fg: #646e80;

    /* Tooltip */
    --ai-tooltip-radius: 16px;

    /* Code block */
    --ai-code-bg: #000000;
    --ai-code-fg: #d1d7de;
    --ai-code-radius: 4px;

    /* Table */
    --ai-table-background-color: #fff;
    --ai-table-background-color-hover: #dbedf8;
    --ai-table-border-radius: 8px;
    --ai-table-line-height: 20px;
    --ai-table-thead-text: uppercase;
    --ai-table-border-color: inset 0 -1px 0 0 #bcc8d4;
    --ai-table-cell-padding: 5px;
    --ai-table-cell-extra-padding: 10px;

    /* History */
    --ai-chat-history-item-padding: 16px 24px;
    --ai-chat-history-item-border-color: var(--tertiary-shape-color);

    /* Titles */
    --font-size-h1: 20px;
    --font-size-h2: 18px;
    --font-size-h3: 16px;
    --margin-bottom-h1: 8px;
    --margin-bottom-h2: 8px;
    --margin-bottom-h3: 8px;

    /* Tile */
    --ai-tile-background-color: #fff;
    --selected-ai-tile-background-color: #dbedf8;
    --ai-tile-border-color: #0b2a63;
    --ai-tile-color: #001b41;
    --hovered-ai-tile-background-color: #dbedf8;
    --hovered-ai-tile-border-color: #0b2a63;
    --hovered-ai-tile-color: #001b41;
    --disabled-ai-tile-opacity: 0.62;
    --disabled-ai-tile-background-color: #e4e8ee;
    --disabled-ai-tile-border-color: #bcc8d4;
    --disabled-ai-tile-color: #001b41;

    /* Checkbox */
    --ai-checkbox-border: var(--linkcolor);
    --ai-checkbox-checked-border: #1474c4;
    --ai-checkbox-checked-bg: #fff;
    --ai-checkbox-checked-fg: #1474c4;

    /* Radio button */
    --ai-radio-border: #1474c4;
}