/* Telefonla giriş ve kayıt — tek sütun, mobil birinci sınıf (320/360/390). Renkler CSS değişkeninden (Studio token).
   Ölçüler Codex devir belgesi v2: başlık 26/1.25, gövde ve alan 16, etiket 14, alan ve düğme 52 px, alan köşesi 12 px, düğme hap. */

.cc_g9ivjcm8_U1XHhqXh8t .spl {
  width: 100%;
  padding: 0 20px 40px;
  box-sizing: border-box;
  background: var(--spl-bg, #ffffff);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-inner {
  max-width: 440px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* --- Üst alan: logo + Alışverişe dön (sade düzen) --- */

.cc_g9ivjcm8_U1XHhqXh8t .spl-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 64px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-top-logo {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  text-decoration: none;
  color: var(--spl-btn, #08209e);
  font-weight: 700;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-top-logo img {
  display: block;
  height: 28px;
  width: auto;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-top-back {
  white-space: nowrap;
}

/* --- Kart: dış çerçeve yok, alanların çerçevesi yeterli --- */

.cc_g9ivjcm8_U1XHhqXh8t .spl-card {
  padding: 8px 0 0;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-title {
  margin: 0 0 8px;
  font-size: 26px;
  font-weight: 600;
  line-height: 1.25;
  color: var(--spl-title, #2b2a29);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-text {
  margin: 0 0 16px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--spl-text, #5a5957);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-inline-action {
  margin: -8px 0 12px;
  font-size: 14px;
}

/* Alan altındaki kısayol (profil ekranı: "Zaten hesabınız var mı?") — alanın hemen altında, yukarı çekilmez */
.cc_g9ivjcm8_U1XHhqXh8t .spl-inline-action--field {
  margin: 4px 0 0;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 14px;
  margin: 0 0 12px;
  font-size: 16px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-summary-value {
  font-weight: 500;
  color: var(--spl-title, #2b2a29);
  overflow-wrap: anywhere;
}

/* --- Form --- */

.cc_g9ivjcm8_U1XHhqXh8t .spl-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-label {
  font-size: 14px;
  font-weight: 500;
  color: var(--spl-title, #2b2a29);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-input {
  width: 100%;
  min-height: 52px;
  box-sizing: border-box;
  border: 1px solid var(--spl-border, #e8e6e3);
  border-radius: 12px;
  background: #ffffff;
  color: var(--spl-title, #2b2a29);
  font-family: inherit;
  font-size: 16px; /* iOS odakta yakınlaştırmayı önler */
  padding: 0 16px;
  outline: none;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-input::placeholder {
  color: var(--spl-text, #5a5957);
  opacity: 0.8;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-input:focus {
  border-color: var(--spl-btn, #08209e);
  box-shadow: 0 0 0 3px rgba(8, 32, 158, 0.12);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-input[aria-invalid="true"] {
  border-color: var(--spl-error, #b42318);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-input--code {
  letter-spacing: 0.24em;
  font-variant-numeric: tabular-nums;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-password {
  position: relative;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-password .spl-input {
  padding-right: 52px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-eye {
  position: absolute;
  top: 0;
  right: 0;
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  color: var(--spl-text, #5a5957);
  cursor: pointer;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--spl-text, #5a5957);
  cursor: pointer;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-check input {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  margin: 0;
  accent-color: var(--spl-btn, #08209e);
  cursor: pointer;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-check input[aria-invalid="true"] {
  outline: 2px solid var(--spl-error, #b42318);
  outline-offset: 1px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-optional {
  color: var(--spl-text, #5a5957);
  font-size: 13px;
}

/* --- Birincil düğme: düz lacivert hap --- */

.cc_g9ivjcm8_U1XHhqXh8t .spl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;
  padding: 12px 20px;
  border: none;
  border-radius: 999px;
  background: var(--spl-btn, #08209e);
  color: var(--spl-btn-text, #ffffff);
  font-family: inherit;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  cursor: pointer;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-btn:hover:not(:disabled) {
  background: var(--spl-btn-hover, #002a9a);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-btn:disabled {
  opacity: 0.7;
  cursor: default;
}

/* --- İkincil eylemler: çerçevesiz, belirgin metin bağlantıları, 44 px dokunma --- */

.cc_g9ivjcm8_U1XHhqXh8t .spl-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0 16px;
  font-size: 14px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-link {
  color: var(--spl-link, #08209e);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-link--btn {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-link--lg {
  justify-content: center;
  width: 100%;
  min-height: 48px;
  font-size: 16px;
  font-weight: 600;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-link--btn:disabled {
  opacity: 0.6;
  cursor: default;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-muted {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--spl-text, #5a5957);
  font-variant-numeric: tabular-nums;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-note, .cc_g9ivjcm8_U1XHhqXh8t .spl-kvkk {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--spl-text, #5a5957);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-kvkk {
  font-size: 13px;
  margin-top: 2px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-ok {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: #1f7a3d;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-err {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--spl-error, #b42318);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-err--server {
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(180, 35, 24, 0.06);
}

/* --- Ayraç ve alternatif yol --- */

.cc_g9ivjcm8_U1XHhqXh8t .spl-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: lowercase;
  color: var(--spl-text, #5a5957);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-divider::before, .cc_g9ivjcm8_U1XHhqXh8t .spl-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--spl-border, #e8e6e3);
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-secondary {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  text-align: center;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-secondary-hint {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--spl-text, #5a5957);
}

/* --- Alt alan: yardım satırı + KVKK --- */

.cc_g9ivjcm8_U1XHhqXh8t .spl-bottom {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--spl-border, #e8e6e3);
  text-align: center;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-bottom-help, .cc_g9ivjcm8_U1XHhqXh8t .spl-bottom-legal {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0 6px;
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--spl-text, #5a5957);
}

/* Alt alandaki bağlantılar ayrı eylem: 44 px dokunma yüksekliği; bağlantı metni asla bölünmez */
.cc_g9ivjcm8_U1XHhqXh8t .spl-bottom .spl-link--btn {
  min-height: 44px;
  padding: 0 4px;
  white-space: nowrap;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-kvkk .spl-link, .cc_g9ivjcm8_U1XHhqXh8t .spl-check .spl-link, .cc_g9ivjcm8_U1XHhqXh8t .spl-secondary-hint .spl-link {
  white-space: nowrap;
}

/* ≥768: yardım ve KVKK tek satırda, arada ince ayraç (taslaktaki alt satır) */
@media (min-width: 768px) {
  .cc_g9ivjcm8_U1XHhqXh8t .spl-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0 14px;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl-bottom-legal {
    position: relative;
    padding-left: 14px;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl-bottom-legal::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 16px;
    transform: translateY(-50%);
    background: var(--spl-border, #e8e6e3);
  }
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-bottom-legal {
  font-size: 13px;
}

/* Ortağın formu açıkken bizim kart yok; üst alan ve geri bağlantısı kalır,
   yardım/yasal satırı formun altına ayrı düğümle (.spl--after) eklenir */
.cc_g9ivjcm8_U1XHhqXh8t .spl--email {
  padding-bottom: 8px;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-secondary--back {
  align-items: flex-start;
  text-align: left;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-secondary--back .spl-link--lg {
  justify-content: flex-start;
  width: auto;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl--after {
  padding-top: 0;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-title, .cc_g9ivjcm8_U1XHhqXh8t .spl-text, .cc_g9ivjcm8_U1XHhqXh8t .spl-note, .cc_g9ivjcm8_U1XHhqXh8t .spl-secondary-hint, .cc_g9ivjcm8_U1XHhqXh8t .spl-kvkk, .cc_g9ivjcm8_U1XHhqXh8t .spl-bottom-help {
  overflow-wrap: anywhere;
}

.cc_g9ivjcm8_U1XHhqXh8t .spl-btn:focus-visible, .cc_g9ivjcm8_U1XHhqXh8t .spl-link:focus-visible, .cc_g9ivjcm8_U1XHhqXh8t .spl-eye:focus-visible {
  outline: 2px solid var(--spl-btn, #08209e);
  outline-offset: 3px;
}

/* --- Masaüstü iki sütun: solda form, sağda sabit fotoğraf (yalnız ≥1024) --- */

.cc_g9ivjcm8_U1XHhqXh8t .spl-photo {
  display: none;
}

@media (min-width: 768px) {
  .cc_g9ivjcm8_U1XHhqXh8t .spl {
    padding: 0 24px 56px;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl-top {
    min-height: 72px;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl-top-logo img {
    height: 44px;
  }
}

/* 768 kuralından SONRA gelir ve .spl.spl--split ile daha özgül: 48 px iç boşluk korunur */
@media (min-width: 1024px) {
  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split {
    width: 50%;
    max-width: 50%;
    min-height: 100vh;
    padding: 0 48px 40px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
  }

  /* 440 px'lik iç alan sütunun ortasında; üst alan, form ve alt alan aynı sol kenarda */
  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split .spl-inner {
    margin: 0 auto;
    flex: 1;
    width: 100%;
    max-width: 440px;
    justify-content: flex-start;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split .spl-top {
    min-height: 88px;
  }

  /* Form + alternatif yol TEK GRUP olarak üst alan ile alt alan arasında düşeyde ortalanır;
     aradaki boşluk normal 20 px kalır (Codex v3-r2: 139 px boşluk oluşmuştu) */
  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split .spl-card {
    margin-top: auto;
    padding-top: 0;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split .spl-secondary {
    margin-bottom: auto;
  }

  /* Alternatif yol yoksa kart tek başına ortalanır */
  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split .spl-card:last-of-type {
    margin-bottom: auto;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split .spl-bottom {
    margin-top: auto;
    text-align: left;
    justify-content: flex-start;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl--split .spl-bottom-help, .cc_g9ivjcm8_U1XHhqXh8t .spl--split .spl-bottom-legal {
    justify-content: flex-start;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl--split .spl-secondary {
    text-align: left;
    align-items: flex-start;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl--split .spl-secondary .spl-link--lg {
    justify-content: flex-start;
    width: auto;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split.spl--email, .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split.spl--after {
    min-height: 0;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl.spl--split.spl--after .spl-bottom {
    margin-top: 0;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl--split .spl-photo {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    width: 50%;
    height: 100vh;
    overflow: hidden;
    background: #cfe3f7;
    z-index: 0;
  }

  .cc_g9ivjcm8_U1XHhqXh8t .spl--split .spl-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .cc_g9ivjcm8_U1XHhqXh8t .spl-btn {
    transition: background 0.15s ease, color 0.15s ease;
  }
}
