#setupmain-wrapper {
  .setup-container-ws {
    max-width: 720px;
    margin: 0 auto 24px;
    transition: all 0.3s ease;
  }

  .setup-container {
    padding: 24px;
    background-color: white;
    border-radius: 20px;
    max-width: 720px;
    margin: 0 auto 24px;
    transition: all 0.3s ease;
    overflow: hidden;

    .warning-msg-wrapper {
      border-color: 1px solid #ffc107;
      background-color: #fff9e5;
      min-width: unset;
    }
  }

  .license-form-top{
    & .desc{
      color: #4C5A73;
    }

  }
  .license-form-bottom{
    .addinstruction{
      .edw-icon{
        font-size: 24px;
        margin-left:8px;
      }
    }

    .license-ack-msg.sucessinfo{
      color: #28a745
    }
    .license-ack-msg.failureinfo{
      color: #b60011
    }
    #licensekey-input.is-invalid {
      background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'><path fill-rule='evenodd' clip-rule='evenodd' d='M0.46967 0.46967C0.762563 0.176777 1.23744 0.176777 1.53033 0.46967L9.53033 8.46967C9.82322 8.76256 9.82322 9.23744 9.53033 9.53033C9.23744 9.82322 8.76256 9.82322 8.46967 9.53033L0.46967 1.53033C0.176777 1.23744 0.176777 0.762563 0.46967 0.46967Z' fill='%23B60011'/><path fill-rule='evenodd' clip-rule='evenodd' d='M9.53033 0.46967C9.82322 0.762563 9.82322 1.23744 9.53033 1.53033L1.53033 9.53033C1.23744 9.82322 0.762563 9.82322 0.46967 9.53033C0.176777 9.23744 0.176777 8.76256 0.46967 8.46967L8.46967 0.46967C8.76256 0.176777 9.23744 0.176777 9.53033 0.46967Z' fill='%23B60011'/></svg>");
      background-size: 10px;
    }

    #licensekey-input.is-valid {
      background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><path fill-rule='evenodd' clip-rule='evenodd' d='M20.6748 6.26198C21.0824 6.63464 21.1107 7.26717 20.738 7.67478L10.6809 18.6748C10.4914 18.882 10.2236 19 9.94286 19C9.66211 19 9.39428 18.882 9.20484 18.6748L3.26198 12.1748C2.88931 11.7672 2.91763 11.1346 3.32524 10.762C3.73284 10.3893 4.36537 10.4176 4.73803 10.8252L9.94286 16.518L19.262 6.32524C19.6346 5.91764 20.2672 5.88931 20.6748 6.26198Z' fill='%2328A745'/></svg>");
      background-size: 24px;
    }
    #licensekey-input.is-checking {
      padding-right: calc(1.0625em + 1.8125rem) !important;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64px' height='64px' viewBox='0 0 128 128' version='1.0'%3E%3Cdefs%3E%3ClinearGradient id='linear-gradient'%3E%3Cstop offset='0%25' stop-color='%23ffffff'/%3E%3Cstop offset='100%25' stop-color='%23465062'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%3E%3Cpath d='M63.85 0A63.85 63.85 0 1 1 0 63.85 63.85 63.85 0 0 1 63.85 0zm.65 19.5a44 44 0 1 1-44 44 44 44 0 0 1 44-44z' fill='url(%23linear-gradient)' fill-rule='evenodd'/%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 64 64' to='360 64 64' dur='1080ms' repeatCount='indefinite'/%3E%3C/g%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: right calc(0.265625em + 0.453125rem) center;
      background-size: 24px;
    }

    .input-btn-wrapper {
      display: flex;
      column-gap: 16px;
      row-gap: 8px;

      input {
        display: inline-block;
      }
    }



    .license-submit-btn {
      max-height: 48px;

      @media screen and (max-width: 1024px) {
        max-height: 42px;
      }

      @media screen and (max-width: 767px) {
        margin-left: auto;
      }
    }

    .input-alert-wrapper {
      width: 100%;
    }

    @media screen and (max-width: 767px) {

      .input-btn-wrapper {
        flex-wrap: wrap;
      }
    }
  }

  .licenseactivation-tooltip {

    position: relative;
    display: inline-block;
    height: 24px;

    .tooltip-text {
      visibility: hidden;
      width: 200px;
      background-color: #333;
      color: #fff;
      text-align: center;
      border-radius: 4px;
      padding: 8px;
      position: absolute;
      z-index: 9999;
      bottom: 125%;
      left: 50%;
      transform: translateX(-50%);
      opacity: 0;
      transition: opacity 0.3s;
      font-size: 12px;
      font-weight: 400;
      line-height: 1.4;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
      pointer-events: none;
    }

    .edw-icon-Info {
      cursor: pointer;
    }

    .tooltip-text::after {
      content: "";
      position: absolute;
      top: 100%;
      left: 50%;
      margin-left: -5px;
      border-width: 5px;
      border-style: solid;
      border-color: #333 transparent transparent transparent;
    }

    &:hover .tooltip-text {
      visibility: visible;
      opacity: 1;
    }
  }

  .btn.disabled {
    background-color: #b9bcc1;
    border-color: #b9bcc1;
    pointer-events: none;
    touch-action: none;
  }

  .btn {
    .inner-loader {
      display: none;
    }
  }

  .btn.loading {
    position: relative;
    pointer-events: none;
    touch-action: none;

    &::before {
      content: "";
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      z-index: 1;
      background-color: rgba(255, 255, 255, 0.7);
    }

    & .inner-loader {
      display: block;
      width: 16px;
      height: 16px;
      position: absolute;
      font-size: 16px;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 2;
    }
  }

  .setupwizard-error-msg,
  .setupwizard-success-msg,
  .setupwizard-info-msg {
    color: #b60011;
    font-family: Inter;
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    line-height: normal;

    display: flex;
    align-items: center;
  }

  .setupwizard-error-msg .view-exception {
    color: #0051F9;
    font-style: normal;
    cursor: pointer;
    margin-left: 8px;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;

  }

  .setupwizard-info-msg {
    color: #343A40;
    border-radius: 20px;
    background-color: #6BF28A;
    padding: 4px 6px 4px 4px;
    gap: 4px;
    width: max-content
  }

  .setupwizard-success-msg {
    color: #28a745;
  }

  .exceptionmsg-body {
    padding: 12px;
    margin-top: 4px;
    max-width: 370px;
    border-radius: 6px;
    background: #FFE5E8;

    color: #343A40;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    position: relative;

    & * {
      word-break: break-word;
    }

    .close-btn {
      position: absolute;
      top: 1px;
      right: 4px;
      cursor: pointer;

      .icon {
        font-size: 9px;
      }
    }
  }

  .setup-input-component {
    display: inline-flex;
    min-width: 120px;
    align-items: center;
    padding: 16px;
    border-radius: 6px;
    border: 1px solid #d9dee3;
    background-color: #fff;
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.1);
    margin-bottom: 16px;

    &.full {
      display: flex;
    }

    &:has(input[type="radio"]) {
      cursor: pointer;

      input[type="radio"] {
        cursor: pointer;
      }
    }

    > input {
      box-shadow: none !important;

      &:checked::after {
        color: #28a745;
      }
    }

    > input[type="text"] {
      border: 0;
      outline: 0;
      background-color: transparent;
      padding: 16px 20px;
      color: #343a40;

      font-weight: 600;
      font-size: 14px;
      line-height: 22px;

      height: fit-content;

      &::placeholder {
        color: #7b8794;
        font-weight: 400;
      }
    }

    &:has(input[type="text"]) {
      padding: 0;
    }

    &:has(input:checked) {
      border-color: #6bf28a;
      background-color: #e8fced;
      box-shadow: none;

      span {
        font-weight: 600;
      }
    }
  }

  .sub-heading {
    color: #343A40;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 12px;
  }

  .sub-desc {
    color: #343A40;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    margin-bottom: 8px;
  }

  .inprogress {
    display: flex;
    padding: 4px;
    margin-top: 8px;
    align-items: flex-start;
    width: fit-content;
    min-width: 60px;

    border-radius: 20px;
    border: 1px solid var(--Other-Colors-Light-grey, #D9DEE3);
    background: var(--Other-Colors-Warning-light, #FFF9E5);

    span {
      color: #343A40;
      font-size: 12px;
      font-style: italic;
      font-weight: 400;
      line-height: normal;
    }
  }

  .installation-setup-info-wrapper {
    padding: 4px 8px;
    border-radius: 20px;
    background: #FFEDB8;

    .installation-setup-info {
      color: #343A40;
      font-size: 12px;
      font-style: italic;
      font-weight: 400;
      line-height: normal;
    }
  }


  .installable-plugins-wrapper {
    width: fit-content;
    margin: 0 auto;
  }

  .plugin-category {
    margin-bottom:28px;
  }

  .plugin-wrapper {
    margin-bottom: 16px;
    margin-left: 12px;
  }

  .setup-final-bg-wrapper {
    padding-bottom: 36px;
    position: relative;

    .heading-wrapper {
      position: absolute;
      top: 24px;
      left: 50%;
      transform: translateX(-50%);
      text-align: center;
    }

    .final-heading,
    .final-subheading {
      color: #FFF;
      font-size: 48px;
      font-style: normal;
      font-weight: 400;
      line-height: 56px;
      letter-spacing: -2px;
      margin: 0;
    }

    .final-subheading {
      font-size: 34px;
      line-height: 42px;
    }

    .celebration-bg {
      position: absolute;
      z-index: 16;
      width: 356px;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      display: none;
    }

    .celebration-img {
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 110px;
      height: 110px;
    }

    @media screen and (max-width: 767px) {

        .final-heading {
          font-size: 32px;
          line-height: 40px;
        }
        .final-subheading {
          font-size: 26px;
          line-height: 32px;
        }

        img:first-child {
          object-fit: cover;
          object-position: center bottom;
          height: 160px;
        }

        .celebration-img {
          width: 80px;
          height: 80px;
        }
    }

  }

  .setup-finalmsg-wrapper {
    padding: 24px;

    .sub-desc {
      max-width: 600px;
      margin: 0 auto;
      text-align: center;
    }
  }

  .feedbackcollection-wrapper {
    background-color: #E8FCED;

    .feedback-submitbtn {
      margin: 0 auto;
    }

  }

  .plugins-card-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;

    .plugin-card {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 12px;
      text-decoration: none;

      border-radius: 6px;
      border: 1px solid #D9DEE3;
      background-color: #FFF;

      .pdf-icon {
        width: 36px;
        height: 36px;
        padding: 4px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 3px;
        background: #E8FCED;
      }

    }
  }

  .configuration-wrapper{
    margin-bottom: 32px;
    &:last-child{
      margin-bottom: 0px;
    }
    .content {
      .setup-status{
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 4px;
        color: #28A745;
        .status-text{
          font-style: italic;
          color: inherit;
        }
      }
      .check-mark-icon{
        font-size: 10px;
        padding: 2px;
        border: 1px solid #28A745;
        border-radius: 50%;
        &.type-1{
          color: #28A745;
        }
        &.type-2{
          color: #343A40;
          border: 1px solid #6BF28A;
          background-color: #6BF28A;
        }
      }

      .head-color{
        color: #343A40;
      }
    }

    &.colorscheme{
      .content{
        max-width: 90px;
      };
      .pallet-color{
        display: grid;
        grid-template-columns: 1fr 24px;
        width: 100%;
        span{
          height: 24px;
        }
      }
      .edw-icon-Check{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
      }
      .status-text{
        background-color: #E8FCED;
        border-left: 1px solid #6BF28A;
        border-right: 1px solid #6BF28A;
        border-bottom: 1px solid #6BF28A;
      }
    }

    &.fontfamilysetup{
      .content{
        display: flex;
        justify-content: start;
        align-items: flex-start;
        gap: 8px;
        padding: 24px;
        border-radius: 6px;
        border:  1px solid #6BF28A;
        background-color: #E8FCED;
      }
    }
    &.logosetup{
      .content{
        padding: 20px;
        border-radius: 6px;
        border: 1px solid #D9DEE3;
        display: flex;
        align-items: center;
        justify-content: start;
        gap: 8px;
        width: fit-content;
        min-width: 200px;
        min-height: 80px;
        .edw-icon{
          font-size: 24px;
        }
        .status-text{
          font-size: 16px;
          font-style: normal;
          font-weight: 400;
        }
      }
    }
    .page-course-card-wrapper{
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
      gap: 24px;
      .single-card-wrapper{
        padding: 16px;
        display: flex;
        flex-direction: column;
        gap: 24px;
        background-color: #E8FCED;
        border-radius: 8px;
        border: 1px solid  #6BF28A;
        .thumbnail-img{
          object-fit: cover;
          object-position: top;
          height: 356px;
          border-radius: 4px;
          border: 1px solid #EBF0F9;
        }
      }

      @media screen and (max-width: 400px) {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      }
    }
    .page-setup-notice{
      padding: 16px;
      border-radius: 6px;
      border: 1px solid #FFC107;
      background-color: #FFF9E5;
    }
  }
}

.edw-setup-help-dropdown{
  position: fixed;
    bottom: 14px;
    right: 14px;
  .dropdown-toggle{
    border-radius: 50%;
    width: 48px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    &::after{
      display: none;
    }
    .edw-icon{
      font-size: 24px;
    }
  }
  .dropdown-menu{
    border-radius: 6px;
    border: 1px solid #D9DEE3;
    background:  #FFF;
    padding: 24px;
    width: 300px;
    .edw-helpdrodown-item{
      display: flex;
      justify-content: start;
      align-items: center;
      gap: 8px;
      .edw-icon{
        font-size: 24px;
        color: #5B6880;
      }
      .guide-link{
        color: #4C5A73;
      }
      margin-bottom: 8px;
      &:last-child{
        margin-bottom: 0;
      }
    }
  }
}