@use "sass:color";
@use "colors" as *;
@use "../colors" as *;
@use "sizes" as *;
@use "../sizes" as *;
@use "../../base/icons" as *;
@use "../overlay/colors" as *;
@use "../toolbar/mixins" as *;
@use "../toolbar/sizes" as *;
@use "../typography/sizes" as *;
@use "../../base/popup";

// adduse
@use "../overlay";

$material-popup-toolbar-label-font-size: $material-m-font-size;

.dx-popup-wrapper {
  & > .dx-overlay-content {
    background: $overlay-content-bg;
    box-shadow: 0 11px 15px -7px color.change($base-shadow-color, $alpha: 0.2), 0 24px 38px 3px color.change($base-shadow-color, $alpha: 0.14), 0 9px 46px 8px color.change($base-shadow-color, $alpha: 0.12);
    border-radius: $popup-border-radius;
  }

  & > .dx-popup-fullscreen {
    border-radius: 0;
  }
}

.dx-popup-title {
  position: relative;
  padding: $material-popup-toolbartop-padding;
  min-height: 28px;
  border-bottom: 1px solid $popup-title-border-color;
  background: $popup-title-bg;
  color: $popup-title-color;

  &.dx-toolbar {
    @include dx-toolbar-sizing($material-popup-toolbar-height, $material-popup-toolbartop-padding, $material-popup-toolbar-label-font-size, $material-popup-toolbar-item-spacing );

    box-shadow: none;

    .dx-button.dx-closebutton {
      display: block;
    }
  }
}

.dx-popup-content {
  padding: $material-popup-content-padding;

  & > .dx-button {
    margin: $material-popup-button-margin;
  }
}

.dx-popup-bottom {
  background: $popup-bottom-bg;
  color: $popup-bottom-color;

  &.dx-toolbar {
    @include dx-toolbar-sizing(
      $material-popup-bottom-toolbar-height,
      $material-popup-toolbarbottom-padding,
      $material-popup-toolbar-label-font-size,
      $material-popup-toolbar-item-spacing
    );

    .dx-device-mobile & {
      @include dx-toolbar-sizing(
        $material-popup-bottom-toolbar-height,
        $material-popup-toolbarbottom-padding,
        $material-popup-toolbar-label-font-size,
        $material-popup-toolbar-item-spacing
      );
    }
  }
}

.dx-popup-content.dx-dialog-content {
  min-width: 220px - 2 * $material-popup-content-padding;
  padding: $material-popup-content-padding;
}

.dx-dialog-message {
  padding: 0;
}

.dx-rtl {
  .dx-popup-title {
    &.dx-toolbar {
      @include dx-toolbar-sizing(
        $material-toolbar-height,
        $material-popup-toolbartop-padding-rtl,
        $material-popup-toolbar-label-font-size,
        $material-popup-toolbar-item-spacing );
    }
  }

  .dx-popup-bottom {
    &.dx-toolbar {
      @include dx-toolbar-sizing(
        $material-popup-bottom-toolbar-height,
        $material-popup-toolbarbottom-padding-rtl,
        $material-popup-toolbar-label-font-size,
        $material-popup-toolbar-item-spacing
      );

      .dx-device-mobile & {
        @include dx-toolbar-sizing(
          $material-popup-bottom-toolbar-height,
          $material-popup-toolbarbottom-padding-rtl,
          $material-popup-toolbar-label-font-size,
          $material-popup-toolbar-item-spacing
        );
      }
    }
  }
}
