/* Custom tweaks layered on top of Unfold defaults. */

@media (min-width: 1024px) {

    /* ── Shrink the label box (covers regular fields + checkboxes) ─
       Unfold's compressed-fields mode pins the label area to 224px
       (lg:w-56). Force it to natural width so input sits next to label. */
    .field-line [class~="lg:w-56"],
    .field-line [class~="lg:min-w-56"] {
        width: auto !important;
        min-width: 6rem !important;     /* 96px — keeps short labels aligned */
        margin-right: 0.75rem;
        flex: 0 0 auto;
    }

    /* ── Cap the input wrapper width ───────────────────────────── */
    .field-line .max-w-2xl,
    .field-line .max-w-3xl,
    .field-line .max-w-xl {
        max-width: 22rem !important;     /* 352px */
    }

    /* Textareas (Platforms, Description...) — no .max-w-2xl wrapper. */
    .field-line .grow textarea {
        max-width: 22rem !important;
        width: 100% !important;
    }

    .field-line .grow textarea.vLargeTextField,
    .field-line .max-w-4xl {
        max-width: 28rem !important;     /* 448px for long-form */
    }

    /* ── Multi-column rows (tuple groupings) ───────────────────── */
    .field-row.grid .field-line .max-w-2xl,
    .field-row.grid .field-line .max-w-3xl,
    .field-row.grid .field-line .max-w-xl,
    .field-row.grid .field-line .grow textarea {
        max-width: 100% !important;
    }

    /* ── Cap single-field rows so they don't stretch full screen ── */
    .form-row:not(.grid) {
        max-width: 720px;
    }
}