/**
 * @fileOverview The global stylesheet across the app
 * @author Chen FAN (fceek96@gmail.com)
 * @notes This stylesheet is for variables and resets
 */


/*
  Josh's Custom CSS Reset
  https://www.joshwcomeau.com/css/custom-css-reset/
*/
*, *::before, *::after {
  box-sizing: border-box;
}
* {
  margin: 0;
}
body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}
input, button, textarea, select {
  font: inherit;
}
p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}
#root, #__next {
  isolation: isolate;
}


/* ==== Global Variables and Properties for Reuse ==== */

:root {

  /* Theme colours */
  --clr-brown-dark: #695132;
  --clr-brown-light: #e0cfb8;
  --clr-brown-lighter: #fae8cf;
  --clr-blue-dark: #02283d;
  --clr-blue-light: #477994;
  --clr-red: #dd2a0d;
  --clr-green: #22ac38;
  --clr-green-light: #80c269;
  --clr-black: #000;
  --clr-white: #fff;
  --clr-unity-grey: #828081;
  --clr-unity-grey-dark: #323031;

  /* Theme fonts */
  --font-default: Candara, system-ui, -apple-system, sans-serif;
}

.theme-dark {

  --clr-brown-dark: #477994;
  --clr-brown-light: #02283d;
  --clr-brown-lighter: #011723;
  --clr-blue-dark: #fae8cf;
  --clr-blue-light: #695132;
}

/* ==== Global Styles ==== */

html, body {
  background-color: var(--clr-brown-light);
  color: var(--clr-blue-dark);

  font-family: var(--font-default);
}

a,
a:visited {
  text-decoration: none;
}

a:visited {
  color: inherit;
}