/*
 * Document Reset
 *
 */

@mixin globalReset() {
  /**
   * 1. Use the default cursor in all browsers (opinionated).
   * 2. Use the default user interface font in all browsers (opinionated).
   * 3. Correct the line height in all browsers.
   * 4. Use a 4-space tab width in all browsers (opinionated).
   * 5. Prevent adjustments of font size after orientation changes in iOS.
   * 6. Breaks words to prevent overflow in all browsers (opinionated).
   */

  html {
    cursor: default; /* 1 */
    font-family:
      system-ui,
      -apple-system,
      'Segoe UI',
      Roboto,
      Ubuntu,
      Cantarell,
      'Noto Sans',
      sans-serif,
      'Apple Color Emoji',
      'Segoe UI Emoji',
      'Segoe UI Symbol',
      'Noto Color Emoji'; /* 2 */

    line-height: var(--line-height-basis); /* 3 */ /* 4 */
    tab-size: 4; /* 4 */ /* 5 */
    text-size-adjust: 100%; /* 5 */
    word-break: break-word; /* 6 */
  }

  /**
   * Remove the margin in all browsers (opinionated).
   */

  body {
    margin: 0;
  }
}

@mixin coreReset() {
  /**
  * 1. Remove repeating backgrounds in all browsers (opinionated).
  * 2. Add border box sizing in all browsers (opinionated).
  */

  *,
  ::before,
  ::after {
    background-repeat: no-repeat; /* 1 */
    box-sizing: border-box; /* 2 */
  }

  /**
  * 1. Add text decoration inheritance in all browsers (opinionated).
  * 2. Add vertical alignment inheritance in all browsers (opinionated).
  */

  ::before,
  ::after {
    text-decoration: inherit; /* 1 */
    vertical-align: inherit; /* 2 */
  }
}

@mixin reset() {
  @include coreReset();

  /* Grouping content
   */

  /**
   * Add the correct sizing in Firefox.
   */

  hr {
    height: 0; /* 1 */
    overflow: visible; /* 2 */
  }

  /**
   * Remove the list style on navigation lists in all browsers (opinionated).
   */

  nav ol,
  nav ul {
    list-style: none;
  }

  /* Text-level semantics
   */

  /**
   * Add the correct text decoration in Opera and Safari.
   */

  abbr[title] {
    text-decoration: underline dotted;
  }

  /**
   * Add the correct font weight in Chrome and Safari.
   */

  b,
  strong {
    font-weight: bolder;
  }

  /**
   * 1. Use the default monospace user interface font
   *    in all browsers (opinionated).
   */

  pre,
  code,
  kbd,
  samp {
    // Why do we do this in a reset?
    font-family: var(--font-family-monospace); /* 1 */
  }

  /* Embedded content
   */

  /*
   * Change the alignment on media elements in all browsers (opinionated).
   */

  audio,
  canvas,
  iframe,
  img,
  svg,
  video {
    vertical-align: middle;
  }

  /**
   * Change the fill color to match the text color in all browsers (opinionated).
   */

  svg:not([fill]) {
    fill: currentcolor;
  }

  /* Tabular data
   */

  /**
   * Collapse border spacing in all browsers (opinionated).
   */

  table {
    border-collapse: collapse;
  }

  /* Forms
   */

  /**
   * Inherit styling in all browsers (opinionated).
   */

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

  /**
   * Remove the margin in Safari.
   */

  figure,
  button,
  input,
  select {
    margin: 0;
  }

  /**
   * Remove the inheritance of text transform in Firefox.
   */

  button {
    text-transform: none;
  }

  /**
   * Safari did inherit the break-word from html root
   */

  input {
    word-break: normal;
  }

  /**
   * Correct the color inheritance from `fieldset` elements.
   */

  legend {
    color: inherit;
    display: table;
    max-width: 100%;
    white-space: normal;
  }

  /**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */

  progress {
    display: inline-block;
    vertical-align: baseline;
  }

  /**
   * Remove the inheritance of text transform in Firefox.
   */

  select {
    text-transform: none;
  }

  /**
   * Change the resize direction on textareas in all browsers (opinionated).
   */

  textarea {
    resize: vertical;
  }

  /**
   * Correct the odd appearance in Chrome and Safari.
   */

  input[type='search'] {
    appearance: textfield;
    outline-offset: -2px;
  }

  /**
   * Correct the cursor style of increment and decrement buttons in Safari.
   */

  ::-webkit-inner-spin-button,
  ::-webkit-outer-spin-button {
    height: auto;
  }

  /**
   * Remove the inner padding in Chrome and Safari on macOS.
   */

  ::-webkit-search-decoration {
    appearance: none;
  }

  /**
   * Change font properties to inherit in Safari.
   */

  ::-webkit-file-upload-button {
    font: inherit;
    background-color: transparent;
    border: none;
  }

  /**
   * Remove the inner border and padding of focus outlines in Firefox.
   */

  ::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }

  /* Interactive
   */

  /*
   * Add the correct display in all browsers.
   */

  summary {
    display: list-item;
  }

  /* Scripting
   */

  /**
   * Add the correct display in all browsers.
   */

  template {
    display: none;
  }

  /* User interaction
   */

  /*
   * Remove the tapping delay on clickable elements in all browsers (opinionated).
   */

  a,
  area,
  button,
  input,
  label,
  select,
  summary,
  textarea,
  [tabindex] {
    touch-action: manipulation;
  }

  /**
   * Add the correct display in all browsers.
   */

  [hidden] {
    display: none;
  }

  /* Accessibility
   */

  /**
   * Change the cursor on busy elements in all browsers (opinionated).
   */

  [aria-busy='true'] {
    cursor: progress;
  }

  /*
   * Change the cursor on control elements in all browsers (opinionated).
   */

  [aria-controls]:not(input) {
    cursor: pointer;
  }

  /*
   * Change the cursor on disabled, not-editable, or otherwise
   * inoperable elements in all browsers (opinionated).
   */

  [aria-disabled='true'],
  [disabled] {
    cursor: not-allowed;
  }

  /*
   * Change the display on visually hidden accessible elements
   * in all browsers (opinionated).
   */

  [aria-hidden='false'][hidden]:not(:focus) {
    clip-path: inset(100%);
    display: inherit;
    position: absolute;
  }
}

// reset ePlatform css
@mixin resetLegacyStyles() {
  html[xmlns='http://www.w3.org/1999/xhtml'] {
    .dnb-anchor--active {
      color: var(--color-mint-green) !important;
    }

    a.dnb-button--primary {
      color: var(--color-white);
    }

    // reset lists
    .dnb-ul {
      list-style: initial;
    }

    // reset paragraphs
    .dnb-p {
      overflow: initial;
      text-align: inherit;
      background-color: initial;
    }
    i {
      font-style: italic;
    }

    // make content responsive, also for 200% in font-size
    #column_left,
    #root {
      width: 100%;
    }

    body#dnbLayoutDefault #wrapper,
    body#dnbLayoutDefaultStartPage #wrapper {
      width: 100%;
      padding: 0;
    }

    // reset the main content shadow
    #column_content {
      box-shadow: none;
    }
  }
}