:root {
  --kd-accent: #0d6e6e;
}
html, body { height: 100%; }
body { background: var(--bs-body-bg); }

.brand-mark {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 8px;
  background: var(--kd-accent); color: #fff; font-size: 1rem;
}
.btn-primary { --bs-btn-bg: var(--kd-accent); --bs-btn-border-color: var(--kd-accent);
  --bs-btn-hover-bg: #0a5858; --bs-btn-hover-border-color: #0a5858;
  --bs-btn-active-bg: #084848; --bs-btn-active-border-color: #084848;
  --bs-btn-disabled-bg: var(--kd-accent); --bs-btn-disabled-border-color: var(--kd-accent); }

.step {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%; margin-right: .5rem;
  background: var(--bs-secondary-bg); font-size: .8rem; font-weight: 600;
}
.form-control.result { background: var(--bs-tertiary-bg); font-weight: 600; }
.form-control.result.flash { animation: flash .6s ease-out; }
@keyframes flash { from { background: rgba(13,110,110,.25); } to { background: var(--bs-tertiary-bg); } }

.code-block { background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); border-radius: .375rem;
  padding: .6rem .75rem; font-size: .8rem; white-space: pre-wrap; word-break: break-all; }

.batch-table { max-height: 430px; overflow: auto; }
.batch-table td, .batch-table th { white-space: nowrap; }
.batch-table tr.err td { background: var(--bs-danger-bg-subtle); }
.batch-table tr.warn td { background: var(--bs-warning-bg-subtle); }

#sysList .list-group-item { cursor: pointer; }
#sysList .list-group-item.active-sel { border-left: 3px solid var(--kd-accent); }
#sysList .group-head { font-size: .78rem; font-weight: 600; color: var(--bs-secondary-color); background: var(--bs-tertiary-bg); }

#apiUrl { font-size: .75rem; }

/* Altlık menüsü ve dilim etiketleri */
.map-layers .dropdown-menu { max-height: 70vh; overflow-y: auto; min-width: 250px; }
.map-layers .dropdown-item { cursor: pointer; }
.zone-label span {
  display: inline-block; transform: translateX(-50%); white-space: nowrap;
  background: rgba(255,255,255,.85); border: 1px solid; border-radius: 4px;
  padding: 0 .3rem; font: 600 11px/1.5 var(--bs-font-sans-serif);
}

/* Toplu dönüşüm modalı açıkken güvenlik sorgusu üstte görünsün */
#challengeModal { z-index: 1070; }
.modal-backdrop ~ .modal-backdrop { z-index: 1065; }


/* ===================== Tam ekran harita yerleşimi ===================== */
body.kd-fullmap { overflow: hidden; overscroll-behavior: none; }
#map { position: fixed; inset: 0; z-index: 0; background: var(--bs-secondary-bg); }

:root { --kd-gap: 12px; --kd-panel-w: 380px; --kd-sheet-h: 0px; }

/* Yüzen panel */
.kd-panel {
  position: fixed; z-index: 1010;
  top: var(--kd-gap); left: var(--kd-gap);
  width: var(--kd-panel-w);
  max-height: calc(100dvh - 2 * var(--kd-gap));
  display: flex; flex-direction: column;
  background: color-mix(in srgb, var(--bs-body-bg) 93%, transparent);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid var(--bs-border-color-translucent);
  border-radius: 14px;
  overflow: hidden;
}
.kd-panel-head {
  display: flex; align-items: center; gap: .6rem;
  padding: .6rem .6rem .6rem .75rem;
  border-bottom: 1px solid var(--bs-border-color-translucent);
  cursor: grab; user-select: none; touch-action: none;
}
.kd-panel.dragging .kd-panel-head { cursor: grabbing; }
.kd-panel.dragging { transition: none; opacity: .96; }
.kd-panel-head .brand-mark { width: 26px; height: 26px; font-size: .9rem; border-radius: 7px; flex: none; }
.kd-panel-body { overflow-y: auto; overscroll-behavior: contain; padding: .25rem .75rem .75rem; }
.kd-panel.collapsed .kd-panel-body { display: none; }
.kd-panel.collapsed .kd-panel-head { border-bottom: 0; }
#panelToggle i { display: inline-block; transition: transform .2s; }
.kd-panel.collapsed #panelToggle i { transform: rotate(180deg); }

.kd-section { padding-top: .6rem; }
.kd-section-title { font-weight: 600; font-size: .9rem; display: inline-flex; align-items: center; }
.kd-actions { margin: .75rem 0 .1rem; }
.kd-url {
  display: flex; align-items: center; gap: .5rem;
  margin-top: .75rem; padding-top: .6rem; border-top: 1px solid var(--bs-border-color-translucent);
}

/* Sağ üst araç çubuğu */
.kd-toolbar {
  position: fixed; z-index: 1005; top: var(--kd-gap); right: var(--kd-gap);
  display: flex; gap: .5rem; align-items: flex-start;
}
.kd-toolbar .btn-light { --bs-btn-bg: color-mix(in srgb, var(--bs-body-bg) 92%, transparent); --bs-btn-color: var(--bs-body-color); --bs-btn-hover-bg: var(--bs-tertiary-bg); --bs-btn-border-color: var(--bs-border-color); }

/* Alt bilgi çipi */
.kd-chip {
  position: fixed; z-index: 1000; left: 50%; bottom: calc(var(--kd-gap) + 18px);
  transform: translateX(-50%);
  background: rgba(20, 24, 28, .72); color: #fff;
  padding: .3rem .75rem; border-radius: 99px; white-space: nowrap;
  pointer-events: none; font-variant-numeric: tabular-nums;
}
.kd-chip.coords #mapLL { font-family: var(--bs-font-monospace); }

/* Leaflet denetimleri */
.leaflet-control-attribution { font-size: 10px; }
.leaflet-bottom { transition: bottom .2s; }

/* Mobil: panel alttan açılan sayfa (bottom sheet) */
@media (max-width: 767.98px) {
  :root { --kd-gap: 8px; }
  .kd-panel {
    top: auto !important; left: 0 !important; right: 0; bottom: 0;
    width: auto; max-height: 62dvh;
    border-radius: 16px 16px 0 0; border-bottom: 0;
    padding-bottom: env(safe-area-inset-bottom);
  }
  .kd-panel-head { cursor: pointer; }
  .kd-panel-head::before {
    content: ""; position: absolute; top: 5px; left: 50%; transform: translateX(-50%);
    width: 36px; height: 4px; border-radius: 2px; background: var(--bs-border-color);
  }
  .kd-panel-head { position: relative; padding-top: .85rem; }
  .leaflet-bottom { bottom: var(--kd-sheet-h); }
  .kd-chip { top: calc(var(--kd-gap) + 44px); bottom: auto; font-size: .75rem; }
  .kd-toolbar { left: var(--kd-gap); justify-content: flex-end; }
}