@font-face {
  font-display: block;
  font-family: "joy-icons";
  src: url("https://cdn.malt.com/npm/@maltjoy/icons/5.12.0/joy-icons.woff2?0948ad6723d9c7ed1345a914fb6196f4") format("woff2");
}
i[class^=icon-], i[class*=" icon-"] {
  display: inline-block;
}

i[class^=icon-]:before, i[class*=" icon-"]:before {
  display: block;
  font-family: joy-icons !important;
  font-style: normal;
  font-weight: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-caret-down:before {
  content: "\e000";
}

.icon-caret-left:before {
  content: "\e001";
}

.icon-caret-right:before {
  content: "\e002";
}

.icon-caret-up:before {
  content: "\e003";
}

.icon-chevron-double:before {
  content: "\e004";
}

.icon-chevron-down:before {
  content: "\e005";
}

.icon-chevron-left:before {
  content: "\e006";
}

.icon-chevron-right:before {
  content: "\e007";
}

.icon-chevron-top:before {
  content: "\e008";
}

.icon-chevron-up:before {
  content: "\e009";
}

.icon-accomodation:before {
  content: "\f101";
}

.icon-add-circle:before {
  content: "\f102";
}

.icon-add:before {
  content: "\f103";
}

.icon-android:before {
  content: "\f104";
}

.icon-apple:before {
  content: "\f105";
}

.icon-archive-explicit:before {
  content: "\f106";
}

.icon-archive:before {
  content: "\f107";
}

.icon-arrow-left:before {
  content: "\f108";
}

.icon-arrow-right:before {
  content: "\f109";
}

.icon-art:before {
  content: "\f10a";
}

.icon-axa-logo:before {
  content: "\f10b";
}

.icon-badge-recommended-hover:before {
  content: "\f10c";
}

.icon-badge-recommended:before {
  content: "\f10d";
}

.icon-ban:before {
  content: "\f10e";
}

.icon-bank:before {
  content: "\f10f";
}

.icon-bars:before {
  content: "\f110";
}

.icon-bell:before {
  content: "\f111";
}

.icon-block-shield:before {
  content: "\f112";
}

.icon-bricks:before {
  content: "\f113";
}

.icon-briefcase:before {
  content: "\f114";
}

.icon-calendar:before {
  content: "\f115";
}

.icon-camcorder:before {
  content: "\f116";
}

.icon-camera-device:before {
  content: "\f117";
}

.icon-camera:before {
  content: "\f118";
}

.icon-cancel:before {
  content: "\f119";
}

.icon-car-allowance:before {
  content: "\f11a";
}

.icon-car-garage:before {
  content: "\f11b";
}

.icon-car:before {
  content: "\f11c";
}

.icon-chat:before {
  content: "\f11d";
}

.icon-check-circle:before {
  content: "\f11e";
}

.icon-check:before {
  content: "\f11f";
}

.icon-chess:before {
  content: "\f120";
}

.icon-chf-circle:before {
  content: "\f121";
}

.icon-circle:before {
  content: "\f122";
}

.icon-clock:before {
  content: "\f123";
}

.icon-cloud-upload:before {
  content: "\f124";
}

.icon-code:before {
  content: "\f125";
}

.icon-color:before {
  content: "\f126";
}

.icon-communication:before {
  content: "\f127";
}

.icon-company-placeholder:before {
  content: "\f128";
}

.icon-conditions:before {
  content: "\f129";
}

.icon-conference:before {
  content: "\f12a";
}

.icon-contact:before {
  content: "\f12b";
}

.icon-cookie:before {
  content: "\f12c";
}

.icon-copy:before {
  content: "\f12d";
}

.icon-cost-plus:before {
  content: "\f12e";
}

.icon-creditcard:before {
  content: "\f12f";
}

.icon-cross:before {
  content: "\f130";
}

.icon-crown:before {
  content: "\f131";
}

.icon-customer-support:before {
  content: "\f132";
}

.icon-dataviz:before {
  content: "\f133";
}

.icon-dollar-circle:before {
  content: "\f134";
}

.icon-dots-vertical:before {
  content: "\f135";
}

.icon-download:before {
  content: "\f136";
}

.icon-drag:before {
  content: "\f137";
}

.icon-edit-document:before {
  content: "\f138";
}

.icon-enter-key:before {
  content: "\f139";
}

.icon-envelope-send:before {
  content: "\f13a";
}

.icon-envelope:before {
  content: "\f13b";
}

.icon-euro-circle:before {
  content: "\f13c";
}

.icon-external-link:before {
  content: "\f13d";
}

.icon-eye-masked:before {
  content: "\f13e";
}

.icon-eye:before {
  content: "\f13f";
}

.icon-facebook:before {
  content: "\f140";
}

.icon-favorite-add:before {
  content: "\f141";
}

.icon-fee:before {
  content: "\f142";
}

.icon-file-check:before {
  content: "\f143";
}

.icon-file-pdf:before {
  content: "\f144";
}

.icon-file:before {
  content: "\f145";
}

.icon-filter:before {
  content: "\f146";
}

.icon-five-day:before {
  content: "\f147";
}

.icon-flag:before {
  content: "\f148";
}

.icon-freelancer-placeholder:before {
  content: "\f149";
}

.icon-fullscren:before {
  content: "\f14a";
}

.icon-gasoline:before {
  content: "\f14b";
}

.icon-globe-hover:before {
  content: "\f14c";
}

.icon-globe:before {
  content: "\f14d";
}

.icon-google:before {
  content: "\f14e";
}

.icon-granular-report:before {
  content: "\f14f";
}

.icon-graph-high:before {
  content: "\f150";
}

.icon-graph:before {
  content: "\f151";
}

.icon-grid:before {
  content: "\f152";
}

.icon-hand-check:before {
  content: "\f153";
}

.icon-handshake:before {
  content: "\f154";
}

.icon-hard-drive:before {
  content: "\f155";
}

.icon-heart-fill:before {
  content: "\f156";
}

.icon-heart-path:before {
  content: "\f157";
}

.icon-heart-people:before {
  content: "\f158";
}

.icon-heart:before {
  content: "\f159";
}

.icon-heartbroken:before {
  content: "\f15a";
}

.icon-home:before {
  content: "\f15b";
}

.icon-ico-list:before {
  content: "\f15c";
}

.icon-identity-switch:before {
  content: "\f15d";
}

.icon-image:before {
  content: "\f15e";
}

.icon-info-circle:before {
  content: "\f15f";
}

.icon-instagram:before {
  content: "\f160";
}

.icon-insurance:before {
  content: "\f161";
}

.icon-invite:before {
  content: "\f162";
}

.icon-invoice-sent:before {
  content: "\f163";
}

.icon-key:before {
  content: "\f164";
}

.icon-legal-check:before {
  content: "\f165";
}

.icon-legal:before {
  content: "\f166";
}

.icon-link:before {
  content: "\f167";
}

.icon-linkedin:before {
  content: "\f168";
}

.icon-list-file:before {
  content: "\f169";
}

.icon-list:before {
  content: "\f16a";
}

.icon-location:before {
  content: "\f16b";
}

.icon-lock:before {
  content: "\f16c";
}

.icon-logo-brew:before {
  content: "\f16d";
}

.icon-man-woman:before {
  content: "\f16e";
}

.icon-marketing:before {
  content: "\f16f";
}

.icon-meal:before {
  content: "\f170";
}

.icon-medal-thumbsup:before {
  content: "\f171";
}

.icon-megaphone:before {
  content: "\f172";
}

.icon-menu:before {
  content: "\f173";
}

.icon-message:before {
  content: "\f174";
}

.icon-minus:before {
  content: "\f175";
}

.icon-money:before {
  content: "\f176";
}

.icon-mood-bad:before {
  content: "\f177";
}

.icon-mood-good:before {
  content: "\f178";
}

.icon-newspaper:before {
  content: "\f179";
}

.icon-open-conversation:before {
  content: "\f17a";
}

.icon-paperclip:before {
  content: "\f17b";
}

.icon-pause:before {
  content: "\f17c";
}

.icon-pen:before {
  content: "\f17d";
}

.icon-pencil:before {
  content: "\f17e";
}

.icon-phone:before {
  content: "\f17f";
}

.icon-plane-full:before {
  content: "\f180";
}

.icon-play:before {
  content: "\f181";
}

.icon-plus-circle:before {
  content: "\f182";
}

.icon-pound-circle:before {
  content: "\f183";
}

.icon-print:before {
  content: "\f184";
}

.icon-projectmanager-agile:before {
  content: "\f185";
}

.icon-qr-code:before {
  content: "\f186";
}

.icon-question-circle:before {
  content: "\f187";
}

.icon-quote-inv:before {
  content: "\f188";
}

.icon-quote:before {
  content: "\f189";
}

.icon-r2d2:before {
  content: "\f18a";
}

.icon-radio:before {
  content: "\f18b";
}

.icon-ranking-people:before {
  content: "\f18c";
}

.icon-receipt:before {
  content: "\f18d";
}

.icon-refresh:before {
  content: "\f18e";
}

.icon-remove-circle:before {
  content: "\f18f";
}

.icon-robot:before {
  content: "\f190";
}

.icon-rocket:before {
  content: "\f191";
}

.icon-school:before {
  content: "\f192";
}

.icon-search-result:before {
  content: "\f193";
}

.icon-search:before {
  content: "\f194";
}

.icon-security:before {
  content: "\f195";
}

.icon-sendit:before {
  content: "\f196";
}

.icon-settings-outline:before {
  content: "\f197";
}

.icon-single-report:before {
  content: "\f198";
}

.icon-social-share:before {
  content: "\f199";
}

.icon-social:before {
  content: "\f19a";
}

.icon-sort-asc:before {
  content: "\f19b";
}

.icon-sort-desc:before {
  content: "\f19c";
}

.icon-sort:before {
  content: "\f19d";
}

.icon-sparkle:before {
  content: "\f19e";
}

.icon-sparkles:before {
  content: "\f19f";
}

.icon-star-fill:before {
  content: "\f1a0";
}

.icon-star-half:before {
  content: "\f1a1";
}

.icon-star-message:before {
  content: "\f1a2";
}

.icon-star:before {
  content: "\f1a3";
}

.icon-strategy:before {
  content: "\f1a4";
}

.icon-super-malter:before {
  content: "\f1a5";
}

.icon-swipe:before {
  content: "\f1a6";
}

.icon-switch:before {
  content: "\f1a7";
}

.icon-sync-reset:before {
  content: "\f1a8";
}

.icon-tab-inverted:before {
  content: "\f1a9";
}

.icon-tab:before {
  content: "\f1aa";
}

.icon-taxi:before {
  content: "\f1ab";
}

.icon-three-dots:before {
  content: "\f1ac";
}

.icon-thumbdown:before {
  content: "\f1ad";
}

.icon-thumbup:before {
  content: "\f1ae";
}

.icon-thunder:before {
  content: "\f1af";
}

.icon-traffic-signs:before {
  content: "\f1b0";
}

.icon-translate:before {
  content: "\f1b1";
}

.icon-transportation:before {
  content: "\f1b2";
}

.icon-trash:before {
  content: "\f1b3";
}

.icon-trending-up:before {
  content: "\f1b4";
}

.icon-twitter:before {
  content: "\f1b5";
}

.icon-user-add:before {
  content: "\f1b6";
}

.icon-user-check:before {
  content: "\f1b7";
}

.icon-user-edit:before {
  content: "\f1b8";
}

.icon-user-lighter:before {
  content: "\f1b9";
}

.icon-user-photo:before {
  content: "\f1ba";
}

.icon-user-remove:before {
  content: "\f1bb";
}

.icon-user:before {
  content: "\f1bc";
}

.icon-users:before {
  content: "\f1bd";
}

.icon-video-camera:before {
  content: "\f1be";
}

.icon-videogame:before {
  content: "\f1bf";
}

.icon-view-check:before {
  content: "\f1c0";
}

.icon-view-search:before {
  content: "\f1c1";
}

.icon-view-user:before {
  content: "\f1c2";
}

.icon-walk:before {
  content: "\f1c3";
}

.icon-wallet:before {
  content: "\f1c4";
}

.icon-warning-triangle:before {
  content: "\f1c5";
}

.icon-warning:before {
  content: "\f1c6";
}

.icon-waving-hand:before {
  content: "\f1c7";
}

.icon-web-design:before {
  content: "\f1c8";
}

.icon-wench:before {
  content: "\f1c9";
}

.icon-x:before {
  content: "\f1ca";
}

.icon-xmark-circle:before {
  content: "\f1cb";
}

.icon-xml:before {
  content: "\f1cc";
}

.icon-youtube:before {
  content: "\f1cd";
}

.icon-zoom-in:before {
  content: "\f1ce";
}

.icon-zoom-out:before {
  content: "\f1cf";
}

:host {
  /**
   * @prop --icon-size: customize icon size with px value.
   */
  --icon-size: 18px;
  display: inline-flex;
  color: var(--joy-color-secondary-50);
}

.joy-icon--clickable {
  cursor: pointer;
}

.joy-icon--xxsmall {
  --icon-size: 12px;
}

.joy-icon--xsmall {
  --icon-size: 18px;
}

.joy-icon--small {
  --icon-size: 24px;
}

.joy-icon--medium {
  --icon-size: 32px;
}

.joy-icon--large {
  --icon-size: 46px;
}

.joy-icon--xlarge {
  --icon-size: 128px;
}

:host(.joy-icon--teal) {
  color: var(--joy-color-secondary-50);
}

:host(.joy-icon--grey) {
  color: var(--joy-color-neutral-40);
}

:host(.joy-icon--red) {
  color: var(--joy-color-primary-50);
}

:host(.joy-icon--yellow) {
  color: var(--joy-color-quaternary-70);
}

:host(.joy-icon--turquoise) {
  color: var(--joy-color-tertiary-50);
}

:host(.joy-icon--white) {
  color: white;
}

:host(.joy-icon--success) {
  color: var(--joy-color-success-50);
}

:host(.joy-icon--error) {
  color: var(--joy-color-error-50);
}

:host(.joy-icon--info) {
  color: var(--joy-color-information-50);
}

.joy-icon-inner {
  pointer-events: none;
  min-width: var(--icon-size);
  width: var(--icon-size);
  height: var(--icon-size);
}
.joy-icon-inner i.icon {
  display: block;
  font-size: var(--icon-size);
}