@use 'sass:list';
@use 'sass:map';
$pkt-colors: (
  // Blue
  brand-blue-100: #f1fdff,
  brand-blue-200: #e5fcff,
  brand-blue-300: #d1f9ff,
  brand-blue-500: #b3f5ff,
  brand-blue-1000: #6fe9ff,
  brand-dark-blue-700: #6a698b,
  brand-dark-blue-1000: #2a2859,
  brand-warm-blue-1000: #1f42aa,
  // Green
  brand-green-400: #c7fde9,
  brand-green-1000: #43f8b6,
  brand-light-green-400: #e5ffe6,
  brand-light-green-1000: #c7f6c9,
  brand-dark-green-1000: #034b45,

  // Yellow
  brand-yellow-1000: #f9c66b,
  brand-yellow-500: #ffe7bc,

  // Red
  brand-red-100: #fff2f1,
  brand-red-400: #ffdfdc,
  brand-red-600: #ffb4ac,
  brand-red-1000: #ff8274,

  // Beige
  brand-light-beige-1000: #f8f0dd,
  brand-dark-beige-1000: #d0bfae,

  // Neutrals
  brand-neutrals-white: #ffffff,
  brand-neutrals-50: #f9f9f9,
  brand-neutrals-100: #f2f2f2,
  brand-neutrals-200: #e6e6e6,
  brand-neutrals-300: #cccccc,
  brand-neutrals-400: #b3b3b3,
  brand-neutrals-500: #9a9a9a,
  brand-neutrals-600: #808080,
  brand-neutrals-700: #666666,
  brand-neutrals-800: #4d4d4d,
  brand-neutrals-900: #333333,
  brand-neutrals-1000: #2c2c2c,
  brand-neutrals-black: #000000,
  brand-neutrals-transparent: transparent,

  // Purple
  brand-purple-1000: #e0adff,

  // Grays — deprecated, bruk brand-neutrals-*
  grays-gray-100: #e6e6e6,
  // brand-neutrals-200
  grays-gray-200: #cccccc,
  // brand-neutrals-300
  grays-gray-300: #b3b3b3,
  // brand-neutrals-400
  grays-gray-400: #9a9a9a,
  // brand-neutrals-500
  grays-gray-500: #808080,
  // brand-neutrals-600
  grays-gray-600: #666666,
  // brand-neutrals-700
  grays-gray-700: #4d4d4d,
  // brand-neutrals-800
  grays-gray-800: #333333,
  // brand-neutrals-900
  grays-gray-900: #1a1a1a,
  // utgår
  grays-gray-1000: #2c2c2c // brand-neutrals-1000
) !default;

// Kilden for semantiske farger: (lys, mørk)-par av navn fra $pkt-colors.
// Mørk verdi er null når tokenet skal være identisk i begge moduser.
// Legg til nye tokens her, så både lys og mørk blir bestemt samtidig.
$pkt-semantic-color-modes: (
  // Background
  background-card: (brand-neutrals-white, brand-neutrals-1000),
  background-default: (brand-neutrals-white, brand-neutrals-1000),
  background-subtle: (brand-neutrals-50, brand-neutrals-900),
  background-transparent: (brand-neutrals-transparent, null),
  // Borders
  border-default: (brand-dark-blue-1000, brand-neutrals-200),
  border-beige: (brand-dark-beige-1000, null),
  border-blue: (brand-blue-1000, null),
  border-gray: (brand-neutrals-300, null),
  border-green: (brand-green-1000, null),
  border-light-beige: (brand-light-beige-1000, null),
  border-red: (brand-red-1000, null),
  border-subtle: (brand-neutrals-100, brand-neutrals-800),
  border-yellow: (brand-yellow-1000, null),
  border-states-active: (brand-warm-blue-1000, brand-blue-500),
  border-states-disabled: (brand-neutrals-300, brand-neutrals-700),
  border-states-focus: (brand-purple-1000, null),
  border-states-hover: (brand-warm-blue-1000, brand-blue-500),
  // Surface
  surface-default-default: (brand-neutrals-100, brand-neutrals-900),
  surface-default-faded-green: (brand-light-green-400, null),
  surface-default-faded-red: (brand-red-400, null),
  surface-default-gray: (brand-neutrals-100, null),
  surface-default-light-beige: (brand-light-beige-1000, null),
  surface-default-light-blue: (brand-blue-500, null),
  surface-default-light-green: (brand-green-400, null),
  surface-default-pale-blue: (brand-blue-300, null),
  surface-default-red: (brand-red-600, null),
  surface-default-yellow: (brand-yellow-500, null),
  surface-strong-beige: (brand-dark-beige-1000, null),
  surface-strong-blue: (brand-blue-1000, null),
  surface-strong-dark-blue: (brand-dark-blue-1000, null),
  surface-strong-dark-green: (brand-dark-green-1000, null),
  surface-strong-default: (brand-neutrals-200, brand-neutrals-800),
  surface-strong-gray: (brand-neutrals-200, null),
  surface-strong-green: (brand-green-1000, null),
  surface-strong-light-green: (brand-light-green-1000, null),
  surface-strong-red: (brand-red-1000, null),
  surface-strong-yellow: (brand-yellow-1000, null),
  surface-subtle-default: (brand-neutrals-white, brand-neutrals-1000),
  surface-subtle-light-blue: (brand-blue-200, null),
  surface-subtle-light-red: (brand-red-100, null),
  surface-subtle-gray: (brand-neutrals-50, null),
  surface-subtle-pale-blue: (brand-blue-100, null),
  surface-subtle-white: (brand-neutrals-white, null),
  // Text
  text-body-dark: (brand-dark-blue-1000, null),
  text-body-default: (brand-dark-blue-1000, brand-neutrals-200),
  text-body-light: (brand-neutrals-white, brand-neutrals-200),
  text-placeholder: (brand-neutrals-700, brand-neutrals-500),
  text-action-disabled: (brand-neutrals-400, brand-neutrals-600),
  text-action-active: (brand-warm-blue-1000, brand-blue-500),
  text-action-hover: (brand-warm-blue-1000, brand-blue-500),
  text-action-normal: (brand-dark-blue-1000, brand-neutrals-200),
  // Input (shared)
  input-background-normal: (brand-neutrals-white, brand-neutrals-1000),
  input-background-disabled: (brand-neutrals-50, brand-neutrals-900),
  input-background-open: (brand-warm-blue-1000, brand-blue-500),
  input-border-active: (brand-warm-blue-1000, brand-blue-500),
  input-border-disabled: (brand-neutrals-300, brand-neutrals-700),
  input-border-error: (brand-red-1000, null),
  input-border-hover: (brand-warm-blue-1000, brand-blue-500),
  input-border-normal: (brand-dark-blue-1000, brand-neutrals-200),
  input-text-active: (brand-warm-blue-1000, brand-blue-500),
  input-text-disabled: (brand-neutrals-400, brand-neutrals-600),
  input-text-hover: (brand-warm-blue-1000, brand-blue-500),
  input-text-normal: (brand-dark-blue-1000, brand-neutrals-200),
  input-text-error: (brand-red-1000, null),
  input-text-open: (brand-neutrals-white, brand-dark-blue-1000),
  // Tag
  tag-text-normal: (brand-dark-blue-1000, null),
  tag-text-hover: (brand-warm-blue-1000, brand-dark-blue-1000),
  tag-text-active: (brand-warm-blue-1000, brand-dark-blue-1000),
  tag-text-focus: (brand-warm-blue-1000, brand-dark-blue-1000),
  // Input - Checkbox/Radio specific
  input-check-background: (brand-neutrals-white, brand-neutrals-1000),
  input-check-border: (brand-dark-blue-1000, brand-neutrals-200),
  input-check-text-active: (brand-warm-blue-1000, brand-blue-500),
  input-check-text-hover: (brand-warm-blue-1000, brand-blue-500),
  // Spinner
  spinner-border-normal: (brand-neutrals-200, brand-neutrals-800),
  spinner-border-blue: (brand-dark-blue-1000, brand-neutrals-white),
  spinner-border-rainbow: (brand-blue-1000, null),
  // Button — fra Figma. Skinn-varianter i elements/_button.scss.
  button-primary-background-normal: (brand-dark-blue-1000, brand-blue-500),
  button-primary-background-hover: (brand-warm-blue-1000, brand-blue-1000),
  button-primary-background-focus: (brand-warm-blue-1000, brand-blue-1000),
  button-primary-background-active: (brand-warm-blue-1000, brand-blue-1000),
  button-primary-background-disabled: (brand-neutrals-50, brand-neutrals-900),
  button-primary-background-success: (brand-green-1000, null),
  button-primary-background-danger: (brand-red-1000, null),
  button-primary-border-focus: (brand-warm-blue-1000, brand-blue-1000),
  button-primary-text-normal: (brand-neutrals-white, brand-dark-blue-1000),
  button-primary-text-hover: (brand-neutrals-white, brand-dark-blue-1000),
  button-primary-text-focus: (brand-neutrals-white, brand-dark-blue-1000),
  button-primary-text-active: (brand-neutrals-white, brand-dark-blue-1000),
  button-primary-text-disabled: (brand-neutrals-400, brand-neutrals-600),
  button-secondary-background-hover: (brand-neutrals-transparent, null),
  button-secondary-background-active: (brand-neutrals-transparent, null),
  button-secondary-background-disabled: (brand-neutrals-50, brand-neutrals-900),
  button-secondary-border-normal: (brand-dark-blue-1000, brand-neutrals-200),
  button-secondary-border-yellow: (brand-yellow-1000, null),
  button-secondary-border-focus: (brand-warm-blue-1000, brand-blue-500),
  button-secondary-border-hover: (brand-warm-blue-1000, brand-blue-500),
  button-secondary-border-active: (brand-warm-blue-1000, brand-blue-500),
  button-secondary-border-disabled: (brand-neutrals-200, brand-neutrals-800),
  button-secondary-text-normal: (brand-dark-blue-1000, brand-neutrals-200),
  button-secondary-text-hover: (brand-warm-blue-1000, brand-blue-500),
  button-secondary-text-focus: (brand-warm-blue-1000, brand-blue-500),
  button-secondary-text-active: (brand-warm-blue-1000, brand-blue-500),
  button-secondary-text-disabled: (brand-neutrals-400, brand-neutrals-600),
  button-tertiary-background-hover: (brand-neutrals-100, brand-neutrals-900),
  button-tertiary-background-focus: (brand-neutrals-100, brand-neutrals-900),
  button-tertiary-background-active: (brand-neutrals-100, brand-neutrals-900),
  button-tertiary-background-disabled: (brand-neutrals-50, brand-neutrals-900),
  button-tertiary-border-focus: (brand-warm-blue-1000, brand-neutrals-transparent),
  button-tertiary-text-normal: (brand-dark-blue-1000, brand-neutrals-200),
  button-tertiary-text-hover: (brand-warm-blue-1000, brand-blue-500),
  button-tertiary-text-focus: (brand-warm-blue-1000, brand-blue-500),
  button-tertiary-text-active: (brand-warm-blue-1000, brand-blue-500),
  button-tertiary-text-disabled: (brand-neutrals-400, brand-neutrals-600)
) !default;

// token -> farge, ett map per mode. Begge kommer fra $pkt-semantic-color-modes
// og inneholder alle tokens. Der dark-mode verdi er null i kilden står light-mode
// dark-mode sitt map, slik at oppslag alltid gir en farge.
// Begge kan overstyres med @use ... with (...) slik som før.
$-light-colors: ();
$-dark-colors: ();

@each $-name, $-pair in $pkt-semantic-color-modes {
  $-light: map.get($pkt-colors, list.nth($-pair, 1));
  $-dark-ref: list.nth($-pair, 2);
  $-dark: $-light;

  @if $-dark-ref != null {
    $-dark: map.get($pkt-colors, $-dark-ref);
  }

  $-light-colors: map.set($-light-colors, $-name, $-light);
  $-dark-colors: map.set($-dark-colors, $-name, $-dark);
}

$pkt-semantic-colors: $-light-colors !default;
$pkt-semantic-colors-dark: $-dark-colors !default;

// Deprecated colors
$colors: (
  // brand
  color-blue: #6fe9ff,
  color-blue-light: #b3f5ff,
  color-blue-dark: #2a2859,
  color-green: #43f8b6,
  color-green-light: #c7f6c9,
  color-green-dark: #034b45,
  color-red: #ff8274,
  color-red-light: #ffb4ac,
  color-yellow: #f9c66b,
  color-beige-light: #f8f0dd,
  color-beige-dark: #d0bfae,
  // state
  color-active: #1f42aa,
  color-active-light: #b3f5ff,
  color-hover: #1f42aa,
  color-hover-light: #b3f5ff,
  color-focus: #e0adff,
  color-disabled: #4d4d4d,
  color-disabled-light: #f9f9f9,
  // system
  color-info: #2a2859,
  color-success: #034b45,
  color-warning: #774c01,
  color-error: #96281c,
  // shade
  color-blue-dark-5: #f2f9ff,
  color-blue-dark-10: #d9e9f2,
  color-blue-5: #f1fdff,
  color-blue-10: #e5fcff,
  color-blue-60: #d1f9ff,
  color-green-dark-5: #f2fff3,
  color-green-dark-10: #d9f2ef,
  color-green-10: #e5ffe6,
  color-green-30: #c7fde9,
  color-red-5: #fff3f2,
  color-red-10: #ffe8e5,
  color-red-30: #ffdfdc,
  color-yellow-5: #fef9f0,
  color-yellow-50: #ffe7bc,
  // grayscale digital
  color-gray-light: #f9f9f9,
  color-gray: #f2f2f2,
  color-gray-dark: #2c2c2c,
  //grayscale
  color-transparent: transparent,
  color-white: #fff,
  color-grayscale-10: #e6e6e6,
  color-grayscale-20: #ccc,
  color-grayscale-30: #b3b3b3,
  color-grayscale-40: #9a9a9a,
  color-grayscale-50: #808080,
  color-grayscale-60: #666,
  color-grayscale-70: #4d4d4d,
  color-grayscale-80: #333,
  color-grayscale-90: #1a1a1a,
  color-black: #000
) !default;