/* Restrict Content Master - Frontend Styles */

.rcm-locked-box {
	background: #fff8e6;
	border: 1px solid #f0d98c;
	border-radius: 6px;
	padding: 16px 20px;
	margin-bottom: 20px;
}

.rcm-locked-text {
	margin: 0;
	font-size: 15px;
	color: #6b5300;
}

.rcm-page-wrap {
	max-width: 420px;
}

.rcm-divider {
	border: none;
	border-top: 1px dashed #ccc;
	margin: 24px 0;
}

.rcm-field-hint {
	display: block;
	font-size: 12px;
	color: #777;
	font-weight: normal;
	margin-top: 4px;
}

.rcm-login-wrap {
	background: #fff;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	padding: 20px;
	margin-bottom: 20px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.rcm-signup-wrap {
	background: #fff;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	padding: 20px;
	margin-bottom: 20px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.rcm-form-title {
	margin-top: 0;
	font-size: 18px;
}

.rcm-signup-form label,
.rcm-login-form label {
	display: block;
	margin-bottom: 4px;
	font-weight: 600;
	font-size: 14px;
}

.rcm-signup-form input,
.rcm-login-form input {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #ccc;
	border-radius: 5px;
	font-size: 14px;
	box-sizing: border-box;
}

.rcm-submit-btn {
	background: #2271b1;
	color: #fff;
	border: none;
	padding: 10px 20px;
	border-radius: 5px;
	cursor: pointer;
	font-size: 14px;
}

.rcm-submit-btn:hover {
	background: #135e96;
}

/* Logged-in status box — mobile number + green indicator + Logout,
   Login form ki jagah dikhta hai jab member pehle se logged-in ho */
.rcm-login-status-box {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	background: #f0faf3;
	border: 1px solid #b7e4c7;
	border-radius: 6px;
	padding: 12px 16px;
}

.rcm-login-status-label {
	font-size: 13px;
	color: #555;
	font-weight: 600;
}

.rcm-login-status-mobile {
	font-size: 15px;
	font-weight: 700;
	color: #1b5e20;
	letter-spacing: 0.5px;
}

.rcm-login-status-indicator {
	color: #2e7d32;
	font-size: 14px;
	line-height: 1;
}

.rcm-logout-btn {
	margin-left: auto;
	background: #c0392b;
}

.rcm-logout-btn:hover {
	background: #96281b;
}

.rcm-form-response {
	margin-top: 12px;
	padding: 14px 16px;
	border-radius: 6px;
	font-size: 14px;
	border-left: 4px solid transparent;
	line-height: 1.6;
}

.rcm-form-response.success {
	background: #e7f7ec;
	color: #1a6f3c;
	border-left-color: #2e8b57;
	box-shadow: 0 2px 4px rgba(46, 139, 87, 0.1);
}

.rcm-form-response.error {
	background: #fdeaea;
	color: #9c1c1c;
	border-left-color: #d32f2f;
	box-shadow: 0 2px 4px rgba(211, 47, 47, 0.1);
}

.rcm-whatsapp-box {
	margin-top: 16px;
	padding: 14px;
	background: #e9fbf0;
	border: 1px solid #b7e4c7;
	border-radius: 6px;
}

.rcm-whatsapp-btn {
	display: inline-block;
	margin-top: 8px;
	background: #25D366;
	color: #fff !important;
	text-decoration: none;
	padding: 10px 18px;
	border-radius: 5px;
	font-weight: 600;
}

.rcm-whatsapp-btn:hover {
	background: #1ebe5b;
}

.rcm-whatsapp-instruction {
	margin: 0 0 14px 0;
	font-size: 14px;
	color: #1a6f3c;
}

/* Contact info block — WhatsApp + Email + QR code */
.rcm-contact-block {
	background: #fff;
	border: 1px solid #dcdcdc;
	border-radius: 8px;
	padding: 16px;
}

.rcm-contact-title {
	margin: 0 0 14px 0;
	font-size: 16px;
	color: #333;
}

.rcm-qr-box {
	text-align: center;
	margin-bottom: 18px;
	padding-bottom: 16px;
	border-bottom: 1px dashed #ddd;
}

.rcm-qr-image {
	max-width: 220px;
	width: 100%;
	height: auto;
	border: 1px solid #e2e2e2;
	border-radius: 6px;
	padding: 6px;
	background: #fff;
}

.rcm-qr-caption {
	margin: 8px 0 0 0;
	font-size: 13px;
	color: #666;
}

.rcm-contact-row {
	margin-bottom: 16px;
	padding-bottom: 16px;
	border-bottom: 1px solid #f0f0f0;
}

.rcm-contact-row:last-of-type {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.rcm-contact-label {
	display: block;
	font-size: 13px;
	color: #888;
	font-weight: 600;
}

.rcm-contact-value {
	display: block;
	font-size: 16px;
	font-weight: 700;
	color: #222;
	margin: 2px 0 10px 0;
	word-break: break-all;
}

.rcm-contact-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.rcm-action-btn {
	display: inline-block;
	border: none;
	border-radius: 5px;
	padding: 8px 14px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
}

.rcm-wa-btn {
	background: #25D366;
	color: #fff !important;
}

.rcm-wa-btn:hover {
	background: #1ebe5b;
}

.rcm-email-btn {
	background: #2271b1;
	color: #fff !important;
}

.rcm-email-btn:hover {
	background: #135e96;
}

.rcm-copy-btn {
	background: #f1f1f1;
	color: #333 !important;
	border: 1px solid #ccc !important;
}

.rcm-copy-btn:hover {
	background: #e4e4e4;
}

.rcm-inquiry-note {
	margin: 16px 0 0 0;
	padding-top: 14px;
	border-top: 1px dashed #ddd;
	font-size: 13px;
	color: #b45f06;
	font-weight: 600;
	text-align: center;
}

/* Admin styles */
.rcm-row-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

.rcm-inline-form {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin: 0;
}

.rcm-status {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 12px;
	font-size: 12px;
	font-weight: 600;
	text-transform: capitalize;
}

.rcm-status-pending { background: #fff3cd; color: #856404; }
.rcm-status-active { background: #d4edda; color: #155724; }
.rcm-status-expired { background: #e2e3e5; color: #383d41; }
.rcm-status-rejected { background: #f8d7da; color: #721c24; }
.rcm-status-suspended { background: #f8d7da; color: #721c24; }

.rcm-admin-form .form-table th {
	width: 220px;
}

/* ========== Mobile-Responsive Admin Styles ========== */

/* Tablet aur desktop — normal table */
@media (min-width: 768px) {
	.rcm-inline-form {
		display: inline-flex;
		gap: 4px;
	}

	.rcm-inline-form input,
	.rcm-inline-form select,
	.rcm-inline-form button {
		height: 32px;
		padding: 4px 8px;
	}

	.rcm-inline-form input {
		width: 60px;
	}

	.rcm-inline-form select {
		width: auto;
	}
}

/* Mobile — stack everything vertically */
@media (max-width: 767px) {
	.rcm-admin-wrap {
		padding: 10px;
	}

	.rcm-admin-wrap h1 {
		font-size: 20px;
		margin-bottom: 10px;
	}

	.rcm-admin-wrap .page-title-action {
		display: block;
		margin-top: 8px;
	}

	/* Members list table — scroll horizontally on mobile */
	.rcm-admin-wrap table {
		font-size: 13px;
		width: 100%;
		overflow-x: auto;
		display: block;
	}

	.rcm-admin-wrap table thead,
	.rcm-admin-wrap table tbody {
		display: block;
		width: 100%;
	}

	.rcm-admin-wrap table tr {
		display: block;
		margin-bottom: 12px;
		border: 1px solid #ddd;
		border-radius: 6px;
		background: #fff;
		padding: 12px;
	}

	.rcm-admin-wrap table thead tr {
		display: none; /* Hide header row on mobile, use data-label instead */
	}

	.rcm-admin-wrap table td {
		display: block;
		padding: 8px 0;
		border: none;
		text-align: left;
	}

	.rcm-admin-wrap table td:before {
		content: attr(data-label);
		font-weight: 600;
		color: #666;
		display: inline-block;
		width: 80px;
		margin-right: 10px;
	}

	/* Status badge */
	.rcm-status {
		font-size: 11px;
		padding: 2px 8px;
	}

	/* Row actions — stack on mobile */
	.rcm-row-actions {
		display: block;
		flex-direction: column;
		gap: 6px;
	}

	.rcm-inline-form {
		display: flex !important;
		flex-wrap: wrap;
		gap: 6px;
		margin-bottom: 6px;
		width: 100%;
	}

	.rcm-inline-form input {
		flex: 1;
		min-width: 50px;
		height: 36px;
		padding: 6px 8px;
		font-size: 14px;
	}

	.rcm-inline-form select {
		flex: 1;
		min-width: 70px;
		height: 36px;
		font-size: 14px;
	}

	.rcm-inline-form button {
		flex: 1;
		min-width: 80px;
		height: 36px;
		font-size: 12px;
		padding: 6px 10px;
		white-space: nowrap;
	}

	/* Password row — responsive */
	.rcm-pw-row td {
		display: block;
		padding: 8px 0;
	}

	.rcm-pw-row .rcm-inline-form {
		display: flex !important;
		flex-wrap: wrap;
		gap: 6px;
	}

	.rcm-pw-row input {
		flex: 1;
		min-width: 100px;
		height: 36px;
		padding: 6px 8px;
	}

	.rcm-pw-row button {
		flex: 1;
		min-width: 100px;
		height: 36px;
		font-size: 12px;
	}

	/* Search form */
	.rcm-admin-wrap form[method="get"] {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
		margin: 10px 0;
	}

	.rcm-admin-wrap form[method="get"] input {
		flex: 1;
		min-width: 150px;
		height: 36px;
		padding: 6px 10px;
		font-size: 14px;
	}

	.rcm-admin-wrap form[method="get"] button {
		height: 36px;
		padding: 6px 12px;
		font-size: 14px;
	}

	/* Subsubsub (filter links) */
	.rcm-admin-wrap .subsubsub {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
		font-size: 12px;
		margin: 8px 0;
	}

	.rcm-admin-wrap .subsubsub li {
		display: block;
		margin: 0;
	}

	.rcm-admin-wrap .subsubsub a {
		display: inline-block;
		padding: 4px 8px;
		background: #f1f1f1;
		border-radius: 4px;
		text-decoration: none;
		color: #0073aa;
	}

	.rcm-admin-wrap .subsubsub a:hover {
		background: #e2e2e2;
	}

	/* Button text को 100% readable रखने के लिए */
	.button,
	.button-primary,
	.button-small {
		font-size: 13px !important;
		padding: 6px 10px !important;
		height: auto !important;
		min-height: 36px;
	}

	.button-link-delete {
		font-size: 12px !important;
		color: #d32f2f !important;
	}

	/* Toggle password button */
	.rcm-toggle-pw {
		font-size: 12px !important;
		padding: 6px 10px !important;
		height: 36px !important;
	}
}

/* Extra small devices (< 480px) */
@media (max-width: 479px) {
	.rcm-admin-wrap {
		padding: 8px;
	}

	.rcm-admin-wrap h1 {
		font-size: 18px;
	}

	.rcm-admin-wrap table {
		font-size: 12px;
	}

	.rcm-admin-wrap table td {
		padding: 6px 0;
	}

	.rcm-inline-form input,
	.rcm-inline-form select,
	.rcm-inline-form button {
		font-size: 12px;
		height: 32px;
		padding: 4px 6px;
	}

	.button {
		font-size: 12px !important;
		padding: 4px 8px !important;
		min-height: 32px;
	}
}