/* ==========================================================
   CERTIFICATE
   ========================================================== */

.CertCertifiedText,
.CertLearnerName,
.CertHasCompletedText,
.CertHasCompletedText span,
.CertAwardedByName,
.CertAwardedByTitle,
.CertExpiration {
  display: none !important;
}


/* ==========================================================
   CERTIFICATE TOP BAR
   ========================================================== */

.TopBlueBar {
  background-color: #ffefe6 !important;
}


/* ==========================================================
   CERTIFICATE WRAPPER
   ========================================================== */

.CertBodyWrapper {
  position: relative !important;
}


/* ==========================================================
   CERTIFICATE DATE
   Body / metadata = Inter
   ========================================================== */

.CertEarnedOn {
  position: absolute !important;
  top: 1.5rem !important;
  right: -6rem !important;

  font-family: "Inter", Arial, sans-serif !important;
  font-size: 18px !important;

  color: #555 !important;
  text-align: right !important;
}

.CertEarnedOn .Label {
  display: none !important;
  text-align: right !important;
}

.CertEarnedOn .Value {
  font-family: "Inter", Arial, sans-serif !important;
  font-weight: bold !important;
  white-space: pre-wrap !important;
}

.CertEarnedOn .Value::before {
  content: "Certified on\A" !important;

  font-family: "Inter", Arial, sans-serif !important;
  font-weight: normal !important;
}


/* ==========================================================
   LEARNER NAME
   Prominent/title treatment = Work Sans
   ========================================================== */

.CertLearnerName {
  display: block !important;

  text-align: center !important;

  font-family: "Work_Sans", "Work Sans", Arial, sans-serif !important;
  font-size: clamp(35px, 3vw, 75px) !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;

  color: #ff5f00 !important;

  margin: 0.5rem !important;
}


/* ==========================================================
   "DEXT PROUDLY CERTIFIES"
   Heading = Work Sans
   ========================================================== */

.CertCertifiedText {
  display: block !important;
  position: relative !important;

  text-align: center !important;

  font-family: "Work_Sans", "Work Sans", Arial, sans-serif !important;
  font-size: 22px !important;
  font-weight: bold !important;

  margin-bottom: -0.5rem !important;
  padding-top: 3rem !important;

  color: transparent !important;
}

.CertCertifiedText::before {
  content: "Dext proudly certifies" !important;

  position: absolute !important;
  top: 50% !important;
  left: 50% !important;

  transform: translate(-50%, -50%) !important;

  padding-top: 3rem !important;
  margin-bottom: -0.5rem !important;

  font-family: "Work_Sans", "Work Sans", Arial, sans-serif !important;
  font-weight: bold !important;

  color: #000000 !important;

  white-space: nowrap !important;
}


/* ==========================================================
   CERTIFICATION TITLE
   Heading = Work Sans
   ========================================================== */

.CertHasCompletedText {
  display: block !important;
  position: relative !important;

  text-align: center !important;

  font-family: "Work_Sans", "Work Sans", Arial, sans-serif !important;
  font-size: 32px !important;

  color: transparent !important;
}

.CertHasCompletedText::after {
  content: "Dext Certified Expert" !important;

  position: absolute !important;
  top: 50% !important;
  left: 50% !important;

  transform: translate(-50%, -50%) !important;

  font-family: "Work_Sans", "Work Sans", Arial, sans-serif !important;
  font-weight: bold !important;

  color: #000000 !important;

  white-space: nowrap !important;
}


/* ==========================================================
   ACADEMY
   ========================================================== */

.AL_Custom_Footer {
  size: 0px;
}


/* Main page headings = Work Sans */
.AL_Custom_BannerMainHeading {
  font-family: "Work_Sans", "Work Sans", Arial, sans-serif !important;
}


/* Banner description/subheading = Inter */
.AL_Custom_BannerSubHead {
  font-family: "Inter", Arial, sans-serif !important;
  color: #440801 !important;
}


/* ==========================================================
   CERTIFICATE BACKGROUND IMAGE
   ========================================================== */

.CustomCertificationBackgroundImage-sc-ee063dd1-14 {
  top: 0 !important;
  height: 100% !important;
}


/* ==========================================================
   COURSE TILES
   Titles = Work Sans
   ========================================================== */

.AL_Custom_CardTitle {
  font-family: "Work_Sans", "Work Sans", Arial, sans-serif !important;
  color: #440800 !important;
}


/* Course descriptions/body = Inter */
.AL_Custom_CardDescription {
  font-family: "Inter", Arial, sans-serif !important;
}

/* ==========================================================
   LEARNING PATH / MODULE CARD ACCENTS
   Blue lines -> burgundy
   ========================================================== */

/* Top accent line on path/module cards */
.AL_Custom_PathCard,
.AL_Custom_PathStepCard,
.AL_Custom_PCCard {
  border-top-color: #440801 !important;
}

/* If WorkRamp draws the top accent as a pseudo-element or inner bar */
.AL_Custom_PathCard::before,
.AL_Custom_PathStepCard::before,
.AL_Custom_PCCard::before {
  background-color: #440801 !important;
  border-color: #440801 !important;
}

/* Timeline / connector / dots between cards */
.AL_Custom_PathConnector,
.AL_Custom_PathConnectorDot,
.AL_Custom_PathProgressLine,
.AL_Custom_PathProgressDot {
  background-color: #440801 !important;
  border-color: #440801 !important;
}

/* ==========================================================
   PATH / CERTIFICATION MODULE BOX
   Top progress bar -> Dext burgundy
   ========================================================== */

.AL_Custom_PCModuleBox {
  border-top-color: #440801 !important;
}