cozy-ui-plus 1.1.0

package/dist/stylesheet.css

@@ -0,0 +1,898 @@
+/*  imported from styles.styl  */
+
+.styles__c-loading-placeholder___3Q5Co {
+  animation-delay: 0.1s;
+  animation-duration: 2s;
+  animation-iteration-count: infinite;
+  animation-name: styles__placeHolderShimmer___1L4im;
+  animation-timing-function: linear;
+  background-position: -20rem 0;
+  background-image: linear-gradient(to right, #c0c0c0 0%, #fcfcfc 50%, #c0c0c0 100%);
+  background-size: 20rem 10rem;
+  background-repeat: no-repeat;
+  background-color: #c0c0c0;
+  border-radius: 0.15rem;
+  max-width: 100%;
+  position: relative;
+  margin: 0.1rem 0;
+}
+.styles__c-app-icon___2W1cp,
+.styles__c-app-icon___2W1cp svg {
+  height: 100%;
+  width: 100%;
+  flex-grow: 0;
+  flex-shrink: 0;
+  object-fit: contain;
+}
+.styles__c-app-icon-default___1Bus5 {
+  color: var(--silver);
+}
+@-moz-keyframes styles__placeHolderShimmer___1L4im {
+  0% {
+    background-position: -20rem 0;
+  }
+  80% {
+    background-position: 20rem 0;
+  }
+  80.1% {
+    background-position: -20rem 0;
+  }
+  100% {
+    background-position: -20rem 0;
+  }
+}
+@-webkit-keyframes styles__placeHolderShimmer___1L4im {
+  0% {
+    background-position: -20rem 0;
+  }
+  80% {
+    background-position: 20rem 0;
+  }
+  80.1% {
+    background-position: -20rem 0;
+  }
+  100% {
+    background-position: -20rem 0;
+  }
+}
+@-o-keyframes styles__placeHolderShimmer___1L4im {
+  0% {
+    background-position: -20rem 0;
+  }
+  80% {
+    background-position: 20rem 0;
+  }
+  80.1% {
+    background-position: -20rem 0;
+  }
+  100% {
+    background-position: -20rem 0;
+  }
+}
+@keyframes styles__placeHolderShimmer___1L4im {
+  0% {
+    background-position: -20rem 0;
+  }
+  80% {
+    background-position: 20rem 0;
+  }
+  80.1% {
+    background-position: -20rem 0;
+  }
+  100% {
+    background-position: -20rem 0;
+  }
+}
+/*  imported from Sections.styl  */
+
+.Sections__Sections__section___19NTf {
+  margin-bottom: 4rem;
+}
+/*  imported from AppsSection.styl  */
+
+.AppsSection__AppsSection___2ujGS {
+  margin-bottom: 1rem;
+}
+.AppsSection__AppsSection__list___31vj8 {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+}
+/*  imported from DropdownFilter.styl  */
+
+.DropdownFilter__Dropdown__icon___3Hpko {
+  padding: 0 0.5rem;
+}
+@media (max-width: 48rem) {
+  .DropdownFilter__Dropdown___28iN3 .DropdownFilter__Select__control___1Hxbx {
+    padding: 0.5rem 0.5rem 0.5rem 0.2rem;
+    border-radius: 0;
+    height: 2.75rem;
+  }
+  .DropdownFilter__Dropdown___28iN3 .DropdownFilter__Select__menu___lmOVW {
+    top: 2rem;
+  }
+  .DropdownFilter__Dropdown___28iN3 > div {
+    max-width: none;
+  }
+}
+/*  imported from styles.styl  */
+
+.styles__AppTile-icon___33KQ3 {
+  object-fit: contain;
+  max-width: 100%;
+  width: auto;
+}
+.styles__AppTile-icon--default___2wl2V {
+  height: 100%;
+  padding: 0 0.5em;
+}
+.styles__AppTile-icon-maintenance___1aQmb {
+  position: absolute;
+  border: 2px solid var(--primaryContrastTextColor);
+  border-radius: 50%;
+  background: var(--primaryContrastTextColor);
+  bottom: 80px;
+  left: 80px;
+}
+@media (max-width: 48rem) {
+  .styles__AppTile-icon-maintenance___1aQmb {
+    bottom: 6px;
+    left: 40px;
+  }
+}
+.styles__AppTile-container-maintenance___KL5F7 {
+  filter: grayscale(1);
+  opacity: 0.64;
+}
+/*  imported from styles.styl  */
+
+.styles__CollectionField__addBtn___1pQLs {
+  margin-left: 0;
+  margin-right: 0;
+}
+.styles__CollectionField__addBtnIcon___rWdyr {
+  margin-right: 0.5rem;
+}
+.styles__CollectionField__row___3JFOW {
+  display: flex;
+  align-items: center;
+}
+.styles__CollectionField__row___3JFOW > * + * {
+  margin-left: 1rem;
+}
+/*  imported from styles.styl  */
+
+.styles__SelectControl___3NQnK[aria-disabled=true],
+.styles__SelectControl___3NQnK[disabled] {
+  cursor: not-allowed;
+  background-color: var(--actionColorDisabledBackground);
+  color: var(--actionColorDisabled);
+}
+.styles__SelectControl___3NQnK[aria-disabled=true]:hover,
+.styles__SelectControl___3NQnK[disabled]:hover,
+.styles__SelectControl___3NQnK[aria-disabled=true]:focus,
+.styles__SelectControl___3NQnK[disabled]:focus {
+  border: 0.063rem solid var(--borderMainColor);
+}
+.styles__SelectControl___3NQnK {
+  display: inline-block;
+  width: 100%;
+  max-width: 32rem;
+  padding: 0.813rem 1rem;
+  box-sizing: border-box;
+  border-radius: 0.188rem;
+  background: var(--paperBackgroundColor);
+  border: 0.063rem solid var(--borderMainColor);
+  font-size: 1rem;
+  line-height: 1.25;
+  color: var(--primaryTextColor);
+  outline: 0;
+}
+.styles__SelectControl___3NQnK::placeholder {
+  color: var(--secondaryTextColor);
+  font-size: 1rem;
+}
+.styles__SelectControl___3NQnK:hover {
+  border: 0.063rem solid var(--hintTextColor);
+}
+.styles__SelectControl___3NQnK:focus {
+  border: 0.063rem solid var(--primaryColor);
+  outline: 0;
+}
+.styles__SelectControl___3NQnK.styles__is-error___2DxUG,
+.styles__SelectControl___3NQnK:not(:focus):invalid {
+  border: 0.063rem solid var(--errorColor);
+}
+.styles__SelectControl___3NQnK {
+  padding-right: 2.375rem;
+}
+.styles__SelectControl___3NQnK {
+  appearance: none;
+  background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxNiAxMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOCA1Ljk5MSAxMy41OTYuMzk1QzEzLjg2LjEzMiAxNC4xOTQgMCAxNC42MDEgMGMuNDA2IDAgLjc0MS4xMzIgMS4wMDQuMzk1UzE2IC45OTMgMTYgMS4zOTljMCAuNDA3LS4xMzIuNzQyLS4zOTUgMS4wMDVsLTYuNiA2LjZhMS4yNTkgMS4yNTkgMCAwIDEtLjQ2Ny4zMDVjLS4xNjcuMDYtLjM0Ny4wOS0uNTM4LjA5LS4xOTEgMC0uMzctLjAzLS41MzgtLjA5YTEuMjU5IDEuMjU5IDAgMCAxLS40NjYtLjMwNWwtNi42MDEtNi42Qy4xMzIgMi4xNCAwIDEuODA2IDAgMS4zOTkgMCAuOTkzLjEzMi42NTguMzk1LjM5NVMuOTkzIDAgMS4zOTkgMGMuNDA3IDAgLjc0Mi4xMzIgMS4wMDUuMzk1TDggNS45OVoiLz48L3N2Zz4=") right 1rem center no-repeat;
+  background-size: 0.875rem;
+  text-align: left;
+}
+.styles__SelectControl___3NQnK::-ms-expand {
+  display: none;
+}
+@media (max-width: 48rem) {
+}
+@media (max-width: 48rem) {
+}
+/*  imported from styles.styl  */
+
+.styles__contact-form-field__wrapper___13Usq {
+  width: calc(100% - 3rem);
+}
+/* imported from styles.styl  */
+
+.styles__container___w8t8I {
+  height: 3rem;
+  display: flex;
+  align-items: center;
+  color: var(--primaryTextColor);
+}
+.styles__contact-group-creation-divider___2lJ2f {
+  width: 100%;
+  border-top: 1px solid var(--dividerColor);
+}
+.styles__contact-group-create-div-icon___xO0pL {
+  display: flex;
+  align-items: center;
+  flex: 1;
+}
+/*since we keep the existing style of
+react-select for the menu and we only
+want to override width & zindex... important
+is important. Right positionning is just set,
+it overrides nothing so there's no need for
+!important */
+.react-select__menu {
+  width: 24rem !important;
+  z-index: 100000 !important;
+  right: 0;
+}
+@media (max-width: 48rem) {
+  .react-select__menu {
+    top: auto !important;
+    width: 100% !important;
+  }
+}
+.react-select__container {
+  display: inline-block;
+  vertical-align: middle;
+}
+.react-select__menu-notice--no-options {
+  color: var(--primaryTextColor);
+  margin-left: 0.5rem !important;
+  height: 3rem;
+  display: flex;
+  align-items: center;
+}
+.react-select__menu-list {
+  text-align: initial;
+}
+@media (max-width: 48rem) {
+  .react-select__menu-list {
+    max-width: inherit !important;
+  }
+}
+/*  imported from styles.styl  */
+
+.styles__menu___1C812 {
+  min-width: fit-content;
+}
+/*  imported from styles.styl  */
+
+.styles__contact___1A48V {
+  color: var(--secondaryTextColor);
+}
+@media (max-width: 48rem) {
+  .styles__contact___1A48V {
+    height: auto;
+  }
+}
+.styles__contact--clickable___3kKvW {
+  cursor: pointer;
+}
+.styles__contact-phone___2fSrd {
+  flex: 0 0 12rem;
+}
+.styles__contact-cozyurl___V4Pb_ {
+  flex: 0 0 12rem;
+}
+.styles__contact-email___2ol8_ {
+  flex-basis: 30%;
+}
+.styles__contact-myself___8Ck4d {
+  color: var(--secondaryTextColor);
+  padding-left: 0.5rem;
+}
+.styles__contact-identity___1PxJr {
+  flex-basis: 30%;
+}
+@media (max-width: 48rem) {
+  .styles__contact-identity___1PxJr {
+    flex: 1 1 auto;
+  }
+}
+.styles__contact-firstname___3BKoY {
+  margin-left: 1rem;
+}
+.styles__contact-avatar___1PilR {
+  flex-shrink: 0;
+}
+/*  imported from styles.styl  */
+
+.styles__icon___bzlGb {
+  margin: 1rem 1.5rem 0 0.5rem;
+}
+/*  imported from styles.styl  */
+
+.styles__ContactsListModal__addContactContainer___3miFk {
+  display: flex;
+  justify-content: center;
+  margin-bottom: 1rem;
+  margin: 0 0.5rem 1rem;
+}
+@media (max-width: 48rem) {
+  .styles__ContactsListModal__addContactContainer___3miFk > * {
+    flex: 1;
+  }
+}
+/*  imported from styles.styl  */
+
+.styles__c-label___24c92 {
+  text-transform: uppercase;
+  color: var(--secondaryTextColor);
+  font-size: 0.813rem;
+  font-weight: bold;
+  line-height: 1rem;
+}
+.styles__c-label___24c92.styles__is-error___1gUPb {
+  color: var(--errorColor);
+}
+.styles__c-label--block___1Zska {
+  display: block;
+  padding: 0.5rem 0;
+}
+@media (max-width: 48rem) {
+}
+@media (max-width: 48rem) {
+}
+/*  imported from styles.styl  */
+
+.styles__o-field___2B6P3 {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  margin: 0.5rem 0 1rem;
+}
+.styles__o-field--inline___3D2bq {
+  display: flex;
+  align-items: flex-start;
+  flex-direction: row;
+  margin: 0.5rem 0 0.5rem 1.5rem;
+}
+@media (max-width: 48rem) {
+  .styles__o-field--inline___3D2bq {
+    flex-direction: column;
+    margin-left: 0;
+  }
+}
+@media (max-width: 48rem) {
+}
+.styles__o-field--inline___3D2bq {
+  margin: 0;
+}
+.styles__o-field--inline___3D2bq label {
+  flex-basis: 8rem;
+  flex-shrink: 0;
+  flex-grow: 0;
+  padding: 1rem 0;
+}
+@media (max-width: 48rem) {
+  .styles__o-field--inline___3D2bq label {
+    flex-basis: auto;
+  }
+}
+.styles__o-field--inline___3D2bq > * {
+  flex-grow: 1;
+}
+.styles__o-field-input___1nDVQ {
+  position: relative;
+  max-width: 32rem;
+}
+.styles__o-side___Pf8h0,
+.styles__o-field-input-action___3pU38 {
+  position: absolute;
+  top: 0.5rem;
+  right: 0;
+  cursor: pointer;
+  text-transform: uppercase;
+}
+.styles__o-side-fullwidth___ztued {
+  max-width: 100%;
+}
+.styles__o-field-input-action___3pU38 {
+  top: -1.5rem;
+  text-transform: uppercase;
+}
+/*  imported from styles.styl  */
+
+.styles__filePickerBreadcrumb-previousPath___2SEdW {
+  color: var(--actionColorActive);
+  cursor: pointer;
+}
+.styles__filePickerBreadcrumb-icon___32TVL {
+  color: var(--actionColorActive);
+  margin: 0 0.25rem;
+}
+@supports (display: contents) {
+  .styles__filePickerBreadcrumb-wrapper___3Xpzb {
+    display: contents;
+  }
+}
+@supports not (display: contents) {
+  .styles__filePickerBreadcrumb-wrapper___3Xpzb {
+    display: flex;
+    flex: 1 1 auto;
+    align-items: center;
+    width: 100%;
+  }
+}
+/*  imported from styles.styl  */
+
+iframe {
+  width: 100%;
+  height: 100%;
+  border: 0;
+}
+.styles__intentContainer___5Zqqq,
+.styles__intentPlaceHolder___1f_u6 {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+/* Don't mess with the spinner centering until the iframe is fully loaded. */
+.styles__intentContainer___5Zqqq[aria-busy=true] iframe {
+  height: 0;
+  width: 0;
+}
+.styles__intentContainer__error___YO3Lz {
+  color: var(--errorColor);
+  font-size: 1.5em;
+}
+/*  imported from styles.styl  */
+
+.styles__SquareAppIcon-wrapper___3aoSx {
+  box-sizing: border-box;
+  border-radius: 100%;
+  height: 4rem;
+  width: 4rem;
+  transition: transform 300ms, border-radius 300ms;
+}
+@media (max-width: 48rem) {
+  .styles__SquareAppIcon-wrapper___3aoSx {
+    height: 4rem;
+    width: 4rem;
+  }
+}
+.styles__SquareAppIcon-wrapper--light___AqjR- {
+  background: linear-gradient(0deg, rgba(255,255,255,0.09) 0%, rgba(255,255,255,0.09) 100%), rgba(255,251,254,0.8);
+}
+.styles__SquareAppIcon-wrapper--dark___36gAK {
+  background: linear-gradient(0deg, rgba(255,255,255,0.09) 0%, rgba(255,255,255,0.09) 100%), #2c3039;
+}
+.styles__SquareAppIcon-icon-container___AZ5_V {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.625rem;
+  border-radius: 100%;
+  width: 100%;
+}
+@media (max-width: 48rem) {
+  .styles__SquareAppIcon-icon-container___AZ5_V {
+    padding: 0.625rem;
+  }
+}
+.styles__SquareAppIcon-icon-container___AZ5_V svg,
+.styles__SquareAppIcon-icon-container___AZ5_V img {
+  width: 100%;
+}
+.styles__SquareAppIcon-wrapper-ghost___2kj_s .styles__SquareAppIcon-icon-container___AZ5_V {
+  mix-blend-mode: screen;
+}
+.styles__SquareAppIcon-wrapper-ghost___2kj_s .styles__SquareAppIcon-icon-container___AZ5_V svg,
+.styles__SquareAppIcon-wrapper-ghost___2kj_s .styles__SquareAppIcon-icon-container___AZ5_V img {
+  filter: saturate(0%);
+}
+.styles__SquareAppIcon-wrapper-ghost___2kj_s .styles__SquareAppIcon-icon-container-normal___2eLgM {
+  mix-blend-mode: luminosity;
+}
+.styles__SquareAppIcon-wrapper-ghost___2kj_s .styles__SquareAppIcon-icon-container-normal___2eLgM svg,
+.styles__SquareAppIcon-wrapper-ghost___2kj_s .styles__SquareAppIcon-icon-container-normal___2eLgM img {
+  opacity: 0.5;
+}
+.styles__SquareAppIcon-wrapper-maintenance___1svWY .styles__SquareAppIcon-icon-container___AZ5_V {
+  mix-blend-mode: luminosity;
+}
+.styles__SquareAppIcon-wrapper-maintenance___1svWY .styles__SquareAppIcon-icon-container___AZ5_V svg,
+.styles__SquareAppIcon-wrapper-maintenance___1svWY .styles__SquareAppIcon-icon-container___AZ5_V img {
+  opacity: 0.5;
+}
+.styles__SquareAppIcon-wrapper-loading___18esc {
+  border-radius: 50%;
+  transform: scale(0.875);
+}
+@media (max-width: 48rem) {
+  .styles__SquareAppIcon-wrapper-loading___18esc {
+    transform: scale(0.8334);
+  }
+}
+.styles__SquareAppIcon-spinner___3J_iT {
+  margin: 0 !important;
+}
+.styles__SquareAppIcon-spinner___3J_iT svg {
+  position: absolute;
+  height: 100%;
+  width: 100%;
+}
+.styles__onEnd___1mc8z {
+  align-items: center;
+  border-radius: 50%;
+  display: flex;
+  height: 100%;
+  opacity: 0;
+  position: absolute;
+  width: 100%;
+  z-index: 1;
+}
+.styles__onEnd___1mc8z svg {
+  fill: transparent !important;
+}
+.styles__onEnd___1mc8z svg path {
+  animation-duration: 0.2s !important;
+}
+.styles__onEnd___1mc8z svg path:first-of-type {
+  animation-delay: 0.2s !important;
+}
+.styles__onEnd___1mc8z svg path+path {
+  animation-delay: 0.36s !important;
+}
+.styles__onEnd___1mc8z svg * {
+  stroke: var(--white) !important;
+}
+.styles__onEnd___1mc8z.styles__isFailed___bp2y0 {
+  --animationColor: var(--errorColor);
+}
+.styles__onEnd___1mc8z.styles__isSuccess___sNM7F {
+  --animationColor: var(--successColor);
+}
+.styles__isSuccess___sNM7F,
+.styles__isFailed___bp2y0 {
+  animation: styles__end-animation___60Hwm 1.5s forwards;
+}
+@-moz-keyframes styles__end-animation___60Hwm {
+  0% {
+    background-color: transparent;
+    border-radius: 50%;
+    opacity: 0;
+  }
+  13.33% {
+    background-color: var(--animationColor);
+    border-radius: 100%;
+    opacity: 1;
+  }
+  66.67% {
+    background-color: var(--animationColor);
+    border-radius: 100%;
+    opacity: 1;
+  }
+  100% {
+    border-radius: 100%;
+    opacity: 0;
+    background-color: transparent;
+  }
+}
+@-webkit-keyframes styles__end-animation___60Hwm {
+  0% {
+    background-color: transparent;
+    border-radius: 50%;
+    opacity: 0;
+  }
+  13.33% {
+    background-color: var(--animationColor);
+    border-radius: 100%;
+    opacity: 1;
+  }
+  66.67% {
+    background-color: var(--animationColor);
+    border-radius: 100%;
+    opacity: 1;
+  }
+  100% {
+    border-radius: 100%;
+    opacity: 0;
+    background-color: transparent;
+  }
+}
+@-o-keyframes styles__end-animation___60Hwm {
+  0% {
+    background-color: transparent;
+    border-radius: 50%;
+    opacity: 0;
+  }
+  13.33% {
+    background-color: var(--animationColor);
+    border-radius: 100%;
+    opacity: 1;
+  }
+  66.67% {
+    background-color: var(--animationColor);
+    border-radius: 100%;
+    opacity: 1;
+  }
+  100% {
+    border-radius: 100%;
+    opacity: 0;
+    background-color: transparent;
+  }
+}
+@keyframes styles__end-animation___60Hwm {
+  0% {
+    background-color: transparent;
+    border-radius: 50%;
+    opacity: 0;
+  }
+  13.33% {
+    background-color: var(--animationColor);
+    border-radius: 100%;
+    opacity: 1;
+  }
+  66.67% {
+    background-color: var(--animationColor);
+    border-radius: 100%;
+    opacity: 1;
+  }
+  100% {
+    border-radius: 100%;
+    opacity: 0;
+    background-color: transparent;
+  }
+}
+/*  imported from styles.styl  */
+
+@-moz-keyframes styles__spin___1u3cT {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(359deg);
+  }
+}
+@-webkit-keyframes styles__spin___1u3cT {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(359deg);
+  }
+}
+@-o-keyframes styles__spin___1u3cT {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(359deg);
+  }
+}
+@keyframes styles__spin___1u3cT {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(359deg);
+  }
+}
+@-moz-keyframes styles__shake___pfzot {
+  10%, 90% {
+    transform: translate3d(-1px, 0, 0);
+  }
+  20%, 80% {
+    transform: translate3d(2px, 0, 0);
+  }
+  30%, 50%, 70% {
+    transform: translate3d(-4px, 0, 0);
+  }
+  40%, 60% {
+    transform: translate3d(4px, 0, 0);
+  }
+}
+@-webkit-keyframes styles__shake___pfzot {
+  10%, 90% {
+    transform: translate3d(-1px, 0, 0);
+  }
+  20%, 80% {
+    transform: translate3d(2px, 0, 0);
+  }
+  30%, 50%, 70% {
+    transform: translate3d(-4px, 0, 0);
+  }
+  40%, 60% {
+    transform: translate3d(4px, 0, 0);
+  }
+}
+@-o-keyframes styles__shake___pfzot {
+  10%, 90% {
+    transform: translate3d(-1px, 0, 0);
+  }
+  20%, 80% {
+    transform: translate3d(2px, 0, 0);
+  }
+  30%, 50%, 70% {
+    transform: translate3d(-4px, 0, 0);
+  }
+  40%, 60% {
+    transform: translate3d(4px, 0, 0);
+  }
+}
+@keyframes styles__shake___pfzot {
+  10%, 90% {
+    transform: translate3d(-1px, 0, 0);
+  }
+  20%, 80% {
+    transform: translate3d(2px, 0, 0);
+  }
+  30%, 50%, 70% {
+    transform: translate3d(-4px, 0, 0);
+  }
+  40%, 60% {
+    transform: translate3d(4px, 0, 0);
+  }
+}
+.styles__upload-queue___3EfQa {
+  border: 0.0625rem solid var(--dividerColor);
+  border-radius: 0.5rem;
+  background-color: var(--paperBackgroundColor);
+  display: flex;
+  flex-direction: column;
+  max-width: 90%;
+  width: 30rem;
+  overflow: hidden;
+}
+.styles__upload-queue__threshold-bar___e-fnL {
+  min-width: 10rem;
+  margin-right: 1rem;
+}
+.styles__upload-queue__progress-caption___37X7k {
+  line-height: 0.75rem;
+  height: 1rem;
+}
+.styles__upload-queue__upload-progress___2Z9qx {
+  align-items: center;
+  display: flex;
+  margin-top: 0.125rem;
+}
+.styles__upload-queue--popover___2Oj-U {
+  z-index: var(--zIndex-popover);
+  border: 0.063rem solid var(--dividerColor);
+  border-radius: 0.5rem;
+  box-shadow: 0 0.063rem 0.188rem 0 rgba(50,54,63,0.19), 0 0.375rem 1.125rem 0 rgba(50,54,63,0.19);
+  background-color: var(--paperBackgroundColor);
+  position: fixed;
+  bottom: 0.5rem;
+  right: 1.5rem;
+  height: 13.125rem;
+  transform: translateY(18.75rem);
+  transition: 0.5s;
+  opacity: 0;
+  visibility: hidden;
+}
+.styles__upload-queue--popover___2Oj-U.styles__upload-queue--visible___3FkzH {
+  opacity: 1;
+  visibility: visible;
+  transform: translate(0);
+}
+.styles__upload-queue-header___1nUv9 {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  height: 2rem;
+  min-height: 2rem;
+  background-color: var(--defaultBackgroundColor);
+  font-weight: bold;
+  margin: 0;
+  padding: 0.5rem 1rem 0.5rem;
+}
+.styles__upload-queue-header___1nUv9 .styles__upload-queue-header-inner___-pA9p {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+progress.styles__upload-queue-progress___3ijZA {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  border: none;
+  display: block;
+  width: 100%;
+  height: 0.125rem;
+  margin: 0;
+}
+.styles__upload-queue-content___29pyu {
+  overflow: auto;
+}
+.styles__upload-queue--collapsed___3Er09 {
+  height: 2.5rem;
+}
+.styles__upload-queue--collapsed___3Er09 .styles__upload-queue-content___29pyu {
+  visibility: none;
+}
+.styles__upload-queue-list___30_J- {
+  flex: 1 1 auto;
+  display: flex;
+  flex-direction: column;
+}
+.styles__upload-queue-item--error___1ChsD {
+  background-color: var(--errorBackground);
+}
+.styles__upload-queue-item--done___1eJjw {
+  background-color: var(--defaultBackgroundColor);
+}
+.styles__item-file___AdWET {
+  user-select: none;
+  overflow: hidden;
+}
+.styles__item-status___2xjeD {
+  flex: 0 0 15%;
+  text-align: right;
+  white-space: nowrap;
+  padding-left: 1rem;
+}
+@media (max-width: 63.938rem) {
+  .styles__upload-queue___3EfQa {
+    border-radius: 0;
+    border: 0;
+    background-color: var(--paperBackgroundColor);
+    box-shadow: none;
+    width: 100%;
+    max-width: 100%;
+    height: auto;
+    transform: none;
+  }
+  .styles__upload-queue-header___1nUv9 {
+    background: 0;
+    text-transform: uppercase;
+    padding: 0.5rem;
+  }
+  .styles__upload-queue-content___29pyu {
+    display: none;
+  }
+  .styles__upload-queue--popover___2Oj-U {
+    top: 3rem;
+    bottom: auto;
+    right: 0;
+    left: 0;
+    z-index: calc(var(--zIndex-app) + 3);
+    max-height: 0;
+  }
+  .styles__upload-queue--popover___2Oj-U:before {
+    position: fixed;
+    top: 2.9375rem;
+    z-index: var(--zIndex-nav);
+    width: 100%;
+    height: 0.0625rem;
+    content: '';
+    background: var(--paperBackgroundColor);
+  }
+  .styles__upload-queue--popover___2Oj-U.styles__upload-queue--visible___3FkzH {
+    max-height: 30%;
+  }
+  .styles__upload-queue--popover___2Oj-U .styles__upload-queue-content___29pyu {
+    display: none;
+  }
+}