/* ══════════════════════════════════════════════════════════════════════════
   MAGAZA CTA -- "Hemen satin al" (r99)

   Kapsam: `.k-buy*` (PDP) + `.k-arch-buy` (urun karti). Baska hicbir yuzeye
   dokunmaz.

   ⚠ AYRI DOSYA, cunku theme.css / v13-fixes.css / responsive.css su anda
     baska islerde acik; paralel yazma onlari daha once iki kez ezdi.
   ⚠ DOSYA ADINDA SURUM (`-v1`). Bu sitede `?ver=` sorgusu donen ziyaretcinin
     CSS onbellegini BUSTLAMIYOR (bkz. kavela-inquiry/src/FrontendAssets.php).
     Yeni ad = yeni adres = bayat kopya imkansiz. Icerik degisirse ad `-v2`
     olur, sorgu dizesi eklenmez.

   TEMA KILIDI -- burada uyulan kurallar:
   · Yeni renk YOK. Yalnizca mevcut token'lar: --surface-brand-quiet
     (burgundy-50), --text-brand (burgundy-600), --surface-brand, --text-inverse.
   · Yeni font/olcek YOK: --size-body-sm ve --size-caption zaten kullanimda.
   · AYIRAC CIZGISI / ALTCIZGI / BORDER ile ritim YOK. Hiyerarsi yalnizca
     TON (dolu bordo > bordo tinti > sessiz gri) ve YAKINLIK ile kuruluyor.
   · Dokunma hedefi >= 44px.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── PDP: fiyatli satin alma yolu ─────────────────────────────────────────
   Teklif akisi BIRINCIL kalir (dolu bordo `.k-btn--primary`). Bu, ikinci bir
   yol: ayni geometri, ayni yukseklik, ama DOLU degil TINTLI -- yani goz
   siralamayi tondan okuyor, cerceveden degil. */
.k-buy {
  display: inline-flex; align-items: center; justify-content: center;
  gap: var(--space-3);
  height: var(--control-h-lg); padding: 0 var(--space-8);
  white-space: nowrap; border: 0; cursor: pointer; font-family: inherit;
  border-radius: var(--radius-chip);
  font-size: var(--size-body-sm); font-weight: 500;
  background: var(--surface-brand-quiet); color: var(--text-brand);
  transition: background var(--duration-base) var(--ease-standard),
              color var(--duration-base) var(--ease-standard);
}
.k-buy:hover { background: var(--surface-brand); color: var(--text-inverse); }
.k-buy:focus-visible { outline: 2px solid var(--border-focus); outline-offset: 2px; }

/* Fiyat CTA'nin icinde yasiyor: "ne kadar" ile "ne yapayim" ayni tiklama
   hedefinde okunuyor, ayri bir fiyat satiri ritmi bozmuyor. */
.k-buy__price { font-weight: 600; }
/* Orta nokta zaten temanin kirinti yolunda kullanilan ayirac; cizgi degil. */
.k-buy__dot { opacity: .5; }

/* Alan adi degisiyor -- bunu SOYLEMEK zorundayiz. Kucuk, sessiz, tek satir. */
.k-buy-note {
  margin-top: var(--space-3);
  font-size: var(--size-caption); line-height: var(--lh-caption);
  color: var(--text-tertiary);
}

/* ── Urun karti: kucuk pill ───────────────────────────────────────────────
   ⚠ Medya UZERINE rozet KONMADI. Kartin sol ustunde `.k-arch-badge`
     ("Hemen teslim") zaten var ve bu alti urunun ALTISI DA stokta -- ikinci
     bir overlay rozeti dogrudan onun ustune binerdi. Pill bu yuzden aksiyon
     satirinda, "Teklife ekle"nin yaninda duruyor: ayni satir, iki yol. */
.k-arch-card__act {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: var(--space-3) var(--space-5);
}
.k-arch-buy {
  display: inline-flex; align-items: center;
  position: relative;
  padding: var(--space-1) var(--space-4);
  border-radius: var(--radius-pill);
  background: var(--surface-brand-quiet); color: var(--text-brand);
  font-size: var(--size-caption); line-height: 1.6; font-weight: 500;
  transition: background var(--duration-fast) var(--ease-standard),
              color var(--duration-fast) var(--ease-standard);
}
.k-arch-buy:hover { background: var(--surface-brand); color: var(--text-inverse); }
.k-arch-buy:focus-visible { outline: 2px solid var(--border-focus); outline-offset: 2px; }

/* Gorunum kucuk kalsin, ISABET ALANI 44px olsun. Tema kilidi: pill'i 44px
   yuksekliginde cizmek kart ritmini sisirirdi. Ayni teknik `.k-arch-quote`
   icin v13-fixes.css'te zaten kullaniliyor -- yeni bir desen degil.
   Sozde-eleman mutlak konumlu: akista yer kaplamaz, layout kaymaz. */
.k-arch-buy::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 50%;
  transform: translateY(-50%);
  height: 44px;
}
