@layer components {
  /* Batch statement import table
  /* -------------------------------------------------------------------------- */

  .statement-import__parser {
    margin-block-end: 0;
    max-inline-size: var(--form-width, 32rem);
  }

  .statement-import__table {
    --table-min-inline-size: 44rem;
  }

  /* Long filenames are cut off; the full name is in the title attribute */
  .statement-import__filename {
    display: block;
    font-weight: 500;
    max-inline-size: 16rem;
  }

  .statement-import__status {
    font-size: var(--text-x-small);
    margin: 0;

    &:empty {
      display: none;
    }
  }

  /* One button toggles edit mode: a pencil to start, a check to finish */
  .statement-import__edit {
    &[aria-pressed="true"] .icon--pencil,
    &[aria-pressed="false"] .icon--check {
      display: none;
    }
  }
}