/*
  1. Use a more-intuitive box-sizing model.
*/
*,
*::before,
*::after {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html,
body {
  height: 100%;
}

body {
  margin: 0;
  font-family: Roboto, "Helvetica Neue", sans-serif;
}

:root {
  --font: 'Roboto';
  --font-family: 'Roboto';
  --font-roboto: 'Roboto';
  --font-inter: 'Inter';
  --font-poppins: "Poppins";
  --font-helvetica: "Helvetica";
  --small-2px: 2px;
  --small-3px: 3px;
  --small-4px: 4px;
  --small-6px: 6px;
  --small-8px: 8px;
  --small-10px: 10px;
  --small-12px: 12px;
  --small-14px: 14px;
  --small-16px: 16px;
  --small-18px: 18px;
  --medium-20px: 20px;
  --medium-22px: 22px;
  --medium-24px: 24px;
  --medium-28px: 28px;
  --medium-30px: 30px;
  --medium-32px: 32px;
  --medium-36px: 36px;
  --large-40px: 40px;
  --large-42px: 42px;
  --large-44px: 44px;
  --large-48px: 48px;
  --large-56px: 56px;
  --large-64px: 64px;
  --form-email-icon-color: #33961F;

  --sa-skeleton-background: #e9ecef;
  --sa-skeleton-background-dark: #344054;
  --sa-skeleton-shine: rgba(255, 255, 255, 0.3);
  --sa-skeleton-shine-dark: #98A2B3;
  --sa-skeleton-radius: 4px;
  --sa-skeleton-animation-duration: 1.5s;
  --sa-skeleton-gap: 1rem;
  --sa-skeleton-padding: 1rem;
}

.insights-theme {
  --primary-50: #EAFFFD;
  --primary-100: #CAFFFB;
  --primary-200: #9CFFFA;
  --primary-300: #00DDEA;
  --primary-400: #00AFC4;
  --primary-500: #008597;
  --primary-600: #0B6E7F;
  --primary-700: #0E5B6B;
  --primary-800: #023D4A;
  --primary-900: #01303A;
  --secondary-50: #FFF3EB;
  --secondary-100: #FFD8C0;
  --secondary-200: #FFC6A2;
  --secondary-300: #FEAB78;
  --secondary-400: #FE9B5D;
  --secondary-500: #FE8235;
  --secondary-600: #E77630;
  --secondary-700: #B45C26;
  --secondary-800: #8C481D;
  --secondary-900: #6B3716;
  --grey-50: #E9EAEB;
  --grey-100: #BAC0C1;
  --grey-200: #98A1A3;
  --grey-300: #697779;
  --grey-400: #4C5C5F;
  --grey-500: #1F3437;
  --grey-600: #1C2F32;
  --grey-700: #162527;
  --grey-800: #111C1E;
  --grey-900: #0D1517;
  --semantic-success-50: #EBF5E9;
  --semantic-success-100: #C0DEBA;
  --semantic-success-200: #A1CF98;
  --semantic-success-300: #76B969;
  --semantic-success-400: #5CAB4C;
  --semantic-success-500: #33961F;
  --semantic-success-600: #2E891C;
  --semantic-success-700: #246B16;
  --semantic-success-800: #1C5311;
  --semantic-success-900: #153F0D;
  --semantic-error-50: #F8E9E9;
  --semantic-error-100: #EBBCB9;
  --semantic-error-200: #E19C98;
  --semantic-error-300: #D36E68;
  --semantic-error-400: #CA524B;
  --semantic-error-500: #BD271E;
  --semantic-error-600: #AC231B;
  --semantic-error-700: #861C15;
  --semantic-error-800: #681511;
  --semantic-error-900: #4F100D;
  --semantic-purple-50: #F3EFFD;
  --semantic-purple-100: #D8CCFA;
  --semantic-purple-200: #C6B4F7;
  --semantic-purple-300: #AB92F4;
  --semantic-purple-400: #9B7DF1;
  --semantic-purple-500: #815BED;
  --semantic-purple-600: #7654D9;
  --semantic-purple-700: #5C41A9;
  --semantic-purple-800: #483383;
  --semantic-purple-900: #372764;
  --semantic-yellow-50: #FEF6E6;
  --semantic-yellow-100: #FBE2B3;
  --semantic-yellow-200: #F9D58E;
  --semantic-yellow-300: #F6C15A;
  --semantic-yellow-400: #F5B53A;
  --text-highemphasis: #1B1F20;
  --text-mediumemphasis: #697779;
  --text-lowemphasis: #98A2A3;
  --text-white: #FFFFFF;
  --text-primary: #008597;
  --text-success: #33961F;
  --text-error: #BD271E;
  --icon-white: #FFFFFF;
  --semantic-yellow-500: #F2A209;
  --semantic-yellow-600: #DC9408;
  --semantic-yellow-700: #AC7406;
  --semantic-yellow-800: #855A05;
  --semantic-yellow-900: #664404;
  --structural-white: #FFFFFF;
  --icon-grey1: #757575;
  --structural-primarytint: #F5F9FA;
  --structural-neutral1: #F9F9F9;
  --structural-neutral2: #FFFAFA;
  --structural-neutral3: #FAFAFA;
  --logo-color-primary: #008597;
  --logo-color-secondary: #9CFFFA;
}

.saras-theme {
  --primary-50: #E8F1FC;
  --primary-100: #B8D4F7;
  --primary-200: #96C0F3;
  --primary-300: #66A2ED;
  --primary-400: #4992E9;
  --primary-500: #1B77E4;
  --primary-600: #196CCF;
  --primary-700: #1354A2;
  --primary-800: #0F417D;
  --primary-900: #0B3160;
  --secondary-50: #FFF3EB;
  --secondary-100: #FFD8C0;
  --secondary-200: #FFC6A2;
  --secondary-300: #FEAB78;
  --secondary-400: #FE9B5D;
  --secondary-500: #FE8235;
  --secondary-600: #E77630;
  --secondary-700: #B45C26;
  --secondary-800: #8C481D;
  --secondary-900: #6B3716;
  --grey-50: #E9E9EB;
  --grey-100: #BABDC1;
  --grey-200: #989CA3;
  --grey-300: #697079;
  --grey-400: #4C545F;
  --grey-500: #1F2937;
  --grey-600: #1C2532;
  --grey-700: #161D27;
  --grey-800: #11161E;
  --grey-900: #0D1117;
  --semantic-success-50: #EBF5E9;
  --semantic-success-100: #C0DEBA;
  --semantic-success-200: #A1CF98;
  --semantic-success-300: #76B969;
  --semantic-success-400: #5CAB4C;
  --semantic-success-500: #33961F;
  --semantic-success-600: #2E891C;
  --semantic-success-700: #246B16;
  --semantic-success-800: #1C5311;
  --semantic-success-900: #153F0D;
  --semantic-error-50: #F8E9E9;
  --semantic-error-100: #EBBCB9;
  --semantic-error-200: #E19C98;
  --semantic-error-300: #D36E68;
  --semantic-error-400: #CA524B;
  --semantic-error-500: #BD271E;
  --semantic-error-600: #AC231B;
  --semantic-error-700: #861C15;
  --semantic-error-800: #681511;
  --semantic-error-900: #4F100D;
  --semantic-purple-50: #F3EFFD;
  --semantic-purple-100: #D8CCFA;
  --semantic-purple-200: #C6B4F7;
  --semantic-purple-300: #AB92F4;
  --semantic-purple-400: #9B7DF1;
  --semantic-purple-500: #815BED;
  --semantic-purple-600: #7654D9;
  --semantic-purple-700: #5C41A9;
  --semantic-purple-800: #483383;
  --semantic-purple-900: #372764;
  --semantic-yellow-50: #FEF6E6;
  --semantic-yellow-100: #FBE2B3;
  --semantic-yellow-200: #F9D58E;
  --semantic-yellow-300: #F6C15A;
  --semantic-yellow-400: #F5B53A;
  --text-highemphasis: #1B1D20;
  --text-mediumemphasis: #697079;
  --text-lowemphasis: #989CA3;
  --text-white: #FFFFFF;
  --text-primary: #1B77E4;
  --text-success: #33961F;
  --text-error: #BD271E;
  --icon-white: #FFFFFF;
  --semantic-yellow-500: #F2A209;
  --semantic-yellow-600: #DC9408;
  --semantic-yellow-700: #AC7406;
  --semantic-yellow-800: #855A05;
  --semantic-yellow-900: #664404;
  --structural-white: #FFFFFF;
  --icon-grey1: #757575;
  --structural-primarytint: #FAFCFF;
  --structural-neutral1: #F9F9F9;
  --structural-neutral2: #FFFAFA;
  --structural-neutral3: #FAFAFA;
  --logo-color-primary: #1B77E4;
  --logo-color-secondary: #96C0F3;
}

.purple-theme {
  --primary-50: #F4EBFF;
  --primary-100: #E9D7FE;
  --primary-200: #D6BBFB;
  --primary-300: #B692F6;
  --primary-400: #9E77ED;
  --primary-500: #7F56D9;
  --primary-600: #53389E;
  --primary-700: #53389E;
  --primary-800: #42307D;
  --primary-900: #2C1C5F;
  --secondary-50: #FFF3EB;
  --secondary-100: #FFD8C0;
  --secondary-200: #FFC6A2;
  --secondary-300: #FEAB78;
  --secondary-400: #FE9B5D;
  --secondary-500: #FE8235;
  --secondary-600: #E77630;
  --secondary-700: #B45C26;
  --secondary-800: #8C481D;
  --secondary-900: #6B3716;
  --grey-50: #F2F4F7;
  --grey-100: #EAECF0;
  --grey-200: #D0D5DD;
  --grey-300: #98A2B3;
  --grey-400: #475467;
  --grey-500: #344054;
  --grey-600: #1D2939;
  --grey-700: #1D2939;
  --grey-800: #101828;
  --grey-900: #0C111D;
  --semantic-success-50: #EBF5E9;
  --semantic-success-100: #C0DEBA;
  --semantic-success-200: #A1CF98;
  --semantic-success-300: #76B969;
  --semantic-success-400: #5CAB4C;
  --semantic-success-500: #33961F;
  --semantic-success-600: #2E891C;
  --semantic-success-700: #246B16;
  --semantic-success-800: #1C5311;
  --semantic-success-900: #153F0D;
  --semantic-error-50: #F8E9E9;
  --semantic-error-100: #EBBCB9;
  --semantic-error-200: #E19C98;
  --semantic-error-300: #D36E68;
  --semantic-error-400: #CA524B;
  --semantic-error-500: #BD271E;
  --semantic-error-600: #AC231B;
  --semantic-error-700: #861C15;
  --semantic-error-800: #681511;
  --semantic-error-900: #4F100D;
  --semantic-purple-50: #F3EFFD;
  --semantic-purple-100: #D8CCFA;
  --semantic-purple-200: #C6B4F7;
  --semantic-purple-300: #AB92F4;
  --semantic-purple-400: #9B7DF1;
  --semantic-purple-500: #815BED;
  --semantic-purple-600: #7654D9;
  --semantic-purple-700: #5C41A9;
  --semantic-purple-800: #483383;
  --semantic-purple-900: #372764;
  --semantic-yellow-50: #FEF6E6;
  --semantic-yellow-100: #FBE2B3;
  --semantic-yellow-200: #F9D58E;
  --semantic-yellow-300: #F6C15A;
  --semantic-yellow-400: #F5B53A;
  --text-highemphasis: #1C1B20;
  --text-mediumemphasis: #6D6979;
  --text-lowemphasis: #9A98A3;
  --text-white: #FFFFFF;
  --text-primary: #815BED;
  --text-success: #33961F;
  --text-error: #BD271E;
  --icon-white: #FFFFFF;
  --semantic-yellow-500: #F2A209;
  --semantic-yellow-600: #DC9408;
  --semantic-yellow-700: #AC7406;
  --semantic-yellow-800: #855A05;
  --semantic-yellow-900: #664404;
  --structural-white: #FFFFFF;
  --icon-grey1: #757575;
  --structural-primarytint: #FBFAFF;
  --structural-neutral1: #F9F9F9;
  --structural-neutral2: #FFFAFA;
  --structural-neutral3: #FAFAFA;
  --logo-color-primary: #7F56D9;
  --logo-color-secondary: #D6BBFB;
}

.ag-header {
  font-family: var(--font);
  font-size: 14px;
  font-weight: 400;
  height: 20px;
  line-height: 20px;
}

.ag-header-cell lib-grid-cell {
  width: 100%;
}

.ag-header-cell-label {
  font-family: var(--font);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  margin-left: 10px;
}

.checkbox-card-group {
  display: grid;
  grid-template-columns: repeat(auto-fill, 38.875rem);
  gap: 1.75rem 2rem;
  max-width: -webkit-fill-available;
  margin-bottom: 1.5rem;
}

.form-field-helpText,
.form-field-description {
  color: var(--text-mediumemphasis, #6D6979);
  font-family: var(--font-roboto, Roboto);
  font-size: var(--small-14px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--medium-24px);
  letter-spacing: 0.5px;
  margin: 0px;
}

.form-field-title {
  color: var(--text-highemphasis, #1C1B20);
  font-family: var(--font-roboto, Roboto);
  font-size: var(--medium-22px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--medium-36px);
  margin: 0px;
}

.title-container {
  display: flex;
  flex-direction: column;
  gap: var(--small-8px);
}

.formly-field-container {
  display: flex;
  flex-direction: column;
  gap: var(--medium-24px);
}

.accordion-group-container {
  display: flex;
  flex-direction: column;
  gap: var(--small-16px);
}

.accordions-group-container {
  display: flex;
  flex-direction: column;
  gap: var(--small-16px);
}

/* for invalid input field color */
.sa-input-container .support-label.customValidationWrapper {
  color: var(--semantic-error-500, #BD271E);
  font-family: var(--font);
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: var(--small-16px);
  letter-spacing: 0.5px;
  padding: var(--small-4px) var(--small-16px) 0px 0px;
}

.sa-input-container .support-label.invalid.customValidationWrapper {
  color: var(--semantic-error-500, #BD271E);
}

.customField .customInputContainer .sa-input .sa-input-field.invalid>input,
.customField .customInputContainer .sa-input .sa-input-field.invalid sa-icon,
.customField .customInputContainer .sa-input .sa-input-field.invalid .sa-input-pretext {
  color: var(--semantic-error-500, #BD271E);
}

.customInputContainer .sa-input .sa-input-field.invalid {
  --border: 1px solid var(--semantic-error-500, #BD271E);
}

.pointer {
  cursor: pointer;
}

/* end */