@layer components {
  /* Generated Documents component */

  .generated-documents {
    width: 80%;
    margin-inline: auto;
  }

  .generated-documents__back {
    display: flex;
    justify-content: flex-start;
    margin-block-start: var(--space-sm);
  }

  .generated-documents__info {
    margin-block-start: var(--space-xs);
  }

  .generated-documents__note {
    margin-block-start: var(--space-sm);
  }

  .generated-documents__table {
    margin: 0;
    table-layout: fixed;
  }

  .generated-documents__table th:nth-child(1) {
    width: 60%;
  }

  .generated-documents__table th:nth-child(2) {
    width: 20%;
  }

  .generated-documents__table th:nth-child(3) {
    width: 12%;
  }

  .generated-documents__table th:nth-child(4) {
    width: 8%;
  }

  .generated-documents__pagination {
    margin-block: var(--space-sm) var(--space-md);
  }

  /* Toast notification */
  .toast {
    position: fixed;
    inset-inline-end: var(--space-md);
    inset-block-end: var(--space-md);
    z-index: var(--z-notification);
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.25s ease;
  }

  .toast--visible {
    opacity: 1;
    transform: none;
  }

  .toast__inner {
    background-color: oklch(var(--lch-ink-darkest));
    color: var(--color-text-inverse);
    padding: var(--space-xs) var(--space-sm);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
  }

  .toast__inner a {
    color: var(--color-text-inverse);
    text-decoration: underline;
  }
}