/* "Easier-to-read admin": always on the operator admin; on an organiser's
   admin while Site settings → Admin panel → Easier-to-read admin is ticked
   (admin/base_site.html). admin-readability.js does the rest: the 9pt
   minimum, greys drawn directly in Django's CSS, and the Text A− A+ buttons.

   Light theme only for the colours: in dark mode black text and dark-blue
   links would vanish, so the dark theme keeps its own. */
@media (prefers-color-scheme: light) {
  html:not([data-theme="dark"]) {
    --body-fg: #000; --body-medium-color: #000; --body-quiet-color: #000;
    --link-fg: #102375; --link-hover-color: #0b1a5c;
  }
}
html[data-theme="light"] {
  --body-fg: #000; --body-medium-color: #000; --body-quiet-color: #000;
  --link-fg: #102375; --link-hover-color: #0b1a5c;
}

/* Links in the page content: underlined so they read as links. */
#content a:link, #content a:visited {
  color: var(--link-fg);
  text-decoration: underline;
  text-underline-offset: 2px;
}
#content a:hover, #content a:focus { color: var(--link-hover-color); }

/* …but not the main menu (the app list on the admin home: no underline, like
   the left-hand menu), not things drawn as buttons or bar headings, and not
   the column headings you click to sort. */
#content :is([class^="app-"].module, .object-tools, .submit-row, thead, .sortoptions,
            .module caption, .module h2) a:is(:link, :visited),
#content a:is(.button, .deletelink, .addlink, .changelink, .viewlink):is(:link, :visited) {
  text-decoration: none;
}
#content :is(.module caption, .module h2) a:is(:link, :visited, :hover, :focus) { color: #ffffff; }
#content :is(.object-tools a, a.button, .submit-row a):is(:link, :visited, :hover, :focus) { color: var(--button-fg); }

/* The Text A− A+ buttons in the top bar. */
.text-size-tool { white-space: nowrap; text-transform: none; letter-spacing: normal; }
.text-size-tool .current { display: inline-block; min-width: 2.4em; text-align: center; }
.text-size-tool button {
  background: transparent; border: 1px solid currentColor; border-radius: 4px;
  color: inherit; cursor: pointer; font: inherit; line-height: 1.2; margin: 0 1px; padding: 0 0.35rem;
}
.text-size-tool button:hover, .text-size-tool button:focus { background: rgba(255, 255, 255, 0.15); }
