/* RHSC Join a Member Group form — layout.

   Deliberately small. Almost everything is inherited:
     - controls (inputs, selects, the pill shape) from assets/css/forms.css
     - fields, floating labels, checkboxes, reveals, errors, counters, buttons,
       nav, honeypot and the hidden iframe from
       assets/css/pattern-styles/membership-form.css, whose rules are scoped
       either bare (.rhsc-field, .rhsc-check, .rhsc-reveal, .rhsc-error,
       .rhsc-btn, .rhsc-nav, .rhsc-hp, .rhsc-capsule-sink, .rhsc-section-title,
       .rhsc-group-title, .rhsc-counter) or to .rhsc-form.

   Both are declared as dependencies in functions.php, so this file only holds
   what those two cannot give a form that is NOT .rhsc-membership-form: the
   width cap, the [hidden] override and .rhsc-btn:disabled, which are the only
   three rules there scoped to that class.

   The group-level error rule that used to live here is gone: it is now
   .rhsc-reveal--inline > .rhsc-error in membership-form.css, shared by every
   form with an any-of checkbox group.

   Markup contract: patterns/join-group-form.php.
   Behaviour: assets/js/join-group-form.js. */

/* 760px, where the membership and subscribe forms both use 720px.

   Deliberate divergence, not drift. This form shares one constrained container
   with the "Good to know" copy directly above it (the wp:html block is the last
   child of that same wp:group), and the pair is specified as a literal 8-of-12
   column of the 1140px contentSize in theme.json = 760px. Matching the other
   forms at 720px would misalign the form against the copy it sits under.

   The parent group also carries contentSize:760px so the copy matches. Both
   numbers must move together — see tools/rebuild-join-group-page.php, which
   warns when the parent is missing it.

   padding rather than margin so the max-width still measures the content box
   and the form stays 760px on desktop. */
.rhsc-join-group-form {
	max-width: 760px;
	margin-inline: auto;
	padding-inline: 20px;
}

@media (min-width: 782px) {
	.rhsc-join-group-form {
		padding-inline: 0;
	}
}

/* The SAS and language reveals are collapsed with the `hidden` attribute so the
   accessibility tree matches the visual state.

   membership-form.css carries the equivalent rule but scopes its !important to
   .rhsc-membership-form, so it does not reach this form. The !important is not
   decoration: css-framework.css loads site-wide and its display utilities would
   otherwise win over the UA's [hidden] rule, leaving the language checkboxes
   visible before consent is ticked — and submittable-looking while disabled. */
.rhsc-join-group-form [hidden] {
	display: none !important;
}

/* membership-form.css:657 scopes :disabled to .rhsc-membership-form, so without
   this the submit button still looks live after it has been pressed — the one
   moment it must not, since the guard against a duplicate Capsule lead is that
   the button never re-enables. Declarations copied from that rule rather than
   re-invented. Disabled controls are exempt from WCAG 1.4.3, so the
   low-contrast label is deliberate. */
.rhsc-join-group-form .rhsc-btn:disabled {
	background: var(--wp--preset--color--neutral-50, #B5B3B8);
	border-color: var(--wp--preset--color--neutral-50, #B5B3B8);
	color: var(--wp--preset--color--neutral-05, #F6F6F6);
	cursor: not-allowed;
}