/* LifeMuse-specific Avo overrides */

.avo-sidebar.application-sidebar {
  background:
    linear-gradient(
      to bottom,
      rgba(51, 51, 51, 0.78) 0%,
      rgba(51, 51, 51, 0.9) 40%,
      rgba(51, 51, 51, 0.96) 100%
    ),
    url("/avo-assets/lifemuse-sidebar-texture.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.avo-sidebar.application-sidebar .mac-styled-scrollbar {
  background: transparent !important;
}

.application-sidebar a,
.application-sidebar .text-gray-500,
.application-sidebar .text-gray-700,
.application-sidebar .text-black {
  color: #ffffff !important;
}

.application-sidebar a svg,
.application-sidebar .text-gray-500 svg,
.application-sidebar .text-gray-700 svg,
.application-sidebar .text-black svg {
  color: #ffffff !important;
}

.application-sidebar .active,
.application-sidebar .active:hover {
  color: #fcd45a !important;
  background-color: rgba(252, 212, 90, 0.16) !important;
  box-shadow: 0 0 12px rgba(252, 212, 90, 0.32);
}

.application-sidebar .active svg,
.application-sidebar .active:hover svg {
  color: #fcd45a !important;
}

.main-content-area,
.content {
  background-color: #f6f6f7;
}

.button-component[class*="bg-primary-500"] {
  background-color: #333333 !important;
  border-color: #333333 !important;
  color: #ffffff !important;
}

.button-component[class*="bg-primary-500"]:hover,
.button-component[class*="bg-primary-500"]:active {
  background-color: #333333 !important;
  border-color: #333333 !important;
  color: #ffffff !important;
}

.breadcrumbs a {
  color: #007aff !important;
}

.breadcrumbs svg {
  color: #c7c7cc !important;
}

.logo-placeholder {
  align-items: center;
  background-color: #333333;
  border-radius: 8px;
  display: inline-flex !important;
  height: 100%;
  justify-content: center;
  max-width: fit-content;
  padding: 0.4rem 0.65rem;
}

.logo-placeholder img {
  height: 0.9rem;
}

.pagy-gem-version-8-or-more .pagy.nav a:not(.gap) {
  color: #000000 !important;
}

.pagy-gem-version-8-or-more .pagy.nav a.current {
  color: #ffffff !important;
  background-color: #000000 !important;
  border-color: #000000 !important;
}
