/* =========================================================================
   Saha Haritası — arayüz
   iOS sistem dili: SF yazı ailesi, sistem renkleri, gruplu listeler, çizgi simgeler.
   ========================================================================= */
*{ margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
:root{
  --zemin:#F2F2F7; --kart:#FFFFFF; --kart2:#F2F2F7; --cubuk:rgba(249,249,249,.94);
  --metin:#000000; --ikincil:rgba(60,60,67,.60); --ucuncul:rgba(60,60,67,.30);
  --ayrac:rgba(60,60,67,.18); --dolgu:rgba(118,118,128,.12); --dolgu2:rgba(118,118,128,.20);
  --mavi:#007AFF; --yesil:#34C759; --kirmizi:#FF3B30; --turuncu:#FF9500; --gri:#8E8E93;
  --maviA:rgba(0,122,255,.12); --yesilA:rgba(52,199,89,.14); --turuncuA:rgba(255,149,0,.14);
  --golge:0 2px 12px rgba(0,0,0,.14);
  --alt:calc(50px + env(safe-area-inset-bottom));
  --pdfEn:min(50vw, 640px);
}
@media (prefers-color-scheme: dark){
  :root{
    --zemin:#000000; --kart:#1C1C1E; --kart2:#2C2C2E; --cubuk:rgba(22,22,24,.92);
    --metin:#FFFFFF; --ikincil:rgba(235,235,245,.60); --ucuncul:rgba(235,235,245,.30);
    --ayrac:rgba(84,84,88,.60); --dolgu:rgba(118,118,128,.24); --dolgu2:rgba(118,118,128,.32);
    --mavi:#0A84FF; --yesil:#30D158; --kirmizi:#FF453A; --turuncu:#FF9F0A;
    --maviA:rgba(10,132,255,.20); --yesilA:rgba(48,209,88,.20); --turuncuA:rgba(255,159,10,.20);
    --golge:0 2px 14px rgba(0,0,0,.5);
  }
}
html,body{ height:100%; overscroll-behavior:none; }
body{
  font-family:-apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Segoe UI", Roboto, sans-serif;
  font-size:15px; line-height:1.35; color:var(--metin); background:var(--zemin);
  display:flex; flex-direction:column; height:100vh; height:100dvh; padding-bottom:var(--alt);
  overflow:hidden; -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%;
}
button, input, select{ font:inherit; color:inherit; }
button{ -webkit-appearance:none; appearance:none; border:none; background:none; cursor:pointer;
  touch-action:manipulation; }
a{ color:var(--mavi); text-decoration:none; }
input[type=file]{ display:none; }

/* Simgeler (çizgi, 24'lük ızgara) */
.ik{ width:22px; height:22px; flex:none; display:inline-block; vertical-align:middle;
  fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ik.dolu{ fill:currentColor; }
.ik.k{ width:17px; height:17px; }
.ik.kk{ width:15px; height:15px; stroke-width:2; }

#uygulama{ flex:1; display:flex; flex-direction:column; min-height:0; }

/* ---------------- Üst çubuk ---------------- */
.bas{ flex:none; background:var(--cubuk); backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px); border-bottom:.5px solid var(--ayrac);
  padding:calc(env(safe-area-inset-top) + 8px) 16px 10px; position:relative; z-index:1000; }
.basUst{ display:flex; align-items:baseline; gap:10px; }
.bas h1{ flex:1; min-width:0; font-size:17px; font-weight:600; letter-spacing:-.4px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ilerlemeYazi{ flex:none; font-size:13px; color:var(--ikincil); font-variant-numeric:tabular-nums; }
.ilerlemeYazi b{ color:var(--metin); font-weight:600; }
.ilerleme{ height:4px; border-radius:2px; background:var(--dolgu); margin:7px 0 10px; overflow:hidden; }
.ilerleme i{ display:block; height:100%; width:0; background:var(--yesil); border-radius:2px;
  transition:width .3s ease; }
.ara{ position:relative; }
.ara .ik{ position:absolute; left:9px; top:50%; transform:translateY(-50%); color:var(--ikincil);
  width:17px; height:17px; }
.ara input{ width:100%; height:36px; border:none; border-radius:10px; background:var(--dolgu);
  padding:0 12px 0 32px; font-size:16px; -webkit-appearance:none; outline:none; }
.ara input::placeholder{ color:var(--ikincil); }

#uyariBar{ display:none; background:var(--turuncuA); color:var(--metin); padding:10px 16px;
  font-size:13px; line-height:1.45; border-bottom:.5px solid var(--ayrac); }
#uyariBar b{ display:block; }

/* ---------------- Harita ---------------- */
#harita{ flex:1; width:100%; min-height:120px; background:#E8E6E1; z-index:1; }
.leaflet-container{ font-family:inherit; }
.leaflet-control-attribution{ font-size:10px; }

.yuzenler{ position:absolute; right:12px; bottom:calc(var(--alt) + 16px); z-index:900;
  display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.yuzenGrup{ display:flex; flex-direction:column; background:var(--kart); border-radius:10px;
  box-shadow:var(--golge); overflow:hidden; }
.yuzenGrup button, .yuzen{ width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  color:var(--mavi); }
.yuzenGrup button + button{ border-top:.5px solid var(--ayrac); }
.yuzenGrup button:active, .yuzen:active{ background:var(--dolgu); }
.yuzen{ background:var(--kart); border-radius:50%; box-shadow:var(--golge); }
#dgPusula svg{ width:30px; height:30px; transition:transform .15s linear; }

/* Nokta etiketleri: sokak + dış kapı/iç kapı */
.leaflet-tooltip.etiket{ background:transparent; border:none; box-shadow:none; padding:0;
  font-size:10.5px; font-weight:600; color:#1C1C1E; white-space:nowrap; letter-spacing:-.1px;
  text-shadow:0 0 2px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff; }
.leaflet-tooltip.etiket:before{ display:none; }
.etiketGizli .leaflet-tooltip.etiket{ display:none; }

/* Anlık konum noktası */
.konumNokta span{ position:absolute; left:3px; top:3px; width:16px; height:16px; border-radius:50%;
  background:#007AFF; border:3px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.35); }
.konumNokta span:after{ content:""; position:absolute; left:50%; top:50%; width:16px; height:16px;
  margin:-8px 0 0 -8px; border-radius:50%; background:rgba(0,122,255,.35); animation:nabiz 2s ease-out infinite; }
@keyframes nabiz{ from{ transform:scale(1); opacity:.9; } to{ transform:scale(3.2); opacity:0; } }

/* ---------------- Baloncuk (hane kartı) ---------------- */
.leaflet-popup-content-wrapper{ background:var(--kart); color:var(--metin); border-radius:14px;
  box-shadow:0 10px 36px rgba(0,0,0,.22); padding:0; }
.leaflet-popup-tip{ background:var(--kart); }
.leaflet-popup-content{ margin:0; width:292px !important; font-size:15px; line-height:1.35; }
.leaflet-container a.leaflet-popup-close-button{ top:10px; right:10px; width:26px; height:26px;
  border-radius:50%; background:var(--dolgu); color:var(--ikincil); font:600 16px/26px -apple-system, sans-serif; }
.b{ padding:14px 14px 12px; }
.bBaslik{ font-size:17px; font-weight:600; letter-spacing:-.3px; padding-right:28px; }
.bAlt{ font-size:13px; color:var(--ikincil); margin-top:1px; }
.bUyari{ display:flex; gap:6px; align-items:center; font-size:12.5px; color:var(--turuncu);
  margin-top:8px; }
.bKayit{ margin-top:12px; padding-top:12px; border-top:.5px solid var(--ayrac); }
.bAd{ font-size:15px; font-weight:600; }
.bMeta{ font-size:13px; color:var(--ikincil); margin-top:2px; }
.bEylem{ display:flex; gap:8px; margin-top:10px; }
.btn{ flex:1; display:flex; align-items:center; justify-content:center; gap:6px; height:40px;
  border-radius:10px; font-size:14.5px; font-weight:600; white-space:nowrap; }
.btn:active{ opacity:.7; }
.btnMavi{ background:var(--maviA); color:var(--mavi); }
.btnYesil{ background:var(--yesil); color:#fff !important; }
.btnPasif{ background:var(--dolgu); color:var(--ikincil); font-weight:500; cursor:default; }
.bYapildi{ width:100%; margin-top:8px; display:flex; align-items:center; justify-content:center; gap:7px;
  height:40px; border-radius:10px; font-size:14.5px; font-weight:600;
  color:var(--metin); background:var(--dolgu); }
.bYapildi.tamam{ background:var(--yesilA); color:var(--yesil); }
.bHepsi{ width:100%; margin-top:10px; height:36px; border-radius:10px; font-size:14px; font-weight:600;
  color:var(--mavi); background:var(--maviA); }
.bLinkler{ display:flex; margin-top:12px; border-top:.5px solid var(--ayrac); padding-top:4px; }
.bLink{ flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; padding:8px 2px 2px;
  font-size:11.5px; font-weight:500; color:var(--mavi); }
.bLink:active{ opacity:.6; }
.bSec{ display:flex; align-items:center; gap:6px; margin:8px auto 0; font-size:13px; color:var(--ikincil); }
.bSec.secik{ color:var(--mavi); }

/* ---------------- Alt sekme çubuğu ---------------- */
.sekmeCubugu{ position:fixed; left:0; right:0; bottom:0; display:flex; background:var(--cubuk);
  backdrop-filter:saturate(180%) blur(20px); -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-top:.5px solid var(--ayrac); padding-bottom:env(safe-area-inset-bottom); z-index:1800; }
.tab{ flex:1; height:50px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; color:var(--gri); position:relative; }
.tab .ik{ width:24px; height:24px; }
.tab span{ font-size:10px; font-weight:500; letter-spacing:.1px; }
.tab.etkin{ color:var(--mavi); }
.tab .nokta{ position:absolute; top:7px; left:calc(50% + 9px); width:7px; height:7px; border-radius:50%;
  background:var(--kirmizi); display:none; }
.tab.isaretli .nokta{ display:block; }

/* ---------------- Sayfa yaprakları ---------------- */
.perdeSheet{ position:fixed; left:0; right:0; top:0; bottom:var(--alt); background:rgba(0,0,0,.25);
  z-index:1600; display:none; }
.perdeSheet.acik{ display:block; }
.panel{ position:fixed; left:0; right:0; bottom:var(--alt); max-height:78%; background:var(--zemin);
  z-index:1700; border-radius:12px 12px 0 0; box-shadow:0 -4px 30px rgba(0,0,0,.18);
  display:none; flex-direction:column; }
.panel.acik{ display:flex; animation:yukari .26s cubic-bezier(.32,.72,0,1); }
@keyframes yukari{ from{ transform:translateY(40%); opacity:.4; } }
.panel:before{ content:""; position:absolute; top:6px; left:50%; transform:translateX(-50%);
  width:36px; height:5px; border-radius:3px; background:var(--ucuncul); }
.pb{ display:flex; align-items:center; justify-content:space-between; padding:20px 16px 8px; }
.pb > span:first-child{ font-size:20px; font-weight:700; letter-spacing:-.4px; }
.pbBitti{ font-size:16px; font-weight:600; color:var(--mavi); padding:4px 0 4px 12px; }
.pi{ overflow-y:auto; padding:4px 16px 24px; -webkit-overflow-scrolling:touch; }

/* Gruplu liste (iOS inset grouped) */
.grupBas, .istBas{ font-size:13px; color:var(--ikincil); text-transform:uppercase; letter-spacing:.2px;
  padding:18px 14px 7px; }
.grupBas:first-child, .istBas:first-child{ padding-top:6px; }
.grupNot, .istNot{ font-size:13px; color:var(--ikincil); padding:7px 14px 0; line-height:1.45; }
.listeKutu, .grup{ background:var(--kart); border-radius:10px; overflow:hidden; }
.satir{ display:flex; align-items:center; gap:12px; min-height:44px; padding:10px 14px; background:var(--kart);
  cursor:pointer; position:relative; }
.satir + .satir:before{ content:""; position:absolute; top:0; left:36px; right:0; border-top:.5px solid var(--ayrac); }
.grup .satir + .satir:before{ left:14px; }
.satir:active{ background:var(--dolgu); }
.satir .no{ width:10px; height:10px; border-radius:50%; flex:none; }
.satir .bl{ flex:1; min-width:0; }
.satir .a1{ display:block; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.satir .a2{ display:block; font-size:13px; color:var(--ikincil); overflow:hidden; text-overflow:ellipsis;
  white-space:nowrap; margin-top:1px; }
.satir .uz{ font-size:13px; color:var(--ikincil); flex:none; font-variant-numeric:tabular-nums; }
.satir .pdfIkon{ flex:none; color:var(--ikincil); display:flex; padding:4px; }
.satir .sc{ flex:none; color:var(--ucuncul); display:flex; padding:4px 0 4px 4px; }
.satir.secili .sc{ color:var(--mavi); }
.satir .deger{ color:var(--ikincil); font-size:15px; text-align:right; max-width:60%;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.satir .tik{ color:var(--mavi); display:flex; }
.satir.eylem{ color:var(--mavi); justify-content:center; font-weight:500; }
.satir.eylem.tehlike{ color:var(--kirmizi); }

.secimBar{ display:flex; align-items:center; gap:8px; padding:0 16px 10px; flex-wrap:wrap; }
.secimBar .sy{ flex:1; font-size:13px; color:var(--ikincil); min-width:120px; }
.dg{ display:inline-flex; align-items:center; justify-content:center; gap:5px; height:32px; padding:0 12px;
  border-radius:16px; font-size:14px; font-weight:600; color:var(--mavi); background:var(--maviA);
  white-space:nowrap; }
.dg:disabled{ opacity:.35; }
.dg.vur{ background:var(--mavi); color:#fff; }
.dg.vurY{ background:var(--yesil); color:#fff; }
a.dg{ text-decoration:none; }
label.dg{ cursor:pointer; }

/* Bölümlü seçici */
.segment{ display:flex; background:var(--dolgu); border-radius:9px; padding:2px; }
.segment button{ flex:1; height:30px; border-radius:7px; font-size:13px; font-weight:500; }
.segment button.etkin{ background:var(--kart); font-weight:600; box-shadow:0 1px 4px rgba(0,0,0,.14); }

.mfl{ display:flex; flex-wrap:wrap; gap:8px; }
.cip{ display:inline-flex; align-items:center; gap:7px; height:32px; padding:0 12px; border-radius:16px;
  font-size:14px; background:var(--kart); cursor:pointer; }
.cip.kapali{ opacity:.4; }
.cip i, .nok{ width:9px; height:9px; border-radius:50%; display:inline-block; flex:none; }
.bosluk{ text-align:center; color:var(--ikincil); font-size:14px; padding:28px 16px; }

/* Özet */
.istKutu{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.istK{ background:var(--kart); border-radius:10px; padding:12px 12px 10px; }
.istK b{ display:block; font-size:24px; font-weight:700; letter-spacing:-.5px; font-variant-numeric:tabular-nums; }
.istK span{ font-size:12px; color:var(--ikincil); }
.istT{ width:100%; border-collapse:collapse; font-size:14px; background:var(--kart); border-radius:10px;
  overflow:hidden; }
.istT th, .istT td{ padding:10px 12px; text-align:right; border-bottom:.5px solid var(--ayrac); }
.istT tr:last-child td{ border-bottom:none; }
.istT th:first-child, .istT td:first-child{ text-align:left; }
.istT td:first-child{ display:flex; align-items:center; gap:8px; }
.istT thead th{ font-size:11.5px; font-weight:600; color:var(--ikincil); text-transform:uppercase; }
.istT .yz{ color:var(--ikincil); font-variant-numeric:tabular-nums; }
.istT tr.top td{ font-weight:600; }
.istHizli{ display:flex; flex-wrap:wrap; gap:8px; padding-top:4px; }
#tani{ font-size:12px; color:var(--ucuncul); padding:16px 16px 0; line-height:1.5; }

/* ---------------- Karşılama ---------------- */
#karsilama{ position:fixed; inset:0; z-index:4000; display:none; align-items:center; justify-content:center;
  background:var(--zemin); padding:24px; padding-top:calc(24px + env(safe-area-inset-top)); }
.kKart{ width:min(420px,100%); text-align:center; }
.kIkon{ width:84px; height:84px; border-radius:19px; margin:0 auto 18px; display:block;
  box-shadow:0 6px 20px rgba(0,0,0,.12); }
.kKart h2{ font-size:28px; font-weight:700; letter-spacing:-.6px; margin-bottom:6px; }
.kKart p{ font-size:15px; color:var(--ikincil); line-height:1.5; margin-bottom:24px; }
.kBtn{ display:block; width:100%; height:50px; line-height:50px; border-radius:12px; background:var(--mavi);
  color:#fff; font-size:17px; font-weight:600; cursor:pointer; }
.kAdim{ text-align:left; background:var(--kart); border-radius:12px; padding:14px 16px 14px 34px;
  margin-top:20px; font-size:14px; line-height:1.55; color:var(--metin); }
.kAdim li + li{ margin-top:6px; }
#anaEkranIpucu{ display:none; font-size:13px; color:var(--ikincil); margin-top:16px; line-height:1.5; }

#yukleniyor{ position:fixed; inset:0; z-index:5000; background:rgba(0,0,0,.35); display:none;
  align-items:center; justify-content:center; flex-direction:column; gap:14px; color:#fff; font-size:15px; }
#yukleniyor.acik{ display:flex; }
.donen{ width:34px; height:34px; border:3px solid rgba(255,255,255,.35); border-top-color:#fff;
  border-radius:50%; animation:don .8s linear infinite; }
@keyframes don{ to{ transform:rotate(360deg); } }

/* Bildirim */
.bildir{ position:fixed; left:50%; transform:translateX(-50%); bottom:calc(var(--alt) + 18px);
  background:rgba(40,40,42,.94); backdrop-filter:blur(20px); color:#fff; padding:10px 16px; border-radius:12px;
  font-size:14px; z-index:3000; max-width:86vw; text-align:center; box-shadow:0 6px 24px rgba(0,0,0,.25);
  animation:gir .2s ease; }
@keyframes gir{ from{ opacity:0; transform:translate(-50%, 8px); } }

/* ---------------- Belge görüntüleyici ---------------- */
.pdfPanel{ position:fixed; inset:0; z-index:2500; background:var(--zemin); display:none; flex-direction:column; }
.pdfPanel.acik{ display:flex; }
.pdfBas{ flex:none; display:flex; align-items:center; gap:8px; padding:calc(env(safe-area-inset-top) + 6px) 12px 8px;
  background:var(--cubuk); backdrop-filter:saturate(180%) blur(20px); -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:.5px solid var(--ayrac); }
.pdfKapatBtn{ flex:none; width:64px; text-align:left; font-size:17px; color:var(--mavi); padding:6px 0; }
.pdfBosluk{ flex:none; width:64px; }
.pdfBaslik{ flex:1; min-width:0; text-align:center; }
.pdfBaslik b{ display:block; font-size:16px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pdfBaslik span{ display:block; font-size:12px; color:var(--ikincil); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pdfEylem{ flex:none; display:flex; gap:8px; padding:8px 12px; overflow-x:auto; background:var(--cubuk);
  border-bottom:.5px solid var(--ayrac); }
.pdfEylem .dg{ height:34px; border-radius:17px; }
.pdfIc{ flex:1; overflow:auto; -webkit-overflow-scrolling:touch; background:#5A5A5F; padding:10px; touch-action:pan-x pan-y; }
#pdfSayfalar{ transform-origin:0 0; width:max-content; min-width:100%; }
.pdfSayfa{ display:block; background:#fff; margin:0 auto 10px; box-shadow:0 1px 8px rgba(0,0,0,.35); }
#pdfSayfalar .bosluk{ color:#fff; }
.pdfZoom{ position:absolute; right:12px; bottom:calc(14px + env(safe-area-inset-bottom)); display:flex; align-items:center;
  background:var(--kart); border-radius:10px; box-shadow:var(--golge); overflow:hidden; }
.pdfZoom button{ width:44px; height:40px; display:flex; align-items:center; justify-content:center; color:var(--mavi); }
.pdfZoom button:active{ background:var(--dolgu); }
.pdfZoom span{ font-size:13px; color:var(--ikincil); min-width:46px; text-align:center; font-variant-numeric:tabular-nums;
  border-left:.5px solid var(--ayrac); border-right:.5px solid var(--ayrac); line-height:40px; }

/* ---------------- Tablet ---------------- */
@media (min-width: 900px){
  body.pdfAcik{ padding-right:var(--pdfEn); }
  .pdfPanel{ left:auto; width:var(--pdfEn); bottom:var(--alt); border-left:.5px solid var(--ayrac); }
  .pdfZoom{ bottom:14px; }
  body.pdfAcik .yuzenler{ right:calc(var(--pdfEn) + 12px); }
  body.pdfAcik .perdeSheet{ right:var(--pdfEn); }
  .panel{ left:50%; right:auto; width:min(560px, 92vw); transform:translateX(-50%); border-radius:14px;
    bottom:calc(var(--alt) + 12px); }
  .panel.acik{ animation:none; }
  body.pdfAcik .panel{ left:calc((100vw - var(--pdfEn)) / 2); width:min(520px, calc(100vw - var(--pdfEn) - 24px)); }
}
.secimBar .sy{ flex-basis:100%; }
.istT td:first-child{ text-transform:none; }

/* Etiketteki belge işareti */
.leaflet-tooltip.etiket .etiketIk{ width:11px; height:11px; stroke-width:2.2; margin:-2px 3px 0 0; color:#007AFF; }

/* Seçenek sayfası (iOS eylem sayfası) */
.eylemPerde{ position:fixed; inset:0; z-index:6000; background:rgba(0,0,0,.32); display:flex;
  align-items:flex-end; justify-content:center; padding:10px 10px calc(10px + env(safe-area-inset-bottom)); }
.eylemKutu{ width:min(420px, 100%); display:flex; flex-direction:column; gap:8px; animation:yukari .25s cubic-bezier(.32,.72,0,1); }
.eylemGrup{ background:var(--kart); border-radius:14px; overflow:hidden; }
.eylemBaslik{ font-size:13px; color:var(--ikincil); text-align:center; padding:13px 16px; border-bottom:.5px solid var(--ayrac); }
.eylemGrup button{ width:100%; min-height:56px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  color:var(--mavi); font-size:18px; }
.eylemGrup button + button{ border-top:.5px solid var(--ayrac); }
.eylemGrup button small{ font-size:12px; color:var(--ikincil); margin-top:1px; }
.eylemGrup button:disabled{ opacity:.35; }
.eylemGrup button:active{ background:var(--dolgu); }
.eylemGrup .vazgec{ font-weight:600; }
@media (min-width:700px){ .eylemPerde{ align-items:center; } }