*, *::before, *::after { box-sizing: border-box; }

html, body { margin: 0; padding: 0; height: 100%; }

body.task-login {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	background: #0a1120;
	min-height: 100vh;
	-webkit-font-smoothing: antialiased;
}

body.task-login .header-title,
body.task-login #logo {
	display: none !important;
}

.tena-login-wrapper,
.tena-login-wrapper * {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

@keyframes tenaFadeUp {
	from { opacity: 0; transform: translateY(10px); }
	to   { opacity: 1; transform: translateY(0); }
}

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

/* ---------- Tam sayfa iki panel ---------- */

.tena-login-wrapper {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
	width: 100%;
}

@media (min-width: 900px) {
	.tena-login-wrapper { flex-direction: row; }
}

/* ---------- Sol marka paneli ---------- */

.tena-brand-panel {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
	padding: 28px 20px;
	background: linear-gradient(135deg, #121f3d 0%, #0d172d 55%, #080d1a 100%);
	color: #eef4ff;
	text-align: center;
	overflow: hidden;
	min-height: 200px;
}

@media (min-width: 900px) {
	.tena-brand-panel {
		flex: 1 1 50%;
		min-height: 100vh;
		min-height: 100dvh;
		padding: clamp(40px, 5vw, 64px);
	}
}

.tena-brand-panel::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255,255,255,0.4) 1px, transparent 1px);
	background-size: 20px 20px;
	opacity: 0.1;
	pointer-events: none;
}

.tena-brand-panel::after {
	content: "";
	position: absolute;
	inset: -20%;
	background-image:
		radial-gradient(circle at 10% 0%, rgba(37,99,235,0.2), transparent 35%),
		radial-gradient(circle at 100% 100%, rgba(79,70,229,0.2), transparent 40%),
		radial-gradient(circle at 50% 50%, rgba(23,46,84,0.35), transparent 55%);
	filter: blur(40px);
	pointer-events: none;
}

.tena-brand-inner {
	position: relative;
	z-index: 1;
	max-width: 460px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	animation: tenaFadeUp .6s ease both;
}

/* Yalniz logo: baslik/altbaslik/footer gizli */
.tena-title,
.tena-subtitle,
.tena-brand-footer {
	display: none !important;
}

.tena-logo-badge {
	width: clamp(80px, 10vw, 120px);
	height: clamp(80px, 10vw, 120px);
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	filter: drop-shadow(0 0 18px rgba(59,130,246,0.45));
}

.tena-logo-badge svg { width: 100%; height: 100%; }

.tena-logo {
	width: clamp(160px, 26vw, 380px);
	max-width: 80%;
	height: auto;
	margin: 0 auto;
	filter: drop-shadow(0 0 18px rgba(59,130,246,0.4));
}

.tena-accent-bar {
	width: 40px;
	height: 3px;
	margin: clamp(18px, 2.5vw, 28px) auto;
	border-radius: 999px;
	background: linear-gradient(to right, #60a5fa, #2563eb);
	box-shadow: 0 0 8px rgba(59,130,246,0.6);
}

.tena-slogan {
	font-size: clamp(13px, .4vw + 11px, 15px);
	color: #cbd5e1;
	max-width: 300px;
	line-height: 1.6;
	margin: 0 auto;
}

.tena-features {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	padding-top: 24px;
	margin-top: 24px;
	border-top: 1px solid rgba(255,255,255,0.1);
	width: 100%;
	max-width: 440px;
}

.tena-feature { display: flex; flex-direction: column; align-items: center; }

.tena-feature-icon {
	width: 36px; height: 36px; border-radius: 8px;
	background: rgba(255,255,255,0.05);
	border: 1px solid rgba(255,255,255,0.1);
	display: flex; align-items: center; justify-content: center;
	color: #e2e8f0; margin-bottom: 8px;
}

.tena-feature-label { font-size: 12px; font-weight: 500; color: #cbd5e1; }

/* ---------- Sag form paneli ---------- */

.tena-form-panel {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: clamp(28px, 4vw, 48px) clamp(20px, 4vw, 64px);
	background: #ffffff;
}

@media (min-width: 900px) {
	.tena-form-panel {
		flex: 1 1 50%;
		min-height: 100vh;
		min-height: 100dvh;
	}
}

.tena-form-inner {
	width: 100%;
	max-width: 420px;
	animation: tenaFadeUp .5s ease both;
}

.tena-form-title {
	font-size: clamp(22px, 1vw + 16px, 28px);
	font-weight: 700; color: #0f172a;
	letter-spacing: -.01em; margin: 0 0 6px; text-align: center;
}

.tena-form-subtitle {
	font-size: 14px; color: #64748b; margin: 0 0 32px; text-align: center;
}

.tena-error-banner {
	display: flex; align-items: flex-start; gap: 8px;
	margin-bottom: 20px; padding: 12px; border-radius: 8px;
	background: #fef2f2; border: 1px solid #fecaca; color: #dc2626;
	font-size: 12.5px; font-weight: 500; line-height: 1.5;
	animation: tenaFadeUp .25s ease both;
}
.tena-error-banner svg { color: #ef4444; flex: 0 0 auto; margin-top: 1px; }

.tena-form-inner form { width: 100%; }

.tena-form-inner table, .tena-form-inner tbody, .tena-form-inner tr, .tena-form-inner td {
	display: block; width: 100%;
}
.tena-form-inner td.title, .tena-form-inner td.input { padding: 0; }
.tena-form-inner tr + tr { margin-top: 18px; }

.tena-form-inner label {
	display: block; font-size: 13px; font-weight: 600; color: #374151; margin-bottom: 6px;
}

.tena-form-inner input[type="text"],
.tena-form-inner input[type="email"],
.tena-form-inner input[type="password"] {
	width: 100%; padding: 11px 14px; font-size: 14.5px;
	border: 1px solid #e2e8f0; border-radius: 8px;
	background: rgba(248,250,252,.5); color: #1e293b;
	transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.tena-form-inner input:focus {
	outline: none; background: #fff; border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba(59,130,246,.2);
}
.tena-form-inner input::placeholder { color: #94a3b8; }

.tena-pw-wrap { position: relative; display: block; width: 100%; }
.tena-pw-wrap input { padding-right: 40px; }
.tena-pw-toggle {
	position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
	background: none; border: none; padding: 4px; color: #94a3b8; cursor: pointer; display: flex;
}
.tena-pw-toggle:hover { color: #475569; }

.tena-form-inner label.checkbox {
	display: flex; align-items: center; gap: 8px;
	font-weight: 500; font-size: 13px; color: #475569; margin-top: 4px;
}
.tena-form-inner input[type="checkbox"] { width: 16px; height: 16px; accent-color: #2563eb; }

.tena-form-inner .cf-turnstile {
	margin: 20px 0 4px;
	display: flex;
	justify-content: center;
}

.tena-submit-btn {
	position: relative;
	width: 100%; margin-top: 18px; padding: 12px 16px;
	font-size: 15px; font-weight: 600;
	border: none; border-radius: 8px;
	background: #1665d8; color: #fff;
	display: flex; align-items: center; justify-content: center; gap: 8px;
	cursor: pointer; box-shadow: 0 4px 6px -1px rgba(59,130,246,.15);
	transition: background-color .12s ease;
}
.tena-submit-btn:hover { background: #1355b8; }
.tena-submit-btn:active { background: #0f4494; }
.tena-submit-btn.tena-loading { pointer-events: none; }
.tena-submit-btn.tena-loading span { visibility: hidden; }
.tena-submit-btn.tena-loading::after {
	content: ""; position: absolute; width: 16px; height: 16px; border-radius: 50%;
	border: 2px solid rgba(255,255,255,.35); border-top-color: #fff;
	animation: tenaSpin .6s linear infinite;
}

.tena-form-footer {
	padding-top: 28px; margin-top: 28px; text-align: center;
	font-size: 12.5px; color: #94a3b8; border-top: 1px solid #f1f5f9;
	width: 100%;
}

/* ---------- Mobil ---------- */

@media (max-width: 899px) {
	/* Sol panel ustte, logo tam ortada */
	.tena-brand-panel {
		order: -1;
		min-height: 180px;
		justify-content: center;
	}
	.tena-features { display: none; }
	.tena-accent-bar, .tena-slogan { display: none; }
}

@media (max-width: 420px) {
	.tena-brand-panel { padding: 20px 16px; min-height: 150px; }
	.tena-logo { width: 55%; max-width: 220px; }
	.tena-form-panel { padding: 24px 16px 40px; }
}