/* LabLife — buttons. */
/* pills with a thin light outline; the main action is filled violet */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 0 16px; border-radius: 999px;
  border: 1px solid var(--line-2); background: rgb(255 255 255 / 3%); color: var(--ink);
  font-size: 15px; font-weight: 500; white-space: nowrap;
  transition: border-color .15s ease, box-shadow .2s ease, background-color .15s ease;
}
.btn:hover { border-color: rgb(176 105 247 / 70%); box-shadow: 0 0 18px var(--glow); }
.btn svg { width: 18px; height: 18px; }
.btn-accent {
  background: linear-gradient(135deg, #9148e0, #7a36cc); border-color: rgb(196 150 255 / 45%); color: var(--accent-ink);
  box-shadow: 0 0 22px rgb(142 69 220 / 35%);
}
.btn-ghost { background: transparent; border-color: transparent; padding: 0 10px 0 4px; }
.btn-ghost:hover { border-color: transparent; box-shadow: none; color: var(--accent); }
.btn[aria-expanded="true"] { background: var(--accent-strong); border-color: var(--accent-strong); color: var(--accent-ink); }
/* text-style button, e.g. "Check for updates" in the home footer */
.link-btn {
  appearance: none; background: none; border: 0; margin: -8px 0; padding: 8px 0;
  font: inherit; font-weight: 500; color: var(--accent); cursor: pointer;
  text-decoration: underline; text-underline-offset: 3px;
}
.link-btn:disabled { color: var(--ink-2); text-decoration: none; cursor: default; }