@use 'palette';
@use '../tools/functions' as *;

$surface: () !default;
$surface: map-deep-merge(
  (
    light: (
      surface: var(--sd-palette-shades-white),
      surface-overlay: var(--sd-palette-gray-100),
      surface-inset: var(--sd-palette-gray-25),
      surface-subtle: var(--sd-palette-gray-50),
      surface-disabled: var(--sd-palette-gray-50),
  
      surface-border: var(--sd-palette-gray-300),
      surface-border-muted: var(--sd-palette-gray-200),
      surface-border-subtle: var(--sd-palette-gray-100),
  
      on-surface: var(--sd-palette-gray-600),
      on-surface-emphasis: var(--sd-palette-gray-700),
      on-surface-emphasis-variant: var(--sd-palette-gray-900),
      on-surface-muted: var(--sd-palette-gray-500),
      on-surface-subtle: var(--sd-palette-gray-400),
  
      on-surface-accent: var(--sd-palette-primary-600),
      on-surface-accent-emphasis: var(--sd-palette-primary-700),
      on-surface-accent-emphasis-variant: var(--sd-palette-primary-800),
      on-surface-accent-muted: var(--sd-palette-primary-500),
      on-surface-accent-subtle: var(--sd-palette-primary-400),

      on-surface-accent-border: convert-hex-to-rgba(palette.$primary, light, 500, .4),
      on-surface-accent-outline: convert-hex-to-rgba(palette.$primary, light, 500, .15),
    ),
    dark: (
      surface: var(--sd-palette-gray-800),
      surface-overlay: var(--sd-palette-gray-700),
      surface-inset: var(--sd-palette-gray-900),
      surface-subtle: var(--sd-palette-gray-600),
  
      surface-border: var(--sd-palette-gray-600),
      surface-border-muted: var(--sd-palette-gray-500),
      surface-border-subtle: var(--sd-palette-gray-700),
  
      on-surface: var(--sd-palette-gray-50),
      on-surface-emphasis: var(--sd-palette-gray-25),
      on-surface-emphasis-variant: var(--sd-palette-shades-white),
      on-surface-muted: var(--sd-palette-gray-100),
      on-surface-subtle: var(--sd-palette-gray-200),
  
      on-surface-accent: var(--sd-palette-primary-500),
      on-surface-accent-emphasis: var(--sd-palette-primary-600),
      on-surface-accent-emphasis-variant: var(--sd-palette-primary-700),
      on-surface-accent-muted: var(--sd-palette-primary-400),
      on-surface-accent-subtle: var(--sd-palette-primary-300),
      
      on-surface-accent-border: convert-hex-to-rgba(palette.$primary, dark, 500, .4),
      on-surface-accent-outline: convert-hex-to-rgba(palette.$primary, dark, 500, .15),
    )
  ),
  $surface
);

$primary: () !default;
$primary: map-deep-merge(
  (
    light: (
      primary: var(--sd-palette-primary-600),
      primary-overlay: var(--sd-palette-primary-500),
      primary-inset: var(--sd-palette-primary-700),
      primary-subtle: var(--sd-palette-primary-25),

      primary-border: convert-hex-to-rgba(palette.$primary, light, 500, .4),
      primary-border-muted: convert-hex-to-rgba(palette.$primary, light, 400, .4),
      primary-border-subtle: convert-hex-to-rgba(palette.$primary, light, 300, .4),
      primary-outline: convert-hex-to-rgba(palette.$primary, light, 500, .15),

      on-primary: var(--sd-palette-shades-white),
      on-primary-overlay: var(--sd-palette-shades-white),
      on-primary-inset: var(--sd-palette-primary-800),
      on-primary-subtle: var(--sd-palette-primary-700),
    ),
    dark: (
      primary: var(--sd-palette-primary-600),
      primary-overlay: var(--sd-palette-primary-500),
      primary-inset: var(--sd-palette-primary-700),
      primary-subtle: convert-hex-to-rgba(palette.$primary, dark, 500, .15),

      primary-border: convert-hex-to-rgba(palette.$primary, dark, 500, .4),
      primary-border-muted: convert-hex-to-rgba(palette.$primary, dark, 400, .4),
      primary-border-subtle: convert-hex-to-rgba(palette.$primary, dark, 300, .4),
      primary-outline: convert-hex-to-rgba(palette.$primary, dark, 500, .15),

      on-primary: var(--sd-palette-shades-white),
      on-primary-overlay: var(--sd-palette-shades-white),
      on-primary-inset: var(--sd-palette-primary-800),
      on-primary-subtle: var(--sd-palette-primary-700),
    )
  ),
  $primary
);

$secondary: () !default;
$secondary: map-deep-merge(
  (
    light: (
      secondary: var(--sd-palette-secondary-600),
      secondary-overlay: var(--sd-palette-secondary-500),
      secondary-inset: var(--sd-palette-secondary-700),
      secondary-subtle: var(--sd-palette-secondary-25),

      secondary-border: convert-hex-to-rgba(palette.$secondary, dark, 500, .4),
      secondary-border-muted: convert-hex-to-rgba(palette.$secondary, dark, 400, .4),
      secondary-border-subtle: convert-hex-to-rgba(palette.$secondary, dark, 300, .4),
      secondary-outline: convert-hex-to-rgba(palette.$secondary, dark, 500, .15),

      on-secondary: var(--sd-palette-shades-white),
      on-secondary-overlay: var(--sd-palette-shades-white),
      on-secondary-inset: var(--sd-palette-secondary-800),
      on-secondary-subtle: var(--sd-palette-secondary-700),
    ),
    dark: (
      secondary: var(--sd-palette-secondary-600),
      secondary-overlay: var(--sd-palette-secondary-500),
      secondary-inset: var(--sd-palette-secondary-700),
      secondary-subtle: convert-hex-to-rgba(palette.$secondary, dark, 500, .15),

      secondary-border: convert-hex-to-rgba(palette.$secondary, dark, 500, .4),
      secondary-border-muted: convert-hex-to-rgba(palette.$secondary, dark, 400, .4),
      secondary-border-subtle: convert-hex-to-rgba(palette.$secondary, dark, 300, .4),
      secondary-outline: convert-hex-to-rgba(palette.$secondary, dark, 500, .15),

      on-secondary: var(--sd-palette-shades-white),
      on-secondary-overlay: var(--sd-palette-shades-white),
      on-secondary-inset: var(--sd-palette-secondary-800),
      on-secondary-subtle: var(--sd-palette-secondary-700),
    )
  ),
  $secondary
);

$info: () !default;
$info: map-deep-merge(
  (
    light: (
      info: var(--sd-palette-info-600),
      info-overlay: var(--sd-palette-info-500),
      info-inset: var(--sd-palette-info-700),
      info-subtle: var(--sd-palette-info-25),

      info-border: convert-hex-to-rgba(palette.$info, dark, 500, .4),
      info-border-muted: convert-hex-to-rgba(palette.$info, dark, 400, .4),
      info-border-subtle: convert-hex-to-rgba(palette.$info, dark, 300, .4),
      info-outline: convert-hex-to-rgba(palette.$info, dark, 500, .15),

      on-info: var(--sd-palette-shades-white),
      on-info-overlay: var(--sd-palette-shades-white),
      on-info-inset: var(--sd-palette-info-800),
      on-info-subtle: var(--sd-palette-info-700),
    ),
    dark: (
      info: var(--sd-palette-info-600),
      info-overlay: var(--sd-palette-info-500),
      info-inset: var(--sd-palette-info-700),
      info-subtle: convert-hex-to-rgba(palette.$info, dark, 500, .15),

      info-border: convert-hex-to-rgba(palette.$info, dark, 500, .4),
      info-border-muted: convert-hex-to-rgba(palette.$info, dark, 400, .4),
      info-border-subtle: convert-hex-to-rgba(palette.$info, dark, 300, .4),
      info-outline: convert-hex-to-rgba(palette.$info, dark, 500, .15),

      on-info: var(--sd-palette-shades-white),
      on-info-overlay: var(--sd-palette-shades-white),
      on-info-inset: var(--sd-palette-info-800),
      on-info-subtle: var(--sd-palette-info-700),
    )
  ),
  $info
);

$success: () !default;
$success: map-deep-merge(
  (
    light: (
      success: var(--sd-palette-success-600),
      success-overlay: var(--sd-palette-success-500),
      success-inset: var(--sd-palette-success-700),
      success-subtle: var(--sd-palette-success-25),

      success-border: convert-hex-to-rgba(palette.$success, dark, 500, .4),
      success-border-muted: convert-hex-to-rgba(palette.$success, dark, 400, .4),
      success-border-subtle: convert-hex-to-rgba(palette.$success, dark, 300, .4),
      success-outline: convert-hex-to-rgba(palette.$success, dark, 500, .15),

      on-success: var(--sd-palette-shades-white),
      on-success-overlay: var(--sd-palette-shades-white),
      on-success-inset: var(--sd-palette-success-800),
      on-success-subtle: var(--sd-palette-success-700),
    ),
    dark: (
      success: var(--sd-palette-success-600),
      success-overlay: var(--sd-palette-success-500),
      success-inset: var(--sd-palette-success-700),
      success-subtle: convert-hex-to-rgba(palette.$success, dark, 500, .15),

      success-border: convert-hex-to-rgba(palette.$success, dark, 500, .4),
      success-border-muted: convert-hex-to-rgba(palette.$success, dark, 400, .4),
      success-border-subtle: convert-hex-to-rgba(palette.$success, dark, 300, .4),
      success-outline: convert-hex-to-rgba(palette.$success, dark, 500, .15),

      on-success: var(--sd-palette-shades-white),
      on-success-overlay: var(--sd-palette-shades-white),
      on-success-inset: var(--sd-palette-success-800),
      on-success-subtle: var(--sd-palette-success-700),
    )
  ),
  $success
);

$warning: () !default;
$warning: map-deep-merge(
  (
    light: (
      warning: var(--sd-palette-warning-600),
      warning-overlay: var(--sd-palette-warning-500),
      warning-inset: var(--sd-palette-warning-700),
      warning-subtle: var(--sd-palette-warning-25),

      warning-border: convert-hex-to-rgba(palette.$warning, dark, 500, .4),
      warning-border-muted: convert-hex-to-rgba(palette.$warning, dark, 400, .4),
      warning-border-subtle: convert-hex-to-rgba(palette.$warning, dark, 300, .4),
      warning-outline: convert-hex-to-rgba(palette.$warning, dark, 500, .15),

      on-warning: var(--sd-palette-shades-white),
      on-warning-overlay: var(--sd-palette-shades-white),
      on-warning-inset: var(--sd-palette-warning-800),
      on-warning-subtle: var(--sd-palette-warning-700),
    ),
    dark: (
      warning: var(--sd-palette-warning-600),
      warning-overlay: var(--sd-palette-warning-500),
      warning-inset: var(--sd-palette-warning-700),
      warning-subtle: convert-hex-to-rgba(palette.$warning, dark, 500, .15),

      warning-border: convert-hex-to-rgba(palette.$warning, dark, 500, .4),
      warning-border-muted: convert-hex-to-rgba(palette.$warning, dark, 400, .4),
      warning-border-subtle: convert-hex-to-rgba(palette.$warning, dark, 300, .4),
      warning-outline: convert-hex-to-rgba(palette.$warning, dark, 500, .15),

      on-warning: var(--sd-palette-shades-white),
      on-warning-overlay: var(--sd-palette-shades-white),
      on-warning-inset: var(--sd-palette-warning-800),
      on-warning-subtle: var(--sd-palette-warning-700),
    )
  ),
  $warning
);

$danger: () !default;
$danger: map-deep-merge(
  (
    light: (
      danger: var(--sd-palette-danger-600),
      danger-overlay: var(--sd-palette-danger-500),
      danger-inset: var(--sd-palette-danger-700),
      danger-subtle: var(--sd-palette-danger-25),

      danger-border: convert-hex-to-rgba(palette.$danger, dark, 500, .4),
      danger-border-muted: convert-hex-to-rgba(palette.$danger, dark, 400, .4),
      danger-border-subtle: convert-hex-to-rgba(palette.$danger, dark, 300, .4),
      danger-outline: convert-hex-to-rgba(palette.$danger, dark, 500, .15),

      on-danger: var(--sd-palette-shades-white),
      on-danger-overlay: var(--sd-palette-shades-white),
      on-danger-inset: var(--sd-palette-danger-800),
      on-danger-subtle: var(--sd-palette-danger-700),
    ),
    dark: (
      danger: var(--sd-palette-danger-600),
      danger-overlay: var(--sd-palette-danger-500),
      danger-inset: var(--sd-palette-danger-700),
      danger-subtle: convert-hex-to-rgba(palette.$danger, dark, 500, .15),

      danger-border: convert-hex-to-rgba(palette.$danger, dark, 500, .4),
      danger-border-muted: convert-hex-to-rgba(palette.$danger, dark, 400, .4),
      danger-border-subtle: convert-hex-to-rgba(palette.$danger, dark, 300, .4),
      danger-outline: convert-hex-to-rgba(palette.$danger, dark, 500, .15),

      on-danger: var(--sd-palette-shades-white),
      on-danger-overlay: var(--sd-palette-shades-white),
      on-danger-inset: var(--sd-palette-danger-800),
      on-danger-subtle: var(--sd-palette-danger-700),
    )
  ),
  $danger
);

$gray: () !default;
$gray: map-deep-merge(
  (
    light: (
      gray: var(--sd-palette-gray-600),
      gray-overlay: var(--sd-palette-gray-500),
      gray-inset: var(--sd-palette-gray-700),
      gray-subtle: var(--sd-palette-gray-25),

      gray-border: convert-hex-to-rgba(palette.$gray, dark, 500, .4),
      gray-border-muted: convert-hex-to-rgba(palette.$gray, dark, 400, .4),
      gray-border-subtle: convert-hex-to-rgba(palette.$gray, dark, 300, .4),
      gray-outline: convert-hex-to-rgba(palette.$gray, dark, 500, .15),

      on-gray: var(--sd-palette-shades-white),
      on-gray-overlay: var(--sd-palette-shades-white),
      on-gray-inset: var(--sd-palette-gray-800),
      on-gray-subtle: var(--sd-palette-gray-700),
    ),
    dark: (
      gray: var(--sd-palette-gray-600),
      gray-overlay: var(--sd-palette-gray-500),
      gray-inset: var(--sd-palette-gray-700),
      gray-subtle: convert-hex-to-rgba(palette.$gray, dark, 500, .15),

      gray-border: convert-hex-to-rgba(palette.$gray, dark, 500, .4),
      gray-border-muted: convert-hex-to-rgba(palette.$gray, dark, 400, .4),
      gray-border-subtle: convert-hex-to-rgba(palette.$gray, dark, 300, .4),
      gray-outline: convert-hex-to-rgba(palette.$gray, dark, 500, .15),

      on-gray: var(--sd-palette-shades-white),
      on-gray-overlay: var(--sd-palette-shades-white),
      on-gray-inset: var(--sd-palette-gray-800),
      on-gray-subtle: var(--sd-palette-gray-700),
    )
  ),
  $gray
);

$color-packs: () !default;
$color-packs: map-deep-merge(
  (
    'surface': $surface,
    'primary': $primary,
    'secondary': $secondary,
    'info': $info,
    'success': $success,
    'warning': $warning,
    'danger': $danger,
    'gray': $gray
  ),
  $color-packs
);