@include export-module('co-save-cancel-buttons-layout') {
  .co-save-cancel-buttons {
    font-family: $tp-save-cancel-buttons-font-family;
    font-size: $tp-save-cancel-buttons-font-size;
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: $tp-save-cancel-buttons-z-index;
    .icon-wrapper {
      display: flex;
      align-items: center;
      justify-content: center;
      height: $tp-save-cancel-buttons-button-size;
      width: $tp-save-cancel-buttons-button-size;
      .co-icon {
        pointer-events: all;
        cursor: pointer;
        height: $tp-save-cancel-buttons-icon-size;
        width: $tp-save-cancel-buttons-icon-size;
      }
    }
    .co-button {
      height: $tp-save-cancel-buttons-button-size;
      pointer-events: all;
      cursor: pointer;
      font-size: $tp-save-cancel-buttons-font-size;
    }
    .save-cancel-buttons-wrapper {
      display: flex;
      border-radius: $tp-save-cancel-buttons-radius;
      background: $tp-save-cancel-buttons-background;
      column-gap: $tp-save-cancel-buttons-column-gap;
      padding: $tp-save-cancel-buttons-padding;
      &.movable {
        pointer-events: all;
      }
    }
  }
}
