/* Layout only — field colors, borders, and typography are intentionally
   left to the active theme's own input/label/textarea/select styles
   (most block themes define these globally via theme.json) rather than
   overridden here, so these forms visually match the rest of the site. */

.mascusa-registration-form,
.mascusa-login-form {
	max-width: 480px;
}

.mascusa-registration-form .mascusa-field,
.mascusa-login-form .mascusa-field {
	margin-bottom: 1em;
}

.mascusa-registration-form label,
.mascusa-login-form label {
	display: block;
	margin-bottom: 0.25em;
}

.mascusa-registration-form input,
.mascusa-registration-form select,
.mascusa-registration-form textarea,
.mascusa-login-form input {
	width: 100%;
	box-sizing: border-box;
}

.mascusa-submit-buttons {
	margin-top: 1.5em;
}

.mascusa-membership-options {
	border: 1px solid currentColor;
	border-radius: 4px;
	padding: 1em;
	margin: 0 0 1.5em;
}

.mascusa-membership-options legend {
	padding: 0 0.5em;
}

.mascusa-membership-option {
	display: flex;
	align-items: center;
	gap: 0.5em;
	margin-bottom: 0.5em;
}

.mascusa-membership-option:last-child {
	margin-bottom: 0;
}

.mascusa-membership-option input[type="radio"] {
	width: auto;
	flex-shrink: 0;
}

.mascusa-login-form .mascusa-field-checkbox label {
	display: flex;
	align-items: center;
	gap: 0.5em;
	font-weight: normal;
}

.mascusa-login-form .mascusa-field-checkbox input {
	width: auto;
}

.mascusa-login-form .mascusa-lost-password {
	font-size: 0.9em;
}

.mascusa-registration-form .mascusa-login-prompt,
.mascusa-login-form .mascusa-register-prompt {
	font-size: 0.9em;
	margin-top: 1.5em;
}

.mascusa-registration-form .mascusa-form-errors,
.mascusa-login-form .mascusa-form-errors {
	background: #fdecea;
	border: 1px solid #f5c2c0;
	border-radius: 4px;
	padding: 0.75em 1em;
	margin-bottom: 1em;
}

.mascusa-registration-form .mascusa-error,
.mascusa-login-form .mascusa-error {
	color: #a94442;
	margin: 0;
}

.mascusa-payment-form #mascusa-stripe-element {
	padding: 12px;
	border: 1px solid currentColor;
	border-radius: 4px;
	margin-bottom: 1em;
	max-width: 480px;
}

.mascusa-payment-form #mascusa-payment-status {
	margin-bottom: 1em;
}

/* [mascusa_membership_payment] — unlike #mascusa-stripe-element above,
   this container has no other content to give it a width, so without an
   explicit width the Stripe iframe can mount before layout gives it any
   measurable space and render at 0/-1px. */
.mascusa-payment-form #mascusa-membership-stripe-element {
	width: 100%;
	box-sizing: border-box;
	padding: 12px;
	border: 1px solid currentColor;
	border-radius: 4px; 
	max-width: 480px;
}

.mascusa-payment-form #mascusa-membership-payment-status {
	margin-bottom: 1em;
	font-size: 12px;
	margin-top: 5px;
}

.mascusa-payment-form #mascusa-payment-amount {
	font-weight: 600;
	font-size: 1.1em;
	margin-bottom: 1em;
}

/* ------------------------------------------------------------------ */
/* [mascusa_account_page] shortcode                                   */
/* ------------------------------------------------------------------ */

.mascusa-account-wrap {
	max-width: 640px;
}

.mascusa-account-section {
	margin-bottom: 2.5em;
}

.mascusa-account-section h2 {
	font-size: 1.1em;
	border-bottom: 1px solid color-mix(in srgb, currentColor 15%, transparent);
	padding-bottom: 0.5em;
	margin-bottom: 1em;
}

.mascusa-account-table {
	width: 100%;
	border-collapse: collapse;
}

.mascusa-account-table th,
.mascusa-account-table td {
	text-align: left;
	padding: 0.5em 0.75em 0.5em 0;
	border-bottom: 1px solid color-mix(in srgb, currentColor 15%, transparent);
	vertical-align: middle;
}

.mascusa-account-table th {
	width: 40%;
	font-weight: 600;
}

.mascusa-account-links {
	font-size: 0.9em;
}

.mascusa-household-invite {
	background: #f0f7ff;
	border: 1px solid #cfe3fc;
	border-radius: 6px;
	padding: 1.5em;
}

.mascusa-household-invite h2 {
	border-bottom: none;
	margin-bottom: 0.5em;
}

.mascusa-household-invite-form {
	margin-top: 1em;
}

.mascusa-rejected-note {
	margin-top: 1em;
	padding: 0.75em 1em;
	background: #fdecea;
	border: 1px solid #f5c2c0;
	border-radius: 4px;
	color: #a94442;
}

.mascusa-notice {
	padding: 0.75em 1em;
	border-radius: 4px;
	margin-bottom: 1.5em;
}

.mascusa-notice p {
	margin: 0;
}

.mascusa-notice-success {
	background: #edfaef;
	border: 1px solid #b7e4c7;
	color: #1e6b34;
}

.mascusa-notice-error {
	background: #fdecea;
	border: 1px solid #f5c2c0;
	color: #a94442;
}

/* Shared badge styling (mirrors assets/css/admin.css so the same status
   colors are used in wp-admin and on the member-facing account page). */
.mascusa-badge {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
}

.mascusa-badge-created { background: #e2e3e5; color: #383d41; }
.mascusa-badge-pending { background: #fff3cd; color: #7a5b00; }
.mascusa-badge-approved { background: #d4edda; color: #155724; }
.mascusa-badge-rejected { background: #f8d7da; color: #721c24; }