/* buttons.css — one rule for every button on the site. Linked LAST in
 * base.html and landing.html so nothing a page adds can undo it.
 *
 * 1. Every button, and every control that acts as one (tabs, chips, the
 *    billing switch, menu items), is set in Times New Roman and nothing else.
 * 2. Every button's text is dark black. There are no white-on-dark buttons:
 *    a button that needs to say "danger" or "selected" says it with a light
 *    fill and a coloured edge, so the black text always reads. Those fills
 *    live with each button's own rules (admin.css, feedback.css,
 *    authored.css, topic.css, status-pages.css); keep them light.
 * 3. High-contrast mode turns the page black; buttons there become yellow
 *    with black text instead of black-on-black.
 *
 * The one exception is the dyslexia-friendly font: a reader who turns it on
 * in the accessibility panel gets it on buttons too.
 */

:root { --btn-ink: #111111; }

:is(button, input[type="button"], input[type="submit"], input[type="reset"],
    [role="button"], [role="tab"],
    .btn, .au-tab, .au-chip, .nav-icon-btn, .login-btn, .sv-btn, .sv-chip,
    .admin-tab, .tab-btn, .settings-seg-btn, .fbx-seg-btn, .a11y-btn, .umenu-item,
    .bookmarks-bulk-btn, .lp-billing__switch label, .topic-mic-btn,
    .au-save, .status-appeal a) {
  font-family: "Times New Roman", Times, serif !important;
  color: var(--btn-ink) !important;
  -webkit-text-fill-color: var(--btn-ink) !important;
}
/* The words inside a button (labels, counts, the "Save up to" pill) take
   the button's font and colour rather than a smaller muted one of their own. */
:is(button, [role="button"], [role="tab"], .btn, .au-tab, .au-chip, .nav-icon-btn,
    .login-btn, .sv-btn, .sv-chip, .admin-tab, .tab-btn, .settings-seg-btn,
    .fbx-seg-btn, .a11y-btn, .umenu-item, .bookmarks-bulk-btn,
    .lp-billing__switch label, .au-save, .status-appeal a) :where(span, strong, em, b, i, small, s, abbr) {
  font-family: inherit !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

html.dyslexic :is(button, input[type="button"], input[type="submit"], input[type="reset"],
    [role="button"], [role="tab"], .btn, .au-tab, .au-chip, .nav-icon-btn, .login-btn,
    .sv-btn, .sv-chip, .admin-tab, .tab-btn, .settings-seg-btn, .fbx-seg-btn, .a11y-btn,
    .umenu-item, .bookmarks-bulk-btn, .lp-billing__switch label, .topic-mic-btn,
    .au-save, .status-appeal a) {
  font-family: 'OpenDyslexic', 'Comic Sans MS', cursive !important;
}

/* Disabled and locked buttons fade, but never so far that they vanish. */
.btn:disabled, button:disabled, .sv-btn[disabled], .bookmarks-bulk-btn:disabled,
.acct-btn:disabled, .btn.admin-clear-btn:disabled, .fbx-delete:disabled { opacity: 0.6; }
.au-tab.is-locked { opacity: 0.8; }
.au-chip-n { opacity: 1; }

/* ── High contrast: yellow buttons, black words ─────────────────────────── */
html.high-contrast :is(button, input[type="button"], input[type="submit"], input[type="reset"],
    [role="button"], [role="tab"], .btn, .au-tab, .au-chip, .nav-icon-btn, .login-btn,
    .sv-btn, .sv-chip, .admin-tab, .tab-btn, .settings-seg-btn, .fbx-seg-btn, .a11y-btn,
    .umenu-item, .bookmarks-bulk-btn, .lp-billing__switch label, .topic-mic-btn,
    .au-save, .status-appeal a) {
  background: #FFFF00 !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  border-color: #000000 !important;
}
/* Both halves of the billing switch are yellow there, so the chosen half is
   marked with a black ring and underline instead of the sliding thumb. */
html.high-contrast .lp-billing__thumb { display: none; }
html.high-contrast .lp-billing:has(#bill-monthly:checked) label[for="bill-monthly"],
html.high-contrast .lp-billing:has(#bill-annual:checked) label[for="bill-annual"] {
  box-shadow: inset 0 0 0 3px #000000;
  text-decoration: underline;
}
