@use 'sass:math';

@import 'base-var';

$status-color-map: (
  success: use-rgb(green),
  warning: use-rgb(yellow),
  error: use-rgb(red),
  info: use-rgb(primary),
);

// input
$input-size: (
  large: (
    height: use-var(inline-height-l),
    font-size: use-var(font-size-l),
    line-height: use-var(line-height-l),
    icon-size: use-var(icon-size-l),
  ),
  medium: (
    height: use-var(inline-height-m),
    font-size: use-var(font-size-m),
    line-height: use-var(line-height-m),
    icon-size: use-var(icon-size-m),
  ),
  small: (
    height: use-var(inline-height-s),
    font-size: use-var(font-size-m),
    line-height: use-var(line-height-m),
    icon-size: use-var(icon-size-m),
  ),
  mini: (
    height: use-var(inline-height-xs),
    font-size: use-var(font-size-s),
    line-height: use-var(line-height-s),
    icon-size: use-var(icon-size-s),
  ),
);

// Table
$table-padding: 12px;
$table-row-min-height: 58px;
$table-cell-padding-v: 15px;
$table-cell-padding-h: 10px;

// Sort
$sort-indicator-color: use-text-color(placeholder);
$sort-indicator-color-active: use-text-color(secondary);
$sort-indicator-size: 4px;
$sort-indicator-margin: 4px;

// Tabs
$tab-label-padding-large: 16px 20px;
$tab-label-padding-medium: 12px 20px;
$tab-label-padding-small: 8px 16px;
$tab-label-font-size-large: use-var(font-size-xl);
$tab-label-font-size-medium: use-var(font-size-l);
$tab-label-font-size-small: use-var(font-size-m);
$tab-header-type-card-bg-color: use-rgb(n-9);
$tab-scroll-transition: all 0.3s cubic-bezier(0.35, 0, 0.25, 1);
$tab-pagination-button-z-index: 3;
$tab-label-z-index: 2;
$tab-active-indicator-z-index: 1;
$tab-label-focus-box-shadow: inset 0 0 0 3px use-rgba(primary, 0.3);
$tab-header-close-icon-size: 16px;
$tab-header-title-font-size: use-var(font-size-xxl);
$tab-header-title-spacing: 20px;
$tab-header-title-padding: 20px 0 12px;

// date picker
$date-picker-body-size: 216px;
$date-picker-seprator-gap: 20px;
$date-picker-row-gap: 8px;
$date-picker-cell-size: 24px;
$range-picker-body-width: 524px;
$range-picker-panel-spacing: 32px;
$range-picker-header-width: math.div(
  ($range-picker-body-width - $range-picker-panel-spacing),
  2
);