/* Benecaster Launch signup form.
 * Uses the theme's shared .bc-form / .bc-btn contract; only signup-specific
 * layout lives here so the theme keeps ownership of the visual identity.
 *
 * Deliberately NOT a reuse of checkout.css: that file carries the order
 * summary, interval selector and add-on rules this page has none of, and a
 * later checkout layout change would silently move this page.
 */

.bc-signup__form {
	max-width: 32rem;
}
.bc-signup__address {
	border: 0;
	padding: 0;
	margin: 0 0 1rem 0;
}
#bc-signup-payment-element {
	margin: 0.5rem 0;
	min-height: 2.5rem;
}
.bc-signup__card {
	margin-top: 1rem;
}
/* The "not charged" notice sits between the heading and the card field; the
   theme's .bc-form__banner gives it its look, this only spaces it. */
.bc-signup__no-charge {
	margin: 0 0 0.75rem 0;
}
#bc-signup-error[data-state="error"] {
	color: #991b1b;
}
/* A returning customer is not an error — see showNotice() in launch-signup.js. */
#bc-signup-error[data-state="notice"] {
	color: #1e3a5f;
}
/* A country with no postal-code system disables rather than hides the field,
   so the customer sees why it stopped being asked of them. */
#bc-signup-postal-code:disabled {
	opacity: 0.5;
}

/* ⚠⚠ **RESTORES `hidden` ON THIS PAGE'S OWN MARKUP, BECAUSE THE BROWSER'S RULE
 * CAN BE BEATEN BY A SINGLE LINE IN A THEME.** `[hidden] { display: none }` is a
 * *user-agent* rule, so ANY author rule setting `display` on the same element
 * outranks it outright and the element renders with the attribute still set.
 * The theme's `.bc-page .bc-form__field { display: flex }` did exactly that on
 * `/checkout/`, painting four empty boxes onto a live payment page; see the long
 * note in `checkout.css` for that instance.
 *
 * ⚠⚠ **THIS PAGE IS NOT AFFECTED TODAY, AND THAT IS WHY THE RULE IS HERE.** Its
 * toggled elements (the card panel and the error banner) happen to carry classes the theme does not
 * style — which is luck, not design, and one class rename away from the same
 * defect. **There is no runtime signal when it happens**: nothing throws, no
 * PHP test can observe computed style, and there is no vitest config in this
 * repository, so the only way it surfaces is somebody looking at the page.
 *
 * ⚠ **`!important` is deliberate.** Our selector and a theme's can have
 * identical specificity, so the winner would otherwise be decided by stylesheet
 * order between a theme and a plugin — which neither side controls and which
 * changes silently. `hidden` means *not rendered in any presentation*, so there
 * is no legitimate rule for this to override.
 *
 * ⚠ **Pinned by `tests/Architecture/HiddenAttributeRestoredTest.php`**, which
 * fails the build if this rule goes, and which also fails on a NEW page of this
 * plugin's own that hides markup without carrying the same line. **Do not delete
 * it if the theme is ever fixed** — this is what stops the plugin-side rules
 * being dropped as redundant, which would put the whole thing back the moment a
 * theme is changed or replaced. */
.bc-signup [hidden] {
	display: none !important;
}

/* "Card details" heads the card step; it is not a field label.
 *
 * Styled as a section heading because Stripe's own "Card number" label sits
 * directly beneath it, inside Stripe's iframe, and when both used the field
 * label look the customer read two labels for one box. Stripe's side follows
 * assets/js/stripe-appearance.js and cannot be told apart from ours, so the
 * difference is made here: larger, bolder, with a rule under it.
 *
 * currentColor rather than a fixed colour, because the theme's page is dark
 * and a hard-coded grey rule would vanish on it. color-mix() softens the rule
 * where supported; the plain currentColor line before it is the fallback. */
.bc-signup__card-heading {
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 1rem 0;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid currentColor;
	border-bottom-color: color-mix( in srgb, currentColor 30%, transparent );
}