/* ===== AMP Auth — ورود با پیامک ===== */

/* Overlay */
.amp-auth-overlay{
	display:none;position:fixed;inset:0;z-index:99999;
	align-items:center;justify-content:center;
	font-family:'Peyda',Tahoma,sans-serif;direction:rtl;
}
.amp-auth-overlay.is-open{display:flex;}

.amp-auth-backdrop{
	position:absolute;inset:0;
	background:rgba(14,26,46,.6);
	backdrop-filter:blur(4px);
	-webkit-backdrop-filter:blur(4px);
}

.amp-auth-box{
	position:relative;z-index:1;
	width:100%;max-width:400px;margin:16px;
}

/* Close button */
.amp-auth-close{
	position:absolute;top:-14px;left:-14px;z-index:2;
	width:36px;height:36px;border-radius:50%;
	background:#fff;border:1px solid #EDE7D8;
	display:flex;align-items:center;justify-content:center;
	color:#6B7386;cursor:pointer;padding:0;
	box-shadow:0 6px 18px rgba(14,26,46,.14);
	transition:color .15s,border-color .15s,transform .15s;
}
.amp-auth-close:hover{color:#16213A;border-color:#C9A227;transform:rotate(90deg);}
.amp-auth-close:focus-visible{outline:2px solid #C9A227;outline-offset:2px;}

/* Form card */
.amp-auth-form{
	position:relative;
	background:#fff;border-radius:20px;
	box-shadow:0 24px 80px rgba(14,26,46,.22);
	overflow:hidden;
}

/* شماره‌ی لاتین داخل متن فارسی باید ایزوله شود وگرنه برعکس نمایش داده می‌شود */
.amp-auth-phone-num{
	direction:ltr;unicode-bidi:isolate;
	font-weight:700;color:#16213A;
	display:inline-block;
}

/* Header */
.amp-auth-head{
	padding:32px 32px 6px;text-align:center;
}
.amp-auth-logo{max-height:36px;width:auto;}
.amp-auth-site-name{
	font-size:19px;font-weight:800;color:#16213A;letter-spacing:.3px;
}

/* Steps */
.amp-auth-step{padding:28px 32px 24px;}

.amp-auth-title{
	font-size:18px;font-weight:800;color:#16213A;
	margin:0 0 8px;
}
.amp-auth-desc{font-size:13px;color:#6B7386;line-height:1.8;margin:0 0 20px;}

/* Phone input */
.amp-auth-field{margin-bottom:16px;}
.amp-auth-input-wrap{
	display:flex;align-items:center;gap:10px;
	border:1.5px solid #EDE7D8 !important;border-radius:12px !important;
	padding:0 16px !important;height:54px;
	transition:border-color .15s,box-shadow .15s;
	background:#FAFAF8 !important;
	box-shadow:none !important;
}
.amp-auth-input-wrap:focus-within{
	border-color:#C9A227 !important;background:#fff !important;
	box-shadow:0 0 0 3px rgba(201,162,39,.12) !important;
}
/* input داخلی باید کاملاً بدون قاب باشد؛ قاب فقط روی wrapper است.
   پوسته روی input بردر/پس‌زمینه می‌گذارد و «کادر داخل کادر» می‌سازد. */
.amp-auth-input,
.amp-auth-form input.amp-auth-input{
	flex:1;
	border:0 !important;
	border-radius:0 !important;
	background:transparent !important;
	background-image:none !important;
	outline:none !important;
	box-shadow:none !important;
	padding:0 !important;
	margin:0 !important;
	height:100% !important;
	min-height:0 !important;
	font-size:15px !important;
	font-family:inherit !important;
	color:#16213A !important;
	text-align:left;direction:ltr;letter-spacing:.5px;
	-webkit-appearance:none;appearance:none;
}
.amp-auth-input:focus,
.amp-auth-form input.amp-auth-input:focus{
	outline:none !important;box-shadow:none !important;
	border:0 !important;background:transparent !important;
}
/* حذف پس‌زمینه زرد/آبی AutoFill مرورگر */
.amp-auth-input:-webkit-autofill,
.amp-auth-input:-webkit-autofill:focus{
	-webkit-box-shadow:0 0 0 60px #FAFAF8 inset !important;
	-webkit-text-fill-color:#16213A !important;
}
.amp-auth-input::placeholder{color:#B9C2D6 !important;letter-spacing:0;direction:rtl;text-align:right;opacity:1;}
.amp-auth-error{
	font-size:12px;color:#C0392B;margin-top:6px;
	min-height:18px;
}

/* Buttons */
.amp-auth-btn,
.amp-auth-form button.amp-auth-btn{
	position:relative;overflow:hidden;
	width:100% !important;height:52px !important;
	border-radius:12px !important;
	border:0 !important;
	font-family:inherit !important;
	font-size:14.5px !important;font-weight:700 !important;
	letter-spacing:normal !important;text-transform:none !important;
	cursor:pointer;
	display:flex !important;align-items:center;justify-content:center;
	gap:8px;outline:none !important;text-shadow:none !important;
	padding:0 !important;margin:0 !important;min-height:0 !important;
	transition:transform .18s cubic-bezier(.2,.8,.3,1),box-shadow .18s ease,filter .18s ease;
}

.amp-auth-btn--primary,
.amp-auth-form button.amp-auth-btn--primary{
	background:linear-gradient(135deg,#16213A 0%,#0E1A2E 55%,#16213A 100%) !important;
	background-size:180% 100% !important;
	color:#FFFFFF !important;
	box-shadow:0 6px 18px rgba(14,26,46,.22), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* متن و اسپینر داخل دکمه هم باید سفید بمانند (پوسته رنگ span را عوض می‌کند) */
.amp-auth-btn--primary .amp-auth-btn-text,
.amp-auth-btn--primary span{ color:#FFFFFF !important; }

/* خط درخشش طلایی که هنگام hover رد می‌شود */
.amp-auth-btn--primary::after{
	content:'';position:absolute;top:0;bottom:0;width:45%;
	left:-60%;transform:skewX(-20deg);
	background:linear-gradient(90deg,transparent,rgba(201,162,39,.28),transparent);
	transition:left .55s ease;pointer-events:none;
}
.amp-auth-btn--primary:hover:not(:disabled)::after{ left:120%; }

.amp-auth-btn--primary:hover:not(:disabled){
	background-position:100% 0 !important;
	transform:translateY(-2px);
	box-shadow:0 10px 26px rgba(14,26,46,.3), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.amp-auth-btn--primary:active:not(:disabled){
	transform:translateY(0);
	box-shadow:0 4px 12px rgba(14,26,46,.24) !important;
}
.amp-auth-btn--primary:focus-visible{
	box-shadow:0 0 0 3px rgba(201,162,39,.4), 0 6px 18px rgba(14,26,46,.22) !important;
}
.amp-auth-btn:disabled{
	opacity:.5;cursor:not-allowed;transform:none !important;filter:grayscale(.25);
}

/* Spinner */
.amp-auth-spinner{
	width:18px;height:18px;border:2px solid rgba(255,255,255,.3);
	border-top-color:#fff;border-radius:50%;
	animation:amp-auth-spin .7s linear infinite;display:inline-block;
}
@keyframes amp-auth-spin{to{transform:rotate(360deg);}}

/* Terms */
.amp-auth-terms{
	font-size:11.5px;color:#9AA5B8 !important;text-align:center;margin:14px 0 0;
}
.amp-auth-terms a{
	color:#C9A227 !important;text-decoration:none !important;
	border:0 !important;box-shadow:none !important;
}
.amp-auth-terms a:hover{text-decoration:underline !important;}

/* Back button — بالا-چپ کارت، هم‌تراز لوگو */
.amp-auth-back,
.amp-auth-form button.amp-auth-back{
	position:absolute !important;
	top:26px !important;left:26px !important;right:auto !important;
	width:34px !important;height:34px !important;min-width:34px !important;
	background:none !important;background-image:none !important;
	border:0 !important;border-radius:50% !important;
	cursor:pointer;padding:0 !important;margin:0 !important;
	color:#16213A !important;
	display:flex !important;align-items:center;justify-content:center;
	box-shadow:none !important;outline:none !important;
	z-index:2;
	transition:background .15s,color .15s;
}
.amp-auth-back:hover{
	background:#F6F4EE !important;color:#0E1A2E !important;
}
.amp-auth-back svg{width:18px;height:18px;display:block;}

/* پیام راهنما (مثلاً وقتی از تسویه‌حساب هدایت شده) */
.amp-auth-notice{
	background:#F6F4EE;border-radius:10px;
	padding:10px 14px;margin:0 0 18px;
	font-size:12.5px;color:#6B7386;line-height:1.8;
	border-right:3px solid #C9A227;
}

/* DEV mode code badge (فقط وقتی WP_DEBUG فعال و سرویس پیامک تنظیم نشده) */
.amp-auth-dev-code{
	background:#FFF8E6;border:1px dashed #C9A227;border-radius:10px;
	padding:8px 12px;font-size:12.5px;color:#8A6F1A;text-align:center;
	margin:-8px 0 16px;font-weight:600;letter-spacing:.3px;direction:ltr;
}

/* OTP boxes */
.amp-auth-otp-wrap{position:relative;margin-bottom:16px;}
/* فیلد واقعی OTP: شفاف ولی «واقعاً روی صفحه» است.
   اگر با display:none یا visibility پنهان شود، iOS کد پیامک را بالای کیبورد پیشنهاد نمی‌دهد. */
.amp-auth-otp-hidden{
	position:absolute;width:100%;height:100%;
	top:0;left:0;z-index:1;
	color:transparent !important;
	background:transparent !important;
	border:0 !important;outline:none !important;box-shadow:none !important;
	caret-color:transparent;
	font-size:16px; /* کمتر از 16px باعث زوم خودکار در iOS می‌شود */
	text-align:center;
	letter-spacing:2em;
	-webkit-text-fill-color:transparent;
}
.amp-auth-otp-boxes{
	display:flex;gap:8px;justify-content:center;direction:ltr;
}
.amp-auth-otp-box{
	width:48px;height:58px;border:1.5px solid #EDE7D8;border-radius:12px;
	background:#FAFAF8;display:flex;align-items:center;justify-content:center;
	font-size:22px;font-weight:700;color:#16213A;
	transition:border-color .15s,background .15s;position:relative;
}
.amp-auth-otp-box.is-filled{background:#fff;}
.amp-auth-otp-box.is-active{
	border-color:#C9A227;background:#fff;
	box-shadow:0 0 0 3px rgba(201,162,39,.12);
}
.amp-auth-otp-box.is-active::after{
	content:'';position:absolute;bottom:10px;left:50%;
	transform:translateX(-50%);
	width:20px;height:2px;background:#C9A227;border-radius:1px;
	animation:amp-auth-blink .8s ease-in-out infinite;
}
@keyframes amp-auth-blink{0%,100%{opacity:1;}50%{opacity:0;}}
.amp-auth-otp-box.is-error{border-color:#C0392B;background:#FFF5F5;}

/* لینک تعویض روش ورود (رمز عبور / کد پیامکی) */
.amp-auth-alt-link{
	text-align:center;margin:14px 0 0;
}
.amp-auth-link-btn{
	background:none !important;border:0 !important;padding:0 !important;
	margin:0 !important;cursor:pointer;height:auto !important;
	font-family:inherit !important;
	font-size:11.5px !important;font-weight:400 !important;
	color:#9AA5B8 !important;
	text-decoration:none !important;outline:none !important;
	box-shadow:none !important;
	transition:color .15s;
}
.amp-auth-link-btn:hover{color:#16213A !important;}

/* Resend */
.amp-auth-resend{
	margin-top:18px;
	display:flex;flex-direction:column;align-items:center;gap:12px;
	min-height:44px;
}
.amp-auth-countdown{
	font-size:13px;font-weight:600;color:#8A93A6;letter-spacing:.3px;
	direction:rtl;
}
.amp-auth-countdown:empty{display:none;}
.amp-auth-resend-btn{
	display:inline-flex;align-items:center;gap:6px;
	background:#fff !important;border:1.5px solid #E4C86A !important;
	color:#B8901F !important;font-family:inherit;
	font-size:13.5px;font-weight:700;cursor:pointer;text-decoration:none !important;
	padding:9px 22px;border-radius:999px;line-height:1;
	transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.amp-auth-resend-btn:hover{
	background:#FBF6E8 !important;border-color:#C9A227 !important;color:#96760F !important;
}
.amp-auth-resend-btn:active{transform:translateY(1px);}
/* رعایت hidden حتی وقتی تم استایل button می‌دهد */
.amp-auth-resend-btn[hidden],
.amp-auth-resend [hidden]{display:none !important;}

/* Success */
.amp-auth-step#amp-auth-step-success{text-align:center;}
.amp-auth-success-icon{margin-bottom:16px;}

/* ===== حالت Inline — جایگزین فرم پیش‌فرض صفحه my-account ===== */
.amp-auth-inline-wrap{
	font-family:'Peyda',Tahoma,sans-serif;direction:rtl;
	display:flex;justify-content:center;padding:40px 16px 60px;
}
.amp-auth-form-card{
	width:100%;max-width:400px;background:#fff;
	border:1px solid #EDE7D8;border-radius:20px;
	box-shadow:0 10px 40px rgba(14,26,46,.06);
	overflow:hidden;
}
.amp-auth-form-card .amp-auth-form{box-shadow:none;border-radius:0;}

/* Mobile */
@media(max-width:480px){
	.amp-auth-box{margin:0;}
	.amp-auth-overlay{align-items:flex-end;}
	.amp-auth-form{border-radius:20px 20px 0 0;}
	.amp-auth-otp-box{width:42px;height:52px;font-size:20px;}

	/* در موبایل دکمه بستن داخل کارت می‌آید؛ اگر سمت چپ بماند
	   با دکمه «بازگشت» هم‌پوشانی پیدا می‌کند — پس به سمت راست منتقل می‌شود. */
	.amp-auth-close{
		top:16px !important;left:auto !important;right:16px !important;
		box-shadow:none !important;border-color:#EDE7D8 !important;
	}
	.amp-auth-back{top:16px !important;left:16px !important;}

	.amp-auth-head{padding:26px 24px 4px;}
	.amp-auth-step{padding:24px 24px 22px;}
	.amp-auth-inline-wrap{padding:24px 14px 40px;}
	.amp-auth-form-card{border-radius:16px;}
}

/* موبایل خیلی باریک (مثل iPhone SE) — خانه‌های کد نباید سرریز کنند */
@media(max-width:360px){
	.amp-auth-otp-boxes{gap:6px;}
	.amp-auth-otp-box{width:38px;height:48px;font-size:18px;}
	.amp-auth-step{padding:20px 18px 20px;}
}