.eacf7-entries-wrap {
  .eacf7-entries-header {
    display: flex;
    width: calc(100% - 20px);
    margin-left: -20px;
    background: #fff;
    padding: 15px 20px;
    position: sticky;
    top: 32px;
    border-bottom: 1px solid #ddd;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
    z-index: 99;
    margin-bottom: 30px;

    .header-title {
      display: flex;
      line-height: 1.5;

      img {
        width: 45px;
        margin-right: 10px;
      }

      &-text {
        display: flex;
        flex-direction: column;

        h2 {
          margin: 0;
          font-size: 20px;
          line-height: 1;
        }

        p {
          margin: 3px 0 0 0;
          color: #7a7a7a;
        }
      }
    }

    .header-actions {
      margin-left: auto;
    }

  }

  .eacf7-entries-filter {
    position: relative;
    margin-right: 24px;
    margin-bottom: 30px;
    display: flex;
    justify-content: flex-end;
    gap: 12px;

    &-filter {
      &-form {
        background: #fff;
        border-radius: 8px;
        box-shadow: 0 40px 64px -12px rgba(0, 0, 0, 0.08),
        0 0 14px -4px rgba(0, 0, 0, 0.08), 0 32px 48px -8px rgba(0, 0, 0, 0.1);
        margin-top: 20px;
        padding: 20px;
        position: absolute;
        right: 0;
        top: 100%;
        // width: 350px;
        z-index: 1024;
      }
    }
  }

  .eacf7-entries-summary {
    display: flex;
    gap: 24px;
    margin: 24px 24px 24px 0;

    .summary-item {
      position: relative;
      border-radius: 8px;
      background: #fff;
      box-shadow: 0 2px 3px 0 hsla(0deg, 0%, 51%, 0.1);
      padding: 20px;
      width: calc(50% - 10px);
      display: flex;
      align-items: center;
      gap: 18px;

      h3 {
        margin-top: 0;
        color: #A3AED0;
        margin-bottom: 10px;
      }

      p {
        color: #2B3674;
        font-size: 30px;
        font-weight: 700;
        line-height: 1;
        margin: 0;
      }

      i {
        &.icon {
          font-size: 90px;
          width: 90px;
          height: 90px;
          position: absolute;
          right: 0;
          bottom: 0;
          opacity: 0.5;
        }
      }
    }
  }

  .eacf7-entries-chart {
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 8px;
    box-shadow: 0 2px 3px 0 hsla(0, 0%, 51%, 0.1);
    padding: 24px;
    margin-right: 24px;
  }

  .eacf7-entries-table {
    margin-right: 20px;

    .eacf7-entries-table-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 20px 0;

      .entries-head-action {
        display: flex;
        gap: 10px;

        button {
          height: 35px;
        }
      }

      .components-select-control {
        &:focus-within {
          .components-input-control__backdrop {
            border-color: #1e62b9;
            box-shadow: 0 0 0.5px #1e62b9;
            outline: transparent solid 2px;
            outline-offset: -2px;
          }
        }

        .components-input-control__backdrop {
          border-color: #ddd;
        }
      }

      select {
        height: 35px;
      }
    }

    .eacf7-payment-icon {
      width: 35px;
    }

    .eacf7-status {
      border: 1px solid #eaeaea;
      padding: 6px 12px;
      background: #000;
      color: #fff;
      line-height: 1;
      border-radius: 10px;
      display: inline-block;

      &.pending {
        background: #fff3cd;
        color: #856404;
      }

      &.error {
        background-color: #f8d7da;
        color: #721c24;
      }

      &.completed {
        background-color: #d4edda;
        color: #155724;
      }

      &.cancelled {
        background-color: #e2e3e5;
        color: #383d41;
      }
    }

    .eacf7-expanded-data {
      padding: 25px;
      border-bottom: 1px solid rgba(0, 0, 0, 0.12);

      &-wrap {
        border: 1px solid #eaeaea;
        border-radius: 10px;
        padding: 20px;
        margin-bottom: 30px;

        h3 {
          margin: 0;
        }

        &:last-child {
          margin-bottom: 0;
        }
      }
    }

    .loading {
      height: calc(4px * 20);
      width: calc(4px * 20);
      padding: 24px;
      height: 50vh;
      display: block;
      margin: 10vh auto;
    }

    table {
      border-collapse: collapse;
      width: 100%;
      margin: 0;
      padding: 0;

      thead {
        padding: 15px;

        tr {
          border: 1px solid #ddd;

          td,
          th {
            font-size: 0.875rem;
            font-weight: 600;
            border: 1px solid #ddd;
            padding: 10px;
          }
        }
      }

      tbody {
        padding: 15px;

        tr {
          border: 1px solid #ddd;

          td,
          th {
            padding: 10px;
            border: 1px solid #ececec;
            font-size: 15px;
            word-break: break-all;
            white-space: normal;

            a {
              text-decoration: none;
            }

            &:nth-child(1) {
              text-transform: capitalize;
              width: 15%;
            }
          }
        }
      }
    }

    .rdt_TableCol {
      font-weight: 600;
      font-size: 0.875rem;
    }

    .rdt_Pagination {
      select {
        border: 1px solid #ddd;

        & + svg {
          display: none;
        }
      }
    }

    .rdt_ExpanderRow {
      margin-top: -1px;
    }
  }
}