/*
 * App-wide form chrome.
 *
 * Separate from app-shell.css (which owns the scroll model) and
 * app-assistant.css (the command bar), so each file stays one concern.
 *
 * Loaded after theme.min.css so these win.
 */

:root {
    /*
     * Placeholder colour.
     *
     * DESIGN DECISION (2026-08-06, user-reported): the theme's #91a1b6 sits at
     * roughly 3:1 against white — close enough to real input text that example
     * values ("chest", "Barbell Row", "100") read as data already entered
     * rather than as hints. Users were filling forms believing fields were
     * pre-populated.
     *
     * These values back off to roughly 2:1, which is the point of a
     * placeholder: legible when looked at, clearly not a value when scanned.
     * They are deliberately NOT pushed further — a placeholder nobody can read
     * is no better than a misleading one.
     */
    --app-placeholder-color: #aebacb;
}

/*
 * In dark mode "lighter" means closer to the background, not brighter: the
 * theme's #50566e against #0f172a is the same too-solid look inverted.
 */
html.app-skin-dark {
    --app-placeholder-color: #434a63;
}

/*
 * The theme sets its placeholder colour with !important across a list of
 * vendor-prefixed selectors, so matching it takes the same shape — a plain
 * ::placeholder rule here would simply lose.
 */
.custom-file::placeholder,
.custom-select::placeholder,
.form-control::placeholder,
.form-select::placeholder,
input::placeholder,
textarea::placeholder {
    color: var(--app-placeholder-color) !important;
    opacity: 1;                 /* Firefox dims placeholders again by default */
}

.custom-file::-moz-placeholder,
.custom-select::-moz-placeholder,
.form-control::-moz-placeholder,
.form-select::-moz-placeholder,
input::-moz-placeholder,
textarea::-moz-placeholder {
    color: var(--app-placeholder-color) !important;
    opacity: 1;
}

.custom-file::-webkit-input-placeholder,
.custom-select::-webkit-input-placeholder,
.form-control::-webkit-input-placeholder,
.form-select::-webkit-input-placeholder,
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: var(--app-placeholder-color) !important;
    opacity: 1;
}

/*
 * A select's "choose one" option is the same idea as a placeholder — an empty
 * value, not a choice — so it gets the same treatment. The chosen options must
 * stay at full strength, hence the :not().
 */
select.form-select option[value=""],
select.form-control option[value=""] {
    color: var(--app-placeholder-color);
}