/* The "Paint it Black" switch (assets/paint-it-black.js; docs/PAINT_IT_BLACK.md). One small
   button, the same on every page: in the header's right-hand links (Market, Appraisal, shared
   appraisal, Mission briefings, Advertise) and under the return link on /legacy.
   The theme's colours themselves live in each page's own stylesheet
   (html[data-theme="black"] blocks); this file only styles the button. Loaded after the page's
   stylesheet; "button.paint-toggle" outranks each page's plain "button" rules. */
button.paint-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  min-height: 26px;
  margin: 0;
  padding: 3px 9px;
  border: 1px solid #3d484e;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  color: #a9b6bc;
  /* Sentence case at the header links' size: narrow enough to sit beside the 468x60 banner. */
  font: 600 11px/1.2 Inter, "Segoe UI", Arial, sans-serif;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color .15s, color .15s;
}
button.paint-toggle:hover { border-color: #8f9ca3; background: transparent; color: #e7edef; }
button.paint-toggle:focus-visible { outline: 2px solid #83d7c7; outline-offset: 2px; }
/* A small half-black, half-clear disc. */
.paint-toggle-icon {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  border: 1px solid currentColor;
  border-radius: 50%;
  background: linear-gradient(90deg, currentColor 50%, transparent 50%);
}
/* The label follows the attribute from the first paint (it is set in <head>). Both labels share
   one grid cell, so the button keeps the same width either way and nothing in the header moves;
   the hidden one is visibility:hidden, so only the visible label is read out. aria-pressed says
   whether the theme is on. */
.paint-toggle-text { display: grid; }
.paint-toggle-off, .paint-toggle-on { grid-area: 1 / 1; text-align: center; }
.paint-toggle-on { visibility: hidden; }
html[data-theme="black"] .paint-toggle-on { visibility: visible; }
html[data-theme="black"] .paint-toggle-off { visibility: hidden; }
html[data-theme="black"] button.paint-toggle { border-color: #5c5c5c; color: #ededed; }
html[data-theme="black"] button.paint-toggle:hover { border-color: #bdbdbd; color: #ffffff; }
html[data-theme="black"] button.paint-toggle:focus-visible { outline-color: #ffffff; }
html[data-theme="black"] .paint-toggle-icon { background: linear-gradient(90deg, transparent 50%, currentColor 50%); }
/* /legacy: a centred line under "Return to the current Obsidian market intelligence". */
.paint-slot { margin: 14px 0 0; }
@media (prefers-reduced-motion: reduce) { button.paint-toggle { transition: none; } }