/**
 * واجهة نافذة تسجيل الدخول / إنشاء الحساب.
 *
 * كل القواعد مُقيّدة داخل #codevz_plus_header_login حتى لا تتسرّب لبقية الموقع،
 * ومبنية على الخصائص المنطقية (inline-start/end) فتعمل في RTL و LTR بلا ملف منفصل.
 */

#codevz_plus_header_login {
	--pm-blue: #0088ff;
	--pm-navy: #022554;
	--pm-danger: #fc005e;
	--pm-ink: #10233d;
	--pm-muted: #6b7c93;
	--pm-line: #e3e9f2;
	--pm-soft: #f4f7fb;
	--pm-radius: 14px;
}

/* ------------------------------------------------------------------ */
/* الحاوية والنافذة                                                    */
/* ------------------------------------------------------------------ */

#codevz_plus_header_login .cz_popup_in {
	width: min(440px, calc(100vw - 32px)) !important;
	max-width: none;
	padding: 0 !important;
	border-radius: 20px !important;
	background: #fff;
	overflow: hidden;
	box-shadow: 0 24px 70px rgba(2, 37, 84, .22), 0 2px 8px rgba(2, 37, 84, .08);
}

#codevz_plus_header_login .cz_overlay {
	background: rgba(2, 37, 84, .55);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
}

/* زر الإغلاق */
#codevz_plus_header_login i.cz_close_popup {
	inset-block-start: 14px;
	inset-inline-end: 14px;
	inset-inline-start: auto;
	width: 34px;
	height: 34px;
	line-height: 34px;
	font-size: 13px;
	color: var(--pm-muted);
	background: rgba(255, 255, 255, .75);
	border-radius: 100px;
	text-align: center;
	transition: background .2s, color .2s;
}

#codevz_plus_header_login i.cz_close_popup:hover {
	color: var(--pm-ink);
	background: #fff;
}

/* الحاوية الداخلية للنموذج */
#codevz_plus_header_login .cz_lrpr {
	max-width: none;
	min-width: 0;
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: initial;
	background: transparent;
	border-radius: 0;
}

/* ------------------------------------------------------------------ */
/* الرأس (شعار + عنوان + تبويبات)                                      */
/* ------------------------------------------------------------------ */

#codevz_plus_header_login .pm-auth-head {
	position: relative;
	padding: 30px 26px 0;
	text-align: center;
	background:
		radial-gradient(120% 100% at 50% 0%, rgba(0, 136, 255, .10) 0%, rgba(0, 136, 255, 0) 62%),
		#fff;
}

#codevz_plus_header_login .pm-auth-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin-bottom: 14px;
	color: #fff;
	border-radius: 100px;
	background: linear-gradient(135deg, var(--pm-blue), var(--pm-navy));
	box-shadow: 0 10px 24px rgba(0, 136, 255, .32);
}

#codevz_plus_header_login .pm-auth-badge svg {
	width: 26px;
	height: 26px;
}

#codevz_plus_header_login .pm-auth-title {
	margin: 0 0 6px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--pm-ink);
}

#codevz_plus_header_login .pm-auth-sub {
	margin: 0;
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--pm-muted);
}

/* التبويبات */
#codevz_plus_header_login .pm-auth-tabs {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4px;
	margin: 22px 0 0;
	padding: 4px;
	background: var(--pm-soft);
	border: 1px solid var(--pm-line);
	border-radius: 100px;
}

#codevz_plus_header_login .pm-auth-tab {
	appearance: none;
	border: 0;
	margin: 0;
	padding: 11px 8px;
	font: inherit;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--pm-muted);
	background: transparent;
	border-radius: 100px;
	cursor: pointer;
	transition: color .2s, background .2s, box-shadow .2s;
}

#codevz_plus_header_login .pm-auth-tab:hover {
	color: var(--pm-ink);
}

#codevz_plus_header_login .pm-auth-tab.is-active {
	color: var(--pm-navy);
	background: #fff;
	box-shadow: 0 2px 10px rgba(2, 37, 84, .12);
}

/* وضع استعادة كلمة المرور: لا تبويب نشط */
#codevz_plus_header_login.pm-mode-pr .pm-auth-tab.is-active {
	color: var(--pm-muted);
	background: transparent;
	box-shadow: none;
}

/* ------------------------------------------------------------------ */
/* النماذج                                                             */
/* ------------------------------------------------------------------ */

#codevz_plus_header_login .cz_lrpr form {
	padding: 24px 26px 28px !important;
	margin: 0;
	background: transparent;
	border: 0;
	text-align: initial;
}

/* العنوان الأصلي داخل النموذج مكرّر مع رأس النافذة */
#codevz_plus_header_login .cz_lrpr_title {
	display: none;
}

#codevz_plus_header_login .pm-field {
	margin-bottom: 15px;
}

#codevz_plus_header_login .pm-field > label {
	display: block;
	margin-bottom: 7px;
	font-size: 13px;
	font-weight: 600;
	color: var(--pm-ink);
}

#codevz_plus_header_login .pm-input {
	position: relative;
	display: block;
}

#codevz_plus_header_login .pm-input .pm-ico {
	position: absolute;
	inset-inline-start: 14px;
	inset-block-start: 50%;
	transform: translateY(-50%);
	display: flex;
	color: var(--pm-muted);
	pointer-events: none;
	transition: color .2s;
}

#codevz_plus_header_login .pm-input .pm-ico svg {
	width: 18px;
	height: 18px;
}

#codevz_plus_header_login .cz_lrpr input:not([type="submit"]) {
	box-sizing: border-box;
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 13px 44px;
	font-size: 15px;
	font-family: inherit;
	line-height: 1.5;
	color: var(--pm-ink);
	background: #fff;
	border: 1.5px solid var(--pm-line);
	border-radius: var(--pm-radius);
	box-shadow: none;
	transition: border-color .2s, box-shadow .2s, background .2s;
}

#codevz_plus_header_login .cz_lrpr input:not([type="submit"])::placeholder {
	color: #9aa9bd;
	opacity: 1;
}

#codevz_plus_header_login .cz_lrpr input:not([type="submit"]):hover {
	border-color: #cfd9e8;
}

#codevz_plus_header_login .cz_lrpr input:not([type="submit"]):focus {
	outline: 0;
	background: #fff;
	border-color: var(--pm-blue);
	box-shadow: 0 0 0 4px rgba(0, 136, 255, .14);
}

#codevz_plus_header_login .pm-input:focus-within .pm-ico {
	color: var(--pm-blue);
}

/* الحقول التي لا تحمل زر إظهار كلمة المرور لا تحتاج مساحة في النهاية */
#codevz_plus_header_login .pm-input:not(.pm-input--pass) input {
	padding-inline-end: 16px;
}

/* زر إظهار/إخفاء كلمة المرور */
#codevz_plus_header_login .pm-eye {
	position: absolute;
	inset-inline-end: 8px;
	inset-block-start: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	color: var(--pm-muted);
	background: transparent;
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	transition: color .2s, background .2s;
}

#codevz_plus_header_login .pm-eye:hover {
	color: var(--pm-ink);
	background: var(--pm-soft);
}

#codevz_plus_header_login .pm-eye svg {
	width: 18px;
	height: 18px;
}

/* مؤشّر قوة كلمة المرور */
#codevz_plus_header_login .pm-strength {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
	font-size: 12px;
	color: var(--pm-muted);
}

#codevz_plus_header_login .pm-strength-bar {
	flex: 1;
	height: 4px;
	background: var(--pm-line);
	border-radius: 100px;
	overflow: hidden;
}

#codevz_plus_header_login .pm-strength-bar > i {
	display: block;
	width: 0;
	height: 100%;
	border-radius: inherit;
	background: var(--pm-danger);
	transition: width .25s, background .25s;
}

#codevz_plus_header_login .pm-strength[data-level="1"] .pm-strength-bar > i { width: 33%; background: var(--pm-danger); }
#codevz_plus_header_login .pm-strength[data-level="2"] .pm-strength-bar > i { width: 66%; background: #f5a623; }
#codevz_plus_header_login .pm-strength[data-level="3"] .pm-strength-bar > i { width: 100%; background: #12b76a; }

/* سؤال التحقّق */
#codevz_plus_header_login .pm-field--security > label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

/* الأرقام والعمليات تُعرض دائماً من اليسار لليمين حتى لا يقلبها محرك BiDi */
#codevz_plus_header_login .pm-quiz {
	display: inline-block;
	padding: 4px 12px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.6;
	white-space: nowrap;
	color: var(--pm-navy);
	background: var(--pm-soft);
	border: 1px solid var(--pm-line);
	border-radius: 100px;
	direction: ltr;
	unicode-bidi: isolate;
	font-variant-numeric: lining-nums;
	font-feature-settings: "tnum";
}

/* ------------------------------------------------------------------ */
/* زر الإرسال                                                          */
/* ------------------------------------------------------------------ */

#codevz_plus_header_login .cz_lrpr input[type="submit"] {
	display: block;
	width: 100%;
	margin: 20px 0 0;
	padding: 14px 20px;
	font-size: 15.5px;
	font-weight: 700;
	font-family: inherit;
	color: #fff;
	background: var(--pm-blue);
	border: 0;
	border-radius: 100px;
	cursor: pointer;
	box-shadow: 0 10px 22px rgba(0, 136, 255, .28);
	transition: background .2s, box-shadow .2s, transform .12s;
}

#codevz_plus_header_login .cz_lrpr input[type="submit"]:hover {
	background: var(--pm-navy);
	box-shadow: 0 10px 22px rgba(2, 37, 84, .26);
}

#codevz_plus_header_login .cz_lrpr input[type="submit"]:active {
	transform: translateY(1px);
}

/* حالة التحميل (الإضافة تضيف كلاس cz_loader بـ !important) */
#codevz_plus_header_login .cz_lrpr input.cz_loader {
	width: 100% !important;
	height: 48px !important;
	margin: 20px 0 0 !important;
	transform: none !important;
	inset-inline-start: auto !important;
	left: auto !important;
	right: auto !important;
	border-radius: 100px !important;
	background: var(--pm-blue) !important;
	border: 0 !important;
	box-shadow: none !important;
	animation: none !important;
	position: relative !important;
}

#codevz_plus_header_login .cz_lrpr input.cz_loader::after {
	content: "";
	position: absolute;
	inset-block-start: 50%;
	inset-inline-start: 50%;
	width: 20px;
	height: 20px;
	margin: -10px 0 0 -10px;
	border: 2px solid rgba(255, 255, 255, .35);
	border-top-color: #fff;
	border-radius: 100px;
	animation: pmAuthSpin .6s linear infinite;
}

@keyframes pmAuthSpin {
	to { transform: rotate(360deg); }
}

/* ------------------------------------------------------------------ */
/* الرسائل والروابط                                                    */
/* ------------------------------------------------------------------ */

#codevz_plus_header_login .cz_msg {
	margin: 16px 0 0;
	padding: 13px 16px;
	font-size: 13.5px;
	line-height: 1.6;
	color: #b4004a;
	background: rgba(252, 0, 94, .07);
	border: 1px solid rgba(252, 0, 94, .18);
	border-radius: var(--pm-radius);
	text-align: initial;
}

#codevz_plus_header_login .cz_lrpr form > a {
	display: block;
	margin: 16px 0 0;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--pm-blue);
	text-align: center;
	transition: color .2s;
}

#codevz_plus_header_login .cz_lrpr form > a:hover {
	color: var(--pm-navy);
	text-decoration: underline;
}

/* الروابط التي حلّت التبويبات محلها */
#codevz_plus_header_login #cz_l > a[href="#cz_r"],
#codevz_plus_header_login #cz_r > a[href="#cz_l"],
#codevz_plus_header_login .cz_lrpr form > div.clr {
	display: none;
}

/* ------------------------------------------------------------------ */
/* حالة المستخدم المسجَّل دخوله                                        */
/* ------------------------------------------------------------------ */

#codevz_plus_header_login .cz_lrpr > div:not([id]) {
	min-width: 0 !important;
	padding: 30px 26px;
}

#codevz_plus_header_login .codevz-account-avatar {
	margin: 0 0 20px;
	padding: 0 0 20px;
	text-align: center;
	border-bottom: 1px solid var(--pm-line);
}

#codevz_plus_header_login .codevz-account-avatar img {
	width: 76px;
	height: 76px;
	margin: 0 auto 12px;
	border-radius: 100px;
	border: 3px solid #fff;
	box-shadow: 0 6px 18px rgba(2, 37, 84, .16);
}

#codevz_plus_header_login .codevz-account-avatar strong {
	display: block;
	font-size: 17px;
	font-weight: 700;
	color: var(--pm-ink);
}

#codevz_plus_header_login .codevz-account-avatar span {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: var(--pm-muted);
	opacity: 1;
	direction: ltr;
	unicode-bidi: isolate;
}

#codevz_plus_header_login .cz_lrpr_buttons {
	display: grid;
	gap: 8px;
}

#codevz_plus_header_login .cz_lrpr_buttons a {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 13px 16px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--pm-ink);
	background: var(--pm-soft);
	border: 1px solid var(--pm-line);
	border-radius: var(--pm-radius);
	text-align: initial;
	transition: color .2s, background .2s, border-color .2s;
}

#codevz_plus_header_login .cz_lrpr_buttons a:hover {
	color: var(--pm-blue);
	background: #fff;
	border-color: var(--pm-blue);
}

#codevz_plus_header_login .cz_lrpr_buttons a i {
	position: static;
	transform: none;
	width: 34px;
	height: 34px;
	padding: 0;
	line-height: 34px;
	font-size: 14px;
	text-align: center;
	color: var(--pm-blue);
	background: rgba(0, 136, 255, .1);
	border-radius: 10px;
	opacity: 1;
	box-sizing: border-box;
	flex: 0 0 auto;
}

/* تسجيل الخروج بلون تحذيري خفيف */
#codevz_plus_header_login .cz_lrpr_buttons a:last-child:hover {
	color: var(--pm-danger);
	border-color: rgba(252, 0, 94, .45);
}

#codevz_plus_header_login .cz_lrpr_buttons a:last-child i {
	color: var(--pm-danger);
	background: rgba(252, 0, 94, .1);
}

/* ------------------------------------------------------------------ */
/* الشاشات الصغيرة: النافذة كورقة سفلية                                */
/* ------------------------------------------------------------------ */

@media (max-width: 600px) {

	/* ورقة سفلية بعرض الشاشة: نترك width تلقائياً كي يحدّده inset-inline
	   وحده، فأي قيمة صريحة للعرض تتغلّب على الطرف المقابل وتترك فجوة. */
	#codevz_plus_header_login .cz_popup_in {
		position: fixed;
		inset-inline: 0;
		inset-block-end: 0;
		inset-block-start: auto;
		width: auto !important;
		max-width: none !important;
		max-height: 92vh;
		overflow-y: auto;
		margin: 0;
		transform: none;
		border-radius: 22px 22px 0 0 !important;
	}

	#codevz_plus_header_login .pm-auth-head {
		padding: 22px 20px 0;
	}

	#codevz_plus_header_login .pm-auth-badge {
		width: 48px;
		height: 48px;
		margin-bottom: 10px;
	}

	#codevz_plus_header_login .pm-auth-title {
		font-size: 18px;
	}

	#codevz_plus_header_login .cz_lrpr form {
		padding: 20px 20px 24px !important;
	}

	#codevz_plus_header_login .cz_lrpr > div:not([id]) {
		padding: 24px 20px;
	}

	/* منع تكبير الصفحة تلقائياً في iOS */
	#codevz_plus_header_login .cz_lrpr input:not([type="submit"]) {
		font-size: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	#codevz_plus_header_login * {
		transition-duration: .01ms !important;
	}
}
