/* Shared interaction layer, loaded after every page-scoped stylesheet.

   The hover "glow" experiment was removed — a box-shadow glow read as an ugly
   boxed blue shadow, especially on non-card elements (rows, text links, the
   chapter navigator). Native per-component hovers are authoritative again.

   What remains here is intentionally small:
     1. Hold the browse cards at their resting neutral border on hover so they
        never gain the skin's blue box border.
     2. Keep navbar/footer links bare ink (colour brighten only, never a box).
     3. The persistent floating theme toggle. */

@media (hover: hover) {
  /* Browse cards keep their resting neutral border on hover — no blue box. The
     skin's own background + elevation still supply the hover lift.
     :focus-visible keeps its blue ring untouched (keyboard accessibility). */
  html .pg-board-shell .pg-bcard:hover,
  html .si-page .si-card:hover,
  html .sr-page a.sr-card:hover {
    border-color: var(--nb-border);
  }
}

/* Navbar and footer links stay bare ink — only their colour brightens on hover,
   never a pill or box; the active programme keeps the one filled state. */
html .topbar .nav-link:not(.is-active):not([aria-current="page"]):hover,
html .site-footer .ft-link:hover,
html .site-footer .ft-legal-link:hover,
html .nb-footer .nb-footer-links a:hover,
html .nb-footer .nb-footer-legal a:hover {
  background: transparent;
  box-shadow: none;
  color: var(--nb-blue-strong, var(--text-link-hover));
  transition: color var(--hover-dur, 0.2s) var(--ease-expo);
}

/* Persistent theme control. It sits over ordinary page content, but below the
   navbar drawers and auth overlays (their stack begins at z-index 900). */
.ft-theme-toggle {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  min-width: 46px;
  padding: 0;
  overflow: hidden;
  border: 1px solid;
  border-radius: 50%;
  font: inherit;
  cursor: pointer;
  box-shadow: var(--nb-shadow-2, var(--shadow-md));
  transition:
    background-color var(--hover-dur, 0.2s) var(--ease-expo),
    border-color var(--hover-dur, 0.2s) var(--ease-expo),
    box-shadow var(--hover-dur, 0.2s) var(--ease-expo),
    color var(--hover-dur, 0.2s) var(--ease-expo),
    transform var(--hover-dur, 0.2s) var(--ease-expo);
}

html:not(.theme-light) .ft-theme-toggle {
  background: var(--nb-paper-raised, var(--surface-elevated, #171c2a));
  border-color: var(--nb-border-strong, var(--border-2));
  color: var(--nb-blue-strong, var(--accent));
}

html.theme-light .ft-theme-toggle {
  background: var(--nb-paper-raised, var(--surface-elevated, #ffffff));
  border-color: var(--nb-border-strong, var(--border-2));
  color: var(--nb-blue-strong, var(--accent));
}

.ft-theme-toggle .ft-theme-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 20px;
  height: 20px;
  transform: translate(-50%, -50%);
}

html:not(.theme-light) .ft-theme-icon--sun,
html.theme-light .ft-theme-icon--moon {
  display: none;
}

.ft-theme-toggle:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 3px;
}

.ft-theme-toggle:active {
  transform: translateY(0) scale(var(--press-scale, 0.98));
}

@media (hover: hover) {
  html:not(.theme-light) .ft-theme-toggle:hover,
  html.theme-light .ft-theme-toggle:hover {
    border-color: var(--nb-blue, var(--accent));
    box-shadow: var(--nb-shadow-2, var(--shadow-md));
    transform: translateY(var(--lift-sm, -1px));
  }
}

html.note-focus-mode .ft-theme-toggle {
  display: none !important;
}

@media (max-width: 1023px) {
  .ft-theme-toggle {
    display: none !important;
  }
}

/* Topic Questions owns the bottom-right corner on desktop. On compact screens
   the toggle returns to the established top-right band opposite Chapters. */
body:has(.tq-shell) .ft-theme-toggle,
body:has(.nb-qg-body) .ft-theme-toggle {
  bottom: 152px;
}

@media (max-width: 860px) {
  body:has(.tq-shell) .ft-theme-toggle,
  body:has(.nb-qg-body) .ft-theme-toggle {
    top: calc(var(--nv-topbar-h, 64px) + 10px);
    bottom: auto;
  }

  body:has(.nb-qg-body) .nb-notes-header .nb-breadcrumb {
    padding-right: 64px;
  }
}