/**
 * The `style.scss` file is used to generate `style.css`. Do not modify the CSS file directly.
 * Instead, make changes to the SCSS file and regenerate the CSS.
 *
 * npx sass ./libs/angular/src/scss/bwicons/styles/style.scss ./libs/angular/src/scss/bwicons/styles/style.css --no-source-map 2>&1
 */

$icomoon-font-family: "bwi-font" !default;
$icomoon-font-path: "~@bitwarden/angular/src/scss/bwicons/fonts/" !default;

// New font sheet? Update the font-face information below
@font-face {
  font-family: "#{$icomoon-font-family}";
  src:
    url($icomoon-font-path + "bwi-font.svg") format("svg"),
    url($icomoon-font-path + "bwi-font.ttf") format("truetype"),
    url($icomoon-font-path + "bwi-font.woff") format("woff"),
    url($icomoon-font-path + "bwi-font.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

// Base Class
.bwi {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "#{$icomoon-font-family}" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  display: inline-block;
  /* Better Font Rendering */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

// Fixed Width Icons
.bwi-fw {
  width: calc(18em / 14);
  text-align: center;
}

// Sizing Changes
.bwi-sm {
  font-size: 0.875em;
}

.bwi-lg {
  font-size: calc(4em / 3);
  line-height: calc(3em / 4);
  vertical-align: -15%;
}

.bwi-2x {
  font-size: 2em;
}

.bwi-3x {
  font-size: 3em;
}

.bwi-4x {
  font-size: 4em;
}

// Spin Animations
.bwi-spin {
  animation: bwi-spin 2s infinite linear;
}

@keyframes bwi-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}

// List Icons
.bwi-ul {
  padding-left: 0;
  margin-left: calc(30em / 14);
  list-style-type: none;
  > li {
    position: relative;
  }
}

.bwi-li {
  position: absolute;
  left: calc(-30em / 14);
  width: calc(30em / 14);
  top: calc(2em / 14);
  text-align: center;
  &.bwi-lg {
    left: calc(-30em / 14) + calc(4em / 14);
  }
}

// Rotation
.bwi-rotate-270 {
  transform: rotate(270deg);
}

// Auto-generated - do not edit manually
// Bidirectional icon name support (both Figma and legacy BWI names)
$icons: (
  "accessibility": "\f173",
  "add": "\f171",
  "add-circle": "\f172",
  "angle-down": "\f170",
  "angle-left": "\f16f",
  "angle-right": "\f16e",
  "angle-up": "\f16c",
  "angle-up-down": "\f16d",
  "archive": "\f16b",
  "arrow-down": "\f16a",
  "arrow-filled-down": "\f169",
  "arrow-filled-left": "\f168",
  "arrow-filled-right": "\f167",
  "arrow-filled-up": "\f166",
  "arrow-left": "\f165",
  "arrow-right": "\f164",
  "arrow-up": "\f163",
  "attach": "\f162",
  "autofill": "\f161",
  "bank": "\f160",
  "bitcoin": "\f15f",
  "bitwarden-shield": "\f15e",
  "browser": "\f15d",
  "bug": "\f15c",
  "business": "\f15b",
  "camera": "\f15a",
  "check": "\f158",
  "check-circle": "\f159",
  "circle": "\f157",
  "clear": "\f156",
  "clock": "\f155",
  "close": "\f154",
  "collection": "\f152",
  "collection-shared": "\f153",
  "copy": "\f151",
  "credit-card": "\f150",
  "dashboard": "\f14f",
  "delete": "\f14e",
  "desktop": "\f14c",
  "desktop-user": "\f14d",
  "diamond": "\f14b",
  "dollar": "\f14a",
  "download": "\f149",
  "drag": "\f148",
  "duplicate": "\f147",
  "edit": "\f145",
  "edit-alt": "\f146",
  "encrypted": "\f144",
  "error": "\f143",
  "extension": "\f142",
  "external-link": "\f141",
  "family": "\f140",
  "file": "\f13e",
  "file-text": "\f13f",
  "filter": "\f13d",
  "folder": "\f13c",
  "generate": "\f13b",
  "gift": "\f13a",
  "grid": "\f139",
  "groups": "\f138",
  "handshake": "\f137",
  "hashtag": "\f136",
  "help": "\f135",
  "identity": "\f134",
  "info": "\f133",
  "key": "\f132",
  "list": "\f130",
  "list-alt": "\f131",
  "loading": "\f12f",
  "lock": "\f12d",
  "lock-filled": "\f12e",
  "login": "\f12c",
  "mail": "\f12b",
  "mobile": "\f12a",
  "more-horizontal": "\f129",
  "more-vertical": "\f128",
  "msp": "\f127",
  "new-window": "\f126",
  "note": "\f125",
  "notifications": "\f124",
  "numbered-list": "\f123",
  "palette": "\f122",
  "passkey": "\f121",
  "passport": "\f120",
  "paypal": "\f11f",
  "receipt": "\f11e",
  "redo": "\f11d",
  "refresh": "\f11c",
  "search": "\f11b",
  "send": "\f11a",
  "settings": "\f118",
  "settings-filled": "\f119",
  "share": "\f117",
  "shared-folder": "\f116",
  "sign-in": "\f115",
  "sign-out": "\f114",
  "sliders": "\f113",
  "sso": "\f112",
  "star": "\f110",
  "star-filled": "\f111",
  "subtract": "\f10e",
  "subtract-circle": "\f10f",
  "tag": "\f10d",
  "terminal": "\f10c",
  "unarchive": "\f10b",
  "undo": "\f10a",
  "unlock": "\f109",
  "upload": "\f108",
  "user": "\f107",
  "vault": "\f106",
  "visibility": "\f104",
  "visibility-off": "\f105",
  "warning": "\f103",
  "wireless": "\f102",
  "wrench": "\f101",
  "bell": "\f124",
  "billing": "\f11e",
  "brush": "\f122",
  "cli": "\f10c",
  "clone": "\f151",
  "cog": "\f118",
  "cog-f": "\f119",
  "down-solid": "\f169",
  "drag-and-drop": "\f148",
  "ellipsis-h": "\f129",
  "ellipsis-v": "\f128",
  "envelope": "\f12b",
  "exclamation-triangle": "\f103",
  "eye": "\f104",
  "eye-slash": "\f105",
  "files": "\f147",
  "globe": "\f12c",
  "id-card": "\f134",
  "import": "\f108",
  "info-circle": "\f133",
  "lock-encrypted": "\f144",
  "lock-f": "\f12e",
  "minus-circle": "\f10f",
  "paperclip": "\f162",
  "pencil": "\f146",
  "pencil-square": "\f145",
  "plus": "\f171",
  "plus-circle": "\f172",
  "popout": "\f126",
  "premium": "\f14b",
  "provider": "\f137",
  "puzzle": "\f142",
  "question-circle": "\f135",
  "shield": "\f15e",
  "spinner": "\f12f",
  "star-f": "\f111",
  "sticky-note": "\f125",
  "trash": "\f14e",
  "universal-access": "\f173",
  "up-down-btn": "\f16d",
  "up-solid": "\f166",
  "user-monitor": "\f14d",
  "users": "\f138",
);

@each $name, $glyph in $icons {
  .bwi-#{$name}:before {
    content: $glyph;
  }
}
