@import '../../../../../scss/styles.scss';

@layer payload-default {
  .file {
    display: flex;
    flex-wrap: nowrap;

    &__thumbnail {
      display: inline-block;
      max-width: calc(var(--base) * 2);
      height: calc(var(--base) * 2);
      border-radius: var(--style-radius-s);
    }

    &__filename {
      align-self: center;
      [dir='ltr'] & {
        margin-left: var(--base);
      }
      [dir='rtl'] & {
        margin-right: var(--base);
      }
    }
  }
}