/**
 * BitreeWP Login Profile — Neo-Brutalist Auth Styles
 *
 * @package BitreeWP_Login_Profile
 *
 * Color palette:
 *   White (#fff)     — Primary background
 *   Yellow (#FFCC00) — Minor accent (button, focus, decorative)
 *   Dark Blue (#0f1b4d) — Small accent (links, labels, secondary)
 *   Black (#000)     — Borders & primary text
 */

/* ═══════════════════════════════════════════
   Front-end Auth Pages (Login / Register / Lost Password / Reset Password)
   ═══════════════════════════════════════════ */

/* ── Scoped reset ── */
.bitreewp-auth-field input,
.bitreewp-auth-field select,
.bitreewp-auth-field textarea {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ── Page wrapper ── */
.bitreewp-auth-page {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 70vh;
	padding: 3rem 1rem;
}

/* ── Auth card — neo-brutalist ── */
.bitreewp-shortcode-auth {
	width: 100%;
	max-width: 420px;
	background: #fff;
	border: 4px solid #000;
	border-radius: 10px;
	padding: 2.5rem 2rem 2rem;
	box-shadow: 8px 8px 0 0 #000;
	position: relative;
}

/* Yellow accent bar at top */
.bitreewp-shortcode-auth::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 6px;
	background: #FFCC00;
	border-radius: 10px 10px 0 0;
}

/* ── Card header area ── */
.bitreewp-auth-header {
	text-align: center;
	margin-bottom: 1.5rem;
}

.bitreewp-auth-header .bitreewp-auth-logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	background: #FFCC00;
	border: 3px solid #000;
	border-radius: 8px;
	margin-bottom: 0.75rem;
	font-size: 1.5rem;
	font-weight: 900;
	color: #000;
}

.bitreewp-shortcode-auth h2 {
	font-size: 1.6rem;
	font-weight: 900;
	color: #000;
	margin: 0 0 0.2rem;
	letter-spacing: -0.03em;
	text-transform: uppercase;
}

.bitreewp-shortcode-auth > p:first-child {
	font-size: 0.85rem;
	color: #0f1b4d;
	margin: 0 0 1.5rem;
	text-align: center;
	font-weight: 500;
}

/* ── Form ── */
.bitreewp-auth-form {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.bitreewp-auth-field {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
}

.bitreewp-auth-field label {
	font-size: 0.8rem;
	font-weight: 700;
	color: #0f1b4d;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.bitreewp-auth-field input[type="text"],
.bitreewp-auth-field input[type="email"],
.bitreewp-auth-field input[type="password"] {
	width: 100%;
	padding: 0.75rem 0.9rem;
	font-size: 0.925rem;
	color: #000;
	background: #fff;
	border: 3px solid #000;
	border-radius: 6px;
	transition: border-color 0.15s, transform 0.15s;
	box-sizing: border-box;
	font-weight: 500;
}

.bitreewp-auth-field input[type="text"]:focus,
.bitreewp-auth-field input[type="email"]:focus,
.bitreewp-auth-field input[type="password"]:focus {
	outline: none;
	border-color: #FFCC00;
	background: #fff;
	transform: translate(-1px, -1px);
	box-shadow: 3px 3px 0 0 #000;
}

.bitreewp-auth-field input::placeholder {
	color: #aaa;
	font-weight: 400;
}

/* ── Password toggle ── */
.bitreewp-toggle-pw {
	padding: 4px 12px !important;
	font-size: 0.75rem !important;
	cursor: pointer !important;
	border: 3px solid #000 !important;
	border-radius: 6px !important;
	background: #fff !important;
	color: #000 !important;
	font-weight: 700 !important;
	white-space: nowrap !important;
	text-transform: uppercase !important;
	letter-spacing: 0.03em !important;
	transition: background 0.15s, color 0.15s;
	min-width: 56px;
}

.bitreewp-toggle-pw:hover {
	background: #FFCC00 !important;
	color: #000 !important;
}

/* ── Row (remember me + forgot password) ── */
.bitreewp-auth-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.bitreewp-auth-checkbox {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.8rem;
	font-weight: 600;
	color: #000;
	cursor: pointer;
}

.bitreewp-auth-checkbox input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	border: 3px solid #000;
	border-radius: 3px;
	background: #fff;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s;
	flex-shrink: 0;
}

.bitreewp-auth-checkbox input[type="checkbox"]:checked {
	background: #FFCC00;
	border-color: #000;
	position: relative;
}

.bitreewp-auth-checkbox input[type="checkbox"]:checked::after {
	content: '✓';
	font-size: 13px;
	font-weight: 900;
	color: #000;
	line-height: 1;
}

.bitreewp-auth-link {
	font-size: 0.8rem;
	color: #0f1b4d;
	text-decoration: none;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	border-bottom: 2px solid transparent;
	transition: border-color 0.15s;
}

.bitreewp-auth-link:hover {
	color: #000;
	border-bottom-color: #FFCC00;
}

/* ── Submit button — neo-brutalist ── */
.bitreewp-auth-submit {
	width: 100%;
	padding: 0.85rem 1rem;
	font-size: 1rem;
	font-weight: 900;
	color: #000;
	background: #FFCC00;
	border: 3px solid #000;
	border-radius: 8px;
	cursor: pointer;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	transition: background 0.15s, color 0.15s, transform 0.1s, box-shadow 0.1s;
	box-shadow: 4px 4px 0 0 #000;
}

.bitreewp-auth-submit:hover {
	background: #0f1b4d;
	color: #fff;
	transform: translate(-1px, -1px);
	box-shadow: 6px 6px 0 0 #000;
}

.bitreewp-auth-submit:active {
	transform: translate(2px, 2px);
	box-shadow: 1px 1px 0 0 #000;
}

.bitreewp-auth-submit:disabled {
	opacity: 0.4;
	cursor: not-allowed;
	transform: none;
	box-shadow: 4px 4px 0 0 #000;
}

/* ── Messages — neo-brutalist ── */
.bitreewp-auth-message {
	padding: 0.75rem 1rem;
	border-radius: 6px;
	font-size: 0.85rem;
	margin-bottom: 0.25rem;
	display: none;
	font-weight: 600;
	border: 3px solid #000;
}

.bitreewp-auth-message--error {
	display: block;
	background: #ffe8e8;
	color: #c00;
	border-color: #000;
}

.bitreewp-auth-message--success {
	display: block;
	background: #e8ffe8;
	color: #0a0;
	border-color: #000;
}

/* ── Footer text ── */
.bitreewp-shortcode-auth > p:last-child {
	font-size: 0.8rem;
	color: #000;
	margin: 1.5rem 0 0;
	text-align: center;
	font-weight: 600;
	padding-top: 1.25rem;
	border-top: 3px solid #000;
}

.bitreewp-shortcode-auth > p:last-child a {
	color: #0f1b4d;
	font-weight: 800;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	font-size: 0.8rem;
	border-bottom: 2px solid #FFCC00;
	transition: background 0.15s;
}

.bitreewp-shortcode-auth > p:last-child a:hover {
	background: #FFCC00;
	color: #000;
	border-bottom-color: #000;
}

/* ── Already logged in message ── */
.bitreewp-shortcode-auth p:first-child a {
	color: #0f1b4d;
	font-weight: 800;
	text-decoration: none;
	border-bottom: 2px solid #FFCC00;
}

.bitreewp-shortcode-auth p:first-child a:hover {
	background: #FFCC00;
	color: #000;
}

/* ═══════════════════════════════════════════
   Email OTP Verification Form — Neo-Brutalist
   ═══════════════════════════════════════════ */

.bitreewp-otp-verify {
	text-align: center;
	padding: 0.5rem 0;
}

.bitreewp-otp-header h3 {
	font-size: 1.25rem;
	font-weight: 900;
	color: #000;
	margin: 0 0 0.5rem;
	text-transform: uppercase;
	letter-spacing: -0.02em;
}

.bitreewp-otp-desc {
	font-size: 0.85rem;
	color: #0f1b4d;
	margin: 0 0 1.25rem;
	font-weight: 500;
}

.bitreewp-otp-inputs {
	margin-bottom: 1rem;
}

.bitreewp-otp-input {
	width: 100%;
	max-width: 280px;
	padding: 0.75rem 1rem;
	font-size: 1.5rem;
	font-weight: 900;
	letter-spacing: 0.3em;
	text-align: center;
	color: #000;
	background: #fff;
	border: 3px solid #000;
	border-radius: 6px;
	transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s;
	box-sizing: border-box;
}

.bitreewp-otp-input:focus {
	outline: none;
	border-color: #FFCC00;
	background: #fff;
	transform: translate(-1px, -1px);
	box-shadow: 3px 3px 0 0 #000;
}

.bitreewp-otp-input::placeholder {
	font-size: 1rem;
	font-weight: 500;
	letter-spacing: normal;
	color: #aaa;
}
}

.bitreewp-otp-input::placeholder {
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: normal;
	color: #94a3b8;
}

.bitreewp-otp-submit {
	margin-top: 0.5rem;
}

.bitreewp-otp-footer {
	display: flex;
	justify-content: center;
	gap: 1rem;
	margin-top: 1rem;
	flex-wrap: wrap;
}

.bitreewp-otp-footer .button-link {
	background: none;
	border: none;
	padding: 0.4rem 0.75rem;
	font-size: 0.85rem;
	color: #6366f1;
	cursor: pointer;
	font-weight: 500;
	text-decoration: underline;
}

.bitreewp-otp-footer .button-link:hover {
	color: #4f46e5;
}

.bitreewp-otp-footer .button-link:disabled {
	color: #94a3b8;
	cursor: not-allowed;
	text-decoration: none;
}

/* ── Responsive ── */
@media (max-width: 480px) {
	.bitreewp-auth-page {
		padding: 1rem 0;
	}

	.bitreewp-shortcode-auth {
		padding: 1.5rem 1.25rem;
		border-radius: 12px;
	}

	.bitreewp-shortcode-auth h2 {
		font-size: 1.3rem;
	}

	.bitreewp-auth-row {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* ═══════════════════════════════════════════
   Profile Page — Premium Orange Theme (Compact)
   ═══════════════════════════════════════════ */

/* ── Variables ── */
.bpp-wrap {
	--bpp-orange: #f97316;
	--bpp-orange-dark: #ea580c;
	--bpp-orange-light: #ffedd5;
	--bpp-orange-bg: linear-gradient(135deg, #f97316, #ea580c);
	--bpp-bg: #0f172a;
	--bpp-card-bg: #1e293b;
	--bpp-card-alt: #334155;
	--bpp-text: #f1f5f9;
	--bpp-text-secondary: #94a3b8;
	--bpp-text-muted: #64748b;
	--bpp-border: rgba(255,255,255,0.08);
	--bpp-border-light: rgba(255,255,255,0.05);
	--bpp-radius: 10px;
	--bpp-radius-sm: 6px;
	max-width: 820px;
	margin: 0 auto;
	padding: 20px 16px 40px;
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	color: var(--bpp-text);
}

/* ── Scoped reset: prevent theme styles leaking into profile page ── */
.bpp-wrap input,
.bpp-wrap select,
.bpp-wrap textarea {
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* ── Header ── */
.bpp-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 18px;
	flex-wrap: wrap;
}

.bpp-header-left {
	display: flex;
	align-items: center;
	gap: 14px;
}

.bpp-avatar-ring {
	position: relative;
	flex-shrink: 0;
}

.bpp-avatar {
	border-radius: 50%;
	width: 52px;
	height: 52px;
	object-fit: cover;
	border: 2px solid var(--bpp-orange);
	box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.12);
}

.bpp-avatar-badge {
	position: absolute;
	bottom: -1px;
	right: -1px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--bpp-orange-bg);
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--bpp-bg);
}

.bpp-greeting {
	font-size: 1.15rem;
	font-weight: 700;
	margin: 0;
	color: var(--bpp-text);
	letter-spacing: -0.02em;
}

.bpp-subtitle {
	font-size: 0.78rem;
	color: var(--bpp-text-secondary);
	margin: 1px 0 0;
}

.bpp-dot { margin: 0 5px; color: var(--bpp-text-muted); }

/* ── Buttons ── */
.bpp-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 7px 14px;
	font-size: 0.78rem;
	font-weight: 600;
	border-radius: var(--bpp-radius-sm);
	text-decoration: none;
	transition: all 0.2s ease;
	cursor: pointer;
	border: none;
	font-family: inherit;
}

.bpp-btn-primary {
	background: var(--bpp-orange-bg);
	color: #fff;
	box-shadow: 0 3px 10px rgba(249, 115, 22, 0.25);
}

.bpp-btn-primary:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 14px rgba(249, 115, 22, 0.35);
	filter: brightness(1.08);
	color: #fff;
}

.bpp-btn-ghost {
	background: rgba(255,255,255,0.06);
	color: var(--bpp-text-secondary);
	border: 1px solid var(--bpp-border);
}

.bpp-btn-ghost:hover {
	background: rgba(255,255,255,0.1);
	color: var(--bpp-text);
}

.bpp-btn--danger { color: #ef4444 !important; }
.bpp-btn--danger:hover {
	background: rgba(239, 68, 68, 0.1) !important;
	border-color: rgba(239, 68, 68, 0.2) !important;
	color: #ef4444 !important;
}

/* ── Stats Bar ── */
.bpp-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
	margin-bottom: 18px;
}

.bpp-stat {
	background: var(--bpp-card-bg);
	border: 1px solid var(--bpp-border);
	border-radius: var(--bpp-radius);
	padding: 10px 12px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.bpp-stat-icon {
	width: 32px;
	height: 32px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.bpp-stat-icon svg { width: 16px; height: 16px; }

.bpp-stat-icon--account { background: rgba(249, 115, 22, 0.12); color: var(--bpp-orange); }
.bpp-stat-icon--login { background: rgba(59, 130, 246, 0.12); color: #3b82f6; }
.bpp-stat-icon--ip { background: rgba(139, 92, 246, 0.12); color: #8b5cf6; }
.bpp-stat-icon--count { background: rgba(16, 185, 129, 0.12); color: #10b981; }

.bpp-stat-body {
	display: flex;
	flex-direction: column;
	gap: 0;
	min-width: 0;
}

.bpp-stat-value {
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--bpp-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.bpp-stat-label {
	font-size: 0.6rem;
	font-weight: 600;
	color: var(--bpp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* ── Alert ── */
.bpp-alert {
	padding: 10px 14px;
	border-radius: var(--bpp-radius-sm);
	font-size: 0.8rem;
	font-weight: 500;
	margin-bottom: 14px;
	display: none;
}

.bpp-alert--success {
	display: block;
	background: rgba(16, 185, 129, 0.1);
	border: 1px solid rgba(16, 185, 129, 0.2);
	color: #34d399;
}

.bpp-alert--error {
	display: block;
	background: rgba(239, 68, 68, 0.1);
	border: 1px solid rgba(239, 68, 68, 0.2);
	color: #f87171;
}

/* ── Tabs ── */
.bpp-tabs {
	display: flex;
	gap: 3px;
	margin-bottom: 16px;
	background: var(--bpp-card-bg);
	border: 1px solid var(--bpp-border);
	border-radius: var(--bpp-radius);
	padding: 3px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.bpp-tab {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--bpp-text-secondary);
	text-decoration: none;
	border-radius: var(--bpp-radius-sm);
	transition: all 0.2s ease;
	white-space: nowrap;
}

.bpp-tab svg { width: 16px; height: 16px; flex-shrink: 0; }

.bpp-tab:hover {
	color: var(--bpp-text);
	background: rgba(255,255,255,0.04);
}

.bpp-tab.active {
	background: var(--bpp-orange-bg);
	color: #fff;
	box-shadow: 0 2px 6px rgba(249, 115, 22, 0.25);
}

.bpp-tab.active svg { stroke: #fff; }

/* ── Tab Content ── */
.bpp-tab-content { display: none; }
.bpp-tab-content.active { display: block; }

/* ── Cards ── */
.bpp-card {
	background: var(--bpp-card-bg);
	border: 1px solid var(--bpp-border);
	border-radius: var(--bpp-radius);
	margin-bottom: 12px;
	overflow: hidden;
}

.bpp-card-header { padding: 14px 18px 0; }

.bpp-card-header h3 {
	margin: 0;
	font-size: 0.88rem;
	font-weight: 700;
	color: var(--bpp-text);
}

.bpp-card-header p {
	margin: 2px 0 0;
	font-size: 0.74rem;
	color: var(--bpp-text-muted);
}

.bpp-card-body { padding: 14px 18px 18px; }

/* ── Form ── */
.bpp-form { display: flex; flex-direction: column; gap: 12px; }

.bpp-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.bpp-field { display: flex; flex-direction: column; gap: 4px; }

.bpp-field label {
	font-size: 0.74rem;
	font-weight: 600;
	color: var(--bpp-text-secondary);
}

.bpp-field input,
.bpp-field textarea,
.bpp-field select {
	padding: 8px 11px;
	font-size: 0.82rem;
	color: var(--bpp-text);
	background: var(--bpp-bg);
	border: 1.5px solid var(--bpp-border);
	border-radius: var(--bpp-radius-sm);
	transition: border-color 0.2s, box-shadow 0.2s;
	font-family: inherit;
	width: 100%;
	box-sizing: border-box;
}

.bpp-field select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	padding-right: 30px;
	cursor: pointer;
}

.bpp-field input:focus,
.bpp-field textarea:focus,
.bpp-field select:focus {
	outline: none;
	border-color: var(--bpp-orange);
	box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.1);
}

.bpp-field input::placeholder,
.bpp-field textarea::placeholder { color: var(--bpp-text-muted); }

.bpp-field-hint {
	font-size: 0.68rem;
	color: var(--bpp-text-muted);
	margin: 0;
}

.bpp-form-actions {
	display: flex;
	justify-content: flex-end;
	padding-top: 2px;
}

/* ── Password Toggle ── */
.bpp-pw-wrap { display: flex; gap: 4px; align-items: stretch; }
.bpp-pw-wrap input { flex: 1; }

.bpp-pw-toggle {
	padding: 3px 8px;
	cursor: pointer;
	border: 1.5px solid var(--bpp-border);
	border-radius: var(--bpp-radius-sm);
	background: var(--bpp-card-alt);
	color: var(--bpp-text-muted);
	display: flex;
	align-items: center;
	transition: all 0.2s;
}

.bpp-pw-toggle:hover { background: rgba(255,255,255,0.08); }

/* ── Current Session ── */
.bpp-current-session {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	background: var(--bpp-bg);
	border: 1px solid var(--bpp-border);
	border-radius: var(--bpp-radius-sm);
}

.bpp-session-icon {
	width: 34px;
	height: 34px;
	border-radius: 8px;
	background: rgba(59, 130, 246, 0.1);
	color: #3b82f6;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.bpp-session-info {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.bpp-session-info strong { font-size: 0.78rem; color: var(--bpp-text); }

.bpp-session-info span {
	font-size: 0.68rem;
	color: var(--bpp-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ── Badge ── */
.bpp-badge {
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	font-size: 0.6rem;
	font-weight: 700;
	border-radius: 999px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	flex-shrink: 0;
}

.bpp-badge--success { background: rgba(16, 185, 129, 0.12); color: #34d399; }
.bpp-badge--danger { background: rgba(239, 68, 68, 0.12); color: #f87171; }

/* ── Activity List ── */
.bpp-activity-list { display: flex; flex-direction: column; gap: 6px; }

.bpp-activity-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 12px;
	background: var(--bpp-bg);
	border: 1px solid var(--bpp-border);
	border-radius: var(--bpp-radius-sm);
}

.bpp-activity-icon {
	width: 28px;
	height: 28px;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.bpp-activity-icon svg { width: 14px; height: 14px; }

.bpp-activity-icon--success { background: rgba(16, 185, 129, 0.12); color: #34d399; }
.bpp-activity-icon--fail { background: rgba(239, 68, 68, 0.12); color: #f87171; }

.bpp-activity-info {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.bpp-activity-info strong { font-size: 0.75rem; color: var(--bpp-text); }
.bpp-activity-info span { font-size: 0.68rem; color: var(--bpp-text-muted); }

/* ── Empty ── */
.bpp-empty { text-align: center; padding: 28px 16px; }
.bpp-empty p { font-size: 0.8rem; color: var(--bpp-text-muted); margin: 8px 0 0; }

/* ── Footer ── */
.bpp-footer {
	display: flex;
	justify-content: center;
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid var(--bpp-border);
}

/* ── Responsive ── */
@media (max-width: 768px) {
	.bpp-stats { grid-template-columns: repeat(2, 1fr); gap: 6px; }
	.bpp-stat { padding: 8px 10px; }
	.bpp-stat-icon { width: 28px; height: 28px; }
	.bpp-form-row { grid-template-columns: 1fr; gap: 12px; }
	.bpp-tab { padding: 6px 10px; font-size: 0.72rem; }
	.bpp-wrap { padding: 14px 12px 30px; }
	.bpp-card-header { padding: 12px 14px 0; }
	.bpp-card-body { padding: 12px 14px 16px; }
}

@media (max-width: 480px) {
	.bpp-stats { grid-template-columns: 1fr; gap: 6px; }
	.bpp-header { flex-direction: column; align-items: flex-start; gap: 10px; }
	.bpp-avatar { width: 44px; height: 44px; }
	.bpp-greeting { font-size: 1rem; }
	.bpp-tabs { overflow-x: auto; flex-wrap: nowrap; }
	.bpp-tab { font-size: 0.7rem; padding: 5px 8px; }
	.bpp-tab svg { width: 14px; height: 14px; }
	.bpp-card-body { padding: 10px 12px 14px; }
	.bpp-card-header { padding: 10px 12px 0; }
	.bpp-stat-icon { width: 24px; height: 24px; }
}

/* ═══════════════════════════════════════════
   Login Alert Confirmation Page
   ═══════════════════════════════════════════ */

.bitreewp-alert-confirm {
	display: flex;
	justify-content: center;
	padding: 3rem 1rem;
}

.bitreewp-alert-card {
	width: 100%;
	max-width: 480px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 14px;
	padding: 2.5rem 2rem;
	text-align: center;
	box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.bitreewp-alert-icon {
	margin-bottom: 1rem;
}

.bitreewp-alert-card h2 {
	font-size: 1.25rem;
	font-weight: 700;
	color: #0f172a;
	margin: 0 0 1.25rem;
	letter-spacing: -0.02em;
}

.bitreewp-alert-details {
	text-align: left;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	padding: 1rem 1.25rem;
	margin-bottom: 1.25rem;
}

.bitreewp-alert-row {
	display: flex;
	justify-content: space-between;
	padding: 5px 0;
	gap: 12px;
}

.bitreewp-alert-row + .bitreewp-alert-row {
	border-top: 1px solid #f1f5f9;
}

.bitreewp-alert-label {
	font-size: 0.8rem;
	font-weight: 600;
	color: #64748b;
	flex-shrink: 0;
}

.bitreewp-alert-value {
	font-size: 0.8rem;
	color: #1e293b;
	text-align: right;
	word-break: break-all;
}

.bitreewp-alert-value--muted {
	color: #94a3b8;
	font-size: 0.75rem;
}

.bitreewp-alert-question {
	font-size: 0.95rem;
	font-weight: 600;
	color: #0f172a;
	margin: 0 0 1.25rem;
}

.bitreewp-alert-actions {
	display: flex;
	gap: 10px;
	justify-content: center;
	flex-wrap: wrap;
}

.bitreewp-alert-actions .bitreewp-btn {
	min-width: 160px;
	justify-content: center;
}

#bitreewp-alert-msg {
	margin-top: 1rem;
}

@media (max-width: 480px) {
	.bitreewp-alert-card { padding: 1.5rem 1.25rem; }
	.bitreewp-alert-actions { flex-direction: column; align-items: stretch; }
	.bitreewp-alert-actions .bitreewp-btn { min-width: 0; }
}

/* ═══════════════════════════════════════════
   Admin — Stripe-Inspired Design System
   ═══════════════════════════════════════════ */

/* ── Layout ── */

.bitreewp-admin-wrap {
	max-width: 960px;
	margin: 0 auto;
	padding: 24px 16px;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', system-ui, sans-serif;
	color: #0f172a;
}

.bitreewp-admin-wrap h1 {
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: #0f172a;
	margin: 0 0 4px;
	padding: 0;
}

.bitreewp-admin-wrap > p.description {
	font-size: 14px;
	color: #64748b;
	margin: 0 0 24px;
}

/* ── Divider ── */

.bitreewp-divider {
	height: 1px;
	background: #e2e8f0;
	margin: 20px 0;
	border: none;
}

/* ── Card ── */

.bitreewp-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	padding: 20px 24px;
	margin-bottom: 20px;
}

.bitreewp-card:last-child {
	margin-bottom: 0;
}

.bitreewp-card__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom: 16px;
	margin-bottom: 16px;
	border-bottom: 1px solid #f1f5f9;
	flex-wrap: wrap;
	gap: 8px;
}

.bitreewp-card__header h2 {
	font-size: 15px;
	font-weight: 600;
	color: #0f172a;
	margin: 0;
	padding: 0;
}

.bitreewp-card__desc {
	font-size: 13px;
	color: #64748b;
	margin: -8px 0 16px;
	line-height: 1.5;
}

/* ── Fields ── */

.bitreewp-field {
	display: flex;
	align-items: flex-start;
	padding: 12px 0;
	gap: 16px;
}

.bitreewp-field + .bitreewp-field {
	border-top: 1px solid #f8fafc;
}

.bitreewp-field__label {
	flex: 0 0 180px;
	font-size: 13px;
	font-weight: 500;
	color: #1e293b;
	padding-top: 6px;
}

.bitreewp-field__input {
	flex: 1;
	min-width: 0;
}

.bitreewp-field__input .description {
	font-size: 12px;
	color: #94a3b8;
	margin: 5px 0 0;
	line-height: 1.4;
}

/* ── Inputs ── */

.bitreewp-input {
	width: 100%;
	max-width: 400px;
	padding: 8px 12px;
	font-size: 13px;
	color: #0f172a;
	background: #ffffff;
	border: 1.5px solid #e2e8f0;
	border-radius: 7px;
	transition: border-color 0.15s, box-shadow 0.15s;
	box-sizing: border-box;
	font-family: inherit;
}

.bitreewp-input:focus {
	outline: none;
	border-color: #6366f1;
	box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

.bitreewp-input--small {
	max-width: 80px;
}

.bitreewp-input--code {
	font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
	font-size: 12px;
}

textarea.bitreewp-input {
	min-height: 80px;
	resize: vertical;
}

select.bitreewp-input {
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%2364748b' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	padding-right: 32px;
	cursor: pointer;
}

/* ── Checkbox / Toggle ── */

.bitreewp-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	font-size: 13px;
	color: #1e293b;
	user-select: none;
}

.bitreewp-toggle input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.bitreewp-toggle__track {
	width: 36px;
	height: 20px;
	background: #cbd5e1;
	border-radius: 10px;
	transition: background 0.2s;
	flex-shrink: 0;
	position: relative;
}

.bitreewp-toggle__track::after {
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	width: 16px;
	height: 16px;
	background: #ffffff;
	border-radius: 50%;
	transition: transform 0.2s;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.bitreewp-toggle input:checked + .bitreewp-toggle__track {
	background: #6366f1;
}

.bitreewp-toggle input:checked + .bitreewp-toggle__track::after {
	transform: translateX(16px);
}

.bitreewp-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	font-size: 13px;
	color: #1e293b;
}

.bitreewp-checkbox input[type="checkbox"] {
	width: 16px;
	height: 16px;
	border-radius: 4px;
	border: 1.5px solid #cbd5e1;
	accent-color: #6366f1;
	cursor: pointer;
}

/* ── Buttons ── */

.bitreewp-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 16px;
	font-size: 13px;
	font-weight: 500;
	font-family: inherit;
	border-radius: 7px;
	border: 1.5px solid #e2e8f0;
	background: #ffffff;
	color: #1e293b;
	cursor: pointer;
	transition: all 0.15s;
	text-decoration: none;
	line-height: 1.4;
}

.bitreewp-btn:hover {
	background: #f8fafc;
	border-color: #cbd5e1;
}

.bitreewp-btn:active {
	background: #f1f5f9;
}

.bitreewp-btn--primary {
	background: #6366f1;
	border-color: #6366f1;
	color: #ffffff;
}

.bitreewp-btn--primary:hover {
	background: #4f46e5;
	border-color: #4f46e5;
	color: #ffffff;
}

.bitreewp-btn--danger {
	color: #dc2626;
	border-color: #fecaca;
}

.bitreewp-btn--danger:hover {
	background: #fef2f2;
	border-color: #fca5a5;
	color: #b91c1c;
}

.bitreewp-btn--sm {
	padding: 4px 10px;
	font-size: 12px;
	border-radius: 6px;
}

.bitreewp-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none;
}

.bitreewp-btn.loading {
	position: relative;
	color: transparent !important;
	pointer-events: none;
}

.bitreewp-btn.loading::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 14px;
	height: 14px;
	margin: -7px 0 0 -7px;
	border: 2px solid rgba(255,255,255,0.3);
	border-top-color: #ffffff;
	border-radius: 50%;
	animation: bitreewp-spin 0.6s linear infinite;
}

@keyframes bitreewp-spin {
	to { transform: rotate(360deg); }
}

/* ── Badges / Pills ── */

.bitreewp-pill {
	display: inline-flex;
	align-items: center;
	padding: 2px 10px;
	font-size: 12px;
	font-weight: 500;
	border-radius: 100px;
	line-height: 1.5;
}

.bitreewp-pill--success {
	background: #dcfce7;
	color: #166534;
}

.bitreewp-pill--danger {
	background: #fef2f2;
	color: #dc2626;
}

.bitreewp-pill--neutral {
	background: #f1f5f9;
	color: #475569;
}

.bitreewp-pill--warning {
	background: #fef9c3;
	color: #a16207;
}

.bitreewp-pill--info {
	background: #dbeafe;
	color: #1d4ed8;
}

.bitreewp-pill--purple {
	background: #f3e8ff;
	color: #7e22ce;
}

.bitreewp-pill--orange {
	background: #ffedd5;
	color: #c2410c;
}

/* ── Tables ── */

.bitreewp-table-wrap {
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	overflow: hidden;
	background: #ffffff;
}

.bitreewp-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.bitreewp-table thead {
	background: #f8fafc;
}

.bitreewp-table th {
	padding: 10px 14px;
	font-size: 11px;
	font-weight: 600;
	color: #64748b;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-align: left;
	border-bottom: 1px solid #e2e8f0;
	white-space: nowrap;
}

.bitreewp-table td {
	padding: 12px 14px;
	border-bottom: 1px solid #f1f5f9;
	color: #1e293b;
	vertical-align: middle;
}

.bitreewp-table tbody tr:last-child td {
	border-bottom: none;
}

.bitreewp-table tbody tr:hover {
	background: #fafbff;
}

.bitreewp-table .col-check {
	width: 36px;
	text-align: center;
}

.bitreewp-table .col-actions {
	width: 160px;
	text-align: right;
}

.bitreewp-table .col-id {
	width: 50px;
	color: #94a3b8;
}

.bitreewp-table .col-ip {
	width: 130px;
}

.bitreewp-table .col-date {
	width: 160px;
	color: #64748b;
	font-size: 12px;
}

.bitreewp-table .col-user {
	display: flex;
	align-items: center;
	gap: 10px;
}

.bitreewp-table .avatar {
	border-radius: 50%;
	width: 28px;
	height: 28px;
	flex-shrink: 0;
}

.bitreewp-table .user-meta {
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.bitreewp-table .user-meta strong {
	font-size: 13px;
	font-weight: 600;
	color: #0f172a;
}

.bitreewp-table .user-meta span {
	font-size: 12px;
	color: #94a3b8;
}

.bitreewp-table em {
	color: #94a3b8;
	font-style: normal;
}

/* ── Empty state ── */

.bitreewp-empty {
	padding: 40px 20px;
	text-align: center;
	color: #94a3b8;
	font-size: 14px;
}

/* ── Toolbar / Filters ── */

.bitreewp-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 16px;
	flex-wrap: wrap;
}

.bitreewp-toolbar-left,
.bitreewp-toolbar-right {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.bitreewp-filter-group {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 4px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
}

.bitreewp-filter-group .bitreewp-filter-btn {
	padding: 5px 12px;
	font-size: 12px;
	font-weight: 500;
	color: #64748b;
	background: transparent;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	transition: all 0.15s;
	font-family: inherit;
	text-decoration: none;
}

.bitreewp-filter-group .bitreewp-filter-btn:hover {
	color: #1e293b;
}

.bitreewp-filter-group .bitreewp-filter-btn--active {
	background: #ffffff;
	color: #0f172a;
	box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}

/* ── Search ── */

.bitreewp-search {
	display: flex;
	align-items: center;
	gap: 6px;
}

.bitreewp-search input {
	padding: 6px 12px;
	font-size: 13px;
	border: 1.5px solid #e2e8f0;
	border-radius: 7px;
	background: #ffffff;
	color: #0f172a;
	width: 200px;
	font-family: inherit;
	transition: border-color 0.15s;
}

.bitreewp-search input:focus {
	outline: none;
	border-color: #6366f1;
	box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

.bitreewp-search input::placeholder {
	color: #94a3b8;
}

/* ── Pagination ── */

.bitreewp-pagination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 0 4px;
	font-size: 13px;
	color: #64748b;
}

.bitreewp-pagination__pages {
	display: flex;
	align-items: center;
	gap: 4px;
}

.bitreewp-pagination__pages a,
.bitreewp-pagination__pages span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 30px;
	height: 30px;
	padding: 0 6px;
	font-size: 12px;
	font-weight: 500;
	border-radius: 6px;
	text-decoration: none;
	color: #1e293b;
	border: 1px solid transparent;
	transition: all 0.15s;
}

.bitreewp-pagination__pages a:hover {
	background: #f1f5f9;
	border-color: #e2e8f0;
}

.bitreewp-pagination__pages .bitreewp-pagination--current {
	background: #6366f1;
	color: #ffffff;
	border-color: #6366f1;
}

/* ── Color picker ── */

.bitreewp-color-picker {
	width: 44px;
	height: 34px;
	padding: 2px;
	cursor: pointer;
	border: 1.5px solid #e2e8f0;
	border-radius: 7px;
	background: #ffffff;
}

.bitreewp-color-hex {
	margin-left: 8px;
	font-size: 12px;
	color: #64748b;
	font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
}

/* ── Notices ── */

.bitreewp-notice {
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 13px;
	margin-bottom: 16px;
	border: 1px solid;
}

.bitreewp-notice--success {
	background: #f0fdf4;
	border-color: #bbf7d0;
	color: #166534;
}

.bitreewp-notice--error {
	background: #fef2f2;
	border-color: #fecaca;
	color: #dc2626;
}

.bitreewp-notice--info {
	background: #eff6ff;
	border-color: #bfdbfe;
	color: #1d4ed8;
}

/* ── Responsive ── */

@media (max-width: 782px) {
	.bitreewp-admin-wrap {
		padding: 16px 10px;
	}

	.bitreewp-field {
		flex-direction: column;
		gap: 6px;
		padding: 14px 0;
	}

	.bitreewp-field__label {
		flex: none;
		padding-top: 0;
	}

	.bitreewp-input {
		max-width: 100%;
	}

	.bitreewp-toolbar {
		flex-direction: column;
		align-items: stretch;
	}

	.bitreewp-toolbar-left,
	.bitreewp-toolbar-right {
		flex-wrap: wrap;
	}

	.bitreewp-table-wrap {
		overflow-x: auto;
	}
}


	color: #64748b;
	font-family: 'Consolas', 'Courier New', monospace;
	vertical-align: middle;
}