/*!
 * HIZLI ISLEMLER — mobil ekran (2026-09-26)
 *
 * ⚠️ MOBIL ONCELIKLI yazildi; masaustunde sayfa ORTALANIR (dosya sonu).
 * ⚠️ iOS: baslik ust guvenli alani, liste alt guvenli alani + alt menu
 *    yuksekligini hesaba katar; aksi halde icerik centik/home cubugunun
 *    altinda kalir.
 * ⚠️ Dokunma hedefi: kartlar >=44px (Apple HIG / WCAG 2.2).
 */

.qa-ekran {
  min-height: 100vh;
  background: #f1f5f9;
}

/* ── Baslik seridi ── */
.qa-baslik {
  background: var(--theme-primary, #2563eb);
  color: #fff;
  /* ⚠️ iOS centik: ust guvenli alan kadar EK dolgu (viewport-fit=cover ile calisir) */
  padding: calc(18px + env(safe-area-inset-top, 0px)) 20px 22px;
}
.qa-baslik h1 {
  margin: 0;
  font-family: var(--head, 'Inter', system-ui, sans-serif);
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.15;
}

/* ── Kart listesi ── */
.qa-liste {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px;
  /* ⚠️ Alt menu (60px) + iOS home cubugu kadar bosluk — son kart gizlenmesin */
  padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
}

.qa-kart {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 44px;                 /* dokunma hedefi */
  padding: 18px 18px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(15, 32, 68, .06);
  text-decoration: none;
  color: inherit;
  /* ⚠️ iOS'ta dokununca mavi flas olmasin */
  -webkit-tap-highlight-color: transparent;
}
.qa-kart:active {
  background: #f8fafc;
  transform: scale(.995);
}

.qa-kart-metin { min-width: 0; }    /* uzun metin tasmasin */

.qa-kart-baslik {
  font-family: var(--head, 'Inter', system-ui, sans-serif);
  font-size: 19px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -.01em;
  margin-bottom: 4px;
}
.qa-kart-aciklama {
  font-size: 14.5px;
  line-height: 1.5;
  color: #64748b;                   /* beyazda 4.76:1 — WCAG AA */
}

/* ── Ikon dairesi ── */
.qa-kart-ikon {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--qa-renk, #2563eb);
  background: #eef2f7;                                   /* yedek */
  background: color-mix(in srgb, var(--qa-renk, #2563eb) 12%, #fff);
}
.qa-kart-ikon svg { width: 26px; height: 26px; }

/* ── Hareket tercihi ── */
@media (prefers-reduced-motion: no-preference) {
  .qa-kart { transition: background .15s ease, transform .12s ease; }
}

/* ── Dar ekran (<=360px) ── */
@media (max-width: 360px) {
  .qa-baslik h1 { font-size: 26px; }
  .qa-kart { padding: 16px 14px; gap: 10px; }
  .qa-kart-baslik { font-size: 17px; }
  .qa-kart-aciklama { font-size: 13.5px; }
  .qa-kart-ikon { width: 48px; height: 48px; }
  .qa-kart-ikon svg { width: 22px; height: 22px; }
}

/* ── Masaustu: ekran MOBIL icin tasarlandi; burada yalniz ORTALANIR ──
   ⚠️ Alt menudeki giris zaten mobile-only; bu blok sayfa masaustunde
      dogrudan acilirsa bozuk gorunmesin diye var. */
@media (min-width: 768px) {
  .qa-ekran { background: #f8fafc; }
  .qa-baslik { padding: 28px 24px; text-align: center; }
  .qa-liste {
    max-width: 640px;
    margin: 0 auto;
    padding: 24px 24px 48px;
  }
}

/* ── Uygulama hissi: bu ekranda MOBILDE pazarlama footer'i gizlenir ──
   ⚠️ Referans tasarim bir UYGULAMA ekrani; kartlarin altina devasa site
      footer'inin gelmesi o hissi bozuyordu. Yalniz BU sayfada ve yalniz
      mobilde gizlenir; MASAUSTUNDE footer DURUR.
   ⚠️ `:has()` desteklemeyen eski tarayicida footer gorunur (zararsiz yedek).
   ⚠️ Yasal baglantilar kaybolmaz: KVKK/Cerez/Iptal-Iade digerleri ana
      sayfadan ve 'Iptal ve Iade' kartindan erisilebilir. */
@media (max-width: 767px) {
  body:has(.qa-ekran) > footer { display: none; }
}
