@charset "utf-8";

/* ==========================================================================
   BestlinkPos - yasal ve destek sayfaları v2 (2026-09-30)
   Gizlilik, kullanım şartları, mesafeli satış, teslimat-iade, hesap silme,
   destek, iletişim ve 404. Ortak dosyadan (site-20260930.css) SONRA bağlanır;
   jetonlar, tipografi, düğmeler ve kabuk ortak dosyadadır, burada yeniden
   tanımlanmaz.

   ÖNBELLEK KURALI: yayına çıktıktan sonra bu dosyanın içeriği değişmez;
   değişiklik yeni adla yazılır (yasal-YYYYMMDD.css) ve HTML yeni adı gösterir.

   Bölümler:
     - Düzen ölçüleri
     - Başlık bandı
     - İki sütunlu düzen (okuma sütunu + yapışkan içindekiler)
     - İçindekiler: kenar çubuğu ve mobil açılır kutu
     - Okuma sütunu: giriş, madde başlığı çapası, kapanış kutusu
     - Kanal kartları (destek, iletişim) ve not kutusu
     - 404
     - Kullanıcı tercihleri
     - Yazdırma
   ========================================================================== */


/* --------------------------------------------------------------------------
   DÜZEN ÖLÇÜLERİ
   Okuma ölçüsü "ch" ile DEĞİL, em ile verilir: Onest'in sıfır rakamı geniş
   (0.665em), bu yüzden 65ch Onest'te ~100 harf eder. Yasal gövdenin ortalama
   harf genişliği 0.4475em (fontTools ile gizlilik metninden ölçüldü): 30em =
   satırda ~70 harf (Chrome'da 18px'te ölçüldü). Uzunluk --yazi-1'den türer
   (17-18px), öğenin kendi yazı boyutuna bağlı değildir; başlık, tablo ve
   paragraf aynı sütun kenarını paylaşır.
   -------------------------------------------------------------------------- */

.yasal {
  --yasal-olcu: calc(var(--yazi-1) * 30);                      /* 510px -> 540px */
  --yasal-yan: 15rem;                                           /* içindekiler sütunu */
  --yasal-aralik: clamp(2.5rem, -2.5rem + 7.8vw, 6rem);         /* 1024px'te 40, 1440px'te 72 */
}


/* --------------------------------------------------------------------------
   BAŞLIK BANDI
   Sayfa başlığı ve güncelleme tarihi. Tam genişlik ton bandı; sağ üstte çok
   hafif marka parlaması (logonun ışığı). Başlık okuma sütunuyla aynı kenarda.
   -------------------------------------------------------------------------- */

.yasal-bas {
  background-color: var(--zemin-2);
  background-image: radial-gradient(52rem 22rem at 92% -30%, rgb(var(--renk-ana-rgb) / .11), transparent 72%);
  border-bottom: 1px solid var(--cizgi);
}

.yasal-bas__ic {
  padding-block: clamp(2.5rem, 1.35rem + 4.6vw, 5rem) clamp(2rem, 1.6rem + 1.6vw, 3rem);
}

.yasal-bas .yasal-bas__ic > * {
  max-width: var(--yasal-olcu);
  margin-inline: auto;
}

.yasal-bas h1 {
  margin-block: 0 var(--bosluk-4);
  font-size: clamp(2rem, 1.36rem + 2.6vw, 3.25rem);             /* 32 -> 52px */
  line-height: 1.08;
  letter-spacing: -0.03em;
}

.yasal-bas__tarih {
  margin-block: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--metin-ikincil);
}

@media (prefers-color-scheme: dark) {
  .yasal-bas {
    background-image: radial-gradient(52rem 22rem at 92% -30%, rgb(var(--renk-ana-rgb) / .2), transparent 72%);
  }
}


/* --------------------------------------------------------------------------
   İKİ SÜTUNLU DÜZEN
   64rem (1024px) altında tek sütun: okuma sütunu ortalanır, içindekiler
   gövdedeki açılır kutuya iner. Üstünde: solda yapışkan içindekiler, sağda
   okuma sütunu. .tasma işaretli öğeler (tablo, kanal kartları) okuma
   ölçüsünü aşıp sütunun tamamını kullanabilir.
   -------------------------------------------------------------------------- */

.yasal-duzen {
  padding-block: clamp(2rem, 1.2rem + 3.2vw, 4rem) clamp(3.5rem, 2.4rem + 4.4vw, 6.5rem);
}

/* Ortak dosyadaki .yasal-govde genişliği tek sütun içindir; burada ızgara verir */
.yasal-duzen > .yasal-govde {
  width: auto;
  margin: 0;
  padding: 0;
}

.yasal-duzen > .yasal-govde > * {
  max-width: var(--yasal-olcu);
  margin-inline: auto;
}

.yasal-duzen > .yasal-govde > .tasma { max-width: none; }

.yasal-yan { display: none; }

@media (min-width: 64rem) {
  .yasal-bas__ic,
  .yasal-duzen {
    display: grid;
    grid-template-columns: var(--yasal-yan) minmax(0, 1fr);
    column-gap: var(--yasal-aralik);
  }

  .yasal-bas__ic > * { grid-column: 2; }
  .yasal-bas .yasal-bas__ic > *,
  .yasal-duzen > .yasal-govde > * { margin-inline: 0; }

  .yasal-bas .yasal-bas__ic > h1 { max-width: min(21ch, 100%); }

  .yasal-yan { display: block; }
  .icindekiler-acilir { display: none; }
}


/* --------------------------------------------------------------------------
   İÇİNDEKİLER
   Kenar çubuğu (masaüstü) ve açılır kutu (mobil) aynı listeyi taşır; ikisi
   aynı anda görünmez. Okunan bölüm yasal-20260930.js ile aria-current alır.
   Etkin öğe ton zeminle işaretlenir (yan şerit yok).
   -------------------------------------------------------------------------- */

.icindekiler {
  position: sticky;
  top: calc(var(--menu-y) + var(--bosluk-6));
  max-height: calc(100vh - var(--menu-y) - var(--bosluk-6) * 2);
  max-height: calc(100dvh - var(--menu-y) - var(--bosluk-6) * 2);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  padding-bottom: var(--bosluk-2);
}

.icindekiler__baslik {
  margin: 0 0 var(--bosluk-3);
  padding-inline: 0.75rem;
  font-family: var(--yazi-metin);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  color: var(--metin);
}

.icindekiler__liste {
  display: grid;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: madde;
}

.icindekiler__liste > li {
  margin: 0;
  padding: 0;
  counter-increment: madde;
}

.icindekiler__liste a {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--r-kucuk);
  color: var(--metin-ikincil);
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
  transition:
    color var(--sure-kisa) var(--egri-cikis),
    background-color var(--sure-kisa) var(--egri-cikis);
}

/* Madde numarası: eski <ol> numarasının yerini alır, bağlantının içinde */
ol.icindekiler__liste a::before {
  content: counter(madde);
  flex: 0 0 1.4em;
  text-align: end;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--metin-ucuncul);
  transition: color var(--sure-kisa) var(--egri-cikis);
}

.icindekiler__liste a:hover {
  background-color: var(--zemin-2);
  color: var(--metin);
}

.icindekiler__liste a[aria-current="true"] {
  background-color: var(--renk-ana-yumusak);
  color: var(--renk-ana-metin);
}
.icindekiler__liste a[aria-current="true"]::before { color: var(--renk-ana-metin); }

/* Mobil açılır kutu: eski satır içi içindekilerin yerinde, kapalı başlar */
.icindekiler-acilir {
  margin-block: var(--bosluk-6) var(--bosluk-7);
  background: var(--yuzey);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-yuzey);
}

.icindekiler-acilir > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bosluk-4);
  min-height: 56px;
  padding-inline: 1.15rem 1.25rem;
  border-radius: var(--r-yuzey);
  color: var(--metin);
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  -webkit-tap-highlight-color: transparent;
}
.icindekiler-acilir > summary::-webkit-details-marker { display: none; }
.icindekiler-acilir > summary::marker { content: ""; }

/* Aşağı ok: iki kenarlı kare, açılınca yukarı döner (SVG çizilmedi) */
.icindekiler-acilir > summary::after {
  content: "";
  flex: 0 0 auto;
  width: 0.5rem;
  height: 0.5rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-30%) rotate(45deg);
  transition: transform var(--sure-orta) var(--egri-cikis);
}
.icindekiler-acilir[open] > summary::after { transform: translateY(20%) rotate(-135deg); }
.icindekiler-acilir[open] > summary { border-end-start-radius: 0; border-end-end-radius: 0; }

.icindekiler-acilir > nav {
  padding: var(--bosluk-2) var(--bosluk-2) var(--bosluk-3);
  border-top: 1px solid var(--cizgi);
}

/* Gövdedeki ortak liste boşlukları (.yasal-govde ol/ul) bu listeye uygulanmaz */
.icindekiler-acilir .icindekiler__liste {
  margin: 0;
  padding: 0;
}

/* Parmak için 44px+ satır */
.icindekiler-acilir .icindekiler__liste a { padding-block: 0.75rem; }


/* --------------------------------------------------------------------------
   OKUMA SÜTUNU
   Gövde tipografisi ortak dosyada (.yasal-govde). Burada: giriş paragrafı,
   madde başlığının kendine bağlantısı, madde numarası, kapanış kutusu.
   -------------------------------------------------------------------------- */

.yasal-govde .yasal-giris {
  font-size: clamp(1.125rem, 1.07rem + 0.22vw, 1.25rem);       /* 18 -> 20px */
  line-height: 1.6;
  color: var(--metin);
}

/* Madde başlığı kendi çapasına bağlanır (paylaşılabilir bölüm bağlantısı).
   Görünüm başlıkla aynı; fareyle üzerine gelince alt çizgi belirir. */
.yasal-govde h2 > a.capa {
  color: inherit;
  font-weight: inherit;
  text-decoration: none;
  border-radius: 6px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

@media (hover: hover) and (pointer: fine) {
  .yasal-govde h2 > a.capa:hover {
    text-decoration-line: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.2em;
    text-decoration-color: rgb(var(--renk-ana-rgb) / .45);
  }
}

/* Rakamlar orantılı kalır: eşit genişlikli rakamda "1" geniş durur ("1 .") */
.madde-no { color: var(--renk-ana-metin); }

/* İçindekilerden gelinen başlık kısa bir an vurgulanır */
@keyframes yasal-hedef {
  0%, 35% { background-color: var(--renk-ana-yumusak-2); }
  100% { background-color: transparent; }
}

@media (prefers-reduced-motion: no-preference) {
  .yasal-govde h2:target > a.capa { animation: yasal-hedef 1.8s var(--egri-cikis) both; }
}

/* Dar ekranda yatay kayan tabloda kaydırma gölgesi: yalnız kayacak içerik varsa
   görünür (örtü katmanı "local", gölge katmanı "scroll"; JS yok) */
.yasal-duzen .yasal-tablo-sarmal {
  --kaydirma-golge: rgb(var(--golge-rgb) / .22);
  background:
    linear-gradient(to right, var(--yuzey) 35%, rgb(var(--golge-rgb) / 0)) left center / 2.5rem 100% no-repeat local,
    linear-gradient(to left, var(--yuzey) 35%, rgb(var(--golge-rgb) / 0)) right center / 2.5rem 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, var(--kaydirma-golge), transparent) left center / 0.9rem 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, var(--kaydirma-golge), transparent) right center / 0.9rem 100% no-repeat scroll,
    var(--yuzey);
}

@media (prefers-color-scheme: dark) {
  .yasal-duzen .yasal-tablo-sarmal { --kaydirma-golge: rgb(var(--golge-rgb) / .6); }
}

/* Kapanış: "Bu metinle ilgili sorunuz varsa" */
.yasal-kapanis {
  margin-top: var(--bosluk-8);
  padding: clamp(1.25rem, 0.95rem + 1.2vw, 2rem);
  background: var(--zemin-2);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-yuzey);
}

.yasal-govde .yasal-kapanis h2 {
  margin: 0 0 0.6em;
  font-size: var(--yazi-2);
  letter-spacing: -0.012em;
}

.yasal-govde .yasal-kapanis p:last-child { margin-bottom: 0; }


/* --------------------------------------------------------------------------
   KANAL KARTLARI (destek, iletişim)
   Kartın tamamı bağlantıdır (bağlantının ::after katmanı kartı kaplar);
   erişilebilir ad numara ya da adrestir, kart başlığı kanalı söyler.
   Değer yazısı kartın genişliğine göre ölçeklenir (cqi): e-posta adresi
   dar kartta da tek satırda kalır.
   -------------------------------------------------------------------------- */

.yasal-govde .kanallar {
  display: grid;
  gap: var(--bosluk-4);
  margin-block: var(--bosluk-5) var(--bosluk-6);
  padding: 0;
  list-style: none;
}

@media (min-width: 40rem) {
  .kanallar--iki { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
  .kanallar--uc { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kanallar--uc > .kanal--adres { grid-column: 1 / -1; }
}

.yasal-govde .kanallar > .kanal {
  position: relative;
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  gap: var(--bosluk-2);
  margin: 0;
  padding: clamp(1.25rem, 1rem + 1vw, 1.75rem);
  background: var(--yuzey);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-yuzey);
  box-shadow: var(--golge-1);
  transition:
    transform var(--sure-orta) var(--egri-cikis),
    box-shadow var(--sure-orta) var(--egri-cikis),
    border-color var(--sure-kisa) var(--egri-cikis);
}

/* Acil kanal (WhatsApp): marka tonu + logo çalışmasından WhatsApp parçası */
.yasal-govde .kanallar > .kanal--oncelik {
  background: var(--renk-ana-yumusak);
  border-color: var(--renk-ana-yumusak-2);
  box-shadow: none;
}

/* Adres: tıklanmaz, sessiz */
.yasal-govde .kanallar > .kanal--adres {
  background: transparent;
  box-shadow: none;
}

/* Görselli ve görselsiz kartta değer satırı aynı yükseklikte başlasın diye
   üst satırın yüksekliği sabit (görsel negatif boşlukla bu yüksekliğe sığar) */
.kanal__ust {
  display: flex;
  align-items: center;
  gap: var(--bosluk-3);
  min-height: 2.75rem;
}

.kanal__gorsel {
  width: 3.25rem;
  height: auto;
  margin-block: -0.35rem -0.25rem;
}

.yasal-govde .kanal__ad {
  margin: 0;
  font-family: var(--yazi-metin);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  color: var(--metin-ikincil);
}

.yasal-govde .kanal__deger {
  margin: var(--bosluk-1) 0 0;
  font-family: var(--yazi-baslik);
  font-size: clamp(1.25rem, 8.4cqi, 1.75rem);
  font-weight: 760;
  line-height: 1.2;
  letter-spacing: -0.02em;
  white-space: nowrap;
}

.yasal-govde a.kanal__baglanti {
  color: var(--metin);
  font-weight: inherit;
  text-decoration: none;
  border-radius: var(--r-kucuk);
}

/* Kartın tamamını tıklanır yapan katman */
.kanal__baglanti::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--r-yuzey);
}

.yasal-govde .kanal__not {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--metin-ikincil);
}

.kanal__adres {
  margin-top: var(--bosluk-1);
  font-size: var(--yazi-1);
  line-height: 1.55;
  color: var(--metin);
}

/* Geniş ekranda adres tek sıra: etiket solda, adres sağda */
@media (min-width: 40rem) {
  .yasal-govde .kanallar > .kanal--adres {
    flex-direction: row;
    align-items: center;
    column-gap: var(--bosluk-6);
    padding-block: var(--bosluk-4);
  }
  .kanal--adres .kanal__ust { flex: 0 0 auto; min-width: 6rem; min-height: 0; }
  .kanal--adres .kanal__adres { margin-top: 0; }
}

/* Klavye odağı kartın sınırında da görünür (bağlantının halkasına ek) */
.yasal-govde .kanallar > .kanal:has(.kanal__baglanti:focus-visible) {
  border-color: var(--odak);
}

/* Basma geri bildirimi (dokunmatik dahil) */
.yasal-govde .kanallar > .kanal:has(.kanal__baglanti):active { transform: scale(0.99); }

@media (hover: hover) and (pointer: fine) {
  .yasal-govde .kanallar > .kanal:has(.kanal__baglanti):hover {
    transform: translateY(-2px);
    border-color: var(--cizgi-guclu);
    box-shadow: var(--golge-2);
  }
  .yasal-govde .kanallar > .kanal--oncelik:hover { border-color: rgb(var(--renk-ana-rgb) / .5); }
  .yasal-govde .kanallar > .kanal:has(.kanal__baglanti):active { transform: translateY(-1px) scale(0.99); }
  .yasal-govde .kanal:hover a.kanal__baglanti { color: var(--renk-ana-metin); }
}

/* Not kutusu: dikkat edilmesi gereken tek cümle (destek: şifre göndermeyin) */
.yasal-govde .not-kutusu {
  padding: 1rem 1.25rem;
  background: var(--renk-ana-yumusak);
  border-radius: var(--r-yuzey);
  color: var(--metin);
}


/* --------------------------------------------------------------------------
   404
   Metin + marka görseli. Görsel yumuşak mavi parlama üzerinde süzülür (.suzul,
   ortak dosya). Mobilde metin ve düğmeler önce, görsel sonra.
   -------------------------------------------------------------------------- */

.bulunamadi {
  display: grid;
  align-items: center;
  overflow-x: clip;               /* görsel parlaması ekran kenarından taşıp yatay kaydırma açmasın */
  min-height: calc(100vh - var(--menu-y));
  min-height: calc(100svh - var(--menu-y));
  padding-block: clamp(3rem, 1.6rem + 5.6vw, 6.5rem);
}

.bulunamadi__ic {
  display: grid;
  gap: clamp(2.5rem, 1.5rem + 4vw, 4rem);
  align-items: center;
}

@media (min-width: 48rem) {
  .bulunamadi__ic { grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); }
}

.bulunamadi h1 {
  max-width: 14ch;
  margin-bottom: var(--bosluk-4);
}

.bulunamadi .giris { margin-bottom: var(--bosluk-6); }

.bulunamadi__gorsel {
  position: relative;
  isolation: isolate;
  justify-self: center;
  width: min(300px, 100%, 58vw);
}

.bulunamadi__gorsel::before {
  content: "";
  position: absolute;
  inset: -18% -22%;
  z-index: -1;
  background: radial-gradient(closest-side,
    rgb(var(--renk-ana-rgb) / .3),
    rgb(var(--renk-parlama-rgb) / .14) 55%,
    transparent 80%);
}

.bulunamadi__gorsel img { width: 100%; height: auto; }


/* --------------------------------------------------------------------------
   KULLANICI TERCİHLERİ
   Hareket azaltma: ortak dosya animasyon ve geçişleri kapatır; kart kalkışı da
   burada durur. Zorunlu renk: etkin içindekiler öğesi zemin rengi yerine alt
   çizgiyle ayrılır.
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  .yasal-govde .kanallar > .kanal:has(.kanal__baglanti):hover,
  .yasal-govde .kanallar > .kanal:has(.kanal__baglanti):active { transform: none; }
}

@media (forced-colors: active) {
  .icindekiler__liste a[aria-current="true"] { text-decoration: underline; }
  .icindekiler-acilir > summary::after { border-color: CanvasText; }
}


/* --------------------------------------------------------------------------
   YAZDIRMA
   Kâğıtta yalnız belge: başlık, tarih, metin. İçindekiler gizlenir, sütun tam
   genişlik olur, kutular zeminsiz çerçeveye döner. Menü, alt bar sütunları ve
   ödeme şeridi ortak dosyada gizleniyor; telif ve künye satırı kalır.
   -------------------------------------------------------------------------- */

@media print {
  @page { margin: 16mm 15mm; }

  .yasal-yan,
  .icindekiler-acilir,
  .bulunamadi__gorsel { display: none !important; }

  .yasal-bas {
    background: none;
    border-bottom: 1px solid #999999;
  }
  .yasal-bas__ic,
  .yasal-duzen {
    display: block;
    width: auto;
    padding-block: 0;
  }
  .yasal-bas__ic { padding-bottom: 10pt; }
  .yasal-duzen { padding-top: 12pt; }
  .yasal-bas .yasal-bas__ic > *,
  .yasal-duzen > .yasal-govde > * { max-width: none; margin-inline: 0; }
  .yasal-bas h1 { max-width: none; font-size: 20pt; }
  .yasal-bas__tarih { color: #222222; font-size: 10pt; }

  .yasal-govde .yasal-giris { font-size: 12pt; color: #000000; }
  .yasal-govde h2 > a.capa { color: #000000; text-decoration: none; }
  .madde-no { color: #000000; }

  .yasal-duzen .yasal-tablo-sarmal { background: none; }

  .yasal-kapanis,
  .yasal-govde .not-kutusu,
  .yasal-govde .kanallar > .kanal {
    background: none !important;
    border: 1px solid #999999;
    box-shadow: none;
    break-inside: avoid;
  }
  .kanal__ust picture { display: none; }
  .yasal-govde a.kanal__baglanti { color: #000000; }
  /* Kart katmanı kâğıtta yok; ortak dosyanın "(adres)" eki de bu bağlantıda gereksiz
     (değer zaten numara ya da adres). Ortak kuralı (0,2,2) geçmek için [href]. */
  .yasal-govde a.kanal__baglanti[href]::after { content: none; }
  .yasal-govde li::marker { color: #000000; }
}

/* Odak halkası overflow:auto kenar çubuğunda yanlardan kesiliyordu: iç boşluk halkaya yer açar. */
.icindekiler { padding-inline: 6px; margin-inline: -6px; }