/* Creatora Outline: original SVG geometry, colored with the surrounding text. */
.sx-public-icon {
  display: inline-block;
  inline-size: 1em;
  block-size: 1em;
  flex: 0 0 auto;
  vertical-align: -.15em;
  background-color: currentColor;
  -webkit-mask: var(--sx-public-icon) center / contain no-repeat;
  mask: var(--sx-public-icon) center / contain no-repeat;
  pointer-events: none;
}
[data-public-icon="add"] { --sx-public-icon: url("/design-system/icons/add.svg"); }
[data-public-icon="arrow-down"] { --sx-public-icon: url("/design-system/icons/arrow-down.svg"); }
[data-public-icon="arrow-down-1"] { --sx-public-icon: url("/design-system/icons/arrow-down-1.svg"); }
[data-public-icon="arrow-left"] { --sx-public-icon: url("/design-system/icons/arrow-left.svg"); }
[data-public-icon="arrow-right"] { --sx-public-icon: url("/design-system/icons/arrow-right.svg"); }
[data-public-icon="arrow-up"] { --sx-public-icon: url("/design-system/icons/arrow-up.svg"); }
[data-public-icon="clock"] { --sx-public-icon: url("/design-system/icons/clock.svg"); }
[data-public-icon="close-circle"] { --sx-public-icon: url("/design-system/icons/close-circle.svg"); }
[data-public-icon="copy"] { --sx-public-icon: url("/design-system/icons/copy.svg"); }
[data-public-icon="export-1"] { --sx-public-icon: url("/design-system/icons/export-1.svg"); }
[data-public-icon="folder-open"] { --sx-public-icon: url("/design-system/icons/folder-open.svg"); }
[data-public-icon="heart"] { --sx-public-icon: url("/design-system/icons/heart.svg"); }
[data-public-icon="info-circle"] { --sx-public-icon: url("/design-system/icons/info-circle.svg"); }
[data-public-icon="layer"] { --sx-public-icon: url("/design-system/icons/layer.svg"); }
[data-public-icon="magic-star"] { --sx-public-icon: url("/design-system/icons/magic-star.svg"); }
[data-public-icon="maximize"] { --sx-public-icon: url("/design-system/icons/maximize.svg"); }
[data-public-icon="menu"] { --sx-public-icon: url("/design-system/icons/menu.svg"); }
[data-public-icon="message-question"] { --sx-public-icon: url("/design-system/icons/message-question.svg"); }
[data-public-icon="minus"] { --sx-public-icon: url("/design-system/icons/minus.svg"); }
[data-public-icon="monitor"] { --sx-public-icon: url("/design-system/icons/monitor.svg"); }
[data-public-icon="music"] { --sx-public-icon: url("/design-system/icons/music.svg"); }
[data-public-icon="musicnote"] { --sx-public-icon: url("/design-system/icons/musicnote.svg"); }
[data-public-icon="next"] { --sx-public-icon: url("/design-system/icons/next.svg"); }
[data-public-icon="notification"] { --sx-public-icon: url("/design-system/icons/notification.svg"); }
[data-public-icon="pause"] { --sx-public-icon: url("/design-system/icons/pause.svg"); }
[data-public-icon="play"] { --sx-public-icon: url("/design-system/icons/play.svg"); }
[data-public-icon="previous"] { --sx-public-icon: url("/design-system/icons/previous.svg"); }
[data-public-icon="profile-2user"] { --sx-public-icon: url("/design-system/icons/profile-2user.svg"); }
[data-public-icon="received"] { --sx-public-icon: url("/design-system/icons/received.svg"); }
[data-public-icon="record-circle"] { --sx-public-icon: url("/design-system/icons/record-circle.svg"); }
[data-public-icon="refresh"] { --sx-public-icon: url("/design-system/icons/refresh.svg"); }
[data-public-icon="search-normal"] { --sx-public-icon: url("/design-system/icons/search-normal.svg"); }
[data-public-icon="shield-tick"] { --sx-public-icon: url("/design-system/icons/shield-tick.svg"); }
[data-public-icon="sound"] { --sx-public-icon: url("/design-system/icons/sound.svg"); }
[data-public-icon="tick-circle"] { --sx-public-icon: url("/design-system/icons/tick-circle.svg"); }
[data-public-icon="user"] { --sx-public-icon: url("/design-system/icons/user.svg"); }
[data-public-icon="volume-high"] { --sx-public-icon: url("/design-system/icons/volume-high.svg"); }
[data-public-icon="volume-slash"] { --sx-public-icon: url("/design-system/icons/volume-slash.svg"); }

body.public-redesign [data-public-icon] {
  display: inline-block;
  width: 1em;
  height: 1em;
  inline-size: 1em;
  block-size: 1em;
  min-width: 0;
  min-height: 0;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: currentColor;
  color: inherit;
  box-shadow: none;
  -webkit-mask: var(--sx-public-icon) center / contain no-repeat;
  mask: var(--sx-public-icon) center / contain no-repeat;
}
body.public-redesign .sx-public-icon.is-inline { margin-inline-start: .35em; }
body.public-redesign .header-icon > .sx-public-icon { width: 20px; height: 20px; inline-size: 20px; block-size: 20px; }
body.public-redesign .notifications-heading > .sx-public-icon { width: 28px; height: 28px; inline-size: 28px; block-size: 28px; color: #a4b1ff; }
body.public-redesign .public-trust-link > .sx-public-icon { width: 18px; height: 18px; inline-size: 18px; block-size: 18px; }
body.public-redesign .sx-entry-popup-icon > .sx-public-icon { width: 32px; height: 32px; inline-size: 32px; block-size: 32px; }
body.public-redesign .track-play > .sx-public-icon { width: 16px; height: 16px; inline-size: 16px; block-size: 16px; }
html[dir="rtl"] body.public-redesign .text-action > span[aria-hidden] > [data-public-icon="arrow-right"] { transform: scaleX(-1); }

/* State-dependent CSS controls use the same original SVGs as inline controls. */
body.public-redesign .mobile-menu-toggle::before,
body.public-redesign .public-faq summary::after,
body.public-redesign .faq-list summary::after,
body.public-redesign .trouble-grid a::after,
body.public-redesign .public-discount-copy a::after,
body.public-redesign .result-icon::after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: currentColor;
  -webkit-mask: var(--sx-public-icon) center / contain no-repeat;
  mask: var(--sx-public-icon) center / contain no-repeat;
}
body.public-redesign .mobile-menu-toggle::before { --sx-public-icon: url('/design-system/icons/menu.svg'); }
body.public-redesign .mobile-menu-toggle[aria-expanded="true"]::before { --sx-public-icon: url('/design-system/icons/close-circle.svg'); }
body.public-redesign :is(.public-faq, .faq-list) summary::after { --sx-public-icon: url('/design-system/icons/add.svg'); }
body.public-redesign :is(.public-faq, .faq-list) details[open] summary::after { --sx-public-icon: url('/design-system/icons/minus.svg'); transform: none; }
body.public-redesign :is(.trouble-grid, .public-discount-copy) a::after { --sx-public-icon: url('/design-system/icons/arrow-right.svg'); vertical-align: -.2em; }
html[dir="rtl"] body.public-redesign :is(.trouble-grid, .public-discount-copy) a::after { --sx-public-icon: url('/design-system/icons/arrow-left.svg'); }
body.public-redesign .result-icon { font-size: 0; }
body.public-redesign .result-icon > .sx-public-icon { display: none; }
body.public-redesign .result-icon::after { --sx-public-icon: url('/design-system/icons/info-circle.svg'); width: 30px; height: 30px; }
body.public-redesign .result-icon.is-success::after { --sx-public-icon: url('/design-system/icons/tick-circle.svg'); }
body.public-redesign .result-icon.is-pending::after { --sx-public-icon: url('/design-system/icons/clock.svg'); }

body.public-redesign :is(.trouble-grid, .public-discount-copy) a::after { transform: none; }
body.public-redesign .notifications-state.is-loading::before {
  width: 18px; height: 18px; border: 0; border-radius: 0; background: currentColor;
  -webkit-mask: url('/design-system/icons/refresh.svg') center / contain no-repeat;
  mask: url('/design-system/icons/refresh.svg') center / contain no-repeat;
}

[data-public-icon="headphone"] { --sx-public-icon: url("/design-system/icons/headphone.svg"); }

[data-public-icon="message-text"] { --sx-public-icon: url("/design-system/icons/message-text.svg"); }

[data-public-icon="global"] { --sx-public-icon: url("/design-system/icons/global.svg"); }
