/* Smooth scroll for html */
html {
  scroll-behavior: smooth;
}

/* Scroll-up button */
.top-anchor {
  /* Local variables (dark default) */
  --anchor-bg: #333;
  --anchor-bg-hover: #444;
  --anchor-text: #fff;
  --anchor-border: #888;
  --anchor-border-hover: #aaa;

  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 40px;
  height: 40px;

  border: 2px solid var(--anchor-border);
  border-radius: 50%;
  background: var(--anchor-bg);
  color: var(--anchor-text);

  font-size: 24px;
  cursor: pointer;
  opacity: 0.7;
  transition: all 0.3s ease;

  display: none;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

/* --- LIGHT THEME OVERRIDES --- */
html.light .top-anchor {
  --anchor-bg: #C8BF9A;
  --anchor-bg-hover: #B0A67A;
  --anchor-text: #2E2A1F;
  --anchor-border: #8C8060;
  --anchor-border-hover: #6E6448;
}

/* Show when JS adds 'show' */
.top-anchor.show {
  display: flex;
}

.top-anchor:hover {
  opacity: 1;
  background: var(--anchor-bg-hover);
  border-color: var(--anchor-border-hover);
}