@use '@syncfusion/react-base/styles/themes/variables' as *;

$hscroll-nav-width: $spacing-40 !default;
$hscroll-nav-height: $spacing-56 !default;
$hscroll-padding: $spacing-0 $hscroll-nav-width !default;
$hscroll-arrow-font-size: $font-size-xl !default;
$hscroll-arrow-icon-color: rgba($icon-color) !default;
$hscroll-inline-distance: $spacing-0 !default;

$hscroll-bg: $transparent !default;
$hscroll-bg-hover: $content-bg-color-hover !default;
$hscroll-bg-focus: $content-bg-color-focus !default;
$hscroll-bg-pressed: $content-bg-color-pressed !default;

$hscroll-border-width: 1px !default;
$hscroll-border-style: solid !default;
$hscroll-border-color: rgba($border-light) !default;