@use "sass:math";

@mixin dx-popover-arrow-size($width, $popover-arrow-offset: 0) {
  $sqrt-2: 1.4142;
  $popover-arrow-width: $width;
  $popover-arrow-height: math.div($popover-arrow-width, 2);

  .dx-popover-wrapper {
    .dx-popover-arrow::after {
      width: math.div($popover-arrow-width, $sqrt-2);
      height: math.div($popover-arrow-width, $sqrt-2);
    }

    &.dx-position-top,
    &.dx-position-bottom {
      .dx-popover-arrow {
        width: $popover-arrow-width;
        height: $popover-arrow-height + $popover-arrow-offset;
      }
    }

    &.dx-position-right,
    &.dx-position-left {
      .dx-popover-arrow {
        width: $popover-arrow-height + $popover-arrow-offset;
        height: $popover-arrow-width;
      }
    }
  }
}