/*
 * The asterisk on a required field's label, which Bootstrap does not have.
 *
 * `.required` appears zero times in bootstrap.css and is styled three times in tabler.css, so this
 * fills a gap under plain Bootstrap. Written in Tabler's shape deliberately - same class name, same
 * pseudo-element, same 0.25rem gap - so a form does not shift when a page changes template.
 *
 * THIS RULE WINS UNDER TABLER, WHICH IS NOT WHAT THE OTHER GAP-FILLERS HERE DO.
 *
 * button-action.css and table-sort.css describe themselves as losing the cascade to Tabler's more
 * finished versions. That is not what happens to this one, and the difference is where it is
 * contributed from: a theme's stylesheet is a page-level contribution, while this comes from a
 * field's renderHead, which runs later. Measured on the samples contact page, the loaded order is
 * tabler.css at position 2 and this at position 4.
 *
 * So it cannot be written as a Bootstrap-only fallback and left to be overridden - it has to produce
 * the right answer under both templates on its own. Only one ::after exists per element, so whichever
 * rule wins supplies all of it, and here that is always this one.
 *
 * That is what the color chain is for. Tabler hardcodes #d63939 and exposes it as --tblr-danger;
 * Bootstrap exposes --bs-danger and defines no --tblr-*. Asking for both in order lands on the
 * active template's own danger color - verified as rgb(214, 57, 57) under Tabler, matching its
 * literal exactly - and a theme that recolors danger recolors this with it. The literal fallback
 * is Bootstrap's $danger, for a page that somehow has neither.
 *
 * THE FLOATING LABEL IS COVERED HERE AND NOWHERE ELSE.
 *
 * Tabler styles .form-label, .col-form-label and .form-check-label, and not the label inside
 * .form-floating - which is a real label, not a placeholder, and reads as optional without this.
 */

.form-label.required::after,
.col-form-label.required::after,
.form-check-label.required::after,
.form-floating > label.required::after {
	content: "*";
	margin-left: 0.25rem;
	color: var(--bs-danger, var(--tblr-danger, #dc3545));
}