:root {
  --brick: rgb(112, 73, 0);;
  --vanilla: rgb(254, 255, 240);
  --lime:  rgb(236, 255, 127);
  --sky-blue: rgb(121, 201, 255);
  --light-blue: rgb(243, 248, 255);
  --midnight-blue: rgb(14, 42, 63);
  --orange: rgb(255, 106, 52);
  --forest-green: rgb(0, 60, 31);
  --leaf-green: rgb(0, 146, 76);
  --sun: rgb(240, 212, 29);
  --mustard: rgb(211, 148, 0);
  --vintage-green: rgb(164, 164, 0);
  }
  
  body[data-theme="startpage"] {
  --bg: white;
  --text: black;
  --link: var(--orange);
  --link-hover: var(--sky-blue);
  --nav-link: var(--text);
  --nav-link-hover: var(--link-hover);
  --nav-link-active: var(--link);
  --border: 1px solid var(--text);
  --cursor-url: url(/public/pointer_blue.svg), pointer;
}

body[data-theme="about"] {
  --bg: var(--vanilla);
  --text: var(--forest-green);
  --link: var(--leaf-green);
  --link-hover: #ff5900;
  --nav-link: var(--text);
  --nav-link-hover: var(--link);
  --nav-link-active: var(--link-hover);
  --border: 1px solid var(--text);
  --cursor-url: url(/public/pointer_green.svg), pointer;
}

body[data-theme="projects"] {
  --bg: var(--light-blue);
  --text: var(--midnight-blue);
  --link: var(--sky-blue);
  --link-hover: var(--orange);
  --nav-link: var(--text);
  --nav-link-hover: var(--link-hover);
  --nav-link-active: var(--link);
  --border: 1px solid var(--text);
  --cursor-url: url(/public/pointer_pink.svg), pointer;
}

body[data-theme="cv"] {
  --bg: var(--light-blue);
  --text: var(--midnight-blue);
  --link: var(--sky-blue);
  --link-hover: var(--orange);
  --nav-link: var(--text);
  --nav-link-hover: var(--link-hover);
  --nav-link-active: var(--link);
  --border: 1px solid var(--text);
  --cursor-url: url(/public/pointer_orange.svg), pointer;
}