/*Palette V.2.0*/
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap');

:root {
  /* Primitive/Colours Styles */
  --primary-element-background: #FFFFFF;
  --primary-element-pale: #F5FDFB;
  --primary-element-subtle: #ECFBF8;
  --primary-element-light: #C3F1E8;
  --primary-element-mid-light: #7CE1CD;
  --primary-element-mid: #3CD2B4;
  --primary-element-mid-dark: #2B9580;
  --primary-element-dark: #19584C;

  /* Secondary/Element */
  --secondary-element-background: #FFFFFF;
  --secondary-element-pale: #FFFAFA;
  --secondary-element-subtle: #FCEDED;
  --secondary-element-light: #F4C6C6;
  --secondary-element-mid-light: #E88383;
  --secondary-element-mid: #DC4646;
  --secondary-element-mid-dark: #9C3232;
  --secondary-element-dark: #5C1D1D;

  /* Primary/Button */
  --primary-button-foreground-ondark: #FFF;
  --primary-button-foreground-onlight: #3CD2B4;
  --primary-button-label-inverted: #19584C;
  --primary-button-resting: #3CD2B4;
  --primary-button-hover: #2B9580;
  --primary-button-pressed: #217463;

  /* Secondary/Button */
  --secondary-button-foreground-ondark: #FFF;
  --secondary-button-foreground-onlight: #DC4646;
  --secondary-button-label-inverted: #5C1D1D;
  --secondary-button-resting: #DC4646;
  --secondary-button-hover: #9C3232;
  --secondary-button-pressed: #792727;

  /* Tertiary/Button */
  --tertiary-button-foreground-ondark: #FFFFFF;
  --tertiary-button-foreground-onlight: #2B9580;
  --tertiary-button-label-inverted: #19584C;
  --tertiary-button-resting: #2B9580;
  --tertiary-button-hover: #217463;
  --tertiary-button-pressed: #19584C;

  /* Primary/Navigation */
  --primary-nav-label-selected: #FFFFFF;
  --primary-nav-label-resting: #FFFFFF;
  --primary-nav-label-hover: #FFFFFF;
  --primary-nav-label-pressed: #19584C;
  --primary-nav-container-selected: #3CD2B4;
  --primary-nav-container-selected-hover: #2B9580;

  /* Primary/Chip */
  --primary-chip-label-selected: #3CD2B4;
  --primary-chip-border-selected: #3CD2B4;
  --primary-chip-container-selected: #ECFBF8;
  --primary-chip-container-selected-hover: #C3F1E8;

  /* Primary/Tab */
  --primary-tab-label-resting: #FFFFFF;
  --primary-tab-container-active: #FFFFFF;
  --primary-tab-container-resting: #3CD2B4;
  --primary-tab-container-resting-hover: #2B9580;

  /* Primary/Title */
  --primary-title-page-title: #19584C;
  --primary-title-page-subtitle: #2B9580;
  --primary-title-card-title: #19584C;
  --primary-title-card-subtitle: #2B9580;
  --primary-title-highlight: #37BFA4;

  /* Secondary/Title */
  --secondary-title-page-title: #5C1D1D;
  --secondary-title-page-subtitle: #9C3232;
  --secondary-title-card-title: #5C1D1D;
  --secondary-title-card-subtitle: #9C3232;
  --secondary-title-highlight: #C84040;

  /* Primary/Body Text */
  --primary-body-text-highlight: #37BFA4;

  /* Secondary/Body Text */
  --secondary-body-text-highlight: #C84040;

  /* Veriables for Hyperlink color */
  --primary-hyperlink-ondark: #ECFBF8;
  --primary-hyperlink-onlight: #0072E4; /* This color is changed to #0072E4 from #3CD2B4 to match with figma design*/


  /* Primary/Overlay */
  --primary-overlay-overlaylight: rgba(25, 88, 76, 0.40);

  /* Primary/Shadow */
  --primary-shadow-branded: #217463;


  /* Gradient/Element */
  --gradient-element-flashing: linear-gradient(135deg, #C3F1E8 0%, #ECFBF8 51%, #F4C6C6 100%);
  --gradient-element-fade: linear-gradient(90deg, rgba(245, 253, 251, 0.00) 0%, #F5FDFB 100%);

  /* ==========>          Gradients with the same start and end color */
  /* --gradient-element-pattern: linear-gradient(135deg, var(--color-primary-100), var(--color-primary-50) 50.52%, var(--color-secondary-100)); */

  /* Gradient/Navigation */
  --gradient-navigation-separator: linear-gradient(90deg, rgba(236, 251, 248, 0.00) 0%, rgba(60, 210, 180, 0.50) 50%, rgba(236, 251, 248, 0.00) 100%);
  --gradient-navigation-footer-separator: linear-gradient(90deg, rgba(236, 251, 248, 0.00) 0%, rgba(60, 210, 180, 0.50) 50%, rgba(236, 251, 248, 0.00) 100%);
  --gradient-navigation-fade: linear-gradient(90deg, rgba(236, 251, 248, 0.00) 0%, #ECFBF8 100%);

  /* --color-topnav-background: #F6E7F1; */
  /*  --color-loader: 29, 35, 107;         


  /* Font */
  --font-title: "Open Sans";
  --color-footer-background: #19584C;
  --footer-font-color: #F5FDFB;
}

.wordwrap {
  word-break: break-all;
}