:root {
  --bs-body-color: #00146a;
  --bs-body-color-rgb: 0, 20, 106;
  --bs-body-bg: #f1f8f9;
  --bs-primary: #c4008b;
  --bs-primary-rgb: 196, 0, 139;
  --fg-color-primary: #ffffff;
  --primary-bg-hover: #9d006f;
  --bs-secondary-rgb: 0, 20, 106;
  --bs-secondary: #00146a;
  --fg-color-secondary: #ffffff;
  --secondary-bg-hover: #000e49;
  --notification-info-color: #0067dc;
  --bs-border-color: #cdcdcd;
  --table-header-bg-color: #f4f4f4;
  --page-title-bg-color: #5d6379;
  --page-title-fg-color: #ffffff;
  /*Variables to configure theme for menus*/
  --menu-profil-pic-border-color: var(--bs-border-color);
  /*Should be extracted from .navbar-nav > li.profile_sub. Some clients used it to hide profile menu. Valid values are block & none*/
  --menu-bg-color: transparent;
  --menu-fg-color: var(--bs-body-color);
  /*FG color of menu item. BG color will be primary.*/
  --menu-hover-bg-color: var(--bs-primary);
  /*FG color while hovering menu. BG color will be secondary.*/
  --menu-hover-fg-color: var(--fg-color-primary);
  /*FG color while hovering menu. BG color will be secondary.*/

  /* Icon color */
  --icon-color: var(--bs-primary);

  /*Variables to configure colors for tiles*/
  --tile-text-bg-color: #ffffff;
  --tile-text-fg-color: var(--bs-primary);

  /*Product list or category list*/
  --product-tile-footer-bg: #f4f4f4;
  --product-tile-footer-color: var(--bs-body-color);
  --points-display-color: var(--bs-primary);
  --product-footer-points-display-color: var(--points-display-color);

  /*Variables to configure colors for tiles*/
  --innerpage-tile-text-bg-color: #f4f4f4;
  --innerpage-tile-text-fg-color: var(--bs-body-color);

  /*Variable to configure theme for footer*/
  --footer-bg-color: var(--bs-secondary);
  --footer-fg-color: var(--fg-color-secondary);
  --footer-divider-color: var(--bs-border-color);
  /*Typography styles*/
  --h1-text-color: var(--bs-body-color);
  --h2-text-color: var(--bs-body-color);
  --h3-text-color: var(--bs-body-color);
  /*primary button style */
  --btn-primary-bgcolor: var(--bs-primary);
  --btn-primary-color: var(--fg-color-primary);
  --btn-primary-border-color: var(--bs-primary);
  --btn-primary-bgcolor-hover: var(--primary-bg-hover);
  --btn-primary-color-hover: var(--fg-color-primary);
  --btn-primary-border-color-hover: var(--btn-primary-bgcolor-hover);
  /*primary outlibe button style */
  --btn-primary-outline-bgcolor: var(--bs-white);
  --btn-primary-outline-color: var(--bs-primary);
  --btn-primary-outline-border-color: var(--bs-primary);
  --btn-primary-outline-bgcolor-hover: var(--btn-primary-bgcolor);
  --btn-primary-outline-color-hover: var(--btn-primary-color);
  --btn-primary-outline-border-color-hover: var(--btn-primary-border-color);
  /*Link style*/
  --link-color: var(--bs-primary);
  --link-decoration: none;
  --link-hover-color: var(--bs-secondary);
  /*Pop-up-model icon color*/
  --modal-x-mark-color: var(--bs-primary);
  /*User Profile Widget Buttons*/
  /* Message Button - Transparent background with pink text */
  --dash-ql-message-btn-fg: var(--fg-color-secondary);
  --dash-ql-message-btn-bg: var(--bs-secondary);
  --dash-ql-message-btn-border: var(--bs-secondary);
  --dash-ql-message-btn-fg-hover: var(--fg-color-secondary);
  --dash-ql-message-btn-bg-hover: var(--secondary-bg-hover);
  --dash-ql-message-btn-border-hover: var(--secondary-bg-hover);

  /* Service Button - White text on blue */
  --dash-ql-my-awards-btn-fg: var(--fg-color-secondary);
  --dash-ql-my-awards-btn-bg: var(--bs-secondary);
  --dash-ql-my-awards-btn-border: var(--bs-secondary);
  --dash-ql-my-awards-btn-fg-hover: var(--fg-color-secondary);
  --dash-ql-my-awards-btn-bg-hover: var(--secondary-bg-hover);
  --dash-ql-my-awards-btn-border-hover: var(--secondary-bg-hover);

  /* Anniversary Button - White text on green */
  --dash-ql-anniversary-btn-fg: var(--fg-color-secondary);
  --dash-ql-anniversary-btn-bg: var(--bs-secondary);
  --dash-ql-anniversary-btn-border: var(--bs-secondary);
  --dash-ql-anniversary-btn-fg-hover: var(--fg-color-secondary);
  --dash-ql-anniversary-btn-bg-hover: var(--secondary-bg-hover);
  --dash-ql-anniversary-btn-border-hover: var(--secondary-bg-hover);

  /* Serial Button - White text on purple */
  --dash-ql-serial-btn-fg: var(--fg-color-secondary);
  --dash-ql-serial-btn-bg: var(--bs-secondary);
  --dash-ql-serial-btn-border: var(--bs-secondary);
  --dash-ql-serial-btn-fg-hover: var(--fg-color-secondary);
  --dash-ql-serial-btn-bg-hover: var(--secondary-bg-hover);
  --dash-ql-serial-btn-border-hover: var(--secondary-bg-hover);

  /* Empty message box */
  --empty-msg-box-bg: #f4f4f4;

  /* Welcome banner theme */
  --welcome-banner-content-visibility: block;
  --welcome-banner-content-bg-color: var(--bs-primary);
  --welcome-banner-bg-opacity: 1;
  --welcome-banner-content-title-text-color: var(--fg-color-primary);
  --welcome-banner-content-title-text-size: 16px;
  --welcome-banner-content-text-color: var(--fg-color-primary);
  --welcome-banner-content-text-size: 16px;

  /* Login background opacity */
  --login-bg-opacity: 0.8;

  /* Awardee News */
  --awardee-news-height-type: 2;
  --awardee-news-custom-height: 280;

  /* Nomination band points */
  --nomination-band-point-visibility: block;

  /*To hide/ show YOS text on profile box */
  --profile-service-year-text-visibility: block;

  /*To hide/ show forgot passward link*/
  --forgot-password-link-visibility: flex;

  /* Welcome page styles */
  --welcome-page-bg-color: #ffffff;
  --welcome-page-font-color: var(--bs-body-color);
  --welcome-page-title-font-color: var(--bs-body-color);

  --btn-welcome-page-bgcolor: var(--btn-primary-bgcolor);
  --btn-welcome-page-color: var(--btn-primary-color);
  --btn-welcome-page-border-color: var(--btn-primary-border-color);
  --btn-welcome-page-bgcolor-hover: var(--btn-primary-bgcolor-hover);
  --btn-welcome-page-color-hover: var(--btn-primary-color-hover);
  --btn-welcome-page-border-color-hover: var(--btn-primary-border-color-hover);

  /* Single redemption pop up styles */
  --single-redemption-popup-bg-color: #ffffff;
  --single-redemption-popup-font-color: var(--bs-body-color);
  --single-redemption-popup-title-font-color: var(--bs-body-color);

  --btn-single-redemption-popup-bgcolor: var(--btn-primary-bgcolor);
  --btn-single-redemption-popup-color: var(--btn-primary-color);
  --btn-single-redemption-popup-border-color: var(--btn-primary-border-color);
  --btn-single-redemption-popup-bgcolor-hover: var(--btn-primary-bgcolor-hover);
  --btn-single-redemption-popup-color-hover: var(--btn-primary-color-hover);
  --btn-single-redemption-popup-border-color-hover: var(
    --btn-primary-border-color-hover
  );

  --btn-single-redemption-popup-outline-bgcolor: #ffffff;
  --btn-single-redemption-popup-outline-color: var(--bs-primary);
  --btn-single-redemption-popup-outline-border-color: var(--bs-primary);
  --btn-single-redemption-popup-outline-bgcolor-hover: var(
    --btn-primary-bgcolor
  );
  --btn-single-redemption-popup-outline-color-hover: var(--btn-primary-color);
  --btn-single-redemption-popup-outline-border-color-hover: var(
    --btn-primary-border-color
  );

  /* Celebration view styles */
  --celebration-view-bg-color: #ffffff;
  --celebration-view-font-color: var(--bs-body-color);
  --celebration-view-title-font-color: var(--bs-body-color);
}
