/**
 * Tampilan laman "Login Anggota" ([login_form]) dan "Daftar Akun" ([register_form]) —
 * Restrict Content Pro cuma menghasilkan markup form polos tanpa styling, jadi dibungkus
 * jadi kartu yang rapi dan konsisten dengan warna brand BisaIoT. Cuma di-load di kedua
 * laman itu (lihat bsi_live_enqueue_auth_css() di bisaioti-live.php).
 */

.bsi-auth-wrap {
	--bsi-auth-accent: #2563eb;
	--bsi-auth-accent-dark: #1d4ed8;
	--bsi-auth-text: #1f2937;
	--bsi-auth-muted: #6b7280;
	--bsi-auth-border: #e2e5ea;
	max-width: 460px;
	margin: 8px auto 56px;
	padding: 0 16px;
}

.bsi-auth-card {
	background: #fff;
	border: 1px solid var(--bsi-auth-border);
	border-radius: 18px;
	padding: 36px 30px;
	box-shadow: 0 10px 30px -12px rgba(15, 23, 42, .12), 0 2px 8px rgba(15, 23, 42, .04);
}

.bsi-auth-subtitle {
	margin: 0 0 26px;
	padding: 0 4px;
	color: var(--bsi-auth-muted);
	font-size: 14px;
	line-height: 1.55;
	text-align: center;
}

/* ---------- Reset markup polos RCP (h3, fieldset, dst) ---------- */

.bsi-auth-card .rcp_header {
	margin: 0 0 22px;
	font-size: 19px;
	font-weight: 700;
	color: var(--bsi-auth-text);
	text-align: center;
}

.bsi-auth-card .rcp_form,
.bsi-auth-card .rcp_form fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

.bsi-auth-card .rcp_form p {
	margin: 0 0 18px;
}

.bsi-auth-card .rcp_form p:last-child {
	margin-bottom: 0;
}

.bsi-auth-card .rcp_form label {
	display: block;
	margin: 0 0 7px;
	font-size: 13px;
	font-weight: 600;
	color: var(--bsi-auth-text);
}

/* Nama depan/belakang berdampingan (RCP kasih class inline / inline-block) */
.bsi-auth-card .rcp_form p.inline,
.bsi-auth-card .rcp_form p.inline-block {
	display: inline-block;
	width: calc(50% - 8px);
	vertical-align: top;
}

.bsi-auth-card .rcp_form p.inline {
	margin-right: 16px;
}

@media (max-width: 480px) {
	.bsi-auth-card .rcp_form p.inline,
	.bsi-auth-card .rcp_form p.inline-block {
		width: 100%;
		margin-right: 0;
	}
}

/* ---------- Input teks ---------- */

.bsi-auth-card .rcp_form input[type="text"],
.bsi-auth-card .rcp_form input[type="email"],
.bsi-auth-card .rcp_form input[type="password"],
.bsi-auth-card .rcp_form input[type="tel"] {
	box-sizing: border-box;
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--bsi-auth-border);
	border-radius: 10px;
	background: #f9fafb;
	color: var(--bsi-auth-text);
	font-size: 14px;
	line-height: 1.4;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.bsi-auth-card .rcp_form input[type="text"]:focus,
.bsi-auth-card .rcp_form input[type="email"]:focus,
.bsi-auth-card .rcp_form input[type="password"]:focus,
.bsi-auth-card .rcp_form input[type="tel"]:focus {
	outline: none;
	background: #fff;
	border-color: var(--bsi-auth-accent);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .15);
}

.bsi-auth-card .rcp_form ::placeholder {
	color: #9aa1ac;
}

/* ---------- Checkbox (Remember me / Auto Renew) ---------- */

.bsi-auth-card .rcp_form p:has(> input[type="checkbox"]) {
	display: flex;
	align-items: center;
	gap: 9px;
}

.bsi-auth-card .rcp_form input[type="checkbox"] {
	width: 17px;
	height: 17px;
	accent-color: var(--bsi-auth-accent);
	flex: none;
}

.bsi-auth-card .rcp_form p:has(> input[type="checkbox"]) label {
	margin: 0;
	font-size: 13px;
	font-weight: 500;
	color: var(--bsi-auth-muted);
}

/* ---------- Link lupa sandi & sudah punya akun ---------- */

.bsi-auth-card .rcp_lost_password {
	text-align: right;
	margin-top: -10px !important;
}

.bsi-auth-card .rcp_lost_password a,
.bsi-auth-card .rcp_login_link a {
	color: var(--bsi-auth-accent);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}

.bsi-auth-card .rcp_lost_password a:hover,
.bsi-auth-card .rcp_login_link a:hover {
	text-decoration: underline;
}

.bsi-auth-card .rcp_login_link {
	margin: 0 0 24px;
	padding-bottom: 20px;
	border-bottom: 1px solid #eef0f3;
	text-align: center;
	font-size: 13px;
	color: var(--bsi-auth-muted);
}

/* ---------- Tombol submit ---------- */

.bsi-auth-card .rcp_form input[type="submit"],
.bsi-auth-card .rcp_form .rcp-button {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-top: 6px;
	padding: 13px 16px;
	border: 0;
	border-radius: 10px;
	background: var(--bsi-auth-accent);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .01em;
	cursor: pointer;
	transition: background .15s ease, transform .05s ease;
}

.bsi-auth-card .rcp_form input[type="submit"]:hover,
.bsi-auth-card .rcp_form .rcp-button:hover {
	background: var(--bsi-auth-accent-dark);
}

.bsi-auth-card .rcp_form input[type="submit"]:active,
.bsi-auth-card .rcp_form .rcp-button:active {
	transform: scale(.99);
}

/* ---------- Pilihan level keanggotaan (form Daftar Akun) ---------- */

.bsi-auth-card ul#rcp_subscription_levels {
	list-style: none;
	margin: 4px 0 20px;
	padding: 0;
}

.bsi-auth-card li.rcp_subscription_level {
	position: relative;
	list-style: none;
	margin-bottom: 10px;
	padding: 15px 16px 15px 44px;
	border: 1.5px solid var(--bsi-auth-border);
	border-radius: 12px;
	transition: border-color .15s ease, background .15s ease;
}

.bsi-auth-card li.rcp_subscription_level:has(input:checked) {
	border-color: var(--bsi-auth-accent);
	background: rgba(37, 99, 235, .05);
}

.bsi-auth-card li.rcp_subscription_level input[type="radio"] {
	position: absolute;
	left: 16px;
	top: 18px;
	accent-color: var(--bsi-auth-accent);
	width: 16px;
	height: 16px;
}

.bsi-auth-card li.rcp_subscription_level label {
	display: block;
	margin: 0;
	font-weight: 500;
	cursor: pointer;
}

.bsi-auth-card .rcp_subscription_level_name {
	display: block;
	font-size: 15px;
	font-weight: 700;
	color: var(--bsi-auth-text);
	margin-bottom: 2px;
}

.bsi-auth-card .rcp_subscription_level_details,
.bsi-auth-card .rcp_subscription_level_description {
	display: block;
	font-size: 13px;
	color: var(--bsi-auth-muted);
}

/* ---------- Ringkasan total / metode pembayaran ---------- */

.bsi-auth-card .rcp_registration_total,
.bsi-auth-card .rcp_gateway_fields {
	margin: 0 0 18px;
	padding: 14px 16px;
	background: #f8fafc;
	border-radius: 10px;
	font-size: 14px;
	color: var(--bsi-auth-text);
}

.bsi-auth-card .rcp_registration_total:empty,
.bsi-auth-card .rcp_gateway_fields:empty {
	display: none;
}

/* ---------- Pesan error / sukses bawaan RCP ---------- */

.bsi-auth-card .rcp_message,
.bsi-auth-card div.error,
.bsi-auth-card #rcp_registration_form > p:first-child:not([id]) {
	margin: 0 0 20px;
	padding: 12px 14px;
	border-radius: 10px;
	background: #fef2f2;
	border: 1px solid #fecaca;
	color: #b91c1c;
	font-size: 13px;
	line-height: 1.5;
}

.bsi-auth-card .rcp_message.success {
	background: #f0fdf4;
	border-color: #bbf7d0;
	color: #15803d;
}