/* =========================================================
   Khodabndelo360 Core — صفحات ورود / ثبت‌نام / بازیابی رمز
   طراحی مجدد: پس‌زمینه تمام‌عرض هماهنگ با هویت بصری سایت،
   کارت با تفکیک واضح از پس‌زمینه، بدون افکت‌های عمومی/ژنریک.
   ========================================================= */

/* Breakout کامل از هر کانتینر والد (از جمله .k360-page با عرض محدود ۸۲۰px)
   تا پس‌زمینه واقعاً تمام‌عرض صفحه باشد، نه فقط عرض محتوای صفحه. */
.k360-auth-page {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	min-height: calc(100vh - 72px - 260px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 64px 20px;
	background: var(--k360-bg-alt, #f6f8fb);
	overflow: hidden;
	isolation: isolate;
	box-sizing: border-box;
}

:root[data-theme="dark"] .k360-auth-page {
	background: var(--k360-bg, #0a1220);
}

/* پس‌زمینه ظریف - همسو با Hero اصلی سایت، نه یک گرادیان تصادفی */
.k360-auth-page-glow {
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(680px 420px at 50% -8%, rgba(37, 99, 235, 0.10), transparent 70%),
		linear-gradient(180deg, var(--k360-bg-alt, #f6f8fb) 0%, var(--k360-bg, #fff) 55%);
}
:root[data-theme="dark"] .k360-auth-page-glow {
	background:
		radial-gradient(680px 420px at 50% -8%, rgba(59, 130, 246, 0.14), transparent 70%),
		linear-gradient(180deg, #0e1a2e 0%, #0a1220 55%);
}

.k360-auth-page-inner {
	position: relative;
	width: 100%;
	max-width: 440px;
}

.k360-auth-page-logo {
	display: flex;
	justify-content: center;
	margin-bottom: 28px;
}
.k360-auth-page-logo img { max-height: 38px; width: auto; }
.k360-auth-page-logo span {
	font-weight: 800;
	font-size: 19px;
	color: var(--k360-navy-900, #0a1628);
}
:root[data-theme="dark"] .k360-auth-page-logo span { color: #fff; }

/* ---------- کارت اصلی ---------- */
.k360-auth-box {
	background: var(--k360-surface, #fff);
	border: 1px solid var(--k360-border, #e6e9ef);
	border-radius: var(--k360-radius-lg, 24px);
	padding: 40px 34px 34px;
	box-shadow: 0 1px 2px rgba(16,25,43,0.04), 0 16px 40px -12px rgba(16,25,43,0.14);
}
:root[data-theme="dark"] .k360-auth-box {
	box-shadow: 0 1px 2px rgba(0,0,0,0.2), 0 16px 40px -12px rgba(0,0,0,0.5);
}

.k360-auth-title {
	text-align: center;
	font-size: 21px;
	font-weight: 700;
	margin: 0 0 6px;
	color: var(--k360-text, #10192b);
}

.k360-auth-subtitle {
	text-align: center;
	color: var(--k360-text-faint, #8892a6);
	font-size: 13.5px;
	margin: 0 0 26px;
}

/* خط تفکیک واضح بین عنوان و فرم - همان چیزی که کارت را از یک باکس عمومی جدا می‌کند */
.k360-auth-form {
	padding-top: 22px;
	border-top: 1px solid var(--k360-border, #e6e9ef);
}

.k360-auth-description {
	color: var(--k360-text-muted, #56607a);
	text-align: center;
	margin: 0 0 22px;
	font-size: 14px;
	line-height: 1.9;
}

.k360-auth-alert {
	padding: 12px 16px;
	border-radius: var(--k360-radius-sm, 10px);
	font-size: 13.5px;
	margin-bottom: 20px;
	line-height: 1.8;
	border: 1px solid transparent;
}
.k360-auth-alert-error {
	background: rgba(220, 38, 38, 0.06);
	color: #b91c1c;
	border-color: rgba(220, 38, 38, 0.18);
}
.k360-auth-alert-success {
	background: rgba(22, 163, 74, 0.06);
	color: #15803d;
	border-color: rgba(22, 163, 74, 0.18);
}

.k360-auth-field { margin-bottom: 18px; }
.k360-auth-field label {
	display: block;
	font-size: 13.5px;
	font-weight: 600;
	margin-bottom: 7px;
	color: var(--k360-text-muted, #56607a);
}
.k360-auth-field input {
	width: 100%;
	padding: 12px 15px;
	border-radius: var(--k360-radius-sm, 10px);
	border: 1px solid var(--k360-border, #e6e9ef);
	background: var(--k360-bg-alt, #f6f8fb);
	color: var(--k360-text, #10192b);
	font-size: 14.5px;
	transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
:root[data-theme="dark"] .k360-auth-field input {
	background: var(--k360-bg, #0a1220);
}
.k360-auth-field input:focus {
	outline: none;
	border-color: var(--k360-blue-500, #2563eb);
	background: var(--k360-surface, #fff);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.k360-auth-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 24px;
	font-size: 13px;
}
.k360-auth-checkbox { display: flex; align-items: center; gap: 6px; color: var(--k360-text-muted, #56607a); }
.k360-auth-checkbox input { width: auto; }
.k360-auth-row a { color: var(--k360-blue-500, #2563eb); font-weight: 500; }
.k360-auth-row a:hover { text-decoration: underline; }

.k360-auth-submit {
	width: 100%;
	padding: 13px;
	font-size: 15px;
	border-radius: var(--k360-radius-sm, 10px) !important;
}

/* پاورقی کارت با خط تفکیک از فرم بالا */
.k360-auth-footer-link {
	text-align: center;
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid var(--k360-border, #e6e9ef);
	font-size: 13.5px;
	color: var(--k360-text-faint, #8892a6);
}
.k360-auth-footer-link a { color: var(--k360-blue-500, #2563eb); font-weight: 600; }
.k360-auth-footer-link a:hover { text-decoration: underline; }

@media (max-width: 480px) {
	.k360-auth-page { padding: 40px 16px; min-height: auto; }
	.k360-auth-box { padding: 30px 22px 26px; }
}