* {
      box-sizing: border-box;


  }

  h1,
  h2,
  h3,
  h5,
  h6,
  p,
  span {
      padding: 0;
      margin: 0;
      font-family: 'Poppins', sans-serif;
  }

  body {
      background: #f5f3ff;
      font-family: "Poppins", sans-serif;
  }

  .ai__dashbaord__container {
      overflow-y: auto;
      position: relative;
      padding: 0;
      max-width: 690px;
      padding-bottom: 120px;
  }

  .card-box {
      background: #fff;
      border-radius: 15px;
      padding: 20px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
      margin-bottom: 18px;
  }

  .earn-header {
      background: #f6f2fd;
      padding: 18px;
      text-align: center;
      border-radius: 0;
  }

  .tp-value {
      font-weight: 500;
      color: #020202;
      font-size: 28px;
      margin-top: 10px;
  }

  .btn-green {
      background: #06d6a0;
      color: #fff;
      font-weight: 600;
  }

  .btn-pink {
      background: #ff4d6d;
      color: #fff;
      font-weight: 600;
  }

  .small-text {
      font-size: 14px;
      opacity: 0.8;
  }

  .ai_dashbaord__header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: fixed;
      left: 0px;
      right: 0px;
      z-index: 99999;
      padding-bottom: 10px;
      padding-top: 10px;
      max-width: 690px;
      width: 100%;
      margin: auto;
      box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
  }

  .ai__header-left--text {
      font-weight: 600;
      color: #858488;
      font-size: 14px;
      max-width: 85px;
      width: 100%;
  }



  .ai__header-left--text-number {
      font-weight: 600;
      display: inline-flex;
      align-items: center;
      color: #50af95;
      font-size: 17px !important;
  }

  .ai__header--left-box {
      display: inline-flex;
      align-items: center;
      padding-left: 10px;
      max-width: 311px;
      width: 100%;
  }

  .ai__header-left--text-number img {
      margin-right: 4px;
      margin-left: 3px;
  }

  .ai__header--button {
      color: #fff;
      background: #ffa52b;
      font-size: 12px;
      font-weight: 500;
      padding: 7px 8px;
      max-width: 104px;
      width: 100%;
      border-radius: 2px;

  }

  .ai__header--button img {
      width: 17px;
  }

  .ai__header--button:hover,
  .ai__header--button:focus,
  .ai__header--button:active {
      color: #fff !important;
      background: #ffa52b !important;
      box-shadow: none !important;
  }

  .ai__header-right {
      display: inline-flex;
      align-items: center;
      color: #777575;
      font-weight: 500;
      font-size: 16px;
      padding-right: 10px;
  }

  .ai__header-right img {
      width: 23px;
  }

  .ai__header-right p {
      padding-left: 4px;
      font-weight: 500 !important;
      font-size: 20px;
  }

  .ai__dashbaord_hero--section {
      margin-top: 60px;
      text-align: center;
  }

  .ai__section--banner {
      padding: 9px 14px;
      background: #303d27;
      color: #fff;
      font-weight: 500;
      font-size: 19px;
  }

  .ai__banner--text span {
      font-size: 12px;
      display: inline-block;
      margin-left: 26px;
      background: #4994d4;
      border-radius: 20px;
      padding-left: 10px;
      padding-right: 10px;
      outline: 1px groove #243d56;
  }

  .ai__banner--text span a {
      color: #fff;
      text-decoration: none;
      text-transform: uppercase;
      font-size: 10px;
  }

  .ai__banner--text {
      display: inline-flex;
      align-items: center;
  }

  .ai__hero__section--details {
      margin-top: 15px;
  }

  .ai__hero__section--details h6 {
      font-weight: 500;
      font-size: 16px;
      color: #000;
  }

  .ai__hero__section--details img {
      margin-left: 3px;
  }

  .ai_details__history--text {
      font-weight: 500;
      text-transform: capitalize;
      padding-left: 0px;
      font-size: 12.4px;
      color: #7b54cd;
      margin-left: -4px;
  }

  .ai__investment--table tbody tr td:nth-of-type(1) {
      color: #9a6fc9;
  }

  .ai_details__history--img {}

  .ai_details__history--earn {
      font-weight: 400;
  }

  .ai_details__history--earn span:nth-of-type(1) {
      color: #2b2b2b;
      font-weight: 500;
      font-size: 14px;
  }

  .ai_details__history--earn span:nth-of-type(2) {
      color: #000;
      font-weight: 500;
  }

  .ai_details__history--earn span:nth-of-type(3) {
      color: #5db700;
      font-weight: 400;
  }

  .ai_details__earn {
      font-size: 17px;
  }

  .ai_details__history--time {
      margin-top: 10px;
      background-color: #ddd3f2;
      display: inline-block;
      padding: 5px 10px;
      border-radius: 10px;
      font-size: 14px;
      color: #6e5b99;
  }

  .ai_details__history--time span {
      color: #000;
  }

  .ai_details__history--time .fa-regular.fa-clock {
      font-size: 12px;
      padding-right: 3px;
  }

  .ai_details__history--buttons-box {
      padding: 5px 10px;
  }

  .ai_details__history--buttons-box button:nth-of-type(1),
  .ai_details__history--buttons-box button:nth-of-type(2) {
      background-color: #7dcf28 !important;
      color: #fff;
      font-weight: 500;
      font-size: 14px;
      max-width: 177px;
      padding: 13px 10px;
      border-radius: 18px;
      border: none;
  }

  .ai_details__history--buttons-box button:nth-of-type(1):active,
  .ai_details__history--buttons-box button:nth-of-type(1):focus,
  .ai_details__history--buttons-box button:nth-of-type(1):hover {
      background-color: #7dcf28 !important;
      color: #fff !important;
      box-shadow: none;
  }

  .ai_details__history--buttons-box button:nth-of-type(2) {
      background-color: #ddd3f2 !important;
      color: #000;
      font-weight: 400;
  }

  .ai_details__history--buttons-box button:nth-of-type(2):active,
  .ai_details__history--buttons-box button:nth-of-type(2):focus,
  .ai_details__history--buttons-box button:nth-of-type(2):hover {
      background-color: #ddd3f2 !important;
      color: #000 !important;
      box-shadow: none;
  }

  .ai__card__box--main-line {
      text-align: center;
      color: #490cc9a1;
      font-size: 15px;
      font-weight: 500 !important;
  }

  .ai__investment--table thead tr th {
      color: #a19898;
      font-weight: 500;
      font-size: 12px;
      background-color: #ffffff;
      border: none;
      padding-left: 20px;
  }

  .ai__investment--table thead tr th:nth-of-type(2) {
      text-align: right;
      padding-right: 20px;
  }

  .ai__investment--table tbody tr td:nth-of-type(2) {
      text-align: right;
      padding-right: 20px;
      color: #76d910;
  }

  .ai__investment--table tbody tr td {
      border: none;
      font-size: 12.5px;
      padding-left: 20px;
      padding-top: 4px;
      padding-bottom: 4px;
  }


  .tab-box {
      background: white;
      padding: 20px;
      border-radius: 20px;
      box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.1);
      margin-top: 30px;
  }

  .nav-tabs .nav-link {
      border: none;
      font-weight: 500;
      color: #646592;
      font-size: 13px;
  }

  .nav-tabs .nav-link.active {
      color: #886bc7;
      border-bottom: 1px solid #886bc7;
      background: transparent;
      font-weight: 700;
  }

  .trade-card {
      padding: 18px 0;
      border-bottom: 1px solid #eee;
  }

  .trade-title {
      font-size: 16px;
      font-weight: 600;
      display: flex;
      justify-content: space-between;
      align-items: baseline;
  }

  .tag {
      padding: 2px 8px;
      font-size: 11px;
      border-radius: 10px;
      background: #e8e8e8;
      margin-left: 6px;
  }

  .profit {
      font-size: 22px;
      font-weight: 700;
  }

  .trade-power-box {
      background: white;
      padding: 20px;
      margin-top: 20px;
      border-bottom: 1px solid #b9b9b9;
      border-radius: 0;
  }

  .progress-ring {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      border: 5px solid #d8c0ff;
      border-top-color: #8b4bff;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 500;
      color: #606060;
      font-size: 12.4px;
      line-height: 1;
      text-align: center;
      flex-direction: column;
  }

  .progress-ring span {
      font-size: 8px;
      color: #2a2929;
  }

  .trade-card .trade-title span {
      font-size: 14.5px;
      font-weight: 400;
  }

  .trade-card .trade-title span span {
      color: gray;
      font-size: 10px !important;
      padding: 5px 8px;
  }

  .ai__tab--table--row {
      display: flex;
      font-size: 10px;
      max-width: 141px;
      width: 100%;
      justify-content: space-between;
      margin-top: -38px;
  }

  .ai__tab--table--time {
      text-align: right;
      font-size: 11px;
  }

  .ai__tab--table--time .profit p {
      margin-top: 10px;
      font-weight: 400;
      color: #0aa52a;
      font-size: 20px !important;
  }

  .ai__tab__entry-price {
      font-size: 13px;
      padding-top: 2px;
      color: #000;
  }

  .ai__tab--table--time .small {
      color: gray;
      font-weight: 500;
      font-size: 9px;
  }

  .ai__tab--table--time .small p,
  .ai__tab__enter--text,
  .ai__tab__enter--number {
      font-size: 9px !important;
  }

  .ai__tab__enter--text {
      font-size: 9px;
  }

  .ai__table__trading-more-btn {
      text-align: center;
  }

  .ai__table__trading-more-btn button {
      margin-top: 28px;
      padding: 11px 90px;
      border-radius: 20px;
      border: 1px solid #b9b9b9;
      background: #ffffff;
      font-size: 13px;
      color: #000;
      font-weight: 500;
      letter-spacing: 0.5px;
  }

  .ai__table-trade--right-text {
      font-size: 19px;
      font-weight: 500;
      color: #7dcf28;
  }

  .ai__trade-power-left-text {
      font-size: 14px;
      color: darkslategray;
      line-height: 1;
      font-weight: 500;
  }

  .ai__trade-power-left-time {
      font-size: 12px;
      color: #959595;
      font-weight: 500;
  }

  .footer-box img {
      width: 20px;
  }

  footer {
      position: fixed;
      bottom: 35px;
      width: 93%;
      background: #fff;
      z-index: 11;
      left: -50%;
      right: -50%;
      transform: translate(58%, -4%);
      padding: 3px 10px;
      border-radius: 33px;
      box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
  }

  .footer-logo--box-size img {
      width: 27px;
      height: 27px;
  }

  .footer-logo--box-size span {
      font-size: 13px !important;
      padding-top: 6px;
      font-weight: 600;
      color: gray;
  }

  .footer-logo--box-size.changebg img {
      background: transparent;
      filter: none;
      transform: none;
      box-shadow: none;
  }

  .footer-logo--box-size.changebg span {
      color: red;
  }

  .footer-logo--box-size img {
      background: transparent;
      filter: none;
      transform: none;
      box-shadow: none;

  }

  .ai__button__buytb--img {
      background: black;
      border-radius: 100%;
      padding: 0;
      margin-right: 4px;
      width: 28px;
  }

  /* Bottom sheet modal */
  .modal-bottom {
      position: fixed;
      bottom: 0;
      margin: 0;
      width: 100%;
      max-width: 100%;
  }

  .bottom-sheet {
      border-radius: 20px 20px 0 0;
      animation: slideUp 0.35s ease;
  }

  @keyframes slideUp {
      from {
          transform: translateY(100%);
      }

      to {
          transform: translateY(0%);
      }
  }

  .est-card {
      width: 30%;
      background: #ffffff;
      border-radius: 10px;
      border: 1px solid lightgray;
      font-weight: 300;
      font-size: 13px;
  }

  .est-card h6 {
      font-weight: 400;
  }

  .modal-backdrop.show {
      opacity: 0.4;
  }

  .modal.fade .modal-dialog {
      transform: translate(0%, 24%);
  }

  .ai__modal--titel {
      font-size: 14px;
      text-align: center;
      width: 100%;
  }



  .modal.fade .modal-dialog input {
      text-align: center;
      font-size: 12px;
      font-weight: 400;
      width: 100%;
      height: 50px;
      border-radius: 20px;
      border: 1px solid gray;
      text-align: center;
      font-size: 16px;
      padding-left: 57px;
  }

  .modal.fade .modal-dialog input:focus,
  .modal.fade .modal-dialog input:active,
  .modal.fade .modal-dialog input:focus-visible {
      border: 1px solid gray !important;
      outline: none;
  }

  .modal.fade .modal-dialog input::placeholder {
      text-align: center;
      color: rgb(192, 191, 191);
      font-size: 14px;
      font-weight: 400;
  }

  .ai__modal--logo {
      position: absolute;
      left: 8px;
      top: 7px;
      background: black;
      border-radius: 100%;
  }

  .ai__modal--total--tp {
      display: flex;
      justify-content: space-around;
  }

  .ai__modal--total--tp h5 {
      font-weight: 400;
      font-size: 15px;
      color: #000;
  }

  .ai__modal__bottom--text {
      font-size: 12px;
      margin-bottom: 12px;
      text-align: left;
  }

  .modal-footer button {
      background: #7dcf28;
      color: #fff;
      border-radius: 19px;
      font-size: 13px;
      padding-top: 12px;
      padding-bottom: 12px;
      font-weight: 500;
  }

  .modal-footer button:hover,
  .modal-footer button:active,
  .modal-footer button:focus {
      background: #7dcf28 !important;
      color: #fff !important;
  }