@include export-module('cc-additional-file-button-layout') {
  .co-additional-file-button {
    .additional-file-button-wrapper {
      height: $sc-co-signature-button-height;
      width: $sc-co-signature-button-width;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: $sc-co-signature-button-background-color;
      border-radius: $sc-co-signature-button-border-radius;
      cursor: pointer;
      border: 1px solid $sc-co-signature-button-selected-background-color;
      .co-icon {
        width: 28px; //wrong icon with whitespace
        height: 28px; //wrong icon with whitespace
        svg {
          fill: $sc-co-signature-button-selected-background-color;
        }
      }
      &.selected {
        background-color: $sc-co-signature-button-selected-background-color;
        .co-icon {
          svg { // for fontawesome icons
            fill: $sc-co-signature-button-icon-selected-color;
          }
          & [fill] { // for own icons
            fill: $sc-co-signature-button-icon-selected-color;
          }
        }
      }
    }
  }
}
