@adyen/kyc-components 2.10.0 → 2.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/dist/es/adyen-kyc-components.es.js +3837 -3784
  2. package/dist/style.css +1524 -1524
  3. package/dist/types/components/Company/component/CompanyComponent.d.ts +6 -7
  4. package/dist/types/components/Company/index.d.ts +1 -0
  5. package/dist/types/components/Company/types.d.ts +3 -10
  6. package/dist/types/components/CompanyRegistrationDetails/component/CompanyRegistrationDetailsComponent.d.ts +4 -0
  7. package/dist/types/components/CompanyRegistrationDetails/index.d.ts +1 -0
  8. package/dist/types/components/{CompanyDetails → CompanyRegistrationDetails}/types.d.ts +2 -2
  9. package/dist/types/components/CompanyRegistrationDetails/validate.d.ts +30 -0
  10. package/dist/types/components/Dropins/CompanyDropin/components/CompanyDropinComponent.d.ts +1 -1
  11. package/dist/types/components/Dropins/CompanyDropin/types.d.ts +9 -0
  12. package/dist/types/components/EmbeddedDropins/{PayoutEmbeddedDropin/PayoutEmbeddedDropin.d.ts → TransferInstrumentComponent/TransferInstrumentComponent.d.ts} +2 -2
  13. package/dist/types/components/SoleProp/component/SolePropComponent.d.ts +1 -1
  14. package/dist/types/components/SoleProp/types.d.ts +2 -2
  15. package/dist/types/components/Trust/rules.d.ts +3 -0
  16. package/dist/types/components/TrustRegistrationDetails/types.d.ts +3 -2
  17. package/dist/types/components/index.d.ts +2 -2
  18. package/dist/types/components/internal/AccountHolder/types.d.ts +1 -1
  19. package/dist/types/components/internal/Address/Address.d.ts +1 -1
  20. package/dist/types/components/internal/Address/constants.d.ts +2 -2
  21. package/dist/types/components/internal/Address/types.d.ts +10 -1
  22. package/dist/types/components/internal/Address/utils.d.ts +2 -2
  23. package/dist/types/components/internal/BusinessRegistrationNumber/types.d.ts +2 -0
  24. package/dist/types/components/internal/BusinessRegistrationNumber/validate.d.ts +5 -4
  25. package/dist/types/components/internal/LegalCompanyNameField/LegalCompanyNameField.d.ts +1 -1
  26. package/dist/types/components/internal/LegalCompanyNameField/types.d.ts +1 -4
  27. package/dist/types/core/SDKValidation/index.d.ts +1 -1
  28. package/dist/types/core/core.d.ts +1 -1
  29. package/dist/types/core/hooks/useForm/types.d.ts +3 -0
  30. package/dist/types/core/models/api/address-search.d.ts +9 -0
  31. package/dist/types/core/models/api/legal-arrangement.d.ts +0 -1
  32. package/dist/types/core/models/api/organization.d.ts +0 -1
  33. package/dist/types/core/models/country-config.d.ts +1 -0
  34. package/dist/types/core/process-field-configurations.d.ts +1 -1
  35. package/dist/types/language/config.d.ts +3 -5
  36. package/dist/types/utils/decision-maker-roles.d.ts +1 -1
  37. package/dist/types/utils/entity-status-util.d.ts +2 -2
  38. package/dist/types/utils/formUtils.d.ts +1 -0
  39. package/dist/types/utils/mapping/componentApiMapping.d.ts +28 -27
  40. package/dist/types/utils/regex/index.d.ts +1 -0
  41. package/dist/types/utils/regex/trustRegistrationNumberPatterns.d.ts +2 -0
  42. package/dist/types/utils/regex/types.d.ts +5 -0
  43. package/dist/types/utils/trust-util.d.ts +1 -1
  44. package/package.json +1 -1
  45. package/dist/types/components/CompanyDetails/component/CompanyDetailsComponent.d.ts +0 -5
  46. package/dist/types/components/CompanyDetails/validate.d.ts +0 -3
package/dist/style.css CHANGED
@@ -6965,6 +6965,28 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
6965
6965
  /* #endregion */
6966
6966
  /* #region Inline components */
6967
6967
  /* #endregion */
6968
+ /* #region Spacing */
6969
+ /* #endregion */
6970
+ /* #region Colors */
6971
+ /* #endregion */
6972
+ /* #region Fonts */
6973
+ /* #endregion */
6974
+ /* #region Borders */
6975
+ /* #endregion */
6976
+ /* #region Box-shadow */
6977
+ /* #endregion */
6978
+ /* #region Shadows */
6979
+ /* #endregion */
6980
+ /* #region Z-index */
6981
+ /* #endregion */
6982
+ /* #region Transition */
6983
+ /* #endregion */
6984
+ /* #region Timing functions */
6985
+ /* #endregion */
6986
+ /* #region Focus ring */
6987
+ /* #endregion */
6988
+ /* #region Inline components */
6989
+ /* #endregion */
6968
6990
  /* stylelint-disable-line scss/dollar-variable-pattern */
6969
6991
  /* stylelint-disable-line scss/dollar-variable-pattern */
6970
6992
  /* stylelint-disable-line scss/dollar-variable-pattern */
@@ -8795,36 +8817,6 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
8795
8817
  .adl-u-width-auto {
8796
8818
  width: auto !important;
8797
8819
  }
8798
- .adyen-kyc-field--tax-id {
8799
- margin-bottom: 12px;
8800
- }
8801
- .adyen-kyc-field--tax-id-absence-reason {
8802
- margin-top: 12px;
8803
- }
8804
- .adyen-kyc-field--same-name-as-legal-name {
8805
- margin-bottom: 12px;
8806
- }/* #region Spacing */
8807
- /* #endregion */
8808
- /* #region Colors */
8809
- /* #endregion */
8810
- /* #region Fonts */
8811
- /* #endregion */
8812
- /* #region Borders */
8813
- /* #endregion */
8814
- /* #region Box-shadow */
8815
- /* #endregion */
8816
- /* #region Shadows */
8817
- /* #endregion */
8818
- /* #region Z-index */
8819
- /* #endregion */
8820
- /* #region Transition */
8821
- /* #endregion */
8822
- /* #region Timing functions */
8823
- /* #endregion */
8824
- /* #region Focus ring */
8825
- /* #endregion */
8826
- /* #region Inline components */
8827
- /* #endregion */
8828
8820
  /* #region Spacing */
8829
8821
  /* #endregion */
8830
8822
  /* #region Colors */
@@ -10677,81 +10669,55 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
10677
10669
  .adl-u-width-auto {
10678
10670
  width: auto !important;
10679
10671
  }
10680
- .adyen-kyc-checkbox {
10672
+ .adyen-kyc-field {
10673
+ display: block;
10674
+ margin-bottom: 16px;
10675
+ width: 100%;
10676
+ }
10677
+ .adyen-kyc-label {
10681
10678
  display: block;
10682
10679
  }
10683
- .adyen-kyc-checkbox__label {
10680
+ .adyen-kyc-label--disabled {
10681
+ color: #f3f6f9;
10682
+ opacity: 0.5;
10683
+ pointer-events: none;
10684
+ }
10685
+ .adyen-kyc-label__text,
10686
+ .adyen-kyc-helper-text {
10684
10687
  color: #00112c;
10685
- cursor: pointer;
10686
- display: inline-block;
10688
+ display: block;
10687
10689
  font-size: 15px;
10688
10690
  font-weight: normal;
10689
- line-height: 21px;
10690
- padding-left: 24px;
10691
- position: relative;
10692
- user-select: none;
10691
+ margin-bottom: 4px;
10693
10692
  }
10694
- .adyen-kyc-checkbox__helper-text {
10693
+ .adyen-kyc-helper-text {
10695
10694
  color: #69778c;
10696
- cursor: pointer;
10697
- display: block;
10698
- font-size: 15px;
10699
- padding-left: 24px;
10700
- }
10701
- .adyen-kyc-checkbox__input {
10702
- opacity: 0;
10703
- pointer-events: none;
10704
- position: absolute;
10705
- /* Check */
10706
- /* Box */
10707
- }
10708
- .adyen-kyc-checkbox__input:checked + .adyen-kyc-checkbox__label::before {
10709
- opacity: 1;
10695
+ font-size: 13px;
10710
10696
  }
10711
- .adyen-kyc-checkbox__input:checked + .adyen-kyc-checkbox__label::after {
10712
- background-color: #06f;
10713
- border: 1px solid #06f;
10697
+ .adyen-kyc-label__text {
10698
+ display: block;
10699
+ transition: color 0.1s ease-out;
10714
10700
  }
10715
- .adyen-kyc-checkbox__input:checked:hover + .adyen-kyc-checkbox__label::after {
10716
- border-color: #06f;
10717
- box-shadow: 0 0 0 2px rgba(0, 102, 255, 0.4);
10701
+ .adyen-kyc-label__text--error {
10702
+ color: #e50000;
10718
10703
  }
10719
- .adyen-kyc-checkbox__input:focus + .adyen-kyc-checkbox__label::after {
10720
- border: 1px solid #06f;
10721
- box-shadow: 0 0 0 2px #80b2ff;
10704
+ .adyen-kyc-label--focused .adyen-kyc-label__text {
10705
+ color: #06f;
10722
10706
  }
10723
- .adyen-kyc-checkbox__input:hover:not(:focus) + .adyen-kyc-checkbox__label::after {
10724
- border-color: #99a3ad;
10725
- box-shadow: 0 0 0 2px #dce0e5;
10707
+ .adyen-kyc-error-text {
10708
+ align-items: center;
10709
+ color: #e50000;
10710
+ display: flex;
10711
+ font-size: 13px;
10712
+ font-weight: normal;
10713
+ margin-top: 4px;
10714
+ position: relative;
10726
10715
  }
10727
- .adyen-kyc-checkbox__input + .adyen-kyc-checkbox__label::before {
10728
- border-bottom: 2px solid #fff;
10729
- border-radius: 0 2px 1px;
10730
- border-right: 2px solid #fff;
10731
- content: "";
10732
- height: 11px;
10733
- left: 1px;
10734
- opacity: 0;
10735
- position: absolute;
10736
- top: 2px;
10737
- transform: rotateZ(37deg);
10738
- transform-origin: 100% 100%;
10739
- transition: opacity 0.2s ease-out;
10740
- width: 6px;
10741
- z-index: 1;
10716
+ .adyen-kyc-upload-field__subtitle {
10717
+ margin: 16px 0 4px;
10742
10718
  }
10743
- .adyen-kyc-checkbox__input + .adyen-kyc-checkbox__label::after {
10744
- background-color: #fff;
10745
- border: 1px solid #a5afbd;
10746
- border-radius: 4px;
10747
- content: "";
10748
- height: 16px;
10749
- left: 0;
10750
- position: absolute;
10751
- top: 0;
10752
- transition: background 0.15s ease-out, border 0.05s ease-out, box-shadow 0.1s ease-out;
10753
- width: 16px;
10754
- z-index: 0;
10719
+ .adyen-kyc-upload-field__requirements {
10720
+ padding-left: 16px;
10755
10721
  }/* #region Spacing */
10756
10722
  /* #endregion */
10757
10723
  /* #region Colors */
@@ -14478,56 +14444,7 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
14478
14444
  .adl-u-width-auto {
14479
14445
  width: auto !important;
14480
14446
  }
14481
- .adyen-kyc-field {
14482
- display: block;
14483
- margin-bottom: 16px;
14484
- width: 100%;
14485
- }
14486
- .adyen-kyc-label {
14487
- display: block;
14488
- }
14489
- .adyen-kyc-label--disabled {
14490
- color: #f3f6f9;
14491
- opacity: 0.5;
14492
- pointer-events: none;
14493
- }
14494
- .adyen-kyc-label__text,
14495
- .adyen-kyc-helper-text {
14496
- color: #00112c;
14497
- display: block;
14498
- font-size: 15px;
14499
- font-weight: normal;
14500
- margin-bottom: 4px;
14501
- }
14502
- .adyen-kyc-helper-text {
14503
- color: #69778c;
14504
- font-size: 13px;
14505
- }
14506
- .adyen-kyc-label__text {
14507
- display: block;
14508
- transition: color 0.1s ease-out;
14509
- }
14510
- .adyen-kyc-label__text--error {
14511
- color: #e50000;
14512
- }
14513
- .adyen-kyc-label--focused .adyen-kyc-label__text {
14514
- color: #06f;
14515
- }
14516
- .adyen-kyc-error-text {
14517
- align-items: center;
14518
- color: #e50000;
14519
- display: flex;
14520
- font-size: 13px;
14521
- font-weight: normal;
14522
- margin-top: 4px;
14523
- position: relative;
14524
- }
14525
- .adyen-kyc-upload-field__subtitle {
14526
- margin: 16px 0 4px;
14527
- }
14528
- .adyen-kyc-upload-field__requirements {
14529
- padding-left: 16px;
14530
- }/* #region Spacing */
14447
+ /* #region Spacing */
14531
14448
  /* #endregion */
14532
14449
  /* #region Colors */
14533
14450
  /* #endregion */
@@ -16379,61 +16296,212 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
16379
16296
  .adl-u-width-auto {
16380
16297
  width: auto !important;
16381
16298
  }
16382
- /* #region Spacing */
16383
- /* #endregion */
16384
- /* #region Colors */
16385
- /* #endregion */
16386
- /* #region Fonts */
16387
- /* #endregion */
16388
- /* #region Borders */
16389
- /* #endregion */
16390
- /* #region Box-shadow */
16391
- /* #endregion */
16392
- /* #region Shadows */
16393
- /* #endregion */
16394
- /* #region Z-index */
16395
- /* #endregion */
16396
- /* #region Transition */
16397
- /* #endregion */
16398
- /* #region Timing functions */
16399
- /* #endregion */
16400
- /* #region Focus ring */
16401
- /* #endregion */
16402
- /* #region Inline components */
16403
- /* #endregion */
16404
- /* stylelint-disable-line scss/dollar-variable-pattern */
16405
- /* stylelint-disable-line scss/dollar-variable-pattern */
16406
- /* stylelint-disable-line scss/dollar-variable-pattern */
16407
- /* stylelint-disable-line scss/dollar-variable-pattern */
16408
- /* #region Spacing */
16409
- /* #endregion */
16410
- /* #region Colors */
16411
- /* #endregion */
16412
- /* #region Fonts */
16413
- /* #endregion */
16414
- /* #region Borders */
16415
- /* #endregion */
16416
- /* #region Box-shadow */
16417
- /* #endregion */
16418
- /* #region Shadows */
16419
- /* #endregion */
16420
- /* #region Z-index */
16421
- /* #endregion */
16422
- /* #region Transition */
16423
- /* #endregion */
16424
- /* #region Timing functions */
16425
- /* #endregion */
16426
- /* #region Focus ring */
16427
- /* #endregion */
16428
- /* #region Inline components */
16429
- /* #endregion */
16430
- /* stylelint-disable-line scss/dollar-variable-pattern */
16431
- /* stylelint-disable-line scss/dollar-variable-pattern */
16432
- /* stylelint-disable-line scss/dollar-variable-pattern */
16433
- /* stylelint-disable-line scss/dollar-variable-pattern */
16434
- /* #region Spacing */
16435
- /* #endregion */
16436
- /* #region Colors */
16299
+ .adyen-kyc-dropdown {
16300
+ font-size: 1em;
16301
+ max-width: 100%;
16302
+ width: 100%;
16303
+ }
16304
+ .adyen-kyc-dropdown-button {
16305
+ background: #fff;
16306
+ border: 1px solid #dce0e5;
16307
+ border-radius: 6px;
16308
+ box-sizing: border-box;
16309
+ color: #00112c;
16310
+ font-size: 1em;
16311
+ line-height: 20px;
16312
+ min-height: 40px;
16313
+ outline: 0;
16314
+ padding: 7px 24px 7px 12px;
16315
+ text-decoration: none;
16316
+ transition: border 0.2s ease-out, box-shadow 0.2s ease-out;
16317
+ user-select: none;
16318
+ }
16319
+ .adyen-kyc-dropdown-button:hover {
16320
+ border-color: #99a3ad;
16321
+ }
16322
+ .adyen-kyc-dropdown-button__icon {
16323
+ border-radius: 3px;
16324
+ height: 26px;
16325
+ margin-right: 8px;
16326
+ max-width: 40px;
16327
+ }
16328
+ .adyen-kyc-dropdown-button--active,
16329
+ .adyen-kyc-dropdown-button--active:hover,
16330
+ .adyen-kyc-dropdown-button:active,
16331
+ .adyen-kyc-dropdown-button:focus {
16332
+ border-color: #06f;
16333
+ box-shadow: 0 0 0 2px #80b2ff;
16334
+ }
16335
+ .adyen-kyc-dropdown-button--readonly, .adyen-kyc-dropdown-button--readonly.adyen-kyc-dropdown-button--active, .adyen-kyc-dropdown-button--readonly:hover, .adyen-kyc-dropdown-button--readonly:focus {
16336
+ border: 1px solid #a5afbd;
16337
+ color: #8390a3;
16338
+ cursor: not-allowed;
16339
+ background-color: #f3f6f9;
16340
+ border-color: #dce0e5;
16341
+ }
16342
+ .adyen-kyc-dropdown-button--readonly::after {
16343
+ 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");
16344
+ }
16345
+ .adyen-kyc-dropdown-button--invalid {
16346
+ border-color: #e50000;
16347
+ }
16348
+ .adyen-kyc-dropdown-button__text {
16349
+ line-height: 1;
16350
+ overflow: hidden;
16351
+ pointer-events: none;
16352
+ text-overflow: ellipsis;
16353
+ white-space: nowrap;
16354
+ }
16355
+ .adyen-kyc-dropdown-button__text--placeholder {
16356
+ color: #a5afbd;
16357
+ font-weight: 200;
16358
+ line-height: 1.2;
16359
+ }
16360
+ .adyen-kyc-dropdown-button-search {
16361
+ align-items: center;
16362
+ display: flex;
16363
+ width: 100%;
16364
+ }
16365
+ .adyen-kyc-dropdown-button-search__icon {
16366
+ color: #a5afbd;
16367
+ font-size: 0.81em;
16368
+ padding-right: 8px;
16369
+ }
16370
+ .adyen-kyc-dropdown-button-search .adyen-kyc-filter-input::placeholder {
16371
+ color: #a5afbd;
16372
+ }
16373
+ .adyen-kyc-dropdown-button-search::after {
16374
+ display: none;
16375
+ }
16376
+ .adl-loading-indicator::before {
16377
+ background: #a5afbd;
16378
+ }
16379
+ .adl-loading-indicator::after {
16380
+ border-top-color: #a5afbd;
16381
+ }
16382
+ .adyen-kyc-dropdown-list {
16383
+ border-radius: 6px;
16384
+ box-shadow: 0 2px 7px rgba(0, 15, 45, 0.3);
16385
+ max-height: 145px;
16386
+ z-index: 2;
16387
+ }
16388
+ .adyen-kyc-dropdown-list .adyen-kyc-checkbox__helper-text {
16389
+ cursor: pointer;
16390
+ }
16391
+ .adyen-kyc-dropdown-list--above {
16392
+ bottom: -6px;
16393
+ }
16394
+ .adyen-kyc-dropdown-list.adyen-kyc-dropdown-list--active {
16395
+ margin-top: 2px;
16396
+ }
16397
+ .adyen-kyc-dropdown-element {
16398
+ border: 1px solid transparent;
16399
+ cursor: pointer;
16400
+ font-size: 0.81em;
16401
+ hyphens: auto;
16402
+ line-height: 20px;
16403
+ outline: 0;
16404
+ padding: 8px;
16405
+ transition: background 0.2s ease-out, border-color 0.2s ease-out;
16406
+ user-select: none;
16407
+ word-break: break-word;
16408
+ }
16409
+ .adyen-kyc-dropdown-element.adyen-kyc-dropdown-search-element {
16410
+ align-items: baseline;
16411
+ display: flex;
16412
+ font-size: 1em;
16413
+ width: 100%;
16414
+ }
16415
+ .adyen-kyc-dropdown-search-element__description {
16416
+ flex: 1;
16417
+ }
16418
+ .adyen-kyc-dropdown-search-element__description--highlight {
16419
+ font-weight: 600;
16420
+ }
16421
+ .adyen-kyc-dropdown-search-element__addresses {
16422
+ color: #69778c;
16423
+ display: flex;
16424
+ }
16425
+ .adyen-kyc-dropdown-search-element__addresses--icon {
16426
+ align-items: center;
16427
+ color: #69778c;
16428
+ display: flex;
16429
+ margin-left: 8px;
16430
+ }
16431
+ .adyen-kyc-dropdown-search-element__addresses--text {
16432
+ display: none;
16433
+ margin-left: 4px;
16434
+ }
16435
+ @media screen and (min-width: 1240px) {
16436
+ .adyen-kyc-dropdown-search-element__addresses--text {
16437
+ display: block;
16438
+ }
16439
+ }
16440
+ .adyen-kyc-dropdown-element:last-child {
16441
+ border-bottom: 0;
16442
+ }
16443
+ .adyen-kyc-dropdown-element:hover,
16444
+ .adyen-kyc-dropdown-element:focus,
16445
+ .adyen-kyc-dropdown-element:active {
16446
+ background: rgba(230, 233, 235, 0.6);
16447
+ }
16448
+ .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active {
16449
+ background: rgba(0, 102, 255, 0.1);
16450
+ }
16451
+ .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active:hover,
16452
+ .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active:focus,
16453
+ .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active:active {
16454
+ background: rgba(0, 102, 255, 0.15);
16455
+ }
16456
+ .adyen-kyc-dropdown-element--disabled {
16457
+ cursor: not-allowed;
16458
+ opacity: 0.4;
16459
+ }
16460
+ .adyen-kyc-dropdown-element__icon {
16461
+ border-radius: 4px;
16462
+ margin-right: 8px;
16463
+ max-height: 26px;
16464
+ max-width: 40px;
16465
+ }
16466
+ .adyen-kyc-dropdown-element__flag {
16467
+ margin-left: 8px;
16468
+ margin-right: 10px;
16469
+ max-height: 18px;
16470
+ max-width: 27px;
16471
+ }
16472
+ .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element-description {
16473
+ align-items: baseline;
16474
+ flex-direction: column;
16475
+ font-size: 1em;
16476
+ }
16477
+ .adyen-kyc-dropdown-element-description__text {
16478
+ color: #69778c;
16479
+ }
16480
+ .adyen-kyc-dropdown + .adyen-kyc-input__inline-validation {
16481
+ right: 32px;
16482
+ }
16483
+ .adyen-kyc-dropdown-selected-items {
16484
+ align-items: baseline;
16485
+ display: flex;
16486
+ flex-direction: row;
16487
+ flex-wrap: wrap;
16488
+ }
16489
+ .adyen-kyc-dropdown-selected-items .adl-tag {
16490
+ align-self: center;
16491
+ border-radius: 6px;
16492
+ color: #00112c;
16493
+ letter-spacing: 0.2px;
16494
+ margin: 2px 8px 2px 0;
16495
+ padding: 2px 8px;
16496
+ }
16497
+ .adyen-kyc-dropdown-selected-items__tag--teal {
16498
+ background-color: #eef9f9;
16499
+ }
16500
+ .adyen-kyc-dropdown-selected-items__tag--blue {
16501
+ background-color: #e6f0ff;
16502
+ }/* #region Spacing */
16503
+ /* #endregion */
16504
+ /* #region Colors */
16437
16505
  /* #endregion */
16438
16506
  /* #region Fonts */
16439
16507
  /* #endregion */
@@ -16453,6 +16521,10 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
16453
16521
  /* #endregion */
16454
16522
  /* #region Inline components */
16455
16523
  /* #endregion */
16524
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16525
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16526
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16527
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16456
16528
  /* #region Spacing */
16457
16529
  /* #endregion */
16458
16530
  /* #region Colors */
@@ -16479,34 +16551,6 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
16479
16551
  /* stylelint-disable-line scss/dollar-variable-pattern */
16480
16552
  /* stylelint-disable-line scss/dollar-variable-pattern */
16481
16553
  /* stylelint-disable-line scss/dollar-variable-pattern */
16482
- .adl-u-screen-reader-only {
16483
- border: 0;
16484
- clip: rect(0, 0, 0, 0);
16485
- height: 1px;
16486
- overflow: hidden;
16487
- padding: 0 !important;
16488
- position: absolute;
16489
- white-space: nowrap;
16490
- width: 1px;
16491
- }
16492
- .adl-u-screen-reader-only-focusable {
16493
- border: 0;
16494
- clip: rect(0, 0, 0, 0);
16495
- height: 1px;
16496
- overflow: hidden;
16497
- padding: 0 !important;
16498
- position: absolute;
16499
- white-space: nowrap;
16500
- width: 1px;
16501
- }
16502
- .adl-u-screen-reader-only-focusable:active, .adl-u-screen-reader-only-focusable:focus {
16503
- clip: auto;
16504
- height: auto;
16505
- overflow: visible;
16506
- position: static;
16507
- white-space: normal;
16508
- width: auto;
16509
- }
16510
16554
  /* #region Spacing */
16511
16555
  /* #endregion */
16512
16556
  /* #region Colors */
@@ -16529,24 +16573,100 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
16529
16573
  /* #endregion */
16530
16574
  /* #region Inline components */
16531
16575
  /* #endregion */
16532
- /* stylelint-disable-line scss/dollar-variable-pattern */
16533
- /* stylelint-disable-line scss/dollar-variable-pattern */
16534
- /* stylelint-disable-line scss/dollar-variable-pattern */
16535
- /* stylelint-disable-line scss/dollar-variable-pattern */
16536
- .adl-u-text-align-center {
16537
- text-align: center !important;
16538
- }
16539
- .adl-u-text-align-left {
16540
- text-align: left !important;
16541
- }
16542
- .adl-u-text-align-right {
16543
- text-align: right !important;
16544
- }
16545
- .adl-u-text-align-justify {
16546
- text-align: justify !important;
16547
- }
16548
- .adl-u-vertical-align-baseline {
16549
- vertical-align: baseline !important;
16576
+ /* #region Spacing */
16577
+ /* #endregion */
16578
+ /* #region Colors */
16579
+ /* #endregion */
16580
+ /* #region Fonts */
16581
+ /* #endregion */
16582
+ /* #region Borders */
16583
+ /* #endregion */
16584
+ /* #region Box-shadow */
16585
+ /* #endregion */
16586
+ /* #region Shadows */
16587
+ /* #endregion */
16588
+ /* #region Z-index */
16589
+ /* #endregion */
16590
+ /* #region Transition */
16591
+ /* #endregion */
16592
+ /* #region Timing functions */
16593
+ /* #endregion */
16594
+ /* #region Focus ring */
16595
+ /* #endregion */
16596
+ /* #region Inline components */
16597
+ /* #endregion */
16598
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16599
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16600
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16601
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16602
+ .adl-u-screen-reader-only {
16603
+ border: 0;
16604
+ clip: rect(0, 0, 0, 0);
16605
+ height: 1px;
16606
+ overflow: hidden;
16607
+ padding: 0 !important;
16608
+ position: absolute;
16609
+ white-space: nowrap;
16610
+ width: 1px;
16611
+ }
16612
+ .adl-u-screen-reader-only-focusable {
16613
+ border: 0;
16614
+ clip: rect(0, 0, 0, 0);
16615
+ height: 1px;
16616
+ overflow: hidden;
16617
+ padding: 0 !important;
16618
+ position: absolute;
16619
+ white-space: nowrap;
16620
+ width: 1px;
16621
+ }
16622
+ .adl-u-screen-reader-only-focusable:active, .adl-u-screen-reader-only-focusable:focus {
16623
+ clip: auto;
16624
+ height: auto;
16625
+ overflow: visible;
16626
+ position: static;
16627
+ white-space: normal;
16628
+ width: auto;
16629
+ }
16630
+ /* #region Spacing */
16631
+ /* #endregion */
16632
+ /* #region Colors */
16633
+ /* #endregion */
16634
+ /* #region Fonts */
16635
+ /* #endregion */
16636
+ /* #region Borders */
16637
+ /* #endregion */
16638
+ /* #region Box-shadow */
16639
+ /* #endregion */
16640
+ /* #region Shadows */
16641
+ /* #endregion */
16642
+ /* #region Z-index */
16643
+ /* #endregion */
16644
+ /* #region Transition */
16645
+ /* #endregion */
16646
+ /* #region Timing functions */
16647
+ /* #endregion */
16648
+ /* #region Focus ring */
16649
+ /* #endregion */
16650
+ /* #region Inline components */
16651
+ /* #endregion */
16652
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16653
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16654
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16655
+ /* stylelint-disable-line scss/dollar-variable-pattern */
16656
+ .adl-u-text-align-center {
16657
+ text-align: center !important;
16658
+ }
16659
+ .adl-u-text-align-left {
16660
+ text-align: left !important;
16661
+ }
16662
+ .adl-u-text-align-right {
16663
+ text-align: right !important;
16664
+ }
16665
+ .adl-u-text-align-justify {
16666
+ text-align: justify !important;
16667
+ }
16668
+ .adl-u-vertical-align-baseline {
16669
+ vertical-align: baseline !important;
16550
16670
  }
16551
16671
  .adl-u-vertical-align-top {
16552
16672
  vertical-align: top !important;
@@ -19760,444 +19880,67 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
19760
19880
  }
19761
19881
  .adl-u-margin-y-0 {
19762
19882
  margin-bottom: 0 !important;
19763
- margin-top: 0 !important;
19764
- }
19765
- .adl-u-margin-auto {
19766
- margin: auto !important;
19767
- }
19768
- .adl-u-margin-bottom-auto {
19769
- margin-bottom: auto !important;
19770
- }
19771
- .adl-u-margin-left-auto {
19772
- margin-left: auto !important;
19773
- }
19774
- .adl-u-margin-right-auto {
19775
- margin-right: auto !important;
19776
- }
19777
- .adl-u-margin-top-auto {
19778
- margin-top: auto !important;
19779
- }
19780
- .adl-u-margin-x-auto {
19781
- margin-left: auto !important;
19782
- margin-right: auto !important;
19783
- }
19784
- .adl-u-margin-y-auto {
19785
- margin-bottom: auto !important;
19786
- margin-top: auto !important;
19787
- }
19788
- .adl-u-box-sizing-border-box {
19789
- box-sizing: border-box !important;
19790
- }
19791
- /* #region Spacing */
19792
- /* #endregion */
19793
- /* #region Colors */
19794
- /* #endregion */
19795
- /* #region Fonts */
19796
- /* #endregion */
19797
- /* #region Borders */
19798
- /* #endregion */
19799
- /* #region Box-shadow */
19800
- /* #endregion */
19801
- /* #region Shadows */
19802
- /* #endregion */
19803
- /* #region Z-index */
19804
- /* #endregion */
19805
- /* #region Transition */
19806
- /* #endregion */
19807
- /* #region Timing functions */
19808
- /* #endregion */
19809
- /* #region Focus ring */
19810
- /* #endregion */
19811
- /* #region Inline components */
19812
- /* #endregion */
19813
- /* stylelint-disable-line scss/dollar-variable-pattern */
19814
- /* stylelint-disable-line scss/dollar-variable-pattern */
19815
- /* stylelint-disable-line scss/dollar-variable-pattern */
19816
- /* stylelint-disable-line scss/dollar-variable-pattern */
19817
- .adl-u-pointer-events-none {
19818
- pointer-events: none !important;
19819
- }
19820
- .adl-u-pointer-events-auto {
19821
- pointer-events: auto !important;
19822
- }
19823
- /* #region Spacing */
19824
- /* #endregion */
19825
- /* #region Colors */
19826
- /* #endregion */
19827
- /* #region Fonts */
19828
- /* #endregion */
19829
- /* #region Borders */
19830
- /* #endregion */
19831
- /* #region Box-shadow */
19832
- /* #endregion */
19833
- /* #region Shadows */
19834
- /* #endregion */
19835
- /* #region Z-index */
19836
- /* #endregion */
19837
- /* #region Transition */
19838
- /* #endregion */
19839
- /* #region Timing functions */
19840
- /* #endregion */
19841
- /* #region Focus ring */
19842
- /* #endregion */
19843
- /* #region Inline components */
19844
- /* #endregion */
19845
- /* #region Spacing */
19846
- /* #endregion */
19847
- /* #region Colors */
19848
- /* #endregion */
19849
- /* #region Fonts */
19850
- /* #endregion */
19851
- /* #region Borders */
19852
- /* #endregion */
19853
- /* #region Box-shadow */
19854
- /* #endregion */
19855
- /* #region Shadows */
19856
- /* #endregion */
19857
- /* #region Z-index */
19858
- /* #endregion */
19859
- /* #region Transition */
19860
- /* #endregion */
19861
- /* #region Timing functions */
19862
- /* #endregion */
19863
- /* #region Focus ring */
19864
- /* #endregion */
19865
- /* #region Inline components */
19866
- /* #endregion */
19867
- /* stylelint-disable-line scss/dollar-variable-pattern */
19868
- /* stylelint-disable-line scss/dollar-variable-pattern */
19869
- /* stylelint-disable-line scss/dollar-variable-pattern */
19870
- /* stylelint-disable-line scss/dollar-variable-pattern */
19871
- .adl-u-font-size-small {
19872
- font-size: 13px !important;
19873
- }
19874
- .adl-u-font-size-medium {
19875
- font-size: 15px !important;
19876
- }
19877
- .adl-u-font-size-large {
19878
- font-size: 21px !important;
19879
- }
19880
- .adl-u-font-size-xlarge {
19881
- font-size: 30px !important;
19882
- }
19883
- .adl-u-font-size-xxlarge {
19884
- font-size: 45px !important;
19885
- }
19886
- .adl-u-font-size-inherit {
19887
- font-size: inherit !important;
19888
- }
19889
- .adl-u-font-weight-thin {
19890
- font-weight: 100 !important;
19891
- }
19892
- .adl-u-font-weight-regular {
19893
- font-weight: 400 !important;
19894
- }
19895
- .adl-u-font-weight-medium {
19896
- font-weight: 500 !important;
19897
- }
19898
- .adl-u-font-weight-semi-bold {
19899
- font-weight: 600 !important;
19900
- }
19901
- .adl-u-white-space-normal {
19902
- white-space: normal !important;
19903
- }
19904
- .adl-u-white-space-nowrap {
19905
- white-space: nowrap !important;
19906
- }
19907
- .adl-u-white-space-pre-wrap {
19908
- white-space: pre-wrap !important;
19909
- }
19910
- .adl-u-truncate {
19911
- overflow: hidden !important;
19912
- text-overflow: ellipsis !important;
19913
- }
19914
- .adl-u-word-break-break-word {
19915
- word-break: break-word !important;
19916
- }
19917
- /* #region Spacing */
19918
- /* #endregion */
19919
- /* #region Colors */
19920
- /* #endregion */
19921
- /* #region Fonts */
19922
- /* #endregion */
19923
- /* #region Borders */
19924
- /* #endregion */
19925
- /* #region Box-shadow */
19926
- /* #endregion */
19927
- /* #region Shadows */
19928
- /* #endregion */
19929
- /* #region Z-index */
19930
- /* #endregion */
19931
- /* #region Transition */
19932
- /* #endregion */
19933
- /* #region Timing functions */
19934
- /* #endregion */
19935
- /* #region Focus ring */
19936
- /* #endregion */
19937
- /* #region Inline components */
19938
- /* #endregion */
19939
- /* stylelint-disable-line scss/dollar-variable-pattern */
19940
- /* stylelint-disable-line scss/dollar-variable-pattern */
19941
- /* stylelint-disable-line scss/dollar-variable-pattern */
19942
- /* stylelint-disable-line scss/dollar-variable-pattern */
19943
- .adl-u-visibility-visible {
19944
- visibility: visible !important;
19945
- }
19946
- .adl-u-visibility-hidden {
19947
- visibility: hidden !important;
19948
- }
19949
- .adl-u-display-none {
19950
- display: none !important;
19951
- }
19952
- .adl-u-display-initial {
19953
- display: initial !important;
19954
- }
19955
- .adl-u-display-inline {
19956
- display: inline !important;
19957
- }
19958
- .adl-u-display-inline-block {
19959
- display: inline-block !important;
19960
- }
19961
- .adl-u-display-block {
19962
- display: block !important;
19963
- }
19964
- .adl-u-display-table {
19965
- display: table !important;
19966
- }
19967
- .adl-u-display-table-row {
19968
- display: table-row !important;
19969
- }
19970
- .adl-u-display-table-cell {
19971
- display: table-cell !important;
19972
- }
19973
- /* #region Spacing */
19974
- /* #endregion */
19975
- /* #region Colors */
19976
- /* #endregion */
19977
- /* #region Fonts */
19978
- /* #endregion */
19979
- /* #region Borders */
19980
- /* #endregion */
19981
- /* #region Box-shadow */
19982
- /* #endregion */
19983
- /* #region Shadows */
19984
- /* #endregion */
19985
- /* #region Z-index */
19986
- /* #endregion */
19987
- /* #region Transition */
19988
- /* #endregion */
19989
- /* #region Timing functions */
19990
- /* #endregion */
19991
- /* #region Focus ring */
19992
- /* #endregion */
19993
- /* #region Inline components */
19994
- /* #endregion */
19995
- /* stylelint-disable-line scss/dollar-variable-pattern */
19996
- /* stylelint-disable-line scss/dollar-variable-pattern */
19997
- /* stylelint-disable-line scss/dollar-variable-pattern */
19998
- /* stylelint-disable-line scss/dollar-variable-pattern */
19999
- .adl-u-display-flex {
20000
- display: flex !important;
20001
- }
20002
- .adl-u-display-inline-flex {
20003
- display: inline-flex !important;
20004
- }
20005
- .adl-u-flex-direction-row {
20006
- flex-direction: row !important;
20007
- }
20008
- .adl-u-flex-direction-row-reverse {
20009
- flex-direction: row-reverse !important;
20010
- }
20011
- .adl-u-flex-direction-column {
20012
- flex-direction: column !important;
20013
- }
20014
- .adl-u-flex-direction-column-reverse {
20015
- flex-direction: column-reverse !important;
20016
- }
20017
- .adl-u-flex-wrap-wrap {
20018
- flex-wrap: wrap !important;
20019
- }
20020
- .adl-u-flex-wrap-nowrap {
20021
- flex-wrap: nowrap !important;
20022
- }
20023
- .adl-u-align-items-start {
20024
- align-items: start !important;
20025
- }
20026
- .adl-u-align-items-flex-start {
20027
- align-items: flex-start !important;
20028
- }
20029
- .adl-u-align-items-flex-end {
20030
- align-items: flex-end !important;
20031
- }
20032
- .adl-u-align-items-center {
20033
- align-items: center !important;
20034
- }
20035
- .adl-u-align-items-stretch {
20036
- align-items: stretch !important;
20037
- }
20038
- .adl-u-align-items-baseline {
20039
- align-items: baseline !important;
20040
- }
20041
- .adl-u-align-items-end {
20042
- align-items: end !important;
20043
- }
20044
- .adl-u-justify-content-center {
20045
- justify-content: center !important;
20046
- }
20047
- .adl-u-justify-content-flex-start {
20048
- justify-content: flex-start !important;
20049
- }
20050
- .adl-u-justify-content-flex-end {
20051
- justify-content: flex-end !important;
20052
- }
20053
- .adl-u-justify-content-start {
20054
- justify-content: start !important;
20055
- }
20056
- .adl-u-justify-content-end {
20057
- justify-content: end !important;
20058
- }
20059
- .adl-u-justify-content-left {
20060
- justify-content: left !important;
20061
- }
20062
- .adl-u-justify-content-right {
20063
- justify-content: right !important;
20064
- }
20065
- .adl-u-justify-content-space-between {
20066
- justify-content: space-between !important;
20067
- }
20068
- .adl-u-justify-content-space-around {
20069
- justify-content: space-around !important;
20070
- }
20071
- .adl-u-justify-content-space-evenly {
20072
- justify-content: space-evenly !important;
20073
- }
20074
- .adl-u-justify-content-stretch {
20075
- justify-content: stretch !important;
20076
- }
20077
- .adl-u-flex-1 {
20078
- flex: 1 !important;
20079
- }
20080
- .adl-u-width-full {
20081
- width: 100% !important;
20082
- }
20083
- .adl-u-width-auto {
20084
- width: auto !important;
20085
- }
20086
- .adyen-kyc-field-wrapper {
20087
- display: flex;
20088
- flex-wrap: wrap;
20089
- width: 100%;
20090
- }
20091
- .adyen-kyc-field-wrapper:last-of-type > .adyen-kyc-field:not(:last-of-type) {
20092
- margin-bottom: 16px;
20093
- }
20094
- .adyen-kyc-field--col-70 {
20095
- width: calc(70% - 8px);
20096
- }
20097
- .adyen-kyc-field--col-50 {
20098
- width: calc(50% - 8px);
20099
- }
20100
- .adyen-kyc-field--col-30 {
20101
- width: calc(30% - 8px);
20102
- }
20103
- .adyen-kyc-input-wrapper {
20104
- display: block;
20105
- position: relative;
20106
- }
20107
- .adyen-kyc-input-wrapper--block {
20108
- display: block;
20109
- }
20110
- .adyen-kyc-input {
20111
- height: 40px;
20112
- line-height: 40px;
20113
- min-height: 40px;
20114
- padding-bottom: 0;
20115
- padding-top: 0;
20116
- background: #fff;
20117
- border: 1px solid #dce0e5;
20118
- border-radius: 6px;
20119
- box-sizing: border-box;
20120
- caret-color: #06f;
20121
- color: #00112c;
20122
- display: block;
20123
- font-family: inherit;
20124
- font-size: 1em;
20125
- outline: none;
20126
- padding: 8px;
20127
- position: relative;
20128
- transition: border 0.2s ease-out, box-shadow 0.2s ease-out;
20129
- width: 100%;
20130
- }
20131
- .adyen-kyc-input::placeholder {
20132
- color: #a5afbd;
20133
- font-weight: 200;
20134
- }
20135
- .adyen-kyc-input:hover {
20136
- border-color: #99a3ad;
20137
- }
20138
- .adyen-kyc-input:required {
20139
- box-shadow: none;
20140
- }
20141
- .adyen-kyc-input[readonly], .adyen-kyc-input[readonly]:hover, .adyen-kyc-input--disabled {
20142
- border: 1px solid #a5afbd;
20143
- color: #8390a3;
20144
- cursor: not-allowed;
20145
- background-color: #f3f6f9;
20146
- border-color: #dce0e5;
20147
- }
20148
- .adyen-kyc-input--disabled:hover {
20149
- border-color: #f3f6f9;
20150
- }
20151
- .adyen-kyc-input--error, .adyen-kyc-input--invalid, .adyen-kyc-input--error:hover, .adyen-kyc-input--invalid:hover {
20152
- border-color: #e50000;
20153
- color: #e50000;
20154
- }
20155
- .adyen-kyc-input:active, .adyen-kyc-input:focus, .adyen-kyc-input--focus, .adyen-kyc-input:active:hover, .adyen-kyc-input:focus:hover, .adyen-kyc-input--focus:hover {
20156
- border: 1px solid #06f;
19883
+ margin-top: 0 !important;
20157
19884
  }
20158
- .adyen-kyc-input--date {
20159
- padding-right: 30px;
19885
+ .adl-u-margin-auto {
19886
+ margin: auto !important;
20160
19887
  }
20161
- .adyen-kyc-input--textarea {
20162
- height: 60px;
19888
+ .adl-u-margin-bottom-auto {
19889
+ margin-bottom: auto !important;
20163
19890
  }
20164
- .adyen-kyc-input__inline-validation {
20165
- height: 16px;
20166
- position: absolute;
20167
- right: 14px;
20168
- transform: translateY(-50%);
20169
- width: 16px;
19891
+ .adl-u-margin-left-auto {
19892
+ margin-left: auto !important;
20170
19893
  }
20171
- .adyen-kyc-input__inline-validation--valid {
20172
- color: #0abf53;
20173
- display: none;
19894
+ .adl-u-margin-right-auto {
19895
+ margin-right: auto !important;
20174
19896
  }
20175
- .adyen-kyc-input__inline-validation--invalid {
20176
- color: #e50000;
20177
- top: 50%;
19897
+ .adl-u-margin-top-auto {
19898
+ margin-top: auto !important;
20178
19899
  }
20179
- .adyen-kyc-input__inline-validation--invalid-bottom {
20180
- top: 8px;
19900
+ .adl-u-margin-x-auto {
19901
+ margin-left: auto !important;
19902
+ margin-right: auto !important;
20181
19903
  }
20182
- .adyen-kyc-input__counter {
20183
- color: #69778c;
20184
- font-size: 13px;
20185
- margin: 4px 0;
20186
- position: absolute;
20187
- right: 0;
19904
+ .adl-u-margin-y-auto {
19905
+ margin-bottom: auto !important;
19906
+ margin-top: auto !important;
20188
19907
  }
20189
- .adyen-layout-xs-only [class*=adyen-kyc-field--col-] {
20190
- width: 100%;
19908
+ .adl-u-box-sizing-border-box {
19909
+ box-sizing: border-box !important;
20191
19910
  }
20192
- .adyen-layout-md .adyen-kyc-field-wrapper {
20193
- flex-wrap: nowrap;
19911
+ /* #region Spacing */
19912
+ /* #endregion */
19913
+ /* #region Colors */
19914
+ /* #endregion */
19915
+ /* #region Fonts */
19916
+ /* #endregion */
19917
+ /* #region Borders */
19918
+ /* #endregion */
19919
+ /* #region Box-shadow */
19920
+ /* #endregion */
19921
+ /* #region Shadows */
19922
+ /* #endregion */
19923
+ /* #region Z-index */
19924
+ /* #endregion */
19925
+ /* #region Transition */
19926
+ /* #endregion */
19927
+ /* #region Timing functions */
19928
+ /* #endregion */
19929
+ /* #region Focus ring */
19930
+ /* #endregion */
19931
+ /* #region Inline components */
19932
+ /* #endregion */
19933
+ /* stylelint-disable-line scss/dollar-variable-pattern */
19934
+ /* stylelint-disable-line scss/dollar-variable-pattern */
19935
+ /* stylelint-disable-line scss/dollar-variable-pattern */
19936
+ /* stylelint-disable-line scss/dollar-variable-pattern */
19937
+ .adl-u-pointer-events-none {
19938
+ pointer-events: none !important;
20194
19939
  }
20195
- .adyen-layout-md .adyen-kyc-field-wrapper > .adyen-kyc-field:first-child {
20196
- margin-right: 8px;
19940
+ .adl-u-pointer-events-auto {
19941
+ pointer-events: auto !important;
20197
19942
  }
20198
- .adyen-layout-md .adyen-kyc-field-wrapper > .adyen-kyc-field:nth-child(2) {
20199
- margin-left: 8px;
20200
- }/* #region Spacing */
19943
+ /* #region Spacing */
20201
19944
  /* #endregion */
20202
19945
  /* #region Colors */
20203
19946
  /* #endregion */
@@ -20245,64 +19988,53 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
20245
19988
  /* stylelint-disable-line scss/dollar-variable-pattern */
20246
19989
  /* stylelint-disable-line scss/dollar-variable-pattern */
20247
19990
  /* stylelint-disable-line scss/dollar-variable-pattern */
20248
- .adl-accordion {
20249
- color: #00112c;
20250
- font-family: fakt, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;
20251
- font-size: 15px;
20252
- -webkit-font-smoothing: antialiased;
20253
- -moz-osx-font-smoothing: grayscale;
20254
- font-weight: 400;
20255
- line-height: 1.4;
19991
+ .adl-u-font-size-small {
19992
+ font-size: 13px !important;
20256
19993
  }
20257
- .adl-accordion *,
20258
- .adl-accordion *::before,
20259
- .adl-accordion *::after {
20260
- box-sizing: border-box;
19994
+ .adl-u-font-size-medium {
19995
+ font-size: 15px !important;
20261
19996
  }
20262
- .adl-accordion--container {
20263
- border: 1px solid #dce0e5;
20264
- border-radius: 6px;
19997
+ .adl-u-font-size-large {
19998
+ font-size: 21px !important;
20265
19999
  }
20266
- .adl-accordion--container .adl-accordion__item:first-child {
20267
- border-top-color: transparent;
20000
+ .adl-u-font-size-xlarge {
20001
+ font-size: 30px !important;
20268
20002
  }
20269
- .adl-accordion--container .adl-accordion__item:first-child > .adl-accordion__header {
20270
- border-radius: 4px 4px 0 0;
20003
+ .adl-u-font-size-xxlarge {
20004
+ font-size: 45px !important;
20271
20005
  }
20272
- .adl-accordion--container .adl-accordion__item:last-child {
20273
- border-bottom-color: transparent;
20006
+ .adl-u-font-size-inherit {
20007
+ font-size: inherit !important;
20274
20008
  }
20275
- .adl-accordion--container .adl-accordion__item:last-child:not(.adl-accordion__item--open) > .adl-accordion__header {
20276
- border-radius: 0 0 4px 4px;
20009
+ .adl-u-font-weight-thin {
20010
+ font-weight: 100 !important;
20277
20011
  }
20278
- .adl-accordion--guide {
20279
- margin: 8px 0;
20280
- padding-bottom: 16px;
20012
+ .adl-u-font-weight-regular {
20013
+ font-weight: 400 !important;
20281
20014
  }
20282
- .adl-accordion--guide .adl-accordion__item {
20283
- background-color: #f3f6f9;
20284
- border: 0;
20285
- border-radius: 4px;
20286
- padding: 4px 8px;
20015
+ .adl-u-font-weight-medium {
20016
+ font-weight: 500 !important;
20287
20017
  }
20288
- .adl-accordion--guide .adl-accordion__header {
20289
- padding: 0;
20018
+ .adl-u-font-weight-semi-bold {
20019
+ font-weight: 600 !important;
20290
20020
  }
20291
- .adl-accordion--guide .adl-accordion__title {
20292
- color: #394962;
20293
- font-size: 13px;
20294
- font-weight: bold;
20021
+ .adl-u-white-space-normal {
20022
+ white-space: normal !important;
20295
20023
  }
20296
- .adl-accordion--guide .adl-accordion__content {
20297
- color: #394962;
20298
- font-size: 13px;
20299
- margin: 4px 24px;
20300
- padding: 0;
20024
+ .adl-u-white-space-nowrap {
20025
+ white-space: nowrap !important;
20301
20026
  }
20302
- .adl-accordion--guide .adl-accordion__toggle {
20303
- color: #a5afbd;
20304
- margin: 2px 8px 0 4px;
20305
- }/* #region Spacing */
20027
+ .adl-u-white-space-pre-wrap {
20028
+ white-space: pre-wrap !important;
20029
+ }
20030
+ .adl-u-truncate {
20031
+ overflow: hidden !important;
20032
+ text-overflow: ellipsis !important;
20033
+ }
20034
+ .adl-u-word-break-break-word {
20035
+ word-break: break-word !important;
20036
+ }
20037
+ /* #region Spacing */
20306
20038
  /* #endregion */
20307
20039
  /* #region Colors */
20308
20040
  /* #endregion */
@@ -20324,6 +20056,40 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
20324
20056
  /* #endregion */
20325
20057
  /* #region Inline components */
20326
20058
  /* #endregion */
20059
+ /* stylelint-disable-line scss/dollar-variable-pattern */
20060
+ /* stylelint-disable-line scss/dollar-variable-pattern */
20061
+ /* stylelint-disable-line scss/dollar-variable-pattern */
20062
+ /* stylelint-disable-line scss/dollar-variable-pattern */
20063
+ .adl-u-visibility-visible {
20064
+ visibility: visible !important;
20065
+ }
20066
+ .adl-u-visibility-hidden {
20067
+ visibility: hidden !important;
20068
+ }
20069
+ .adl-u-display-none {
20070
+ display: none !important;
20071
+ }
20072
+ .adl-u-display-initial {
20073
+ display: initial !important;
20074
+ }
20075
+ .adl-u-display-inline {
20076
+ display: inline !important;
20077
+ }
20078
+ .adl-u-display-inline-block {
20079
+ display: inline-block !important;
20080
+ }
20081
+ .adl-u-display-block {
20082
+ display: block !important;
20083
+ }
20084
+ .adl-u-display-table {
20085
+ display: table !important;
20086
+ }
20087
+ .adl-u-display-table-row {
20088
+ display: table-row !important;
20089
+ }
20090
+ .adl-u-display-table-cell {
20091
+ display: table-cell !important;
20092
+ }
20327
20093
  /* #region Spacing */
20328
20094
  /* #endregion */
20329
20095
  /* #region Colors */
@@ -20350,77 +20116,94 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
20350
20116
  /* stylelint-disable-line scss/dollar-variable-pattern */
20351
20117
  /* stylelint-disable-line scss/dollar-variable-pattern */
20352
20118
  /* stylelint-disable-line scss/dollar-variable-pattern */
20353
- .adl-accordion__item {
20354
- border-bottom: 1px solid transparent;
20355
- border-top: 1px solid #dce0e5;
20356
- position: relative;
20119
+ .adl-u-display-flex {
20120
+ display: flex !important;
20357
20121
  }
20358
- .adl-accordion__item:last-child {
20359
- border-bottom-color: #dce0e5;
20122
+ .adl-u-display-inline-flex {
20123
+ display: inline-flex !important;
20360
20124
  }
20361
- .adl-accordion__item--open {
20362
- overflow: visible;
20125
+ .adl-u-flex-direction-row {
20126
+ flex-direction: row !important;
20363
20127
  }
20364
- .adl-accordion__header {
20365
- color: #00112c;
20366
- cursor: pointer;
20367
- display: flex;
20368
- padding: 16px;
20369
- transition-duration: 0.1s;
20370
- transition-property: margin, height, padding;
20128
+ .adl-u-flex-direction-row-reverse {
20129
+ flex-direction: row-reverse !important;
20130
+ }
20131
+ .adl-u-flex-direction-column {
20132
+ flex-direction: column !important;
20133
+ }
20134
+ .adl-u-flex-direction-column-reverse {
20135
+ flex-direction: column-reverse !important;
20136
+ }
20137
+ .adl-u-flex-wrap-wrap {
20138
+ flex-wrap: wrap !important;
20139
+ }
20140
+ .adl-u-flex-wrap-nowrap {
20141
+ flex-wrap: nowrap !important;
20142
+ }
20143
+ .adl-u-align-items-start {
20144
+ align-items: start !important;
20145
+ }
20146
+ .adl-u-align-items-flex-start {
20147
+ align-items: flex-start !important;
20148
+ }
20149
+ .adl-u-align-items-flex-end {
20150
+ align-items: flex-end !important;
20151
+ }
20152
+ .adl-u-align-items-center {
20153
+ align-items: center !important;
20154
+ }
20155
+ .adl-u-align-items-stretch {
20156
+ align-items: stretch !important;
20157
+ }
20158
+ .adl-u-align-items-baseline {
20159
+ align-items: baseline !important;
20160
+ }
20161
+ .adl-u-align-items-end {
20162
+ align-items: end !important;
20163
+ }
20164
+ .adl-u-justify-content-center {
20165
+ justify-content: center !important;
20371
20166
  }
20372
- .adl-accordion__header:hover {
20373
- background-color: #f3f6f9;
20167
+ .adl-u-justify-content-flex-start {
20168
+ justify-content: flex-start !important;
20374
20169
  }
20375
- .adl-accordion__header:active {
20376
- background-color: #dce0e5;
20170
+ .adl-u-justify-content-flex-end {
20171
+ justify-content: flex-end !important;
20377
20172
  }
20378
- .adl-accordion__header:focus {
20379
- box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgba(0, 102, 255, 0.4);
20380
- transition: 0.1s cubic-bezier(0.785, 0.135, 0.15, 0.86);
20381
- transition-property: box-shadow;
20382
- outline: none;
20173
+ .adl-u-justify-content-start {
20174
+ justify-content: start !important;
20383
20175
  }
20384
- .adl-accordion__title-wrapper {
20385
- flex: 1;
20176
+ .adl-u-justify-content-end {
20177
+ justify-content: end !important;
20386
20178
  }
20387
- .adl-accordion__title {
20388
- color: inherit;
20389
- font-weight: 600;
20179
+ .adl-u-justify-content-left {
20180
+ justify-content: left !important;
20390
20181
  }
20391
- .adl-accordion__subtitle {
20392
- color: #394962;
20393
- font-size: 13px;
20182
+ .adl-u-justify-content-right {
20183
+ justify-content: right !important;
20394
20184
  }
20395
- .adl-accordion__toggle {
20396
- line-height: 1;
20397
- margin: 2px 16px 0 0;
20398
- padding: 0;
20399
- width: 12px;
20185
+ .adl-u-justify-content-space-between {
20186
+ justify-content: space-between !important;
20400
20187
  }
20401
- .adl-accordion__content {
20402
- box-sizing: border-box;
20403
- margin: 0 0 24px;
20404
- overflow-x: auto;
20405
- overflow-y: hidden;
20406
- padding: 0 16px 0 calc(32px + 12px);
20407
- transition-duration: 0.1s;
20408
- transition-property: margin, height, padding;
20188
+ .adl-u-justify-content-space-around {
20189
+ justify-content: space-around !important;
20409
20190
  }
20410
- .adl-accordion__item > .adl-accordion__content {
20411
- margin: 0;
20191
+ .adl-u-justify-content-space-evenly {
20192
+ justify-content: space-evenly !important;
20412
20193
  }
20413
- .adl-accordion__item--open > .adl-accordion__content {
20414
- margin: 0 0 24px;
20194
+ .adl-u-justify-content-stretch {
20195
+ justify-content: stretch !important;
20415
20196
  }
20416
- .adl-accordion--max-height-transition .adl-accordion__item > .adl-accordion__content {
20417
- max-height: 0;
20418
- transition-duration: 0.1s;
20419
- transition-property: margin, max-height;
20197
+ .adl-u-flex-1 {
20198
+ flex: 1 !important;
20420
20199
  }
20421
- .adl-accordion--max-height-transition .adl-accordion__item--open > .adl-accordion__content {
20422
- max-height: 500px;
20423
- }/* #region Spacing */
20200
+ .adl-u-width-full {
20201
+ width: 100% !important;
20202
+ }
20203
+ .adl-u-width-auto {
20204
+ width: auto !important;
20205
+ }
20206
+ /* #region Spacing */
20424
20207
  /* #endregion */
20425
20208
  /* #region Colors */
20426
20209
  /* #endregion */
@@ -22272,7 +22055,18 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
22272
22055
  .adl-u-width-auto {
22273
22056
  width: auto !important;
22274
22057
  }
22275
- .adyen-collapsible-container {
22058
+ .adl-loader__wrapper {
22059
+ align-items: center;
22060
+ display: flex;
22061
+ height: 100%;
22062
+ justify-content: center;
22063
+ }
22064
+ .adl-loader__wrapper--inline {
22065
+ display: inline-block;
22066
+ height: auto;
22067
+ margin-right: 8px;
22068
+ }
22069
+ .adl-loading-indicator {
22276
22070
  color: #00112c;
22277
22071
  font-family: fakt, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;
22278
22072
  font-size: 15px;
@@ -22280,13 +22074,75 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
22280
22074
  -moz-osx-font-smoothing: grayscale;
22281
22075
  font-weight: 400;
22282
22076
  line-height: 1.4;
22283
- overflow: hidden;
22284
- transition: height 0.2s cubic-bezier(0.785, 0.135, 0.15, 0.86);
22077
+ box-sizing: border-box;
22078
+ display: inline-block;
22079
+ font-size: 15px;
22080
+ font-weight: 100;
22081
+ min-height: 24px;
22082
+ min-width: 24px;
22083
+ position: relative;
22285
22084
  }
22286
- .adyen-collapsible-container *,
22287
- .adyen-collapsible-container *::before,
22288
- .adyen-collapsible-container *::after {
22085
+ .adl-loading-indicator *,
22086
+ .adl-loading-indicator *::before,
22087
+ .adl-loading-indicator *::after {
22088
+ box-sizing: border-box;
22089
+ }
22090
+ .adl-loading-indicator::after {
22091
+ animation: adl-progress-circular-rotate 1s cubic-bezier(0.785, 0.135, 0.15, 0.86) infinite;
22092
+ border: 3px solid #dce0e5;
22093
+ border-radius: 50%;
22094
+ border-top-color: #06f;
22095
+ box-sizing: border-box;
22096
+ content: "";
22097
+ display: block;
22098
+ height: 100%;
22099
+ left: 0;
22100
+ min-height: 24px;
22101
+ min-width: 24px;
22102
+ position: absolute;
22103
+ top: 0;
22104
+ width: 100%;
22105
+ }
22106
+ .adl-loading-indicator::before {
22289
22107
  box-sizing: border-box;
22108
+ }
22109
+ .adl-loading-indicator--xsmall {
22110
+ min-height: 14px;
22111
+ min-width: 14px;
22112
+ padding: 7px;
22113
+ }
22114
+ .adl-loading-indicator--xsmall::after {
22115
+ border-width: 2px;
22116
+ min-height: 14px;
22117
+ min-width: 14px;
22118
+ }
22119
+ .adl-loading-indicator--dot::before {
22120
+ background: #06f;
22121
+ border-radius: 50%;
22122
+ content: "";
22123
+ display: block;
22124
+ left: 4px;
22125
+ min-height: 6px;
22126
+ min-width: 6px;
22127
+ position: absolute;
22128
+ top: 4px;
22129
+ }
22130
+ .adl-loading-indicator--small {
22131
+ padding: 12px;
22132
+ }
22133
+ .adl-loading-indicator--medium {
22134
+ padding: 18px;
22135
+ }
22136
+ .adl-loading-indicator--large {
22137
+ padding: 24px;
22138
+ }
22139
+ @keyframes adl-progress-circular-rotate {
22140
+ 0% {
22141
+ transform: rotate(0deg);
22142
+ }
22143
+ 100% {
22144
+ transform: rotate(360deg);
22145
+ }
22290
22146
  }/* #region Spacing */
22291
22147
  /* #endregion */
22292
22148
  /* #region Colors */
@@ -22309,25 +22165,225 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
22309
22165
  /* #endregion */
22310
22166
  /* #region Inline components */
22311
22167
  /* #endregion */
22168
+ /* #region Spacing */
22169
+ /* #endregion */
22170
+ /* #region Colors */
22171
+ /* #endregion */
22172
+ /* #region Fonts */
22173
+ /* #endregion */
22174
+ /* #region Borders */
22175
+ /* #endregion */
22176
+ /* #region Box-shadow */
22177
+ /* #endregion */
22178
+ /* #region Shadows */
22179
+ /* #endregion */
22180
+ /* #region Z-index */
22181
+ /* #endregion */
22182
+ /* #region Transition */
22183
+ /* #endregion */
22184
+ /* #region Timing functions */
22185
+ /* #endregion */
22186
+ /* #region Focus ring */
22187
+ /* #endregion */
22188
+ /* #region Inline components */
22189
+ /* #endregion */
22190
+ /* stylelint-disable-line scss/dollar-variable-pattern */
22191
+ /* stylelint-disable-line scss/dollar-variable-pattern */
22192
+ /* stylelint-disable-line scss/dollar-variable-pattern */
22193
+ /* stylelint-disable-line scss/dollar-variable-pattern */
22194
+ /* #region Spacing */
22195
+ /* #endregion */
22196
+ /* #region Colors */
22197
+ /* #endregion */
22198
+ /* #region Fonts */
22199
+ /* #endregion */
22200
+ /* #region Borders */
22201
+ /* #endregion */
22202
+ /* #region Box-shadow */
22203
+ /* #endregion */
22204
+ /* #region Shadows */
22205
+ /* #endregion */
22206
+ /* #region Z-index */
22207
+ /* #endregion */
22208
+ /* #region Transition */
22209
+ /* #endregion */
22210
+ /* #region Timing functions */
22211
+ /* #endregion */
22212
+ /* #region Focus ring */
22213
+ /* #endregion */
22214
+ /* #region Inline components */
22215
+ /* #endregion */
22216
+ /* stylelint-disable-line scss/dollar-variable-pattern */
22217
+ /* stylelint-disable-line scss/dollar-variable-pattern */
22218
+ /* stylelint-disable-line scss/dollar-variable-pattern */
22219
+ /* stylelint-disable-line scss/dollar-variable-pattern */
22220
+ /* #region Spacing */
22221
+ /* #endregion */
22222
+ /* #region Colors */
22223
+ /* #endregion */
22224
+ /* #region Fonts */
22225
+ /* #endregion */
22226
+ /* #region Borders */
22227
+ /* #endregion */
22228
+ /* #region Box-shadow */
22229
+ /* #endregion */
22230
+ /* #region Shadows */
22231
+ /* #endregion */
22232
+ /* #region Z-index */
22233
+ /* #endregion */
22234
+ /* #region Transition */
22235
+ /* #endregion */
22236
+ /* #region Timing functions */
22237
+ /* #endregion */
22238
+ /* #region Focus ring */
22239
+ /* #endregion */
22240
+ /* #region Inline components */
22241
+ /* #endregion */
22242
+ /* Reset */
22243
+ /* Regular - Dimensions */
22244
+ /* Regular - Fonts */
22245
+ /* Shared - Styles */
22246
+ /* Shared - Colors */
22247
+ /* Small - Styles */
22248
+ /* Small - Dimensions */
22249
+ /* Small - Fonts */
22250
+ /* State */
22251
+ /* Shadow */
22252
+ /* Motion */
22253
+ /* Loader */
22254
+ /* Circle */
22255
+ /* Label Hover box */
22256
+ /* #region Spacing */
22257
+ /* #endregion */
22258
+ /* #region Colors */
22259
+ /* #endregion */
22260
+ /* #region Fonts */
22261
+ /* #endregion */
22262
+ /* #region Borders */
22263
+ /* #endregion */
22264
+ /* #region Box-shadow */
22265
+ /* #endregion */
22266
+ /* #region Shadows */
22267
+ /* #endregion */
22268
+ /* #region Z-index */
22269
+ /* #endregion */
22270
+ /* #region Transition */
22271
+ /* #endregion */
22272
+ /* #region Timing functions */
22273
+ /* #endregion */
22274
+ /* #region Focus ring */
22275
+ /* #endregion */
22276
+ /* #region Inline components */
22277
+ /* #endregion */
22312
22278
  /* stylelint-disable-line scss/dollar-variable-pattern */
22313
22279
  /* stylelint-disable-line scss/dollar-variable-pattern */
22314
22280
  /* stylelint-disable-line scss/dollar-variable-pattern */
22315
22281
  /* stylelint-disable-line scss/dollar-variable-pattern */
22316
- /* stylelint-disable-line scss/dollar-variable-pattern */
22317
- /* stylelint-disable-line scss/dollar-variable-pattern */
22318
- /* stylelint-disable-line scss/dollar-variable-pattern */
22319
- /* stylelint-disable-line scss/dollar-variable-pattern */
22320
- .adyen-kyc-form-header {
22321
- margin-bottom: 24px;
22322
- }
22323
- .adyen-kyc-form-header__heading {
22324
- font-size: 24px;
22282
+ .adl-tag {
22283
+ color: #00112c;
22284
+ font-family: fakt, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;
22285
+ font-size: 15px;
22286
+ -webkit-font-smoothing: antialiased;
22287
+ -moz-osx-font-smoothing: grayscale;
22288
+ font-weight: 400;
22289
+ line-height: 1.4;
22290
+ background: #f3f6f9;
22291
+ border: 1px solid #dce0e5;
22292
+ border-radius: 0;
22293
+ color: #394962;
22294
+ display: inline-block;
22295
+ font-size: 12px;
22325
22296
  font-weight: 600;
22326
- margin-bottom: 8px;
22297
+ height: 24px;
22298
+ line-height: 24px;
22299
+ padding: 0 8px;
22300
+ text-decoration: none;
22301
+ vertical-align: baseline;
22302
+ white-space: nowrap;
22327
22303
  }
22328
- .adyen-kyc-form-header__description {
22304
+ .adl-tag *,
22305
+ .adl-tag *::before,
22306
+ .adl-tag *::after {
22307
+ box-sizing: border-box;
22308
+ }
22309
+ .adl-tag--dark {
22310
+ background: #394962;
22311
+ border: 1px solid #20304c;
22312
+ color: #fff;
22313
+ }
22314
+ .adl-tag--dark.adl-tag--removable:active {
22315
+ background-color: #384861 !important;
22316
+ }
22317
+ .adl-tag--blue {
22318
+ background: #e6f0ff;
22319
+ border: 1px solid #cce0ff;
22320
+ color: #06f;
22321
+ }
22322
+ .adl-tag--blue.adl-tag--removable:active {
22323
+ background-color: #e1ecfb !important;
22324
+ }
22325
+ .adl-tag--red {
22326
+ background: #fce5e5;
22327
+ border: 1px solid #facccc;
22328
+ color: #a10000;
22329
+ }
22330
+ .adl-tag--red.adl-tag--removable:active {
22331
+ background-color: #f7e1e1 !important;
22332
+ }
22333
+ .adl-tag--orange {
22334
+ background: #fff4e5;
22335
+ border: 1px solid #ffeacc;
22336
+ color: #b36900;
22337
+ }
22338
+ .adl-tag--orange.adl-tag--removable:active {
22339
+ background-color: #faefe1 !important;
22340
+ }
22341
+ .adl-tag--green {
22342
+ background: #e6f8ed;
22343
+ border: 1px solid #cef2dd;
22344
+ color: #07863a;
22345
+ }
22346
+ .adl-tag--green.adl-tag--removable:active {
22347
+ background-color: #e1f3e9 !important;
22348
+ }
22349
+ .adl-tag--purple {
22350
+ background: #f2e5ff;
22351
+ border: 1px solid #e6ccff;
22352
+ color: #8000ff;
22353
+ }
22354
+ .adl-tag--purple.adl-tag--removable:active {
22355
+ background-color: #ede1fb !important;
22356
+ }
22357
+ .adl-tag--mint {
22358
+ background: #e6fdf7;
22359
+ border: 1px solid #cdfaef;
22360
+ color: #027458;
22361
+ }
22362
+ .adl-tag--mint.adl-tag--removable:active {
22363
+ background-color: #e1f8f3 !important;
22364
+ }
22365
+ .adl-tag--teal {
22366
+ background: #eef9f9;
22367
+ border: 1px solid #eef9f9;
22368
+ color: #eef9f9;
22369
+ }
22370
+ .adl-tag--teal.adl-tag--removable:active {
22371
+ background-color: #e9f4f5 !important;
22372
+ }
22373
+ .adl-tag--light-blue {
22374
+ background: #e6f0ff;
22375
+ border: 1px solid #e6f0ff;
22376
+ color: #e6f0ff;
22377
+ }
22378
+ .adl-tag--light-blue.adl-tag--removable:active {
22379
+ background-color: #e1ecfb !important;
22380
+ }
22381
+ .adl-tag--basic {
22382
+ border-radius: 4px;
22383
+ border-style: none;
22329
22384
  color: #394962;
22330
- font-size: 16px;
22385
+ font-size: 14px;
22386
+ font-weight: 400;
22331
22387
  }/* #region Spacing */
22332
22388
  /* #endregion */
22333
22389
  /* #region Colors */
@@ -24202,6 +24258,85 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
24202
24258
  .adl-u-width-auto {
24203
24259
  width: auto !important;
24204
24260
  }
24261
+ .adyen-kyc-dropdown {
24262
+ position: relative;
24263
+ }
24264
+ .adyen-kyc-dropdown-button {
24265
+ align-items: center;
24266
+ cursor: pointer;
24267
+ display: flex;
24268
+ }
24269
+ .adyen-kyc-dropdown-button::after {
24270
+ 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");
24271
+ background-position: center;
24272
+ background-repeat: no-repeat;
24273
+ content: "";
24274
+ height: 6px;
24275
+ position: absolute;
24276
+ right: 16px;
24277
+ width: 8px;
24278
+ }
24279
+ .adyen-kyc-dropdown-button--active::after {
24280
+ transform: rotate(180deg);
24281
+ }
24282
+ .adyen-kyc-filter-input {
24283
+ background: #fff;
24284
+ border: 0;
24285
+ caret-color: #06f;
24286
+ color: #00112c;
24287
+ font-family: inherit;
24288
+ font-size: 1em;
24289
+ height: 100%;
24290
+ padding: 0;
24291
+ width: 100%;
24292
+ }
24293
+ .adyen-kyc-filter-input::placeholder {
24294
+ color: #a5afbd;
24295
+ font-weight: 200;
24296
+ }
24297
+ .adyen-kyc-filter-input:focus, .adyen-kyc-filter-input:active {
24298
+ outline: 0;
24299
+ }
24300
+ .adyen-kyc-dropdown-list {
24301
+ background: #fff;
24302
+ display: none;
24303
+ list-style: none;
24304
+ margin: 0;
24305
+ margin-bottom: 50px;
24306
+ overflow-y: auto;
24307
+ padding: 0;
24308
+ position: absolute;
24309
+ width: 100%;
24310
+ z-index: 1;
24311
+ }
24312
+ .adyen-kyc-dropdown-list.adyen-kyc-dropdown-list--active {
24313
+ display: block;
24314
+ }
24315
+ .adyen-kyc-dropdown-element {
24316
+ align-items: center;
24317
+ display: flex;
24318
+ }/* #region Spacing */
24319
+ /* #endregion */
24320
+ /* #region Colors */
24321
+ /* #endregion */
24322
+ /* #region Fonts */
24323
+ /* #endregion */
24324
+ /* #region Borders */
24325
+ /* #endregion */
24326
+ /* #region Box-shadow */
24327
+ /* #endregion */
24328
+ /* #region Shadows */
24329
+ /* #endregion */
24330
+ /* #region Z-index */
24331
+ /* #endregion */
24332
+ /* #region Transition */
24333
+ /* #endregion */
24334
+ /* #region Timing functions */
24335
+ /* #endregion */
24336
+ /* #region Focus ring */
24337
+ /* #endregion */
24338
+ /* #region Inline components */
24339
+ /* #endregion */
24205
24340
  /* #region Spacing */
24206
24341
  /* #endregion */
24207
24342
  /* #region Colors */
@@ -26048,13 +26183,129 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
26048
26183
  .adl-u-flex-1 {
26049
26184
  flex: 1 !important;
26050
26185
  }
26051
- .adl-u-width-full {
26052
- width: 100% !important;
26186
+ .adl-u-width-full {
26187
+ width: 100% !important;
26188
+ }
26189
+ .adl-u-width-auto {
26190
+ width: auto !important;
26191
+ }
26192
+ .adyen-kyc-checkbox {
26193
+ display: block;
26194
+ }
26195
+ .adyen-kyc-checkbox__label {
26196
+ color: #00112c;
26197
+ cursor: pointer;
26198
+ display: inline-block;
26199
+ font-size: 15px;
26200
+ font-weight: normal;
26201
+ line-height: 21px;
26202
+ padding-left: 24px;
26203
+ position: relative;
26204
+ user-select: none;
26205
+ }
26206
+ .adyen-kyc-checkbox__helper-text {
26207
+ color: #69778c;
26208
+ cursor: pointer;
26209
+ display: block;
26210
+ font-size: 15px;
26211
+ padding-left: 24px;
26212
+ }
26213
+ .adyen-kyc-checkbox__input {
26214
+ opacity: 0;
26215
+ pointer-events: none;
26216
+ position: absolute;
26217
+ /* Check */
26218
+ /* Box */
26219
+ }
26220
+ .adyen-kyc-checkbox__input:checked + .adyen-kyc-checkbox__label::before {
26221
+ opacity: 1;
26222
+ }
26223
+ .adyen-kyc-checkbox__input:checked + .adyen-kyc-checkbox__label::after {
26224
+ background-color: #06f;
26225
+ border: 1px solid #06f;
26226
+ }
26227
+ .adyen-kyc-checkbox__input:checked:hover + .adyen-kyc-checkbox__label::after {
26228
+ border-color: #06f;
26229
+ box-shadow: 0 0 0 2px rgba(0, 102, 255, 0.4);
26230
+ }
26231
+ .adyen-kyc-checkbox__input:focus + .adyen-kyc-checkbox__label::after {
26232
+ border: 1px solid #06f;
26233
+ box-shadow: 0 0 0 2px #80b2ff;
26234
+ }
26235
+ .adyen-kyc-checkbox__input:hover:not(:focus) + .adyen-kyc-checkbox__label::after {
26236
+ border-color: #99a3ad;
26237
+ box-shadow: 0 0 0 2px #dce0e5;
26238
+ }
26239
+ .adyen-kyc-checkbox__input + .adyen-kyc-checkbox__label::before {
26240
+ border-bottom: 2px solid #fff;
26241
+ border-radius: 0 2px 1px;
26242
+ border-right: 2px solid #fff;
26243
+ content: "";
26244
+ height: 11px;
26245
+ left: 1px;
26246
+ opacity: 0;
26247
+ position: absolute;
26248
+ top: 2px;
26249
+ transform: rotateZ(37deg);
26250
+ transform-origin: 100% 100%;
26251
+ transition: opacity 0.2s ease-out;
26252
+ width: 6px;
26253
+ z-index: 1;
26053
26254
  }
26054
- .adl-u-width-auto {
26055
- width: auto !important;
26255
+ .adyen-kyc-checkbox__input + .adyen-kyc-checkbox__label::after {
26256
+ background-color: #fff;
26257
+ border: 1px solid #a5afbd;
26258
+ border-radius: 4px;
26259
+ content: "";
26260
+ height: 16px;
26261
+ left: 0;
26262
+ position: absolute;
26263
+ top: 0;
26264
+ transition: background 0.15s ease-out, border 0.05s ease-out, box-shadow 0.1s ease-out;
26265
+ width: 16px;
26266
+ z-index: 0;
26267
+ }/* #region Spacing */
26268
+ /* #endregion */
26269
+ /* #region Colors */
26270
+ /* #endregion */
26271
+ /* #region Fonts */
26272
+ /* #endregion */
26273
+ /* #region Borders */
26274
+ /* #endregion */
26275
+ /* #region Box-shadow */
26276
+ /* #endregion */
26277
+ /* #region Shadows */
26278
+ /* #endregion */
26279
+ /* #region Z-index */
26280
+ /* #endregion */
26281
+ /* #region Transition */
26282
+ /* #endregion */
26283
+ /* #region Timing functions */
26284
+ /* #endregion */
26285
+ /* #region Focus ring */
26286
+ /* #endregion */
26287
+ /* #region Inline components */
26288
+ /* #endregion */
26289
+ /* stylelint-disable-line scss/dollar-variable-pattern */
26290
+ /* stylelint-disable-line scss/dollar-variable-pattern */
26291
+ /* stylelint-disable-line scss/dollar-variable-pattern */
26292
+ /* stylelint-disable-line scss/dollar-variable-pattern */
26293
+ /* stylelint-disable-line scss/dollar-variable-pattern */
26294
+ /* stylelint-disable-line scss/dollar-variable-pattern */
26295
+ /* stylelint-disable-line scss/dollar-variable-pattern */
26296
+ /* stylelint-disable-line scss/dollar-variable-pattern */
26297
+ .adyen-kyc-form-header {
26298
+ margin-bottom: 24px;
26056
26299
  }
26057
- /* #region Spacing */
26300
+ .adyen-kyc-form-header__heading {
26301
+ font-size: 24px;
26302
+ font-weight: 600;
26303
+ margin-bottom: 8px;
26304
+ }
26305
+ .adyen-kyc-form-header__description {
26306
+ color: #394962;
26307
+ font-size: 16px;
26308
+ }/* #region Spacing */
26058
26309
  /* #endregion */
26059
26310
  /* #region Colors */
26060
26311
  /* #endregion */
@@ -27855,261 +28106,58 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
27855
28106
  .adl-u-align-items-center {
27856
28107
  align-items: center !important;
27857
28108
  }
27858
- .adl-u-align-items-stretch {
27859
- align-items: stretch !important;
27860
- }
27861
- .adl-u-align-items-baseline {
27862
- align-items: baseline !important;
27863
- }
27864
- .adl-u-align-items-end {
27865
- align-items: end !important;
27866
- }
27867
- .adl-u-justify-content-center {
27868
- justify-content: center !important;
27869
- }
27870
- .adl-u-justify-content-flex-start {
27871
- justify-content: flex-start !important;
27872
- }
27873
- .adl-u-justify-content-flex-end {
27874
- justify-content: flex-end !important;
27875
- }
27876
- .adl-u-justify-content-start {
27877
- justify-content: start !important;
27878
- }
27879
- .adl-u-justify-content-end {
27880
- justify-content: end !important;
27881
- }
27882
- .adl-u-justify-content-left {
27883
- justify-content: left !important;
27884
- }
27885
- .adl-u-justify-content-right {
27886
- justify-content: right !important;
27887
- }
27888
- .adl-u-justify-content-space-between {
27889
- justify-content: space-between !important;
27890
- }
27891
- .adl-u-justify-content-space-around {
27892
- justify-content: space-around !important;
27893
- }
27894
- .adl-u-justify-content-space-evenly {
27895
- justify-content: space-evenly !important;
27896
- }
27897
- .adl-u-justify-content-stretch {
27898
- justify-content: stretch !important;
27899
- }
27900
- .adl-u-flex-1 {
27901
- flex: 1 !important;
27902
- }
27903
- .adl-u-width-full {
27904
- width: 100% !important;
27905
- }
27906
- .adl-u-width-auto {
27907
- width: auto !important;
27908
- }
27909
- .adyen-kyc-dropdown {
27910
- font-size: 1em;
27911
- max-width: 100%;
27912
- width: 100%;
27913
- }
27914
- .adyen-kyc-dropdown-button {
27915
- background: #fff;
27916
- border: 1px solid #dce0e5;
27917
- border-radius: 6px;
27918
- box-sizing: border-box;
27919
- color: #00112c;
27920
- font-size: 1em;
27921
- line-height: 20px;
27922
- min-height: 40px;
27923
- outline: 0;
27924
- padding: 7px 24px 7px 12px;
27925
- text-decoration: none;
27926
- transition: border 0.2s ease-out, box-shadow 0.2s ease-out;
27927
- user-select: none;
27928
- }
27929
- .adyen-kyc-dropdown-button:hover {
27930
- border-color: #99a3ad;
27931
- }
27932
- .adyen-kyc-dropdown-button__icon {
27933
- border-radius: 3px;
27934
- height: 26px;
27935
- margin-right: 8px;
27936
- max-width: 40px;
27937
- }
27938
- .adyen-kyc-dropdown-button--active,
27939
- .adyen-kyc-dropdown-button--active:hover,
27940
- .adyen-kyc-dropdown-button:active,
27941
- .adyen-kyc-dropdown-button:focus {
27942
- border-color: #06f;
27943
- box-shadow: 0 0 0 2px #80b2ff;
27944
- }
27945
- .adyen-kyc-dropdown-button--readonly, .adyen-kyc-dropdown-button--readonly.adyen-kyc-dropdown-button--active, .adyen-kyc-dropdown-button--readonly:hover, .adyen-kyc-dropdown-button--readonly:focus {
27946
- border: 1px solid #a5afbd;
27947
- color: #8390a3;
27948
- cursor: not-allowed;
27949
- background-color: #f3f6f9;
27950
- border-color: #dce0e5;
27951
- }
27952
- .adyen-kyc-dropdown-button--readonly::after {
27953
- 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");
27954
- }
27955
- .adyen-kyc-dropdown-button--invalid {
27956
- border-color: #e50000;
27957
- }
27958
- .adyen-kyc-dropdown-button__text {
27959
- line-height: 1;
27960
- overflow: hidden;
27961
- pointer-events: none;
27962
- text-overflow: ellipsis;
27963
- white-space: nowrap;
27964
- }
27965
- .adyen-kyc-dropdown-button__text--placeholder {
27966
- color: #a5afbd;
27967
- font-weight: 200;
27968
- line-height: 1.2;
27969
- }
27970
- .adyen-kyc-dropdown-button-search {
27971
- align-items: center;
27972
- display: flex;
27973
- width: 100%;
27974
- }
27975
- .adyen-kyc-dropdown-button-search__icon {
27976
- color: #a5afbd;
27977
- font-size: 0.81em;
27978
- padding-right: 8px;
27979
- }
27980
- .adyen-kyc-dropdown-button-search .adyen-kyc-filter-input::placeholder {
27981
- color: #a5afbd;
27982
- }
27983
- .adyen-kyc-dropdown-button-search::after {
27984
- display: none;
27985
- }
27986
- .adl-loading-indicator::before {
27987
- background: #a5afbd;
27988
- }
27989
- .adl-loading-indicator::after {
27990
- border-top-color: #a5afbd;
27991
- }
27992
- .adyen-kyc-dropdown-list {
27993
- border-radius: 6px;
27994
- box-shadow: 0 2px 7px rgba(0, 15, 45, 0.3);
27995
- max-height: 145px;
27996
- z-index: 2;
27997
- }
27998
- .adyen-kyc-dropdown-list .adyen-kyc-checkbox__helper-text {
27999
- cursor: pointer;
28000
- }
28001
- .adyen-kyc-dropdown-list--above {
28002
- bottom: -6px;
28003
- }
28004
- .adyen-kyc-dropdown-list.adyen-kyc-dropdown-list--active {
28005
- margin-top: 2px;
28006
- }
28007
- .adyen-kyc-dropdown-element {
28008
- border: 1px solid transparent;
28009
- cursor: pointer;
28010
- font-size: 0.81em;
28011
- hyphens: auto;
28012
- line-height: 20px;
28013
- outline: 0;
28014
- padding: 8px;
28015
- transition: background 0.2s ease-out, border-color 0.2s ease-out;
28016
- user-select: none;
28017
- word-break: break-word;
28018
- }
28019
- .adyen-kyc-dropdown-element.adyen-kyc-dropdown-search-element {
28020
- align-items: baseline;
28021
- display: flex;
28022
- font-size: 1em;
28023
- width: 100%;
28024
- }
28025
- .adyen-kyc-dropdown-search-element__description {
28026
- flex: 1;
28027
- }
28028
- .adyen-kyc-dropdown-search-element__description--highlight {
28029
- font-weight: 600;
28030
- }
28031
- .adyen-kyc-dropdown-search-element__addresses {
28032
- color: #69778c;
28033
- display: flex;
28034
- }
28035
- .adyen-kyc-dropdown-search-element__addresses--icon {
28036
- align-items: center;
28037
- color: #69778c;
28038
- display: flex;
28039
- margin-left: 8px;
28040
- }
28041
- .adyen-kyc-dropdown-search-element__addresses--text {
28042
- display: none;
28043
- margin-left: 4px;
28109
+ .adl-u-align-items-stretch {
28110
+ align-items: stretch !important;
28044
28111
  }
28045
- @media screen and (min-width: 1240px) {
28046
- .adyen-kyc-dropdown-search-element__addresses--text {
28047
- display: block;
28048
- }
28112
+ .adl-u-align-items-baseline {
28113
+ align-items: baseline !important;
28049
28114
  }
28050
- .adyen-kyc-dropdown-element:last-child {
28051
- border-bottom: 0;
28115
+ .adl-u-align-items-end {
28116
+ align-items: end !important;
28052
28117
  }
28053
- .adyen-kyc-dropdown-element:hover,
28054
- .adyen-kyc-dropdown-element:focus,
28055
- .adyen-kyc-dropdown-element:active {
28056
- background: rgba(230, 233, 235, 0.6);
28118
+ .adl-u-justify-content-center {
28119
+ justify-content: center !important;
28057
28120
  }
28058
- .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active {
28059
- background: rgba(0, 102, 255, 0.1);
28121
+ .adl-u-justify-content-flex-start {
28122
+ justify-content: flex-start !important;
28060
28123
  }
28061
- .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active:hover,
28062
- .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active:focus,
28063
- .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element--active:active {
28064
- background: rgba(0, 102, 255, 0.15);
28124
+ .adl-u-justify-content-flex-end {
28125
+ justify-content: flex-end !important;
28065
28126
  }
28066
- .adyen-kyc-dropdown-element--disabled {
28067
- cursor: not-allowed;
28068
- opacity: 0.4;
28127
+ .adl-u-justify-content-start {
28128
+ justify-content: start !important;
28069
28129
  }
28070
- .adyen-kyc-dropdown-element__icon {
28071
- border-radius: 4px;
28072
- margin-right: 8px;
28073
- max-height: 26px;
28074
- max-width: 40px;
28130
+ .adl-u-justify-content-end {
28131
+ justify-content: end !important;
28075
28132
  }
28076
- .adyen-kyc-dropdown-element__flag {
28077
- margin-left: 8px;
28078
- margin-right: 10px;
28079
- max-height: 18px;
28080
- max-width: 27px;
28133
+ .adl-u-justify-content-left {
28134
+ justify-content: left !important;
28081
28135
  }
28082
- .adyen-kyc-dropdown-element.adyen-kyc-dropdown-element-description {
28083
- align-items: baseline;
28084
- flex-direction: column;
28085
- font-size: 1em;
28136
+ .adl-u-justify-content-right {
28137
+ justify-content: right !important;
28086
28138
  }
28087
- .adyen-kyc-dropdown-element-description__text {
28088
- color: #69778c;
28139
+ .adl-u-justify-content-space-between {
28140
+ justify-content: space-between !important;
28089
28141
  }
28090
- .adyen-kyc-dropdown + .adyen-kyc-input__inline-validation {
28091
- right: 32px;
28142
+ .adl-u-justify-content-space-around {
28143
+ justify-content: space-around !important;
28092
28144
  }
28093
- .adyen-kyc-dropdown-selected-items {
28094
- align-items: baseline;
28095
- display: flex;
28096
- flex-direction: row;
28097
- flex-wrap: wrap;
28145
+ .adl-u-justify-content-space-evenly {
28146
+ justify-content: space-evenly !important;
28098
28147
  }
28099
- .adyen-kyc-dropdown-selected-items .adl-tag {
28100
- align-self: center;
28101
- border-radius: 6px;
28102
- color: #00112c;
28103
- letter-spacing: 0.2px;
28104
- margin: 2px 8px 2px 0;
28105
- padding: 2px 8px;
28148
+ .adl-u-justify-content-stretch {
28149
+ justify-content: stretch !important;
28106
28150
  }
28107
- .adyen-kyc-dropdown-selected-items__tag--teal {
28108
- background-color: #eef9f9;
28151
+ .adl-u-flex-1 {
28152
+ flex: 1 !important;
28109
28153
  }
28110
- .adyen-kyc-dropdown-selected-items__tag--blue {
28111
- background-color: #e6f0ff;
28112
- }/* #region Spacing */
28154
+ .adl-u-width-full {
28155
+ width: 100% !important;
28156
+ }
28157
+ .adl-u-width-auto {
28158
+ width: auto !important;
28159
+ }
28160
+ /* #region Spacing */
28113
28161
  /* #endregion */
28114
28162
  /* #region Colors */
28115
28163
  /* #endregion */
@@ -31813,7 +31861,169 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
31813
31861
  .adl-u-width-auto {
31814
31862
  width: auto !important;
31815
31863
  }
31816
- /* #region Spacing */
31864
+ .adyen-kyc-field-wrapper {
31865
+ display: flex;
31866
+ flex-wrap: wrap;
31867
+ width: 100%;
31868
+ }
31869
+ .adyen-kyc-field-wrapper:last-of-type > .adyen-kyc-field:not(:last-of-type) {
31870
+ margin-bottom: 16px;
31871
+ }
31872
+ .adyen-kyc-field--col-70 {
31873
+ width: calc(70% - 8px);
31874
+ }
31875
+ .adyen-kyc-field--col-50 {
31876
+ width: calc(50% - 8px);
31877
+ }
31878
+ .adyen-kyc-field--col-30 {
31879
+ width: calc(30% - 8px);
31880
+ }
31881
+ .adyen-kyc-input-wrapper {
31882
+ display: block;
31883
+ position: relative;
31884
+ }
31885
+ .adyen-kyc-input-wrapper--block {
31886
+ display: block;
31887
+ }
31888
+ .adyen-kyc-input {
31889
+ height: 40px;
31890
+ line-height: 40px;
31891
+ min-height: 40px;
31892
+ padding-bottom: 0;
31893
+ padding-top: 0;
31894
+ background: #fff;
31895
+ border: 1px solid #dce0e5;
31896
+ border-radius: 6px;
31897
+ box-sizing: border-box;
31898
+ caret-color: #06f;
31899
+ color: #00112c;
31900
+ display: block;
31901
+ font-family: inherit;
31902
+ font-size: 1em;
31903
+ outline: none;
31904
+ padding: 8px;
31905
+ position: relative;
31906
+ transition: border 0.2s ease-out, box-shadow 0.2s ease-out;
31907
+ width: 100%;
31908
+ }
31909
+ .adyen-kyc-input::placeholder {
31910
+ color: #a5afbd;
31911
+ font-weight: 200;
31912
+ }
31913
+ .adyen-kyc-input:hover {
31914
+ border-color: #99a3ad;
31915
+ }
31916
+ .adyen-kyc-input:required {
31917
+ box-shadow: none;
31918
+ }
31919
+ .adyen-kyc-input[readonly], .adyen-kyc-input[readonly]:hover, .adyen-kyc-input--disabled {
31920
+ border: 1px solid #a5afbd;
31921
+ color: #8390a3;
31922
+ cursor: not-allowed;
31923
+ background-color: #f3f6f9;
31924
+ border-color: #dce0e5;
31925
+ }
31926
+ .adyen-kyc-input--disabled:hover {
31927
+ border-color: #f3f6f9;
31928
+ }
31929
+ .adyen-kyc-input--error, .adyen-kyc-input--invalid, .adyen-kyc-input--error:hover, .adyen-kyc-input--invalid:hover {
31930
+ border-color: #e50000;
31931
+ color: #e50000;
31932
+ }
31933
+ .adyen-kyc-input:active, .adyen-kyc-input:focus, .adyen-kyc-input--focus, .adyen-kyc-input:active:hover, .adyen-kyc-input:focus:hover, .adyen-kyc-input--focus:hover {
31934
+ border: 1px solid #06f;
31935
+ }
31936
+ .adyen-kyc-input--date {
31937
+ padding-right: 30px;
31938
+ }
31939
+ .adyen-kyc-input--textarea {
31940
+ height: 60px;
31941
+ }
31942
+ .adyen-kyc-input__inline-validation {
31943
+ height: 16px;
31944
+ position: absolute;
31945
+ right: 14px;
31946
+ transform: translateY(-50%);
31947
+ width: 16px;
31948
+ }
31949
+ .adyen-kyc-input__inline-validation--valid {
31950
+ color: #0abf53;
31951
+ display: none;
31952
+ }
31953
+ .adyen-kyc-input__inline-validation--invalid {
31954
+ color: #e50000;
31955
+ top: 50%;
31956
+ }
31957
+ .adyen-kyc-input__inline-validation--invalid-bottom {
31958
+ top: 8px;
31959
+ }
31960
+ .adyen-kyc-input__counter {
31961
+ color: #69778c;
31962
+ font-size: 13px;
31963
+ margin: 4px 0;
31964
+ position: absolute;
31965
+ right: 0;
31966
+ }
31967
+ .adyen-layout-xs-only [class*=adyen-kyc-field--col-] {
31968
+ width: 100%;
31969
+ }
31970
+ .adyen-layout-md .adyen-kyc-field-wrapper {
31971
+ flex-wrap: nowrap;
31972
+ }
31973
+ .adyen-layout-md .adyen-kyc-field-wrapper > .adyen-kyc-field:first-child {
31974
+ margin-right: 8px;
31975
+ }
31976
+ .adyen-layout-md .adyen-kyc-field-wrapper > .adyen-kyc-field:nth-child(2) {
31977
+ margin-left: 8px;
31978
+ }/* #region Spacing */
31979
+ /* #endregion */
31980
+ /* #region Colors */
31981
+ /* #endregion */
31982
+ /* #region Fonts */
31983
+ /* #endregion */
31984
+ /* #region Borders */
31985
+ /* #endregion */
31986
+ /* #region Box-shadow */
31987
+ /* #endregion */
31988
+ /* #region Shadows */
31989
+ /* #endregion */
31990
+ /* #region Z-index */
31991
+ /* #endregion */
31992
+ /* #region Transition */
31993
+ /* #endregion */
31994
+ /* #region Timing functions */
31995
+ /* #endregion */
31996
+ /* #region Focus ring */
31997
+ /* #endregion */
31998
+ /* #region Inline components */
31999
+ /* #endregion */
32000
+ /* stylelint-disable-line scss/dollar-variable-pattern */
32001
+ /* stylelint-disable-line scss/dollar-variable-pattern */
32002
+ /* stylelint-disable-line scss/dollar-variable-pattern */
32003
+ /* stylelint-disable-line scss/dollar-variable-pattern */
32004
+ .adl-disclaimer-container {
32005
+ background-color: #f3f6f9;
32006
+ border: 0;
32007
+ border-radius: 4px;
32008
+ margin: 8px 0;
32009
+ padding: 12px 16px;
32010
+ }
32011
+ .adl-disclaimer__title {
32012
+ color: #394962;
32013
+ font-size: 13px;
32014
+ font-weight: bold;
32015
+ margin-bottom: 8px;
32016
+ }
32017
+ .adl-disclaimer__content {
32018
+ color: #394962;
32019
+ display: flex;
32020
+ flex-direction: column;
32021
+ font-size: 13px;
32022
+ gap: 8px;
32023
+ }
32024
+ .adl-disclaimer__content p {
32025
+ margin: 0;
32026
+ }/* #region Spacing */
31817
32027
  /* #endregion */
31818
32028
  /* #region Colors */
31819
32029
  /* #endregion */
@@ -33489,292 +33699,13 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
33489
33699
  .adl-u-white-space-pre-wrap {
33490
33700
  white-space: pre-wrap !important;
33491
33701
  }
33492
- .adl-u-truncate {
33493
- overflow: hidden !important;
33494
- text-overflow: ellipsis !important;
33495
- }
33496
- .adl-u-word-break-break-word {
33497
- word-break: break-word !important;
33498
- }
33499
- /* #region Spacing */
33500
- /* #endregion */
33501
- /* #region Colors */
33502
- /* #endregion */
33503
- /* #region Fonts */
33504
- /* #endregion */
33505
- /* #region Borders */
33506
- /* #endregion */
33507
- /* #region Box-shadow */
33508
- /* #endregion */
33509
- /* #region Shadows */
33510
- /* #endregion */
33511
- /* #region Z-index */
33512
- /* #endregion */
33513
- /* #region Transition */
33514
- /* #endregion */
33515
- /* #region Timing functions */
33516
- /* #endregion */
33517
- /* #region Focus ring */
33518
- /* #endregion */
33519
- /* #region Inline components */
33520
- /* #endregion */
33521
- /* stylelint-disable-line scss/dollar-variable-pattern */
33522
- /* stylelint-disable-line scss/dollar-variable-pattern */
33523
- /* stylelint-disable-line scss/dollar-variable-pattern */
33524
- /* stylelint-disable-line scss/dollar-variable-pattern */
33525
- .adl-u-visibility-visible {
33526
- visibility: visible !important;
33527
- }
33528
- .adl-u-visibility-hidden {
33529
- visibility: hidden !important;
33530
- }
33531
- .adl-u-display-none {
33532
- display: none !important;
33533
- }
33534
- .adl-u-display-initial {
33535
- display: initial !important;
33536
- }
33537
- .adl-u-display-inline {
33538
- display: inline !important;
33539
- }
33540
- .adl-u-display-inline-block {
33541
- display: inline-block !important;
33542
- }
33543
- .adl-u-display-block {
33544
- display: block !important;
33545
- }
33546
- .adl-u-display-table {
33547
- display: table !important;
33548
- }
33549
- .adl-u-display-table-row {
33550
- display: table-row !important;
33551
- }
33552
- .adl-u-display-table-cell {
33553
- display: table-cell !important;
33554
- }
33555
- /* #region Spacing */
33556
- /* #endregion */
33557
- /* #region Colors */
33558
- /* #endregion */
33559
- /* #region Fonts */
33560
- /* #endregion */
33561
- /* #region Borders */
33562
- /* #endregion */
33563
- /* #region Box-shadow */
33564
- /* #endregion */
33565
- /* #region Shadows */
33566
- /* #endregion */
33567
- /* #region Z-index */
33568
- /* #endregion */
33569
- /* #region Transition */
33570
- /* #endregion */
33571
- /* #region Timing functions */
33572
- /* #endregion */
33573
- /* #region Focus ring */
33574
- /* #endregion */
33575
- /* #region Inline components */
33576
- /* #endregion */
33577
- /* stylelint-disable-line scss/dollar-variable-pattern */
33578
- /* stylelint-disable-line scss/dollar-variable-pattern */
33579
- /* stylelint-disable-line scss/dollar-variable-pattern */
33580
- /* stylelint-disable-line scss/dollar-variable-pattern */
33581
- .adl-u-display-flex {
33582
- display: flex !important;
33583
- }
33584
- .adl-u-display-inline-flex {
33585
- display: inline-flex !important;
33586
- }
33587
- .adl-u-flex-direction-row {
33588
- flex-direction: row !important;
33589
- }
33590
- .adl-u-flex-direction-row-reverse {
33591
- flex-direction: row-reverse !important;
33592
- }
33593
- .adl-u-flex-direction-column {
33594
- flex-direction: column !important;
33595
- }
33596
- .adl-u-flex-direction-column-reverse {
33597
- flex-direction: column-reverse !important;
33598
- }
33599
- .adl-u-flex-wrap-wrap {
33600
- flex-wrap: wrap !important;
33601
- }
33602
- .adl-u-flex-wrap-nowrap {
33603
- flex-wrap: nowrap !important;
33604
- }
33605
- .adl-u-align-items-start {
33606
- align-items: start !important;
33607
- }
33608
- .adl-u-align-items-flex-start {
33609
- align-items: flex-start !important;
33610
- }
33611
- .adl-u-align-items-flex-end {
33612
- align-items: flex-end !important;
33613
- }
33614
- .adl-u-align-items-center {
33615
- align-items: center !important;
33616
- }
33617
- .adl-u-align-items-stretch {
33618
- align-items: stretch !important;
33619
- }
33620
- .adl-u-align-items-baseline {
33621
- align-items: baseline !important;
33622
- }
33623
- .adl-u-align-items-end {
33624
- align-items: end !important;
33625
- }
33626
- .adl-u-justify-content-center {
33627
- justify-content: center !important;
33628
- }
33629
- .adl-u-justify-content-flex-start {
33630
- justify-content: flex-start !important;
33631
- }
33632
- .adl-u-justify-content-flex-end {
33633
- justify-content: flex-end !important;
33634
- }
33635
- .adl-u-justify-content-start {
33636
- justify-content: start !important;
33637
- }
33638
- .adl-u-justify-content-end {
33639
- justify-content: end !important;
33640
- }
33641
- .adl-u-justify-content-left {
33642
- justify-content: left !important;
33643
- }
33644
- .adl-u-justify-content-right {
33645
- justify-content: right !important;
33646
- }
33647
- .adl-u-justify-content-space-between {
33648
- justify-content: space-between !important;
33649
- }
33650
- .adl-u-justify-content-space-around {
33651
- justify-content: space-around !important;
33652
- }
33653
- .adl-u-justify-content-space-evenly {
33654
- justify-content: space-evenly !important;
33655
- }
33656
- .adl-u-justify-content-stretch {
33657
- justify-content: stretch !important;
33658
- }
33659
- .adl-u-flex-1 {
33660
- flex: 1 !important;
33661
- }
33662
- .adl-u-width-full {
33663
- width: 100% !important;
33664
- }
33665
- .adl-u-width-auto {
33666
- width: auto !important;
33667
- }
33668
- .adl-loader__wrapper {
33669
- align-items: center;
33670
- display: flex;
33671
- height: 100%;
33672
- justify-content: center;
33673
- }
33674
- .adl-loader__wrapper--inline {
33675
- display: inline-block;
33676
- height: auto;
33677
- margin-right: 8px;
33678
- }
33679
- .adl-loading-indicator {
33680
- color: #00112c;
33681
- font-family: fakt, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;
33682
- font-size: 15px;
33683
- -webkit-font-smoothing: antialiased;
33684
- -moz-osx-font-smoothing: grayscale;
33685
- font-weight: 400;
33686
- line-height: 1.4;
33687
- box-sizing: border-box;
33688
- display: inline-block;
33689
- font-size: 15px;
33690
- font-weight: 100;
33691
- min-height: 24px;
33692
- min-width: 24px;
33693
- position: relative;
33694
- }
33695
- .adl-loading-indicator *,
33696
- .adl-loading-indicator *::before,
33697
- .adl-loading-indicator *::after {
33698
- box-sizing: border-box;
33699
- }
33700
- .adl-loading-indicator::after {
33701
- animation: adl-progress-circular-rotate 1s cubic-bezier(0.785, 0.135, 0.15, 0.86) infinite;
33702
- border: 3px solid #dce0e5;
33703
- border-radius: 50%;
33704
- border-top-color: #06f;
33705
- box-sizing: border-box;
33706
- content: "";
33707
- display: block;
33708
- height: 100%;
33709
- left: 0;
33710
- min-height: 24px;
33711
- min-width: 24px;
33712
- position: absolute;
33713
- top: 0;
33714
- width: 100%;
33715
- }
33716
- .adl-loading-indicator::before {
33717
- box-sizing: border-box;
33718
- }
33719
- .adl-loading-indicator--xsmall {
33720
- min-height: 14px;
33721
- min-width: 14px;
33722
- padding: 7px;
33723
- }
33724
- .adl-loading-indicator--xsmall::after {
33725
- border-width: 2px;
33726
- min-height: 14px;
33727
- min-width: 14px;
33728
- }
33729
- .adl-loading-indicator--dot::before {
33730
- background: #06f;
33731
- border-radius: 50%;
33732
- content: "";
33733
- display: block;
33734
- left: 4px;
33735
- min-height: 6px;
33736
- min-width: 6px;
33737
- position: absolute;
33738
- top: 4px;
33739
- }
33740
- .adl-loading-indicator--small {
33741
- padding: 12px;
33742
- }
33743
- .adl-loading-indicator--medium {
33744
- padding: 18px;
33745
- }
33746
- .adl-loading-indicator--large {
33747
- padding: 24px;
33702
+ .adl-u-truncate {
33703
+ overflow: hidden !important;
33704
+ text-overflow: ellipsis !important;
33705
+ }
33706
+ .adl-u-word-break-break-word {
33707
+ word-break: break-word !important;
33748
33708
  }
33749
- @keyframes adl-progress-circular-rotate {
33750
- 0% {
33751
- transform: rotate(0deg);
33752
- }
33753
- 100% {
33754
- transform: rotate(360deg);
33755
- }
33756
- }/* #region Spacing */
33757
- /* #endregion */
33758
- /* #region Colors */
33759
- /* #endregion */
33760
- /* #region Fonts */
33761
- /* #endregion */
33762
- /* #region Borders */
33763
- /* #endregion */
33764
- /* #region Box-shadow */
33765
- /* #endregion */
33766
- /* #region Shadows */
33767
- /* #endregion */
33768
- /* #region Z-index */
33769
- /* #endregion */
33770
- /* #region Transition */
33771
- /* #endregion */
33772
- /* #region Timing functions */
33773
- /* #endregion */
33774
- /* #region Focus ring */
33775
- /* #endregion */
33776
- /* #region Inline components */
33777
- /* #endregion */
33778
33709
  /* #region Spacing */
33779
33710
  /* #endregion */
33780
33711
  /* #region Colors */
@@ -33801,6 +33732,36 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
33801
33732
  /* stylelint-disable-line scss/dollar-variable-pattern */
33802
33733
  /* stylelint-disable-line scss/dollar-variable-pattern */
33803
33734
  /* stylelint-disable-line scss/dollar-variable-pattern */
33735
+ .adl-u-visibility-visible {
33736
+ visibility: visible !important;
33737
+ }
33738
+ .adl-u-visibility-hidden {
33739
+ visibility: hidden !important;
33740
+ }
33741
+ .adl-u-display-none {
33742
+ display: none !important;
33743
+ }
33744
+ .adl-u-display-initial {
33745
+ display: initial !important;
33746
+ }
33747
+ .adl-u-display-inline {
33748
+ display: inline !important;
33749
+ }
33750
+ .adl-u-display-inline-block {
33751
+ display: inline-block !important;
33752
+ }
33753
+ .adl-u-display-block {
33754
+ display: block !important;
33755
+ }
33756
+ .adl-u-display-table {
33757
+ display: table !important;
33758
+ }
33759
+ .adl-u-display-table-row {
33760
+ display: table-row !important;
33761
+ }
33762
+ .adl-u-display-table-cell {
33763
+ display: table-cell !important;
33764
+ }
33804
33765
  /* #region Spacing */
33805
33766
  /* #endregion */
33806
33767
  /* #region Colors */
@@ -33827,7 +33788,102 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
33827
33788
  /* stylelint-disable-line scss/dollar-variable-pattern */
33828
33789
  /* stylelint-disable-line scss/dollar-variable-pattern */
33829
33790
  /* stylelint-disable-line scss/dollar-variable-pattern */
33830
- /* #region Spacing */
33791
+ .adl-u-display-flex {
33792
+ display: flex !important;
33793
+ }
33794
+ .adl-u-display-inline-flex {
33795
+ display: inline-flex !important;
33796
+ }
33797
+ .adl-u-flex-direction-row {
33798
+ flex-direction: row !important;
33799
+ }
33800
+ .adl-u-flex-direction-row-reverse {
33801
+ flex-direction: row-reverse !important;
33802
+ }
33803
+ .adl-u-flex-direction-column {
33804
+ flex-direction: column !important;
33805
+ }
33806
+ .adl-u-flex-direction-column-reverse {
33807
+ flex-direction: column-reverse !important;
33808
+ }
33809
+ .adl-u-flex-wrap-wrap {
33810
+ flex-wrap: wrap !important;
33811
+ }
33812
+ .adl-u-flex-wrap-nowrap {
33813
+ flex-wrap: nowrap !important;
33814
+ }
33815
+ .adl-u-align-items-start {
33816
+ align-items: start !important;
33817
+ }
33818
+ .adl-u-align-items-flex-start {
33819
+ align-items: flex-start !important;
33820
+ }
33821
+ .adl-u-align-items-flex-end {
33822
+ align-items: flex-end !important;
33823
+ }
33824
+ .adl-u-align-items-center {
33825
+ align-items: center !important;
33826
+ }
33827
+ .adl-u-align-items-stretch {
33828
+ align-items: stretch !important;
33829
+ }
33830
+ .adl-u-align-items-baseline {
33831
+ align-items: baseline !important;
33832
+ }
33833
+ .adl-u-align-items-end {
33834
+ align-items: end !important;
33835
+ }
33836
+ .adl-u-justify-content-center {
33837
+ justify-content: center !important;
33838
+ }
33839
+ .adl-u-justify-content-flex-start {
33840
+ justify-content: flex-start !important;
33841
+ }
33842
+ .adl-u-justify-content-flex-end {
33843
+ justify-content: flex-end !important;
33844
+ }
33845
+ .adl-u-justify-content-start {
33846
+ justify-content: start !important;
33847
+ }
33848
+ .adl-u-justify-content-end {
33849
+ justify-content: end !important;
33850
+ }
33851
+ .adl-u-justify-content-left {
33852
+ justify-content: left !important;
33853
+ }
33854
+ .adl-u-justify-content-right {
33855
+ justify-content: right !important;
33856
+ }
33857
+ .adl-u-justify-content-space-between {
33858
+ justify-content: space-between !important;
33859
+ }
33860
+ .adl-u-justify-content-space-around {
33861
+ justify-content: space-around !important;
33862
+ }
33863
+ .adl-u-justify-content-space-evenly {
33864
+ justify-content: space-evenly !important;
33865
+ }
33866
+ .adl-u-justify-content-stretch {
33867
+ justify-content: stretch !important;
33868
+ }
33869
+ .adl-u-flex-1 {
33870
+ flex: 1 !important;
33871
+ }
33872
+ .adl-u-width-full {
33873
+ width: 100% !important;
33874
+ }
33875
+ .adl-u-width-auto {
33876
+ width: auto !important;
33877
+ }
33878
+ .adyen-kyc-field--tax-id {
33879
+ margin-bottom: 12px;
33880
+ }
33881
+ .adyen-kyc-field--tax-id-absence-reason {
33882
+ margin-top: 12px;
33883
+ }
33884
+ .adyen-kyc-field--same-name-as-legal-name {
33885
+ margin-bottom: 12px;
33886
+ }/* #region Spacing */
33831
33887
  /* #endregion */
33832
33888
  /* #region Colors */
33833
33889
  /* #endregion */
@@ -33849,20 +33905,6 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
33849
33905
  /* #endregion */
33850
33906
  /* #region Inline components */
33851
33907
  /* #endregion */
33852
- /* Reset */
33853
- /* Regular - Dimensions */
33854
- /* Regular - Fonts */
33855
- /* Shared - Styles */
33856
- /* Shared - Colors */
33857
- /* Small - Styles */
33858
- /* Small - Dimensions */
33859
- /* Small - Fonts */
33860
- /* State */
33861
- /* Shadow */
33862
- /* Motion */
33863
- /* Loader */
33864
- /* Circle */
33865
- /* Label Hover box */
33866
33908
  /* #region Spacing */
33867
33909
  /* #endregion */
33868
33910
  /* #region Colors */
@@ -33889,7 +33931,7 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
33889
33931
  /* stylelint-disable-line scss/dollar-variable-pattern */
33890
33932
  /* stylelint-disable-line scss/dollar-variable-pattern */
33891
33933
  /* stylelint-disable-line scss/dollar-variable-pattern */
33892
- .adl-tag {
33934
+ .adl-accordion {
33893
33935
  color: #00112c;
33894
33936
  font-family: fakt, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;
33895
33937
  font-size: 15px;
@@ -33897,103 +33939,55 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
33897
33939
  -moz-osx-font-smoothing: grayscale;
33898
33940
  font-weight: 400;
33899
33941
  line-height: 1.4;
33900
- background: #f3f6f9;
33901
- border: 1px solid #dce0e5;
33902
- border-radius: 0;
33903
- color: #394962;
33904
- display: inline-block;
33905
- font-size: 12px;
33906
- font-weight: 600;
33907
- height: 24px;
33908
- line-height: 24px;
33909
- padding: 0 8px;
33910
- text-decoration: none;
33911
- vertical-align: baseline;
33912
- white-space: nowrap;
33913
33942
  }
33914
- .adl-tag *,
33915
- .adl-tag *::before,
33916
- .adl-tag *::after {
33943
+ .adl-accordion *,
33944
+ .adl-accordion *::before,
33945
+ .adl-accordion *::after {
33917
33946
  box-sizing: border-box;
33918
33947
  }
33919
- .adl-tag--dark {
33920
- background: #394962;
33921
- border: 1px solid #20304c;
33922
- color: #fff;
33923
- }
33924
- .adl-tag--dark.adl-tag--removable:active {
33925
- background-color: #384861 !important;
33926
- }
33927
- .adl-tag--blue {
33928
- background: #e6f0ff;
33929
- border: 1px solid #cce0ff;
33930
- color: #06f;
33931
- }
33932
- .adl-tag--blue.adl-tag--removable:active {
33933
- background-color: #e1ecfb !important;
33934
- }
33935
- .adl-tag--red {
33936
- background: #fce5e5;
33937
- border: 1px solid #facccc;
33938
- color: #a10000;
33939
- }
33940
- .adl-tag--red.adl-tag--removable:active {
33941
- background-color: #f7e1e1 !important;
33942
- }
33943
- .adl-tag--orange {
33944
- background: #fff4e5;
33945
- border: 1px solid #ffeacc;
33946
- color: #b36900;
33947
- }
33948
- .adl-tag--orange.adl-tag--removable:active {
33949
- background-color: #faefe1 !important;
33950
- }
33951
- .adl-tag--green {
33952
- background: #e6f8ed;
33953
- border: 1px solid #cef2dd;
33954
- color: #07863a;
33955
- }
33956
- .adl-tag--green.adl-tag--removable:active {
33957
- background-color: #e1f3e9 !important;
33948
+ .adl-accordion--container {
33949
+ border: 1px solid #dce0e5;
33950
+ border-radius: 6px;
33958
33951
  }
33959
- .adl-tag--purple {
33960
- background: #f2e5ff;
33961
- border: 1px solid #e6ccff;
33962
- color: #8000ff;
33952
+ .adl-accordion--container .adl-accordion__item:first-child {
33953
+ border-top-color: transparent;
33963
33954
  }
33964
- .adl-tag--purple.adl-tag--removable:active {
33965
- background-color: #ede1fb !important;
33955
+ .adl-accordion--container .adl-accordion__item:first-child > .adl-accordion__header {
33956
+ border-radius: 4px 4px 0 0;
33966
33957
  }
33967
- .adl-tag--mint {
33968
- background: #e6fdf7;
33969
- border: 1px solid #cdfaef;
33970
- color: #027458;
33958
+ .adl-accordion--container .adl-accordion__item:last-child {
33959
+ border-bottom-color: transparent;
33971
33960
  }
33972
- .adl-tag--mint.adl-tag--removable:active {
33973
- background-color: #e1f8f3 !important;
33961
+ .adl-accordion--container .adl-accordion__item:last-child:not(.adl-accordion__item--open) > .adl-accordion__header {
33962
+ border-radius: 0 0 4px 4px;
33974
33963
  }
33975
- .adl-tag--teal {
33976
- background: #eef9f9;
33977
- border: 1px solid #eef9f9;
33978
- color: #eef9f9;
33964
+ .adl-accordion--guide {
33965
+ margin: 8px 0;
33966
+ padding-bottom: 16px;
33979
33967
  }
33980
- .adl-tag--teal.adl-tag--removable:active {
33981
- background-color: #e9f4f5 !important;
33968
+ .adl-accordion--guide .adl-accordion__item {
33969
+ background-color: #f3f6f9;
33970
+ border: 0;
33971
+ border-radius: 4px;
33972
+ padding: 4px 8px;
33982
33973
  }
33983
- .adl-tag--light-blue {
33984
- background: #e6f0ff;
33985
- border: 1px solid #e6f0ff;
33986
- color: #e6f0ff;
33974
+ .adl-accordion--guide .adl-accordion__header {
33975
+ padding: 0;
33987
33976
  }
33988
- .adl-tag--light-blue.adl-tag--removable:active {
33989
- background-color: #e1ecfb !important;
33977
+ .adl-accordion--guide .adl-accordion__title {
33978
+ color: #394962;
33979
+ font-size: 13px;
33980
+ font-weight: bold;
33990
33981
  }
33991
- .adl-tag--basic {
33992
- border-radius: 4px;
33993
- border-style: none;
33982
+ .adl-accordion--guide .adl-accordion__content {
33994
33983
  color: #394962;
33995
- font-size: 14px;
33996
- font-weight: 400;
33984
+ font-size: 13px;
33985
+ margin: 4px 24px;
33986
+ padding: 0;
33987
+ }
33988
+ .adl-accordion--guide .adl-accordion__toggle {
33989
+ color: #a5afbd;
33990
+ margin: 2px 8px 0 4px;
33997
33991
  }/* #region Spacing */
33998
33992
  /* #endregion */
33999
33993
  /* #region Colors */
@@ -34042,6 +34036,102 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
34042
34036
  /* stylelint-disable-line scss/dollar-variable-pattern */
34043
34037
  /* stylelint-disable-line scss/dollar-variable-pattern */
34044
34038
  /* stylelint-disable-line scss/dollar-variable-pattern */
34039
+ .adl-accordion__item {
34040
+ border-bottom: 1px solid transparent;
34041
+ border-top: 1px solid #dce0e5;
34042
+ position: relative;
34043
+ }
34044
+ .adl-accordion__item:last-child {
34045
+ border-bottom-color: #dce0e5;
34046
+ }
34047
+ .adl-accordion__item--open {
34048
+ overflow: visible;
34049
+ }
34050
+ .adl-accordion__header {
34051
+ color: #00112c;
34052
+ cursor: pointer;
34053
+ display: flex;
34054
+ padding: 16px;
34055
+ transition-duration: 0.1s;
34056
+ transition-property: margin, height, padding;
34057
+ }
34058
+ .adl-accordion__header:hover {
34059
+ background-color: #f3f6f9;
34060
+ }
34061
+ .adl-accordion__header:active {
34062
+ background-color: #dce0e5;
34063
+ }
34064
+ .adl-accordion__header:focus {
34065
+ box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgba(0, 102, 255, 0.4);
34066
+ transition: 0.1s cubic-bezier(0.785, 0.135, 0.15, 0.86);
34067
+ transition-property: box-shadow;
34068
+ outline: none;
34069
+ }
34070
+ .adl-accordion__title-wrapper {
34071
+ flex: 1;
34072
+ }
34073
+ .adl-accordion__title {
34074
+ color: inherit;
34075
+ font-weight: 600;
34076
+ }
34077
+ .adl-accordion__subtitle {
34078
+ color: #394962;
34079
+ font-size: 13px;
34080
+ }
34081
+ .adl-accordion__toggle {
34082
+ line-height: 1;
34083
+ margin: 2px 16px 0 0;
34084
+ padding: 0;
34085
+ width: 12px;
34086
+ }
34087
+ .adl-accordion__content {
34088
+ box-sizing: border-box;
34089
+ margin: 0 0 24px;
34090
+ overflow-x: auto;
34091
+ overflow-y: hidden;
34092
+ padding: 0 16px 0 calc(32px + 12px);
34093
+ transition-duration: 0.1s;
34094
+ transition-property: margin, height, padding;
34095
+ }
34096
+ .adl-accordion__item > .adl-accordion__content {
34097
+ margin: 0;
34098
+ }
34099
+ .adl-accordion__item--open > .adl-accordion__content {
34100
+ margin: 0 0 24px;
34101
+ }
34102
+ .adl-accordion--max-height-transition .adl-accordion__item > .adl-accordion__content {
34103
+ max-height: 0;
34104
+ transition-duration: 0.1s;
34105
+ transition-property: margin, max-height;
34106
+ }
34107
+ .adl-accordion--max-height-transition .adl-accordion__item--open > .adl-accordion__content {
34108
+ max-height: 500px;
34109
+ }/* #region Spacing */
34110
+ /* #endregion */
34111
+ /* #region Colors */
34112
+ /* #endregion */
34113
+ /* #region Fonts */
34114
+ /* #endregion */
34115
+ /* #region Borders */
34116
+ /* #endregion */
34117
+ /* #region Box-shadow */
34118
+ /* #endregion */
34119
+ /* #region Shadows */
34120
+ /* #endregion */
34121
+ /* #region Z-index */
34122
+ /* #endregion */
34123
+ /* #region Transition */
34124
+ /* #endregion */
34125
+ /* #region Timing functions */
34126
+ /* #endregion */
34127
+ /* #region Focus ring */
34128
+ /* #endregion */
34129
+ /* #region Inline components */
34130
+ /* #endregion */
34131
+ /* stylelint-disable-line scss/dollar-variable-pattern */
34132
+ /* stylelint-disable-line scss/dollar-variable-pattern */
34133
+ /* stylelint-disable-line scss/dollar-variable-pattern */
34134
+ /* stylelint-disable-line scss/dollar-variable-pattern */
34045
34135
  /* #region Spacing */
34046
34136
  /* #endregion */
34047
34137
  /* #region Colors */
@@ -35868,111 +35958,21 @@ a.adl-button:disabled, a.adl-button.adl-button--disabled {
35868
35958
  .adl-u-width-auto {
35869
35959
  width: auto !important;
35870
35960
  }
35871
- .adyen-kyc-dropdown {
35872
- position: relative;
35873
- }
35874
- .adyen-kyc-dropdown-button {
35875
- align-items: center;
35876
- cursor: pointer;
35877
- display: flex;
35878
- }
35879
- .adyen-kyc-dropdown-button::after {
35880
- 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");
35881
- background-position: center;
35882
- background-repeat: no-repeat;
35883
- content: "";
35884
- height: 6px;
35885
- position: absolute;
35886
- right: 16px;
35887
- width: 8px;
35888
- }
35889
- .adyen-kyc-dropdown-button--active::after {
35890
- transform: rotate(180deg);
35891
- }
35892
- .adyen-kyc-filter-input {
35893
- background: #fff;
35894
- border: 0;
35895
- caret-color: #06f;
35961
+ .adyen-collapsible-container {
35896
35962
  color: #00112c;
35897
- font-family: inherit;
35898
- font-size: 1em;
35899
- height: 100%;
35900
- padding: 0;
35901
- width: 100%;
35902
- }
35903
- .adyen-kyc-filter-input::placeholder {
35904
- color: #a5afbd;
35905
- font-weight: 200;
35906
- }
35907
- .adyen-kyc-filter-input:focus, .adyen-kyc-filter-input:active {
35908
- outline: 0;
35909
- }
35910
- .adyen-kyc-dropdown-list {
35911
- background: #fff;
35912
- display: none;
35913
- list-style: none;
35914
- margin: 0;
35915
- margin-bottom: 50px;
35916
- overflow-y: auto;
35917
- padding: 0;
35918
- position: absolute;
35919
- width: 100%;
35920
- z-index: 1;
35921
- }
35922
- .adyen-kyc-dropdown-list.adyen-kyc-dropdown-list--active {
35923
- display: block;
35924
- }
35925
- .adyen-kyc-dropdown-element {
35926
- align-items: center;
35927
- display: flex;
35928
- }/* #region Spacing */
35929
- /* #endregion */
35930
- /* #region Colors */
35931
- /* #endregion */
35932
- /* #region Fonts */
35933
- /* #endregion */
35934
- /* #region Borders */
35935
- /* #endregion */
35936
- /* #region Box-shadow */
35937
- /* #endregion */
35938
- /* #region Shadows */
35939
- /* #endregion */
35940
- /* #region Z-index */
35941
- /* #endregion */
35942
- /* #region Transition */
35943
- /* #endregion */
35944
- /* #region Timing functions */
35945
- /* #endregion */
35946
- /* #region Focus ring */
35947
- /* #endregion */
35948
- /* #region Inline components */
35949
- /* #endregion */
35950
- /* stylelint-disable-line scss/dollar-variable-pattern */
35951
- /* stylelint-disable-line scss/dollar-variable-pattern */
35952
- /* stylelint-disable-line scss/dollar-variable-pattern */
35953
- /* stylelint-disable-line scss/dollar-variable-pattern */
35954
- .adl-disclaimer-container {
35955
- background-color: #f3f6f9;
35956
- border: 0;
35957
- border-radius: 4px;
35958
- margin: 8px 0;
35959
- padding: 12px 16px;
35960
- }
35961
- .adl-disclaimer__title {
35962
- color: #394962;
35963
- font-size: 13px;
35964
- font-weight: bold;
35965
- margin-bottom: 8px;
35966
- }
35967
- .adl-disclaimer__content {
35968
- color: #394962;
35969
- display: flex;
35970
- flex-direction: column;
35971
- font-size: 13px;
35972
- gap: 8px;
35963
+ font-family: fakt, -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;
35964
+ font-size: 15px;
35965
+ -webkit-font-smoothing: antialiased;
35966
+ -moz-osx-font-smoothing: grayscale;
35967
+ font-weight: 400;
35968
+ line-height: 1.4;
35969
+ overflow: hidden;
35970
+ transition: height 0.2s cubic-bezier(0.785, 0.135, 0.15, 0.86);
35973
35971
  }
35974
- .adl-disclaimer__content p {
35975
- margin: 0;
35972
+ .adyen-collapsible-container *,
35973
+ .adyen-collapsible-container *::before,
35974
+ .adyen-collapsible-container *::after {
35975
+ box-sizing: border-box;
35976
35976
  }/* #region Spacing */
35977
35977
  /* #endregion */
35978
35978
  /* #region Colors */