/**
 * HivePress form legibility & sizing.
 *
 * Applies site-wide to every HivePress form (listing submit/update, vendor
 * submit/update, review, account, etc.) — not scoped to a single template.
 * Core HivePress renders every field label identically regardless of
 * required/optional, at a small, low-contrast size, with no distinction
 * from the description/help text underneath it. This file:
 *
 *   1. Raises label size/contrast so it reads as the primary line.
 *   2. De-emphasizes description text so it reads as secondary help copy,
 *      not as an implicit "this field matters" signal.
 *   3. Adds a red required-field asterisk via a class hp-forms.js applies
 *      to labels whose input carries the native HTML `required` attribute
 *      (HivePress itself sets `required` on the input for every required
 *      field — see class-field.php `boot()` — it just never surfaces it
 *      visually).
 *   4. Caps input width to the data type instead of the default full-width
 *      block layout, e.g. a 2-digit percentage or a single number doesn't
 *      need the same width as a title field.
 */

/* 1 + 2 — label / description contrast */
.hp-field__label {
	font-size: 0.95rem;
	font-weight: 600;
	color: #1f2933;
	margin-bottom: 0.3em;
}

.hp-field__description {
	font-size: 0.82rem;
	font-weight: 400;
	color: #6b7280;
	line-height: 1.4;
	margin-top: 0.15em;
	margin-bottom: 0.4em;
}

/* 3 — required marker */
.hp-field__label .ec-required {
	color: #c0392b;
	font-weight: 700;
	margin-left: 0.2em;
}

/* 4 — width caps by input type */
.hp-form__field--number input[type="number"] {
	max-width: 160px;
}

.hp-form__field--select select {
	max-width: 360px;
}

/* Named short-value fields that render as plain text inputs under the
 * hood (compound short answers, not free-form prose) — cap independently
 * of display type since `--number`/`--select` targeting doesn't reach
 * them. Covers both the raw attribute slug and the hp_-prefixed alias,
 * whichever HivePress renders as the field's `name` attribute. */
input[name="deposit_percent"],
input[name="hp_deposit_percent"],
input[name="book_by_days"],
input[name="hp_book_by_days"] {
	max-width: 220px;
}

input[name="tier_meta"],
input[name="hp_tier_meta"] {
	max-width: 340px;
}