.ca-nshift {
  &__form {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 300px;
    margin: $px20 auto $px40;
  }

  &__text {
    text-align: center;
    font-size: $font-size-l;
  }

  &__input {
    width: 100%;
    margin: $px20 0 $px10;
  }

  &__feedback {
    margin: $px10 0 0;
  }
}
/* stylelint-disable */
.unifaun-checkout-hidden {
  overflow: hidden;
  height: 0;
}

.unifaun-checkout-option0,
.unifaun-checkout-option1:not(:only-child) {
  border: 2px solid $c-border-light;
  border-radius: 2px;
  padding: 15px 15px 15px 60px;
  position: relative;
  min-height: 90px;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  transition: border-color 200ms ease;

  &:not(:last-child) {
    margin: 0 0 $px16;
  }

  &::before {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    box-shadow: 0 0 0 2px $c-border-light;
    background-color: #fff;
    border: 4px solid #fff;
    position: absolute;
    top: 18px;
    left: 18px;
    border-radius: 50%;
    transition: background-color 200ms ease;
  }

  &:hover {
    &::before {
      background-color: hex-to-rgba($c-accent-color, 0.4);
    }
  }

  &.unifaun-checkout-selected0,
  &.unifaun-checkout-selected1 {
    border-color: $c-success;
    cursor: initial;

    &::before {
      background-color: var(--accent-color, $c-accent-color);
    }
  }
}

.unifaun-checkout-option-column1 {
  @include bp(phone-only) {
    display: flex;
    flex-direction: column-reverse;
  }
}

.unifaun-checkout-option0 .unifaun-checkout-option-header0 {
  @include bp(tablet) {
    padding-right: rem-calc(100px);
  }
}

.unifaun-checkout-option-radio {
  display: none;
}

.unifaun-checkout-option-prefix-icon,
.unifaun-checkout-option-suffix-icon {
  margin-bottom: 5px;

  img {
    max-width: 70px;
    max-height: 20px;
  }

  @include bp(tablet) {
    position: absolute;
    right: 15px;
    bottom: 15px;
    margin: 0;
  }
}

.unifaun-checkout-option-title {
  display: inline-block;
  font-size: $font-size-m;
  font-weight: $font-weight-bold;
  cursor: pointer;

  @include bp(phone-only) {
    padding-right: rem-calc(50px);
  }
}

.unifaun-checkout-option-delivery,
.unifaun-checkout-option-description1 {
  margin: 5px 0;
  display: block;
}

.unifaun-checkout-option-description2,
.unifaun-checkout-option-description3 {
  font-size: $font-size-xs;
  color: $c-text-secondary;
  margin-top: 3px;
}

.unifaun-checkout-option-separator {
  display: none;
}

.unifaun-checkout-option-price {
  position: absolute;
  right: 15px;
  top: 15px;
  font-weight: $font-weight-bold;
  font-size: 17px;
  background-color: $c-white;
}

.unifaun-checkout-option-sub-options {
  padding: $px16 0 $px12;
  margin: $px16 0 0;
  border-top: $border-light;

  @include bp(tablet) {
    padding-right: rem-calc(100px);
  }
}

.unifaun-checkout-option1 {
  &:not(:only-child) {
    @include bp(tablet) {
      margin-right: -100px;

      &:not(:last-child) {
        margin: 0 -100px $px16 0;
      }
    }
  }

  .unifaun-checkout-option-sub-options {
    @include bp(tablet) {
      padding-right: 0;
    }
  }
}

.unifaun-checkout-option-agents-wrapper,
.unifaun-checkout-list-input {
  cursor: pointer;
  position: relative;
  margin: $px10 0 0;

  &::after {
    @include valign;

    content: '';
    background-color: $c-input-background;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-position: center center;
    background-size: 20px 20px;
    background-repeat: no-repeat;
    width: 45px;
    height: calc(100% - 2px);
    right: 1px;
    pointer-events: none;
  }
}

.unifaun-checkout-option-agents,
.unifaun-checkout-list-input-select {
  cursor: pointer;
  width: 100%;
  height: 48px;
  padding: 0 $px16;
  border: $input-border;
  background-color: $c-input-background;
  border-radius: $input-border-radius;
  transition: border-color 200ms ease;

  &:focus {
    border-color: $c-input-focused-border;
  }

  &:focus-visible {
    box-shadow: none;
  }
}

.unifaun-checkout-option-agent-info-onoff-link {
  display: inline-flex;
  align-items: center;
  margin: 0 0 $px8;
  position: relative;

  &::before {
    content: '';
    width: calc(100% - 14px);
    height: 1px;
    background-color: $c-text-primary;
    position: absolute;
    bottom: 0;
    right: 0;
  }
}

.unifaun-checkout-option-agent-info-onoff {
  font-size: 1.2em;
  margin: 0 $px4 0 0;
  color: $c-success;
  font-weight: $font-weight-bold;
  width: 10px;
}

.unifaun-checkout-clip-box {
  overflow: hidden;
}

.unifaun-checkout-option-agent-info {
  padding: $px10 0 0;
}

.unifaun-checkout-option-agent-opening-hours {
  margin: $px8 0 0;

  tr:first-child td {
    border-bottom: $border-dark;
    font-weight: $font-weight-bold;
  }

  tr td {
    padding: $px4;
  }

  tr:nth-child(2) td {
    padding: $px8 $px4 $px4;
  }
}

.unifaun-checkout-text-input,
.unifaun-checkout-list-input {
  position: relative;
  display: flex;
  flex-direction: column;
}

.unifaun-checkout-text-input-label,
.unifaun-checkout-list-input-label {
  pointer-events: none;
  padding: rem-calc(1px) rem-calc(6px);
  transform-origin: left center;
  font-size: $font-size-xs;
  border-radius: rem-calc(10px);
  background-color: $c-input-background;
  transform: translateY(-50%) scale(1.15);
  transition:
    top 0.2s ease,
    transform 0.2s ease;
  position: absolute;
  top: 50%;
  left: $px10;

  .unifaun-checkout-invalid & {
    top: 34%;
  }

  .unifaun-checkout-active & {
    font-weight: $font-weight-bold;
    transform: translateY(-50%) scale(1);
    top: 0;
  }

  .unifaun-checkout-disabled & {
    color: $c-text-secondary;
    background-color: $c-lightest-gray;
  }
}

.unifaun-checkout-list-input-label {
  transform: translateY(-50%) scale(1);
  top: 0;
}

.unifaun-checkout-text-input-label-message,
.unifaun-checkout-list-input-label-message {
  font-size: $font-size-xs;
  color: $c-text-secondary;
  order: 3;
  display: block;

  &:not(:empty) {
    padding: $px4 $px16 0;
  }

  .unifaun-checkout-text-input.unifaun-checkout-invalid & {
    color: $c-error;
  }
}

.unifaun-checkout-text-input-input {
  height: 40px;
  border: $input-border;
  background-color: $c-input-background;
  border-radius: $input-border-radius;
  transition: border-color 200ms ease;
  padding: 0 $px16;
  width: 100%;

  &:focus {
    border-color: $c-input-focused-border;
  }

  &:focus-visible {
    box-shadow: none;
  }

  .unifaun-checkout-text-input.unifaun-checkout-disabled & {
    background-color: $c-lightest-gray;
  }
}

.unifaun-checkout-addon-container:not(:first-child) {
  margin: $px20 0 0;
}

.unifaun-checkout-addon-label {
  display: flex;
  align-items: center;
  margin: 0 0 $px16;
  cursor: pointer;
}

.unifaun-checkout-custom-checkbox {
  width: $px20;
  height: $px20;
  border: $border-dark;
  transition: all 150ms ease;
  margin: 0 $px10 0 0;
  flex-shrink: 0;
  background-color: $c-white;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-check'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
  background-size: 15px 15px;
  background-position: center center;
}

.unifaun-checkout-addon-checkbox {
  &:checked + .unifaun-checkout-custom-checkbox {
    background-color: $c-input-checkbox-checked-bg;
    border-color: $c-input-checkbox-checked-bg;
  }

  &:disabled + .unifaun-checkout-custom-checkbox {
    opacity: 0.7;

    & ~ span {
      color: $c-text-secondary;
    }
  }
}

.unifaun-checkout-addon-price {
  font-weight: $font-weight-bold;
  margin: 0 0 0 $px8;
}

.unifaun-checkout-addon-error {
  white-space: nowrap;
  overflow: hidden;
}

.unifaun-checkout-option-fields-panel {
  padding: $px10 0;
}

.unifaun-checkout-option-field {
  margin: 0 0 $px12;
}

.unifaun-checkout-option-field-checkbox,
.unifaun-checkout-option-field-radio,
.unifaun-checkout-option-agent-checkbox {
  margin-top: 0;
  margin-bottom: 0;
}

.unifaun-checkout-option-field-content {
  display: block;
}

.unifaun-checkout-option-field-items {
  margin: 0;
  padding: 2px 0;
  list-style: none;
}

.unifaun-checkout-option-field-item {
  padding: 1px 0;
}

.unifaun-checkout-option-field-item-fields {
  margin: 0;
  padding: 0 0 0 25px;
  list-style: none;
}

.unifaun-checkout-additional-fields {
  display: none;
}
/* stylelint-enable */
