/* EL in-store IAM Theme's roles */
:root,
body,
body .elc-iam,
body .elc-ramp {
  --text-base: 15px;
  --font-headline: 'AkzidenzGrotesk W1G', 'Times New Roman', serif;
  --title-font: OptimaDisplayLight, 'Times New Roman', serif;
  --brand-text-transform: uppercase;
  --button-font-weight: bold;
  --color-error: #da1e28;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-green: #087443;
  --color-gray: #555555;
  --color-body-minimal-bg: var(--color-bg);
  --border-radius: 3px;
  --border-current: var(--color-gray-80);
  --border-otp: var(--color-gray-80);
  --color-mobile-footer-bg: var(--color-primary);

  --color-primary-100: #efefef;
  --color-primary-300: #e2e1e1;
  --color-primary-400: #d4d4d4;
  --color-primary-500: #666666;
  --color-primary-600: #999999;
  --color-primary-700: #000000a3;
  --color-primary-900: var(--color-primary);
  --color-secondary: #a3a3a3;
  --color-secondary-300: #3f3f3f;
  --color-warning: #e06800;
  --color-warning-background: #fffcf2;
  --color-otp: var(--color-primary);

  --font-body--bold: var(--font-body);

  /* customize iam/roles */
  --bg-tab-hover: var(--color-secondary);
  --container-border-radius: 8px;
  --border-current: var(--color-primary-100);
  --crossed-eye-bg: var(--color-primary-900);
  --button-hover-background-color: var(--color-secondary);

  --iam-disclaimer-tooltip-border: var(--color-primary-250);
  --iam-disclaimer-tooltip-background: var(--color-primary-250);

  --iam-alert-warning-color: var(--color-el-blue-line-navy);

  --error-container-bg: #fdf2f2;
  --error-container-border: #f8cccc;
}

input.elc-input-field:hover,
input.elc-textarea:hover,
input.elc-floating-label-input-field:hover,
body .react-tel-input .form-control:hover,
.elc-dropdown .elc-dropdown-readonly-input:hover,
.elc-dropdown-option:hover,
.elc-iam.elc-iam-in-store .elc-dropdown-option {
  color: var(--color-primary);
}

.elc-iam .elc-dropdown-wrapper,
.elc-iam .elc-input-field {
  --form-input-border-color: var(--color-el-all-medium-grey);
}

.elc-dropdown .elc-dropdown-wrapper {
  border-radius: 0;
}

body .elc-dropdown-options-list {
  padding-inline-start: 0;
}

body .elc-iam .elc-button {
  --button-background-color: var(--color-primary);
  --button-hover-background-color: var(--color-primary);
  --button-active-background-color: var(--color-primary);
  border-radius: 0;
}

body .elc-iam .elc-iam-wrapper {
  background-color: var(--color-white);
  border-radius: var(--container-border-radius);
}

body .elc-iam-wrapper a {
  color: var(--color-primary-700);
}

body .elc-iam-wrapper a:hover {
  color: var(--color-primary-500);
}

body .elc-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab {
  height: 64px;
  padding: 20px;
  margin-block-start: 0;
  border-block-end: 3px solid var(--color-el-all-medium-grey);
}

@media (min-width: 1024px) {
  body .elc-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab {
    margin-block-start: 20px;
  }
}

body .elc-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab.elc-tabs__tab--current {
  border-block-end: 3px solid var(--color-el-blue-line-navy);
}

body .elc-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab .elc-tabs__tab-text {
  line-height: 100%;
  font-weight: 700;
  font-family: var(--font-body--bold);
  font-size: var(--text-sm);
  color: var(--color-primary-500);
  text-transform: uppercase;
  letter-spacing: 1.8px;
}

body .elc-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab.elc-tabs__tab--current .elc-tabs__tab-text {
  color: var(--color-primary);
}

body .elc-iam .elc-iam-wrapper .elc-tabs__panel .elc-iam-title .elc-iam-title-text {
  font-size: var(--text-lg);
}

body .elc-iam .elc-iam-wrapper .elc-tabs__panel input {
  --form-input-border-color: var(--color-el-all-medium-grey);
  color: var(--color-primary);
}

body .elc-iam .elc-iam-wrapper .elc-tabs__panel input.elc-floating-label-input-errorField {
  color: var(--color-error);
}

body .elc-iam .elc-iam-wrapper .elc-tabs__panel .elc-dropdown-arrow {
  inline-size: auto;
}

body .elc-iam .elc-iam-wrapper .elc-tabs__panel .elc-dropdown-arrow-icon {
  margin-inline-start: 10px;
  margin-inline-end: 10px;
}

body .elc-iam .elc-input-error p,
.elc-iam .elc-input-field {
  font-family: var(--font-body);
}

body .elc-iam .elc-iam-label,
body .elc-iam .elc-checkbox-label,
body .elc-iam .elc-checkbox-label a,
body .elc-iam-consent-form-wrapper .elc-iam-text,
body .elc-iam-consent-form-wrapper div,
body .elc-iam .elc-social-wrapper-message,
body .elc-iam .elc-social-wrapper-message a,
body .elc-iam .elc-iam-text-acceptPrivacyPolicyAndTnc,
body .elc-iam .elc-iam-text-acceptPrivacyPolicyAndTnc a {
  color: var(--color-primary);
}

body .elc-iam .elc-floating-label-string,
body .elc-iam .elc-floating-label-string span {
  padding: 0 2px;
  color: var(--color-primary);
}

body .elc-iam .elc-iam-label {
  font-size: var(--text-base);
}

body .elc-iam .elc-iam-wrapper .elc-tabs__panel .elc-iam-forgot-password-button {
  font-size: var(--text-base);
  letter-spacing: 0.25px;
}

body .elc-iam .elc-iam-forgot-password-button:hover {
  color: var(--button-hover-background-color);
}

body .elc-iam .elc-iam-wrapper .elc-tabs__panel .elc-checkbox-selected .elc-checkbox-icon,
body .elc-iam .elc-iam-wrapper .elc-iam-consent-form-wrapper .elc-checkbox-selected .elc-checkbox-icon {
  background-color: var(--color-primary);
}

body .elc-iam .elc-checkbox-label {
  --checkbox-label-font-size: var(--text-sm);
}

body .elc-iam-consent-form-wrapper .elc-iam-text,
body .elc-iam-text-mandatory {
  font-family: var(--font-body);
}

.elc-iam .elc-iam-title .elc-iam-title-text {
  font-size: var(--text-lg);
  font-weight: 700;
}

/* elc input fields */
.elc-floating-label-input,
.elc-input-field,
.elc-dropdown,
.elc-textarea {
  --form-input-background: var(--color-el-blue-line-white);
  --form-input-background-disabled: var(--color-el-all-light-grey);
  --form-input-border-color: var(--color-el-all-medium-grey);
  --form-input-border-color-focus: var(--color-el-blue-line-navy);
  --form-input-border-color-disabled: var(--color-el-all-medium-grey);
  --form-input-color: var(--color-el-all-dark-grey);
  --form-input-color-disabled: var(--color-el-all-dark-grey);
}

.elc-iam .elc-dropdown-option,
.elc-iam .elc-dropdown-readonly-input,
.elc-iam.elc-iam-in-store .elc-dropdown-option {
  font-size: var(--text-base);
}

body .elc-iam .elc-iam-text-acceptPrivacyPolicyAndTnc {
  margin-block-start: 15px;
  line-height: 17px;
}

body .elc-iam .elc-social-wrapper-divider-text {
  color: var(--color-primary);
  font-size: var(--text-sm-2);
}

body .elc-iam-in-store .elc-social-wrapper-divider-text {
  font-size: var(--text-lg);
  color: var(--color-black);
  font-weight: 700;
}

body .elc-iam .elc-iam-social-button-facebook {
  text-transform: none;
}

.iam-loyalty .elc-iam-loyaltyCallout-wrapper::before {
  background: none;
  content: unset;
  min-width: none;
}

body .iam-loyalty .elc-iam-section-loyaltySection-wrapper .elc-iam-loyaltyCallout-wrapper p {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

body .iam-loyalty .elc-iam-section-loyaltySection-wrapper .elc-iam-acceptLoyaltyTerms-wrapper p,
body .iam-loyalty .elc-iam-section-loyaltySection-wrapper .elc-iam-acceptLoyaltyTerms-wrapper p a {
  font-family: var(--font-body);
  color: var(--color-primary);
}

body .elc-iam-in-store .elc-iam-submit-button-wrapper button,
body .elc-iam-in-store .elc-iam-submit-button-wrapper button:hover,
body .elc-iam-triage-overlay .elc-button:not(.elc-iam-forgot-password-link),
body .elc-iam-triage-overlay .elc-button:not(.elc-iam-forgot-password-link):hover {
  font-size: 14px;
  border-radius: 0;
  font-weight: 700;
}

body .elc-iam-triage-overlay .elc-iam-triage-login-form .elc-iam-password-wrapper .elc-input-error {
  margin-block-end: 0;
}

body .elc-iam-in-store .elc-iam-thank-you .elc-heading--3 {
  font-family: var(--font-body);
  font-size: var(--text-xl);
}

body .elc-iam-in-store .elc-iam-thank-you-login .elc-iam-submit-button {
  margin-block-start: 0;
}

body .elc-iam .elc-iam-checkboxGroup-rows-wrapper .elc-iam-checkbox-group-toggle {
  display: none;
}

body .elc-iam .elc-iam-checkboxGroup-rows-wrapper .elc-iam-checkbox-group-toggle:checked+.elc-iam-checkbox-group-items {
  max-height: 100vh;
}

.elc-iam-center-message-view-container {
  color: var(--color-el-blue-line-navy);
}

.elc-iam-alert .elc-iam-alert-title {
  font-size: var(--text-sm);
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.elc-iam-alert.elc-iam-alert-info .elc-iam-alert-icon::after {
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNSAwQzUuNTA5MDQgMCAzLjYwMjQxIDAuNzg5MTU3IDIuMTk1NzggMi4xOTU3OEMwLjc4OTE1NyAzLjYwMjQxIDAgNS41MDkwNCAwIDcuNUMwIDkuNDkwOTYgMC43ODkxNTcgMTEuMzk3NiAyLjE5NTc4IDEyLjgwNDJDMy42MDI0MSAxNC4yMTA4IDUuNTA5MDQgMTUgNy41IDE1QzkuNDkwOTYgMTUgMTEuMzk3NiAxNC4yMTA4IDEyLjgwNDIgMTIuODA0MkMxNC4yMTA4IDExLjM5NzYgMTUgOS40OTA5NiAxNSA3LjVDMTUgNi4xODM3MyAxNC42NTM2IDQuODkxNTcgMTMuOTk3IDMuNzVDMTMuMzM3MyAyLjYwODQzIDEyLjM5MTYgMS42NjI2NSAxMS4yNSAxLjAwMzAxQzEwLjEwODQgMC4zNDYzODYgOC44MTMyNSAwIDcuNSAwWk04LjgyODMxIDEwLjY0NzZMOC43Mzc5NSAxMC45NTE4QzguNzIyODkgMTEuMDA2IDguNjg5NzYgMTEuMDU0MiA4LjY0NzU5IDExLjA4NzNDOC4xMjk1MiAxMS40ODQ5IDcuNDY5ODggMTEuNjM4NiA2LjgzMTMzIDExLjUxMkw2LjgzNzM1IDExLjUwM0M2LjgyMjI5IDExLjUgNi44MDQyMiAxMS40OTcgNi43ODYxNCAxMS40OTFDNi41MjEwOCAxMS40Mjc3IDYuMjk1MTggMTEuMjU5IDYuMTUzNjEgMTEuMDI0MUM2LjAxNTA2IDEwLjc5MjIgNS45NzI4OSAxMC41MTIgNi4wMzYxNCAxMC4yNDdMNi43NSA3LjM3OTUyQzYuOTIxNjkgNi42ODk3NiA2LjE2NTY2IDYuODU1NDIgNS44NTI0MSA2Ljk0ODhDNS44MjUzIDYuOTU3ODMgNS43OTgxOSA2Ljk0ODggNS43ODAxMiA2LjkzMDcyQzUuNzYyMDUgNi45MTI2NSA1Ljc1MzAxIDYuODg1NTQgNS43NjIwNSA2Ljg1ODQzTDUuODUyNDEgNi41NTQyMkM1Ljg2NzQ3IDYuNSA1LjkwMDYgNi40NTE4MSA1Ljk0Mjc3IDYuNDE4NjdDNi40NjA4NCA2LjAyMTA4IDcuMTIwNDggNS44Njc0NyA3Ljc1OTA0IDUuOTkzOThDNy43NTkwNCA1Ljk5Mzk4IDcuNzk4MTkgNi4wMDMwMSA3LjgxOTI4IDYuMDA2MDJDOC4wODQzNCA2LjA2OTI4IDguMzEwMjQgNi4yMzc5NSA4LjQ1MTgxIDYuNDcyODlDOC41OTAzNiA2LjcwNDgyIDguNjMyNTMgNi45ODQ5NCA4LjU2OTI4IDcuMjVMNy44MTkyOCAxMC4yNzExQzcuNzg2MTQgMTAuNzkyMiA4LjQ0ODggMTAuNjQ3NiA4LjczNzk1IDEwLjU1NzJDOC43NjUwNiAxMC41NDgyIDguNzkyMTcgMTAuNTU3MiA4LjgxMDI0IDEwLjU3NTNDOC44MjgzMSAxMC41OTM0IDguODM3MzUgMTAuNjIzNSA4LjgyODMxIDEwLjY0NzZaTTguMTY1NjYgNS41ODQzNEM3Ljg4MjUzIDUuNTg0MzQgNy42MDg0MyA1LjQ3Mjg5IDcuNDA2NjMgNS4yNzEwOEM3LjIwNDgyIDUuMDY5MjggNy4wOTMzNyA0Ljc5ODE5IDcuMDkzMzcgNC41MTIwNUM3LjA5MzM3IDQuMjI4OTIgNy4yMDQ4MiAzLjk1NDgyIDcuNDA2NjMgMy43NTMwMUM3LjYwODQzIDMuNTUxMiA3Ljg3OTUyIDMuNDM5NzYgOC4xNjU2NiAzLjQzOTc2QzguNDQ4OCAzLjQzOTc2IDguNzIyODkgMy41NTEyIDguOTI0NyAzLjc1MzAxQzkuMTI2NTEgMy45NTQ4MiA5LjIzNzk1IDQuMjI1OSA5LjIzNzk1IDQuNTEyMDVDOS4yMzc5NSA0Ljc5NTE4IDkuMTI2NTEgNS4wNjkyOCA4LjkyNDcgNS4yNzEwOEM4LjcyMjg5IDUuNDcyODkgOC40NTE4MSA1LjU4NDM0IDguMTY1NjYgNS41ODQzNFoiIGZpbGw9IiMwNDBBMkIiLz4KPC9zdmc+Cg==');
}

.elc-iam-alert .elc-iam-alert-content {
  letter-spacing: 0.3px;
}

body .vulcan-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab .elc-tabs__tab-text {
  color: #a4a4ab;
  font-size: 0.9375rem;
  font-weight: 400;
  text-transform: unset;
  letter-spacing: 0.01875rem;
}

body .vulcan-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab {
  border-width: 1px;
  height: 51px;
}

body .vulcan-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab.elc-tabs__tab--current .elc-tabs__tab-text {
  font-weight: 700;
}

body .vulcan-iam .elc-iam-wrapper .elc-tabs__panel .elc-iam-forgot-password-button {
  color: var(--color-primary);
  font-size: 0.9375rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0.01875rem;
}

body .vulcan-iam .elc-iam-wrapper a {
  color: var(--color-primary);
}

body .vulcan-iam .elc-iam-wrapper a:hover {
  color: var(--color-black);
}

body .vulcan-iam .iam-loyalty .elc-iam-loyaltyCallout-wrapper::after {
  --iam-loyalty-color: #A4A4AB;
  bottom: 2px;
}

body .vulcan-iam .iam-loyalty .elc-iam-section-loyaltySection-wrapper {
  --iam-loyalty-background: #EBEAEF;
  padding-block-start: 16px;
}

body .vulcan-iam .iam-loyalty .elc-iam-section-loyaltySection-wrapper .elc-iam-acceptLoyaltyTerms-wrapper .elc-checkbox {
  margin-block-start: 4px;
}

body .vulcan-iam .iam-loyalty .elc-iam-text-loyaltyCallout {
  --iam-title: var(--color-primary);
}

body .vulcan-iam .iam-loyalty .elc-iam-section-loyaltySection-wrapper .elc-iam-loyaltyCallout-wrapper {
  padding-block-end: 18px;
}

body .vulcan-iam .elc-iam-emailPromotions-wrapper .elc-checkbox {
  margin-top: 1px;
}

body .vulcan-iam .elc-iam-terms-conditions {
  color: var(--color-primary);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.41667;
  letter-spacing: 0.015rem;
  margin-block-start: 10px;
}

body .vulcan-iam .elc-iam-wrapper {
  padding: 8px 0 20px;
}

body .vulcan-iam .elc-tabs__panel {
  padding: 28px 16px 0;
}

body .vulcan-iam .elc-iam-sign-in-button {
  margin-block-start: 24px;
  block-size: 44px;
}

@media (min-width: 1024px) {
  body .vulcan-iam .elc-iam-wrapper {
    padding: 0;
    padding-block-end: 30px;
  }

  body .vulcan-iam .elc-tabs__panel {
    padding: 38px 0 0;
  }

  body .vulcan-iam .elc-iam-wrapper .elc-tabs__list .elc-tabs__tab {
    border-width: 1px;
    height: 52px;
    margin-block-start: 28px;
  }

  body .vulcan-iam .elc-tabs__tab {
    margin-block-start: 29px;
  }

  body .vulcan-iam .iam-loyalty .elc-iam-section-loyaltySection-wrapper {
    margin-block-start: -8px;
  }

  body .vulcan-iam .elc-iam-sign-in-button {
    margin-block-start: 10px;
  }
}

.vulcan-iam .iam-loyalty .elc-iam-loyaltyCallout-wrapper::before {
  content: '';
  min-width: 67px;
  min-height: 30px;
  --brand-logo-loyalty: url("/tenant-web/brands/estee_lauder/loyalty-logo.png");
  background: var(--brand-logo-loyalty) no-repeat;
  background-size: contain;
}