@use "sass:color";
@use "colors" as *;
@use "../colors" as *;
@use "sizes" as *;
@use "../sizes" as *;
@use "../../base/icon_fonts" as *;
@use "../overlay/colors" as *;
@use "../toolbar/mixins" as *;
@use "../toolbar/sizes" as *;
@use "../button/mixins" as *;
@use "../typography/sizes" as *;
@use "../../base/popup";

// adduse
@use "../overlay";


$generic-popup-toolbar-height: $generic-base-inline-widget-height;
$generic-popup-toolbar-label-font-size: $generic-m-font-size;


.dx-popup-wrapper {
  & > .dx-overlay-content {
    border: 1px solid $overlay-border-color;
    background: $overlay-content-bg;
    box-shadow: 0 6px 12px $overlay-content-shadow-color;
    border-radius: $popup-border-radius;
  }

  & > .dx-popup-fullscreen {
    border-radius: 0;
  }

  .dx-state-focused {
    &.dx-overlay-content {
      border: 1px solid $base-accent;
    }
  }
}

.dx-popup-title {
  position: relative;
  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(
      $generic-popup-toolbar-height,
      $generic-popup-toolbartop-padding,
      $generic-popup-toolbar-label-font-size,
      $generic-popup-toolbar-item-spacing
    );

    .dx-closebutton {
      position: relative;
      inset-inline-start: $generic-popup-closebutton-offset;
    }
  }
}

.dx-popup-content {
  padding: $generic-popup-content-padding;

  & > .dx-button {
    margin: $generic-popup-button-margin;
  }
}

.dx-popup-bottom {
  background: $popup-bottom-bg;
  color: $popup-bottom-color;

  &.dx-toolbar {
    @include dx-toolbar-sizing(
      $generic-popup-toolbar-height,
      $generic-popup-toolbarbottom-padding,
      $generic-popup-toolbar-label-font-size,
      $generic-popup-toolbar-item-spacing
    );
  }

  .dx-button {
    min-width: 100px;
  }
}

.dx-popup-content.dx-dialog-content {
  min-width: 220px - 2 * $generic-popup-content-padding;
  padding: $generic-popup-content-padding;
}

.dx-dialog-message {
  padding: 0;
}
