/* SecurityTalent member experience refinements — release 1.9.64. */

:root {
  --st-member-ink: #0f3338;
  --st-member-teal: #087f84;
  --st-member-aqua: #28a7ad;
  --st-member-pale: #eef8f7;
  --st-member-line: #badad6;
  --st-member-gold: #e4ae35;
  --st-member-orange: #ff4b22;
}

/* A brighter, people-centred sign-in experience with strong form contrast. */
body.st-easysocial-login-page #sp-component,
body.st-easysocial-login-page main #fd {
  position: relative;
}

body.st-easysocial-login-page #sp-component {
  overflow: hidden;
  border: 1px solid var(--st-member-line);
  border-radius: 26px;
  background:
    linear-gradient(90deg, rgba(239, 250, 249, .98) 0%, rgba(239, 250, 249, .90) 44%, rgba(255, 255, 255, .70) 100%),
    url('../images/securitytalent-auth-collaboration-1.9.64.png') 50% 50% / cover no-repeat;
  box-shadow: 0 22px 52px rgba(15, 51, 56, .12);
}

body.st-easysocial-login-page #sp-component::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(8, 127, 132, .07), transparent 56%);
}

body.st-easysocial-login-page .st-auth-experience,
body.st-easysocial-login-page #fd .es-login-box,
body.st-easysocial-login-page #fd [class*='login-form'] {
  position: relative;
  z-index: 1;
}

body.st-easysocial-login-page #fd .es-login-box,
body.st-easysocial-login-page #fd [class*='login-form'] form,
body.st-easysocial-login-page #fd form.st-member-form-card {
  border: 1px solid rgba(8, 127, 132, .26);
  border-radius: 20px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 18px 42px rgba(15, 51, 56, .16);
}

/* EasySocial profile registration presented as one calm, guided card. */
body.st-easysocial-registration-page #sp-component {
  padding: clamp(18px, 3vw, 44px);
  border: 1px solid var(--st-member-line);
  border-radius: 28px;
  background: linear-gradient(145deg, #f8fcfb, var(--st-member-pale));
  box-shadow: 0 22px 52px rgba(15, 51, 56, .10);
}

body.st-easysocial-registration-page #fd form,
body.st-easysocial-registration-page #fd .es-register,
body.st-easysocial-registration-page #fd .es-register-form,
body.st-easysocial-registration-page #fd .es-profile-form,
body.st-easysocial-registration-page #fd .st-member-form-card {
  overflow: hidden;
  border: 1px solid var(--st-member-line);
  border-radius: 22px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 16px 38px rgba(15, 51, 56, .09);
}

body.st-easysocial-registration-page #fd fieldset,
body.st-easysocial-registration-page #fd .es-fieldset,
body.st-easysocial-registration-page #fd [class*='form-section'] {
  margin: 0 0 20px;
  padding: clamp(20px, 3vw, 34px);
  border: 1px solid rgba(8, 127, 132, .16);
  border-radius: 18px;
  background: var(--st-member-pale);
}

body.st-easysocial-registration-page #fd legend,
body.st-easysocial-registration-page #fd .es-fieldset__title,
body.st-easysocial-registration-page #fd [class*='form-title'] {
  color: var(--st-member-ink);
  font-weight: 800;
}

body.st-easysocial-registration-page #fd input:not([type='checkbox']):not([type='radio']),
body.st-easysocial-registration-page #fd select,
body.st-easysocial-registration-page #fd textarea {
  min-height: 48px;
  border: 1px solid #bdd6d3;
  border-radius: 10px;
  background: #fff;
  color: var(--st-member-ink);
  box-shadow: inset 0 1px 2px rgba(15, 51, 56, .04);
}

body.st-easysocial-registration-page #fd input:focus,
body.st-easysocial-registration-page #fd select:focus,
body.st-easysocial-registration-page #fd textarea:focus {
  border-color: var(--st-member-aqua);
  outline: 3px solid rgba(40, 167, 173, .16);
}

.st-hide-member-social-proof {
  display: none !important;
}

/* Branded Marketplace empty state; replaces the anonymous gray shop glyph. */
.st-marketplace-empty-icon {
  display: grid;
  width: 92px;
  height: 92px;
  margin: 18px auto 24px;
  place-items: center;
  border: 1px solid rgba(8, 127, 132, .26);
  border-radius: 28px;
  background: linear-gradient(145deg, #f7fcfb, #dff4f2);
  box-shadow: 0 16px 34px rgba(15, 51, 56, .12);
}

.st-marketplace-empty-icon svg {
  width: 58px;
  height: 58px;
}

/* Native EasySocial job stories created from published EJM jobs. */
.st-job-stream-card {
  display: grid;
  grid-template-columns: minmax(76px, 124px) minmax(0, 1fr);
  gap: 18px;
  margin-top: 14px;
  padding: 18px;
  border: 1px solid var(--st-member-line);
  border-radius: 18px;
  background: linear-gradient(145deg, #fff, var(--st-member-pale));
}

.st-job-stream-card__image {
  width: 100%;
  max-height: 104px;
  border-radius: 14px;
  object-fit: contain;
  background: #fff;
}

.st-job-stream-card__body {
  min-width: 0;
}

.st-job-stream-card__title {
  margin: 0 0 .35rem;
  color: var(--st-ink);
  font-size: clamp(1.05rem, 1.5vw, 1.3rem);
  line-height: 1.25;
}

.st-job-stream-card__employer {
  display: block;
  margin-bottom: 6px;
  color: var(--st-member-teal);
}

.st-job-stream-card__body p {
  margin: 0 0 12px;
  color: #48656a;
}

.st-job-stream-card__link {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  padding: 8px 15px;
  border-radius: 999px;
  background: var(--st-member-teal);
  color: #fff !important;
  font-weight: 750;
  text-decoration: none !important;
}

.st-job-stream-card__link:hover,
.st-job-stream-card__link:focus-visible {
  background: var(--st-member-ink);
}

@media (max-width: 767.98px) {
  body.st-easysocial-login-page #sp-component {
    border-radius: 18px;
    background-position: 58% 50%;
  }

  body.st-easysocial-registration-page #sp-component {
    padding: 12px;
    border-radius: 18px;
  }

  body.st-easysocial-registration-page #fd fieldset,
  body.st-easysocial-registration-page #fd .es-fieldset,
  body.st-easysocial-registration-page #fd [class*='form-section'] {
    padding: 16px;
  }

  .st-job-stream-card {
    grid-template-columns: 1fr;
  }

  .st-job-stream-card__image {
    max-width: 140px;
  }
}