/* =====================================================================
   RESPONSIVE FOUNDATION — 2026-08-06 (feat/responsive-architecture)
   Sistemsel yapı katmanı. base.html + tüm layout kabuklarında BİR KEZ yüklenir.
   Amaç: sayfa dosyalarındaki ad-hoc padding / max-width / overflow yamalarını
   ortak, öngörülebilir kurallarla değiştirmek.
   Rapor: docs/responsive-audit.md  (KN-1 container, KN-2 spacing, KN-3 min-width:0)

   ADIM 1 kapsamı: box-sizing, min-width:0 guard, overflow-wrap, dvh, safe-area,
   ve Container/PageShell'in (ADIM 2) tüketeceği gutter DESIGN TOKEN'ları.
   Burada sayfa-özel kural YOKTUR; yalnız global sistem.
   ===================================================================== */

/* ---- 1) box-sizing her yerde (standalone sayfalar Bootstrap yüklemese de) ---- */
*, *::before, *::after { box-sizing: border-box; }

/* ---- 2) DESIGN TOKENS — tek gutter/max-width ölçeği (KN-1/KN-2) ----
   Sayfalar bir daha ham px yazmayacak; Container bu token'ları kullanacak. */
:root {
  /* responsive gutter: mobil 16 → sm 24 → lg 32 */
  --tm-gutter: 1rem;
  --tm-container-max: 1280px;

  /* dvh (mobil adres-çubuğu-güvenli tam yükseklik) */
  --tm-vh-full: 100vh;

  /* çentik / safe-area insets */
  --tm-safe-top: env(safe-area-inset-top, 0px);
  --tm-safe-right: env(safe-area-inset-right, 0px);
  --tm-safe-bottom: env(safe-area-inset-bottom, 0px);
  --tm-safe-left: env(safe-area-inset-left, 0px);
}
@media (min-width: 640px)  { :root { --tm-gutter: 1.5rem; } }
@media (min-width: 1024px) { :root { --tm-gutter: 2rem; } }
@supports (height: 100dvh)  { :root { --tm-vh-full: 100dvh; } }

/* ---- 3) min-width:0 GUARD (KN-3) ----
   Flex/grid çocukları varsayılan min-width:auto ile içerik-genişliğinde kalır;
   uzun kırılmayan metin (TL, e-posta, barkod, URL) hücreyi viewport'tan taşırır.
   Bootstrap grid + yaygın flex/grid container'larının doğrudan çocuklarında sıfırla.
   Düşük-specificity → sayfa niyetli genişliklerini bozmaz, yalnız taşma kilidini açar. */
:where(.row > *, [class*="col-"], .d-flex > *, .tm-flex > *, .tm-grid > *) { min-width: 0; }

/* ---- 4) overflow-wrap guard'ı ---- */
.tm-wrap { overflow-wrap: anywhere; word-break: break-word; }

/* ---- 5) dvh + safe-area UTILITY'leri (sayfalar 100vh yerine bunları kullanır) ---- */
.tm-minh-screen { min-height: var(--tm-vh-full); }
.tm-h-screen    { height: var(--tm-vh-full); }
.tm-safe-x {
  padding-left:  max(var(--tm-gutter), var(--tm-safe-left));
  padding-right: max(var(--tm-gutter), var(--tm-safe-right));
}
.tm-safe-b { padding-bottom: max(0px, var(--tm-safe-bottom)); }
.tm-safe-t { padding-top: max(0px, var(--tm-safe-top)); }