@use 'ej2-base/styles/definition/fluent2' as *;
@forward 'ej2-base/styles/definition/fluent2';
$sd-offset: 16px !default;
$sd-ul-margin: 0 !default;
$sd-li-text-padding: 0 5px !default;

//Distance between vertical menu and button => Ul bottom padding + li bottom margin
//Distance between vertical menu item =>  li bottom margin + li top margin
//Horizontal padding for vertical menu => ((fab wdith - li icon width)/2) - 1 px (for icon border)
$sd-horz-ul-padding: 3px 5px !default;
$sd-vert-ul-padding: 5px 3px !default;
$sd-horz-li-margin: 0 5px !default;
$sd-vert-li-margin: 5px 0 !default;
$sd-li-text-margin: 0 16px !default;
$sd-li-text-height: 16px !default;
$sd-li-icon-height: 32px !default;
$sd-li-icon-width: 32px !default;
$sd-li-icon-border-radius: $radius-full !default;
$sd-li-icon-font-size: 12px !default;

$sd-small-horz-ul-padding: 2px 5px !default;
$sd-small-vert-ul-padding: 5px 2px !default;
$sd-small-horz-li-margin: 0 5px !default;
$sd-small-vert-li-margin: 5px 0 !default;
$sd-small-li-text-margin: 0 16px !default;
$sd-small-li-text-height: 16px !default;
$sd-small-li-icon-height: 26px !default;
$sd-small-li-icon-width: 26px !default;
$sd-small-li-icon-font-size: 12px !default;

$sd-bigger-horz-ul-padding: 5px 6px !default;
$sd-bigger-vert-ul-padding: 6px 5px !default;
$sd-bigger-horz-li-margin: 0 6px !default;
$sd-bigger-vert-li-margin: 6px 0 !default;
$sd-bigger-li-text-margin: 0 20px !default;
$sd-bigger-li-text-height: 20px !default;
$sd-bigger-li-icon-height: 40px !default;
$sd-bigger-li-icon-width: 40px !default;
$sd-bigger-li-icon-font-size: 14px !default;

$sd-bigger-small-horz-ul-padding: 5px 5px !default;
$sd-bigger-small-vert-ul-padding: 5px 5px !default;
$sd-bigger-small-horz-li-margin: 0 5px !default;
$sd-bigger-small-vert-li-margin: 5px 0 !default;
$sd-bigger-small-li-text-margin: 0 18px !default;
$sd-bigger-small-li-text-height: 20px !default;
$sd-bigger-small-li-icon-height: 36px !default;
$sd-bigger-small-li-icon-width: 36px !default;
$sd-bigger-small-li-icon-font-size: 14px !default;

$sd-overlay-bg: $white !default;
$sd-li-shadow: $shadow-lg !default;
$sd-li-bg: $secondary-bg-color !default;
$sd-li-border-color: $secondary-border-color !default;
$sd-font-color: $secondary-text-color !default;
$sd-disabled-li-bg: $secondary-bg-color-disabled !default;
$sd-disabled-li-border-color: $secondary-border-color-disabled !default;
$sd-disabled-font-color: $secondary-text-color-disabled !default;
$sd-focus-li-bg: $secondary-bg-color-focus !default;
$sd-focus-li-border-color: $secondary-border-color-focus !default;
$sd-focus-font-color: $secondary-text-color-focus !default;
$sd-focus-box-shadow: $sd-li-shadow !default;
$sd-hover-li-bg: $secondary-bg-color-hover !default;
$sd-hover-li-border-color: $secondary-border-color-hover !default;
$sd-hover-font-color: $secondary-text-color-hover !default;
$sd-active-li-bg: $secondary-bg-color-pressed !default;
$sd-active-li-border-color: $secondary-border-color-pressed !default;
$sd-active-font-color: $secondary-text-color-pressed !default;
$sd-li-text-border-radius: $radius-2 !default;
$sd-border-normal-width: 1px !default;
$sd-top-bottom-border-radius: $radius-full !default;
$sd-zero-padding-margin: 0 !default;
$spdl-text-border-radius: $radius-20 !default;
$spdl-text-font-size: 12px !default;
$spdl-text-line-height: 16px !default;
$spdl-text-padding: 8px 16px !default;
$spdl-border-width: 1px !default;