/**
 * ═══════════════════════════════════════════════════════════
 * AUTH LEFT PANEL TEMPLATES v5.0 — 6 Temiz Şablon
 * ═══════════════════════════════════════════════════════════
 * Sadece SOL PANEL değişir, sağ (form) panel aynı kalır.
 * Admin'den data-left-template="X" ile seçilir.
 *
 * Şablonlar:
 *  1. modern-purple   — Mor/pembe animasyonlu gradyan
 *  2. clean-white     — Beyaz minimal, site rengi vurgular
 *  3. dark-stars      — Derin lacivert + ışıldayan yıldızlar
 *  4. photo-hero      — Arkaplan fotoğrafı + glass overlay
 *  5. geo-shapes      — Turkuaz + geometrik şekiller
 *  6. mesh-holo       — Modern mesh / holografik gradyan
 */

/* v5.2: ESKİ AUTH TEMPLATE (auth-tpl-X) KURALLARINI EZ — yeni data-left-template varsa */
/* Eski auth.css'te tanımlı .auth-tpl-split-modern, .auth-tpl-dark-luxe vs. kurallarının
   background, color, layout override'larını sıfırla */
.auth-split:has(.auth-left[data-left-template]) .auth-left,
.auth-split[class*="auth-tpl-"] .auth-left[data-left-template] {
  /* Reset all possible old rules */
  background: none;
  color: inherit;
}
/* Eski auth.css'in .auth-tpl-split-modern .auth-left-content{max-width:640px;padding:72px 64px} gibi kısıtlarını sıfırla */
.auth-left[data-left-template] .auth-left-content {
  max-width: 480px !important;
  padding: 0 !important;
  width: 100%;
}

/* Kök değişkenler — her şablon kendi renklerini ayarlar */
.auth-left[data-left-template] {
  position: relative;
  overflow: hidden;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center;
  align-items: center;
  padding: 60px 48px !important;
  min-height: 100vh;
  isolation: isolate;
}
.auth-left[data-left-template] > * { position: relative; z-index: 2; }
.auth-left[data-left-template] .auth-left-content {
  max-width: 480px;
  width: 100%;
  animation: authLeftFadeIn .8s cubic-bezier(.22,1,.36,1);
}
@keyframes authLeftFadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: none; }
}

/* Ortak marka stili — hizalama data-brand-align ile kontrol edilir */
.auth-left[data-left-template] .auth-brand {
  text-align: center;
  margin-bottom: 36px;
  width: 100%;
}
/* v5.4: Brand alignment — logo + başlık + alt başlık TÜM ŞABLONLARDA aynı hizada */
.auth-left[data-brand-align="left"] .auth-brand,
.auth-left[data-brand-align="left"] .auth-brand * {
  text-align: left !important;
}
.auth-left[data-brand-align="left"] .auth-brand-icon {
  margin-left: 0 !important;
  margin-right: auto !important;
}
.auth-left[data-brand-align="center"] .auth-brand,
.auth-left[data-brand-align="center"] .auth-brand * {
  text-align: center !important;
}
.auth-left[data-brand-align="center"] .auth-brand-icon {
  margin-left: auto !important;
  margin-right: auto !important;
}
.auth-left[data-brand-align="right"] .auth-brand,
.auth-left[data-brand-align="right"] .auth-brand * {
  text-align: right !important;
}
.auth-left[data-brand-align="right"] .auth-brand-icon {
  margin-left: auto !important;
  margin-right: 0 !important;
}
/* Subtitle (alt başlık) her zaman görünür olsun — bazı şablonlar kazayla gizleyebilir */
.auth-left[data-left-template] .auth-brand p {
  display: block !important;
  visibility: visible !important;
  opacity: .9;
}
.auth-left[data-left-template] .auth-brand-icon {
  display: inline-flex;
  width: 68px; height: 68px;
  margin-bottom: 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.15);
  backdrop-filter: blur(8px);
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 32px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.25);
}
.auth-left[data-left-template] .auth-brand-icon img {
  width: 48px; height: 48px;
  object-fit: contain;
  border-radius: 10px;
}
.auth-left[data-left-template] .auth-brand h1 {
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 900;
  letter-spacing: -1px;
  margin: 0 0 10px;
  line-height: 1.1;
}
.auth-left[data-left-template] .auth-brand p {
  font-size: 15px;
  line-height: 1.6;
  margin: 0;
  opacity: .9;
}

/* Feature kartları — her şablon kendi renklerini uygular */
.auth-left[data-left-template] .auth-features {
  display: flex;
  flex-direction: column;
  gap: var(--feat-gap, 14px);
  margin-top: 32px;
}

/* v5.2: Feature GRID layout seçeneği (2×2, 3 sütun vs.) */
.auth-left[data-left-template][data-feature-layout="grid-2"] .auth-features { display: grid; grid-template-columns: 1fr 1fr; }
.auth-left[data-left-template][data-feature-layout="grid-3"] .auth-features { display: grid; grid-template-columns: 1fr 1fr 1fr; }
.auth-left[data-left-template][data-feature-layout="horizontal"] .auth-features {
  display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;
}
.auth-left[data-left-template][data-feature-layout="horizontal"] .auth-feature {
  flex: 1 1 200px; min-width: 160px;
}

.auth-left[data-left-template] .auth-feature {
  display: flex;
  align-items: flex-start;
  gap: var(--feat-gap-icon, 14px);
  padding: var(--feat-pad, 16px 18px);
  border-radius: var(--feat-radius, 14px);
  transition: transform .25s cubic-bezier(.22,1,.36,1), background .25s, box-shadow .25s;
  position: relative;
}
.auth-left[data-left-template] .auth-feature:hover {
  transform: translateX(4px);
}

/* v5.2 FEATURE BOYUT PRESETLERİ */
.auth-left[data-left-template][data-feature-size="sm"] { --feat-pad: 10px 12px; --feat-radius: 10px; --feat-gap: 8px; }
.auth-left[data-left-template][data-feature-size="sm"] .auth-feature-icon { width: 34px; height: 34px; font-size: 14px; }
.auth-left[data-left-template][data-feature-size="sm"] .auth-feature h4 { font-size: 13px; }
.auth-left[data-left-template][data-feature-size="sm"] .auth-feature p { font-size: 11.5px; }

.auth-left[data-left-template][data-feature-size="md"] { --feat-pad: 16px 18px; --feat-radius: 14px; --feat-gap: 14px; }
/* Default is md (no override) */

.auth-left[data-left-template][data-feature-size="lg"] { --feat-pad: 22px 24px; --feat-radius: 18px; --feat-gap: 18px; }
.auth-left[data-left-template][data-feature-size="lg"] .auth-feature-icon { width: 56px; height: 56px; font-size: 22px; }
.auth-left[data-left-template][data-feature-size="lg"] .auth-feature h4 { font-size: 16px; }
.auth-left[data-left-template][data-feature-size="lg"] .auth-feature p { font-size: 13.5px; }

.auth-left[data-left-template][data-feature-size="xl"] { --feat-pad: 28px 30px; --feat-radius: 22px; --feat-gap: 22px; }
.auth-left[data-left-template][data-feature-size="xl"] .auth-feature-icon { width: 64px; height: 64px; font-size: 26px; border-radius: 16px; }
.auth-left[data-left-template][data-feature-size="xl"] .auth-feature h4 { font-size: 18px; margin-bottom: 6px; }
.auth-left[data-left-template][data-feature-size="xl"] .auth-feature p { font-size: 14.5px; }

.auth-left[data-left-template] .auth-feature-icon {
  flex-shrink: 0;
  width: 44px; height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  position: relative;
}

/* v5.2 DÖNEN BORDER EFEKTİ — feature icon etrafında conic gradient dönen çember */
.auth-left[data-left-template][data-feature-rotating-border="1"] .auth-feature-icon {
  background: transparent !important;
  padding: 3px;
}
.auth-left[data-left-template][data-feature-rotating-border="1"] .auth-feature-icon::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: conic-gradient(from 0deg, var(--icon-color, #6c63ff), var(--s, #ff6584), var(--icon-color, #6c63ff));
  z-index: 0;
  animation: spFeatRotate 4s linear infinite;
}
.auth-left[data-left-template][data-feature-rotating-border="1"] .auth-feature-icon::after {
  content: '';
  position: absolute;
  inset: 3px;
  border-radius: inherit;
  background: rgba(255,255,255,.15);
  z-index: 1;
}
.auth-left[data-left-template][data-feature-rotating-border="1"] .auth-feature-icon > * {
  position: relative;
  z-index: 2;
}
@keyframes spFeatRotate { to { transform: rotate(360deg); } }

/* v5.2 İKON ANİMASYONU */
.auth-left[data-left-template][data-feature-icon-anim="pulse"] .auth-feature-icon { animation: spFeatPulse 2.5s ease infinite; }
.auth-left[data-left-template][data-feature-icon-anim="bounce"] .auth-feature-icon { animation: spFeatBounce 2s ease infinite; }
.auth-left[data-left-template][data-feature-icon-anim="rotate"] .auth-feature-icon { animation: spFeatRotateSlow 6s linear infinite; }
.auth-left[data-left-template][data-feature-icon-anim="shake"] .auth-feature-icon:hover { animation: spFeatShake .5s ease; }
.auth-left[data-left-template][data-feature-icon-anim="float"] .auth-feature-icon { animation: spFeatFloat 3s ease-in-out infinite; }
@keyframes spFeatPulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.1)} }
@keyframes spFeatBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-4px)} }
@keyframes spFeatRotateSlow { to { transform: rotate(360deg); } }
@keyframes spFeatShake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-3px)} 75%{transform:translateX(3px)} }
@keyframes spFeatFloat { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-3px) rotate(3deg)} }

/* v5.2 FEATURE STIL VARYASYONLARI */
/* Glass (default — şablon bazlı zaten uygulanıyor) */

/* Solid — düz renkli arkaplan */
.auth-left[data-left-template][data-feature-style="solid"] .auth-feature {
  background: rgba(0,0,0,.15) !important;
  backdrop-filter: none !important;
  border: none !important;
}

/* Outline — sadece border, şeffaf */
.auth-left[data-left-template][data-feature-style="outline"] .auth-feature {
  background: transparent !important;
  backdrop-filter: none !important;
  border: 2px solid rgba(255,255,255,.3) !important;
}

/* Minimal — border ve background yok, sadece metin */
.auth-left[data-left-template][data-feature-style="minimal"] .auth-feature {
  background: transparent !important;
  border: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  backdrop-filter: none !important;
}

/* Neon — Parıltılı border */
.auth-left[data-left-template][data-feature-style="neon"] .auth-feature {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.4) !important;
  box-shadow: 0 0 16px rgba(255,255,255,.15), inset 0 0 10px rgba(255,255,255,.05) !important;
}
.auth-left[data-left-template][data-feature-style="neon"] .auth-feature:hover {
  box-shadow: 0 0 24px rgba(255,255,255,.3), inset 0 0 14px rgba(255,255,255,.1) !important;
}

/* Gradient — Gradient border */
.auth-left[data-left-template][data-feature-style="gradient-border"] .auth-feature {
  background: var(--bg, rgba(0,0,0,.15)) !important;
  border: 2px solid transparent !important;
  background-image:
    linear-gradient(var(--bg, rgba(0,0,0,.4)), var(--bg, rgba(0,0,0,.4))),
    linear-gradient(135deg, var(--p, #6c63ff), var(--s, #ff6584)) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
}

/* Elevated — Kalkık kart gölgeli */
.auth-left[data-left-template][data-feature-style="elevated"] .auth-feature {
  background: rgba(255,255,255,.95) !important;
  color: #1e1e3a !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.2), 0 2px 8px rgba(0,0,0,.1) !important;
  border: none !important;
}
.auth-left[data-left-template][data-feature-style="elevated"] .auth-feature h4 { color: #1e1e3a !important; }
.auth-left[data-left-template][data-feature-style="elevated"] .auth-feature p { color: #64748b !important; }
.auth-left[data-left-template] .auth-feature h4 {
  font-size: 14.5px;
  font-weight: 800;
  margin: 0 0 4px;
  letter-spacing: -.2px;
}
.auth-left[data-left-template] .auth-feature p {
  font-size: 12.5px;
  line-height: 1.55;
  margin: 0;
  opacity: .8;
}

/* Üst "Ana Sayfa" linki */
.auth-left[data-left-template] .auth-back {
  position: absolute;
  top: 28px; left: 28px;
  padding: 8px 14px;
  border-radius: 10px;
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(8px);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: .2s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  z-index: 10;
}
.auth-left[data-left-template] .auth-back:hover {
  background: rgba(255,255,255,.25);
  transform: translateX(-2px);
}

/* Alt footer (opsiyonel link grubu) */
.auth-left[data-left-template] .auth-left-footer {
  position: absolute;
  bottom: 24px;
  left: 0; right: 0;
  text-align: center;
  font-size: 12px;
  opacity: .7;
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 1: MODERN PURPLE (Mor/pembe gradyan)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="modern-purple"] {
  background: linear-gradient(135deg, #6c63ff 0%, #8b5cf6 35%, #ec4899 70%, #f59e0b 100%);
  background-size: 300% 300%;
  animation: authGrad 14s ease infinite;
  color: #fff;
}
@keyframes authGrad { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }
.auth-left[data-left-template="modern-purple"]::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 20% 30%, rgba(255,255,255,.2) 0, transparent 40%),
                    radial-gradient(circle at 80% 70%, rgba(255,255,255,.15) 0, transparent 40%);
  pointer-events: none;
}
.auth-left[data-left-template="modern-purple"]::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,.12) 1px, transparent 0);
  background-size: 28px 28px;
  opacity: .5;
  pointer-events: none;
}
.auth-left[data-left-template="modern-purple"] .auth-feature {
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.18);
}
.auth-left[data-left-template="modern-purple"] .auth-feature-icon {
  background: rgba(255,255,255,.2);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
}
.auth-left[data-left-template="modern-purple"] .auth-feature:hover {
  background: rgba(255,255,255,.18);
}
.auth-left[data-left-template="modern-purple"] .auth-back { color: #fff; }

/* ═══════════════════════════════════════════════════════════
   ŞABLON 2: CLEAN WHITE (Beyaz minimal)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="clean-white"] {
  background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%);
  color: #1e1e3a;
}
.auth-left[data-left-template="clean-white"]::before {
  content: '';
  position: absolute;
  top: -10%; right: -20%;
  width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(108,99,255,.12) 0%, transparent 70%);
  filter: blur(40px);
  pointer-events: none;
}
.auth-left[data-left-template="clean-white"]::after {
  content: '';
  position: absolute;
  bottom: -20%; left: -10%;
  width: 500px; height: 500px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(236,72,153,.1) 0%, transparent 70%);
  filter: blur(40px);
  pointer-events: none;
}
.auth-left[data-left-template="clean-white"] .auth-brand-icon {
  background: linear-gradient(135deg, var(--p, #6c63ff), var(--s, #ec4899));
  box-shadow: 0 12px 28px rgba(108,99,255,.25);
}
.auth-left[data-left-template="clean-white"] .auth-brand h1 {
  background: linear-gradient(90deg, var(--p, #6c63ff), var(--s, #ec4899));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.auth-left[data-left-template="clean-white"] .auth-brand p {
  color: #64748b;
}
.auth-left[data-left-template="clean-white"] .auth-feature {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 4px 12px rgba(0,0,0,.04);
}
.auth-left[data-left-template="clean-white"] .auth-feature:hover {
  border-color: var(--p, #6c63ff);
  box-shadow: 0 10px 24px rgba(108,99,255,.12);
}
.auth-left[data-left-template="clean-white"] .auth-feature-icon {
  background: rgba(108,99,255,.08);
  color: var(--p, #6c63ff);
}
.auth-left[data-left-template="clean-white"] .auth-feature h4 { color: #1e1e3a; }
.auth-left[data-left-template="clean-white"] .auth-feature p { color: #64748b; }
.auth-left[data-left-template="clean-white"] .auth-back {
  background: rgba(108,99,255,.08);
  color: var(--p, #6c63ff);
  backdrop-filter: none;
}
.auth-left[data-left-template="clean-white"] .auth-back:hover {
  background: var(--p, #6c63ff);
  color: #fff;
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 3: DARK STARS (Derin lacivert + yıldızlar)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="dark-stars"] {
  background: radial-gradient(ellipse at top, #1e1b4b 0%, #0f0c29 50%, #000000 100%);
  color: #f1f5f9;
}
.auth-left[data-left-template="dark-stars"]::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(2px 2px at 25% 15%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 60% 25%, #fff, transparent),
    radial-gradient(2px 2px at 85% 45%, #fff, transparent),
    radial-gradient(1px 1px at 15% 60%, #fff, transparent),
    radial-gradient(2px 2px at 75% 75%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 40% 85%, #fff, transparent),
    radial-gradient(1px 1px at 90% 20%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 10% 40%, #fff, transparent),
    radial-gradient(2px 2px at 50% 50%, #a5b4fc, transparent);
  background-size: 100% 100%;
  animation: authStarTwinkle 4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes authStarTwinkle { 0%,100%{opacity:.85} 50%{opacity:1} }
.auth-left[data-left-template="dark-stars"]::after {
  content: '';
  position: absolute;
  top: 20%; left: 50%;
  transform: translateX(-50%);
  width: 600px; height: 200px;
  background: radial-gradient(ellipse, rgba(168,85,247,.25) 0%, transparent 70%);
  filter: blur(30px);
  pointer-events: none;
}
.auth-left[data-left-template="dark-stars"] .auth-brand-icon {
  background: linear-gradient(135deg, #a855f7, #6366f1);
  box-shadow: 0 0 40px rgba(168,85,247,.5), inset 0 1px 0 rgba(255,255,255,.3);
}
.auth-left[data-left-template="dark-stars"] .auth-feature {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(168,85,247,.15);
  backdrop-filter: blur(8px);
}
.auth-left[data-left-template="dark-stars"] .auth-feature:hover {
  background: rgba(168,85,247,.1);
  border-color: rgba(168,85,247,.4);
}
.auth-left[data-left-template="dark-stars"] .auth-feature-icon {
  background: linear-gradient(135deg, rgba(168,85,247,.2), rgba(99,102,241,.2));
  color: #c4b5fd;
}
.auth-left[data-left-template="dark-stars"] .auth-back {
  background: rgba(255,255,255,.06);
  color: #f1f5f9;
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 4: PHOTO HERO (Arkaplan foto + glass overlay)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="photo-hero"] {
  background-color: #0f172a;
  background-image: var(--auth-hero-image, url('https://images.unsplash.com/photo-1518020382113-a7e8fc38eac9?auto=format&fit=crop&w=1600&q=75'));
  background-size: cover;
  background-position: center;
  color: #fff;
}
.auth-left[data-left-template="photo-hero"]::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15,23,42,.45) 0%, rgba(15,23,42,.75) 70%, rgba(15,23,42,.9) 100%);
  pointer-events: none;
}
.auth-left[data-left-template="photo-hero"] .auth-brand-icon {
  background: rgba(255,255,255,.15);
  backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255,255,255,.25);
}
.auth-left[data-left-template="photo-hero"] .auth-feature {
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(16px) saturate(180%);
  border: 1px solid rgba(255,255,255,.18);
}
.auth-left[data-left-template="photo-hero"] .auth-feature-icon {
  background: rgba(255,255,255,.22);
  color: #fff;
}
.auth-left[data-left-template="photo-hero"] .auth-back {
  background: rgba(255,255,255,.15);
  backdrop-filter: blur(10px);
  color: #fff;
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 5: GEO SHAPES (Turkuaz + geometrik)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="geo-shapes"] {
  background: linear-gradient(135deg, #0891b2 0%, #0ea5e9 50%, #06b6d4 100%);
  color: #fff;
}
.auth-left[data-left-template="geo-shapes"]::before {
  content: '';
  position: absolute;
  top: -10%; right: -10%;
  width: 400px; height: 400px;
  background: linear-gradient(45deg, #fbbf24, #f59e0b);
  border-radius: 50%;
  opacity: .2;
  filter: blur(20px);
  animation: authGeoFloat1 8s ease-in-out infinite;
}
.auth-left[data-left-template="geo-shapes"]::after {
  content: '';
  position: absolute;
  bottom: -15%; left: -15%;
  width: 500px; height: 500px;
  background: linear-gradient(135deg, #22c55e, #10b981);
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  opacity: .18;
  filter: blur(15px);
  animation: authGeoFloat2 10s ease-in-out infinite;
}
@keyframes authGeoFloat1 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-30px,20px)} }
@keyframes authGeoFloat2 { 0%,100%{transform:translate(0,0) rotate(0)} 50%{transform:translate(20px,-30px) rotate(45deg)} }
.auth-left[data-left-template="geo-shapes"] .auth-brand-icon {
  background: rgba(255,255,255,.2);
  border: 1px solid rgba(255,255,255,.3);
}
.auth-left[data-left-template="geo-shapes"] .auth-feature {
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.2);
}
.auth-left[data-left-template="geo-shapes"] .auth-feature-icon {
  background: linear-gradient(135deg, #fbbf24, #f59e0b);
  color: #fff;
}
.auth-left[data-left-template="geo-shapes"] .auth-back {
  background: rgba(255,255,255,.15);
  color: #fff;
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 6: MESH HOLO (Modern mesh/holografik)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="mesh-holo"] {
  background: #1a1a2e;
  color: #fff;
}
.auth-left[data-left-template="mesh-holo"]::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(at 20% 30%, #ff6b6b 0px, transparent 50%),
    radial-gradient(at 70% 20%, #4ecdc4 0px, transparent 50%),
    radial-gradient(at 50% 70%, #ffe66d 0px, transparent 50%),
    radial-gradient(at 80% 80%, #a855f7 0px, transparent 50%),
    radial-gradient(at 20% 80%, #3b82f6 0px, transparent 50%);
  filter: blur(80px) saturate(1.5);
  opacity: .6;
  animation: authMeshShift 15s ease infinite;
  pointer-events: none;
}
@keyframes authMeshShift {
  0%,100% { transform: scale(1) rotate(0deg); }
  33% { transform: scale(1.1) rotate(2deg); }
  66% { transform: scale(.95) rotate(-2deg); }
}
.auth-left[data-left-template="mesh-holo"]::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(26,26,46,.3) 0%, rgba(26,26,46,.7) 100%);
  pointer-events: none;
}
.auth-left[data-left-template="mesh-holo"] .auth-brand-icon {
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.2);
}
.auth-left[data-left-template="mesh-holo"] .auth-brand h1 {
  background: linear-gradient(90deg, #ff6b6b, #ffe66d, #4ecdc4, #a855f7, #3b82f6, #ff6b6b);
  background-size: 300% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: authHoloText 6s linear infinite;
}
@keyframes authHoloText { to { background-position: 300% 0; } }
.auth-left[data-left-template="mesh-holo"] .auth-feature {
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(16px) saturate(180%);
  border: 1px solid rgba(255,255,255,.1);
}
.auth-left[data-left-template="mesh-holo"] .auth-feature:hover {
  border-color: rgba(255,255,255,.3);
  background: rgba(255,255,255,.1);
}
.auth-left[data-left-template="mesh-holo"] .auth-feature-icon {
  background: linear-gradient(135deg, rgba(255,107,107,.25), rgba(168,85,247,.25));
  backdrop-filter: blur(10px);
  color: #fff;
}
.auth-left[data-left-template="mesh-holo"] .auth-back {
  background: rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
  color: #fff;
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 7: GRADIENT WAVES (Animasyonlu dalga gradyan)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="gradient-waves"] {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
  background-size: 400% 400%;
  animation: authGrad 18s ease infinite;
  color: #fff;
}
.auth-left[data-left-template="gradient-waves"]::before {
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 80% 50% at 50% 120%, rgba(255,255,255,.25), transparent),
    radial-gradient(ellipse 80% 50% at 50% -20%, rgba(255,255,255,.15), transparent);
}
.auth-left[data-left-template="gradient-waves"]::after {
  content:'';position:absolute;inset:0;
  background: repeating-linear-gradient(45deg, transparent, transparent 60px, rgba(255,255,255,.04) 60px, rgba(255,255,255,.04) 120px);
  pointer-events:none;
}
.auth-left[data-left-template="gradient-waves"] .auth-brand-icon { background:rgba(255,255,255,.2); backdrop-filter:blur(10px); }
.auth-left[data-left-template="gradient-waves"] .auth-feature {
  background:rgba(255,255,255,.1); backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.18);
}
.auth-left[data-left-template="gradient-waves"] .auth-feature-icon { background:rgba(255,255,255,.2); color:#fff; }
.auth-left[data-left-template="gradient-waves"] .auth-back { background:rgba(255,255,255,.15); color:#fff; }

/* ═══════════════════════════════════════════════════════════
   ŞABLON 8: NEON CYBER (Siber neon yeşil/mor)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="neon-cyber"] {
  background: linear-gradient(135deg, #0a0a1e 0%, #1a0a2e 100%);
  color: #e2e8f0;
}
.auth-left[data-left-template="neon-cyber"]::before {
  content:'';position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(0,255,200,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,255,200,.08) 1px, transparent 1px);
  background-size: 40px 40px;
  animation: authGridMove 20s linear infinite;
}
@keyframes authGridMove { to { background-position: 40px 40px; } }
.auth-left[data-left-template="neon-cyber"]::after {
  content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle, rgba(168,85,247,.25) 0%, transparent 60%);
  filter:blur(40px);
}
.auth-left[data-left-template="neon-cyber"] .auth-brand h1 {
  color:#00ffd1;
  text-shadow: 0 0 20px rgba(0,255,200,.6), 0 0 40px rgba(168,85,247,.4);
  font-family:'Courier New', monospace;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.auth-left[data-left-template="neon-cyber"] .auth-brand-icon {
  background: linear-gradient(135deg, #00ffd1, #a855f7);
  box-shadow: 0 0 32px rgba(0,255,200,.5);
}
.auth-left[data-left-template="neon-cyber"] .auth-feature {
  background:rgba(0,255,200,.04); border:1px solid rgba(0,255,200,.25);
  backdrop-filter: blur(6px);
}
.auth-left[data-left-template="neon-cyber"] .auth-feature:hover {
  border-color:#00ffd1;
  box-shadow: 0 0 20px rgba(0,255,200,.3);
}
.auth-left[data-left-template="neon-cyber"] .auth-feature-icon {
  background:linear-gradient(135deg,rgba(0,255,200,.2),rgba(168,85,247,.2));
  color:#00ffd1;
  border:1px solid rgba(0,255,200,.3);
}
.auth-left[data-left-template="neon-cyber"] .auth-back {
  background:rgba(0,255,200,.1); color:#00ffd1; border:1px solid rgba(0,255,200,.3);
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 9: PASTEL DREAM (Yumuşak pembe/mor/mavi pastel)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="pastel-dream"] {
  background: linear-gradient(135deg, #fbc2eb 0%, #a6c1ee 50%, #c2e9fb 100%);
  color: #4a5568;
}
.auth-left[data-left-template="pastel-dream"]::before {
  content:'';position:absolute;top:10%;right:-10%;width:400px;height:400px;
  background:radial-gradient(circle, rgba(251,194,235,.6), transparent 70%);
  filter:blur(50px);animation:authGeoFloat1 10s ease-in-out infinite;
}
.auth-left[data-left-template="pastel-dream"]::after {
  content:'';position:absolute;bottom:-10%;left:-10%;width:500px;height:500px;
  background:radial-gradient(circle, rgba(166,193,238,.6), transparent 70%);
  filter:blur(50px);animation:authGeoFloat2 12s ease-in-out infinite;
}
.auth-left[data-left-template="pastel-dream"] .auth-brand-icon {
  background:linear-gradient(135deg,#ec4899,#a855f7);
  box-shadow:0 12px 28px rgba(236,72,153,.3);
}
.auth-left[data-left-template="pastel-dream"] .auth-brand h1 {
  background:linear-gradient(90deg,#ec4899,#8b5cf6,#3b82f6);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.auth-left[data-left-template="pastel-dream"] .auth-feature {
  background:rgba(255,255,255,.55);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.5);
  box-shadow:0 8px 20px rgba(0,0,0,.05);
}
.auth-left[data-left-template="pastel-dream"] .auth-feature-icon {
  background:linear-gradient(135deg,#fbc2eb,#a6c1ee);color:#fff;
}
.auth-left[data-left-template="pastel-dream"] .auth-feature h4 { color:#4a5568; }
.auth-left[data-left-template="pastel-dream"] .auth-feature p { color:#718096; }
.auth-left[data-left-template="pastel-dream"] .auth-back {
  background:rgba(255,255,255,.6);color:#4a5568;
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 10: FOREST GREEN (Derin yeşil doğa teması)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="forest-green"] {
  background: linear-gradient(160deg, #134e4a 0%, #065f46 40%, #064e3b 100%);
  color: #d1fae5;
}
.auth-left[data-left-template="forest-green"]::before {
  content:'';position:absolute;inset:0;
  background-image:
    radial-gradient(circle 2px at 20% 30%, rgba(134,239,172,.5), transparent),
    radial-gradient(circle 1.5px at 60% 50%, rgba(167,243,208,.4), transparent),
    radial-gradient(circle 2.5px at 85% 70%, rgba(134,239,172,.6), transparent),
    radial-gradient(circle 1px at 30% 85%, rgba(167,243,208,.4), transparent);
  opacity:.7;
}
.auth-left[data-left-template="forest-green"]::after {
  content:'';position:absolute;bottom:-20%;left:-20%;width:600px;height:600px;
  background:radial-gradient(circle, rgba(16,185,129,.3), transparent 60%);
  filter:blur(60px);
}
.auth-left[data-left-template="forest-green"] .auth-brand-icon {
  background:linear-gradient(135deg,#10b981,#059669);
  box-shadow:0 12px 32px rgba(16,185,129,.35);
}
.auth-left[data-left-template="forest-green"] .auth-brand h1 {
  background:linear-gradient(90deg,#6ee7b7,#fff,#86efac);
  background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  animation:authBrandShift 4s ease infinite;
}
.auth-left[data-left-template="forest-green"] .auth-feature {
  background:rgba(16,185,129,.08);backdrop-filter:blur(10px);
  border:1px solid rgba(52,211,153,.2);
}
.auth-left[data-left-template="forest-green"] .auth-feature:hover { border-color:rgba(52,211,153,.5); background:rgba(16,185,129,.14); }
.auth-left[data-left-template="forest-green"] .auth-feature-icon {
  background:linear-gradient(135deg,#10b981,#059669);color:#fff;
}
.auth-left[data-left-template="forest-green"] .auth-back {
  background:rgba(16,185,129,.12);color:#d1fae5;border:1px solid rgba(52,211,153,.2);
}
@keyframes authBrandShift { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }

/* ═══════════════════════════════════════════════════════════
   ŞABLON 11: SUNSET ORANGE (Gün batımı turuncu/pembe)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="sunset-orange"] {
  background: linear-gradient(180deg, #ff9a9e 0%, #fad0c4 35%, #ffd1ff 70%, #fb923c 100%);
  color: #7c2d12;
}
.auth-left[data-left-template="sunset-orange"]::before {
  content:'';position:absolute;top:15%;left:50%;transform:translateX(-50%);
  width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle, rgba(255,200,100,.8), rgba(255,150,80,.4) 40%, transparent 70%);
  filter:blur(20px);animation:authGeoFloat1 6s ease-in-out infinite;
}
.auth-left[data-left-template="sunset-orange"]::after {
  content:'';position:absolute;inset:0;
  background: linear-gradient(180deg, transparent 40%, rgba(124,45,18,.15) 100%);
}
.auth-left[data-left-template="sunset-orange"] .auth-brand-icon {
  background:linear-gradient(135deg,#fb923c,#ea580c);
  box-shadow:0 16px 40px rgba(234,88,12,.3);
}
.auth-left[data-left-template="sunset-orange"] .auth-brand h1 {
  background:linear-gradient(90deg,#7c2d12,#c2410c,#ea580c);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.auth-left[data-left-template="sunset-orange"] .auth-brand p { color:#9a3412; }
.auth-left[data-left-template="sunset-orange"] .auth-feature {
  background:rgba(255,255,255,.5);backdrop-filter:blur(12px);
  border:1px solid rgba(251,146,60,.25);
  box-shadow:0 8px 20px rgba(251,146,60,.15);
}
.auth-left[data-left-template="sunset-orange"] .auth-feature-icon {
  background:linear-gradient(135deg,#fb923c,#ea580c);color:#fff;
}
.auth-left[data-left-template="sunset-orange"] .auth-feature h4 { color:#7c2d12; }
.auth-left[data-left-template="sunset-orange"] .auth-feature p { color:#9a3412; }
.auth-left[data-left-template="sunset-orange"] .auth-back {
  background:rgba(255,255,255,.5);color:#7c2d12;
}

/* ═══════════════════════════════════════════════════════════
   ŞABLON 12: ABSTRACT BLOBS (Renkli yüzen organik şekiller)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="abstract-blobs"] {
  background: #0f172a;
  color: #f1f5f9;
}
.auth-left[data-left-template="abstract-blobs"]::before {
  content:'';position:absolute;top:10%;left:10%;width:350px;height:350px;
  background: #ec4899;
  border-radius: 60% 40% 70% 30% / 50% 60% 40% 50%;
  filter:blur(50px);opacity:.5;
  animation: authBlob1 14s ease-in-out infinite;
}
.auth-left[data-left-template="abstract-blobs"]::after {
  content:'';position:absolute;bottom:15%;right:-10%;width:420px;height:420px;
  background: #3b82f6;
  border-radius: 40% 60% 50% 50% / 60% 40% 50% 40%;
  filter:blur(60px);opacity:.45;
  animation: authBlob2 16s ease-in-out infinite;
}
@keyframes authBlob1 {
  0%,100% { border-radius:60% 40% 70% 30% / 50% 60% 40% 50%; transform:translate(0,0); }
  50% { border-radius:40% 60% 30% 70% / 60% 40% 60% 40%; transform:translate(40px,-30px); }
}
@keyframes authBlob2 {
  0%,100% { border-radius:40% 60% 50% 50% / 60% 40% 50% 40%; transform:translate(0,0); }
  50% { border-radius:70% 30% 60% 40% / 40% 60% 40% 60%; transform:translate(-30px,40px); }
}
.auth-left[data-left-template="abstract-blobs"] .auth-brand-icon {
  background:rgba(255,255,255,.15);backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.2);
}
.auth-left[data-left-template="abstract-blobs"] .auth-feature {
  background:rgba(255,255,255,.06);backdrop-filter:blur(16px) saturate(180%);
  border:1px solid rgba(255,255,255,.1);
}
.auth-left[data-left-template="abstract-blobs"] .auth-feature-icon {
  background:linear-gradient(135deg,rgba(236,72,153,.3),rgba(59,130,246,.3));color:#fff;
}
.auth-left[data-left-template="abstract-blobs"] .auth-back {
  background:rgba(255,255,255,.08);backdrop-filter:blur(10px);color:#fff;
}

/* ═══════════════════════════════════════════════════════════
   SAĞ PANEL ŞABLONLARI (v5.1 YENİ — Form görünümü)
   ═══════════════════════════════════════════════════════════ */
.auth-right[data-right-template] {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 32px;
  min-height: 100vh;
  background: var(--bg, #f8fafc);
  transition: background .3s;
}
.auth-right[data-right-template] .auth-form-wrap {
  width: 100%;
  max-width: 460px;
  position: relative;
}

/* Sağ 1: minimal — Varsayılan, sade form */
.auth-right[data-right-template="minimal"] {
  background: var(--bg, #fff);
}

/* Sağ 2: card-elevated — Kalkık kart */
.auth-right[data-right-template="card-elevated"] {
  background: linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%);
}
.auth-right[data-right-template="card-elevated"] .auth-form-wrap {
  background: #fff;
  padding: 40px 36px;
  border-radius: 20px;
  box-shadow: 0 24px 64px rgba(0,0,0,.12), 0 4px 16px rgba(0,0,0,.04);
}
html[data-theme="dark"] .auth-right[data-right-template="card-elevated"] {
  background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
}
html[data-theme="dark"] .auth-right[data-right-template="card-elevated"] .auth-form-wrap {
  background: #1e293b;
}

/* Sağ 3: glass-form — Şeffaf cam form */
.auth-right[data-right-template="glass-form"] {
  background: linear-gradient(135deg, rgba(108,99,255,.12), rgba(236,72,153,.08));
  position: relative;
}
.auth-right[data-right-template="glass-form"]::before {
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(108,99,255,.2), transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(236,72,153,.2), transparent 50%);
  filter:blur(40px);
}
.auth-right[data-right-template="glass-form"] .auth-form-wrap {
  background: rgba(255,255,255,.65);
  backdrop-filter: blur(20px) saturate(180%);
  padding: 36px 32px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.5);
  box-shadow: 0 20px 50px rgba(0,0,0,.08);
  position: relative;
  z-index: 1;
}
html[data-theme="dark"] .auth-right[data-right-template="glass-form"] .auth-form-wrap {
  background: rgba(15,23,42,.6);
  border-color: rgba(255,255,255,.08);
}

/* Sağ 4: gradient-border — Gradyan border form */
.auth-right[data-right-template="gradient-border"] .auth-form-wrap {
  padding: 3px;
  background: linear-gradient(135deg, var(--p, #6c63ff), var(--s, #ec4899), #f59e0b);
  background-size: 200% 200%;
  border-radius: 20px;
  animation: authBorderGrad 6s ease infinite;
}
.auth-right[data-right-template="gradient-border"] .auth-form-wrap > * {
  background: var(--bg, #fff);
  border-radius: 17px;
  padding: 36px 32px;
}
@keyframes authBorderGrad { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }
html[data-theme="dark"] .auth-right[data-right-template="gradient-border"] .auth-form-wrap > * {
  background: #1e293b;
}

/* Sağ 5: centered-modal — Ortada küçük modal benzeri */
.auth-right[data-right-template="centered-modal"] {
  background: radial-gradient(ellipse at center, rgba(108,99,255,.08), transparent);
}
.auth-right[data-right-template="centered-modal"] .auth-form-wrap {
  max-width: 420px;
  background: #fff;
  padding: 32px 28px;
  border-radius: 16px;
  box-shadow: 0 32px 80px rgba(0,0,0,.15);
  border: 1px solid rgba(0,0,0,.05);
}

/* Sağ 6: side-dark — Koyu form (açık sol panelle kontrast) */
.auth-right[data-right-template="side-dark"] {
  background: #0f172a;
  color: #f1f5f9;
}
.auth-right[data-right-template="side-dark"] .auth-form-wrap label,
.auth-right[data-right-template="side-dark"] .auth-form-wrap h2,
.auth-right[data-right-template="side-dark"] .auth-form-wrap h3 { color: #f1f5f9; }
.auth-right[data-right-template="side-dark"] input[type="text"],
.auth-right[data-right-template="side-dark"] input[type="email"],
.auth-right[data-right-template="side-dark"] input[type="password"] {
  background: #1e293b; color: #f1f5f9; border-color: #334155;
}

/* ═══════════════════════════════════════════════════════════
   Panel Genişlik Kontrolleri — v5.1: %50/%50 varsayılan + daha fazla preset
   ESKİ .auth-tpl-split-modern .auth-right{width:640px} gibi kuralları OVERRIDE et
   ═══════════════════════════════════════════════════════════ */
.auth-split {
  display: grid !important;
  grid-template-columns: 50% 50% !important;
  min-height: 100vh;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  flex-direction: unset !important;
}

/* v5.1: Yeni şablon (data-left-template / data-right-template) kullanılıyorsa
   ESKİ .auth-tpl-X kurallarındaki width/flex/min-width kısıtlamalarını ezer */
.auth-split .auth-left[data-left-template],
.auth-split .auth-right[data-right-template] {
  flex: unset !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  background: unset; /* şablon kendi background'unu uygulayacak */
}

/* Split reverse/modern gibi eski sınıfların direction kısıtını temizle */
.auth-split.auth-tpl-split-reverse,
.auth-split.auth-tpl-split-modern,
.auth-split.auth-tpl-wide-left,
.auth-split.auth-tpl-wide-right,
.auth-split.auth-tpl-hero-fullscreen,
.auth-split.auth-tpl-dark-luxe,
.auth-split.auth-tpl-neo-brutal {
  flex-direction: unset !important;
  display: grid !important;
}

/* Form içeriğinin kendisi de 100% olmalı (auth-right içinde) */
.auth-right[data-right-template] .auth-right-content,
.auth-right[data-right-template] form,
.auth-right[data-right-template] > .auth-right-wrapper {
  max-width: 480px;
  width: 100%;
  margin: 0 auto;
}
.auth-split[data-left-expanded="0"] { grid-template-columns: 50% 50% !important; }
.auth-split[data-left-expanded="1"] { grid-template-columns: 60% 40% !important; }
.auth-split[data-left-expanded="2"] { grid-template-columns: 70% 30% !important; }
.auth-split[data-left-expanded="3"] { grid-template-columns: 40% 60% !important; }
.auth-split[data-left-expanded="4"] { grid-template-columns: 30% 70% !important; }
.auth-split[data-left-expanded="hidden"] { grid-template-columns: 0 100% !important; }
.auth-split[data-left-expanded="hidden"] .auth-left { display: none; }
.auth-split[data-left-expanded="right-hidden"] { grid-template-columns: 100% 0 !important; }
.auth-split[data-left-expanded="right-hidden"] .auth-right { display: none; }

/* v5.2: YENİ PRESET "flush" — Sağ/Sol TAM YAPIŞIK (ekran uçlarına dayalı) */
/* auth.css'teki tüm width:640px, min-width:560px vb. kuralları EZER */
.auth-split[data-left-expanded="flush"],
html:root .auth-split[data-left-expanded="flush"],
body .auth-split[data-left-expanded="flush"] {
  display: grid !important;
  grid-template-columns: 50% 50% !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  left: 0 !important;
  right: 0 !important;
  position: relative !important;
}
/* Sağ panel — TÜM eski width/min-width/flex kurallarını ez */
.auth-split[data-left-expanded="flush"] .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-split-modern .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-split-reverse .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-minimal-glass .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-gradient-wave .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-wide-left .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-wide-right .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-dark-luxe .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-neo-brutal .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-hero-fullscreen .auth-right,
.auth-split[data-left-expanded="flush"].auth-tpl-neon-grid .auth-right {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  margin: 0 !important;
  padding: 60px 40px !important;
  border-radius: 0 !important;
}
/* Sol panel — aynı şekilde */
.auth-split[data-left-expanded="flush"] .auth-left,
.auth-split[data-left-expanded="flush"].auth-tpl-split-modern .auth-left,
.auth-split[data-left-expanded="flush"].auth-tpl-split-reverse .auth-left,
.auth-split[data-left-expanded="flush"].auth-tpl-wide-left .auth-left,
.auth-split[data-left-expanded="flush"].auth-tpl-wide-right .auth-left,
.auth-split[data-left-expanded="flush"].auth-tpl-hero-fullscreen .auth-left,
.auth-split[data-left-expanded="flush"].auth-tpl-neon-grid .auth-left {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

/* v5.2 BONUS: Default (0,1,2,3,4) durumlarında da eski width kısıtlarını ez
   (bazı şablonlar eski CSS'yi yalayarak sağda boşluk bırakıyor) */
.auth-split:not(.auth-inline)[data-left-expanded] .auth-right,
.auth-split:not(.auth-inline)[data-left-expanded] .auth-left {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
/* Sadece inline modunda width korunur (1100px popup) */
.auth-split.auth-inline .auth-left,
.auth-split.auth-inline .auth-right {
  width: auto;
  max-width: none;
}

/* Root full width - body/html üzerindeki padding/margin'leri temizle */
body.auth-split-body,
html:has(body.auth-split-body) {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden;
}
body.auth-split-body > .container,
body.auth-split-body .auth-split {
  max-width: 100vw !important;
}

/* v5.2: SAĞ PANEL HER ZAMAN GÖRÜNÜR — layout styles özellikle gizlemediği sürece */
.auth-split .auth-right[data-right-template]:not([hidden]) {
  display: flex !important;
}
/* Ama layout-style="fullscreen-form" için sağ paneli form yerine saklamaya izin ver */
.auth-split[data-layout-style="fullscreen-form"] .auth-left[data-left-template] { display: none !important; }
.auth-split[data-left-expanded="hidden"] .auth-left[data-left-template] { display: none !important; }
.auth-split[data-left-expanded="right-hidden"] .auth-right[data-right-template] { display: none !important; }

/* Mobile — sol panel otomatik gizli veya üstte */
@media (max-width: 900px) {
  .auth-split,
  .auth-split[data-left-expanded] {
    grid-template-columns: 1fr !important;
  }
  .auth-left[data-left-template] {
    min-height: auto;
    padding: 40px 24px;
  }
  .auth-left[data-left-template] .auth-features { display: none; }
  .auth-left[data-left-template] .auth-back {
    top: 16px; left: 16px;
  }
  .auth-right[data-right-template] {
    min-height: auto;
    padding: 32px 20px;
  }
}

/* Inline mod (popup) — sol paneli gizle */
.auth-split.auth-inline .auth-left[data-left-template] { display: none; }

/* ═══════════════════════════════════════════════════════════
   v5.2 GENEL LAYOUT STILLERI (layout_style) — FORM KONUMU
   ═══════════════════════════════════════════════════════════ */

/* 1. split (default) — sol brand + sağ form */
/* (Varsayılan CSS yukarıda) */

/* 2. split-reverse — sol form + sağ brand */
.auth-split[data-layout-style="split-reverse"] {
  direction: rtl !important;
}
.auth-split[data-layout-style="split-reverse"] > * {
  direction: ltr;
}

/* 3. center-form — merkez floating form + tam ekran brand arkada */
.auth-split[data-layout-style="center-form"] {
  display: block !important;
  position: relative;
  min-height: 100vh;
}
.auth-split[data-layout-style="center-form"] .auth-left[data-left-template] {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  min-height: 100vh !important;
}
.auth-split[data-layout-style="center-form"] .auth-right[data-right-template] {
  position: relative !important;
  z-index: 10 !important;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  padding: 40px 20px !important;
}
.auth-split[data-layout-style="center-form"] .auth-right[data-right-template] .auth-right-content,
.auth-split[data-layout-style="center-form"] .auth-right[data-right-template] form {
  background: rgba(255,255,255,.95) !important;
  backdrop-filter: blur(20px);
  padding: 40px 36px !important;
  border-radius: 20px !important;
  max-width: 480px;
  width: 100%;
  box-shadow: 0 32px 80px rgba(0,0,0,.3);
}
html[data-theme="dark"] .auth-split[data-layout-style="center-form"] .auth-right[data-right-template] .auth-right-content,
html[data-theme="dark"] .auth-split[data-layout-style="center-form"] .auth-right[data-right-template] form {
  background: rgba(30,41,59,.9) !important;
}
.auth-split[data-layout-style="center-form"] .auth-left[data-left-template] .auth-left-content {
  opacity: .6 !important;
}

/* 4. hero-top — üstte brand (40vh), altta form */
.auth-split[data-layout-style="hero-top"] {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: unset !important;
}
.auth-split[data-layout-style="hero-top"] .auth-left[data-left-template] {
  min-height: 40vh !important;
  width: 100% !important;
  padding: 50px 20px !important;
}
.auth-split[data-layout-style="hero-top"] .auth-left[data-left-template] .auth-features {
  display: none !important;
}
.auth-split[data-layout-style="hero-top"] .auth-right[data-right-template] {
  min-height: 60vh !important;
  width: 100% !important;
}

/* 5. fullscreen-form — sol gizli, form tam ekran merkezli */
.auth-split[data-layout-style="fullscreen-form"] {
  display: flex !important;
  align-items: center;
  justify-content: center;
  grid-template-columns: unset !important;
}
.auth-split[data-layout-style="fullscreen-form"] .auth-left[data-left-template] { display: none !important; }
.auth-split[data-layout-style="fullscreen-form"] .auth-right[data-right-template] {
  width: 100% !important;
  max-width: 520px;
  min-height: auto !important;
  padding: 40px 32px !important;
}

/* 6. center-split — sol brand + orta form + sağ brand (ayna) */
.auth-split[data-layout-style="center-split"] {
  display: grid !important;
  grid-template-columns: 1fr 520px 1fr !important;
}
.auth-split[data-layout-style="center-split"] .auth-right[data-right-template] {
  grid-column: 2;
  width: 100% !important;
  padding: 40px 32px !important;
}
.auth-split[data-layout-style="center-split"] .auth-left[data-left-template] {
  grid-column: 1;
}
.auth-split[data-layout-style="center-split"]::after {
  content: '';
  grid-column: 3;
  background: inherit;
  /* Sağ taraftaki brand (sol panelin ayna kopyası) — CSS only */
}

/* 7. floating-form — form sağda, left panelin üzerinde "kayık" */
.auth-split[data-layout-style="floating-form"] {
  display: flex !important;
  position: relative;
  min-height: 100vh;
}
.auth-split[data-layout-style="floating-form"] .auth-left[data-left-template] {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
}
.auth-split[data-layout-style="floating-form"] .auth-right[data-right-template] {
  position: relative !important;
  z-index: 10 !important;
  margin-left: auto;
  margin-right: 60px;
  align-self: center;
  width: 480px !important;
  max-width: 90%;
  background: rgba(255,255,255,.95) !important;
  border-radius: 20px !important;
  padding: 40px 36px !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.35);
}
html[data-theme="dark"] .auth-split[data-layout-style="floating-form"] .auth-right[data-right-template] {
  background: rgba(30,41,59,.92) !important;
}

/* Layout stilleri için mobile uyumluluk */
@media (max-width: 900px) {
  .auth-split[data-layout-style="center-form"] .auth-left[data-left-template],
  .auth-split[data-layout-style="floating-form"] .auth-left[data-left-template] {
    position: relative !important;
    min-height: auto !important;
    padding: 30px 20px !important;
  }
  .auth-split[data-layout-style="center-split"] {
    grid-template-columns: 1fr !important;
  }
  .auth-split[data-layout-style="center-split"] .auth-right[data-right-template] { grid-column: 1; }
  .auth-split[data-layout-style="center-split"]::after { display: none; }
}

/* ═══════════════════════════════════════════════════════════
   KLASİK VARSAYILAN (eski admin şablonu korundu)
   ═══════════════════════════════════════════════════════════ */
.auth-left[data-left-template="classic"] {
  background: linear-gradient(135deg, var(--p, #6c63ff) 0%, var(--s, #ff6584) 50%, var(--p, #6c63ff) 100%);
  background-size: 300% 300%;
  animation: authLeftGrad 12s ease infinite;
  color: #fff;
}
@keyframes authLeftGrad { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }
.auth-left[data-left-template="classic"] .auth-brand-icon {
  background: rgba(255,255,255,.18);
  box-shadow: 0 12px 32px rgba(0,0,0,.2);
}
.auth-left[data-left-template="classic"] .auth-feature {
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.15);
}
.auth-left[data-left-template="classic"] .auth-feature-icon {
  background: rgba(255,255,255,.22);
  color: #fff;
}
.auth-left[data-left-template="classic"] .auth-back {
  background: rgba(255,255,255,.14); color: #fff;
}

/* ═══════════════════════════════════════════════════════════
   MOBİL ŞABLONLARI v5.4 — Masaüstü şablonunu TAMAMEN ez
   Her mobil şablon KENDİ renk/bg/tasarımını getirir
   Mobile breakpoint: 900px altı
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  /* ═══ KRİTİK: Mobilde TÜM data-left-expanded kurallarını SIFIRLA
     (flush, 0, 1, 2, 3, 4 vs.) — mobilde grid-template-columns her zaman 1fr olmalı.
     Masaüstü için ayarlanan "Sağ/Sol Yapışık" preset'i mobilde tek kolon'a zorla döner. ═══ */
  .auth-split,
  .auth-split[data-left-expanded],
  .auth-split[data-left-expanded="flush"],
  .auth-split[data-left-expanded="0"],
  .auth-split[data-left-expanded="1"],
  .auth-split[data-left-expanded="2"],
  .auth-split[data-left-expanded="3"],
  .auth-split[data-left-expanded="4"],
  body .auth-split[data-left-expanded="flush"],
  body .auth-split[data-left-expanded="0"],
  body .auth-split[data-left-expanded="1"],
  body .auth-split[data-left-expanded="2"],
  body .auth-split[data-left-expanded="3"],
  body .auth-split[data-left-expanded="4"],
  html:root .auth-split[data-left-expanded="flush"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* ═══════════════════════════════════════════════════════════
     KRİTİK FIX v5.6 — auth.css'teki "@media(max-width:900px){.auth-left{display:none}}"
     kuralını EZE. Aksi halde TÜM mobil şablonlarda hero paneli GİZLİ kalıyordu.
     Her şablon kendi display:none/display:flex kuralını aşağıda zaten ayarlıyor.
     Default olarak tüm mobil şablonlarda SHOW ediyoruz; compact-card/fullscreen-form
     kendi override'ları ile tekrar display:none yapar.
     ═══════════════════════════════════════════════════════════ */
  .auth-split[data-mobile-template] .auth-left[data-left-template],
  .auth-split[data-mobile-template] > .auth-left,
  .auth-split .auth-left[data-left-template] {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
  }

  /* Mobilde sol/sağ panel her zaman tam genişlik */
  .auth-split .auth-left[data-left-template],
  .auth-split .auth-right[data-right-template] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }

  /* auth-left-content mobile: üstten başlasın, tam genişlik */
  .auth-split .auth-left[data-left-template] .auth-left-content {
    position: relative !important;
    z-index: 2 !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* ═══════════════════════════════════════════════════════════
     KRİTİK: default DIŞINDAKİ mobil şablonlar için masaüstü şablonunun
     TÜM background/renk/dekor override'larını sıfırla.
     Böylece mobil şablon kendi görünümünü tam olarak uygular.
     ═══════════════════════════════════════════════════════════ */
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template] {
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    animation: none !important;
    color: inherit !important;
  }
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template]::before,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template]::after {
    display: none !important;
    animation: none !important;
    content: none !important;
  }
  /* v5.6 — Dekoratif süsler (partikül/daire/ızgara/çizgi) non-default mobil'de görünmesin */
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-deco-particles,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-deco-circles,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-deco-grid,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-deco-lines,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left-bg {
    display: none !important;
  }
  /* Default mobil'de dekoratif süsler biraz sönükleştirilsin (ekran küçük) */
  .auth-split[data-mobile-template="default"] .auth-deco-particles,
  .auth-split[data-mobile-template="default"] .auth-deco-lines,
  .auth-split[data-mobile-template="default"] .auth-deco-grid {
    opacity: .35 !important;
  }
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template] .auth-brand-icon,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template] .auth-brand h1,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template] .auth-brand p,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template] .auth-feature,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template] .auth-feature-icon,
  .auth-split[data-mobile-template]:not([data-mobile-template="default"]) .auth-left[data-left-template] .auth-back {
    background: unset !important;
    box-shadow: none !important;
    border: none !important;
    animation: none !important;
    color: inherit !important;
    -webkit-text-fill-color: unset !important;
  }

  /* ═══ 1. DEFAULT — Üstte brand, altta form (klasik mobil) ═══ */
  .auth-split[data-mobile-template="default"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    min-height: 100vh !important;
    padding: 0 !important;
    width: 100% !important;
  }
  .auth-split[data-mobile-template="default"] .auth-left[data-left-template] {
    display: flex !important;
    flex-direction: column !important;
    min-height: auto !important;
    padding: 50px 24px 30px !important;
    width: 100% !important;
  }
  .auth-split[data-mobile-template="default"] .auth-left[data-left-template] .auth-features {
    display: none !important;
  }
  .auth-split[data-mobile-template="default"] .auth-right[data-right-template] {
    min-height: auto !important;
    padding: 32px 20px !important;
    width: 100% !important;
  }

  /* ═══ 2. COMPACT-CARD — Merkez kart, gradient arka plan + beyaz form ═══ */
  .auth-split[data-mobile-template="compact-card"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%) !important;
    background-size: 200% 200%;
    animation: authGrad 12s ease infinite;
    min-height: 100vh !important;
    padding: 30px 20px !important;
    width: 100% !important;
  }
  .auth-split[data-mobile-template="compact-card"] .auth-left[data-left-template] {
    display: none !important;
  }
  .auth-split[data-mobile-template="compact-card"] .auth-right[data-right-template] {
    background: transparent !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 400px !important;
    min-height: auto !important;
  }
  .auth-split[data-mobile-template="compact-card"] .auth-right[data-right-template] > *,
  .auth-split[data-mobile-template="compact-card"] .auth-right[data-right-template] .auth-right-content,
  .auth-split[data-mobile-template="compact-card"] .auth-right[data-right-template] form {
    background: #fff !important;
    padding: 28px 24px !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 60px rgba(0,0,0,.25) !important;
    max-width: 100% !important;
  }
  html[data-theme="dark"] .auth-split[data-mobile-template="compact-card"] .auth-right > *,
  html[data-theme="dark"] .auth-split[data-mobile-template="compact-card"] .auth-right form {
    background: #1e293b !important;
  }

  /* ═══ 3. FULLSCREEN-FORM — Sadece form, tam ekran, beyaz zemin ═══ */
  .auth-split[data-mobile-template="fullscreen-form"] {
    display: block !important;
    grid-template-columns: 1fr !important;
    min-height: 100vh !important;
    padding: 0 !important;
    width: 100% !important;
    background: var(--bg, #ffffff) !important;
  }
  .auth-split[data-mobile-template="fullscreen-form"] .auth-left[data-left-template] {
    display: none !important;
  }
  .auth-split[data-mobile-template="fullscreen-form"] .auth-right[data-right-template] {
    padding: 60px 24px 40px !important;
    min-height: 100vh !important;
    width: 100% !important;
    background: transparent !important;
  }
  html[data-theme="dark"] .auth-split[data-mobile-template="fullscreen-form"] {
    background: #0f172a !important;
  }

  /* ═══ 4. BOTTOM-SHEET — Hero fotoğraf üstte (40vh) + beyaz yuvarlak form altta (60vh) ═══ */
  .auth-split[data-mobile-template="bottom-sheet"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    min-height: 100vh !important;
    padding: 0 !important;
    width: 100% !important;
  }
  .auth-split[data-mobile-template="bottom-sheet"] .auth-left[data-left-template] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40vh !important;
    height: 40vh !important;
    max-height: 40vh !important;
    padding: 50px 24px 30px !important;
    position: relative !important;
    overflow: hidden !important;
    width: 100% !important;
    /* Hero fotoğraf + gradient overlay */
    background-color: #0f0c29 !important;
    background-image:
      linear-gradient(180deg, rgba(15,12,41,.55) 0%, rgba(15,12,41,.75) 70%, rgba(15,12,41,.95) 100%),
      var(--auth-hero-image, url('https://images.unsplash.com/photo-1518020382113-a7e8fc38eac9?auto=format&fit=crop&w=1200&q=70')) !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    color: #fff !important;
  }
  .auth-split[data-mobile-template="bottom-sheet"] .auth-left[data-left-template]::before {
    content: '' !important;
    display: block !important;
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 30% 20%, rgba(139,92,246,.25), transparent 50%),
      radial-gradient(circle at 70% 50%, rgba(59,130,246,.15), transparent 50%);
    pointer-events: none;
  }
  .auth-split[data-mobile-template="bottom-sheet"] .auth-left[data-left-template] .auth-brand-icon {
    background: rgba(255,255,255,.18) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,.25);
  }
  .auth-split[data-mobile-template="bottom-sheet"] .auth-left[data-left-template] .auth-brand h1 {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: none !important;
  }
  .auth-split[data-mobile-template="bottom-sheet"] .auth-left[data-left-template] .auth-brand p {
    color: rgba(255,255,255,.85) !important;
  }
  .auth-split[data-mobile-template="bottom-sheet"] .auth-left[data-left-template] .auth-features {
    display: none !important;
  }
  .auth-split[data-mobile-template="bottom-sheet"] .auth-right[data-right-template] {
    border-radius: 28px 28px 0 0 !important;
    margin-top: -28px !important;
    padding: 32px 20px 40px !important;
    background: #ffffff !important;
    box-shadow: 0 -8px 24px rgba(0,0,0,.25) !important;
    flex: 1 !important;
    min-height: 60vh !important;
    position: relative !important;
    z-index: 10 !important;
    overflow-y: auto !important;
    width: 100% !important;
  }
  .auth-split[data-mobile-template="bottom-sheet"] .auth-right[data-right-template]::before {
    content: '' !important;
    display: block !important;
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 4px;
    background: rgba(0,0,0,.15);
    border-radius: 2px;
  }
  html[data-theme="dark"] .auth-split[data-mobile-template="bottom-sheet"] .auth-right[data-right-template] {
    background: #1e293b !important;
  }

  /* ═══ 5. STACKED-HERO — Renkli gradient hero + 2×2 feature grid ═══ */
  .auth-split[data-mobile-template="stacked-hero"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    min-height: 100vh !important;
    padding: 0 !important;
    width: 100% !important;
    background: var(--bg, #f8fafc) !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] {
    display: flex !important;
    flex-direction: column !important;
    min-height: auto !important;
    padding: 60px 24px 40px !important;
    width: 100% !important;
    background: linear-gradient(135deg, var(--p, #6c63ff) 0%, var(--s, #ec4899) 100%) !important;
    color: #fff !important;
    position: relative !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-brand-icon {
    background: rgba(255,255,255,.2) !important;
    backdrop-filter: blur(10px);
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-brand h1 {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: none !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-brand p {
    color: rgba(255,255,255,.9) !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-feature {
    background: rgba(255,255,255,.12) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,.18) !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-feature-icon {
    background: rgba(255,255,255,.2) !important;
    color: #fff !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-feature h4 {
    color: #fff !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-feature p {
    color: rgba(255,255,255,.8) !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-features {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    margin-top: 20px !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-feature {
    padding: 10px 12px !important;
    flex-direction: row !important;
    gap: 8px !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-feature-icon {
    width: 32px !important;
    height: 32px !important;
    font-size: 14px !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-feature h4 {
    font-size: 12px !important;
    margin-bottom: 2px !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-feature p {
    font-size: 10.5px !important;
    line-height: 1.4 !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-right[data-right-template] {
    padding: 28px 20px !important;
    min-height: auto !important;
    width: 100% !important;
  }

  /* ═══ 6. SPLIT-MINI — 30vh mini gradient brand + 70vh form ═══ */
  .auth-split[data-mobile-template="split-mini"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: 30vh 70vh !important;
    min-height: 100vh !important;
    padding: 0 !important;
    width: 100% !important;
  }
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: auto !important;
    height: 30vh !important;
    max-height: 30vh !important;
    padding: 20px !important;
    overflow: hidden !important;
    width: 100% !important;
    background: linear-gradient(135deg, var(--p, #6c63ff), var(--s, #ec4899)) !important;
    color: #fff !important;
  }
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] .auth-brand-icon {
    background: rgba(255,255,255,.2) !important;
  }
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] .auth-brand h1 {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: none !important;
  }
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] .auth-features,
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] .auth-brand p {
    display: none !important;
  }
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] .auth-brand {
    margin-bottom: 0 !important;
  }
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] .auth-brand h1 {
    font-size: 22px !important;
    margin: 0 !important;
  }
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] .auth-brand-icon {
    width: 48px !important;
    height: 48px !important;
    margin-bottom: 8px !important;
  }
  .auth-split[data-mobile-template="split-mini"] .auth-right[data-right-template] {
    padding: 28px 20px !important;
    min-height: auto !important;
    height: 70vh !important;
    overflow-y: auto !important;
    width: 100% !important;
  }

  /* ═══ 7. APP-LIKE — Uygulama stili: beyaz zemin, üstte logo, altta form ═══ */
  .auth-split[data-mobile-template="app-like"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    min-height: 100vh !important;
    background: var(--bg, #fff) !important;
    padding: 0 !important;
    width: 100% !important;
  }
  .auth-split[data-mobile-template="app-like"] .auth-left[data-left-template] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    background: transparent !important;
    color: var(--text, #1e1e3a) !important;
    min-height: auto !important;
    padding: 40px 20px 20px !important;
    width: 100% !important;
  }
  .auth-split[data-mobile-template="app-like"] .auth-left[data-left-template]::before,
  .auth-split[data-mobile-template="app-like"] .auth-left[data-left-template]::after {
    display: none !important;
  }
  .auth-split[data-mobile-template="app-like"] .auth-left[data-left-template] .auth-brand h1 {
    color: var(--text, #1e1e3a) !important;
    background: linear-gradient(90deg, var(--p, #6c63ff), var(--s, #ec4899)) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    font-size: 26px !important;
  }
  .auth-split[data-mobile-template="app-like"] .auth-left[data-left-template] .auth-brand p {
    color: var(--tl, #64748b) !important;
  }
  .auth-split[data-mobile-template="app-like"] .auth-left[data-left-template] .auth-features,
  .auth-split[data-mobile-template="app-like"] .auth-left[data-left-template] .auth-back {
    display: none !important;
  }
  .auth-split[data-mobile-template="app-like"] .auth-right[data-right-template] {
    padding: 0 20px 40px !important;
    min-height: auto !important;
    width: 100% !important;
    background: transparent !important;
  }

  /* ═══ Tüm mobil şablonlar için genel "Ana Sayfa" butonu küçültme ═══ */
  /* v5.6 — default/bottom-sheet/stacked-hero/split-mini'de absolute olsun, kaydırılırken formu kaplamasın */
  .auth-split[data-mobile-template="default"] .auth-left[data-left-template] .auth-back,
  .auth-split[data-mobile-template="bottom-sheet"] .auth-left[data-left-template] .auth-back,
  .auth-split[data-mobile-template="stacked-hero"] .auth-left[data-left-template] .auth-back,
  .auth-split[data-mobile-template="split-mini"] .auth-left[data-left-template] .auth-back {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    padding: 6px 10px !important;
    font-size: 11.5px !important;
    margin: 0 !important;
    background: rgba(255,255,255,.18) !important;
    color: #fff !important;
    backdrop-filter: blur(8px);
    border-radius: 10px !important;
    z-index: 150 !important;
  }
  /* app-like: transparent zemin üzerinde koyu buton */
  .auth-split[data-mobile-template="app-like"] .auth-left[data-left-template] .auth-back {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    padding: 6px 10px !important;
    font-size: 11.5px !important;
    margin: 0 !important;
    background: rgba(15,23,42,.08) !important;
    color: var(--text, #1e1e3a) !important;
    border-radius: 10px !important;
    z-index: 150 !important;
  }

  /* ═══ v5.6 — Copyright mobil'de: dar/fixed-yükseklik panellerde gizle, akış tabanlı panellerde akışta göster ═══ */
  .auth-split[data-mobile-template="bottom-sheet"] .auth-left-footer,
  .auth-split[data-mobile-template="split-mini"] .auth-left-footer,
  .auth-split[data-mobile-template="compact-card"] .auth-left-footer,
  .auth-split[data-mobile-template="fullscreen-form"] .auth-left-footer {
    display: none !important;
  }
  .auth-split[data-mobile-template="default"] .auth-left-footer,
  .auth-split[data-mobile-template="stacked-hero"] .auth-left-footer,
  .auth-split[data-mobile-template="app-like"] .auth-left-footer {
    position: static !important;
    bottom: auto !important;
    margin-top: 20px !important;
    padding: 10px 0 0 !important;
    text-align: center !important;
    opacity: .75 !important;
  }

  /* auth-left alt padding mobilde sıfırla (kopyrıght absolute değilse artık gerekmiyor) */
  .auth-split[data-mobile-template] .auth-left[data-left-template] {
    padding-bottom: 24px !important;
  }

  /* ═══ v5.6 — Features mobil'de grid 2 sütun (küçük ekrana sığsın) ═══ */
  .auth-split[data-mobile-template] .auth-features {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .auth-split[data-mobile-template="stacked-hero"] .auth-features,
  .auth-split[data-mobile-template="default"] .auth-features {
    grid-template-columns: 1fr 1fr !important;
  }

  /* ═══ v5.6 — Brand başlığı mobilde yumuşat ═══ */
  .auth-split[data-mobile-template] .auth-left[data-left-template] .auth-brand h1 {
    font-size: 24px !important;
    line-height: 1.2 !important;
    margin: 10px 0 6px !important;
  }
  .auth-split[data-mobile-template] .auth-left[data-left-template] .auth-brand p {
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    margin: 0 !important;
  }
  .auth-split[data-mobile-template] .auth-left[data-left-template] .auth-brand-icon {
    width: 56px !important;
    height: 56px !important;
    margin-bottom: 10px !important;
  }
  /* Bottom-sheet, compact, fullscreen vs. sol panelin gizli olduğu şablonlarda "Ana Sayfa" butonu global olarak görünür */
  .auth-split[data-mobile-template="fullscreen-form"] .auth-back,
  .auth-split[data-mobile-template="compact-card"] .auth-back,
  .auth-split[data-mobile-template="app-like"] .auth-back {
    position: fixed !important;
    top: 12px !important;
    left: 12px !important;
    z-index: 200 !important;
    display: inline-flex !important;
    background: rgba(255,255,255,.9) !important;
    color: #1e1e3a !important;
    backdrop-filter: blur(12px);
  }
}