/* ==========================================================================
   طرح فروش ویژه — فرمِ ثبت‌نام
   تمِ سبزِ روشن. همهٔ رنگ‌ها از متغیرهای زیر می‌آیند تا تغییرِ تم
   بدونِ دست‌زدن به بقیهٔ فایل ممکن باشد.
   ========================================================================== */

.tf-wrap {
	--tf-green-50:  #f1fbf4;
	--tf-green-100: #dcf5e4;
	--tf-green-200: #b9ead0;
	--tf-green-400: #58c58a;
	--tf-green-600: #2f9e63;
	--tf-green-700: #24804f;
	--tf-ink:       #1f2a24;
	--tf-muted:     #6b7d73;
	--tf-border:    #d7e9de;
	--tf-err:       #c0392b;
	--tf-radius:    14px;

	direction: rtl;
	max-width: 860px;
	margin: 0 auto;
	font-family: inherit;
	color: var(--tf-ink);
	line-height: 1.9;
}

.tf-head { text-align: center; margin: 30px 0 22px; }
.tf-head h2 { margin: 0 0 8px; font-size: 1.55rem; color: var(--tf-green-700); }
.tf-head p  { margin: 0; color: var(--tf-muted); font-size: .97rem; }

.tf-card {
	background: #fff;
	border: 1px solid var(--tf-border);
	border-radius: var(--tf-radius);
	padding: 20px 22px;
	margin-bottom: 16px;
	box-shadow: 0 1px 3px rgba(36, 128, 79, .06);
}

.tf-step-title {
	display: flex; align-items: center; gap: 10px;
	font-weight: 700; font-size: 1.05rem;
	color: var(--tf-green-700);
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px dashed var(--tf-border);
}
.tf-num {
	display: inline-flex; align-items: center; justify-content: center;
	width: 28px; height: 28px; border-radius: 50%;
	background: var(--tf-green-100); color: var(--tf-green-700);
	font-size: .9rem; font-weight: 700;
}

/* گامِ قفل‌شده */
.tf-locked { opacity: .5; pointer-events: none; filter: grayscale(.35); }
.tf-done-step .tf-num { background: var(--tf-green-600); color: #fff; }

.tf-row { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 12px; }
/* ردیفی که باید از بلوکِ بالاییِ خود فاصله بگیرد (مثلِ نشانی پس از استعلام) */
.tf-row.tf-row-gap { margin-top: 22px; }
.tf-field { flex: 1 1 240px; display: flex; flex-direction: column; }
.tf-field.tf-full { flex-basis: 100%; }
.tf-field-btn { flex: 0 0 auto; justify-content: flex-end; }

.tf-field label { font-size: .9rem; margin-bottom: 6px; color: var(--tf-ink); font-weight: 600; }
.tf-field label small { color: var(--tf-muted); font-weight: 400; }

.tf-input {
	width: 100%;
	padding: 11px 13px;
	border: 1px solid var(--tf-border);
	border-radius: 10px;
	background: var(--tf-green-50);
	font-size: 1rem; font-family: inherit; color: var(--tf-ink);
	transition: border-color .15s, box-shadow .15s, background .15s;
}
.tf-input:focus {
	outline: none; background: #fff;
	border-color: var(--tf-green-400);
	box-shadow: 0 0 0 3px var(--tf-green-100);
}
.tf-input:disabled { background: #f4f6f5; color: var(--tf-muted); }
textarea.tf-input { resize: vertical; min-height: 84px; }
/* باکسِ کدِ تأیید — ارقام درشت و جدا، برای خواندنِ سریعِ کدِ اتوفیل‌شده */
.tf-otp { text-align: center; letter-spacing: 8px; font-size: 1.15rem; font-weight: 700; }
.tf-otp.tf-ok-input { border-color: var(--tf-green-600); background: var(--tf-green-50); }

.tf-btn {
	padding: 11px 22px;
	border: none; border-radius: 10px;
	background: var(--tf-green-600); color: #fff;
	font-size: .98rem; font-family: inherit; font-weight: 600;
	cursor: pointer;
	transition: background .15s, transform .1s;
}
.tf-btn:hover:not(:disabled) { background: var(--tf-green-700); }
.tf-btn:active:not(:disabled) { transform: translateY(1px); }
.tf-btn:disabled { background: var(--tf-green-200); cursor: not-allowed; }
.tf-btn-lg { width: 100%; padding: 14px; font-size: 1.05rem; margin-top: 10px; }
.tf-busy { position: relative; color: transparent !important; }
.tf-busy::after {
	content: ''; position: absolute; inset: 0; margin: auto;
	width: 16px; height: 16px; border-radius: 50%;
	border: 2px solid rgba(255,255,255,.45); border-top-color: #fff;
	animation: tf-spin .7s linear infinite;
}
@keyframes tf-spin { to { transform: rotate(360deg); } }

.tf-msg { margin-top: 10px; font-size: .92rem; display: none; }
.tf-msg.tf-ok  { color: var(--tf-green-700); display: block; }
.tf-msg.tf-err { color: var(--tf-err);       display: block; }

.tf-bill-result { margin-top: 12px; }
.tf-bill-ok {
	background: var(--tf-green-50);
	border: 1px solid var(--tf-green-200);
	border-radius: 10px; padding: 12px 14px;
	font-size: .93rem; color: var(--tf-green-700);
}

.tf-note {
	background: var(--tf-green-50);
	border-right: 3px solid var(--tf-green-400);
	border-radius: 8px;
	padding: 12px 14px; margin: 16px 0 4px;
	font-size: .88rem; color: var(--tf-muted); line-height: 1.85;
}

.tf-done { text-align: center; padding: 34px 22px; }
.tf-done-icon {
	width: 60px; height: 60px; margin: 0 auto 14px;
	border-radius: 50%; background: var(--tf-green-100); color: var(--tf-green-600);
	font-size: 2rem; display: flex; align-items: center; justify-content: center;
}
.tf-done h3 { margin: 0 0 6px; color: var(--tf-green-700); }
.tf-done p  { margin: 4px 0; color: var(--tf-muted); }
.tf-code {
	display: inline-block; margin: 10px auto;
	padding: 12px 26px; border-radius: 12px;
	background: var(--tf-green-600); color: #fff;
	font-size: 1.5rem; font-weight: 700; letter-spacing: 1px; direction: ltr;
}
.tf-done-note { font-size: .9rem; }
/* جعبهٔ «سامانه استعلام پاسخگو نیست» — کهربایی تا با پیامِ موفقیت اشتباه نشود */
.tf-bypass {
	margin-top: 14px; padding: 14px 16px;
	background: #fff8ec; border: 1px solid #f0d9a8;
	border-right: 4px solid #d19a2f; border-radius: 10px;
	font-size: .93rem; color: #7a5a13; line-height: 1.9;
}
.tf-bypass p { margin: 0 0 6px; }
.tf-bypass .tf-agree { margin-top: 4px; color: #7a5a13; }
.tf-bypass .tf-agree input { accent-color: #d19a2f; }

.tf-closed { text-align: center; color: var(--tf-muted); padding: 28px; }
.tf-hidden { display: none !important; }

@media (max-width: 640px) {
	.tf-row { gap: 10px; }
	.tf-field { flex-basis: 100%; }
	.tf-field-btn .tf-btn { width: 100%; }
	.tf-card { padding: 16px; }
}


/* ── نوارِ پیشرفت (هم‌شکلِ فرمِ طرح تبدیل) ───────────────────────────────── */
.tf-progress { margin-bottom: 16px; }
.tf-progress-bar {
	height: 8px; border-radius: 99px; background: var(--tf-green-100); overflow: hidden;
}
.tf-progress-bar span {
	display: block; height: 100%; background: var(--tf-green-600);
	border-radius: 99px; transition: width .3s ease;
}
.tf-progress-text {
	text-align: center; margin-top: 8px;
	font-size: .88rem; color: var(--tf-muted);
}

/* ── عنوانِ گام و دکمه‌های ناوبری ────────────────────────────────────────── */
.tf-step-title {
	margin: 0 0 18px; font-size: 1.12rem; color: var(--tf-green-700);
	padding-bottom: 12px; border-bottom: 1px dashed var(--tf-border);
}
.tf-actions {
	display: flex; gap: 10px; justify-content: space-between;
	margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--tf-border);
}
.tf-btn-prev {
	background: transparent; color: var(--tf-muted);
	border: 1px solid var(--tf-border);
}
.tf-btn-prev:hover:not(:disabled) { background: #f4f6f5; color: var(--tf-ink); }
.tf-btn-next { min-width: 140px; margin-inline-start: auto; }
.tf-btn-sec { background: var(--tf-green-400); }
.tf-btn-sec:hover:not(:disabled) { background: var(--tf-green-600); }

/* ── گامِ ۴: انتخابِ ظرفیت ───────────────────────────────────────────────── */
.tf-models { display: flex; gap: 14px; flex-wrap: wrap; }
.tf-model { flex: 1 1 220px; cursor: pointer; }
.tf-model input { position: absolute; opacity: 0; pointer-events: none; }
.tf-model-box {
	display: flex; flex-direction: column; gap: 4px;
	border: 2px solid var(--tf-border); border-radius: 12px;
	padding: 20px 16px; background: #fff; text-align: center;
	transition: border-color .15s, background .15s, box-shadow .15s;
}
.tf-model-box b { color: var(--tf-ink); font-size: 1.02rem; }
.tf-model-box small { color: var(--tf-muted); }
.tf-model:hover .tf-model-box { border-color: var(--tf-green-400); }
.tf-model input:checked + .tf-model-box {
	border-color: var(--tf-green-600); background: var(--tf-green-50);
	box-shadow: 0 0 0 3px var(--tf-green-100);
}

/* ── نتیجهٔ استعلام ──────────────────────────────────────────────────────── */
.tf-result {
	margin-top: 12px; background: var(--tf-green-50);
	border: 1px solid var(--tf-green-200); border-radius: 10px;
	padding: 12px 14px; font-size: .93rem; color: var(--tf-green-700); line-height: 2;
}

/* ── گامِ ۷: مرور و تأیید ────────────────────────────────────────────────── */
.tf-review {
	border: 1px solid var(--tf-border); border-radius: 12px;
	overflow: hidden; margin-bottom: 4px;
}
.tf-review-row {
	display: flex; justify-content: space-between; gap: 14px;
	padding: 10px 14px; font-size: .93rem;
	border-bottom: 1px solid var(--tf-green-100);
}
.tf-review-row:last-child { border-bottom: none; }
.tf-review-row:nth-child(odd) { background: var(--tf-green-50); }
.tf-review-row span { color: var(--tf-muted); flex: 0 0 auto; }
.tf-review-row b { color: var(--tf-ink); text-align: left; word-break: break-word; }
.tf-agree {
	display: flex; align-items: flex-start; gap: 9px;
	margin-top: 14px; font-size: .93rem; cursor: pointer;
}
.tf-agree input { margin-top: 5px; width: 17px; height: 17px; accent-color: var(--tf-green-600); }

/* ── گامِ موفقیت ─────────────────────────────────────────────────────────── */
.tf-step-success { text-align: center; padding: 20px 0 10px; }
.tf-step-success .tf-step-title { border: none; justify-content: center; padding-bottom: 0; }