[data-component-id="kackaamin:newsletter_archive_row"] {

  border-bottom: 1px solid var(--text-secondary);
  cursor: pointer;

  & td {
    padding: 28px 24px;
  }

  & .col-number,
  & a {
    color: var(--color-mist);
  }

  & .col-action {
    padding: 12px 16px;
    display: none;
  }

  & .btn {
    display: inline-block;
    padding: 16px 24px;
    text-decoration: none;
    border-radius: 20px 0 20px 0;
    display: flex;
    align-items: center;
  }

  & .btn:hover {
    color: var(--color-cedar);
    background: #415554;
  }

  @media (min-width: 768px) {
    cursor: auto;

    & .col-action {
      display: table-cell;
    }
  }
}

body:has(dialog[open]) {
  overflow: hidden;
}

.dialog-island[open] {
  width: 100vw;
  height: 100vh;
  max-width: 100dvw;
  max-height: 100dvh;
  z-index: 100;
  background: var(--color-forest);
  display: flex;
  justify-content: center;
  align-items: center;

  & .dialog-island__content {
    width: 100%;
    max-width: 353px;
    border-radius: 20px;
    padding: 24px 24px 16px 24px;
    margin: 0 20px;
    display: flex;
    flex-direction: column;
    background: var(--color-inlet);
  }
}

.dialog-island:not([open]) {
  display: none;
  z-index: -1;
}

.dialog-island {

  & .dialog-island__content {
    gap: 40px;

    & .dialog-archive-info {
      display: flex;
      flex-direction: column;
      gap: 4px;
      text-align: center;
      color: var(--color-driftwood);

      & .text-regular {
        font-weight: 600;
      }
    }

    & .dialog-archive-actions {
      display: flex;
      flex-direction: column;
      gap: 20px;

      & a {
        color: var(--color-black);
      }

      & button {
        color: var(--color-mist);
        padding: 8px 20px;
        outline: none;
        cursor: pointer;
      }
    }
  }
}