/* .companyLogo {
    Ping Logo 
    content: url("https://assets.pingone.com/ux/ui-library/5.0.2/images/logo-pingidentity.png");
    width: 65px;
    height: 65px;
} */

.footerLogo {
    /* Ping Logo  */
    content: url("https://authenticator.pingone.com/pingid/assets/images/ping-logo.sm.2x.png");
    width: 105px !important;
    height: auto;
}

:root {
    /********************************************************
    * COMPANY LOGO
    *********************************************************/
    --company-logo-img-url: url("https://uploads2.pingone.com/environments/80f92113-2416-45ba-8944-a643515d04ed/images/27af542f-6e2e-4a15-a04c-9128a66861f0_78d1be7f-69e5-4e4a-b9fa-179e75253e83_original.png");
    --company-logo-max-height: 80px;

    /********************************************************
    * PAGE BACKGROUND 
    *********************************************************/
    --background-image-url: url("https://uploads2.pingone.com/environments/80f92113-2416-45ba-8944-a643515d04ed/images/e5edbf1c-e18d-464b-991d-68f7c2823c55_46bcf32a-4b5e-4ace-b3f9-f5b2365c1a71_original.png");

    /********************************************************
    * TEXT FONT COLORS
    *********************************************************/

    /*  PRIMARY FONT COLOR (RGB) */
    --text-color-primary: 24, 34, 55;

    /* HEADING FONT COLR (RBG) */
    --heading-text-color: 24, 34, 55;
    
    /*  MUTED TEXT ALPHA  */
    --text-color-muted-apha: 0.75;

    /*  ERROR FONT COLOR  */
    --text-color-error: rgb(226, 91, 101);

  /********************************************************
    * BUTTON ATTRIBUTES
    *********************************************************/

    /*  BUTTON FONT COLOR  */
    --button-primary-text-color: rgb(254, 254, 254);

    /*  BUTTON BACKGROUND COLOR (RGB)  */
    --button-primary-background-color: 0, 0, 0;
    
    /* LINK BUTTON FONT COLOR (RGB)  */
    --link-button-primary-color: 0, 0, 0;

    /* BUTTON BORDER RADIUS */
    --button-primary-border-radius: 20px;

    /*  BUTTON HOVER ALPHA  */
    --button-hover-alpha: 0.70;

    /*  BUTTON ACTIVE ALPHA  */
    --button-active-alpha: 0.80;

    /*  BUTTON DISABLED ALPHA  */
    --button-disabled-alpha: 0.65;
    
    /********************************************************
    * APPLYING TEXT COLOR - DO NOT CHANGE
    *********************************************************/
    /* H1,H2, H3, Body text color */
    --bs-body-color: rgb(var(--text-color-main)) !important;
    --bs-danger-rgb: var(--text-color-error);
    
}

/*  COMPANY LOGO  */
.card-body.p-5.d-flex.flex-column > img:first-child,
.companyLogo {
  content: var(--company-logo-img-url) !important;
  height: var(--company-logo-max-height) !important;
  width: auto !important;
}

/*  BACKGROUND IMAGE  */
div.bg-light {
  background-image:       var(--background-image-url);
  background-size:        cover;
  background-repeat:      no-repeat;
}

/*  HEADING TEXT  */
h1, h2, h3, h4 {
  color: rgb(var(--heading-text-color)) !important;
}

/*  BODY FONT & COLOR  */
.card-body {
  /*  font family */
  font-family: var(--body-font-family) !important;
  /*  font size */
  font-size: var(--body-font-size) !important;
  /*  font color */
  color: rgb(var(--text-color-primary)) !important;
  /*  background color */
  background-color: var(--card-background-color) !important;
}

/*  MUTED PARAGRAPH  */
p.text-muted {
  color: rgba(var(--text-color-primary), var(--text-color-muted-apha)) !important;
}

/*  ERROR MESSAGE PARAGRAPH  */
.card .text-danger {
  color: var(--text-color-error) !important;
}

/*  FORM CONTROL FONT COLOR  */
.form-control,
.form-control:focus {
  color: var(--text-color-primary) !important;
  border-radius: var(--form-control-border-radius) !important;
}

/*  FORM CONTROL PLACEHOLDER FONT COLOR  */
.form-floating input+label {
  color: rgba(var(--text-color-primary), var(--text-color-muted-apha)) !important;
}

/*  FORM CONTROL HIGHLIGHT  */
.form-control:focus {
  border-color: rgba(var(--focus-highlight-color), .5) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--focus-highlight-color), 0.25) !important;
}

/*  PRIMARY BUTTON  */
.btn-primary {
  /*  font color  */
  --bs-btn-color: var(--button-primary-text-color) !important;
  /*  font color when hovering  */
  --bs-btn-hover-color: var(--button-primary-text-color) !important;
  /*  border color  */
  --bs-btn-border-color: var(--button-primary-background-color) !important;
  /*  background color  */
  --bs-btn-bg: rgb(var(--button-primary-background-color)) !important;
  /*  background color when hovering  */
  --bs-btn-hover-bg: rgba(var(--button-primary-background-color), var(--button-hover-alpha)) !important;
  /*  background color when active  */
  --bs-btn-active-bg: rgba(var(--button-primary-background-color), var(--button-active-alpha)) !important;
  /*  background color when disabled  */
  --bs-btn-disabled-bg: rgba(var(--button-primary-background-color), var(--button-disabled-alpha)) !important;
  background-color: rgb(var(--button-primary-background-color)) !important;
  border-color: rgb(var(--button-primary-background-color)) !important;
  color: var(--button-primary-text-color) !important;
  border-radius: var(--button-primary-border-radius);
}


.btn-primary:hover {
  background-color: rgba(var(--button-primary-background-color), var(--button-hover-alpha)) !important;
  border-color: rgba(var(--button-primary-background-color), var(--button-hover-alpha)) !important;
  color: var(--button-primary-text-color) !important;
}

/*  LINK BUTTON  */
.btn-link {
  /*  button font color  */
  --bs-btn-color: rgb(var(--link-button-primary-color)) !important;
  /*  button font color when active  */
  --bs-btn-active-color: rgba(var(--link-button-primary-color), var(--button-active-alpha)) !important;
  /*  button font color when hovering  */
  --bs-btn-hover-color: rgba(var(--link-button-primary-color), var(--button-hover-alpha)) !important;
  /*  button font color when disabled  */
  --bs-btn-disabled-color: rgba(var(--link-button-primary-color), var(--button-disabled-alpha)) !important;
  color: rgb(var(--link-button-primary-color)) !important;
}