@use "../1-settings/class-vars";

// icon google font settings:
// fill: 0, weight 400, grade 0, optical size: 20px

@font-face {
  font-family: "utah design system";
  src: url("https://cdn.utah.gov/design-system/fonts/utah-design-system.eot");
  src:
    url("https://cdn.utah.gov/design-system/fonts/utah-design-system.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.utah.gov/design-system/fonts/utah-design-system.woff") format("woff"),
    url("https://cdn.utah.gov/design-system/fonts/utah-design-system.ttf") format("truetype"),
    url("https://cdn.utah.gov/design-system/fonts/utah-design-system.svg#utah-design-system") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

#{class-vars.$base-class} {
  --icon-check-mark-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12.15'%3E%3Cg%3E%3Cpath d='M6.185,12.15L0,5.966,2.335,3.631l3.85,3.849L13.665,0l2.335,2.335L6.185,12.15Z' style='fill: %23fff;'/%3E%3C/g%3E%3C/svg%3E");
  --icon-chevron-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cg%3E%3Crect width='14' height='14' style='fill: none;'/%3E%3Cpath d='M3.142,5l3.716,3.71,3.717-3.71,1.142,1.142-4.859,4.858L2,6.142l1.142-1.142Z' style='fill: %23474747;'/%3E%3C/g%3E%3C/svg%3E");

  [class*="utds-icon-before-"],
  [class*="utds-icon-after-"] {
    display: inline-flex;
    align-items: center;
  }

  [class*="utds-icon-after-"]::after {
    display: inline-block;
    font-family: "utah design system";
    font-style: normal;
    font-weight: normal;
    font-size: 1em;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-left: var(--spacing-2xs);
  }
  [class*="utds-icon-before-"]::before {
    display: inline-block;
    font-family: "utah design system";
    font-style: normal;
    font-weight: normal;
    font-size: 1em;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-right: var(--spacing-2xs);
  }
  .utds-icon-before-external-link::before,
  .utds-icon-after-external-link::after {
    content: "\0041";
    font-size: 0.65em;
  }

  .utds-icon-before-waffle::before,
  .utds-icon-after-waffle::after {
    content: "\0042";
  }

  .utds-icon-before-alert::before,
  .utds-icon-after-alert::after {
    content: "\0043";
  }

  .utds-icon-before-help::before,
  .utds-icon-after-help::after {
    content: "\0044";
  }

  .utds-icon-before-bookmark::before,
  .utds-icon-after-bookmark::after {
    content: "\0045";
  }

  .utds-icon-before-search::before,
  .utds-icon-after-search::after {
    content: "\0046";
  }

  .utds-icon-before-check::before,
  .utds-icon-after-check::after {
    content: "\0047";
  }

  .utds-icon-before-star::before,
  .utds-icon-after-star::after {
    content: "\0048";
  }

  .utds-icon-before-info::before,
  .utds-icon-after-info::after {
    content: "\0049";
  }

  .utds-icon-before-unfold-less::before,
  .utds-icon-after-unfold-less::after {
    content: "\004a";
  }

  .utds-icon-before-unfold-more::before,
  .utds-icon-after-unfold-more::after {
    content: "\004b";
  }

  .utds-icon-before-circle-chevron-down::before,
  .utds-icon-after-circle-chevron-down::after {
    content: "\004c";
  }

  .utds-icon-before-circle-chevron-up::before,
  .utds-icon-after-circle-chevron-up::after {
    content: "\004d";
  }

  .utds-icon-before-chevron-up::before,
  .utds-icon-after-chevron-up::after {
    content: "\004e";
  }

  .utds-icon-before-chevron-right::before,
  .utds-icon-after-chevron-right::after {
    content: "\004f";
  }

  .utds-icon-before-chevron-down::before,
  .utds-icon-after-chevron-down::after {
    content: "\0050";
  }

  .utds-icon-before-chevron-left::before,
  .utds-icon-after-chevron-left::after {
    content: "\0051";
  }

  .utds-icon-before-arrow-up::before,
  .utds-icon-after-arrow-up::after {
    content: "\0052";
  }

  .utds-icon-before-arrow-right::before,
  .utds-icon-after-arrow-right::after {
    content: "\0053";
  }

  .utds-icon-before-arrow-down::before,
  .utds-icon-after-arrow-down::after {
    content: "\0054";
  }

  .utds-icon-before-arrow-left::before,
  .utds-icon-after-arrow-left::after {
    content: "\0055";
  }

  .utds-icon-before-plus::before,
  .utds-icon-after-plus::after {
    content: "\0056";
  }

  .utds-icon-before-minus::before,
  .utds-icon-after-minus::after {
    content: "\0057";
  }

  .utds-icon-before-x-icon::before,
  .utds-icon-after-x-icon::after {
    content: "\0058";
  }

  .utds-icon-before-edit::before,
  .utds-icon-after-edit::after {
    content: "\0059";
  }

  .utds-icon-before-edit-box::before,
  .utds-icon-after-edit-box::after {
    content: "\005a";
  }

  .utds-icon-before-verified::before,
  .utds-icon-after-verified::after {
    content: "\0061";
  }

  .utds-icon-before-gear::before,
  .utds-icon-after-gear::after {
    content: "\0062";
  }

  .utds-icon-before-doc::before,
  .utds-icon-after-doc::after {
    content: "\0063";
  }

  .utds-icon-before-doc-square::before,
  .utds-icon-after-doc-square::after {
    content: "\0064";
  }

  .utds-icon-before-warning::before,
  .utds-icon-after-warning::after {
    content: "\0065";
  }

  .utds-icon-before-error::before,
  .utds-icon-after-error::after {
    content: "\0066";
  }

  .utds-icon-before-copy::before,
  .utds-icon-after-copy::after {
    content: "\0067";
  }

  .utds-icon-before-home-menu::before,
  .utds-icon-after-home-menu::after {
    content: "\0068";
  }

  .utds-icon-before-hamburger::before,
  .utds-icon-after-hamburger::after {
    content: "\0069";
  }

  .utds-icon-before-account::before,
  .utds-icon-after-account::after {
    content: "\006a";
  }

  .utds-icon-before-lock::before,
  .utds-icon-after-lock::after {
    content: "\006b";
  }

  .utds-icon-before-more-vertical::before,
  .utds-icon-after-more-vertical::after {
    content: "\006c";
  }

  .utds-icon-before-more-horizontal::before,
  .utds-icon-after-more-horizontal::after {
    content: "\006d";
  }

  .utds-icon-before-download::before,
  .utds-icon-after-download::after {
    content: "\006e";
  }

  .utds-icon-before-upload::before,
  .utds-icon-after-upload::after {
    content: "\006f";
  }

  .utds-icon-before-favorite::before,
  .utds-icon-after-favorite::after {
    content: "\0070";
  }

  .utds-icon-before-visibility::before,
  .utds-icon-after-visibility::after {
    content: "\0071";
  }

  .utds-icon-before-visibility-off::before,
  .utds-icon-after-visibility-off::after {
    content: "\0072";
  }

  .utds-icon-before-trash::before,
  .utds-icon-after-trash::after {
    content: "\0073";
  }

  .utds-icon-before-calendar::before,
  .utds-icon-after-calendar::after {
    content: "\0074";
  }

  .utds-icon-before-clock::before,
  .utds-icon-after-clock::after {
    content: "\0075";
  }

  .utds-icon-before-double-arrow-up::before,
  .utds-icon-after-double-arrow-up::after {
    content: "\0076";
  }

  .utds-icon-before-double-arrow-right::before,
  .utds-icon-after-double-arrow-right::after {
    content: "\0077";
  }

  .utds-icon-before-double-arrow-down::before,
  .utds-icon-after-double-arrow-down::after {
    content: "\0078";
  }

  .utds-icon-before-double-arrow-left::before,
  .utds-icon-after-double-arrow-left::after {
    content: "\0079";
  }

  .utds-icon-before-filter::before,
  .utds-icon-after-filter::after {
    content: "\007a";
  }

  .utds-icon-before-restart::before,
  .utds-icon-after-restart::after {
    content: "\007b";
  }

  .utds-icon-before-sync::before,
  .utds-icon-after-sync::after {
    content: "\007c";
  }

  .utds-icon-before-refresh::before,
  .utds-icon-after-refresh::after {
    content: "\007d";
  }

  .utds-icon-before-light-mode::before,
  .utds-icon-after-light-mode::after {
    content: "\007e";
  }

  .utds-icon-before-dark-mode::before,
  .utds-icon-after-dark-mode::after {
    content: "\0030";
  }

  .utds-icon-before-mail::before,
  .utds-icon-after-mail::after {
    content: "\0031";
  }

  .utds-icon-before-share::before,
  .utds-icon-after-share::after {
    content: "\0032";
  }

  .utds-icon-before-policy::before,
  .utds-icon-after-policy::after {
    content: "\0033";
  }

  .utds-icon-before-login::before,
  .utds-icon-after-login::after {
    content: "\0034";
  }

  .utds-icon-before-logout::before,
  .utds-icon-after-logout::after {
    content: "\0035";
  }
}
