@adyen/kyc-components/dist/style.css

`adyen-kyc-components` provides the required pieces to build an onboarding flow based on a legal entity. To onboard and verify users, you need to create a user interface (UI) to collect user data. To speed up building your integration, Adyen offers onboar

/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-loader-wrapper {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
}

.adyen-kyc-loader-wrapper-inline {
  display: inline-block;
  height: auto;
  margin-right: var(--adyen-sdk-spacer-040, 8px);
}

.adyen-kyc-loader {
  animation: adyen-kyc-rotateLoader 1.5s cubic-bezier(0.785, 0.135, 0.15, 0.86) infinite;
  border-radius: 50%;
  border: var(--adyen-sdk-border-width-l, 3px) solid var(--adyen-sdk-color-outline-primary, #dbdee2);
  border-top-color: var(--adyen-sdk-color-outline-inverse-primary, #2f3e56);
  height: 43px;
  width: 43px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.adyen-kyc-loader-large {
  height: 43px;
  width: 43px;
  max-width: 43px;
}

.adyen-kyc-loader-small {
  border-width: 2px;
  height: 16px;
  width: 16px;
  max-width: 16px;
}

.adyen-kyc-loader-medium {
  height: 28px;
  width: 28px;
  max-width: 28px;
}

.adyen-kyc-loader-xsmall {
  border-width: 2px;
  height: 12px;
  width: 12px;
  max-width: 12px;
}

@keyframes adyen-kyc-rotateLoader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.adyen-kyc-loader-dot::before {
  background: var(--adyen-sdk-color-outline-inverse-primary, #2f3e56);
  border-radius: 50%;
  content: "";
  min-height: 6px;
  min-width: 6px;
  position: absolute;
}.adyen-kyc-signed-alert:last-of-type {
  margin-top: var(--adyen-sdk-spacer-070, 16px);
}

.adyen-kyc-service-agreement-content {
  display: flex;
}.adyen-kyc-icon {
  color: inherit;
  display: inline-flex;
  vertical-align: baseline;
}
.adyen-kyc-icon svg {
  height: 100%;
}
.adyen-kyc-icon svg path {
  fill: currentColor;
}

.adyen-kyc-image {
  display: inline-block;
}.adyen-kyc-button {
  border: 1px solid transparent;
  box-sizing: border-box;
  cursor: pointer;
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-weight: var(--adyen-sdk-text-body-stronger-font-weight, 500);
  line-height: 1;
  min-height: 44px;
  min-width: 44px;
  outline-offset: var(--adyen-sdk-focus-ring-spacer, 1px);
  outline: var(--adyen-sdk-focus-ring-outline, 3px) solid transparent;
  overflow: hidden;
  padding: var(--adyen-sdk-spacer-000, 0px);
  position: relative;
  transition: var(--adyen-sdk-animation-duration-slow, 250ms);
  white-space: nowrap;
}
.adyen-kyc-button:active {
  transform: scale(0.95);
}
.adyen-kyc-button:focus-visible {
  outline-color: var(--adyen-sdk-color-label-primary, #00112c);
}
.adyen-kyc-button[disabled] {
  pointer-events: none;
}

.adyen-kyc-button-full-width {
  width: 100%;
}

.adyen-kyc-button-label {
  align-items: center;
  display: flex;
  gap: var(--adyen-sdk-spacer-040, 8px);
  justify-content: center;
}

.adyen-kyc-button-label-padding {
  padding: var(--adyen-sdk-spacer-040, 8px) var(--adyen-sdk-spacer-070, 16px);
}

.adyen-kyc-button-shape-rectangle {
  border-radius: var(--adyen-sdk-border-radius-m, 8px);
}

.adyen-kyc-button-shape-circle {
  border-radius: 44px;
}

.adyen-kyc-button-variant-primary {
  background-color: var(--adyen-sdk-color-background-inverse-primary, #00112c);
  color: var(--adyen-sdk-color-label-inverse-primary, #ffffff);
  fill: var(--adyen-sdk-color-label-inverse-primary, #ffffff);
}
@media (hover: hover) {
  .adyen-kyc-button-variant-primary:hover {
    background-color: var(--adyen-sdk-color-background-inverse-primary-hover, #5c687c);
    color: var(--adyen-sdk-color-label-inverse-primary-hover, #f7f7f8);
    fill: var(--adyen-sdk-color-label-inverse-primary-hover, #f7f7f8);
  }
}
.adyen-kyc-button-variant-primary[disabled] {
  background-color: var(--adyen-sdk-color-background-disabled, #eeeff1);
  color: var(--adyen-sdk-color-label-disabled, #8d95a3);
  fill: var(--adyen-sdk-color-label-disabled, #8d95a3);
}

.adyen-kyc-button-variant-secondary {
  background-color: var(--adyen-sdk-color-background-primary, #ffffff);
  color: var(--adyen-sdk-color-label-primary, #00112c);
  fill: var(--adyen-sdk-color-label-primary, #00112c);
  border: 1px solid var(--adyen-sdk-color-outline-primary, #dbdee2);
}
@media (hover: hover) {
  .adyen-kyc-button-variant-secondary:hover {
    background-color: var(--adyen-sdk-color-background-primary-hover, #f7f7f8);
    border-color: var(--adyen-sdk-color-outline-primary-hover, #c9cdd3);
    color: var(--adyen-sdk-color-label-primary-hover, #5c687c);
    fill: var(--adyen-sdk-color-label-primary-hover, #5c687c);
  }
}
.adyen-kyc-button-variant-secondary[disabled] {
  color: var(--adyen-sdk-color-label-disabled, #8d95a3);
  fill: var(--adyen-sdk-color-label-disabled, #8d95a3);
}

.adyen-kyc-button-variant-tertiary {
  background-color: transparent;
  color: var(--adyen-sdk-color-label-primary, #00112c);
  fill: var(--adyen-sdk-color-label-primary, #00112c);
}
@media (hover: hover) {
  .adyen-kyc-button-variant-tertiary:hover {
    background-color: var(--adyen-sdk-color-background-primary-hover, #f7f7f8);
    color: var(--adyen-sdk-color-label-primary-hover, #5c687c);
    fill: var(--adyen-sdk-color-label-primary-hover, #5c687c);
  }
}
.adyen-kyc-button-variant-tertiary[disabled] {
  background-color: var(--adyen-sdk-color-background-disabled, #eeeff1);
  color: var(--adyen-sdk-color-label-disabled, #8d95a3);
  fill: var(--adyen-sdk-color-label-disabled, #8d95a3);
}

.adyen-kyc-button-variant-critical {
  background-color: var(--adyen-sdk-color-background-critical-strong, #e22d2d);
  color: var(--adyen-sdk-color-label-on-color, #ffffff);
  fill: var(--adyen-sdk-color-label-on-color, #ffffff);
}
@media (hover: hover) {
  .adyen-kyc-button-variant-critical:hover {
    background-color: var(--adyen-sdk-color-background-critical-strong-hover, #c72727);
  }
}
.adyen-kyc-button-variant-critical[disabled] {
  background-color: var(--adyen-sdk-color-background-disabled, #eeeff1);
  color: var(--adyen-sdk-color-label-disabled, #8d95a3);
  fill: var(--adyen-sdk-color-label-disabled, #8d95a3);
}

.adyen-kyc-button-variant-link {
  background-color: transparent;
  color: var(--adyen-sdk-color-label-primary, #00112c);
  fill: var(--adyen-sdk-color-label-primary, #00112c);
  padding: var(--adyen-sdk-spacer-000, 0px);
  text-decoration: underline;
}
@media (hover: hover) {
  .adyen-kyc-button-variant-link:hover {
    color: var(--adyen-sdk-color-label-primary-hover, #5c687c);
    fill: var(--adyen-sdk-color-label-primary-hover, #5c687c);
    text-decoration: none;
  }
}

.adyen-kyc-button-variant-surface {
  background-color: var(--adyen-sdk-color-background-secondary, #f7f7f8);
  color: var(--adyen-sdk-color-label-primary, #00112c);
  fill: var(--adyen-sdk-color-label-primary, #00112c);
}
@supports (backdrop-filter: blur(10px)) {
  .adyen-kyc-button-variant-surface {
    backdrop-filter: blur(10px);
    background-color: rgba(247, 247, 248, 0.8);
  }
}
@media (hover: hover) {
  .adyen-kyc-button-variant-surface:hover {
    background-color: #eeeff1;
    color: var(--adyen-sdk-color-label-primary-hover, #5c687c);
    fill: var(--adyen-sdk-color-label-primary-hover, #5c687c);
  }
  @supports (backdrop-filter: blur(10px)) {
    .adyen-kyc-button-variant-surface:hover {
      background-color: rgba(238, 239, 241, 0.8);
    }
  }
}
.adyen-kyc-button-variant-surface[disabled] {
  background-color: #f7f7f8;
  color: var(--adyen-sdk-color-label-disabled, #8d95a3);
  fill: var(--adyen-sdk-color-label-disabled, #8d95a3);
}

.adyen-kyc-button-spinner {
  animation: adyen-kyc-present-spinner 400ms var(--adyen-sdk-animation-easing-enter, cubic-bezier(0.12, 0.6, 0.4, 0.95));
  background-color: inherit;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

@keyframes adyen-kyc-present-spinner {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-checkbox {
  display: block;
}
.adyen-kyc-checkbox__label {
  color: var(--adyen-sdk-color-label-primary, #00112c);
  cursor: pointer;
  display: inline-block;
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-weight: var(--adyen-sdk-text-body-font-weight, 400);
  line-height: calc(var(--adyen-sdk-text-body-font-size, 14px) + 2px);
  padding-left: var(--adyen-sdk-spacer-090, 24px);
  position: relative;
  user-select: none;
  width: calc(100% - 32px); /* leaves space for the error icon */
}
.adyen-kyc-checkbox__helper-text {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  display: block;
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  padding-left: var(--adyen-sdk-spacer-090, 24px);
}

.adyen-kyc-checkbox__input {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  /* Check */
  /* Box */
}
.adyen-kyc-checkbox__input:focus-visible + .adyen-kyc-checkbox__label::after {
  box-shadow: 0 0 0 var(--adyen-sdk-focus-ring-spacer, 1px) var(--adyen-sdk-color-background-primary, #ffffff), 0 0 0 var(--adyen-sdk-focus-ring-outline, 3px) var(--adyen-sdk-focus-ring-color, rgba(0, 112, 245, 0.8));
  transition: var(--adyen-sdk-animation-duration-fast, 100ms) var(--adyen-sdk-animation-easing-standard, cubic-bezier(0.2, 0, 0.4, 0.9));
  transition-property: box-shadow;
}
.adyen-kyc-checkbox__input:hover + .adyen-kyc-checkbox__label::after {
  background-color: var(--adyen-sdk-color-background-primary-hover, #f7f7f8);
}
.adyen-kyc-checkbox__input:checked + .adyen-kyc-checkbox__label::before {
  opacity: 1;
}
.adyen-kyc-checkbox__input:checked + .adyen-kyc-checkbox__label::after {
  background-color: var(--adyen-sdk-color-background-inverse-primary, #00112c);
  border-color: var(--adyen-sdk-color-background-inverse-primary, #00112c);
}
.adyen-kyc-checkbox__input:checked:hover + .adyen-kyc-checkbox__label::after {
  background-color: var(--adyen-sdk-color-background-inverse-primary-hover, #5c687c);
  border-color: var(--adyen-sdk-color-background-inverse-primary-hover, #5c687c);
}
.adyen-kyc-checkbox__input + .adyen-kyc-checkbox__label::before {
  border-bottom: var(--adyen-sdk-border-width-m, 2px) solid var(--adyen-sdk-color-background-primary, #ffffff);
  border-right: var(--adyen-sdk-border-width-m, 2px) solid var(--adyen-sdk-color-background-primary, #ffffff);
  content: "";
  height: 7px;
  left: 3px;
  opacity: 0;
  position: absolute;
  top: 4px;
  transform: rotateZ(37deg);
  transform-origin: 100% 100%;
  width: 5px;
  z-index: 1;
}
.adyen-kyc-checkbox__input + .adyen-kyc-checkbox__label::after {
  background-color: var(--adyen-sdk-color-background-primary, #ffffff);
  border: var(--adyen-sdk-border-width-s, 1px) solid var(--adyen-sdk-color-outline-tertiary, #8d95a3);
  border-radius: var(--adyen-sdk-border-radius-s, 4px);
  content: "";
  height: calc(var(--adyen-sdk-text-body-font-size, 14px) + 2px);
  left: 0;
  position: absolute;
  top: 0;
  width: calc(var(--adyen-sdk-text-body-font-size, 14px) + 2px);
  z-index: 0;
}.adyen-kyc-field {
  display: block;
  margin-bottom: var(--adyen-sdk-spacer-090, 24px);
  width: 100%;
}

.adyen-kyc-label {
  display: block;
}
.adyen-kyc-label--disabled {
  color: var(--adyen-sdk-color-label-disabled, #8d95a3);
  opacity: 0.5;
  pointer-events: none;
}

.adyen-kyc-optional-label {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
}

.adyen-kyc-label__text {
  color: var(--adyen-sdk-color-label-primary, #00112c);
  display: block;
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-weight: var(--adyen-sdk-text-body-stronger-font-weight, 500);
  transition: color 0.1s ease-out;
}

.adyen-kyc-helper-text {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  font-size: var(--adyen-sdk-text-caption-font-size, 12px);
  font-family: var(--adyen-sdk-text-caption-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-caption-font-weight, 400);
  line-height: var(--adyen-sdk-text-caption-line-height, 18px);
  display: flex;
  align-items: center;
}
.adyen-kyc-helper-text__above {
  margin-bottom: var(--adyen-sdk-spacer-020, 4px);
}
.adyen-kyc-helper-text__below {
  margin-top: var(--adyen-sdk-spacer-020, 4px);
}
.adyen-kyc-helper-text__valid-format-check {
  color: var(--adyen-sdk-color-label-success, #07893c);
  font-size: var(--adyen-sdk-text-title-font-size, 16px);
  font-family: var(--adyen-sdk-text-title-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-title-font-weight, 600);
  line-height: var(--adyen-sdk-text-title-line-height, 26px);
  display: inline-flex;
}

.adyen-kyc-label__text--error {
  color: var(--adyen-sdk-color-label-critical, #e22d2d);
}

.adyen-kyc-label--focused .adyen-kyc-label__text {
  color: var(--adyen-sdk-color-label-primary, #00112c);
}

.adyen-kyc-error-text {
  align-items: center;
  color: var(--adyen-sdk-color-label-critical, #e22d2d);
  display: flex;
  font-size: var(--adyen-sdk-text-caption-font-size, 12px);
  font-family: var(--adyen-sdk-text-caption-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-caption-font-weight, 400);
  line-height: var(--adyen-sdk-text-caption-line-height, 18px);
  margin-top: var(--adyen-sdk-spacer-020, 4px);
  position: relative;
}

.adyen-kyc-guidance-text {
  align-items: center;
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  display: flex;
  font-size: var(--adyen-sdk-text-caption-font-size, 12px);
  font-family: var(--adyen-sdk-text-caption-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-caption-font-weight, 400);
  line-height: var(--adyen-sdk-text-caption-line-height, 18px);
  margin-top: var(--adyen-sdk-spacer-020, 4px);
  position: relative;
}

.adyen-kyc-upload-field__guidance {
  display: flex;
  flex-direction: column;
}
.adyen-kyc-upload-field__subtitle {
  margin: var(--adyen-sdk-spacer-070, 16px) var(--adyen-sdk-spacer-000, 0px);
}
.adyen-kyc-upload-field__requirements {
  padding-left: var(--adyen-sdk-spacer-070, 16px);
}.adyen-kyc-loader-wrapper-loader {
  display: none;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.adyen-kyc-loader-wrapper-loader-active {
  display: block;
}.adyen-kyc-toast {
  align-items: center;
  animation: adyen-kyc-present-toast 400ms var(--adyen-sdk-animation-easing-enter, cubic-bezier(0.12, 0.6, 0.4, 0.95));
  background-color: var(--adyen-sdk-color-background-inverse-primary, #00112c);
  border-radius: var(--adyen-sdk-border-radius-l, 12px);
  border-top: 1px solid var(--adyen-sdk-color-outline-inverse-primary, #2f3e56);
  bottom: var(--adyen-sdk-spacer-070, 16px);
  box-shadow: var(--adyen-sdk-shadow-high, 0px 18px 36px rgba(0, 17, 44, 0.12), 0px 4px 8px rgba(0, 17, 44, 0.06));
  display: flex;
  fill: var(--adyen-sdk-color-label-inverse-secondary, #9ea6b1);
  gap: var(--adyen-sdk-spacer-040, 8px);
  justify-content: flex-start;
  left: 50%;
  max-width: 420px;
  padding: var(--adyen-sdk-spacer-040, 8px);
  position: fixed;
  transform: translateX(-50%);
  width: 90vw;
  z-index: 1000;
}

.adyen-kyc-toast-image {
  align-items: center;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  max-height: 32px;
  max-width: 32px;
  padding: var(--adyen-sdk-spacer-040, 8px);
}

.adyen-kyc-toast-image-success {
  color: var(--adyen-sdk-color-decorative-green, #09ab4b);
  fill: var(--adyen-sdk-color-decorative-green, #09ab4b);
}

.adyen-kyc-toast-image-error {
  color: var(--adyen-sdk-color-label-critical, #e22d2d);
  fill: var(--adyen-sdk-color-label-critical, #e22d2d);
}

.adyen-kyc-toast-label {
  align-items: center;
  color: var(--adyen-sdk-color-label-inverse-primary, #ffffff);
  display: flex;
  flex-grow: 1;
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-weight: var(--adyen-sdk-text-body-font-weight, 400);
  gap: var(--adyen-sdk-spacer-040, 8px);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  padding: var(--adyen-sdk-spacer-040, 8px);
}

.adyen-kyc-toast-actions {
  display: flex;
  gap: var(--adyen-sdk-spacer-040, 8px);
}
.adyen-kyc-toast-actions button:focus-visible {
  outline-color: var(--adyen-sdk-color-outline-inverse-primary-active, #9ea6b1);
}

.adyen-kyc-toast-action-close {
  border-left: 1px solid var(--adyen-sdk-color-outline-inverse-primary, #2f3e56);
  padding-left: var(--adyen-sdk-spacer-040, 8px);
}

@keyframes adyen-kyc-present-toast {
  0% {
    opacity: 0;
    transform: translate(-50%, 32px);
  }
  100% {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-modal {
  background-color: var(--adyen-sdk-color-background-modal, #ffffff);
  border-radius: var(--adyen-sdk-border-radius-l, 12px);
  border: var(--adyen-sdk-spacer-000, 0px);
  box-shadow: var(--adyen-sdk-shadow-high, 0px 18px 36px rgba(0, 17, 44, 0.12), 0px 4px 8px rgba(0, 17, 44, 0.06));
  overflow: hidden;
  padding: var(--adyen-sdk-spacer-000, 0px);
  position: fixed;
}
.adyen-kyc-modal:focus-visible {
  outline: none;
}

.adyen-kyc-modal-body {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

.adyen-kyc-modal-body-height {
  height: 100%;
}

.adyen-kyc-modal-accessable-title {
  display: none;
}

.adyen-kyc-modal-transition-slide-in {
  animation-name: adyen-kyc-slide-in;
  animation-duration: 400ms;
  animation-timing-function: ease-out;
}

.adyen-kyc-modal-transition-drop-in {
  animation-name: adyen-kyc-drop-in;
  animation-duration: 250ms;
  animation-timing-function: ease;
}

.adyen-kyc-modal-inset {
  padding: var(--adyen-sdk-spacer-140, 64px) var(--adyen-sdk-spacer-070, 16px);
}
@media (min-width: 480px) {
  .adyen-kyc-modal-inset {
    padding-left: var(--adyen-sdk-spacer-100, 32px);
    padding-right: var(--adyen-sdk-spacer-100, 32px);
  }
}
@media (min-width: 680px) {
  .adyen-kyc-modal-inset {
    padding-left: calc(var(--adyen-sdk-spacer-070, 16px) * 2 + 44px);
    padding-right: calc(var(--adyen-sdk-spacer-070, 16px) * 2 + 44px);
  }
}

.adyen-kyc-modal-small {
  max-width: 400px;
  width: 90vw;
}

.adyen-kyc-modal-medium {
  height: 90vh;
  max-height: 600px;
  max-width: 600px;
  width: 90vw;
}

.adyen-kyc-modal-large {
  height: 90vh;
  max-height: 600px;
  max-width: 900px;
  width: 90vw;
}

.adyen-kyc-modal-fullscreen {
  border-radius: 0;
  height: 100vh;
  margin: 0;
  max-height: 100vh;
  max-width: 100vw;
  width: 100vw;
}

.adyen-kyc-modal::backdrop {
  animation-name: adyen-kyc-backdrop-dissolve;
  animation-duration: 400ms;
  animation-timing-function: ease;
  background-color: var(--adyen-sdk-color-support-overlay, #00112c);
  opacity: 0.5;
  backdrop-filter: blur(10px);
}

.adyen-kyc-modal-button {
  position: absolute;
  top: var(--adyen-sdk-spacer-070, 16px);
  right: var(--adyen-sdk-spacer-070, 16px);
  z-index: 10;
}

@keyframes adyen-kyc-backdrop-dissolve {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 0.5;
    backdrop-filter: blur(10px);
  }
}
@keyframes adyen-kyc-slide-in {
  0% {
    opacity: 0;
    top: 64px;
  }
  100% {
    opacity: 1;
    top: 0;
  }
}
@keyframes adyen-kyc-drop-in {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
.adyen-kyc-modal-header {
  align-items: center;
  display: flex;
  font-size: var(--adyen-sdk-text-title-font-size, 16px);
  font-weight: var(--adyen-sdk-text-title-font-weight, 600);
  gap: var(--adyen-sdk-spacer-040, 8px);
  justify-content: space-between;
  padding: var(--adyen-sdk-spacer-070, 16px);
}

.adyen-kyc-modal-content {
  flex-grow: 1;
  overflow-y: auto;
  padding: var(--adyen-sdk-spacer-070, 16px);
}

.adyen-kyc-modal-footer {
  align-items: center;
  border-top: var(--adyen-sdk-border-width-s, 1px) solid var(--adyen-sdk-color-outline-primary, #dbdee2);
  display: flex;
  gap: var(--adyen-sdk-spacer-040, 8px);
  justify-content: flex-end;
  padding: var(--adyen-sdk-spacer-070, 16px);
}.adyen-kyc-outlined-icon {
  width: 1.75em;
  height: 1.75em;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: var(--adyen-sdk-color-label-on-color, #ffffff);
  background-color: var(--adyen-sdk-color-background-success-strong, #07893c);
  outline: 0.5em solid var(--adyen-sdk-color-background-success-weak, #edfaf3);
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-dropdown {
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  max-width: 100%;
  width: 100%;
}

.adyen-kyc-dropdown--minimal {
  max-width: 120px;
}

.adyen-kyc-dropdown-list {
  border-radius: var(--adyen-sdk-border-radius-m, 8px);
  box-shadow: var(--adyen-sdk-shadow-medium-border, 0px 6px 12px rgba(0, 17, 44, 0.08), 0px 2px 4px rgba(0, 17, 44, 0.04), 0px 0px 0px 1px rgba(0, 17, 44, 0.06));
  z-index: 2;
}
.adyen-kyc-dropdown-list .adyen-kyc-checkbox__helper-text {
  cursor: pointer;
}

.adyen-kyc-dropdown-list--above {
  bottom: -6px;
}

.adyen-kyc-dropdown-list.adyen-kyc-dropdown-list--active {
  margin-top: var(--adyen-sdk-spacer-010, 2px);
}

.adyen-kyc-dropdown-list.adyen-kyc-dropdown-list--minimal.adyen-kyc-dropdown-list--active {
  width: 200px;
}

.adyen-kyc-dropdown-element {
  border: var(--adyen-sdk-border-width-s, 1px) solid transparent;
  cursor: pointer;
  font-size: var(--adyen-sdk-text-caption-font-size, 12px);
  font-family: var(--adyen-sdk-text-caption-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-caption-font-weight, 400);
  line-height: var(--adyen-sdk-text-caption-line-height, 18px);
  hyphens: auto;
  outline: 0;
  padding: var(--adyen-sdk-spacer-040, 8px);
  transition: background 0.2s ease-out, border-color 0.2s ease-out;
  user-select: none;
  word-break: break-word;
}
.adyen-kyc-dropdown-element.adyen-kyc-dropdown-search-element {
  align-items: baseline;
  display: flex;
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  width: 100%;
}

.adyen-kyc-dropdown-search-element__description {
  flex: 1;
}
.adyen-kyc-dropdown-search-element__description--highlight {
  font-weight: var(--adyen-sdk-text-body-strongest-font-weight, 600);
}
.adyen-kyc-dropdown-search-element__addresses {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  display: flex;
}
.adyen-kyc-dropdown-search-element__addresses--icon {
  align-items: center;
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  display: flex;
  margin-left: var(--adyen-sdk-spacer-040, 8px);
}
.adyen-kyc-dropdown-search-element__addresses--text {
  display: none;
  margin-left: var(--adyen-sdk-spacer-020, 4px);
}
@container main (min-width: 1024px) {
  .adyen-kyc-dropdown-search-element__addresses--text {
    display: block;
  }
}

.adyen-kyc-dropdown-element:last-child {
  border-bottom: 0;
}

.adyen-kyc-dropdown-element:hover,
.adyen-kyc-dropdown-element:focus,
.adyen-kyc-dropdown-element:active {
  background: var(--adyen-sdk-color-background-primary-hover, #f7f7f8);
}

.adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active {
  background: var(--adyen-sdk-color-background-primary-active, #eeeff1);
}

.adyen-kyc-dropdown-element--disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

.adyen-kyc-dropdown-element__icon svg {
  border-radius: var(--adyen-sdk-border-radius-s, 4px);
  margin-right: var(--adyen-sdk-spacer-040, 8px);
  height: 26px;
  max-width: 40px;
}

.adyen-kyc-dropdown-element.adyen-kyc-dropdown-element-description {
  align-items: baseline;
  flex-direction: column;
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
}

.adyen-kyc-dropdown + .adyen-kyc-input__inline-validation {
  right: 32px;
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-dropdown {
  position: relative;
}

.adyen-kyc-dropdown-list {
  background: var(--adyen-sdk-color-background-primary, #ffffff);
  display: none;
  list-style: none;
  margin: var(--adyen-sdk-spacer-000, 0px);
  margin-bottom: var(--adyen-sdk-spacer-120, 48px);
  overflow-y: auto;
  padding: var(--adyen-sdk-spacer-000, 0px);
  position: absolute;
  width: 100%;
  z-index: 1;
}
.adyen-kyc-dropdown-list__transformer {
  position: relative;
  padding: 0;
  margin: 0;
}
.adyen-kyc-dropdown-list:focus {
  outline: none;
}

.adyen-kyc-dropdown-list.adyen-kyc-dropdown-list--active {
  display: block;
}

.adyen-kyc-dropdown-element {
  align-items: center;
  display: flex;
}

.adyen-kyc-dropdown-ignore-pointer-events {
  pointer-events: none;
}

.adyen-kyc-dropdown-handle-pointer-events {
  pointer-events: auto;
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-select-input {
  align-items: center;
  display: flex;
  background: var(--adyen-sdk-color-background-primary, #ffffff);
  border: var(--adyen-sdk-border-width-s, 1px) solid var(--adyen-sdk-color-outline-tertiary, #8d95a3);
  border-radius: var(--adyen-sdk-border-radius-m, 8px);
  color: var(--adyen-sdk-color-label-primary, #00112c);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  min-height: 40px;
  outline: 0;
  padding: var(--adyen-sdk-spacer-040, 8px) var(--adyen-sdk-spacer-090, 24px) var(--adyen-sdk-spacer-040, 8px) var(--adyen-sdk-spacer-060, 12px);
  text-decoration: none;
  transition: border 0.2s ease-out, box-shadow 0.2s ease-out;
  user-select: none;
}

.adyen-kyc-select-input:hover {
  border-color: var(--adyen-sdk-color-outline-tertiary-hover, #6d7789);
}

.adyen-kyc-select-input__icon svg {
  border-radius: var(--adyen-sdk-border-radius-s, 4px);
  margin-right: var(--adyen-sdk-spacer-040, 8px);
  height: 26px;
  max-width: 40px;
}

.adyen-kyc-select-input--active,
.adyen-kyc-select-input--active:hover,
.adyen-kyc-select-input:active,
.adyen-kyc-select-input:focus {
  border-color: var(--adyen-sdk-color-outline-tertiary-active, #00112c);
  outline: var(--adyen-sdk-border-width-s, 1px) solid var(--adyen-sdk-color-outline-tertiary-active, #00112c);
}

.adyen-kyc-select-input--readonly, .adyen-kyc-select-input--readonly.adyen-kyc-select-input--active, .adyen-kyc-select-input--readonly:hover, .adyen-kyc-select-input--readonly:focus {
  border: var(--adyen-sdk-border-width-s, 1px) solid var(--adyen-sdk-color-outline-disabled, #dbdee2);
  color: var(--adyen-sdk-color-label-disabled, #8d95a3);
  cursor: not-allowed;
  background-color: var(--adyen-sdk-color-background-disabled, #eeeff1);
  border-color: var(--adyen-sdk-color-outline-disabled, #dbdee2);
}

.adyen-kyc-select-input--readonly::after {
  background-image: url("data:image/svg+xml,%3Csvg width='8' height='7' viewBox='0 0 8 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.19471 6.5646C3.59429 7.09797 4.39396 7.0986 4.79439 6.56587L7.78716 2.58424C8.28257 1.92514 7.81232 0.983398 6.98779 0.983398L1.01209 0.983398C0.188292 0.983398 -0.282154 1.92367 0.211778 2.58298L3.19471 6.5646Z' fill='%23B9C4C9'/%3E%3C/svg%3E%0A");
}

.adyen-kyc-select-input--invalid {
  border-color: var(--adyen-sdk-color-outline-critical, #e22d2d);
}

.adyen-kyc-select-input--minimal {
  min-height: unset;
  height: 100%;
  background: var(--adyen-sdk-color-background-secondary, #f7f7f8);
  border: none;
  border-radius: var(--adyen-sdk-border-radius-s, 4px);
}

.adyen-kyc-select-input-search {
  align-items: center;
  display: flex;
  width: 100%;
}
.adyen-kyc-select-input-search__icon {
  color: var(--adyen-sdk-color-label-tertiary, #8d95a3);
  font-size: var(--adyen-sdk-text-caption-font-size, 12px);
  font-family: var(--adyen-sdk-text-caption-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-caption-font-weight, 400);
  line-height: var(--adyen-sdk-text-caption-line-height, 18px);
  padding-right: var(--adyen-sdk-spacer-040, 8px);
}
.adyen-kyc-select-input-search .adyen-kyc-select-input--filterable::placeholder {
  color: var(--adyen-sdk-color-label-tertiary, #8d95a3);
}

.adyen-kyc-select-input-search::after {
  display: none;
}

.adyen-kyc-select-input-wrapper--filterable {
  cursor: text;
}

.adyen-kyc-select-input-wrapper--non-filterable {
  cursor: pointer;
}

.adyen-kyc-select-input::after {
  background-image: url("data:image/svg+xml,%3Csvg width='8' height='7' viewBox='0 0 8 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.19471 6.5646C3.59429 7.09797 4.39396 7.0986 4.79439 6.56587L7.78716 2.58424C8.28257 1.92514 7.81232 0.983398 6.98779 0.983398L1.01209 0.983398C0.188292 0.983398 -0.282154 1.92367 0.211778 2.58298L3.19471 6.5646Z' fill='%23687282'/%3E%3C/svg%3E%0A");
  background-position: center;
  background-repeat: no-repeat;
  content: "";
  height: 6px;
  position: absolute;
  right: 16px;
  width: 8px;
}

.adyen-kyc-select-input--list-open::after {
  transform: rotate(180deg);
}

.adyen-kyc-select-input--filterable {
  background: var(--adyen-sdk-color-background-primary, #ffffff);
  border: 0;
  caret-color: var(--adyen-sdk-color-label-highlight, #0070f5);
  color: var(--adyen-sdk-color-label-primary, #00112c);
  font-family: inherit;
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  height: 100%;
  padding: var(--adyen-sdk-spacer-000, 0px);
  width: 100%;
}
.adyen-kyc-select-input--filterable::placeholder {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  font-weight: var(--adyen-sdk-text-body-font-weight, 400);
}
.adyen-kyc-select-input--filterable:focus, .adyen-kyc-select-input--filterable:active {
  outline: 0;
}
.adyen-kyc-select-input--filterable.adyen-kyc-select-input--minimal {
  background: var(--adyen-sdk-color-background-secondary, #f7f7f8);
}

.adyen-kyc-select-input--non-filterable {
  all: unset;
}

.adyen-kyc-select-input--placeholder {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  font-weight: var(--adyen-sdk-text-body-font-weight, 400);
}

.adyen-kyc-ignore-pointer-events {
  pointer-events: none;
}

.adyen-kyc-handle-pointer-events {
  pointer-events: auto;
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-typography {
  color: var(--adyen-sdk-color-label-primary, #00112c);
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-weight: var(--adyen-sdk-text-body-font-weight, 400);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  margin: var(--adyen-sdk-spacer-000, 0px);
}
.adyen-kyc-typography--body {
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  letter-spacing: var(--adyen-sdk-text-body-letter-spacing, 0);
  font-weight: var(--adyen-sdk-text-body-font-weight, 400);
}
.adyen-kyc-typography--body-stronger {
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  letter-spacing: var(--adyen-sdk-text-body-letter-spacing, 0);
  font-weight: var(--adyen-sdk-text-body-stronger-font-weight, 500);
}
.adyen-kyc-typography--body-strongest {
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  letter-spacing: var(--adyen-sdk-text-body-letter-spacing, 0);
  font-weight: var(--adyen-sdk-text-body-strongest-font-weight, 600);
}
.adyen-kyc-typography--caption {
  font-size: var(--adyen-sdk-text-caption-font-size, 12px);
  font-family: var(--adyen-sdk-text-caption-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-caption-font-weight, 400);
  line-height: var(--adyen-sdk-text-caption-line-height, 18px);
  letter-spacing: var(--adyen-sdk-text-caption-letter-spacing, 0);
  font-weight: var(--adyen-sdk-text-caption-font-weight, 400);
}
.adyen-kyc-typography--caption-stronger {
  font-size: var(--adyen-sdk-text-caption-font-size, 12px);
  font-family: var(--adyen-sdk-text-caption-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-caption-font-weight, 400);
  line-height: var(--adyen-sdk-text-caption-line-height, 18px);
  letter-spacing: var(--adyen-sdk-text-caption-letter-spacing, 0);
  font-weight: var(--adyen-sdk-text-caption-stronger-font-weight, 500);
}
.adyen-kyc-typography--title {
  font-size: var(--adyen-sdk-text-title-font-size, 16px);
  font-family: var(--adyen-sdk-text-title-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-title-font-weight, 600);
  line-height: var(--adyen-sdk-text-title-line-height, 26px);
  letter-spacing: var(--adyen-sdk-text-title-letter-spacing, 0);
}
@container main (max-width: 680px) {
  .adyen-kyc-typography--title {
    font-size: var(--adyen-sdk-text-title-mobile-font-size, 16px);
    line-height: var(--adyen-sdk-text-title-mobile-line-height, 26px);
  }
}
.adyen-kyc-typography--title-m {
  font-size: var(--adyen-sdk-text-title-m-font-size, 20px);
  font-family: var(--adyen-sdk-text-title-m-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-title-m-font-weight, 600);
  line-height: var(--adyen-sdk-text-title-m-line-height, 30px);
  letter-spacing: var(--adyen-sdk-text-title-m-letter-spacing, 0);
}
@container main (max-width: 680px) {
  .adyen-kyc-typography--title-m {
    font-size: var(--adyen-sdk-text-title-m-mobile-font-size, 18px);
    line-height: var(--adyen-sdk-text-title-m-mobile-line-height, 28px);
  }
}
.adyen-kyc-typography--title-l {
  font-size: var(--adyen-sdk-text-title-l-font-size, 24px);
  font-family: var(--adyen-sdk-text-title-l-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-weight: var(--adyen-sdk-text-title-l-font-weight, 600);
  line-height: var(--adyen-sdk-text-title-l-line-height, 34px);
  letter-spacing: var(--adyen-sdk-text-title-l-letter-spacing, 0);
}
@container main (max-width: 680px) {
  .adyen-kyc-typography--title-l {
    font-size: var(--adyen-sdk-text-title-l-mobile-font-size, 20px);
    line-height: var(--adyen-sdk-text-title-l-mobile-line-height, 30px);
  }
}
.adyen-kyc-typography--primary {
  color: var(--adyen-sdk-color-label-primary, #00112c);
}
.adyen-kyc-typography--secondary {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
}
.adyen-kyc-typography--tertiary {
  color: var(--adyen-sdk-color-label-tertiary, #8d95a3);
}
.adyen-kyc-typography--disabled {
  color: var(--adyen-sdk-color-label-disabled, #8d95a3);
}
.adyen-kyc-typography--success {
  color: var(--adyen-sdk-color-label-success, #07893c);
}
.adyen-kyc-typography--warning {
  color: var(--adyen-sdk-color-label-warning, #b06300);
}
.adyen-kyc-typography--critical {
  color: var(--adyen-sdk-color-label-critical, #e22d2d);
}
.adyen-kyc-typography--highlight {
  color: var(--adyen-sdk-color-label-highlight, #0070f5);
}
.adyen-kyc-typography--inverse-primary {
  color: var(--adyen-sdk-color-label-inverse-primary, #ffffff);
}
.adyen-kyc-typography--inverse-secondary {
  color: var(--adyen-sdk-color-label-inverse-secondary, #9ea6b1);
}.adyen-kyc-spacer {
  flex: 1;
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-progress-bar {
  display: flex;
  flex: 1;
  padding: var(--adyen-sdk-spacer-000, 0px);
  margin: var(--adyen-sdk-spacer-000, 0px);
  --step-progress-internal-height: 0.25em;
}

.adyen-kyc-progress-bar-thick li {
  --step-progress-internal-height: 0.4em;
}

.adyen-kyc-progress-bar-thick li:first-of-type {
  border-top-left-radius: var(--adyen-sdk-border-radius-m, 8px);
  border-bottom-left-radius: var(--adyen-sdk-border-radius-m, 8px);
}

.adyen-kyc-progress-bar-thick li:last-of-type {
  border-top-right-radius: var(--adyen-sdk-border-radius-m, 8px);
  border-bottom-right-radius: var(--adyen-sdk-border-radius-m, 8px);
}

.adyen-kyc-progress-step {
  background-color: var(--adyen-sdk-color-background-tertiary, #eeeff1);
  display: flex;
  flex: 1;
  height: var(--step-progress-internal-height);
}

.adyen-kyc-progress-step-active {
  background-color: var(--adyen-sdk-color-background-inverse-primary, #00112c);
}

.adyen-kyc-progress-step-label {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  overflow: hidden;
  padding: var(--adyen-sdk-spacer-000, 0px) !important;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.adyen-kyc-progress-bar-circles li {
  flex: none;
  width: var(--step-progress-internal-height);
  border-radius: var(--step-progress-internal-height);
  margin: 0 var(--step-progress-internal-height);
}

.adyen-kyc-progress-bar-circles .adyen-kyc-progress-step-active {
  padding: 0 calc(var(--step-progress-internal-height) / 2);
  margin: 0 calc(var(--step-progress-internal-height) / 2);
}.adyen-kyc-skeleton {
  width: 100%;
  height: 100%;
  background-color: var(--adyen-sdk-color-outline-secondary, #c9cdd3);
  border-radius: var(--adyen-sdk-border-radius-m, 8px);
  opacity: 0;
  animation: 2s ease-in-out 0.4s infinite normal none running adyen-kyc-skeleton;
}

.adyen-kyc-skeleton-circle {
  border-radius: 50%;
}

.adyen-kyc-skeleton-text {
  height: 1em !important;
  margin: 0.2em 0 !important;
}

@keyframes adyen-kyc-skeleton {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    opacity: 1;
  }
}.adyen-kyc-accordion,
.adyen-kyc-accordion-summary {
  color: var(--adyen-sdk-color-label-primary, #00112c);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  cursor: pointer;
}

.adyen-kyc-accordion {
  background: none;
  border-radius: var(--adyen-sdk-border-radius-l, 12px);
  margin-bottom: var(--adyen-sdk-spacer-050, 10px);
}

.adyen-kyc-accordion-basic {
  background-color: var(--adyen-sdk-color-background-secondary, #f7f7f8);
}

.adyen-kyc-accordion-info {
  background-color: var(--adyen-sdk-color-background-highlight-weak, #f2f8ff);
}

.adyen-kyc-accordion-error {
  background-color: var(--adyen-sdk-color-background-critical-weak, #fef4f4);
}

.adyen-kyc-accordion-warning {
  background-color: var(--adyen-sdk-color-background-warning-weak, #fff5e9);
}

.adyen-kyc-accordion-success {
  background-color: var(--adyen-sdk-color-background-success-weak, #edfaf3);
}

.adyen-kyc-accordion-narrow .adyen-kyc-accordion-summary {
  padding: var(--adyen-sdk-spacer-060, 12px) var(--adyen-sdk-spacer-070, 16px);
}

.adyen-kyc-accordion-narrow .adyen-kyc-accordion-content {
  padding: var(--adyen-sdk-spacer-000, 0px) var(--adyen-sdk-spacer-070, 16px) var(--adyen-sdk-spacer-060, 12px);
}

.adyen-kyc-accordion-with-icon .adyen-kyc-accordion-content {
  margin-left: var(--adyen-sdk-spacer-080, 20px);
}

.adyen-kyc-accordion-summary {
  display: flex;
  align-items: center;
  gap: var(--adyen-sdk-spacer-050, 10px);
  padding: var(--adyen-sdk-spacer-080, 20px);
  font-weight: var(--adyen-sdk-text-title-font-weight, 600);
  transition: margin 150ms ease-out;
  margin-bottom: var(--adyen-sdk-spacer-000, 0px);
  border-radius: var(--adyen-sdk-border-radius-l, 12px);
}

.adyen-kyc-accordion-summary > .adyen-kyc-accordion-arrow {
  cursor: pointer;
  user-select: none;
  height: 1em;
}

.adyen-kyc-accordion-summary > .adyen-kyc-accordion-arrow-right {
  margin-left: auto;
  margin-right: var(--adyen-sdk-spacer-050, 10px);
}

.adyen-kyc-accordion[open] .adyen-kyc-accordion-arrow {
  transform: rotate(-180deg);
}

.adyen-kyc-accordion summary::-webkit-details-marker {
  display: none;
}

.adyen-kyc-accordion-content {
  cursor: auto;
  padding: var(--adyen-sdk-spacer-000, 0px) var(--adyen-sdk-spacer-080, 20px) var(--adyen-sdk-spacer-080, 20px);
  user-select: none;
  display: flex;
  flex-direction: column;
  gap: var(--adyen-sdk-spacer-040, 8px);
}

.adyen-kyc-accordion[open] summary {
  margin-bottom: var(--adyen-sdk-spacer-020, 4px);
  user-select: auto;
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-alert {
  color: var(--adyen-sdk-color-label-primary, #00112c);
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-weight: var(--adyen-sdk-text-body-font-weight, 400);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  border-radius: var(--adyen-sdk-border-radius-l, 12px);
  padding: var(--adyen-sdk-spacer-070, 16px);
  word-break: break-word;
  display: flex;
  flex-direction: column;
  gap: var(--adyen-sdk-spacer-040, 8px);
  text-align: left;
}

.adyen-kyc-alert-without-icon .adyen-kyc-alert-explanation,
.adyen-kyc-alert-without-icon .adyen-kyc-alert-actions {
  margin: 0 var(--adyen-sdk-spacer-070, 16px);
}

.adyen-kyc-alert-basic {
  background-color: var(--adyen-sdk-color-background-secondary, #f7f7f8);
}

.adyen-kyc-alert-info {
  background-color: var(--adyen-sdk-color-background-highlight-weak, #f2f8ff);
}

.adyen-kyc-alert-error {
  background-color: var(--adyen-sdk-color-background-critical-weak, #fef4f4);
}

.adyen-kyc-alert-warning {
  background-color: var(--adyen-sdk-color-background-warning-weak, #fff5e9);
}

.adyen-kyc-alert-success {
  background-color: var(--adyen-sdk-color-background-success-weak, #edfaf3);
}

.adyen-kyc-alert-header {
  align-items: flex-start;
  display: flex;
}

.adyen-kyc-alert-icon {
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  margin-top: var(--adyen-sdk-spacer-010, 2px);
}

.adyen-kyc-alert-icon-info {
  color: var(--adyen-sdk-color-background-highlight-strong, #0070f5);
}

.adyen-kyc-alert-icon-error {
  color: var(--adyen-sdk-color-background-critical-strong, #e22d2d);
}

.adyen-kyc-alert-icon-warning {
  color: var(--adyen-sdk-color-background-warning-strong, #dd7d00);
}

.adyen-kyc-alert-icon-success {
  color: var(--adyen-sdk-color-background-success-strong, #07893c);
}

.adyen-kyc-alert-title {
  flex-grow: 1;
  margin-left: var(--adyen-sdk-spacer-070, 16px);
}

.adyen-kyc-alert-explanation {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  margin: 0 var(--adyen-sdk-spacer-100, 32px);
}

.adyen-kyc-alert-actions {
  display: flex;
  gap: var(--adyen-sdk-spacer-070, 16px);
  text-align: left;
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-form-end-state {
  color: var(--adyen-sdk-color-label-primary, #00112c);
  font-family: var(--adyen-sdk-text-body-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  font-weight: var(--adyen-sdk-text-body-font-weight, 400);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  display: grid;
  place-items: center;
  word-break: break-word;
  margin-bottom: var(--adyen-sdk-spacer-020, 4px);
}
.adyen-form-end-state--without-icon .adyen-form-end-state__title {
  margin-top: 0;
}

.adyen-form-end-state__icon {
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  margin-top: var(--adyen-sdk-spacer-010, 2px);
}
.adyen-form-end-state__icon--info {
  color: var(--adyen-sdk-color-background-highlight-strong, #0070f5);
}
.adyen-form-end-state__icon--error {
  color: var(--adyen-sdk-color-background-critical-strong, #e22d2d);
}
.adyen-form-end-state__icon--warning {
  color: var(--adyen-sdk-color-background-warning-strong, #dd7d00);
}
.adyen-form-end-state__icon--success {
  color: var(--adyen-sdk-color-background-success-strong, #07893c);
}

.adyen-form-end-state__title {
  font-size: var(--adyen-sdk-text-title-m-font-size, 20px);
  font-weight: var(--adyen-sdk-text-title-m-font-weight, 600);
  line-height: var(--adyen-sdk-text-title-m-line-height, 30px);
  margin-top: var(--adyen-sdk-spacer-060, 12px);
  margin-bottom: var(--adyen-sdk-spacer-020, 4px);
  text-align: center;
}

.adyen-form-end-state__description {
  color: var(--adyen-sdk-color-label-secondary, #5c687c);
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  margin-bottom: var(--adyen-sdk-spacer-070, 16px);
  text-align: center;
}

.adyen-form-end-state__actions {
  display: flex;
  gap: var(--adyen-sdk-spacer-070, 16px);
  text-align: left;
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-action-bar {
  background-color: var(--adyen-sdk-color-background-primary, #ffffff);
  display: flex;
  align-items: center;
  margin: var(--adyen-sdk-spacer-120, 48px) var(--adyen-sdk-spacer-000, 0px) var(--adyen-sdk-spacer-000, 0px);
}
@container main (max-width: 680px) {
  .adyen-action-bar {
    flex-direction: column;
    gap: var(--adyen-sdk-spacer-040, 8px);
  }
}
@container main (min-width: 680px) and (max-width: 1024px) {
  .adyen-action-bar {
    flex-flow: row-reverse;
    justify-content: space-between;
  }
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-form-navigation {
  width: 100%;
}
@container main (max-width: 680px) {
  .adyen-kyc-form-navigation .adyen-kyc-form-navigation__item {
    display: none;
  }
  .adyen-kyc-form-navigation .adyen-kyc-form-navigation__home-button-item .adyen-kyc-button__text {
    font-size: 0;
  }
  .adyen-kyc-form-navigation .adyen-kyc-form-navigation__home-button-item .adyen-kyc-form-navigation__home-button {
    font-size: var(--adyen-sdk-text-title-font-size, 16px);
    font-family: var(--adyen-sdk-text-title-font-family, 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif);
    font-weight: var(--adyen-sdk-text-title-font-weight, 600);
    line-height: var(--adyen-sdk-text-title-line-height, 26px);
    padding-left: var(--adyen-sdk-spacer-000, 0px);
  }
}
@container main (min-width: 680px) and (max-width: 1024px) {
  .adyen-kyc-form-navigation {
    padding-right: var(--adyen-sdk-spacer-100, 32px);
  }
  .adyen-kyc-form-navigation .adyen-kyc-form-navigation__step-count {
    display: none;
  }
}
@container main (max-width: 680px) {
  .adyen-kyc-form-navigation .adyen-kyc-form-navigation__header {
    display: none;
  }
}
.adyen-kyc-form-navigation .adyen-kyc-form-navigation__items {
  margin: var(--adyen-sdk-spacer-040, 8px) 0 0 0;
  padding: var(--adyen-sdk-spacer-000, 0px);
}

.adyen-kyc-form-navigation__home-button-item {
  align-items: center;
  display: flex;
  justify-content: space-between;
  list-style-type: none;
  margin-bottom: var(--adyen-sdk-spacer-070, 16px);
}/* #region Borders */
/* #endregion */
/* for container queries */
/* #region Z-index */
/* #endregion */
/* #region Timing functions */
/* #endregion */
/* #region Inline components */
/* #endregion */
.adyen-kyc-form-navigation__item {
  align-items: center;
  border-left: var(--adyen-sdk-border-width-m, 2px) solid var(--adyen-sdk-color-outline-primary, #dbdee2);
  color: var(--adyen-sdk-color-label-primary, #00112c);
  cursor: default;
  display: flex;
  padding: var(--adyen-sdk-spacer-040, 8px) var(--adyen-sdk-spacer-000, 0px) var(--adyen-sdk-spacer-040, 8px) var(--adyen-sdk-spacer-040, 8px);
}
.adyen-kyc-form-navigation__item button {
  display: flex;
  background: none;
  border: none;
  font-size: var(--adyen-sdk-text-body-font-size, 14px);
  line-height: var(--adyen-sdk-text-body-line-height, 20px);
  padding: var(--adyen-sdk-spacer-000, 0px);
  color: inher