/**
 * Quenara Auth Module v3.0 — Patron Onaylı Override'lar
 * 1 Mayıs 2026 — v2 (mobil iyileştirme)
 */

/* === COMPACT FIX (desktop) === */
.qnr-brand-side { padding: 24px 56px !important; }
.qnr-form-side { padding: 24px 56px !important; }
.qnr-form-card { padding: 36px 40px !important; }
.qnr-form-side > * + * { margin-top: 16px !important; }

/* === GEZEGEN — texture+weather senkron 180s === */
.qnr-j-texture,
.qnr-j-weather {
  animation: qnr-jrot 180s linear infinite !important;
  animation-delay: 0s !important;
}

/* ===========================================================
   MOBİL DENEYİMİ — Patron isteği:
   - Brand-side TAM GİZLE (yazılar+stats kalksın)
   - Form-side FULL EKRAN + emerald gradient arka plan
   - Sol alt köşede gezegen glow (dekoratif "gezegeni biraz göster")
   =========================================================== */

@media (max-width: 768px) {
  .qnr-auth {
    grid-template-columns: 1fr !important;
  }
  .qnr-brand-side {
    display: none !important;
  }
  .qnr-form-side {
    min-height: 100vh !important;
    padding: 32px 20px !important;
    position: relative !important;
    background: linear-gradient(135deg, #042F2E 0%, #064E3B 50%, #047857 100%) !important;
    overflow: hidden !important;
  }

  /* Gezegen glow — sol alt köşede, dekoratif arka plan */
  .qnr-form-side::before {
    content: '';
    position: absolute;
    left: -180px;
    bottom: -180px;
    width: 480px;
    height: 480px;
    background:
      radial-gradient(circle at 30% 30%, rgba(16, 185, 129, 0.45) 0%, rgba(16, 185, 129, 0.18) 35%, transparent 70%),
      radial-gradient(circle at 60% 60%, rgba(212, 175, 55, 0.18) 0%, transparent 60%);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    filter: blur(2px);
  }

  /* Yıldız dokusu mobilde de ufak görünsün */
  .qnr-form-side::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      radial-gradient(2px 2px at 20% 15%, rgba(255,255,255,0.6), transparent),
      radial-gradient(1px 1px at 80% 25%, rgba(255,255,255,0.5), transparent),
      radial-gradient(1px 1px at 65% 70%, rgba(255,255,255,0.45), transparent),
      radial-gradient(2px 2px at 35% 85%, rgba(254,243,199,0.5), transparent),
      radial-gradient(1px 1px at 90% 50%, rgba(167,243,208,0.45), transparent);
    pointer-events: none;
    z-index: 0;
  }

  .qnr-form-card {
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    max-width: 440px !important;
    margin: 0 auto !important;
    padding: 32px 24px !important;
    border-radius: 24px !important;
    background: #FFFFFF !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25) !important;
  }

  /* Form-card altındaki "Hesap Aç" + footer linkler — emerald arka planda kontrast yeterli */
  .qnr-form-side .qnr-register-row,
  .qnr-form-side > footer,
  .qnr-form-side .qnr-footer-links {
    position: relative !important;
    z-index: 1 !important;
    color: #ffffff !important;
  }
  .qnr-form-side .qnr-footer-links a,
  .qnr-form-side > footer a {
    color: #d4af37 !important;
  }
}

@media (max-width: 480px) {
  .qnr-form-side {
    padding: 24px 16px !important;
  }
  .qnr-form-card {
    padding: 28px 22px !important;
    border-radius: 20px !important;
  }
}

/* =====================================================================
   S236 v3 — STATİK BRAND-SIDE + IMAGE 2 SIGNUP DESIGN (kendi kapsüllü)
   ===================================================================== */

/* --- Page-level grid (auth-bundle.css'den BAĞIMSIZ) --- */
.qnr-page-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
  width: 100%;
}
.qnr-static-brand {
  min-height: 100vh;
  position: relative;
  overflow: hidden;
}

/* qnr-auth-root: form-side wrapper, tek kolon iç layout */
#qnr-auth-root {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 32px;
  min-height: 100vh;
  background: var(--qnr-paper, #FFFFFF);
}
/* Bundle iç qnr-auth div'i — block, brand-side gizle */
#qnr-auth-root > .qnr-auth {
  display: block !important;
  min-height: auto !important;
  grid-template-columns: none !important;
  width: 100%;
  max-width: 480px;
}
#qnr-auth-root > .qnr-auth > .qnr-brand-side {
  display: none !important;
}
#qnr-auth-root > .qnr-auth > .qnr-form-side {
  width: 100%;
  padding: 0 !important;
}

/* Responsive */
@media (max-width: 1023px) {
  .qnr-page-grid { grid-template-columns: 1fr !important; }
  .qnr-static-brand { display: none !important; }
  #qnr-auth-root { padding: 24px 16px; }
}

/* =====================================================================
   SIGNUP CARD — Image 2 design (Auth Module v3.0 stili)
   Tamamen self-contained (qnr-su-* prefix) — auth-bundle.css'den etkilenmez.
   ===================================================================== */

.qnr-su-card {
  background: #fff;
  border-radius: 24px;
  padding: 36px 36px 28px;
  box-shadow: none;
  border: 1px solid rgba(4,47,46,0.05);
  width: 100%;
  max-width: 480px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Header */
.qnr-su-head {
  margin-bottom: 24px;
}
.qnr-su-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 28px;
  font-weight: 700;
  color: #042F2E;
  margin: 0;
  letter-spacing: -0.01em;
}
.qnr-su-sub {
  font-size: 14px;
  color: #6B7B7A;
  margin-top: 4px;
}

.qnr-su-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Field row (Ad + Soyad yan yana) */
.qnr-su-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* Field — kapsüllü, auth-bundle.css reset'inden korunur */
.qnr-su-field {
  position: relative;
}
.qnr-su-field .qnr-su-input {
  /* Tüm reset'leri override et */
  width: 100% !important;
  height: 56px !important;
  padding: 22px 16px 8px 48px !important;
  border: 1.5px solid #D8DDDC !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: #042F2E !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color 200ms ease, box-shadow 200ms ease !important;
  position: static !important;
  display: block !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.qnr-su-field .qnr-su-input::placeholder {
  color: transparent;
}
.qnr-su-field .qnr-su-input:hover {
  border-color: #6EE7B7 !important;
}
.qnr-su-field .qnr-su-input:focus {
  border-color: #10B981 !important;
  box-shadow: 0 0 0 4px rgba(16,185,129,0.10) !important;
}
.qnr-su-field .qnr-su-input.has-error {
  border-color: #DC2626 !important;
  box-shadow: 0 0 0 4px rgba(220,38,38,0.08) !important;
}

/* Floating label */
.qnr-su-field .qnr-su-label {
  position: absolute;
  left: 48px;
  top: 18px;
  font-size: 14px;
  color: #6B7B7A;
  font-weight: 500;
  pointer-events: none;
  transition: all 180ms ease;
  z-index: 1;
  background: transparent;
}
.qnr-su-field .qnr-su-input:focus + .qnr-su-label,
.qnr-su-field .qnr-su-input:not(:placeholder-shown) + .qnr-su-label {
  top: 8px;
  font-size: 11px;
  color: #047857;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Field icon (sol) */
.qnr-su-field .qnr-su-icon {
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  color: #6B7B7A;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.qnr-su-field .qnr-su-input:focus ~ .qnr-su-icon {
  color: #047857;
}

/* Eye toggle (sağ) */
.qnr-su-field .qnr-su-eye {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: none;
  background: transparent;
  color: #6B7B7A;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background 200ms ease, color 200ms ease;
}
.qnr-su-field .qnr-su-eye:hover {
  background: #D1FAE5;
  color: #047857;
}

/* Field error */
.qnr-su-fielderr {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 6px;
  color: #DC2626;
  font-size: 12px;
  font-weight: 500;
}

/* Terms — tek satır */
.qnr-su-terms {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 6px 0 4px;
  cursor: pointer;
  user-select: none;
  font-size: 13px;
  color: #042F2E;
  line-height: 1.5;
}
.qnr-su-terms input { display: none; }
.qnr-su-checkbox {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1.5px solid #D8DDDC;
  background: #fff;
  display: grid;
  place-items: center;
  transition: all 200ms ease;
  margin-top: 1px;
}
.qnr-su-check-icon {
  color: #fff;
  opacity: 0;
  transition: opacity 200ms ease;
}
.qnr-su-terms input:checked + .qnr-su-checkbox {
  background: #047857;
  border-color: #047857;
}
.qnr-su-terms input:checked + .qnr-su-checkbox .qnr-su-check-icon {
  opacity: 1;
}
.qnr-su-terms-txt { flex: 1; }
.qnr-su-link {
  color: #d4af37;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dashed rgba(212,175,55,0.4);
  transition: border-color 180ms ease;
}
.qnr-su-link:hover {
  border-bottom-color: #d4af37;
}

.qnr-su-terms-err {
  display: none;
  align-items: center;
  gap: 6px;
  color: #DC2626;
  font-size: 12px;
}

.qnr-su-toperr {
  display: none;
  background: rgba(220,38,38,0.08);
  border: 1px solid rgba(220,38,38,0.20);
  border-radius: 12px;
  padding: 12px 14px;
  color: #DC2626;
  font-size: 13px;
}

/* Submit button */
.qnr-su-submit {
  width: 100%;
  height: 56px;
  border: none;
  border-radius: 14px;
  background: linear-gradient(135deg, #047857, #10B981);
  color: #fff;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0.01em;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 10px;
  position: relative;
  overflow: hidden;
  transition: filter 200ms ease, transform 100ms ease;
  box-shadow: 0 8px 24px rgba(4,120,87,0.28), inset 0 1px 0 rgba(255,255,255,0.2);
}
.qnr-su-submit::after {
  content: "";
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(212,175,55,0.4), transparent);
  transition: left 700ms ease;
  pointer-events: none;
}
.qnr-su-submit:hover { filter: brightness(1.05); }
.qnr-su-submit:hover::after { left: 110%; }
.qnr-su-submit:active { transform: scale(0.98); }
.qnr-su-submit:disabled { opacity: 0.7; cursor: not-allowed; }

/* Divider VEYA */
.qnr-su-divider {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 22px 0 18px;
}
.qnr-su-divider-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, #D8DDDC, transparent);
}
.qnr-su-divider-txt {
  font-size: 12px;
  color: #6B7B7A;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-weight: 600;
}

/* Sosyal butonlar — 3'lü grid (Image 2) */
.qnr-su-social-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
}
.qnr-su-social {
  height: 52px;
  border: 1.5px solid #D8DDDC;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: border-color 200ms ease, background 200ms ease, transform 100ms ease;
  padding: 0;
}
.qnr-su-social:hover {
  border-color: #6EE7B7;
  background: #F0FDF4;
}
.qnr-su-social:active { transform: scale(0.98); }
.qnr-su-social svg { display: block; }

/* Bottom — Zaten hesabın var? Giriş Yap */
.qnr-su-bottom {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(4,47,46,0.06);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.qnr-su-bottom-txt {
  font-size: 13px;
  color: #6B7B7A;
}
.qnr-su-bottom-btn {
  height: 44px;
  padding: 0 24px;
  border: 1.5px solid #047857;
  border-radius: 12px;
  background: transparent;
  color: #047857;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background 200ms ease, color 200ms ease;
}
.qnr-su-bottom-btn:hover {
  background: #047857;
  color: #fff;
}

/* Mobil tweak */
@media (max-width: 480px) {
  .qnr-su-card {
    padding: 24px 20px 20px;
    border-radius: 20px;
    box-shadow: none;
  }
  .qnr-su-title {
    font-size: 24px;
  }
  .qnr-su-row {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .qnr-su-bottom {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .qnr-su-bottom-btn {
    width: 100%;
  }
}

/* RTL (Arapça) */
[dir="rtl"] .qnr-su-field .qnr-su-input {
  padding: 22px 48px 8px 16px !important;
}
[dir="rtl"] .qnr-su-field .qnr-su-label {
  left: auto;
  right: 48px;
}
[dir="rtl"] .qnr-su-field .qnr-su-icon {
  left: auto;
  right: 18px;
}
[dir="rtl"] .qnr-su-field .qnr-su-eye {
  right: auto;
  left: 12px;
}

/* =====================================================================
   S236 v3.1 — Gölge fix + logo link + logo render kalitesi
   ===================================================================== */

/* 1) Form-side ::before pseudo-element radial gradient gölgesini KAPAT */
#qnr-auth-root .qnr-form-side::before,
#qnr-auth-root::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

/* 2) Sayfa background tek tip kalsın, blur veya gradient yok */
.qnr-static-brand,
.qnr-page-grid {
  background-color: transparent;
}

/* 3) Logo link davranışı + cursor */
.qnr-brand-logo--link {
  text-decoration: none;
  color: inherit;
  display: flex;
  align-items: center;
  gap: 14px;
  transition: opacity 200ms ease, transform 200ms ease;
  cursor: pointer;
}
.qnr-brand-logo--link:hover {
  opacity: 0.92;
  transform: translateY(-1px);
}
.qnr-brand-logo--link:focus-visible {
  outline: 2px solid #d4af37;
  outline-offset: 4px;
  border-radius: 12px;
}

/* 4) Logo image — keskin render (anti-blur) */
/* S236 v3.3: eski v3.1 logo bloğu (transparent/padding:0) kaldırıldı, yenisi alta tanımlı */

/* =====================================================================
   S236 v3.2 — Mobil köşe gölgesi nükleer fix + kare logo
   ===================================================================== */

/* Mobile/tablet'te statik brand-side ve TÜM child'larını fiziksel olarak yok et */
@media (max-width: 1023px) {
  .qnr-static-brand,
  .qnr-static-brand *,
  .qnr-static-brand *::before,
  .qnr-static-brand *::after,
  .qnr-static-brand::before,
  .qnr-static-brand::after {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: none !important;
  }

  /* Body, html, qnr-auth-shell, qnr-page-grid mutlaka düz krem zemin */
  html, body, body.qnr-auth-page,
  .qnr-auth-shell, .qnr-page-grid,
  .qnr-auth-shell::before, .qnr-auth-shell::after,
  .qnr-page-grid::before, .qnr-page-grid::after {
    background: #FFFFFF !important;
    background-image: none !important;
    background-color: #FFFFFF !important;
    border-radius: 0 !important;
    clip-path: none !important;
    box-shadow: none !important;
  }

  /* Bundle iç qnr-auth div'i ve form-side de düz */
  #qnr-auth-root,
  #qnr-auth-root > .qnr-auth,
  #qnr-auth-root .qnr-form-side {
    background: #FFFFFF !important;
    background-image: none !important;
    background-color: #FFFFFF !important;
  }

  /* form-side ::before pseudo (gradient gölge) iyice kapatma */
  #qnr-auth-root .qnr-form-side::before,
  #qnr-auth-root .qnr-form-side::after {
    display: none !important;
    content: none !important;
    background: none !important;
  }
}

/* Logo image — yeni kare aspect (1:1) */
.qnr-brand-logo__img {
  width: 44px !important;
  height: 44px !important;
  aspect-ratio: 1 / 1;
  object-fit: contain !important;
  background: #fff !important;
  padding: 4px !important;
  border-radius: 12px !important;
  box-sizing: border-box;
  /* Keskin render */
  image-rendering: -webkit-optimize-contrast;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .qnr-brand-logo__img { image-rendering: auto; }
}

/* Mobil safe-area iPhone notch için */
@supports (padding: env(safe-area-inset-top)) {
  body.qnr-auth-page {
    padding-top: env(safe-area-inset-top, 0);
    padding-bottom: env(safe-area-inset-bottom, 0);
    background: #FFFFFF !important;
  }
}

/* =====================================================================
   S236 v3.4 — Footer gizleme + pill <a> styling
   ===================================================================== */

/* qnr-form-footer (vanilla bundle'ın render ettiği "Yardım merkezi · Gizlilik" bandı) — KAPALI */
#qnr-auth-root .qnr-form-footer,
#qnr-auth-root footer.qnr-form-footer,
.qnr-form-footer {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Dil pill <a> link styling — button ile aynı görünüm */
.qnr-lang-pill__opt {
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.qnr-lang-pill__opt:hover {
  background: rgba(255, 255, 255, 0.18) !important;
  color: rgba(255, 255, 255, 0.95) !important;
}
.qnr-lang-pill__opt:focus-visible {
  outline: 2px solid #d4af37;
  outline-offset: 2px;
}
.qnr-lang-pill__opt.is-active:hover {
  background: #fff !important;
  color: #042F2E !important;
}

/* =====================================================================
   S236 v3.5 — Form-side BEYAZ (Patron'un işaretlediği gri zemin kalkar)
   ===================================================================== */

/* :root paper rengi tamamen beyaz */
:root {
  --qnr-paper: #FFFFFF !important;
}

/* Form-side, sayfa, body, html — TAMAMI BEYAZ */
html, body,
body.qnr-auth-page,
.qnr-auth-shell,
.qnr-page-grid,
#qnr-auth-root,
#qnr-auth-root > .qnr-auth,
#qnr-auth-root .qnr-form-side,
.qnr-form-side {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
}

/* Mobil de aynı */
@media (max-width: 1023px) {
  html, body, .qnr-auth-shell, .qnr-page-grid,
  #qnr-auth-root, #qnr-auth-root > .qnr-auth,
  #qnr-auth-root .qnr-form-side, .qnr-form-side {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
  }
}

/* form-side ::before/::after pseudo'lar (gradient gölge varsa) — tam kapalı */
.qnr-form-side::before,
.qnr-form-side::after,
#qnr-auth-root .qnr-form-side::before,
#qnr-auth-root .qnr-form-side::after {
  display: none !important;
  content: none !important;
  background: none !important;
}

/* iPhone notch safe area beyaz */
@supports (padding: env(safe-area-inset-top)) {
  body.qnr-auth-page {
    background: #FFFFFF !important;
  }
}

/* =====================================================================
   S236 v3.7 — KART SHADOW KALICI KAPAT (Patron console testi onaylı)
   Sebep: auth-bundle.css .qnr-form-card { box-shadow: 0 8px 32px ... }
   32px blur halo gri zemin algısı yaratıyordu.
   ===================================================================== */
.qnr-form-card,
.qnr-card,
.qnr-su-card,
[class*="qnr-form-card"],
[class*="qnr-card"],
#qnr-auth-root .qnr-form-card,
#qnr-auth-root .qnr-card,
#qnr-auth-root .qnr-su-card {
  box-shadow: none !important;
}

/* =====================================================================
   S236 v3.8 — Sign In kartı (qnr-form-card) Sign Up kartı gibi border'lı
   Patron istek: kart etrafında belirgin yuvarlak çerçeve
   ===================================================================== */
.qnr-form-card,
#qnr-auth-root .qnr-form-card {
  border: 1px solid rgba(4, 47, 46, 0.08) !important;
  border-radius: 24px !important;
}

/* qnr-su-card (Sign Up) zaten qnr-card sınıfı üzerinden border alıyor — emniyet için açıkça da yazalım */
.qnr-su-card,
#qnr-auth-root .qnr-su-card,
.qnr-card.qnr-su-card {
  border: 1px solid rgba(4, 47, 46, 0.08) !important;
  border-radius: 24px !important;
}

/* Mobil için de aynı border korunsun */
@media (max-width: 480px) {
  .qnr-form-card,
  .qnr-su-card,
  #qnr-auth-root .qnr-form-card,
  #qnr-auth-root .qnr-su-card {
    border: 1px solid rgba(4, 47, 46, 0.08) !important;
    border-radius: 20px !important;
  }
}

/* =====================================================================
   S236 v3.9 — Mobil dil pill (premium bayraklı) + smooth scroll
   ===================================================================== */

/* Mobil dil pill — masaüstünde gizli (brand-side'da büyüğü var) */
.qnr-mobile-lang {
  display: none;
}

@media (max-width: 1023px) {
  .qnr-mobile-lang {
    position: sticky;
    top: 16px;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: fit-content;
    margin: 16px auto 0;
    padding: 5px;
    background: #FFFFFF;
    border: 1px solid rgba(4, 47, 46, 0.08);
    border-radius: 999px;
    box-shadow: 0 2px 12px rgba(4, 47, 46, 0.05);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  .qnr-mobile-lang__opt {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px;
    border-radius: 999px;
    text-decoration: none !important;
    color: #6B7B7A;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.4px;
    transition: background 200ms ease, color 200ms ease, transform 200ms ease;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
  }

  .qnr-mobile-lang__opt:hover {
    background: rgba(4, 47, 46, 0.04);
    color: #042F2E;
  }

  .qnr-mobile-lang__opt:active {
    transform: scale(0.96);
  }

  .qnr-mobile-lang__opt.is-active {
    background: linear-gradient(135deg, #042F2E 0%, #064E3B 100%);
    color: #FFFFFF;
    box-shadow: 0 2px 8px rgba(4, 47, 46, 0.18);
  }

  .qnr-mobile-lang__opt.is-active:hover {
    color: #FFFFFF;
  }

  .qnr-mobile-lang__flag {
    width: 18px;
    height: 13.5px;
    border-radius: 2.5px;
    overflow: hidden;
    display: inline-block;
    flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.06);
  }

  .qnr-mobile-lang__flag svg {
    width: 100%;
    height: 100%;
    display: block;
  }

  /* AR kalın bayrak — yazı sığabilsin */
  .qnr-mobile-lang__opt[data-lang="ar"] .qnr-mobile-lang__flag svg text {
    font-size: 4px;
  }
}

/* Smooth scroll — mobilde momentum + iOS native feel */
html, body, body.qnr-auth-page {
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

body.qnr-auth-page {
  overscroll-behavior-y: contain;
}

@media (max-width: 1023px) {
  /* Form-side mobilde scroll alanı */
  #qnr-auth-root .qnr-form-side,
  .qnr-form-side {
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain;
    scroll-behavior: smooth;
  }

  /* Sayfa-level scroll iyileştirme */
  html, body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Mobilde kart üst boşluğu — sticky pill için yer */
  #qnr-auth-root .qnr-form-side {
    padding-top: 8px !important;
  }
}

/* Touch hedef alanları min 44x44 (Apple HIG) */
@media (max-width: 1023px) {
  .qnr-mobile-lang__opt {
    min-height: 36px;
  }
}

/* =====================================================================
   S236 v3.10 — Mobil dil dropdown FAB (kompakt, açılır kapanır)
   Patron: kart başlığı sağında küçük buton, animasyonlu dropdown
   ===================================================================== */

/* Eski sticky pill artık DOM'da yok ama CSS'te kalsın diye gizle */
.qnr-mobile-lang { display: none !important; }

/* Yeni floating dropdown — masaüstünde gizli */
.qnr-mlf { display: none; }

@media (max-width: 1023px) {
  .qnr-mlf {
    display: block;
    position: fixed;
    top: calc(env(safe-area-inset-top, 0px) + 14px);
    right: 14px;
    z-index: 200;
  }

  /* Trigger — sade kompakt buton */
  .qnr-mlf__trigger {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    background: #FFFFFF;
    border: 1px solid rgba(4, 47, 46, 0.10);
    border-radius: 999px;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(4, 47, 46, 0.06);
    transition: transform 150ms ease, box-shadow 200ms ease, border-color 200ms ease;
    -webkit-tap-highlight-color: transparent;
    font: inherit;
    line-height: 1;
  }
  .qnr-mlf__trigger:hover {
    border-color: rgba(4, 47, 46, 0.18);
  }
  .qnr-mlf__trigger:active {
    transform: scale(0.96);
  }
  .qnr-mlf.is-open .qnr-mlf__trigger {
    border-color: rgba(4, 47, 46, 0.18);
    box-shadow: 0 4px 14px rgba(4, 47, 46, 0.10);
  }

  .qnr-mlf__current-flag {
    width: 22px;
    height: 16px;
    border-radius: 3px;
    overflow: hidden;
    display: inline-block;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06);
    flex-shrink: 0;
  }
  .qnr-mlf__current-flag svg {
    width: 100%; height: 100%; display: block;
  }

  .qnr-mlf__caret {
    color: #6B7B7A;
    display: inline-flex;
    align-items: center;
    transition: transform 220ms cubic-bezier(0.34, 1.4, 0.6, 1);
  }
  .qnr-mlf.is-open .qnr-mlf__caret {
    transform: rotate(180deg);
  }

  /* Dropdown menü — flat, premium */
  .qnr-mlf__menu {
    list-style: none;
    margin: 8px 0 0;
    padding: 6px;
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 180px;
    background: #FFFFFF;
    border: 1px solid rgba(4, 47, 46, 0.10);
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(4, 47, 46, 0.12), 0 2px 8px rgba(4, 47, 46, 0.06);
    opacity: 0;
    transform: translateY(-6px) scale(0.96);
    transform-origin: top right;
    pointer-events: none;
    transition: opacity 200ms ease, transform 220ms cubic-bezier(0.34, 1.4, 0.6, 1);
  }
  .qnr-mlf.is-open .qnr-mlf__menu {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
  }

  .qnr-mlf__menu li {
    margin: 0;
    padding: 0;
  }

  .qnr-mlf__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    color: #042F2E;
    text-decoration: none !important;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    transition: background 160ms ease;
    -webkit-tap-highlight-color: transparent;
  }
  .qnr-mlf__item:hover {
    background: rgba(4, 47, 46, 0.04);
  }
  .qnr-mlf__item:active {
    background: rgba(4, 47, 46, 0.07);
  }
  .qnr-mlf__item.is-active {
    background: rgba(4, 47, 46, 0.06);
    font-weight: 600;
  }

  .qnr-mlf__item-flag {
    width: 22px;
    height: 16px;
    border-radius: 3px;
    overflow: hidden;
    display: inline-block;
    flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06);
  }
  .qnr-mlf__item-flag svg {
    width: 100%; height: 100%; display: block;
  }

  .qnr-mlf__item-name {
    flex: 1;
  }

  .qnr-mlf__check {
    color: #047857;
    display: inline-flex;
    align-items: center;
  }
}

/* =====================================================================
   S236 v3.12 — FAB sadece fixed (DOM taşıma kaldırıldı) + scroll fix
   ===================================================================== */

@media (max-width: 1023px) {

  /* SCROLL FIX — sayfa altına rahat erişim */
  html, body {
    height: auto !important;
    min-height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.qnr-auth-page {
    height: auto !important;
    min-height: 100vh;
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 24px);
  }

  .qnr-auth-shell {
    height: auto !important;
    min-height: 100vh;
    overflow: visible !important;
  }

  .qnr-auth.qnr-page-grid,
  #qnr-auth-root,
  #qnr-auth-root > .qnr-auth {
    height: auto !important;
    min-height: 100vh;
    overflow: visible !important;
  }

  /* Form-side scroll — kart yüksekliğine göre uzasın */
  #qnr-auth-root .qnr-form-side,
  .qnr-form-side {
    height: auto !important;
    min-height: 100vh;
    overflow: visible !important;
    -webkit-overflow-scrolling: touch !important;
    padding-top: 24px !important;
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 32px) !important;
    justify-content: flex-start !important; /* center yerine flex-start, scroll edilebilir */
  }

  /* Kartın kendisi mobilde tam scroll edilir */
  .qnr-form-card, .qnr-su-card, .qnr-card {
    margin-top: 8px !important;
    margin-bottom: 24px !important;
  }
}

/* =====================================================================
   S236 v3.13 — FAB kart-içi pozisyon (qnr-mlf--in-card class olduğunda)
   ===================================================================== */
@media (max-width: 1023px) {
  /* Kart relative — FAB için anchor */
  .qnr-form-card, .qnr-su-card, .qnr-card,
  #qnr-auth-root .qnr-form-card,
  #qnr-auth-root .qnr-su-card,
  #qnr-auth-root .qnr-card {
    position: relative !important;
  }

  /* FAB kart-içine taşındığında absolute pozisyon (kart-içi sağ-üst) */
  .qnr-mlf.qnr-mlf--in-card {
    position: absolute !important;
    top: 16px;
    right: 16px;
    z-index: 10;
  }
}

/* =====================================================================
   S236 v3.14 — SADELEŞTİRME: FAB kart-içi pozisyon kuralları KALDIRILDI
   FAB her zaman fixed sağ üst köşede (her iki sayfada AYNI yerde)
   ===================================================================== */
@media (max-width: 1023px) {
  /* qnr-mlf--in-card class'ı eski JS'ten kalmış olabilir — etki etmesin */
  .qnr-mlf,
  .qnr-mlf.qnr-mlf--in-card {
    position: fixed !important;
    top: calc(env(safe-area-inset-top, 0px) + 14px) !important;
    right: 14px !important;
    z-index: 200 !important;
  }
}