@use "../sizes" as *;

// adduse

$fluent-list-vertical-padding: 4px !default;
$fluent-list-item-margin-inline: 4px !default;
$fluent-list-bottom-padding: 4px !default;
$fluent-list-searchbox-margin-bottom: 4px !default;
$fluent-list-item-height: null !default;
$fluent-list-item-vertical-padding: null !default;
$fluent-list-item-horizontal-padding: null !default;
$fluent-list-item-gap: 2px !default;
$fluent-list-group-header-vertical-padding: null !default;
$fluent-list-next-button-horizontal-padding: null !default;

@if $size == "default" {
  $fluent-list-item-height: 32px !default;
  $fluent-list-item-vertical-padding: 6px !default;
  $fluent-list-item-horizontal-padding: 12px !default;
  $fluent-list-group-header-vertical-padding: 6px !default;
  $fluent-list-next-button-horizontal-padding: 32px !default;
}

@else if $size == "compact" {
  $fluent-list-item-height: 24px !default;
  $fluent-list-item-vertical-padding: 4px !default;
  $fluent-list-item-horizontal-padding: 8px !default;
  $fluent-list-group-header-vertical-padding: 8px !default;
  $fluent-list-next-button-horizontal-padding: 24px !default;
}

:root {
  --dx-list-item-padding-inline: #{$fluent-list-item-horizontal-padding};
  --dx-list-item-padding-block: #{$fluent-list-item-vertical-padding};
}