$my-theme: (
  // Background
  background: black,
  background-active: hotpink,
  background-hover: hotpink,
  background-selected: hotpink,
  background-selected-hover: hotpink,
  background-inverse: hotpink,
  background-inverse-hover: hotpink,
  background-brand: hotpink,

  // Layer
  layer: purple,
  layer-active: purple,
  layer-hover: purple,
  layer-selected: purple,
  layer-selected-hover: purple,
  layer-selected-inverse: purple,
  layer-selected-disabled: purple,
  layer-accent: purple,
  layer-accent-active: purple,
  layer-accent-hover: purple,
  layer-disabled: purple,

  // Field
  field: green,
  field-hover: green,
  field-disabled: green,

  // Interactive
  interactive: lightgreen,

  // Border
  border-subtle: darkblue,
  border-subtle-selected: darkblue,
  border-strong: darkblue,
  border-inverse: darkblue,
  border-interactive: darkblue,
  border-disabled: darkblue,

  // Text
  text-primary: lightpink,
  text-secondary: lightpink,
  text-placeholder: lightpink,
  text-helper: lightpink,
  text-on-color: lightpink,
  text-inverse: lightpink,
  text-disabled: lightpink,
  text-on-color-disabled: lightpink,

  //Link
  link-primary: yellow,
  link-primary-hover: yellow,
  link-secondary: yellow,
  link-visited: yellow,
  link-inverse: yellow,

  //Icon
  icon-primary: orange,
  icon-secondary: orange,
  icon-on-color: orange,
  icon-inverse: orange,
  icon-disabled: orange,
  icon-on-color-disabled: orange,

  // Support
  support-error: red,
  support-success: red,
  support-warning: red,
  support-info: red,
  support-error-inverse: red,
  support-success-inverse: red,
  support-warning-inverse: red,
  support-info-inverse: red,

  // Misc.
  overlay: rgba(22, 22, 22, 0.5),
  toggle-off: #8d8d8d,

  // Button
  button-primary: aqua,
  button-primary-active: aqua,
  button-primary-hover: aqua,
  button-secondary: aqua,
  button-secondary-active: aqua,
  button-secondary-hover: aqua,
  button-tertiary: aqua,
  button-tertiary-active: aqua,
  button-tertiary-hover: aqua,
  button-danger-primary: aqua,
  button-danger-secondary: aqua,
  button-danger-active: aqua,
  button-danger-hover: aqua,
  button-disabled: aqua,

// Focus
  focus-inset: #ffffff,
  focus-inverse: #ffffff,

// Skeleton
  skeleton-background: #e5e5e5,
  skeleton-element: #c6c6c6,
);

// Use the gray 100 theme
// $theme: $g100;

//use my theme
// $theme: $my-theme;

@use '@carbon/react/scss/themes' as *;
@use '@carbon/react/scss/theme' with (
  $theme: $my-theme
);

@use '@carbon/react';

// @use '@carbon/react/scss/spacing';
// @import '@carbon/react/scss/type';
@import './components/MainHeader/MainHeader.scss';
// @import './content/LandingPage/landing-page.scss';