/* ─── /settings.html — operator-local preferences ──────────────────
   Extracted from the dashboard S3TT1NGS tab. Same
   minimal-chrome pattern as /flow.html and /logs.html: the back-link
   header + title (.page-header / .page-back / .page-title) live in
   @hive/shared/chrome.css; only the page body padding + the notif-toggle
   row are page-specific and live here. */

body.settings-shell {
  margin: 0;
  padding: 0;
}

.settings-main {
  padding: 1.2em 1.5em 2em;
}

/* Browser-notification toggle row (moved verbatim from dashboard.css —
   the buttons + status that NOTIF.bind() in common.js wires up). */
.notif-row {
  display: flex;
  gap: 0.5em;
  align-items: center;
  margin: 0.5em 0;
  font-size: 0.85em;
}
.btn-notif {
  font-family: inherit;
  font-size: 0.85em;
  background: transparent;
  color: var(--cyan);
  border: 1px solid var(--cyan);
  padding: 0.2em 0.7em;
  border-radius: 999px;
  cursor: pointer;
  text-shadow: 0 0 4px currentColor;
}
.btn-notif:hover {
  background: color-mix(in srgb, var(--cyan) 10%, transparent);
  box-shadow: 0 0 10px -2px currentColor;
}