// RAMEN BASE STYLES
//
//
// Required Global Variables:
// $base-font-color
// $base-font-family
// $base-font-size
// $base-font-weight
// $base-line-height
// $spacing-medium
// $spacing-base
// $font-weight-bold
//
//
// Required Component Variables:
//
// $focus-style: Sets the base focus style
// $text-highlight-color: Sets the base text highlight color
// $text-highlight-bg-color: Sets the base text highlight background color
// $tap-highlight-color: Sets the base text touch highlight color
// $c-link: Sets the base link color
// $c-link-hover: Sets the base link hover color
// $c-link-visited: Sets the base link visted color
// $margin-last-child-reset: Removes the margin from last element in container
//
//

// To be backwards-compatible, this needs to be false by default
$margin-last-child-reset: false !default;

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

*:focus {
  outline: $focus-style;
}

// Text highlight
::selection,
::-moz-selection {
  color: $text-highlight-color;
  background: $text-highlight-bg-color;
}

html,
body {
  -moz-osx-font-smoothing: auto;
  -moz-osx-font-smoothing: grayscale;
  -webkit-backface-visibility: hidden;
  -webkit-font-smoothing: antialiased !important;
  color: $base-font-color;
  font-family: $base-font-family;
  font-size: $base-font-size;
  font-weight: $base-font-weight;
  line-height: $base-line-height;
  min-width: 320px;
  position: relative;
  text-rendering: optimizeLegibility !important;
  width: 100%;
  z-index: 0;
}

body {
  font-size: $base-font-size;
}

// Links
a[href*='mailto:'] {
  word-wrap: break-word;
}

button {
  background-color: transparent;
  border: none;
  outline: none;
}

// Headings
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
}

// Reset Lists
ul,
ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

// Images
figure {
  margin: 0;
}

img {
  display: block;
  height: auto;
  max-width: 100%;
}

// Paragraph
p {
  margin-top: 0;
  margin-bottom: $spacing-medium;

  b,
  strong {
    font-weight: $font-weight-bold;
  }

  i,
  em {
    font-style: italic;
  }
}

// Default Transitions
a,
input[type='text'],
textarea,
button,
[class^='c-btn'] {
  -webkit-tap-highlight-color: $tap-highlight-color;
  transition-duration: $global-transition-speed;
  transition-property: background-color, color, opacity, border, border-color,
    background-position, outline, box-shadow, border-bottom, text-decoration,
    left, top, transform;
  transition-timing-function: $global-easing;
  transform-origin: center center;
}

a {
  color: $c-link;
  text-decoration: none;

  &:hover {
    color: $c-link-hover;
  }

  &:visited {
    color: $c-link-visited;
  }
}

// Spacing
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
figure,
image,
p {
  &:last-child {
    @if $margin-last-child-reset == true {
      margin-bottom: 0;
    }
  }
}

// Forms
form {
  fieldset {
    border: none;
    padding: 0;
  }

  legend {
  }

  ol {
    li {
      margin-bottom: $spacing-base;
    }
  }
}

// Buttons
button {
  background: none;
  border: none;
  padding: 0;
}