.sidebar {
  position: relative;
  left: 0;
  height: 100%;
  width: 248px;
  min-width: 248px;
  background-color: var(--black1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  -webkit-box-flex: 0;
  flex: none;
  z-index: 901;
  will-change: margin-left;
  transform-origin: 0 0;
}

.sidebar-transition {
  transform: none;
  transition-duration: 300ms;
  transition-delay: 0ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.hide-sidebar {
  margin-left: -248px;
  box-shadow: none !important;
  user-select: none;
}

/* .sidebar[data-comp-loaded="false"] {
} */
.sidebar--dragged-over {
  opacity: .1;
  user-select: none;
  pointer-events: none;
  transition: opacity 150ms cubic-bezier(.4, 0, .2, 1);
}

.form-modal-overlay,
.form-overlay {
  position: absolute;
  background-color: transparent;
  height: 100%;
  width: 100%;
}

.form-overlay {
  top: 0;
  left: 0;
  z-index: 1010;
}

.form-modal-overlay {
  top: 36px;
  right: 16px;
  z-index: 1201;
}

.hide-form-overlay {
  display: none!important;
}

.entries__form {
  position: fixed;
  background-color: var(--black1);
  border-radius: 8px;
  box-shadow: var(--box-shadow1);
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 200px;
  max-height: 442px;
  min-width: 300px;
  max-width: 500px;
  width: auto;
  overflow: hidden;
  z-index: 1011;
  transform: scale(1);
  opacity: 1;
  transition-duration: 200ms;
  transition-property: opacity;
  transition-timing-function: ease-in-out;
}

/* .entries__form[data-has-css="false"] {
  display: none;
} */

.hide-form {
  transform: scale(0.9);
  display: none !important;
  user-select: none;
  pointer-events: none;
  opacity: 0;
  z-index: -1;
}

@media screen and (max-width: 840px) {
  .sidebar {
    box-shadow: var(--box-shadow-sbfixed);
    height: calc(100% - 64px);
    top: 64px;
    position: fixed !important;
  }
}

@media screen and (max-width:640px) {
  .entries__form {
    inset: 5% 2% 5% 2% !important;
    margin: auto !important;
    min-width: 180px !important;
  }
}

@media screen and (max-width: 530px) {
  .sidebar {
    top: 54px;
    height: calc(100% - 54px);
  }
}