import n from"style-inject";var e='.l3-style-avatar {\n  position: relative;\n}\n.l3-style-avatar--large {\n  height: 68px;\n  width: 68px;\n}\n.l3-style-avatar--medium {\n  height: 48px;\n  width: 48px;\n}\n.l3-style-avatar--small {\n  height: 32px;\n  width: 32px;\n}\n.l3-style-avatar_clickableWrapper {\n  height: 100%;\n  width: 100%;\n}\n.l3-style-avatar_circle {\n  height: 100%;\n  width: 100%;\n  position: relative;\n  border: 1px solid;\n  border-radius: 50%;\n  overflow: hidden;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: #fff;\n  color: var(--text-color-on-primary);\n}\n.l3-style-avatar_circle:focus {\n  outline: none;\n}\n.l3-style-avatar_circle:focus:focus-visible, .l3-style-avatar_circle:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 50%;\n  box-shadow: 0 0 0 3px hsla(209deg, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.l3-style-avatar_circle:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.l3-style-avatar_circle--img {\n  border-color: #000000;\n  border-color: var(--color-transparent-black-05);\n}\n.l3-style-avatar_circle--text {\n  border-color: #e6e9ef;\n  border-color: var(--layout-border-color);\n}\n.l3-style-avatar_circle--is-disabled:before {\n  content: "";\n  height: 100%;\n  width: 100%;\n  position: absolute;\n  top: 0;\n  opacity: 0.7;\n  background: #000000;\n  background: var(--color-transparent-black-05);\n}\n.l3-style-avatar_circle--is-square {\n  border-radius: 4px;\n}\n.l3-style-avatar_circle--is-square:focus {\n  outline: none;\n}\n.l3-style-avatar_circle--is-square:focus:focus-visible, .l3-style-avatar_circle--is-square:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209deg, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.l3-style-avatar_circle--is-square:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.l3-style-avatar_circle--without-border {\n  border: none;\n}\n.l3-style-avatar_badges {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  /* position the left edge of the element at the middle of the parent */\n  transform: translate(-50%, -50%);\n  display: grid;\n  grid-template-columns: 50% 50%;\n  margin-left: auto;\n  margin-right: auto;\n  height: 110%;\n  width: 110%;\n}\n.l3-style-avatar_badges .l3-style-avatar_badge {\n  display: flex;\n}\n.l3-style-avatar_badges .l3-style-avatar_badge--top-left {\n  grid-row: 1;\n  grid-column: 1;\n  justify-self: start;\n}\n.l3-style-avatar_badges .l3-style-avatar_badge--top-right {\n  grid-row: 1;\n  grid-column: 2;\n  justify-self: end;\n}\n.l3-style-avatar_badges .l3-style-avatar_badge--bottom-left {\n  grid-row: 2;\n  grid-column: 1;\n  justify-self: start;\n  align-self: end;\n}\n.l3-style-avatar_badges .l3-style-avatar_badge--bottom-right {\n  grid-row: 2;\n  grid-column: 2;\n  justify-self: end;\n  align-self: end;\n}\n.svg {\n  position: absolute;\n  width: 0;\n  height: 0;\n}\n.polygon {\n  position: absolute;\n  justify-content: center;\n  flex-direction: column;\n  align-items: center;\n  clip-path: url(#my-clip-path);\n  border-radius: 5px;\n  border: 2px solid transparent;\n}\n.polygon_orange {\n  background: var(--color-gradient-orange);\n  border: 2px solid transparent;\n  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15);\n  border-color: #eea03c transparent #e85c29;\n}\n.polygon_green {\n  background: var(--color-gradient-green);\n  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15);\n  border-color: #cefb53 transparent #7af94b;\n}\n.polygon_yellow {\n  background: var(--color-gradient-yellow);\n  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15);\n  border-color: #fdfe53 transparent #eb9b3a;\n}\n.polygon_blue {\n  background: var(--color-gradient-blue);\n  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15);\n  border-color: #4ca6f8 transparent #2152f3;\n}\n.polygon_lightBlue {\n  background: var(--color-gradient-light-blue);\n  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15);\n  border-color: #73fafd transparent #50b1d7;\n}\n.polygon_pink {\n  background: var(--color-gradient-pink);\n  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.15);\n  border-color: #e332e6 transparent #a822f3;\n}\n.polygon_none {\n  border-color: transparent;\n  margin-top: -4px;\n}\n.polygon .clipped {\n  width: 48px;\n  height: 48px;\n  background: radial-gradient(52.93% 52.93% at 36.42% 37.84%, #58aae7 0%, #4889e7 89.97%);\n  background-size: cover;\n  clip-path: url(#my-clip-path);\n}\n.polygon .clipped_large {\n  width: 68px;\n  height: 68px;\n}\n.polygon .clipped_small {\n  width: 32px;\n  height: 32px;\n}\n.polygon .clipped_medium {\n  width: 48px;\n  height: 48px;\n}';n(e,{insertAt:"top"});export{e as default};
