.loading-spinner__container {
  display: flex;
  max-width: 24rem;
  align-items: center;
  justify-content: center;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-primary-900) / var(--tw-bg-opacity));
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  padding-top: 0.75rem;
  padding-bottom: 0.5rem;
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.loading-spinner__xs {
  position: relative;
  height: 1rem;
  width: 1rem;
}

.loading-spinner__sm {
  position: relative;
  height: 1.25rem;
  width: 1.25rem;
}

.loading-spinner__md {
  position: relative;
  height: 1.5rem;
  width: 1.5rem;
}

.loading-spinner__lg {
  position: relative;
  height: 2rem;
  width: 2rem;
}

.loading-spinner__xl {
  position: relative;
  height: 2.5rem;
  width: 2.5rem;
}

.loading-spinner__2xl {
  position: relative;
  height: 3rem;
  width: 3rem;
}

.loading-spinner__svg {
  animation: loadingSpinnerRotate 2s linear infinite;
}

.loading-spinner__svg-path {
  stroke: #68d391;
  stroke-linecap: round;
  animation: loadingSpinnerdash 1.5s ease-in-out infinite;
}

@keyframes loadingSpinnerRotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes loadingSpinnerdash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}

@keyframes loading-spinner__slide-up {
  from {
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes loading-spinner__slide-down {
  from {
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 100%, 0);
  }
}

.loading-spinner__slide-up {
  animation: loading-spinner__slide-up 0.5s ease-in-out;
}

.loading-spinner__slide-down {
  animation: loading-spinner__slide-down 0.5s ease-in-out;
}
.editor-drawer {
  position: fixed;
  display: flex;
  height: 100vh;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-white) / var(--tw-bg-opacity));
  right: 0px;
  top: 0px;
  width: 100%;
  z-index: 501;
  animation: slideIn 0.25s ease 0s 1 normal forwards;
}

@media (min-width: 768px) {
  .editor-drawer {
    width: 48rem;
  }

  .editor-drawer--large {
    width: 64rem;
  }

  .editor-drawer--small {
    width: 32rem;
  }
}

.editor-drawer__close {
  left: -52px;
  z-index: -1;
}

[dir="rtl"] .editor-drawer__close {
  left: auto;
  right: -52px;
}

[dir="rtl"] .editor-drawer {
  right: auto;
  left: 0;
  animation: slideIn--rtl 0.25s ease 0s 1 normal forwards;
}

@keyframes slideIn {
  0% {
    right: -9999px;
  }
}

@keyframes slideIn--rtl {
  0% {
    left: -9999px;
  }
}

.blanket {
  bottom: 0px;
  left: 0px;
  position: fixed;
  right: 0px;
  top: 0px;
  z-index: 500;
  animation-name: blanket-animation;
  animation-duration: 0.15s;
  animation-fill-mode: forwards;
}

@keyframes blanket-animation {
  from {
    background: rgba(3, 4, 5, 0);
    --tw-backdrop-blur: blur(0);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
  }
  to {
    background: rgba(3, 4, 5, 0.75);
    --tw-backdrop-blur: blur(4px);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
  }
}
.tooltip {
  position: relative;
}

.tooltip__bubble {
  position: absolute;
  z-index: 9999;
  display: none;
}

.tooltip__bubble::after {
  content: "";
  position: absolute;
}

.tooltip__bubble--top {
  bottom: 100%;
  left: 50%;
  padding-bottom: 9px;
  transform: translateX(-50%);
}

.tooltip__bubble--top::after {
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-top: 9px solid #453c52;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.tooltip__bubble--bottom {
  top: 100%;
  left: 50%;
  padding-top: 9px;
  transform: translateX(-50%);
}

.tooltip__bubble--bottom::after {
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-bottom: 9px solid #453c52;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.tooltip__bubble--start {
  top: 50%;
  inset-inline-end: 100%;
  padding-inline-end: 9px;
  transform: translateY(-50%);
}

.tooltip__bubble--start::after {
  border-inline-start: 9px solid #453c52;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  top: 50%;
  inset-inline-end: 0;
  transform: translateY(-50%);
}

.tooltip__bubble--end {
  top: 50%;
  inset-inline-start: 100%;
  padding-inline-start: 9px;
  transform: translateY(-50%);
}

.tooltip__bubble--end::after {
  border-inline-end: 9px solid #453c52;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  top: 50%;
  inset-inline-start: 0;
  transform: translateY(-50%);
}

.tooltip__trigger {
  width: 100%;
}

.tooltip__trigger:hover + .tooltip__bubble {
  display: block;
}
.notifications__entry-card.notifications__entry-card--unread:hover
  .notifications__entry-card-buttons,
.notifications__entry-card.notifications__entry-card--unread:focus-within
  .notifications__entry-card-buttons {
  opacity: 1;
}

.notifications__entry-card.notifications__entry-card--unread:hover
  .notifications__entry-card-time,
.notifications__entry-card.notifications__entry-card--unread:focus-within
  .notifications__entry-card-time {
  opacity: 0;
}

.notifications__entry-unread-dot {
  left: -0.5rem;
}

@media (min-width: 768px) {
  .notifications__entry-unread-dot {
    left: -0.75rem;
  }
}
/* Checkbox */

.checkbox__label {
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
}

.checkbox__input {
  appearance: none;
  margin: 0;
  font: inherit;
  color: currentColor;
  width: 18px;
  height: 18px;
  border-radius: 0.15em;
  transform: translateY(-0.075em);
  display: grid;
  place-content: center;
  cursor: pointer;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-primary-200) / var(--tw-border-opacity));
}

.checkbox__input::before {
  content: "";
  width: 10px;
  height: 10px;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 16px 16px white;
  transform-origin: bottom left;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.checkbox__input:checked::before {
  transform: scale(1);
}

.checkbox__input:disabled + .checkbox__label {
  pointer-events: none;
  cursor: not-allowed;
}

.checkbox__input:not([disabled]) + .checkbox__label:hover div:first-child {
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-primary-500) / var(--tw-border-opacity));
}

.checkbox__input:checked {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-primary-500) / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
}

.checkbox__input:focus {
  outline: none;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-primary-500) / var(--tw-border-opacity));
}

.checkbox__input:hover {
  border-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-primary-500) / var(--tw-border-opacity));
}

.checkbox__input:disabled {
  color: grey;
  cursor: not-allowed;
}