.felu-auth {
	max-width: 420px;
	margin: 0 auto;

	/* Tek yerden ayarlanabilir. Marka rengi Breakdance'ten gelir, yoksa siyaha düşer. */
	--felu-auth-radius: 12px;
	--felu-auth-border: #ddd;
	--felu-auth-brand: var( --bde-brand-primary-color, #111 );
	--felu-auth-align: left; /* içeren div center/right ise widget yine kendi hizasını korur */
	/* Widget fontu: ELLE yazılan STANDART family. Bilerek siteden ÇEKMİYORUZ
	   (--bde-body-font-family DEĞİL) — widget kendi kendine yeten/taşınabilir kalsın. */
	--felu-auth-font: "Source Sans 3", sans-serif;
}

/*
 * AMBIENT STİL İZOLASYONU. Shortcode bir Breakdance div'inin içinde; o div'in
 * text-align / line-height / font-size'ı widget'a SIZIYORDU. Kök + modal kartında
 * bu leak-eğilimli özellikleri AÇIKÇA sabitliyoruz → nereye konursa konsun aynı görünür.
 * (color bilerek inherit — site rengiyle uyumlu; font-family ARTIK SABİT: --felu-auth-font = Source Sans 3.)
 */
.felu-auth,
.felu-modal__card {
	text-align: var( --felu-auth-align );
	line-height: 1.5;
	font-size: 16px !important;          /* em/rem tabanı sabit → ölçek konteynerden bağımsız */
	letter-spacing: normal;
	text-transform: none;
	font-style: normal;
	font-weight: 400;
	font-family: var( --felu-auth-font );
	color: inherit !important;
	/* text-indent/word-spacing de KALITSALDIR ve reset'te eksikti: sayfa şablonu
	   (ör. Breakdance TY) bunları verirse kod alanındaki tek satıra sızıp rakamları
	   kutulardan kaydırır (ch matematiği bozulur). Reset'i tamamlıyoruz. */
	text-indent: 0;
	word-spacing: normal;
	-webkit-text-size-adjust: 100%;
}

.felu-auth *,
.felu-auth *::before,
.felu-auth *::after,
.felu-modal *,
.felu-modal *::before,
.felu-modal *::after {
	box-sizing: border-box;
}

/* TEK FONT KAYNAĞI — auth + CE + TY (hepsi .felu-auth kökü) içindeki HER öğe widget
   fontunu (--felu-auth-font = Source Sans 3) kullanır. Tema'nın eleman-bazlı font kurallarını
   (h2/p/label/button/a/input) tek yerden !important ile yener → her yeni öğe için ayrı
   font-family yazmaya gerek kalmaz. CE/TY popup kartı (.felu-modal) da .felu-auth içinde
   olduğundan kapsanır. Aşağıdaki tekil font-family !important'lar artık bunun yedeği. */
.felu-auth,
.felu-auth * {
	font-family: var( --felu-auth-font ) !important;
}

.felu-auth__panel[hidden],
.felu-modal[hidden] {
	display: none;
}

/* Başlıklar: tema/Breakdance h2 stilini (font-size, weight, renk, marj) miras almasın. */
.felu-auth__title,
.felu-modal__title {
	/* Breakdance başlıklara --bde-heading-font-family basar (body h2 / .bde-h2). Başlığı da
	   widget GÖVDE fontuna (Source Sans 3) zorluyoruz. !important: tema kuralı bağlama göre
	   (builderPrefix wrapper sınıfıysa) daha özgüllü olabilir; input'larda da aynı sebeple !important var. */
	font-family: var( --felu-auth-font ) !important;
	font-size: 1.5em !important;
	font-weight: 700;
	line-height: 1.25;
	color: inherit !important;
	letter-spacing: normal;
	text-transform: none;
}

.felu-auth__title {
	margin: 0 0 .35em;
	padding: 0;
	/* Hiza BAĞLAMA göre: giriş adımı SOLA (--felu-auth-align=left), kod adımı ORTALI kalır
	   (.felu-auth__code text-align:center miras). Sabit 'center' KALDIRILDI. */
	/* Başlıklar ("Sign in" / "Enter Code"): 22px, İNCE (bold değil). Paylaşılan
	   .felu-auth__title/.felu-modal__title kuralındaki 1.5em/700'ü BURADA ezer — yalnız
	   auth başlığı; CE/TY modal başlıkları etkilenmez. */
	font-size: 22px !important;
	font-weight: 400;
}

/* Giriş adımı alt başlığı ("Sign in or create an account") — başlığın altında 14px, ortalı. */
.felu-auth__lead {
	margin: 0 0 1.4rem;
	font-size: 14px !important;
	color: #0000008f !important;
	text-align: left;
}


/* Görsel olarak gizli, ekran okuyucuya açık. */
.felu-auth__sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect( 0 0 0 0 );
	white-space: nowrap;
	border: 0;
}

/* ------------------------------------------------------------------ */
/* Adım 1: pill input + içine gömülü sade ok                            */
/* ------------------------------------------------------------------ */

/* Çerçeve KAPSAYICIDA; input çıplak. Böylece ok da çerçevenin içinde kalıyor. */
.felu-auth__field {
	display: flex;
	align-items: center;
	background: #fff;
	border: 1px solid var( --felu-auth-border ) !important;
	border-radius: var( --felu-auth-radius );
	transition: border-color .15s ease, box-shadow .15s ease;
}

/* Normal: 1px border. Odakta: border markaya döner + 1px opak marka halka (box-shadow)
   = görünen 2px marka çerçeve. box-shadow yer kaplamadığı için layout sıçraması YOK. */
.felu-auth__field:focus-within {
	border-color: var( --felu-auth-brand ) !important;
	box-shadow: 0 0 0 1px var( --felu-auth-brand ) !important;
}

/* Tema input stillerini yenmek için biraz özgüllük. */
.felu-auth .felu-auth__field input.felu-auth__bare {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: .95em 0 .95em 1.1em;
	font-size: 1em !important;
	/*
	 * FONT — "@ ile RAKAM yan yana gelince baseline kayıyor" hatası için sabitlendi.
	 *
	 * Semptom (ölçüldü): "a@x" sorunsuz, ama "1@x" / "a@1" gibi @ ile rakamın KOMŞU
	 * olduğu her durumda "@" ve sonrası dikeyde kayıyordu.
	 *
	 * Sebep: harf/rakam ayrımı yapan bir OpenType özelliği — 'case' (Case-Sensitive
	 * Forms) ve/veya 'calt' (bağlamsal alternatifler). Bunlar @ ( ) - gibi sembolleri,
	 * yanlarında RAKAM veya BÜYÜK harf varken dikeyde yeniden konumlandırır (rakamlar
	 * küçük harften yüksektir). Harflerin yanında tetiklenmez → tam da görülen davranış.
	 *
	 * Neden 'inherit' YETMEDİ: kart da aynı tema fontunu (Source Sans 3) kullanıyor,
	 * dolayısıyla miras almak fontu değiştirmiyordu.
	 *
	 * Çözüm: OpenType özelliklerini KAPATMAK. Bu üç satır özelliği (case/calt dahil)
	 * devre dışı bırakır ve sorunu kaynağında keser — font'u değiştirmeye gerek kalmaz,
	 * böylece alan site fontuyla uyumlu kalır.
	 *
	 * !important (font-family): temanın input'lara kendi fontunu dayattığı ölçüldü
	 * (TY'de kod alanı "Source Sans 3"e düşüyordu), sade 'inherit' o yüzden yetmez.
	 *
	 * ⚠️ EĞER "@ + rakam" kayması GERİ GELİRSE: suçlu özellikler değil FONT'un kendisi
	 * demektir → font-family'yi şununla değiştir (test edilmiş, kesin çözer):
	 *   system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important
	 */
	font-family: inherit !important;
	font-variant-ligatures: none;
	font-feature-settings: normal;
	font-variant-numeric: normal;
	line-height: 1.3;
	color: inherit !important;
	background: transparent;
	border: 0;
	border-radius: inherit;
	box-shadow: none;
	outline: none; /* odak halkası kapsayıcıda */
}

.felu-auth .felu-auth__field input.felu-auth__bare::placeholder {
	color: #8a8a8a !important;
	opacity: 1;
}

/* Hoş geldin mailinden gelen KİLİTLİ e-posta alanı — kullanıcı yazamadığını GÖRSÜN.
   ÖZGÜLLÜK: taban kural (.felu-auth .felu-auth__field input.felu-auth__bare = 0,3,1)
   color veriyor → [readonly] ekleyip (0,4,1) yapmak ZORUNLU, yoksa taban kural kazanır. */
.felu-auth .felu-auth__field input.felu-auth__bare[readonly] {
	color: #6b7280 !important;
	cursor: default;
}

/* :has() destekleyen tarayıcıda alanın zemini de sönük olur; desteklemeyen
   tarayıcı bu kuralı atlar, yukarıdaki soluk metin sinyali yine de kalır. */
.felu-auth__field:has( input.felu-auth__bare[readonly] ) {
	background: #f6f7f9;
}

.felu-auth__go {
	flex: 0 0 auto;
	font-size: 1em !important;
	line-height: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.9em;  /* ~46px dokunma alanı */
	height: 2.9em;
	min-width: 0;
	margin: 0 .2em 0 0;
	padding: 0;
	color: #111 !important;
	background: transparent;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: color .15s ease, transform .15s ease;
}

.felu-auth__go:hover:not([disabled]) {
	color: var( --felu-auth-brand ) !important;
	transform: translateX( 2px );
}

/* Buton arka planı olmadığı için klavye odağı ayrıca görünür olmalı. */
.felu-auth__go:focus-visible {
	outline: 2px solid var( --felu-auth-brand );
	outline-offset: 2px;
}

.felu-auth__go[disabled] {
	opacity: .5;
	cursor: default;
	transform: none;
}

.felu-auth__go-icon {
	display: block;
}

.felu-auth__go-spinner {
	display: none;
	width: 1.05em;
	height: 1.05em;
	border: 2px solid rgba( 0, 0, 0, .18 );
	border-top-color: currentColor;
	border-radius: 50%;
	animation: felu-spin .6s linear infinite;
}

.felu-auth__go.is-busy .felu-auth__go-icon { display: none; }
.felu-auth__go.is-busy .felu-auth__go-spinner { display: block; }

@keyframes felu-spin {
	to { transform: rotate( 360deg ); }
}

/* ------------------------------------------------------------------ */
/* Adım 2: modal                                                        */
/* ------------------------------------------------------------------ */

.felu-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}

.felu-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba( 0, 0, 0, .45 );
}

.felu-modal__card {
	position: relative;
	width: 100%;
	max-width: 420px;
	box-sizing: border-box;
	padding: 2rem 2rem 1.5rem;
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 20px 60px rgba( 0, 0, 0, .25 );
	/*
	 * Popup içeriği DAİMA ortalı — üç akışta da (giriş, e-posta değişimi, TY) aynı.
	 * Eskiden burası 'left'ti ve .felu-ce/.felu-ty ayrı ayrı 'center' ile eziyordu;
	 * yani auth istisna, diğer ikisi kuraldı. Kuralı buraya taşıyıp o iki override'ı
	 * kaldırdık → tek kaynak.
	 *
	 * Satır içi formun (e-posta adımı) hizası BUNA BAĞLI DEĞİL: onu .felu-auth
	 * üzerindeki --felu-auth-align yönetir.
	 *
	 * DİKKAT: kod alanının kendi 'text-align: left'i (.felu-code__input) bundan
	 * BAĞIMSIZ ve DEĞİŞTİRİLEMEZ — padding/letter-spacing ch matematiği sola hizayı
	 * şart koşar; center yapılırsa rakamlar kutulardan kayar.
	 */
	text-align: center;
}

.felu-modal__close {
	position: absolute;
	top: .85rem;
	right: .85rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.2em;
	height: 2.2em;
	min-width: 0;
	padding: 0;
	line-height: 0;
	color: #666 !important;
	background: transparent;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
}

.felu-modal__close:hover { color: #111 !important; }

.felu-modal__close:focus-visible {
	outline: 2px solid var( --felu-auth-brand );
	outline-offset: 2px;
}

.felu-modal__title {
	margin: 0 0 .5rem;
	font-size: 22px !important; /* CE "Change email" + TY "Create your account" — auth başlıklarıyla eş (22px) */
}

.felu-modal__sub {
	margin: 0 0 1.4rem;
	font-size: .95em !important;
	color: #555 !important;
}

.felu-modal__sub strong {
	color: #111 !important;
}

/* ------------------------------------------------------------------ */
/* Kod adımı INLINE (auth) — popup YOK, form yerinde değişir.           */
/* NOT: .felu-modal* kuralları CE/TY popup'larında kullanılıyor,        */
/* DOKUNULMADI; bu blok yalnız auth'un inline kod adımı için.           */
/* ------------------------------------------------------------------ */
.felu-auth__code {
	/* .felu-code inline-block → ortalanır; alt yazı ve butonlar da ortalı
	   (modal kartındaki text-align:center görünümünü inline'da tekrar üretir). */
	text-align: center;
}

.felu-auth__sub {
	margin: 0 0 1.4rem;
	font-size: 1em !important; /* "diğer yazılar 16px" — Sent to: satırı 16px (base). Modal sub .95em kaldı. */
	color: #555 !important;
}

.felu-auth__sub strong { color: #111 !important; }

/* "Değiştir" (Change) satır içinde, e-postanın yanında. */
.felu-auth__sub .felu-auth__link { margin: 0 0 0 .35em; }

/* Kod adımındayken e-posta formunun etrafındaki genişletme kapıları (sözleşme/aydınlatma
   metni) gizlensin — kod girerken yasal metin göstermek anlamsız + kafa karıştırır.
   data-step root'ta JS tarafından set edilir. */
.felu-auth[data-step="code"] .felu-auth__before,
.felu-auth[data-step="code"] .felu-auth__after { display: none; }

/* ------------------------------------------------------------------ */
/* Kod alanı: TEK input, altında CSS ile çizilmiş 6 kutu                 */
/* ------------------------------------------------------------------ */

/*
 * Hizalama matematiği (monospace + ch birimi; 1ch = rakam genişliği):
 *   kutu = 3ch, boşluk = .8ch  →  bir karakterin ilerlemesi = 3.8ch
 *   letter-spacing = 3.8ch - 1ch = 2.8ch
 *   padding-left   = (3ch - 1ch) / 2 = 1ch   (ilk rakam ilk kutunun ortasına otursun)
 */
.felu-code {
	/* px SABİT (eski --box:3ch / --gap:.8ch değerlerinin yerine). ch, .felu-code'un fontuna
	   bağlıydı; tema fontu (Source Sans 3, non-monospace) sızınca kutular ile rakam-ch'i ayrışıp
	   rakamlar kutulardan kayıyordu. Sabit px kutu çizimini font-BAĞIMSIZ yapar → hiza köktenden
	   düzelir. (Alt padding/letter-spacing hâlâ 1ch kullanır = INPUT'un rakam genişliği; box artık px.) */
	--box: 36px;
	--gap: 9px;

	position: relative;
	display: inline-block;
	font-size: 1.5em !important;
	/* Kod alanı MONOSPACE — 6-kutu düzeni 'ch' matematiğine dayanır (1ch = rakam genişliği).
	   Source Sans 3 (orantılı) DENENDİ → rakamlar kutulara ORTALANMADI (ch, gerçek rakam
	   genişliğiyle uyuşmuyor; browser ch'yi tabular-nums'a göre hesaplamıyor). Monospace'te
	   her glif tam 1ch → rakamlar kutuya ortalanır. !important: catch-all
	   '.felu-auth * { font-family: var(--felu-auth-font) !important }'ı yenmek için (aksi halde SS3'e döner). */
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
	font-variant-numeric: tabular-nums;
}

.felu-code__boxes {
	display: grid;
	grid-template-columns: repeat( 6, var( --box ) );
	gap: var( --gap );
}

.felu-code__boxes span {
	height: var( --box ); /* kare */
	border: 1px solid var( --felu-auth-border ) !important;
	border-radius: 10px;
	transition: border-color .15s ease, box-shadow .15s ease;
}

/* Aktif (sıradaki) kutuyu vurgula — data-filled JS tarafından yazılır. */
.felu-code:focus-within[data-filled="0"] .felu-code__boxes span:nth-child(1),
.felu-code:focus-within[data-filled="1"] .felu-code__boxes span:nth-child(2),
.felu-code:focus-within[data-filled="2"] .felu-code__boxes span:nth-child(3),
.felu-code:focus-within[data-filled="3"] .felu-code__boxes span:nth-child(4),
.felu-code:focus-within[data-filled="4"] .felu-code__boxes span:nth-child(5),
.felu-code:focus-within[data-filled="5"] .felu-code__boxes span:nth-child(6) {
	border-color: var( --felu-auth-brand ) !important;
	box-shadow: 0 0 0 1px var( --felu-auth-brand ) !important;
}

.felu-auth .felu-code input.felu-code__input {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	/*
	 * Sağa fazladan genişlik. Son rakamdan sonra da letter-spacing eklendiği için
	 * içerik görünür alandan taşar; imleç sona gelince tarayıcı input'u yatay kaydırır
	 * ve rakamlar kutulardan kayar. Genişleterek iç kaydırmayı tümden engelliyoruz.
	 * Fazla alan şeffaf ve kutuların dışında olduğu için görünmez.
	 */
	width: calc( 100% + var( --box ) );
	box-sizing: border-box;
	margin: 0;
	/* Değişkenlere bağlı: kutu ölçüsünü değiştirince hizalama kendiliğinden düzelir. */
	padding: 0 0 0 calc( ( var( --box ) - 1ch ) / 2 );
	letter-spacing: calc( var( --box ) + var( --gap ) - 1ch );
	font: inherit;
	/*
	 * TEMA FONT SIZINTISI — HİZALAMA İÇİN KRİTİK.
	 *
	 * Yukarıdaki padding/letter-spacing 'ch' ile yazılı ve 1ch = BU input'un fontundaki
	 * rakam genişliği; kutular ise --box (3ch) ile .felu-code'un fontuna göre çiziliyor.
	 * İkisi AYNI font olmazsa rakamlar kutulardan kayar.
	 *
	 * 'font: inherit' (0,3,1) tema tarafından ezilebiliyor — ölçüldü (Breakdance TY
	 * sayfası): input "Source Sans 3" sans-serif'e düşüyor, kutular monospace kalıyordu
	 * → 1ch 11.93px vs 13.19px → her rakam ~4.8px geri kalıp 6. hanede ~24px kayıyordu.
	 * O yüzden ch'yi belirleyen İKİ özelliği !important ile sabitliyoruz.
	 *
	 * NOT: 'font' KISAYOLUNU !important yapmıyoruz — line-height'ı da ezip aşağıdaki
	 * dikey ortalamayı bozardı. Yalnız family + size sabitleniyor.
	 */
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
	font-size: inherit !important;
	/* font: inherit satır yüksekliğini de miras aldığı için rakam dikeyde kayabiliyor;
	   satır yüksekliğini kutu yüksekliğine sabitleyip dikey ortalıyoruz. */
	line-height: var( --box );
	color: #111 !important;
	text-align: left;
	/*
	 * ch MATEMATİĞİNİ KORUYAN RESET'LER — buradaki her satır hizalamayı etkiler:
	 * padding/letter-spacing 'ch' ile hesaplanıyor ve 1ch = INPUT'un fontundaki rakam
	 * genişliği. Kutular ise --box (3ch) ile .felu-code'un fontuna göre çizilir. İkisi
	 * ayrışırsa rakamlar kutulardan KAYAR. Tema/şablon bu değerleri sızdırabildiği için
	 * (özellikle Breakdance TY sayfası) burada açıkça sıfırlıyoruz.
	 */
	text-indent: 0;
	word-spacing: normal;
	text-transform: none;
	font-variant-numeric: tabular-nums; /* SS3'te rakamları EŞİT genişlik yapar (ch matematiği) */
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	outline: none;                    /* vurgu kutularda */
	caret-color: var( --felu-auth-brand );
}

/* 6 hane dolunca imleç, kutuların sağındaki boş alanda "7. hane" gibi görünüyor;
   dolu haldeyken gizliyoruz (auto-submit zaten hemen tetikleniyor).
   ÖZGÜLLÜK NOTU: taban kural (.felu-auth .felu-code input.felu-code__input = 0,3,1)
   caret-color'ı set ediyor. Bunu ezmek için AYNI deseni + [data-filled] ile (0,4,1)
   yapmak ZORUNLU — sade `.felu-code[data-filled="6"] .felu-code__input` (0,3,0) taban
   kurala yenilir ve imleç gizlenmez. */
.felu-auth .felu-code[data-filled="6"] input.felu-code__input {
	caret-color: transparent;
}

/* ------------------------------------------------------------------ */
/* Ortak                                                                */
/* ------------------------------------------------------------------ */

/*
 * Aksiyon butonu (marka rengi pill) — ÜÇ akışta da aynı.
 *
 * Eskiden bu kural bomboştu (çıplak tarayıcı butonu) çünkü auth'ta buton görsel olarak
 * gizliydi; CE ise kendi scope'unda pill'e çeviriyordu. Auth'un butonu GÖRÜNÜR yapılınca
 * (bkz. auth-form.php) çıplak kalmasın diye pill tanımı buraya, tek kaynağa taşındı.
 */
.felu-auth__button {
	/*
	 * display:block + fit-content: buton içeriği kadar dar kalır AMA kendi satırını
	 * kaplar. 'inline-block' olsaydı auth'ta hemen ardından gelen "Resend code" linki
	 * (o da inline-block) YAN YANA gelirdi — auth'un kod formu grid DEĞİL, düz akış.
	 * (CE/TY'de sorun görünmez, çünkü oradaki stage'ler grid → her çocuk kendi satırı.)
	 * margin auto: text-align'dan bağımsız olarak ortalar.
	 */
	display: block;
	width: fit-content;
	margin: 1em auto 0;
	padding: .7rem 1.4rem;
	background: var( --felu-auth-brand );
	color: #fff !important;
	border: 0;
	border-radius: 999px;
	font: inherit;
	font-family: var( --felu-auth-font ) !important; /* tema button fontunu yen → widget fontu (Source Sans 3) */
	font-size: 1em !important;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
}

.felu-auth__button[disabled] {
	opacity: .6;
	cursor: default;
}

.felu-auth__link {
	display: inline-block;
	margin-top: 1rem;
	padding: 0;
	background: none;
	border: 0;
	color: var( --felu-auth-brand ) !important;
	text-decoration: none;
	cursor: pointer;
	font: inherit;
	font-family: var( --felu-auth-font ) !important; /* tema link/button fontunu yen → widget fontu (Source Sans 3) */
}

.felu-auth__link:hover { text-decoration: underline; }

.felu-auth__link:focus-visible {
	outline: 2px solid var( --felu-auth-brand );
	outline-offset: 2px;
	border-radius: 4px;
}

.felu-auth__link[disabled] {
	opacity: .55;
	cursor: default;
	color: #888 !important;
	text-decoration: none;
}

/* "Değiştir" satır içinde durur. */
.felu-modal__sub .felu-auth__link {
	margin: 0 0 0 .35em;
	font-size: inherit !important;
}

.felu-auth__suggest {
	margin: .5em 0 0;
	padding: 0;
	background: none;
	border: 0;
	font: inherit;
	font-size: .9em !important;
	cursor: pointer;
	text-decoration: underline;
}

/* Durum mesajları renkle DEĞİL, metinle anlatılır (WCAG 1.4.1). Renk destekleyici. */
.felu-auth__error {
	margin: .9em 0 0;
	color: #b32d2e !important;
}

.felu-auth__notice {
	margin: .9em 0 0;
	color: #1d6d33 !important;
}

/*
 * Bal küpü. display:none KULLANMIYORUZ — gelişmiş botlar onu atlar.
 * Ekran dışına alıyoruz; gerçek kullanıcı görmez, ekran okuyucu aria-hidden ile atlar.
 */
.felu-auth__hp {
	position: absolute !important;
	left: -9999px !important;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Genişletme kapıları (do_action). İçine push edilen içerik (ör. sözleşme metni)
   burada konumlanır. Boşken görünmez — kimse takılmazsa boş bir div/boşluk kalmasın. */
.felu-auth__after {
	margin-top: 1.25rem;
	/* Hiza BAĞLAMA göre: auth ekranı --felu-auth-align=left → sözleşme metni SOLA yaslı;
	   TY modalı --felu-auth-align=center → legal metin ortalı kalır. (Eskiden sabit 'center'dı.) */
	text-align: var( --felu-auth-align );
}

.felu-auth__before {
	margin-bottom: 1.25rem;
}

.felu-auth__after:empty,
.felu-auth__before:empty {
	display: none;
}

/* Sözleşme metni (asf .asf-register-text) 13px'te kalsın. asf zaten inline 13px basar;
   deploy/tema/inherit büyütmesin diye burada da garanti altına alıyoruz (link'ler dahil). */
.felu-auth__after .asf-register-text,
.felu-auth__after .asf-register-text a {
	font-size: 13px !important;
}

/* Modal açıkken arka plan kaymasın. */
body.felu-modal-open {
	overflow: hidden;
}

/* Hareket hassasiyeti olan kullanıcıda animasyon yok. */
@media ( prefers-reduced-motion: reduce ) {
	.felu-auth__go-spinner { animation: none; }
	.felu-auth__go,
	.felu-auth__field,
	.felu-code__boxes span { transition: none; }
	.felu-auth__go:hover:not([disabled]) { transform: none; }
}

/* Küçük ekran: kutular taşmasın. */
@media ( max-width: 400px ) {
	.felu-code { font-size: 1.25em !important; }
	.felu-modal__card { padding: 1.75rem 1.25rem 1.25rem; }
}

/* =========================================================================
   E-posta değiştirme (My Account) — .felu-auth sarmalayıcısı içinde çalışır;
   .felu-code kutu stili + --felu-auth-brand/--felu-auth-border değişkenleri oradan gelir.
   ========================================================================= */

/* KRİTİK: aşağıdaki display:grid kuralları hidden özniteliğini EZMESİN. Aksi halde
   panel ve 3 adım (email/code/done) aynı anda açık görünür. hidden daima kazanır →
   panel kapalı başlar, adımlar tek tek açılır (JS yönetir). */
.felu-ce [hidden] { display: none !important; }

/* Wrapper artık YALNIZ (position:fixed) modalı taşır → in-flow'da yer kaplamamalı.
   Sadece modal içeriğini ortalamak için --felu-auth-align kalır. */
.felu-ce {
	--felu-auth-align: center;
}

/* Tetikleyici: e-posta satırında etiketin YANINDA, sağa dayalı küçük link.
   .felu-auth DIŞINDA olduğu için kendi başına stillenir. */
.felu-ce-emailhead {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
}

.felu-ce__toggle {
	flex: none;
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	font-size: .9em !important;
	line-height: 1.2;
	color: var( --bde-brand-primary-color, #2271b1 ) !important;
	text-decoration: underline;
	cursor: pointer;
	white-space: nowrap;
}

.felu-ce__toggle:hover {
	text-decoration: none;
}

/* NOT: Buradaki '.felu-ce .felu-modal__card { text-align: center }' kaldırıldı —
   ortalama artık .felu-modal__card'ın kendi varsayılanı (tek kaynak). */

.felu-ce__stage {
	display: grid;
	gap: .85rem;
	justify-items: center;
	width: 100%;
}

.felu-ce__label {
	font-weight: 400;
}

.felu-ce__prompt {
	margin: 0;
	color: #444 !important;
	line-height: 1.5;
}

.felu-ce__done {
	margin: 0;
	font-weight: 600;
	color: #1d6d33 !important;
}

.felu-ce .felu-auth__field {
	width: 100%;
	max-width: 320px;
}

/* NOT: '.felu-ce .felu-auth__button' pill tanımı KALDIRILDI — pill artık global
   .felu-auth__button'ın kendisi (tek kaynak). Buraya geri eklenirse üç akış arasında
   sessizce ayrışma (drift) başlar. */

.felu-ce__notice {
	margin: 0;
	color: #1d6d33 !important;
}

/* Resend link — My Account temasının <button> stilini (arka plan/çerçeve) EZ, auth'taki
   temiz link görünümüne getir. Özgüllük .felu-ce X (0,2,0) > tema .woocommerce button (0,1,1). */
.felu-ce .felu-ce__resend {
	display: inline-block !important;
	width: auto !important;
	min-width: 0 !important;
	min-height: 0 !important;
	height: auto !important;
	margin: 1rem 0 0 !important;
	padding: 0 !important;
	background: none !important;
	background-color: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: var( --felu-auth-brand ) !important;
	font: inherit !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	text-decoration: none !important;
	cursor: pointer !important;
}

.felu-ce .felu-ce__resend:hover {
	background: none !important;
	color: var( --felu-auth-brand ) !important;
	text-decoration: underline !important;
}

.felu-ce .felu-ce__resend[disabled] {
	opacity: .55 !important;
	color: #888 !important;
	background: none !important;
	text-decoration: none !important;
	cursor: default !important;
}

/* =========================================================================
   TY (order-received) üyelik CTA + popup. Yine .felu-auth sarmalayıcısı içinde
   (.felu-code + --felu-auth-brand/--felu-auth-border oradan). Wrapper 420px kısıtını kaldırır;
   CTA kullanıcının TY düzeninde akar, fixed modal ekranda ortalanır.
   ========================================================================= */
.felu-ty {
	max-width: none;
	margin: 0;
	--felu-auth-align: center; /* modal içeriği ortalı */
}

/* hidden özniteliği display:grid ile ezilmesin (adımlar üst üste gelmesin). */
.felu-ty [hidden] { display: none !important; }

.felu-ty__cta {
	display: inline-block;
	padding: .85rem 1.8rem;
	background: var( --felu-auth-brand );
	color: #fff !important;
	border: 0;
	border-radius: 999px;
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
}

.felu-ty__cta:hover { filter: brightness( .95 ); }

/* NOT: '.felu-ty .felu-modal__card { text-align: center }' kaldırıldı — ortalama artık
   .felu-modal__card varsayılanı (tek kaynak). */

.felu-ty__stage {
	display: grid;
	gap: .85rem;
	justify-items: center;
	width: 100%;
}

.felu-ty__label { font-weight: 600; }
.felu-ty__prompt { margin: 0; color: #444 !important; line-height: 1.5; }

.felu-ty .felu-auth__field { width: 100%; max-width: 320px; }

/* Sözleşme metni (Register Form Text) sarmalayıcısı — ÇİFT BOŞLUK düzeltmesi.
   Global .felu-auth__after 'margin-top: 1.25rem' taşır; o kural ana [felu_auth] formu
   için doğru (orada div grid içinde DEĞİL, kendi boşluğunu kendi vermeli). Ama burada
   aynı sınıf .felu-ty__stage grid'inin İÇİNDE → gap (.85rem) + margin (1.25rem) toplanıp
   2.1rem yapıyordu. Margin'i sıfırlayıp aralığı tamamen grid'e bırakıyoruz → My Account
   popup'ıyla (.felu-ce__stage) aynı .85rem ritmi. Özgüllük 0,2,0 > global 0,1,0. */
.felu-ty .felu-ty__legal {
	margin-top: 0;
}

/* NOT: .felu-ty__start bu pill kuralına ARTIK DAHİL DEĞİL — o buton alanın içindeki
   ok ikonuna dönüştü ve .felu-auth__go ile stillenir. Buraya geri eklenirse (ikisi de
   0,1,0 ama .felu-ty__start dosyada SONRA geldiği için) pill kazanır ve oku bozar. */
/* NOT: '.felu-ty__verify' pill tanımı KALDIRILDI — buton artık global .felu-auth__button
   sınıfını da taşıyor (tek kaynak). '.felu-ty__verify' yalnız JS kancası olarak duruyor. */

/* .felu-ty__start burada da YOK: ok butonunun disabled hali .felu-auth__go[disabled]
   ile gelir. Eklenirse (aynı 0,2,0 ama dosyada sonra) onu ezerdi. */
/* NOT: '.felu-ty__verify[disabled]' de KALDIRILDI — global .felu-auth__button[disabled]
   aynısını yapıyor. */

.felu-ty__notice { margin: 0; color: #1d6d33 !important; }

/* Resend link (auth'takiyle aynı; olası tema <button> stiline karşı yüksek özgüllük). */
.felu-ty .felu-ty__resend {
	display: inline-block !important;
	width: auto !important;
	min-width: 0 !important;
	min-height: 0 !important;
	height: auto !important;
	margin: 1rem 0 0 !important;
	padding: 0 !important;
	background: none !important;
	background-color: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: var( --felu-auth-brand ) !important;
	font: inherit !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	text-decoration: none !important;
	cursor: pointer !important;
}

.felu-ty .felu-ty__resend:hover {
	background: none !important;
	color: var( --felu-auth-brand ) !important;
	text-decoration: underline !important;
}

.felu-ty .felu-ty__resend[disabled] {
	opacity: .55 !important;
	color: #888 !important;
	background: none !important;
	text-decoration: none !important;
	cursor: default !important;
}