/* 1. IMPORT TYPEKIT PROJECT HERE */
/* Replace XXXXXXX with your actual Typekit Project ID */
@import url("https://use.typekit.net/bnd3zyr.css");

/* stylelint-disable block-no-empty */
/* stylelint-disable max-empty-lines */

:root {
  /* Ensure the name 'hagrid-text' matches your Adobe project exactly */
  --fontFamily: "hagrid-text", sans-serif;
  --borderRadiusContainer: 0rem;
  --borderRadiusControl: 0.75rem;
  --borderRadiusButton: 1rem;
  --borderWidthBold: 1px;
  --widthMaxJobBoard: none;

  --colorAppBackground: transparent;

  --colorWhiteSand:#F9F8FA;
  --colorElectricBlue: #2E4EF2;
  --colorRoyal: #231483;
  --colorBlack60:rgba(0, 0, 0, 0.6);
  --colorBlack40: rgba(0, 0, 0, 0.4);
  --colorGray: #D9D8D9;
  --colorBlackBeard: #0C0326;
  --colorMediumBlue:#2E21BC;
  --colorClavaria: #926BEE;
  --colorPower:#C5F35A;
  --colorRuby: #F96390;

  --colorNegative200: #FEF3F2;
  --colorPositive200: #ECFDF3;
  --colorWarning800: #93370D;
  --colorWarning600: #FDB022;
  --colorNegative600: #B42318;
  --colorPositive600: #29b458;
  --colorWarning900: #93370D;
}

/* Apply the font to the entire body */
body {
  font-family: var(--fontFamily) !important;
  background-color: transparent !important;
}

/* Rest of your existing styles... */
button {
  font-family: var(--fontFamily) !important;
  box-shadow: none !important;
  padding: 1rem 1.5rem !important;
  border-radius: 1rem !important;
  transition-property: color, background-color, border-color !important;
  transition-duration: 400ms, 400ms, 400ms !important;
  transition-timing-function: ease-out, ease-out, ease-out !important;
  font-weight: 700 !important;
}

.ashby-application-form-container {
  background-color:  var(--colorWhiteSand);
  box-shadow: none;
  padding: 0rem;
}

.ashby-application-form-failure-container {
  background-color:  var(--colorWhiteSand);
  box-shadow: none;
}

.ashby-application-form-field-entry {
  margin-bottom: 1.5rem !important;
}

.ashby-application-form-field-entry input, 
.ashby-application-form-field-entry textarea,
.ashby-application-form-field-entry select {
    width: 100%;
    padding: 1rem 1rem;
    border: 1px solid var(--colorClavaria);
    background-color: var(--colorWhiteSand);
    border-radius: var(--borderRadiusControl);
    font-size: 1rem;
    color: var(--colorBlackBeard);
    outline: none;
}

.ashby-application-form-field-entry input::placeholder,
.ashby-application-form-field-entry textarea::placeholder {
  color: var(--colorBlack40);
}

.ashby-application-form-field-entry input:focus-within,
.ashby-application-form-field-entry textarea:focus-within,
.ashby-application-form-field-entry select:focus-within {
  outline: none !important;
  border-color: var(--colorElectricBlue) !important;
  box-shadow: none !important;
}

.ashby-application-form-field-entry input:hover,
.ashby-application-form-field-entry textarea:hover,
.ashby-application-form-field-entry select:hover {
  border-color: var(--colorElectricBlue);
}

.ashby-application-form-question-title {
  font-size: 1rem;
  font-weight: 400;
  color: var(--colorRoyal);
  margin-bottom: 0.5rem;
}

.ashby-application-form-question-title::after {
  color: var(--colorRuby);
}

.ashby-application-form-section-header-title {
  font-size: 2rem;
  color: var(--colorBlackBeard);
}

.ashby-application-form-submit-button {
  position: relative;
  padding: 1rem 2.5rem;
  border-radius: 1rem;
  background-color: var(--colorElectricBlue);
  transition-property: color, background-color;
  transition-duration: 400ms, 400ms;
  transition-timing-function: ease-out, ease-out;
  color: var(--colorWhiteSand);
  font-size: 1.25rem;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  box-shadow: none;
  border: none;
  margin-top: 3rem;
}

.ashby-application-form-submit-button:hover {
  box-shadow: none;
  background-color: var(--colorMediumBlue);
}

.ashby-application-form-submit-button svg {
  display: none;
}

.ashby-application-form-success-container {
  padding: 2rem;
  border-radius: 2rem;
  background-color: var(--colorPower);
  color: var(--colorBlackBeard);
  box-shadow: none;
  text-align: center;
  font-size: 1.3125rem;
  line-height: 1.34;
  font-weight: 700;
  letter-spacing: 0em;
}

@media screen and (max-width: 767px) {
  .form_message-success {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
  }
}

.ashby-application-form-success-container h2 {
  display: none;
}

.ashby-application-form-container [role="alert"] {
  padding: 0rem;
  background-color: var(--colorWhiteSand);
  color: var(--colorRuby);
  box-shadow: none;
  font-size: 1rem;
  margin-bottom: 0rem;
}

.ashby-application-form-container [role="alert"] h2 {
  padding: 0rem;
  background-color: transparent !important;
  color: var(--colorRuby);
  box-shadow: none;
  font-size: 1rem;
  margin-bottom: 0rem;
  font-weight: 700;
}

.ashby-application-form-autofill-input-description {
  color: var(--colorBlackBeard) !important;
}

.ashby-application-form-autofill-input-root {
  width: 100% !important;
  padding: 1.5rem 1.5rem !important;
  border: 1px solid var(--colorClavaria) !important;
  background-color: var(--colorWhiteSand) !important;
  border-radius: var(--borderRadiusControl) !important;
  font-size: 1rem !important;
  color: var(--colorBlackBeard) !important;
  outline: none !important;
}

.ashby-application-form-autofill-input-title {
  font-size: 1.25rem !important;
  color: var(--colorBlackBeard) !important;
  font-weight: 700 !important;
}