// BASE: Reset
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba($black, 0);
}

// stylelint-disable-next-line selector-list-comma-newline-after
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block;
}

// Body

body {
	margin: 0;
	font-family: $eps-font-family;
	font-size: $eps-body-font-size;
	font-weight: $eps-font-weight-base;
	line-height: $eps-line-height-base;
	color: var(--body-color);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background-color: var(--body-bg);
}

::selection {
	background-color: rgba(theme-colors(cta), $opacity-05);
}

[tabindex="-1"]:focus:not(:focus-visible) {
  outline: 0 !important;
}

// Typography
// Reset header Tags
h1, h2, h3, h4, h5, h6 {
  font-size:100%;
  margin:0;
  padding:0;
  line-height:inherit;
  font-weight:normal;
}

// Reset margins on paragraphs
p {
  margin-top: 0;
  margin-bottom: $eps-paragraph-margin-bottom;
}

b,
strong {
  font-weight: $eps-font-weight-bold; // Add the correct font weight in Chrome, Edge, and Safari
}

small {
  font-size: $eps-small-font-size; // Add the correct font size in all browsers
}

// Links
a {
	--eps-link-color: $eps-link-color;
  color: var(--eps-link-color);
  background-color: transparent; // Remove the gray background on active links in IE 10.

  &,
  &:active,
  &:hover,
  &:focus {
	text-decoration: $eps-link-decoration;
  }

  &:focus,
  &:hover {
	  --eps-link-color: $eps-link-hover-color;
	text-decoration: $eps-link-hover-decoration;
  }
}

a:not([href]) {
  color: inherit;
  text-decoration: none;

  &:hover {
	color: inherit;
	text-decoration: none;
  }
}

// Code
pre,
code,
kbd,
samp {
  font-family: $font-family-monospace;
  font-size: 1em;
}

// Figures
figure {
  // Apply a consistent margin strategy (matches our type styles).
  margin: 0 0 0;
}

// Images and content

img {
  vertical-align: middle;
  border-style: none; // Remove the border on images inside links in IE 10-.
}

svg {
  overflow: hidden;
  vertical-align: middle;
}


button {
  border-radius: 0;
}

button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color;
}

input,
button,
select,
optgroup,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button,
input {
  overflow: visible; // Show the overflow in Edge
}

button,
select {
  text-transform: none; // Remove the inheritance of text transform in Firefox
}

[role="button"] {
  cursor: pointer;
}

select {
  word-wrap: normal;
}


button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

// Opinionated: add "hand" cursor to non-disabled button elements.
button,
[type="button"],
[type="reset"],
[type="submit"] {
  &:not(:disabled) {
	cursor: pointer;
  }
}

// Remove inner border and padding from Firefox, but don't restore the outline like Normalize.
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  padding: 0;
  border-style: none;
}

input[type="radio"],
input[type="checkbox"] {
  box-sizing: border-box;
  padding: 0;
}


textarea {
  overflow: auto;
  resize: vertical;
}


// Always hide an element with the `hidden` HTML attribute (from PureCSS).
[hidden] {
  display: none !important;
}

// Opinionated resets:

hr {
	border: 0 none;
	border-bottom: 1px solid var(--hr-color);
}