/*
 * Tasarım sisteminin DIŞINDAKİ ek stiller.
 *
 * app.css EYS deposundaki globals.css'in birebir kopyasıdır ve ELLE DÜZENLENMEZ;
 * ona dokunmak bir tasarım sistemi değişikliğidir. Üçüncü parti bileşenlerin
 * (leaflet) tasarım sistemine uydurulması burada yapılır.
 */

/* ---- Leaflet ---- */

/* Harita konteyneri kartın yuvarlaklığına uysun. */
.leaflet-container {
  border-radius: inherit;
  font-family: inherit;
  background: var(--surface-2);
}

/*
 * Koyu tema: raster tile'lar CSS filtresiyle koyulaştırılır.
 * Harita YENİDEN KURULMAZ — setTheme yalnızca bu sınıfı ekler/çıkarır.
 * Marker'lar var(--…) kullandığı için kendiliğinden döner, filtre dışında tutulur.
 */
.map-dark .leaflet-tile {
  filter: invert(1) hue-rotate(180deg) brightness(0.92) contrast(0.92);
}

.map-dark .leaflet-control-attribution,
.map-dark .leaflet-control-zoom a {
  background: var(--surface);
  color: var(--text-2);
}

/* divIcon varsayılan beyaz kutusunu kaldır. */
.eys-marker {
  background: transparent;
  border: none;
}

/* transport/modal.tsx'teki z-[1000] karşılığı: modal harita panellerinin üstünde. */
.leaflet-pane,
.leaflet-control {
  z-index: 400;
}

/* ---- Bildirim sayısı rozeti ----
 *
 * Menü karosunun ve yan menü satırının okunmamış sayısı. Durum paletinin
 * "no" adımı (yumuşak zemin + koyu kırmızı metin) yerine DOLU kırmızı ister:
 * rozet bir durum kodu değil, dikkat çeken bir sayaçtır. DS (02 §2.11) burada
 * amber `.badge.wait` kullanır; kırmızı sayaç mobil paritesi için korunur.
 *
 * 02.10.2026 — zemin --red-500'den --uni-red-700'e (#b91c1c) indi: beyaz sayı
 * kurumsal kırmızı üstünde ≈ 4,2:1 ile AA altındaydı, bu adımda ≈ 6,5:1.
 * --red-500 de app.css'teki "yalnız logo/marka" notuyla zaten rozete ait
 * değildi. --uni-red-700 koyu temada override edilmez (--no-fg edilir); rozet
 * her iki temada aynı kırmızıdır.
 */
.badge-count {
  background: var(--uni-red-700);
}

/* ---- Yazı tipi ölçeği: +2px ----
 *
 * Tüm ölçek bir adım (2px = .125rem) büyütülür. Tailwind v4'te
 * `.text-sm{font-size:var(--text-sm)}` biçiminde üretildiği için token'ı
 * burada ezmek yeterlidir; app.css'e (birebir kopya) dokunulmaz.
 *
 * Bu dosya katmansızdır, app.css'in `@layer theme` bloğundan sonra gelir ve
 * CSS katman sırasına göre onu ezer.
 *
 * --text-*--line-height DEĞERLERİ EZİLMEZ: Tailwind onları oransız çarpan
 * (`calc(1.25 / .875)`) olarak tutar, satır yüksekliği kendiliğinden orantılı
 * büyür. Mutlak bir değer yazmak oranı bozardı.
 *
 * 3xl ve üstü şu an kullanılmıyor; ölçeğin geri kalanıyla tutarlı kalsın diye
 * yine de tanımlıdır (kullanılmayan değişken çıktıya maliyet bindirmez).
 */
:root {
  --text-xs: 0.875rem; /* 12 → 14 */
  --text-sm: 1rem; /* 14 → 16 */
  --text-base: 1.125rem; /* 16 → 18 */
  --text-lg: 1.25rem; /* 18 → 20 */
  --text-xl: 1.375rem; /* 20 → 22 */
  --text-2xl: 1.625rem; /* 24 → 26 */
  --text-3xl: 2rem; /* 30 → 32 */
  --text-4xl: 2.375rem; /* 36 → 38 */
  --text-5xl: 3.125rem; /* 48 → 50 */
  --text-6xl: 3.875rem; /* 60 → 62 */
  --text-7xl: 4.625rem; /* 72 → 74 */
  --text-8xl: 6.125rem; /* 96 → 98 */
  --text-9xl: 8.125rem; /* 128 → 130 */
}

/* Sınıfsız metin tarayıcı varsayılanı 16px'ten miras alır; o taban da
   ölçekle aynı adımda büyütülür. `html`'e YAZILMAZ — rem tabanını kaydırmak
   boşlukları ve yarıçapları da ölçekler, bu bir yakınlaştırma olurdu.
   Tailwind preflight form öğelerine `font:inherit` verdiği için input ve
   düğmeler de bu tabanı izler. */
body {
  font-size: 1.125rem; /* 16 → 18 */
}

/* ---- Zorunlu renkler (Windows Kontrast teması) — DS 07 §7.6 ----
 *
 * `forced-colors: active` altında tarayıcı renkleri sistem paletine çevirir ve
 * gradyanlı `background-image`'ı DÜŞÜRÜR. Marka gradyanı (`bg-brand-gradient`)
 * seçim/etkinlik bildiren tek işaret olduğu yerlerde — aktif menü öğesi, seçili
 * çip, aktif sayfa numarası, birincil düğme — öğe çevresinden ayırt edilemez
 * hâle geliyordu.
 *
 * Seçim, öğenin kendi durum özniteliğinden okunur (`aria-current="page"`,
 * `aria-pressed="true"`, `aria-selected="true"`) ve sistemin seçim renkleriyle
 * (Highlight / HighlightText) dolar; `forced-color-adjust: none` bu iki rengin
 * yeniden çevrilmesini engeller. Gradyanlı yüzeyler sınır kazanır: düğmenin
 * sınırı preflight'ta 0'dır, kontrast temasında görünür bir kenarı kalmazdı.
 *
 * Blazor bool değerli `aria-*`'yı "true" değil BOŞ değerle yazar; seçiciler bu
 * yüzden metin değerine bağlıdır ve bileşenler değeri açıkça "true"/"false"
 * olarak verir.
 */
@media (forced-colors: active) {
  :is([aria-current="page"], [aria-pressed="true"], [aria-selected="true"]) {
    forced-color-adjust: none;
    background: Highlight;
    color: HighlightText;
  }

  .bg-brand-gradient {
    border: 1px solid ButtonText;
  }
}