/**
 * Hesabım (WooCommerce My Account) — giriş/kayıt ekranlarının profesyonel
 * yeniden tasarımı.
 *
 * Kapsam: sadece /my-account/ sayfasının WooCommerce şablonları (login,
 * register, ve giriş yapılmış hesap paneli sekmeleri). Site geneli
 * tasarımına (header/footer/hero/kurs kartları) dokunulmadı.
 *
 * Marka tokenları (design-v2.css'ten): Navy #353794, Teal #57BEC7,
 * Green #8AC66E, radius-8/radius-16, gray-200 #E7ECF3.
 */

.woocommerce-account .woocommerce {
	max-width: 1000px;
	margin: 0 auto;
	padding: 48px 24px 64px;
}

.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
	font-family: "Inter", sans-serif;
}

/* ---- Giriş / Kayıt ekranı ---- */

.reten-auth {
	width: 100%;
}

.reten-auth-grid {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: stretch;
	gap: 0;
	margin: 0 !important;
}

.reten-auth-grid.reten-auth-grid--single {
	grid-template-columns: 1fr;
	max-width: 460px;
	margin: 0 auto !important;
}

.reten-auth-card {
	background: #ffffff;
	border: 1px solid #E7ECF3;
	border-radius: 16px;
	padding: 40px 36px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
	float: none !important;
	width: auto !important;
}

.reten-auth-card--login {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-right: none;
}

.reten-auth-grid--single .reten-auth-card {
	border-radius: 16px;
}

.reten-auth-card--register {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.reten-auth-divider {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 1px;
	background: #E7ECF3;
}

.reten-auth-divider span {
	position: absolute;
	background: #ffffff;
	border: 1px solid #E7ECF3;
	border-radius: 999px;
	padding: 6px 14px;
	font-size: 13px;
	font-weight: 600;
	color: #64748B;
	text-transform: lowercase;
	white-space: nowrap;
}

.reten-auth-icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 16px;
}

.reten-auth-card--login .reten-auth-icon {
	background: rgba(53, 55, 148, .1);
	color: #353794;
}

.reten-auth-card--register .reten-auth-icon {
	background: rgba(87, 190, 199, .14);
	color: #17878f;
}

.reten-auth-title {
	font-size: 22px;
	font-weight: 700;
	color: #0F172A;
	margin: 0 0 4px;
}

.reten-auth-subtitle {
	font-size: 14px;
	color: #64748B;
	margin: 0 0 24px;
}

.reten-auth-note {
	font-size: 13px;
	color: #64748B;
	background: #F8FAFC;
	border-radius: 8px;
	padding: 10px 12px;
	margin: 0 0 16px;
}

/* Form alanları */
.reten-auth-card .form-row {
	margin: 0 0 18px;
}

.reten-auth-card label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #334155;
	margin-bottom: 6px;
}

.reten-auth-card .input-text {
	width: 100%;
	height: 46px;
	padding: 0 14px;
	border: 1px solid #E7ECF3;
	border-radius: 8px;
	font-size: 15px;
	font-family: inherit;
	transition: border-color 150ms ease, box-shadow 150ms ease;
	box-sizing: border-box;
}

.reten-auth-card .input-text:focus {
	outline: none;
	border-color: #353794;
	box-shadow: 0 0 0 3px rgba(53, 55, 148, .12);
}

.reten-auth-row-inline {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
}

.reten-auth-card .woocommerce-form-login__rememberme {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 400;
	color: #475569;
	margin: 0;
}

.reten-auth-submit {
	width: 100%;
	height: 46px;
	border-radius: 8px !important;
	background: #353794 !important;
	color: #ffffff !important;
	border: none !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	cursor: pointer;
	transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .08);
}

.reten-auth-submit:hover {
	background: #2b2d78 !important;
	box-shadow: 0 4px 12px rgba(53, 55, 148, .22);
}

.reten-auth-submit--secondary {
	background: #17878f !important;
}

.reten-auth-submit--secondary:hover {
	background: #136d73 !important;
	box-shadow: 0 4px 12px rgba(23, 135, 143, .22);
}

.woocommerce-LostPassword.lost_password {
	margin: 12px 0 0;
	font-size: 13px;
	text-align: center;
}

.woocommerce-LostPassword.lost_password a {
	color: #353794;
	font-weight: 600;
	text-decoration: none;
}

.woocommerce-LostPassword.lost_password a:hover {
	text-decoration: underline;
}

/* Mobil: kartlar alt alta, ayraç yatay hale gelir */
@media (max-width: 767px) {
	.reten-auth-grid {
		grid-template-columns: 1fr;
	}

	.reten-auth-divider {
		width: auto;
		height: 1px;
		background: #E7ECF3;
		margin: 8px 0;
	}

	.reten-auth-card--login,
	.reten-auth-card--register {
		border-radius: 16px;
		border-right: 1px solid #E7ECF3;
	}

	.reten-auth-card {
		padding: 28px 22px;
	}

	.woocommerce-account .woocommerce {
		padding: 24px 16px 40px;
	}
}

/* ---- Giriş yapılmış Hesabım paneli (sekmeler + içerik) — hafif cila ---- */

.woocommerce-MyAccount-navigation ul {
	border: 1px solid #E7ECF3;
	border-radius: 16px;
	overflow: hidden;
	background: #ffffff;
}

.woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid #E7ECF3;
}

.woocommerce-MyAccount-navigation li:last-child {
	border-bottom: none;
}

.woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 12px 18px;
	font-weight: 500;
	color: #334155;
}

.woocommerce-MyAccount-navigation li.is-active a {
	background: rgba(53, 55, 148, .08);
	color: #353794;
	font-weight: 700;
	border-left: 3px solid #353794;
	padding-left: 15px;
}

.woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-MyAccount-content .button {
	border-radius: 8px !important;
	background: #353794 !important;
	color: #fff !important;
	font-weight: 600 !important;
}

/* ---- Kayıt/Giriş akışı yeniden tasarımı (2026-08) ----
 * İlk görünen ekran her zaman giriş formu; kayıt kartı "Üye olun"
 * linkine tıklanınca JS ile açılır (bkz. assets/js/auth-form.js).
 * Önceki yan-yana 2 sütunlu grid tek-kart (merkezi) görünüme çevrildi.
 */

.reten-auth-grid {
	grid-template-columns: 1fr;
	max-width: 460px;
	margin: 0 auto !important;
}

.reten-auth-divider {
	display: none;
}

.reten-auth-card--login,
.reten-auth-card--register {
	border-radius: 16px;
	border-right: none;
}

.reten-auth-card--register {
	display: none;
}

.reten-auth-grid.reten-auth-show-register .reten-auth-card--login {
	display: none;
}

.reten-auth-grid.reten-auth-show-register .reten-auth-card--register {
	display: block;
}

@media (max-width: 767px) {
	.reten-auth-card--login,
	.reten-auth-card--register {
		border-right: none;
	}
}

/* Giriş/Kayıt geçiş linki */
.reten-auth-switch {
	margin: 16px 0 0;
	text-align: center;
	font-size: 14px;
	color: #64748B;
}

.reten-auth-switch button {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	color: #353794;
	font-weight: 700;
	font-size: 14px;
	font-family: inherit;
	cursor: pointer;
	text-decoration: underline;
}

.reten-auth-switch button:hover {
	color: #2b2d78;
}

/* Alan altı yardım metni (ör. Branş) */
.reten-auth-field-hint {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	color: #64748B;
}

.reten-auth-optional {
	font-weight: 400;
	color: #94A3B8;
	text-transform: none;
}

/* Onay kutuları — satır minimum 44px dokunma alanına sahip (Mobil UX
 * Sprinti, bkz. reten-auth-consent-touch.js: boş satır alanına (checkbox/
 * label dışına) tıklamak da kutuyu işaretler, checkbox'ın kendisi ve
 * label'ın native "for" davranışı zaten kendi alanlarında çalışıyordu).
 * Checkbox görsel boyutu aşırı büyütülmedi (17px -> 20px, ~%18 artış);
 * asıl dokunma alanı satırın padding+min-height'ı ile sağlanıyor. */
.reten-auth-consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	min-height: 44px;
	margin: 0 -8px 4px !important;
	padding: 10px 8px;
	border-radius: 8px;
	cursor: pointer;
	transition: background-color 150ms ease;
	box-sizing: border-box;
}

.reten-auth-consent:hover {
	background-color: rgba(53, 55, 148, .04);
}

.reten-auth-consent input[type="checkbox"] {
	margin-top: 2px;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	accent-color: #353794;
	cursor: pointer;
}

.reten-auth-consent label {
	font-size: 13px;
	font-weight: 400;
	color: #475569;
	line-height: 1.5;
	margin: 0;
	cursor: pointer;
}

.reten-auth-consent a {
	color: #353794;
	font-weight: 600;
	text-decoration: underline;
}

.reten-auth-consent a:hover {
	color: #2b2d78;
}

/* "Ücretsiz Üye Ol" — marka yeşili, güven veren premium CTA */
.reten-auth-submit--register {
	background: #6B9D55 !important;
}

.reten-auth-submit--register:hover {
	background: #8AC66E !important;
	box-shadow: 0 4px 12px rgba(107, 157, 85, .28);
}

.reten-auth-submit--register:active {
	background: #587F45 !important;
}
