/* ════════════════════════════════════════════════════════════════════════
   PERIPLUS — PREMIUM MOBIL/TABLET KATMANI  (2026-06-29)
   Yalniz mobil/tablette yuklenir (responsive.css ile, desktop'a DOKUNMAZ).
   Tum desktop CSS'lerden SONRA yuklendigi + ID/!important kullanildigi icin
   onceki kurallari guvenle ezer. Tasarim dili: sakin harita + cam yuzeyler +
   net birincil/ikincil hiyerarsi + ferah bosluk.
   ════════════════════════════════════════════════════════════════════════ */

:root {
  --pm-ink: #0b1220;
  --pm-ink-2: #51607a;
  --pm-ink-3: #5f6e85; /* AA: 5.2:1 beyaz, 4.8:1 surface-2 (eski #5f6e85 3.0:1 idi) */
  --pm-line: rgba(15, 23, 42, 0.09);
  --pm-line-2: rgba(15, 23, 42, 0.14);
  --pm-b1: #2546A9;   /* uygulamanin GERCEK marka mavisi - DEGISTIRILMEZ */
  --pm-b2: #2546A9;
  --pm-b-soft: rgba(37, 70, 169, 0.10);
  --pm-surface: #ffffff;
  --pm-surface-2: #f5f7fa;
  --pm-glass: rgba(255, 255, 255, 0.78);
  --pm-glass-strong: rgba(255, 255, 255, 0.92);
  --pm-sh-sm: 0 1px 2px rgba(15, 23, 42, 0.06), 0 4px 12px -6px rgba(15, 23, 42, 0.14);
  --pm-sh: 0 1px 2px rgba(15, 23, 42, 0.05), 0 10px 28px -10px rgba(15, 23, 42, 0.22), 0 30px 60px -30px rgba(15, 23, 42, 0.30);
  --pm-r-sm: 12px;
  --pm-r-md: 16px;
  --pm-r-lg: 22px;
  --pm-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ── HARITA: ham OSM tonunu sakinlestir (veri/UI one ciksin) ────────────── */
#map canvas,
.ol-layer,
.leaflet-tile-pane {
  filter: saturate(0.58) contrast(1.05) brightness(1.03) !important;
}
#map, .map, .map-wrap, .leaflet-container, .ol-viewport {
  background: #e9edf2 !important;
}

/* ── UST BAR ───────────────────────────────────────────────────────────── */
header {
  /* Marka lockup'ı 28px — konteyner fonta kadar iner (kullanıcı istedi) */
  height: calc(36px + var(--safe-top, 0px)) !important;
  min-height: calc(36px + var(--safe-top, 0px)) !important;
  max-height: calc(36px + var(--safe-top, 0px)) !important;
  /* NOT: backdrop-filter ACIKCA none -> aksi halde responsive.css'in blur'u
     containing block yaratir, icindeki position:fixed .m-nav alta inemez. */
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid var(--pm-line) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
  padding-left: max(16px, var(--safe-left)) !important;
  padding-right: max(10px, var(--safe-right)) !important;
  gap: 10px !important;
}
/* Marka: SADECE kirpilmayi onleriz; RENK/TON degistirilmez (logo kendi rengiyle kalir) */
header .brand { max-width: none !important; overflow: visible !important; }
/* Telefonda da PERIPLUS alt-markasi gorunsun (ust bar bos, yer var) */
header .brand-periplus { display: block !important; }
header .brand-divider { display: block !important; }

/* Hesap rozeti: ust-sag yuvarlak avatar (mobile-nav.js header'a ekler) */
.m-account-badge {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  padding: 0 !important;
  border: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--pm-b1) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: 0 4px 12px -4px rgba(37, 70, 169, 0.6) !important;
  -webkit-tap-highlight-color: transparent !important;
  transition: transform 140ms var(--pm-ease) !important;
}
.m-account-badge:active { transform: scale(0.94) !important; }
/* Initial yoksa kisi ikonu goster */
.m-account-badge:empty::before {
  content: "" !important;
  width: 18px !important;
  height: 18px !important;
  background: #fff !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3.6'/%3E%3Cpath d='M5 19.5c0-3.6 3.2-5.5 7-5.5s7 1.9 7 5.5'/%3E%3C/svg%3E") center/contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3.6'/%3E%3Cpath d='M5 19.5c0-3.6 3.2-5.5 7-5.5s7 1.9 7 5.5'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

/* Mobil nav: tek segment grubu */
.m-nav {
  gap: 2px !important;
  background: rgba(15, 23, 42, 0.045) !important;
  border: 1px solid var(--pm-line) !important;
  border-radius: 13px !important;
  padding: 3px !important;
}
.m-trigger {
  height: 34px !important;
  padding: 0 11px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--pm-ink-2) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 10px !important;
  gap: 3px !important;
}
.m-trigger::after { opacity: 0.45 !important; font-size: 8px !important; }
.m-trigger:active {
  background: #fff !important;
  color: var(--pm-ink) !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12) !important;
  transform: scale(0.97) !important;
}

/* ── ALT BAR (telefon): kompakt, ortalanmis yuzen cam, 2 birincil eylem ──── */
#subHeader {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  bottom: max(14px, var(--safe-bottom, 0px)) !important;
  width: auto !important;
  max-width: calc(100vw - 24px) !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  background: var(--pm-glass) !important;
  -webkit-backdrop-filter: saturate(1.7) blur(20px) !important;
  backdrop-filter: saturate(1.7) blur(20px) !important;
  border: 1px solid var(--pm-line) !important;
  border-radius: 15px !important;
  box-shadow: var(--pm-sh) !important;
  padding: 5px !important;
  gap: 5px !important;
  justify-content: center !important;
}
#subHeaderFilterBtn,
#subHeaderMapQuery {
  flex: 0 0 auto !important;
  min-width: 96px !important;
  max-width: none !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 16px !important;
  border-radius: 11px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  gap: 6px !important;
  white-space: nowrap !important;
  overflow: visible !important;
}
#subHeaderFilterBtn {
  background: linear-gradient(180deg, var(--pm-b1), var(--pm-b2)) !important;
  color: #fff !important;
  border: 1px solid transparent !important;
  box-shadow: 0 8px 18px -8px rgba(28, 53, 127, 0.7), 0 1px 0 rgba(255, 255, 255, 0.25) inset !important;
}
#subHeaderFilterBtn .mu-label { color: #fff !important; }
#subHeaderMapQuery {
  background: rgba(255, 255, 255, 0.55) !important;
  color: var(--pm-ink) !important;
  border: 1px solid var(--pm-line-2) !important;
}
#subHeaderMapQuery .mu-label { color: var(--pm-ink) !important; }
#subHeaderFilterBtn svg,
#subHeaderMapQuery svg {
  display: inline-block !important;
  width: 17px !important;
  height: 17px !important;
  opacity: 0.92 !important;
}
#subHeaderFilterBtn.active {
  background: linear-gradient(180deg, var(--pm-b1), var(--pm-b2)) !important;
  border-color: transparent !important;
}
#subHeaderMapQuery.active {
  background: var(--pm-b-soft) !important;
  color: var(--pm-b1) !important;
  border-color: var(--pm-b1) !important;
}
#subHeaderMapQuery.active .mu-label { color: var(--pm-b1) !important; }

/* ── ZOOM: cam, harita sag-altinda ──────────────────────────────────────── */
#subHeaderZoomIn,
#subHeaderZoomOut {
  background: var(--pm-glass-strong) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid var(--pm-line) !important;
  box-shadow: var(--pm-sh-sm) !important;
  color: var(--pm-ink) !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: 14px !important;
}

/* ── FILTRE & DETAY (alt sheet / cekmece) ortak premium yuzey ───────────── */
.filter,
aside.filter,
.panel,
aside.panel {
  background: var(--pm-surface) !important;
  box-shadow: var(--pm-sh) !important;
}
.filter { border-top-left-radius: var(--pm-r-lg) !important; border-top-right-radius: var(--pm-r-lg) !important; }
.panel { border-top-left-radius: var(--pm-r-lg) !important; border-top-right-radius: var(--pm-r-lg) !important; }

/* Filtre baslik */
.filter-head {
  padding: 18px 18px 12px !important;
  border-bottom: 1px solid var(--pm-line) !important;
}
.filter-head, .filter-head * { color: var(--pm-ink) !important; }
.filter-head .filter-title,
.filter-head h2,
.filter-head h3 { font-weight: 700 !important; font-size: 17px !important; letter-spacing: -0.01em !important; }

/* Filtre alan etiketleri + girdiler */
.filter label { color: var(--pm-ink-2) !important; }
.filter input[type="text"],
.filter input[type="search"],
.filter input[type="number"],
.filter select,
.filter textarea {
  font-size: 16px !important;
  border: 1px solid var(--pm-line-2) !important;
  border-radius: var(--pm-r-sm) !important;
  background: var(--pm-surface-2) !important;
  color: var(--pm-ink) !important;
  padding: 12px 14px !important;
  transition: border-color 160ms var(--pm-ease), box-shadow 160ms var(--pm-ease) !important;
}
.filter input:focus,
.filter select:focus,
.filter textarea:focus {
  outline: none !important;
  border-color: var(--pm-b1) !important;
  box-shadow: 0 0 0 3px var(--pm-b-soft) !important;
  background: #fff !important;
}

/* Filtre: birincil Ara butonu */
#filterSearch {
  background: linear-gradient(180deg, var(--pm-b1), var(--pm-b2)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--pm-r-sm) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  min-height: 50px !important;
  box-shadow: 0 8px 18px -8px rgba(28, 53, 127, 0.7) !important;
}
#filterSearch:disabled {
  background: var(--pm-surface-2) !important;
  color: var(--pm-ink-3) !important;
  box-shadow: none !important;
}
.filter-hint { color: var(--pm-ink-3) !important; font-size: 13px !important; }

/* Filtre alt linkler (Tum parseller / Sifirla) */
.filter-meta button {
  background: #fff !important;
  border: 1px solid var(--pm-line-2) !important;
  color: var(--pm-ink) !important;
  border-radius: var(--pm-r-sm) !important;
  min-height: 46px !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
}

/* Akordiyon basliklari */
.filter-accordion__toggle {
  color: var(--pm-ink) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

/* ── TELEFON (<=767px): DROPDOWN NAV ALTA ─────────────────────────────────
   Ara/Harita/Araclar/Hesap tetikleyicileri ust bardan alinip basparmak
   bolgesine (en alt) yuzen bir bara tasinir. Filtre/Sorgu bari onun USTUNDE.
   ─────────────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
  /* Gereksiz funnel tab gizli (alt barda Filtre zaten var) */
  .filter-tab, #filterTab { display: none !important; }

  /* Ust bar: yalniz marka kalsin (ferah) */
  header { justify-content: flex-start !important; }

  /* NAV -> en alt, kompakt ortalanmis yuzen cam bar (dar) */
  .m-nav {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    bottom: max(12px, var(--safe-bottom, 0px)) !important;
    top: auto !important;
    margin: 0 !important;
    width: auto !important;
    max-width: calc(100vw - 20px) !important;
    z-index: var(--z-subheader, 12990) !important;
    display: flex !important;
    gap: 2px !important;
    padding: 4px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    -webkit-backdrop-filter: saturate(1.7) blur(20px) !important;
    backdrop-filter: saturate(1.7) blur(20px) !important;
    border: 1px solid var(--pm-line-2) !important;
    border-radius: 15px !important;
    box-shadow: var(--pm-sh) !important;
  }
  .m-nav .m-trigger {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    justify-content: center !important;
    height: 36px !important;
    padding: 0 12px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
  }
  .m-nav .m-trigger::after { display: none !important; }   /* alt barda ok gereksiz */

  /* FILTRE/SORGU bari -> nav'in tam ustunde (nav ~44px) */
  #subHeader {
    bottom: calc(max(12px, var(--safe-bottom, 0px)) + 44px + 8px) !important;
  }

  /* ZOOM -> Filtre/Sorgu barinin da ustunde, sag kenar (subHeader ~48px) */
  #subHeaderZoomIn,
  #subHeaderZoomOut {
    left: auto !important;
    right: 14px !important;
  }
  #subHeaderZoomOut {
    bottom: calc(max(12px, var(--safe-bottom, 0px)) + 44px + 8px + 48px + 10px) !important;
    top: auto !important;
  }
  #subHeaderZoomIn {
    bottom: calc(max(12px, var(--safe-bottom, 0px)) + 44px + 8px + 48px + 10px + 42px + 8px) !important;
    top: auto !important;
  }
}

/* Detay panel basligi */
.panel-hd {
  padding: 16px 16px 12px !important;
  border-bottom: 1px solid var(--pm-line) !important;
}
.panel-hd .t1 { color: var(--pm-ink) !important; font-weight: 700 !important; font-size: 17px !important; letter-spacing: -0.01em !important; }
.panel .btn.ghost {
  background: var(--pm-surface-2) !important;
  border: 1px solid var(--pm-line) !important;
  color: var(--pm-ink-2) !important;
  border-radius: 10px !important;
}

/* ── BOTTOM-SHEET (Ara/Harita/Araclar/Hesap) ───────────────────────────── */
.m-sheet {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  transform: translateY(110%) !important;
  visibility: hidden !important;
  background: var(--pm-surface) !important;
  border-top-left-radius: var(--pm-r-lg) !important;
  border-top-right-radius: var(--pm-r-lg) !important;
  box-shadow: var(--pm-sh) !important;
  transition: transform 340ms var(--pm-ease), visibility 340ms var(--pm-ease) !important;
}
.m-sheet.open { transform: translateY(0) !important; visibility: visible !important; }
.m-sheet::before { background: var(--pm-line-2) !important; }
/* Sheet: yükseklik sınırlı flex kolon -> başlık sabit, gövde kaydırır (scrollbar kenarda) */
.m-sheet { max-height: 82vh !important; display: flex !important; flex-direction: column !important; }
.m-sheet-head { padding: 12px 14px 6px !important; flex: 0 0 auto !important; }
.m-sheet-body { flex: 1 1 auto !important; min-height: 0 !important; padding: 2px 12px 12px !important; }
.m-sheet-title { color: var(--pm-ink) !important; font-weight: 700 !important; font-size: 14px !important; letter-spacing: -0.01em !important; }
.m-sheet-close { color: var(--pm-b1) !important; font-weight: 600 !important; font-size: 13px !important; padding: 4px 2px !important; }
.m-sheet-body .m-row {
  min-height: 38px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--pm-ink) !important;
  border-radius: 10px !important;
  border: 1px solid var(--pm-line) !important;
  background: var(--pm-surface-2) !important;
  margin: 4px 0 !important;
  padding: 0 12px !important;
}
.m-sheet-body .m-row:active { background: var(--pm-b-soft) !important; }
/* Ara sheet'ine tasinan arama girdisi */
.m-sheet .searchbar input {
  font-size: 16px !important;
  border: 1px solid var(--pm-line-2) !important;
  border-radius: var(--pm-r-sm) !important;
  background: var(--pm-surface-2) !important;
  padding: 12px 14px 12px 40px !important;
}
/* Hesap sheet: cikis butonu */
.m-sheet .header-actions .btn {
  border-radius: var(--pm-r-sm) !important;
  min-height: 48px !important;
  font-weight: 600 !important;
}
.m-scrim { background: rgba(11, 18, 32, 0.42) !important; }

/* ── HESAP: alttan sheet yerine ORTADA MODAL (rozetten acilir) ──────────── */
#mSheet-hesap {
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  bottom: auto !important;
  width: min(360px, calc(100vw - 40px)) !important;
  max-width: min(360px, calc(100vw - 40px)) !important;
  max-height: 76dvh !important;
  border-radius: 22px !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.32) !important;
  transform: translate(-50%, -50%) scale(0.94) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: transform 240ms var(--pm-ease), opacity 200ms var(--pm-ease), visibility 240ms var(--pm-ease) !important;
}
#mSheet-hesap.open {
  transform: translate(-50%, -50%) scale(1) !important;
  opacity: 1 !important;
  visibility: visible !important;
}
#mSheet-hesap::before { display: none !important; }   /* modalda tutamac yok */
#mSheet-hesap .m-sheet-head { padding: 18px 18px 8px !important; }

/* ════════ TABLET (>=768px): cekmeceler yan, sheet ortali kart ──────────── */
@media (min-width: 768px) {
  header .brand-periplus { display: block !important; }  /* renk degistirilmez */

  /* Bottom-sheet -> ortalanmis kart */
  .m-sheet {
    left: 50% !important;
    right: auto !important;
    bottom: max(18px, var(--safe-bottom, 0px)) !important;
    width: min(460px, calc(100vw - 48px)) !important;
    max-width: min(460px, calc(100vw - 48px)) !important;
    max-height: min(70dvh, 620px) !important;
    border-radius: var(--pm-r-lg) !important;
    transform: translate(-50%, 130%) !important;
  }
  .m-sheet.open { transform: translate(-50%, 0) !important; }

  /* Ust nav segment: kompakt */
  .m-trigger {
    height: 30px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
  }

  /* Alt bar -> kompakt ortalanmis yuzen pill (dar) */
  #subHeader {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: auto !important;
    max-width: min(560px, calc(100vw - 40px)) !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    padding: 5px !important;
    gap: 6px !important;
    justify-content: center !important;
  }
  #subHeaderFilterBtn,
  #subHeaderMapQuery {
    flex: 0 0 auto !important;
    min-width: 104px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 18px !important;
    font-size: 12.5px !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }
  #subHeaderFilterBtn svg,
  #subHeaderMapQuery svg { display: inline-block !important; }

  /* Cekmece basliklari icin hafif daha genis padding */
  .filter-head, .panel-hd { padding-left: 20px !important; padding-right: 20px !important; }
}

/* ════════════════════════════════════════════════════════════════════════
   TEK SATIR ALT BAR (2026-06-29 son istek)
   Filtre · Sorgu · Ara · Harita · Araclar -> tek ince bar, IKON YOK, TEK RENK.
   #subHeader (eski Filtre/Sorgu bari) gizli; eylemler proxy ile cagrilir.
   Dropdown/sheet acilinca ARKA FLAS (scrim karartma) YOK.
   ════════════════════════════════════════════════════════════════════════ */

/* Eski ayri Filtre/Sorgu bari gizli (butonlar DOM'da kalir; proxy .click() calisir) */
#subHeader { display: none !important; }

/* Tek alt bar (tum mobil/tablet) */
.m-nav {
  position: fixed !important;
  left: 8px !important;
  right: 8px !important;
  bottom: max(10px, var(--safe-bottom, 0px)) !important;
  top: auto !important;
  transform: none !important;
  margin: 0 !important;
  width: auto !important;
  max-width: none !important;
  display: flex !important;
  gap: 2px !important;
  padding: 4px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  -webkit-backdrop-filter: saturate(1.6) blur(18px) !important;
  backdrop-filter: saturate(1.6) blur(18px) !important;
  border: 1px solid var(--pm-line-2) !important;
  border-radius: 14px !important;
  box-shadow: var(--pm-sh) !important;
  z-index: var(--z-subheader, 12990) !important;
}

/* 5 esit, ince, IKON YOK, TEK RENK */
.m-nav .m-trigger {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  height: 38px !important;
  padding: 0 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--pm-ink) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 10px !important;
  gap: 0 !important;
  white-space: nowrap !important;
}
.m-nav .m-trigger::after { display: none !important; }   /* ok yok */
.m-nav .m-trigger svg { display: none !important; }        /* ikon yok */
.m-nav .m-trigger:active { background: rgba(15, 23, 42, 0.06) !important; }

/* Dropdown/sheet acilinca ARKA FLAS yok: tum scrim'ler seffaf (tik-disinda-kapat korunur) */
.m-scrim,
.mobile-overlay,
.panel-overlay,
.filter-overlay {
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* ════════════════════════════════════════════════════════════════════════
   DAHA KOMPAKT (2026-06-29) — alt bar daha ince; filtre & detay paneli
   daha minimal/tasarruflu (kucuk padding, dar bosluk, kucuk tipografi).
   ════════════════════════════════════════════════════════════════════════ */

/* Alt bar: daha ince */
.m-nav { padding: 3px !important; gap: 1px !important; border-radius: 12px !important; }
.m-nav .m-trigger { height: 32px !important; font-size: 12px !important; border-radius: 9px !important; }

/* ── FILTRE PANELI: kompakt/minimal ───────────────────────────────────── */
.filter-head { padding: 12px 14px 8px !important; }
.filter-head .filter-title,
.filter-head h2,
.filter-head h3 { font-size: 15px !important; }
.filter-body { padding: 10px 14px 14px !important; gap: 0 !important; }
.filter-group { margin-bottom: 9px !important; gap: 3px !important; }
.filter-group label { font-size: 11.5px !important; margin-bottom: 2px !important; }
.filter-group input,
.filter-group select,
.filter-group input[type="search"],
.filter input[type="text"],
.filter input[type="number"],
.filter textarea {
  padding: 8px 11px !important;
  border-radius: 9px !important;
  min-height: 0 !important;
}
/* Akordiyon + toggle satirlari sik */
.filter-accordion__toggle { padding: 9px 0 !important; font-size: 13px !important; }
.filter-area-item,
.filter-asset-item,
.filter-toggle-wrap { padding: 7px 0 !important; font-size: 12.5px !important; min-height: 0 !important; }
/* Aksiyonlar */
#filterSearch { min-height: 42px !important; font-size: 14px !important; }
.filter-actions { padding: 10px 14px !important; }
.filter-meta { padding: 0 14px 12px !important; gap: 8px !important; }
.filter-meta button { min-height: 38px !important; font-size: 12.5px !important; }
.filter-hint { font-size: 12px !important; }

/* ── DETAY PANELI (parsel): kompakt/minimal ───────────────────────────── */
.panel-hd { padding: 12px 14px 8px !important; }
.panel-hd .t1 { font-size: 15px !important; }
.panel-body { padding: 10px 14px 14px !important; font-size: 13px !important; }
.panel-body h2, .panel-body h3, .panel-body .t1, .panel-body .section-title { font-size: 13.5px !important; margin: 8px 0 4px !important; }
.panel-body table td, .panel-body table th { padding: 5px 8px !important; font-size: 12.5px !important; }
.panel-body .row, .panel-body .kv, .panel-body li { padding: 5px 0 !important; }
.panel-actions { padding: 10px 14px !important; gap: 8px !important; }
.panel-actions .btn { min-height: 40px !important; font-size: 12.5px !important; }

/* ════════════════════════════════════════════════════════════════════════
   MOBİL SIDEBAR — HERO TASARIM (2026-06-30)  ★ mobil tasarım dili buradan ★
   Sağ (parsel/#panel)  = YÜZEN KOMPAKT KART (haritanın üstünde, kenar boşluklu)
   Sol (filtre/#filterPanel) = KOMPAKT AÇILIR PANEL (alt bara çapalı, kademeli)
   İlke: son derece minimal + kompakt, ekranı kaplamaz, en az dokunma.
   Marka mavisi (#2546A9) yalnız birincil eylemde. Desktop'a dokunulmaz.
   ════════════════════════════════════════════════════════════════════════ */

@keyframes pmFade { from { opacity: 0; } to { opacity: 1; } }

/* ━━━━━━━━━━━━━━━━ SAĞ: PARSEL — YÜZEN KOMPAKT KART ━━━━━━━━━━━━━━━━━━━━━━ */
#panel {
  position: fixed !important;
  left: 0 !important; right: 0 !important; top: auto !important;
  bottom: calc(64px + var(--safe-bottom, 0px)) !important;  /* alt nav barının üstünde dursun */
  width: calc(100% - 20px) !important;
  max-width: 460px !important;
  margin: 0 auto !important;
  max-height: 58vh !important;
  height: auto !important;
  flex-direction: column !important;
  background: var(--pm-surface) !important;
  border: 1px solid var(--pm-line) !important;
  border-radius: 20px !important;
  box-shadow: var(--pm-sh) !important;
  overflow: hidden !important;
  /* KRİTİK: overlay (--z-overlay:13500) ÜSTÜNDE olmalı; yoksa şeffaf overlay
     dokunuşları yutar ve karta basınca panel kapanır. */
  z-index: var(--z-panel, 13600) !important;
  /* drag-to-dismiss: translateY JS'ten --pm-dragY ile gelir; responsive.css'i ezer */
  transform: translateY(var(--pm-dragY, 0px)) !important;
  animation: pmFade 0.26s var(--pm-ease);
}
#panel::before { content: none !important; display: none !important; }

/* Başlık (sürükleme tutamacı görevi de görür) */
#panel .panel-hd {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: 10px !important;
  padding: 11px 8px 9px 14px !important;
  border-bottom: none !important;   /* çizgi yok */
  flex: 0 0 auto !important;
  cursor: grab; touch-action: none;
}
#panel #panelTitle, #panel .panel-hd .t1 {
  font-size: 14.5px !important; font-weight: 700 !important; color: var(--pm-ink) !important;
  letter-spacing: -0.01em !important; white-space: nowrap !important; overflow: hidden !important;
  text-overflow: ellipsis !important; margin: 0 !important;
}
/* NOT: #panel #closePanel (spesifik) -> #panel .btn kuralını ezsin (yoksa çift ✕ + kutu olur) */
#panel #closePanel {
  width: 32px !important; height: 32px !important; min-width: 32px !important; padding: 0 !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  border: none !important; background: transparent !important; border-radius: 9px !important;
  color: var(--pm-ink-2) !important; font-size: 0 !important; flex: 0 0 auto !important;
}
#panel #closePanel::before { content: '✕' !important; font-size: 17px !important; line-height: 1 !important; }
#panel #closePanel:active { background: var(--pm-surface-2) !important; }

/* Gövde: iç kaydırma, kompakt.
   display:block ŞART -> app temeli panelBody'yi flex-column yapıyor; o yüzden
   not alanı açılınca akordiyon kutusu flex-shrink ile eziliyor + overflow:hidden
   kırpıyordu. Normal akışta çocuklar doğal yükseklikte kalır ve gövde kaydırır. */
#panel #panelBody, #panel .panel-body {
  display: block !important;
  flex: 1 1 auto !important; min-height: 0 !important;
  overflow-y: auto !important; -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  padding: 10px 14px 14px !important;
}

/* Anahtar bilgi satırları (etiket/değer) — SIKI tek satır, kayma/boşluk yok */
#panel .kv {
  display: flex !important; justify-content: space-between !important; align-items: baseline !important;
  gap: 14px !important; padding: 2px 0 !important; font-size: 12.5px !important;
  grid-template-columns: none !important;
}
#panel .kv > div:first-child {
  color: var(--pm-ink-2) !important; font-size: 12px !important; font-weight: 500 !important;
  flex: 0 0 auto !important; white-space: nowrap !important;
}
#panel .kv > div:last-child {
  color: var(--pm-ink) !important; font-weight: 600 !important; text-align: right !important;
  flex: 1 1 auto !important; min-width: 0 !important;
}
#panel .divider { display: none !important; }   /* alanlar arası çizgi yok */
#panel #panelBody > .kv + .kv { margin-top: 0 !important; }
/* kv grupları arası ayrımı çizgi yerine küçük boşlukla ver */
#panel #panelBody > .kv:nth-of-type(5) { margin-bottom: 6px !important; }
#panel .chips { display: flex !important; flex-wrap: wrap !important; gap: 4px !important; justify-content: flex-end !important; }
#panel .badge { border-radius: 999px !important; padding: 2px 9px !important; font-size: 11px !important; font-weight: 600 !important; }

/* ── GEREKSİZ MATERYALLERİ GİZLE (son derece minimal) ─────────────────────
   Yer imi/karşılaştırma ızgarası, boş Planlama konteyneri, ölçüm kontrolleri
   -> mobilde gizli. Anahtar bilgi + Hatırlatıcı/Paylaşım + asıl aksiyonlar kalır. */
#panel #panelBody > div:has(> #btnBookmark) { display: none !important; }
#panel #parcelPlannings { display: none !important; }
#panel #measureControls { display: none !important; }
/* Akordiyon gizlenince geriye kalan ardışık/uçtaki ayraçları da yut */
#panel .divider + .divider { display: none !important; }

/* ── HATIRLATICI + PAYLAŞIM: son derece kompakt, satır içi açılır modüller ──
   Kutu/çizgi yok -> çok hafif surface-2 dolgu (tek dokunuş affordance'ı).
   İçerik mutlak yerine SATIR İÇİ açılır -> overflow:hidden kart içinde kırpılmaz. */
#panel #panelBody > div:has(> .accordion-header) {
  border: none !important; border-radius: 11px !important;
  background: var(--pm-surface-2) !important;
  margin: 0 0 6px !important; overflow: hidden !important; position: relative !important;
}
#panel #panelBody > div:has(> .accordion-header) { margin-bottom: 5px !important; }
#panel #panelBody > div:has(> .accordion-header):first-of-type { margin-top: 8px !important; }
#panel .accordion-header {
  min-height: 36px !important; padding: 0 11px !important;
  background: transparent !important; border: none !important; cursor: pointer !important;
}
#panel .accordion-header > div:first-child,
#panel .accordion-header > div:first-child span:not(#noteIndicator) {
  font-size: 12.5px !important; color: var(--pm-ink) !important; font-weight: 600 !important;
}
#panel .accordion-icon { color: var(--pm-ink-3) !important; font-size: 11px !important; }
/* İçerik: satır içi (mutlak değil) -> kart içinde akar, kesilmez. Kompakt. */
#panel .accordion-content {
  position: static !important; box-shadow: none !important; border: none !important;
  border-radius: 0 !important; padding: 0 11px 8px !important; max-height: none !important;
  background: transparent !important; overflow: visible !important;
}
#panel #parcelNote {
  background: var(--pm-surface) !important; border: 1px solid var(--pm-line) !important;
  border-radius: 8px !important; font-size: 12.5px !important; line-height: 1.35 !important;
  min-height: 40px !important; max-height: 64px !important; padding: 6px 9px !important;
}
#panel #shareLink {
  background: var(--pm-surface) !important; border: 1px solid var(--pm-line) !important;
  border-radius: 8px !important; height: 32px !important; font-size: 11px !important;
}
#panel #btnCopyLink { height: 32px !important; font-size: 11px !important; border-radius: 8px !important; padding: 0 11px !important; }
/* Not düzenleme mini butonları: tappable tut */
#panel #btnNoteSave, #panel #btnNoteCancel { width: 24px !important; height: 24px !important; }
#panel #btnNoteDelete { padding: 3px 8px !important; }

/* Asıl aksiyonlar: nötr ikincil + tek birincil (marka mavisi), kompakt */
#panel .panel-actions-inline { border-top: none !important; padding-top: 0 !important; margin-top: 8px !important; gap: 6px !important; }
#panel .btn {
  border-radius: 9px !important; border: 1px solid var(--pm-line-2) !important;
  background: var(--pm-surface) !important; color: var(--pm-ink) !important;
  font-weight: 600 !important; height: 34px !important; min-height: 34px !important; font-size: 12px !important;
  transition: transform 0.12s var(--pm-ease), background 0.16s !important;
}
#panel .btn.ghost { background: var(--pm-surface-2) !important; border-color: transparent !important; color: var(--pm-ink-2) !important; }
#panel .btn.primary { background: var(--pm-b1) !important; border-color: var(--pm-b1) !important; color: #fff !important; }
#panel .btn:active { transform: scale(0.98) !important; }

/* ━━━━━━━━━━━━━━━━ SOL: FİLTRE — KOMPAKT AÇILIR PANEL ━━━━━━━━━━━━━━━━━━━━ */
#filterPanel {
  position: fixed !important;
  left: 0 !important; right: 0 !important; top: auto !important;
  bottom: calc(64px + var(--safe-bottom, 0px)) !important;  /* alt bara çapalı, üstünde */
  width: calc(100% - 20px) !important;
  max-width: 440px !important;
  margin: 0 auto !important;
  max-height: 68vh !important;
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
  background: var(--pm-surface) !important;
  border: 1px solid var(--pm-line) !important;
  border-radius: 18px !important;
  box-shadow: var(--pm-sh) !important;
  overflow: hidden !important;
  /* KRİTİK: overlay (--z-overlay:13500) ÜSTÜNDE olmalı (yoksa dokunuş yutuluyor,
     dropdown tıklanmıyor, karta basınca filtre kapanıyor). */
  z-index: var(--z-filter, 13600) !important;
  /* Aç/kapa: body.filter-open ile sürülür (transform translateY responsive.css'te) */
  transform: translateY(10px) !important;
  opacity: 0 !important; visibility: hidden !important; pointer-events: none !important;
  transition: opacity 0.22s var(--pm-ease), transform 0.26s var(--pm-ease), visibility 0s linear 0.26s !important;
}
body.filter-open #filterPanel {
  transform: translateY(0) !important;
  opacity: 1 !important; visibility: visible !important; pointer-events: auto !important;
  transition: opacity 0.22s var(--pm-ease), transform 0.26s var(--pm-ease) !important;
}
#filterPanel::before { content: none !important; display: none !important; }
#filterPanel .filter-content {
  display: flex !important; flex-direction: column !important;
  min-height: 0 !important; overflow: hidden !important; padding-top: 0 !important;
}

/* Başlık + tek ✕ */
#filterPanel .filter-head {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: 10px !important; padding: 11px 8px 9px 14px !important;
  border-bottom: none !important; flex: 0 0 auto !important;   /* çizgi yok */
  background: var(--pm-surface) !important;
}
#filterPanel .filter-title {
  font-size: 14.5px !important; font-weight: 700 !important; color: var(--pm-ink) !important;
  letter-spacing: -0.01em !important; margin: 0 !important;
}
#filterCollapse {
  width: 32px !important; height: 32px !important; min-width: 32px !important; padding: 0 !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  border: none !important; background: transparent !important; border-radius: 9px !important;
  color: var(--pm-ink-2) !important; font-size: 0 !important; flex: 0 0 auto !important;
}
#filterCollapse::before { content: '✕' !important; font-size: 17px !important; line-height: 1 !important; }
#filterCollapse:active { background: var(--pm-surface-2) !important; }

/* Gövde: KAYDIRILABİLİR (içerik uzunsa scroll), kompakt */
#filterPanel .filter-content { flex: 1 1 auto !important; min-height: 0 !important; }
#filterPanel .filter-body {
  flex: 1 1 auto !important; min-height: 0 !important;
  overflow-y: auto !important; -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  padding: 8px 14px 6px !important;
}
#filterPanel .filter-actions { padding: 6px 14px 2px !important; border-top: none !important; }
#filterPanel .filter-meta { padding: 4px 14px 10px !important; border-top: none !important; }

/* KADEMELİ AÇILIM (JS'siz): sonraki adım, önceki seçilince aktif olunca görünür.
   Başlangıçta İlçe ve arama alanları disabled -> gizli; İl seçilince açılır. */
#filterPanel .filter-group:has(#filterIlce:disabled) { display: none !important; }
#filterPanel .filter-group--search:has(input:disabled) { display: none !important; }

#filterPanel .filter-group { margin-bottom: 7px !important; }
#filterPanel .filter-group label {
  display: block !important; font-size: 11px !important; font-weight: 600 !important;
  color: var(--pm-ink-2) !important; margin-bottom: 3px !important;
}
#filterPanel input[type="text"], #filterPanel input[type="search"],
#filterPanel input[type="number"], #filterPanel select {
  width: 100% !important; font-size: 16px !important;   /* 16px: iOS odakta zoom yapmasın */
  border: 1px solid var(--pm-line-2) !important; border-radius: 9px !important;
  background: var(--pm-surface) !important; color: var(--pm-ink) !important;
  padding: 6px 11px !important; min-height: 0 !important; height: 36px !important;
  line-height: 1.2 !important; box-shadow: none !important;
  transition: border-color 0.16s var(--pm-ease), box-shadow 0.16s var(--pm-ease) !important;
}
#filterPanel input:focus, #filterPanel select:focus {
  outline: none !important; border-color: var(--pm-b1) !important;
  box-shadow: 0 0 0 3px var(--pm-b-soft) !important;
}

/* Trail (seçilen rozetler) — ince */
#filterPanel .filter-trail:empty { display: none !important; }

/* Özel arama dropdownları (Mahalle/Ada/Parsel) — iç scroll YOK, satır-içi akar
   (tek scroll = filter-body; iOS'ta iç içe scroll takılmasını önler) */
#filterPanel .filter-options { max-height: none !important; overflow: visible !important; }

/* Akordiyonlar (Alanlara/Varlıklara göre) — çizgi YOK, sıkı satır, içerik kaydırılır */
#filterPanel .filter-accordion {
  border: none !important; background: transparent !important; border-radius: 0 !important;
  margin: 0 !important; padding: 0 !important;
}
#filterPanel .filter-accordion__toggle {
  min-height: 0 !important; height: 40px !important; padding: 0 !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  font-size: 12.5px !important; font-weight: 600 !important; color: var(--pm-ink) !important;
  background: transparent !important; border: none !important;
}
/* Açılan liste satır-içi akar; kendi scroll'u YOK -> tek scroll (filter-body),
   iç içe scroll touch'ta takılmasın. Liste uzunsa filter-body kaydırır. */
#filterPanel .filter-accordion__content { padding: 0 0 8px !important; max-height: none !important; overflow: visible !important; }
/* Alan/Varlık toggle satırları: dar ama dokunulabilir (36px), çizgisiz. */
#filterPanel .filter-area-item, #filterPanel .filter-asset-item, #filterPanel .filter-toggle-wrap {
  display: flex !important; align-items: center !important; gap: 8px !important;
  min-height: 36px !important; padding: 0 2px !important; font-size: 12.5px !important;
  border-top: none !important; cursor: pointer !important;
}
#filterPanel .filter-toggle { flex-shrink: 0 !important; }

/* Yazarak-arama (Mahalle/Ada/Parsel) seçenek satırları: dar */
#filterPanel .filter-options { margin-top: 4px !important; border-radius: 9px !important; }
#filterPanel .filter-option {
  min-height: 0 !important; padding: 7px 11px !important; font-size: 13px !important; line-height: 1.25 !important;
}
#filterPanel .filter-options__title { padding: 5px 11px 2px !important; font-size: 10.5px !important; }

/* Birincil ARA butonu (tek marka vurgusu) */
#filterPanel #filterSearch {
  width: 100% !important; background: var(--pm-b1) !important; color: #fff !important;
  border: none !important; border-radius: 10px !important; min-height: 40px !important; height: 40px !important;
  font-weight: 700 !important; font-size: 14px !important; margin-top: 2px !important;
  box-shadow: 0 6px 14px -9px rgba(37, 70, 169, 0.8) !important;
}
#filterPanel #filterSearch:disabled {
  background: var(--pm-surface-2) !important; color: var(--pm-ink-3) !important; box-shadow: none !important;
}
#filterPanel .filter-hint { color: var(--pm-ink-3) !important; font-size: 12px !important; }

/* İkincil eylemler (Tüm Parseller / Sıfırla) */
#filterPanel .filter-meta { display: flex !important; gap: 6px !important; padding-top: 4px !important; }
#filterPanel .filter-meta button {
  flex: 1 1 0 !important; background: var(--pm-surface-2) !important; border: 1px solid var(--pm-line) !important;
  border-radius: 9px !important; color: var(--pm-ink-2) !important; min-height: 32px !important; height: 32px !important;
  font-size: 11.5px !important; font-weight: 600 !important;
}

/* ━━━━━━━━━━━━━━━━ ORTAK: scrim seffaf (arka flaş yok), reduced-motion ━━━━ */
.m-scrim, .mobile-overlay, .panel-overlay, .filter-overlay {
  background: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
@media (prefers-reduced-motion: reduce) {
  #panel { animation: none !important; }
  #panel, #filterPanel, #panel .btn { transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   MOBİL NAV 2.0 (2026-06-30) — kompakt alt bar + üst-sağ arama + sheet'ler
   Alt bar: Filtre · Seç · [profil] · Harita · Araçlar  | Arama: üst-sağ açılır
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── ALT BAR: çok daha dar / kompakt, cam ── */
.m-nav {
  bottom: max(10px, var(--safe-bottom, 0px)) !important;
  padding: 2px !important; gap: 1px !important; border-radius: 12px !important;
  background: var(--pm-glass, rgba(255, 255, 255, 0.85)) !important;
  -webkit-backdrop-filter: saturate(1.7) blur(18px) !important;
  backdrop-filter: saturate(1.7) blur(18px) !important;
  box-shadow: var(--pm-sh) !important;
  align-items: center !important;
}
.m-nav .m-trigger {
  height: 30px !important; padding: 0 9px !important;
  font-size: 11.5px !important; font-weight: 600 !important; border-radius: 9px !important;
  color: var(--pm-ink-2) !important;
}
/* Aktif (Seç açık): marka mavisi dolgu -> seçili olduğu belli */
.m-nav .m-trigger.active {
  background: var(--pm-b1) !important; color: #fff !important;
  box-shadow: 0 2px 8px -2px rgba(37, 70, 169, 0.55) !important;
}

/* ── PROFİL ROZETİ: alt bar ORTASINDA, kompakt, harf tam ortalı ── */
.m-nav .m-account-badge {
  position: static !important; margin: 0 3px !important;
  width: 27px !important; height: 27px !important; min-width: 27px !important;
  font-size: 12px !important; font-weight: 700 !important;
  /* tek harfin optik ortası: flex + line-height:0 ile baseline kayması yok */
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  line-height: 0 !important; padding: 0 !important;
  box-shadow: 0 2px 8px -3px rgba(37, 70, 169, 0.6) !important;
}

/* ── ÜST-SAĞ ARAMA: ikon yok, kapalı dar "Ara", odakta genişler ── */
header .searchbar {
  position: relative !important; margin-left: auto !important; flex: 0 0 auto !important;
  /* Görsel fontu sarar (16px "Ara" → 28px kutu, kullanıcı istedi) — dokunma ::after ile 44px */
  width: 56px !important; height: 28px !important; min-height: 28px !important; max-width: none !important;
  background: rgba(15, 23, 42, 0.05) !important; border: 1px solid var(--pm-line) !important;
  border-radius: 8px !important; padding: 0 8px !important;
  display: flex !important; align-items: center !important; overflow: visible !important; /* hit-area pseudo'su kırpılmasın */
  visibility: visible !important;
  transition: width 0.24s var(--pm-ease), background 0.18s, box-shadow 0.18s !important;
}
header .searchbar.m-open {
  width: 188px !important; background: #fff !important; border-color: var(--pm-line-2) !important;
  box-shadow: 0 6px 18px -8px rgba(15, 23, 42, 0.3) !important;
}
header .searchbar .icon { display: none !important; }            /* ikon istenmedi */
header .searchbar input#search {
  width: 100% !important; height: 100% !important; border: none !important;
  /* 16px: DESIGN.md kuralı (iOS odak zoom önlenir); 13px kendi sözleşmesini kırıyordu */
  background: transparent !important; font-size: 16px !important; padding: 0 !important;
  color: var(--pm-ink) !important; box-shadow: none !important;
}
/* Öneri dropdown: dar searchbar'ı taşır -> üstte sabit ve geniş, yüksek z-index */
#search_suggest {
  position: fixed !important;
  top: calc(38px + var(--safe-top, 0px)) !important;
  right: max(8px, var(--safe-right)) !important; left: auto !important;
  width: min(320px, calc(100vw - 16px)) !important; max-height: 50vh !important;
  z-index: 13800 !important; box-shadow: var(--pm-sh) !important; border-radius: 12px !important;
}

/* header-actions mobilde gizli (profil rozeti üstlendi) */
header .header-actions { display: none !important; }

/* ── HARİTA sheet: Katman VARSAYILAN KAPALI, dokununca açılır (kompakt) ──
   İç scroll YOK -> tüm içerik sheet gövdesinde akar, scrollbar sheet kenarında. */
#mSheet-harita .m-collapse .m-inline-layers {
  display: none !important; position: static !important; inset: auto !important;
  margin: 4px 0 2px !important; border: none !important; border-radius: 10px !important;
  box-shadow: none !important; background: var(--pm-surface-2) !important;
  max-height: none !important; overflow: visible !important; width: auto !important; min-width: 0 !important; z-index: auto !important;
}
#mSheet-harita .m-collapse.open .m-inline-layers { display: block !important; }
.m-inline-layers > div:first-child { display: none !important; }   /* iç "Harita Katmanı" başlığı gereksiz */
.m-inline-layers .layer-option { padding: 6px 11px !important; font-size: 12.5px !important; }
.m-inline-layers .layer-option span { font-size: 12.5px !important; }
.m-collapse-head .m-row-chev { transition: transform 0.18s var(--pm-ease) !important; }
.m-collapse.open .m-collapse-head .m-row-chev { transform: rotate(90deg) !important; }

/* Katman/Alanlar satırı + Konumum butonu (kompakt) */
.m-row-nav { display: flex !important; align-items: center !important; justify-content: space-between !important; }
.m-row-chev { color: var(--pm-ink-3) !important; font-size: 16px !important; line-height: 1 !important; }
.m-row-konum { display: flex !important; align-items: center !important; justify-content: center !important; }
.m-row-konum.active { background: var(--pm-b1) !important; color: #fff !important; border-color: var(--pm-b1) !important; }

/* ── ALANLAR: Harita sheet içinde satır içi; TAM GENİŞLİK, iç scroll yok ──
   (kutu/iç scrollbar kaldırıldı -> genişlik uyumlu, scrollbar sheet kenarında) */
#mSheet-harita .m-collapse .m-inline-areas {
  display: none !important; position: static !important; inset: auto !important;
  margin: 2px 0 2px !important; padding: 0 !important; border: none !important;
  border-radius: 0 !important; box-shadow: none !important; background: transparent !important;
  width: auto !important; min-width: 0 !important; max-width: none !important; max-height: none !important;
  overflow: visible !important; z-index: auto !important;
}
#mSheet-harita .m-collapse.open .m-inline-areas { display: block !important; }
/* Alan akordiyonunu DÜZLEŞTİR: grup anahtarları doğrudan görünür (fazladan akordiyon yok) */
.m-inline-areas .area-body { display: block !important; padding-left: 0 !important; }
.m-inline-areas .area-toggle { display: none !important; }          /* ▶ ok gereksiz */
.m-inline-areas .area-header { cursor: default !important; background: transparent !important; padding: 4px 2px 2px !important; }
.m-inline-areas .area-section { margin-bottom: 2px !important; }
.m-inline-areas .group-header { padding: 5px 2px !important; }      /* grup satırları kompakt */
.m-inline-areas .group-section { margin-top: 2px !important; }
.m-inline-areas, .m-inline-areas #areasDropdownList { width: 100% !important; box-sizing: border-box !important; }

/* ── ARAÇLAR sheet: kompakt 2 sütun ızgara ── */
.m-sheet-body.m-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6px !important; }
.m-grid .m-row { margin: 0 !important; justify-content: center !important; text-align: center !important; }

/* ── KOORDİNAT: koordinat alınca iki kutu çıkıyordu. Açık renkli marker baloncuğu
   (Leaflet popup) kalsın; koyu #coordinatePopup kutusu mobilde GİZLENSİN. ── */
#coordinatePopup { display: none !important; }

/* ════════════════════════════════════════════════════════════════════════
   DOKUNMA HEDEFLERİ ≥44px (2026-07-02 — critique P0 düzeltmesi)
   Yukarıdaki kompaktlaştırma turları hedefleri 27-38px'e eritmişti; PRODUCT.md
   sözleşmesi (mobilde ≥44px) ve WCAG 2.5.5 için geri kazanılıyor. Blok dosyanın
   SONUNDA — kaskadı kazanır. Görsel dil korunur: tipografi/renk değişmez,
   yalnız hedef boyutları büyür.
   ════════════════════════════════════════════════════════════════════════ */

/* Alt bar: görsel ince kalır (36px tetikleyici, kullanıcı istedi); dokunma alanı
   ::after ile dikeyde 44px'e tamamlanır (bar üstü/altındaki 4px'lik boşluklara taşar).
   Not: bu bağlamda ::after oku zaten display:none idi — hit-area olarak yeniden kullanılır. */
.m-nav { padding: 4px !important; overflow: visible !important; } /* taşan hit-area'lar kırpılmasın */
.m-nav .m-trigger {
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 10px !important;
  position: relative !important;
}
.m-nav .m-trigger::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: -8px 0 !important;
  opacity: 0 !important;
  font-size: 0 !important;
}

/* Profil rozeti: görünür daire 34px (optik denge), dokunma alanı ::after ile 46px */
.m-nav .m-account-badge {
  width: 28px !important; height: 28px !important; min-width: 28px !important;
  font-size: 13px !important;
  position: relative !important;
}
.m-nav .m-account-badge::after {
  content: '' !important;
  position: absolute !important;
  inset: -8px !important;
  border-radius: 999px !important;
}

/* Arama kutusunun dokunma alanı dikeyde 44px'e tamamlanır (28px görsel + ±8px) */
header .searchbar::after {
  content: '' !important;
  position: absolute !important;
  inset: -8px 0 !important;
}

/* Sheet "Kapat": 40×23 → ≥44×44 */
.m-sheet-close {
  min-width: 44px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 10px !important;
}

/* Sheet satırları (Araçlar/Harita): 38px → 44px */
.m-sheet-body .m-row { min-height: 44px !important; }

/* Parsel paneli kapatma: 32×32 → 44×44 */
#panel #closePanel {
  width: 44px !important; height: 44px !important; min-width: 44px !important;
}

/* Panel eylem butonları (3D / Nokta Bulutu / Yol Tarifi / Rapor): 34px → 44px
   (#panel .btn kuralı 748. satırda 34px'e sabitliyor — burada geri kazanılır) */
#panel .btn,
.panel-actions .btn { height: 44px !important; min-height: 44px !important; }
#panel #btnCopyLink { height: 44px !important; }

/* Bar görseli ince kaldığı için (≈42px) orijinal ofset tabanı geçerli — ek ofset gerekmez */

/* Zoom butonları mobilde bilinçli yok (ürün kararı): pinch tek yol. */