@import "../global.less";

/* Font sizes */
@veui-option-font-size-xs: @veui-font-size-s;
@veui-option-font-size-s: @veui-font-size-s;
@veui-option-font-size-m: @veui-font-size-m;
@veui-option-font-size-l: @veui-font-size-l;

/* Metrics */
@veui-option-height-xs: @veui-height-unit * 6;
@veui-option-height-s: @veui-height-unit * 7;
@veui-option-height-m: @veui-height-unit * 8;
@veui-option-height-l: @veui-height-unit * 9;

@veui-option-padding-xs: @veui-option-padding-m;
@veui-option-padding-s: @veui-option-padding-m;
@veui-option-padding-m: @veui-padding-unit * 3;
@veui-option-padding-l: @veui-option-padding-m;

@veui-option-max-width-xs: veui-sum(40em, @veui-option-padding-xs * 2);
@veui-option-max-width-s: veui-sum(40em, @veui-option-padding-s * 2);
@veui-option-max-width-m: veui-sum(40em, @veui-option-padding-m * 2);
@veui-option-max-width-l: veui-sum(40em, @veui-option-padding-l * 2);

@veui-option-icon-size-aux: @veui-icon-size-aux;

// Space between checkboxes & labels, labels and carets
@veui-option-label-spacing-before: @veui-padding-unit * 2;
@veui-option-label-spacing-after: @veui-padding-unit * 3;

/* States */
@veui-option-font-color: @veui-font-color-normal;
@veui-option-font-color-hover: @veui-font-color-strong;
@veui-option-font-color-focus: @veui-option-font-color-hover;
@veui-option-font-color-active: @veui-option-font-color-hover;
@veui-option-font-color-disabled: @veui-font-color-disabled;
@veui-option-font-color-highlighted: @veui-color-brand-6;

@veui-option-icon-color-aux: @veui-icon-color-aux;
@veui-option-icon-color-aux-disabled: @veui-icon-color-aux-disabled;

@veui-option-font-color-selected: @veui-color-brand-6;

@veui-option-background-color: @veui-background-color-normal;
@veui-option-background-color-hover: @veui-background-color-normal-hover;
@veui-option-background-color-focus: @veui-color-brand-1;
@veui-option-background-color-active: @veui-background-color-normal-active;

@veui-option-background-color-selected-parent: @veui-background-color-normal-hover;

@veui-option-font-weight-selected-parent: @veui-font-weight-2;
@veui-option-font-weight-selected: @veui-font-weight-2;

/* Option group title */
@veui-option-group-label-line-height: @veui-line-height-m;
@veui-option-group-label-font-color: @veui-font-color-weak;
@veui-option-group-label-padding-y: @veui-padding-unit * 1;
@veui-option-group-padding-y-top: @veui-padding-unit * 1;
@veui-option-group-padding-y-bottom: @veui-padding-unit * 2;
@veui-option-group-separator-color: @veui-border-color-normal;

/* Option dropdown */
@veui-option-dropdown-max-height-xs: @veui-option-height-xs * 10 +
  @veui-option-group-padding-y-top + @veui-option-group-padding-y-bottom;
@veui-option-dropdown-max-height-s: @veui-option-height-s * 10 +
@veui-option-group-padding-y-top + @veui-option-group-padding-y-bottom;
@veui-option-dropdown-max-height-m: @veui-option-height-m * 10 +
@veui-option-group-padding-y-top + @veui-option-group-padding-y-bottom;
@veui-option-dropdown-max-height-l: @veui-option-height-l * 10 +
@veui-option-group-padding-y-top + @veui-option-group-padding-y-bottom;
@veui-option-dropdown-border-radius-xs: @veui-border-radius-s;
@veui-option-dropdown-border-radius-s: @veui-border-radius-s;
@veui-option-dropdown-border-radius-m: @veui-border-radius-m;
@veui-option-dropdown-border-radius-l: @veui-border-radius-l;
@veui-option-dropdown-target-spacing: @veui-padding-unit * 1;
@veui-option-dropdown-shadow: @veui-shadow;
@veui-option-dropdown-placeholder-padding-y-top: @veui-padding-unit * 2;
@veui-option-dropdown-placeholder-padding-y-bottom: @veui-padding-unit * 1;
@veui-option-dropdown-placeholder-font-color: @veui-font-color-weak;