@use 'palette.tokens';
@use 'spacing.tokens';
@use 'typography.tokens';

//=====================================
// COLORS
//=====================================

// Background checkbox/radio
$color-background-toggle-selected: palette.$color-primary-regular !default;
$color-background-toggle-indeterminate: palette.$color-primary-regular !default;
$color-background-toggle-selected-hover: palette.$color-primary-strong !default;
$color-background-toggle-disabled: palette.$color-neutral-lightest !default;
$color-background-toggle-unselected-disabled: palette.$color-neutral-lightest !default;

$background-radio-group-odd-item: palette.$color-neutral-lightest !default;
$background-radio-group-even-item: palette.$color-light-stronger !default;
$background-radio-group-hover-item: palette.$color-neutral-lighter !default;

// Background toggle
$color-background-toggle-button: palette.$color-light-stronger !default;
$color-background-toggle-slider: palette.$color-neutral-lighter !default;
$color-background-toggle-slider-selected: palette.$color-primary-regular !default;
$color-background-toggle-slider-selected-hover: palette.$color-primary-strong !default;
$color-background-toggle-slider-disabled: palette.$color-neutral-light !default;
$color-background-toggle-button-disabled: palette.$color-neutral-lighter !default;

// Optional toggle container
$background-toggle-container: palette.$color-neutral-lightest !default;
$background-toggle-container-hover: palette.$color-neutral-lighter !default;
$background-toggle-container-hover-slider: palette.$color-neutral-light !default;
$border-toggle-container: spacing.$border-radius-container !default;

// Border
$color-border-toggle-selected: $color-background-toggle-selected !default;
$color-border-toggle-indeterminate: $color-background-toggle-selected !default;
$color-border-toggle-selected-hover: $color-background-toggle-selected-hover !default;
$color-border-toggle-selected-disabled: $color-background-toggle-disabled !default;

$color-border-toggle-unselected: palette.$color-neutral-light !default;
$color-border-toggle-unselected-hover: palette.$color-dark-stronger !default;
$color-border-toggle-unselected-disabled: palette.$color-neutral-light !default;

// Check
$color-check-toggle: #fff !default;
$color-check-toggle-indeterminate: #fff !default;
$color-check-toggle-disabled: #c4c4c4 !default;

//=====================================
// SPACING
//=====================================
$size-toggle-checkbox: calc(#{spacing.rhythm(2)} - #{spacing.rhythm(0.25)}) !default;
$gap-radio-group: spacing.rhythm(1) !default;

$height-toggle: spacing.rhythm(3) !default;
$width-toggle: spacing.rhythm(6) !default;
$padding-toggle-slider: spacing.rhythm(0.25) !default;
$margin-toggle-container: 0 !default;
$margin-top-toggle-with-help-label: -#{spacing.rhythm(0.5)} !default;

//=====================================
// TYPOGRAPHY
//=====================================
$font-size-checkbox-label: typography.font-size(s);
$line-height-checkbox-label: typography.line-height(m);