/* QPal Shared Library active-category indicator.
   Presentation only: no metadata, import, synchronization, or network logic. */
.qpal-shared-library-tabs button.is-active {
  position: relative;
  isolation: isolate;
  border-width: 2px !important;
  border-color: var(--accent) !important;
  background:
    linear-gradient(
      135deg,
      var(--accent) 0%,
      color-mix(in srgb, var(--accent-hover) 72%, var(--accent)) 100%
    ) !important;
  color: var(--accent-contrast) !important;
  box-shadow:
    0 0 0 3px var(--focus-ring),
    0 9px 22px color-mix(in srgb, var(--accent) 22%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
  font-weight: 900 !important;
  transform: translateY(-1px);
}

.qpal-shared-library-tabs button.is-active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 4px;
  width: 28px;
  height: 3px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.92;
  transform: translateX(-50%);
  pointer-events: none;
}

.qpal-shared-library-tabs button.is-active:hover,
.qpal-shared-library-tabs button.is-active:focus-visible {
  border-color: var(--accent-hover) !important;
  background:
    linear-gradient(
      135deg,
      var(--accent-hover) 0%,
      color-mix(in srgb, var(--accent) 82%, var(--accent-hover)) 100%
    ) !important;
  color: var(--accent-contrast) !important;
  box-shadow:
    0 0 0 4px var(--focus-ring),
    0 10px 24px color-mix(in srgb, var(--accent) 27%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
}