/* Tools */
/* Components */
:root {
  /** Button */
  --button-font-family: var(--theme-fontFamily-main);
  --button-border-radius: var(--theme-borderRadius-card);
  --button-bg-color: var(--theme-color-grey-light);
  --button-bg-color-disabled: var(--theme-color-grey-medium-3);
  --button-text-color-disabled: var(--theme-color-grey-medium);
  --button-bg-color-hover: var(--theme-color-grey-medium-2);
  --button-text-color: var(--theme-color-black);
  --button-text-color-hover: var(--theme-color-black);
  --button-border-color: transparent;
  --button-border: none;
  /* Primary */
  --button-primary-bg-color: var(--theme-color-primary-medium);
  --button-primary-bg-color-disabled: var(--theme-color-grey-light);
  --button-primary-bg-color-hover: var(--theme-color-primary-dark);
  --button-primary-text-color: var(--theme-color-black);
  --button-primary-text-color-disabled: var(--theme-color-grey-medium);
  --button-primary-border-color: var(--theme-color-primary-dark);
  --button-primary-border-color-disabled: var(--theme-color-grey-medium-2);
  --button-primary-border: solid 0.0625rem;
  /* Secondary */
  --button-secondary-bg-color: var(--theme-color-white);
  --button-secondary-bg-color-disabled: var(--theme-color-grey-light);
  --button-secondary-bg-color-hover: var(--theme-color-primary-light);
  --button-secondary-text-color: var(--theme-color-black);
  --button-secondary-text-color-disabled: var(--theme-color-grey-medium);
  --button-secondary-border-color: var(--theme-color-primary-dark);
  --button-secondary-border-color-disabled: var(--theme-color-grey-medium-2);
  --button-secondary-border: solid 0.0625rem;
  /* Info */
  --button-info-bg-color: var(--theme-color-secondary-bg);
  --button-info-bg-color-disabled: var(--theme-color-grey-light);
  --button-info-bg-color-hover: var(--theme-color-secondary-light);
  --button-info-text-color: var(--theme-color-secondary-dark);
  --button-info-text-color-disabled: var(--theme-color-grey-medium);
  --button-info-border-color: var(--theme-color-secondary-medium);
  --button-info-border-color-disabled: var(--theme-color-grey-medium-2);
  --button-info-border: solid 0.0625rem;
  /* Link */
  --button-link-bg-color: transparent;
  --button-link-bg-color-disabled: transparent;
  --button-link-bg-color-hover: transparent;
  --button-link-text-color: var(--theme-color-grey-dark);
  --button-link-text-color-hover: var(--theme-color-grey-dark);
  --button-link-text-color-disabled: var(--theme-color-grey-medium);
  --button-link-text-decoration-hover: underline;
  --button-link-border: none;
  --button-link-min-width: unset;
  /* Icon */
  --button-icon-bg-color: var(--theme-color-white);
  --button-icon-bg-color-disabled: var(--theme-color-grey-light);
  --button-icon-bg-color-hover: var(--theme-color-primary-light);
  --button-icon-text-color: var(--theme-color-primary-dark);
  --button-icon-text-color-hover: var(--theme-color-primary-dark);
  --button-icon-text-color-disabled: var(--theme-color-grey-medium);
  --button-icon-border-color: var(--theme-color-primary-dark);
  --button-icon-border-color-disabled: var(--theme-color-grey-medium-2);
  --button-icon-border: solid 0.0625rem;
  --button-icon-min-width: unset;
  /* Secondary pssc */
  --button-secondary-pssc-bg-color: var(--theme-color-white);
  --button-secondary-pssc-border-radius: 2.75rem;
  --button-secondary-pssc-bg-color-hover: var(--theme-color-grey-medium-3);
}

:root {
  --header-bg-color: var(--theme-color-white, magenta);
  --header-box-shadow: 0 0.125rem 0.875rem 0 rgba(0, 0, 0, 0.05);
}

:root {
  --selector-list-bg-color: var(--theme-color-secondary-bg, magenta);
  --selector-list-font-family: var(--theme-fontFamily-main);
  --selector-list-text-color: var(--theme-color-grey-medium);
  --selector-list-input-border-color-unselected: 0.0625rem solid var(--theme-color-grey-medium-2, magenta);
  --selector-list-input-border-color-hover: 0.0625rem solid var(--theme-color-secondary-dark, magenta);
  --selector-list-input-text-color-hover: var(--theme-color-secondary-dark, magenta);
  --selector-list-input-bg-color-hover: var(--theme-color-secondary-light, magenta);
  --selector-list-input-bg-color-active: var(--theme-color-secondary-medium, magenta);
  --selector-list-input-text-color-active: var(--theme-color-white, magenta);
}

:root {
  --breadcrumbs-bg-color: var(--theme-color-primary-medium, rgb(0, 0, 0));
  --breadcrumbs-font: var(--theme-fontFamily-main);
  --breadcrumbs-font-size: 1rem;
  --breadcrumbs-font-size-mobile: 0.875rem;
  --breadcrumbs-margin-left: 1rem;
  --breadcrumbs-margin-left-mobile: 0.875rem;
}

:root {
  --steps-default-bg-color: var(--theme-color-white);
  --steps-completed-bg-color: var(--theme-color-green);
  --steps-completed-color: var(--theme-color-white);
  --steps-active-color: var(--theme-color-black);
  --steps-active-border-color: var(--theme-color-primary-dark);
  --steps-active-bg-color: var(--theme-color-primary-medium);
  --steps-disabled-bg-color: var(--theme-color-grey-medium-3);
  --steps-disabled-border-color: var(--theme-color-grey-medium-2);
  --steps-disabled-color: var(--theme-color-grey-medium);
}

:root {
  --note-info-message-bg: var(--theme-color-secondary-light);
  --note-info-message-border: 0.0625rem solid var(--theme-color-secondary-medium);
  --note-font: var(--theme-fontFamily-main);
  --note-color-hover: var(--theme-color-black);
}

:root {
  --progressbar-bg-color: #c0c0c0;
  --progressbar-font: var(--theme-fontFamily-main);
  --progressbar-percent-bar-color: var(--theme-color-secondary-medium);
  --progressbar-resp-bar-color: var(--theme-color-grey-medium-3);
}

:root {
  --input-bg-color: var(--theme-color-primary-medium, magenta);
  --input-font-family: var(--theme-fontFamily-main);
  --input-border-repose: solid 0.0625rem var(--theme-color-grey-medium-2, magenta);
  --input-background-color-repose: var(--theme-color-white);
  --input-text-color: var(--theme-color-grey-dark);
  --input-label-color-repose: var(--theme-color-grey-medium);
  --input-label-color: var(--theme-color-secondary-medium);
  --input-border-focus: solid 0.0625rem var(--theme-color-secondary-medium);
  --input-caret-color-focus: var(--theme-color-secondary-medium);
  --input-border-hover: solid 0.0625rem var(--theme-color-secondary-medium);
  --input-background-color-disabled: var(--theme-color-grey-light);
  --input-text-color-help: var(--theme-color-grey-medium);
  --input-border-color-error: var(--theme-color-red);
}

:root {
  --modal-bg-color: var(--theme-color-primary-medium, magenta);
  --modal-button-background: var(--theme-color-primary-medium);
  --modal-close-button-background: var(--theme-color-primary-medium);
  --modal-loading-animator-border-background: var(--theme-color-primary-medium);
  --modal-close-button-hover-background: var(--theme-color-primary-light);
}

:root {
  --upload-bg-color: var(--theme-color-white, magenta);
  --upload-bg-color-secondary: #fafafa;
  --upload-font-family: var(--theme-fontFamily-main);
  --upload-font-color: var(--theme-color-grey-medium);
  --upload-border-file-uploaded: solid 0.0625rem var(--theme-color-grey-medium-2, magenta);
  --upload-file-upload: var(--theme-color-secondary-bg);
  --upload-color-error: var(--theme-color-red);
  --upload-border-error: solid 0.0625rem var(--theme-color-red, magenta);
  --input-border-color-error: var(--theme-color-red);
}

:root {
  --tooltip-bg-color: var(--theme-color-white, magenta);
  --tooltip-color: var(--theme-color-grey-dark);
  --tooltip-font-family: var(--theme-fontFamily-main);
}

:root {
  --card-bg-color: var(--theme-color-primary-medium, magenta);
  --card-text-color: var(--theme-color-grey-dark);
  --card-font-family: var(--theme-fontFamily-main);
  --card-button-hover-background: var(--theme-color-primary-light);
}

:root {
  --panel-bg-color: var(--theme-color-primary-medium, magenta);
  --panel-border-color: var(--theme-color-black, black);
}

:root {
  --box-link-bg-color: var(--theme-color-primary-medium, magenta);
  --box-link-border-color: var(--theme-color-black, black);
}

:root {
  --jumbotron-bg-color: var(--theme-color-primary-medium, magenta);
  --jumbotron-font-family: var(--theme-fontFamily-main);
}

:root {
  --input-bg-color: var(--theme-color-primary-medium, magenta);
  --input-font-family: var(--theme-fontFamily-main);
  --input-border-repose: 0.0625rem solid grey;
  --input-background-color-repose: var(--theme-color-white);
  --input-text-color: var(--theme-color-grey-dark);
  --input-label-color-repose: var(--theme-color-grey-medium);
  --input-label-color: var(--theme-color-secondary-medium);
  --input-border-focus: solid 0.0625rem var(--theme-color-secondary-medium);
  --input-caret-color-focus: var(--theme-color-secondary-medium);
  --input-border-hover: solid 0.0625rem var(--theme-color-secondary-medium);
  --input-background-color-disabled: var(--theme-color-grey-light);
  --input-text-color-help: var(--theme-color-grey-medium);
  --input-border-color-error: var(--theme-color-red);
}

:root {
  --upload-file-bg-color: var(--theme-color-primary-medium, magenta);
}

:root {
  --cookies-banner-bg-color: var(--theme-cookies-banner-bg-color, #f2f2f2);
  --cookies-banner-box-shadow: var(--theme-cookies-banner-box-shadow, 0 0 1.5rem 0 rgba(0, 0, 0, 0.25));
  --cookies-banner-text-color: var(--theme-cookies-banner-text-color, #030303);
  --cookies-banner-link-color: var(--theme-cookies-banner-link-color, #046080);
}

/* Theme */
:root {
  --theme-fontFamily-main: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --theme-layout-wrapper: 85.375rem;
  --theme-borderRadius-main: 0.375rem;
  --theme-borderRadius-card: 0.5rem;
  --theme-borderRadius-msg: 0.5625rem;
  --theme-rightBorderRadius-image: 0.5rem 0 0 0.5rem;
  --theme-bottomBorderRadius-image: 0.5rem 0.5rem 0 0;
  --theme-boxShadow-main: 0 0.625rem 1.25rem 0 rgba(0, 0, 0, 0.1);
  --theme-color-primary-dark: #c18101;
  --theme-color-primary-medium: #edac2e;
  --theme-color-primary-light: #ffe699;
  --theme-color-secondary-dark: #1f3c60;
  --theme-color-secondary-medium: #3e74b4;
  --theme-color-secondary-light: #e2edf7;
  --theme-color-secondary-bg: #f8fafd;
  --theme-color-grey-dark: #333333;
  --theme-color-grey-medium: #666666;
  --theme-color-grey-medium-2: #8f8f8f;
  --theme-color-grey-medium-3: #e6e6e6;
  --theme-color-grey-light: #e6e6e6;
  --theme-color-black: #000000;
  --theme-color-white: #ffffff;
  --theme-color-red: #d10002;
  --theme-color-green: #2f881b;
}