//
// Image Cropper
// --------------------------------------------------

@use 'sass:math';

.image-cropper {
  $size: $grid-unit-y * 50;

  &-container {
    height: $size;
    width: $size;
    position: relative;
    text-align: center;
    border-radius: $border-radius-base;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;

    @include themes(background-color, color-text-light);
  }

  &-icon {
    line-height: $size;
    font-size: ceil(math.div($size, 3));

    @include themes(color, color-text-default);
  }

  &-canvas {
    overflow: hidden;
    margin-top: 2px;
    width: $size - 4;
    height: $size - 4;

    @include themes(color, color-text-dark);
  }
}