/* ─────────────────────────────────────────────────────────────────────────────
   #3324 — FlyaDoc, READABLE AT A GLANCE. Loaded by Pages/Shared/_FlyaDocLayout.cshtml only,
   so every page on a FlyaDoc host gets it and docbutterfly.com does not.

   Jeff, call 2026-10-19 [23:54]-[28:06]: "my lines are like barely visible ... box outlines,
   they should probably be somewhere between 40% gray rather than ... sub 20% gray. Once you
   click into it, it's really very visible." Bootstrap's own outline is #dee2e6 (about 13%
   gray) and its helper text is the body color at 75% opacity. On his screen neither read.

   THE TOKENS, NOT THE COMPONENTS. Inputs, selects, checkboxes, input-group labels, list
   groups and cards all draw their outline from --bs-border-color or
   --bs-border-color-translucent, and .text-muted, .form-text and .text-body-secondary all
   read --bs-secondary-color, so setting the tokens reaches every FlyaDoc page, including the
   ones written later. Per theme, at the same specificity as Bootstrap's own blocks and after
   them, so each theme keeps its own values (the #2819 lesson in site.css's header).

   Light: #868e96 is about 3.3:1 on white (40% gray is #999); helper text is #495057.
   Dark: #6c757d is about 3.3:1 on #212529; helper text is #ced4da.
   ───────────────────────────────────────────────────────────────────────────── */

:root:not([data-bs-theme=dark]),
[data-bs-theme=light] {
    --bs-border-color: #868e96;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.45);
    --bs-secondary-color: #495057;
    --bs-tertiary-color: #6c757d;
}

[data-bs-theme=dark] {
    --bs-border-color: #6c757d;
    --bs-border-color-translucent: rgba(255, 255, 255, 0.35);
    --bs-secondary-color: #ced4da;
    --bs-tertiary-color: #adb5bd;
}

/* A placeholder must still read as a placeholder, not as something typed: Bootstrap draws it in
   --bs-secondary-color, which is now nearly body text, so it keeps a lighter gray of its own
   (4.7:1 on white). */
.form-control::placeholder {
    color: #6c757d;
}

[data-bs-theme=dark] .form-control::placeholder {
    color: #adb5bd;
}

/* #3324 — the token balance, top right in the FlyaDoc bar
   (Pages/Shared/Components/CreditBalance/FlyaDoc.cshtml). Jeff [52:37]: "in the top right,
   we have a box that is green". */
.fd-balance {
    font-size: .85rem;
    font-weight: 600;
    white-space: nowrap;
}

.fd-balance-split {
    font-weight: 400;
    opacity: .95;
}
