:root {
  color-scheme: light;
}

body {
  background-image:
    radial-gradient(circle at top left, rgba(184, 137, 61, 0.08), transparent 28%),
    linear-gradient(#f3eee4, #f3eee4);
}

#app-sidebar {
  transition: transform 0.2s ease, width 0.2s ease, padding 0.2s ease;
}

body.nav-open {
  overflow: hidden;
}

@media (min-width: 768px) {
  body.nav-open {
    overflow: auto;
  }
}

@media (max-width: 767px) {
  #app-sidebar {
    transform: translateX(-100%);
    pointer-events: none;
    visibility: hidden;
  }

  body.nav-open #app-sidebar {
    transform: translateX(0);
    pointer-events: auto;
    visibility: visible;
  }
}

@media (min-width: 768px) {
  body.nav-collapsed #app-sidebar {
    width: 0;
    padding-left: 0;
    padding-right: 0;
    overflow: hidden;
    border: 0;
    pointer-events: none;
    visibility: hidden;
  }
}

.nav-collapsed-only {
  display: none;
}

@media (min-width: 768px) {
  body.nav-collapsed .nav-collapsed-only {
    display: flex;
  }
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator {
  opacity: 0.55;
}

[data-chip] button {
  line-height: 1;
}