/* ==========================================================================
   MOBİL / DOKUNMATİK DÜZELTMELERİ
   --------------------------------------------------------------------------
   Kaynak: _reference/mobil-denetim.mjs — 5 ekran genişliği × 10 sayfa
   (360 · 390 · 430 · 768 · 1024 px) taranarak bulunan gerçek sorunlar.

   Taramanın sonucu: yatay taşma YOK, taşan öge YOK. Kalan sorunlar
   dokunma hedefi boyutu ve bir küçük metindi; hepsi burada çözülüyor.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1) Görsel bağlantılarının tıklama alanı
   --------------------------------------------------------------------------
   .pxl-featured-link bir <img> sarıyor ama `display: inline` olduğu için
   kutusu satır yüksekliğine (27px) çöküyordu. Görselin kendisi tıklanabilir
   olsa da kutu ölçüsü yanlış, hizalama da satır taban çizgisine takılıyor.
   Blok yapmak hem tıklama alanını görselle eşitliyor hem alt boşluğu bitiriyor.
   -------------------------------------------------------------------------- */

.pxl-featured-link,
.pxl-post-featured > a {
  display: block;
}

.pxl-featured-link img {
  display: block;
  width: 100%;
  height: auto;
}

/* --------------------------------------------------------------------------
   2) Dokunma hedefi boyutu (WCAG 2.5.5 — en az 44 × 44 px)
   --------------------------------------------------------------------------
   İki koşuldan biri yeterli:
     · `pointer: coarse` → parmakla kullanılan her cihaz
     · `max-width: 1024px` → yatay tabletler; bazıları kendini "ince işaretçi"
       olarak bildirdiği için yalnızca `coarse` kuralı onları kaçırıyordu
       (denetimde kalan 9 sorunun tamamı 1024px'te çıkmıştı).

   Ölçülen sorunlar:
     · başlık/altbilgi logosu        132 × 27
     · sosyal medya ikonları         ~120 × 34
     · Kurumsal iletişim bağlantıları 199 × 30
   -------------------------------------------------------------------------- */

@media (hover: none) and (pointer: coarse), (max-width: 1024px) {
  .pxl-site-logo-link,
  .pxl-logo-dark,
  .pxl-header-logo a,
  .pxl-social-item,
  .mf-kur__buyuk-link,
  .pxl-links-item > a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  /* Altbilgi bağlantı listelerinde satırlar birbirine yapışmasın */
  .pxl-links-item > a {
    padding-block: 4px;
  }

  /* Menü öğeleri: dikeyde rahat dokunulacak yükseklik */
  .pxl-menu-primary > li > a {
    min-height: 48px;
    display: flex;
    align-items: center;
  }
}

/* --------------------------------------------------------------------------
   3) İçeriğe atlama bağlantısı
   --------------------------------------------------------------------------
   Yalnızca klavyeyle odaklanınca görünür; göründüğünde rahat tıklanmalı.
   -------------------------------------------------------------------------- */

.mf-skip-link:focus {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* --------------------------------------------------------------------------
   4) Çok küçük metin
   --------------------------------------------------------------------------
   Kurumsal sayfasındaki bölüm etiketleri 11px ölçüldü. Harf aralığı geniş
   ve büyük harf olduğu için küçük ekranda okunması zorlaşıyordu; 12px
   erişilebilirlik açısından pratik alt sınır.
   -------------------------------------------------------------------------- */

.mf-kur__etiket {
  font-size: 12px;
}

/* --------------------------------------------------------------------------
   5) Küçük ekranda yatay taşma güvenlik ağı
   --------------------------------------------------------------------------
   Tarama taşma bulmadı; bu kural ileride eklenecek geniş içeriklerin
   (tablo, kod bloğu, gömülü içerik) sayfayı yana kaydırmasını önler.
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  img,
  video,
  iframe,
  table {
    max-width: 100%;
  }

  /* Tablo ve gömülü içerik kendi içinde kaysın, sayfayı kaydırmasın */
  table {
    display: block;
    overflow-x: auto;
  }

  /* Uzun kesintisiz metinler (e-posta, URL) kutudan taşmasın */
  .mf-kur__buyuk-link,
  .pxl-links-item,
  .mf-detay__iz,
  .mf-kur__iz {
    overflow-wrap: anywhere;
  }
}