/* Fabrica Monetization Kit - Paywall Styles */
/* Note: shared.css is enqueued separately */

/* ============================================
   Paywall Block
   ============================================ */
.fmk-paywall {
	margin: 24px 0;
	padding: 24px;
	background: #fff;
	border: 1px solid var(--fmk-border);
	border-radius: var(--fmk-radius);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	font-family: sans-serif;

	/* Option buttons use shared .fmk-option-btn styles */
	/* Inline checkout uses shared .fmk-checkout styles (shared.css) */
}
.fmk-paywall__login-section {
		margin-bottom: 24px;
	}
.fmk-paywall__prompt {
		margin: 0 0 16px 0;
		font-size: 20px;
		font-weight: 600;
		color: var(--fmk-text);
		text-align: center;
	}
.fmk-paywall__status {
		margin: 0 0 16px 0;
		font-size: 14px;
		color: var(--fmk-text-muted);
	}
.fmk-paywall__login-form {
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
		justify-content: center;
	}
.fmk-paywall__login-form input {
			flex: 1;
			min-width: 150px;
			padding: 12px;
			font-family: inherit;
			font-size: 16px;
			border: 2px solid var(--fmk-border);
			border-radius: var(--fmk-radius-sm);
			box-sizing: border-box;
			transition: border-color 0.2s;
		}
.fmk-paywall__login-form input:focus {
				border-color: var(--fmk-primary);
				outline: none;
			}
.fmk-paywall__section {
		margin: 20px 0;
	}
.fmk-paywall__section-title {
		margin: 0 0 12px 0;
		font-size: 14px;
		font-weight: 600;
		color: var(--fmk-text-muted);
		text-transform: uppercase;
		letter-spacing: 0.5px;
		text-align: center;
	}
.fmk-paywall__actions {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
		gap: 10px;
	}
.fmk-paywall__notice {
		padding: 12px 16px;
		margin-bottom: 16px;
		font-size: 13px;
		line-height: 1.5;
		border-radius: var(--fmk-radius-sm);
	}
.fmk-paywall__notice p {
			margin: 0;
		}
.fmk-paywall__notice--warning {
			background: var(--fmk-warning-bg);
			border: 1px solid var(--fmk-warning-border);
			color: var(--fmk-warning-text);
		}
.fmk-paywall__notice--info {
			background: var(--fmk-info-bg, #e7f3ff);
			border: 1px solid var(--fmk-info-border, #b3d7ff);
			color: var(--fmk-info-text, #004085);
		}

/* ============================================
   Registration Wall
   ============================================ */
.fmk-regwall {
	margin: 24px 0;
	padding: 24px;
	background: #fff;
	border: 1px solid var(--fmk-border);
	border-radius: var(--fmk-radius);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	font-family: sans-serif;
}
.fmk-regwall__prompt {
		margin: 0 0 20px 0;
		font-size: 20px;
		font-weight: 600;
		color: var(--fmk-text);
		text-align: center;
	}
.fmk-regwall__forms {
		max-width: 420px;
		margin: 0 auto;
	}
.fmk-regwall__section-title {
		margin: 0 0 12px 0;
		font-size: 14px;
		font-weight: 600;
		color: var(--fmk-text-muted);
		text-align: center;
	}
.fmk-regwall__divider {
		display: flex;
		align-items: center;
		margin: 20px 0;
		color: var(--fmk-text-muted);
		font-size: 13px;
	}
.fmk-regwall__divider::before,
		.fmk-regwall__divider::after {
			content: '';
			flex: 1;
			height: 1px;
			background: var(--fmk-border);
		}
.fmk-regwall__divider span {
			padding: 0 12px;
		}
.fmk-regwall__form-row {
		margin-bottom: 12px;
	}
.fmk-regwall__form-row label {
			display: block;
			font-size: 13px;
			font-weight: 500;
			color: #333;
			margin-bottom: 6px;
		}
.fmk-regwall__form-row input[type="email"],
		.fmk-regwall__form-row input[type="text"],
		.fmk-regwall__form-row input[type="password"] {
			width: 100%;
			padding: 12px;
			font-family: inherit;
			font-size: 16px;
			border: 2px solid var(--fmk-border);
			border-radius: var(--fmk-radius-sm);
			box-sizing: border-box;
			transition: border-color 0.2s;
		}
.fmk-regwall__form-row input[type="email"]:focus, .fmk-regwall__form-row input[type="text"]:focus, .fmk-regwall__form-row input[type="password"]:focus {
				border-color: var(--fmk-primary);
				outline: none;
			}
.fmk-regwall__form-row-group {
		display: flex;
		gap: 12px;
		margin-bottom: 12px;
	}
.fmk-regwall__form-row-group .fmk-regwall__form-row {
			flex: 1;
			margin-bottom: 0;
		}

/* ============================================
   Metering Counter
   ============================================ */
.fmk-metering-counter {
	padding: 10px 16px;
	margin-bottom: 20px;
	font-size: 13px;
	color: var(--fmk-info-text, #004085);
	background: var(--fmk-info-bg, #e7f3ff);
	border: 1px solid var(--fmk-info-border, #b3d7ff);
	border-radius: var(--fmk-radius-sm);
	text-align: center;
}

/* ============================================
   Membership Block
   ============================================ */
.fmk-membership {
	margin: 24px 0;
	padding: 24px;
	background: #fff;
	border: 1px solid var(--fmk-border);
	border-radius: var(--fmk-radius);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	font-family: sans-serif;

	/* Inline checkout uses shared .fmk-checkout styles (shared.css) */
}
.fmk-membership__heading {
		margin: 0 0 16px 0;
		font-size: 18px;
		font-weight: 600;
		color: var(--fmk-text);
		text-align: center;
	}
/* Reuse paywall section layout */
.fmk-membership .fmk-paywall__section {
		margin: 0;
	}
.fmk-membership .fmk-paywall__section-title {
		margin: 0 0 12px 0;
		font-size: 13px;
		font-weight: 500;
		color: var(--fmk-text-muted);
		text-transform: uppercase;
		letter-spacing: 0.5px;
		text-align: center;
	}
.fmk-membership .fmk-paywall__actions {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
		gap: 10px;
	}
.fmk-membership__success {
		text-align: center;
		padding: 30px 20px;
	}
.fmk-membership__success-icon {
		font-size: 48px;
		line-height: 1;
		margin-bottom: 16px;
		color: var(--fmk-success, #28a745);
	}
.fmk-membership__success-title {
		margin: 0 0 8px 0;
		font-size: 20px;
		font-weight: 600;
		color: var(--fmk-success, #28a745);
	}
.fmk-membership__success-message {
		margin: 0;
		font-size: 14px;
		color: var(--fmk-text-muted, #666);
	}
.fmk-membership__member {
		text-align: center;
		padding: 8px 0 4px;
	}
.fmk-membership__member-icon {
		font-size: 36px;
		line-height: 1;
		margin-bottom: 12px;
		color: var(--fmk-success, #28a745);
	}
.fmk-membership__member-heading {
		margin: 0 0 6px 0;
		font-size: 17px;
		font-weight: 600;
		color: var(--fmk-text);
	}
.fmk-membership__member-message {
		margin: 0 0 14px 0;
		font-size: 14px;
		color: var(--fmk-text-muted, #666);
	}

/* Accessible visually-hidden text (WP fallback) */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
}

/* ============================================
   Account Block/Shortcode
   ============================================ */
.fmk-account {
	margin: 24px auto;
	padding: 24px;
	background: #fff;
	border: 1px solid var(--fmk-border);
	border-radius: var(--fmk-radius);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);

	/* Active financial relationships + contributions ledger — share spacing */

	/* Inline-row layout for both recurring + one-off contribution rows */
}
.fmk-account__heading {
		margin: 0 0 20px 0;
		font-size: 20px;
		font-weight: 600;
		color: var(--fmk-text);
		text-align: center;
	}
.fmk-account__login-form .fmk-account__field {
			margin-bottom: 16px;
		}
.fmk-account__login-form .fmk-account__field label {
				display: block;
				font-size: 13px;
				font-weight: 500;
				color: #333;
				margin-bottom: 6px;
			}
.fmk-account__login-form .fmk-account__field input {
				width: 100%;
				padding: 12px;
				font-family: inherit;
				font-size: 16px;
				border: 2px solid var(--fmk-border);
				border-radius: var(--fmk-radius-sm);
				box-sizing: border-box;
				transition: border-color 0.2s;
			}
.fmk-account__login-form .fmk-account__field input:focus {
					border-color: var(--fmk-primary);
					outline: none;
				}
.fmk-account__actions {
		margin-top: 16px;
	}
.fmk-account__button {
		display: inline-block;
		padding: 14px 24px;
		font-family: inherit;
		font-size: 16px;
		font-weight: 600;
		line-height: 1;
		text-align: center;
		text-decoration: none;
		background: var(--fmk-primary);
		color: #fff;
		border: none;
		border-radius: var(--fmk-radius-sm);
		cursor: pointer;
		transition: background-color 0.2s;
	}
.fmk-account__button:hover,
		.fmk-account__button:focus {
			background: var(--fmk-primary-hover);
			color: #fff;
		}
.fmk-account__button--primary {
			width: 100%;
		}
.fmk-account__button--secondary {
			background: transparent;
			color: var(--fmk-primary);
			border: 1px solid var(--fmk-primary);
			padding: 8px 16px;
			font-size: 14px;
		}
.fmk-account__button--secondary:hover,
			.fmk-account__button--secondary:focus {
				background: var(--fmk-primary);
				color: #fff;
			}
.fmk-account__message {
		padding: 12px 16px;
		margin-top: 16px;
		font-size: 14px;
		background: #fff;
		border: 1px solid var(--fmk-border);
		border-radius: var(--fmk-radius-sm);
	}
.fmk-account__message--error {
			background: var(--fmk-error-bg);
			border-color: var(--fmk-error-border);
			color: var(--fmk-error-text);
		}
.fmk-account__message[hidden] {
			display: none;
		}
.fmk-account__reset-link {
		margin-top: 20px;
		text-align: center;
		font-size: 14px;
	}
.fmk-account__reset-link a {
			color: var(--fmk-primary);
			text-decoration: none;
		}
.fmk-account__reset-link a:hover {
				text-decoration: underline;
			}
/* Logged in view */
.fmk-account__header {
		margin-bottom: 20px;
		padding-bottom: 16px;
		border-bottom: 1px solid var(--fmk-border);
	}
.fmk-account__user {
		margin: 0;
		font-size: 16px;
		text-align: center;
		color: var(--fmk-text);
	}
.fmk-account__status {
		margin: 0 0 12px 0;
		font-size: 14px;
	}
.fmk-account__status--active {
			color: var(--fmk-success);
			font-weight: 600;
		}
.fmk-account__status--cancelling {
			color: var(--fmk-text-muted);
			font-style: italic;
		}
.fmk-account__entitlements {
		margin-bottom: 20px;
	}
.fmk-account__section-heading {
		margin: 0 0 12px 0;
		font-size: 14px;
		font-weight: 600;
		color: var(--fmk-text);
	}
.fmk-account__section {
		margin-bottom: 12px;
		padding: 16px;
		background: var(--fmk-bg-light);
		border: 1px solid var(--fmk-border);
		border-radius: var(--fmk-radius-sm);
	}
.fmk-account__section h5 {
			margin: 0 0 8px 0;
			font-size: 13px;
			font-weight: 500;
			color: var(--fmk-text-muted);
		}
.fmk-account__list {
		margin: 0;
		padding: 0;
		list-style: none;
	}
.fmk-account__list li {
			padding: 4px 0;
			font-size: 14px;
		}
.fmk-account__list li a {
				color: var(--fmk-primary);
				text-decoration: none;
			}
.fmk-account__list li a:hover {
					text-decoration: underline;
				}
.fmk-account__empty {
		color: var(--fmk-text-muted);
		font-size: 14px;
		font-style: italic;
		text-align: center;
	}
.fmk-account__subscription,
	.fmk-account__memberships,
	.fmk-account__recurring-contributions,
	.fmk-account__contributions {
		margin-bottom: 20px;
	}
.fmk-account__subscription > .fmk-account__button, .fmk-account__memberships > .fmk-account__button, .fmk-account__recurring-contributions > .fmk-account__button, .fmk-account__contributions > .fmk-account__button {
			margin-top: 12px;
		}
.fmk-account__memberships .fmk-account__list li,
	.fmk-account__subscription .fmk-account__list li,
	.fmk-account__recurring-contributions .fmk-account__list li,
	.fmk-account__contributions .fmk-account__list li {
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 8px;
		padding: 6px 0;
	}
.fmk-account__contribution-amount {
		font-weight: 600;
		color: var(--fmk-success);
	}
.fmk-account__contribution-campaign {
		color: var(--fmk-text);
	}
.fmk-account__contribution-date {
		color: var(--fmk-text-muted);
		font-size: 13px;
	}
.fmk-account__contribution-tier {
		color: var(--fmk-text-muted);
		font-size: 13px;
		font-style: italic;
		margin-left: 4px;
	}
.fmk-account__access-note {
		color: var(--fmk-text-muted);
		font-size: 12px;
		margin-left: 8px;
	}
.fmk-account__expiry {
		color: var(--fmk-text-muted);
		font-size: 12px;
		margin-left: 8px;
	}
.fmk-account__expiry--expired {
			color: var(--fmk-error-text);
		}
.fmk-account__item--expired a {
		color: var(--fmk-text-muted);
	}
.fmk-account__footer {
		display: flex;
		justify-content: center;
		gap: 24px;
		margin-top: 20px;
		padding-top: 16px;
		border-top: 1px solid var(--fmk-border);
	}
.fmk-account__link {
		color: var(--fmk-text-muted);
		font-size: 14px;
		text-decoration: none;
	}
.fmk-account__link:hover {
			color: var(--fmk-primary);
			text-decoration: underline;
		}