._snackbar_1vyxc_1 {
  z-index: 1400;
  position: fixed;
  display: flex;
  left: 0.5rem;
  right: 0.5rem;
  top: 0.5rem;
  margin-top: 1rem;
  align-items: center;
  justify-content: center;
  pointer-events: none;

  ._snackbarContent_1vyxc_13 {
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 0.25rem;
    box-shadow: none;
    font-family: Avenir, Avenir-Black, Arial, sans-serif;
    font-size: 0.875rem;
    line-height: 1.43;
    display: flex;
    padding: 0.375rem 1rem;
    border: 2px solid;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
  }

  ._snackbarContent_1vyxc_13._error_1vyxc_28 {
    color: #4a1a1a;
    background-color: #fdf3f2;
    border-color: #ab1212;
  }

  ._snackbarContent_1vyxc_13._success_1vyxc_34 {
    color: #1e4620;
    background-color: #e6f6e7;
    border-color: #1c7d26;
  }

  ._snackbarIcon_1vyxc_40 {
    display: flex;
    margin-right: 0.75rem;
    padding: 0.438rem 0;
    font-size: 1.375rem;
  }

  ._snackbarIcon_1vyxc_40._error_1vyxc_28 {
    color: #ab1212;
  }

  ._snackbarIcon_1vyxc_40._success_1vyxc_34 {
    color: #1c7d26;
  }

  ._snackBarMessage_1vyxc_55 {
    min-width: 0;
    padding: 0.5rem 0;
  }
}
._wrapper_1enqu_1 {
  ._main_1enqu_2 {
    margin-top: 58px;
    ._content_1enqu_4 {
      display: flex;
      width: 100%;
      min-height: calc(100vh - 60px);
      margin-left: 0;
      & > div {
        flex: 1 1 auto;
        overflow-x: hidden;
      }
    }
  }
  @media (min-width: 768px) {
    ._main_1enqu_2 {
      ._sidebar_1enqu_17 {
        position: fixed;
        top: 58px;
        left: 0;
        bottom: 60px;
      }
      ._content_1enqu_4 {
        min-height: calc(100vh - 7.5rem);
        margin-left: 120px;
        width: calc(100% - 120px);
      }
    }
    /* This will be the final css for unified portal after integration*/
    &#unified {
      ._main_1enqu_2 {
        margin-top: 0;
        ._content_1enqu_4 {
          margin-left: 0;
          width: 100%;
        }
      }
    }
  }
}
._merchantCardWrapper_11n31_1 {
  display: flex;
  flex-direction: column;
  background: #fafafa;
  padding: 1.5rem;
  font-family: 'Avenir';
  text-align: left;
  border-radius: 0.5rem;
  border: none;
  cursor: pointer;

  ._header_11n31_12 {
    display: grid;
    grid-template-columns: 1fr auto;
    margin-bottom: 1.5rem;

    ._merchantInfo_11n31_17 {
      display: flex;
      flex-direction: column;
      text-align: left;

      ._merchantNumber_11n31_22 {
        font-family: 'Avenir-Black';
        color: #051d33;
        font-size: 0.875rem;
        font-weight: 900;
        margin: 0;
      }

      ._merchantIdLabel_11n31_30 {
        color: #c3c3c3;
        font-size: 0.75rem;
        margin: 0;
        margin-top: 2px;
      }
    }
  }

  ._businessAddress_11n31_39 {
    color: #051d33;
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5rem;
    height: 3rem;
    margin: 0;
    margin-bottom: 0.75rem;
    /* Truncate to 2 lines */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    word-break: break-word;
  }

  ._pill_11n31_59 {
    display: flex;
    padding: 0 0.75rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: 'Avenir-Black';
    font-weight: 900;
    font-size: 0.875rem;
    color: #051d33;
    border-radius: 1.25rem;
    border: 2px solid var(--status-colours-1-c-7-d-26-success-green, #1c7d26);

    &._subscribed_11n31_72 {
      border: 2px solid var(--status-colours-1-c-7-d-26-success-green, #1c7d26);
      background: var(--surface-success, #e6f6e7);
    }

    &._notSubscribed_11n31_77 {
      border: 2px solid var(--primary-colour-ffb-600-sunrise, #ffb600);
      background: var(--surface-warning, #fff6de);
    }

    &._cancelled_11n31_82 {
      border: 2px solid var(--border-error, #ab1212);
      background: var(--surface-error, #fdf3f2);
    }
  }

  ._ctaSection_11n31_88 {
    display: grid;
    grid-template-columns: auto auto;
    padding: 0.25rem 0.75rem;
    align-items: center;
    gap: 0.5rem;
    border-radius: 1rem;
    width: fit-content;

    &._ready_11n31_97 {
      background: var(--surface-success, #e6f6e7);
    }

    &._actionRequired_11n31_101 {
      background: #dff4fb;
    }

    &._noPermission_11n31_105 {
      background: var(--surface-warning, #fff6de);
    }

    ._ctaText_11n31_109 {
      margin: 0;
      font-size: 0.875rem;
      font-weight: 400;
      color: var(--text-tertiary, #707272);
    }
  }
}
._touContent_1sve0_1 {
  height: 400px;
  overflow-y: auto;
  max-height: 550px;
  border: 2px solid #c3c3c3;
  border-radius: 0.5rem;
  padding: 0.625rem 1rem;
  word-break: break-word;

  ._touContentBottom_1sve0_10 {
    height: 1px;
    width: 100%;
    visibility: hidden;
  }

  p {
    font-family: 'Avenir', Arial, sans-serif;
    font-size: 16px;
    margin-left: 1rem;
  }

  p > u > strong {
    font-family: 'Avenir', Arial, sans-serif;
    color: #051d33;
    font-size: 18px;
  }

  h1 {
    margin: 0;
  }

  h2 {
    font-family: 'Avenir-Black', sans-serif;
  }
}

@media (min-width: 768px) {
  ._touContent_1sve0_1 {
    height: 494px;
    border: 1px solid #eee;
  }
}
._pageWrapper_1o9vd_1 {
  display: flex;
}

._touPane_1o9vd_5 {
  min-width: 50%;
  background-color: #e4eeef;
  padding: 0;
}

._headerSection_1o9vd_11 {
  background-color: white;
  padding: 1.5rem;
  border-radius: 0 0 1.25rem 1.25rem;

  p {
    margin: 0.625rem 0 0 0;
    line-height: 100%;
    font-size: 0.875rem;
  }
}

._mainContent_1o9vd_23 {
  padding: 1.5rem;
}

._decorationPane_1o9vd_27 {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 50%;
  background-color: #e4eeef;
  text-align: center;
}

._decoContent_1o9vd_36 {
  width: 60%;
}

._decoTitleWrapper_1o9vd_40 {
  display: flex;
  flex-direction: column;
  font-family: 'Avenir', Arial, sans-serif;
  margin: 0;

  ._decoTitle_1o9vd_40 {
    font-weight: 300;
    font-size: 1.75rem;
    line-height: 100%;
    margin-top: 1.5rem;
  }

  ._decoTitleBold_1o9vd_53 {
    font-weight: 750;
    font-size: 1.75rem;
    line-height: 100%;
    margin-top: 0.75rem;
    margin-bottom: 2rem;
  }
}

._decoText_1o9vd_62 {
  margin: 0;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5rem;
}

/* mobile < 768px, [768px >= tablet < 1180px], desktop >= 768px, large desktop >= 1180px */
@media (min-width: 768px) {
  ._touPane_1o9vd_5 {
    background-color: white;
    padding: 2.5rem;
  }

  ._headerSection_1o9vd_11 {
    padding: initial;
    border-radius: initial;

    p {
      margin: 1.5rem 0 0 0;
      line-height: 1.5rem;
      font-size: 1.125rem;
    }
  }

  ._mainContent_1o9vd_23 {
    padding: initial;
  }
}

@media (max-width: 1179px) {
  ._decorationPane_1o9vd_27 {
    display: none;
  }
}
._pageWrapper_hqpef_1 {
  display: flex;
  flex-direction: column;
  min-width: 100%;
  padding: 1.5rem;
  color: #051d33;
}

._title_hqpef_9 {
  margin: 0;
  font-family: 'Avenir-Black', Arial, sans-serif;
  font-size: 1.75rem;
  font-weight: 750;
  line-height: 2.25rem;
}

._description_hqpef_17 {
  margin: 1.5rem 0 0 0;
  font-size: 1.125rem;
  line-height: 1.5rem;
  font-weight: 400;
}

._buttonContainer_hqpef_24 {
  margin-top: 1.5rem;
  display: grid;
  gap: 0;

  ._button_hqpef_24 {
    margin-bottom: 0.5rem;
    border: none;
    border-radius: 5px;
    font-family: 'Avenir', Arial, sans-serif;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s ease;
    min-height: 3rem;
    width: 100%;
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  ._secondaryButton_hqpef_43 {
    background-color: white;
    color: #051d33;
    border: 2px solid #051d33;

    &:hover {
      background-color: #e0e0e0;
    }
  }

  ._primaryButton_hqpef_53 {
    background: #00b6c9;
    color: #051d33;

    &:focus {
      background: #051d33;
      color: white;
    }

    &:disabled {
      background-color: #ccc;
      color: #383838;
      cursor: not-allowed;
    }
  }
}

@media (min-width: 768px) {
  ._pageWrapper_hqpef_1 {
    padding: 2.5rem;
  }

  ._buttonContainer_hqpef_24 {
    display: flex;
    gap: 1rem;

    ._button_hqpef_24 {
      width: 9.375rem;
      font-size: 1rem;
      line-height: 1.5rem;
    }
  }
}

@media (min-width: 1180px) {
  ._pageWrapper_hqpef_1 {
    min-width: 50%;
    background-color: white;
  }
}
._touContainer_1g90x_1 {
  margin-top: 0;
  margin-bottom: 1.5rem;
}

._checkboxContainer_1g90x_6 {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;

  ._checkbox_1g90x_6 {
    width: 1.25rem;
    height: 1.25rem;
    accent-color: #051d33;
  }

  ._checkboxLabel_1g90x_17 {
    align-self: center;
    font-size: 0.875rem;
  }
}

._errorMessage_1g90x_23 {
  margin-top: 0.5rem;
  background-color: #fdf3f2;
  border-radius: 5px;
  display: flex;
  align-items: center;
  padding: 1rem;
  gap: 1rem;
}

/* mobile < 768px, [768px >= tablet < 1180px], desktop >= 768px, large desktop >= 1180px */
@media (min-width: 768px) {
  ._touContainer_1g90x_1 {
    margin-top: 2rem;
    margin-bottom: 2.5rem;
  }
}
/* Carousel container styles */
._carouselContainer_w85j7_2 {
  border-radius: 8px;
  box-shadow: #00000033 0px 4px 10px 0px;
  border: 2px solid #eeeeeeed;
  padding-bottom: 1.5rem;
  & > :first-child {
    opacity: 0;
    animation: _fadeIn_w85j7_1 0.75s forwards;
  }
}

@keyframes _fadeIn_w85j7_1 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Action container with grid layout */

._actionContainer_w85j7_24 {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 1.5rem;
  align-items: center;
  width: fit-content;
  margin: 0 auto;
  outline: none;
  border-radius: 4px;
  margin-top: 0.5rem;
}

._actionContainer_w85j7_24:focus {
  outline: 2px solid #00b6c9;
  outline-offset: 2px;
}

/* Navigation buttons */
._navButton_w85j7_42 {
  background: none;
  border: none;
  color: #00b6c9; /* brightTurquoise */
  cursor: pointer;
  padding: 0;
  transition: opacity 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  outline: none;

  &:hover {
    opacity: 0.7;
  }

  &:focus {
    outline: 2px solid #00b6c9;
    outline-offset: 2px;
  }

  &:first-child {
    justify-self: end;
  }

  &:last-child {
    justify-self: start;
  }
}

/* Chip container styles */
._chipContainer_w85j7_73 {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
}

/* Carousel chip styles */
._carouselChip_w85j7_80 {
  cursor: pointer;
  border: none;
  padding: 0;
  border-radius: 1.25rem;
  background-color: #c8e6f1; /* lightSkyBlue */
  transition:
    width 0.3s ease-in-out,
    background-color 0.3s ease-in-out;
  width: 1.125rem;
  height: 1.125rem;
  outline: none;
}

._carouselChip_w85j7_80:focus {
  outline: 2px solid #00b6c9;
  outline-offset: 2px;
}

._carouselChipActive_w85j7_99 {
  background-color: #00b6c9; /* brightTurquoise */
  width: 6rem;
}
._subtitle_1otvo_1 {
  margin: 0;
  font-family: 'Avenir', Arial, sans-serif;
  font-size: 1.125rem;
  font-weight: 750;
  line-height: 1.625rem;
}

._data_1otvo_9 {
  margin: 0;
}

._dataDiv_1otvo_13 {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  display: flex;
  flex-direction: column-reverse;

  dd {
    margin: 0 0 0.25rem 0;
    font-size: 0.875rem;
    font-weight: 400;
    text-transform: capitalize;
  }

  dt {
    margin: 0;
    color: #54575a;
    font-size: 0.875rem;
  }
}

._dataDiv_1otvo_13:last-child {
  margin-bottom: 0;
}

/* mobile < 768px, [768px >= tablet < 1180px], desktop >= 768px, large desktop >= 1180px */
@media (min-width: 768px) {
  ._subtitle_1otvo_1 {
    margin-top: 2rem;
  }

  ._dataDiv_1otvo_13 {
    dd {
      font-size: 1rem;
    }
  }

  ._dataDiv_1otvo_13:last-child {
    margin-bottom: 1rem;
  }
}
._wrapper_1iwx5_1 {
  display: none;
  position: fixed;
  bottom: 80px;
  left: 0;
  right: 0;
  z-index: 9999;

  &._show_1iwx5_9 {
    display: block;
    pointer-events: none;
  }

  ._container_1iwx5_14 {
    display: grid;
    width: 80vw;
    max-width: 1000px;
    margin: 0 auto;
    grid-template-columns: 1fr auto;
    border-radius: 5px;
    background: #fff;
    padding-right: 32px;
    gap: 32px;
    pointer-events: auto;
    box-shadow: 0 4px 30px 0 rgba(0, 0, 0, 0.25);

    p {
      font-size: 14px;
      margin: 0;
      padding: 32px;
    }

    a {
      color: #004c60;
      text-decoration: underline;
      cursor: pointer;
      font-weight: 500;
    }

    button {
      cursor: pointer;
      padding: 8px 16px;
      margin-right: 32px;
      margin: 0 auto;
      border-radius: 5px;
      background: #ffb600;
      place-self: center;
      border: none;
      color: #051d33;
      text-align: center;
      font-family: Avenir;
      font-size: 16px;
      font-style: normal;
      font-weight: 500;

      &:hover {
        background-color: #ffd877;
      }
    }
  }
}

@media (min-width: 768px) {
  ._wrapper_1iwx5_1 {
    left: 120px;
  }
}
