@use "sass:color";
@use "../colors" as *;
@use "../sizes" as *;

// adduse

$material-popup-content-padding: null !default;
$material-popup-content-withtitle-top-padding: null !default;
$material-popup-toolbar-horizontal-padding: null !default;
$material-popup-bottom-toolbar-height: null !default;
$material-popup-toolbar-height: null !default;

$material-popup-button-margin: 0 8px !default;
$material-popup-toolbar-item-spacing: 8px !default;
$material-popup-overlay-content-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) !default;
$material-popup-focused-content-shadow: 0 8px 40px 6px color.change($base-shadow-color, $alpha: 0.4) !default;

@if $size == "default" {
  $material-popup-content-padding: 24px !default;
  $material-popup-content-withtitle-top-padding: 20px !default;

  $material-popup-toolbar-horizontal-padding: 24px !default;
  $material-popup-bottom-toolbar-height: 52px !default;
  $material-popup-toolbar-height: 64px !default;
}

@else if $size == "compact" {
  $material-popup-content-padding: 16px !default;
  $material-popup-content-withtitle-top-padding: 14px !default;

  $material-popup-toolbar-horizontal-padding: 16px !default;
  $material-popup-bottom-toolbar-height: 44px !default;
  $material-popup-toolbar-height: 42px !default;
}

:root {
  --dx-popup-toolbar-item-padding-inline: #{$material-popup-toolbar-item-spacing};
}