/* ═══════════════════════════════════════════════════════════════════
   CengizHarita v20 — THEME 2026 (Kurumsal Komuta Merkezi)
   Glassmorphism + Neumorphism 2026 — 60/120 fps akıcı animasyonlar
   Bu dosya apple-theme.css sonra yüklenir ve son söz buradadır.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  /* Derin askeri-kurumsal palet */
  --c26-bg:        #050a12;
  --c26-bg-2:      #081220;
  --c26-bg-3:      #0b1a2c;
  --c26-panel:     rgba(12, 26, 44, .62);
  --c26-panel-2:   rgba(16, 32, 52, .78);
  --c26-glass:     rgba(255, 255, 255, .04);
  --c26-glass-2:   rgba(255, 255, 255, .07);
  --c26-stroke:    rgba(125, 196, 236, .18);
  --c26-stroke-2:  rgba(125, 196, 236, .34);

  --c26-accent:    #2de1f4;
  --c26-accent-2:  #39f5c8;
  --c26-accent-3:  #6aa7ff;
  --c26-warn:      #ffb020;
  --c26-danger:    #ff5470;
  --c26-success:   #3dd68c;

  --c26-text:      #eaf4ff;
  --c26-text-2:    #9cb4cf;
  --c26-text-3:    #c6d6e6;

  --c26-radius:    14px;
  --c26-radius-sm: 10px;
  --c26-radius-lg: 20px;

  --c26-blur:      18px;
  --c26-blur-lg:   28px;

  --c26-ease:      cubic-bezier(.22, 1, .36, 1);
  --c26-ease-in:   cubic-bezier(.4, 0, .2, 1);
  --c26-dur:       220ms;
  --c26-dur-lg:    420ms;

  --c26-shadow-nm:
    0 1px 0 rgba(255, 255, 255, .05) inset,
    0 -12px 24px rgba(3, 9, 18, .45) inset,
    0 16px 34px rgba(0, 0, 0, .45),
    0 0 0 1px var(--c26-stroke);

  --c26-shadow-hi:
    0 0 0 1px var(--c26-stroke-2),
    0 18px 48px rgba(45, 225, 244, .10),
    0 28px 60px rgba(0, 0, 0, .55);
}

/* Arka planın derinleştirilmesi - askeri uydu ortamı hissi */
html, body {
  background:
    radial-gradient(1100px 600px at 82% -10%, rgba(45, 225, 244, .10), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(57, 245, 200, .08), transparent 60%),
    radial-gradient(1200px 700px at 50% 50%, rgba(106, 167, 255, .05), transparent 65%),
    linear-gradient(180deg, #04080f 0%, #061020 50%, #040810 100%) !important;
  color: var(--c26-text) !important;
  font-family: 'Inter', 'Rajdhani', 'Segoe UI', sans-serif !important;
}

/* Grid overlay - kumanda paneli hissi */
body::before {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-image:
    linear-gradient(rgba(45, 225, 244, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(45, 225, 244, .04) 1px, transparent 1px) !important;
  background-size: 42px 42px !important;
  mask-image: radial-gradient(ellipse at center, rgba(0, 0, 0, .8) 0%, transparent 78%) !important;
  -webkit-mask-image: radial-gradient(ellipse at center, rgba(0, 0, 0, .8) 0%, transparent 78%) !important;
  opacity: .55 !important;
}

/* Aktif bir grain texture (noise) - kumanda merkezine film grain */
body::after {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .18  0 0 0 0 .24  0 0 0 0 .32  0 0 0 .05 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>") !important;
  opacity: .35 !important;
  mix-blend-mode: overlay !important;
}

/* ── Header: komuta çubuğu ─────────────────────────────────── */
#header {
  background: linear-gradient(180deg, rgba(6, 14, 26, .92), rgba(8, 20, 36, .82)) !important;
  border-bottom: 1px solid var(--c26-stroke) !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, .36), 0 0 0 1px rgba(255, 255, 255, .02) inset !important;
  backdrop-filter: blur(var(--c26-blur-lg)) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(var(--c26-blur-lg)) saturate(1.3) !important;
}

.logo-gem,
.splash-diamond {
  background:
    radial-gradient(circle at 30% 28%, rgba(255, 255, 255, .22), transparent 60%),
    linear-gradient(135deg, #2de1f4 0%, #0c819c 65%, #073647 100%) !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  box-shadow:
    0 0 0 1px rgba(8, 26, 36, .9),
    0 10px 22px rgba(45, 225, 244, .35),
    inset 0 1px 0 rgba(255, 255, 255, .25) !important;
  position: relative;
}

/* Kartlar: glass + neomorphic altlık */
.page,
.kart,
.card,
.panel,
.htb-panel,
.cogo-panel,
.login-box,
.stat-card,
.durum-karti,
.tablo-wrap,
.modal-ic,
.modal-box,
.popup-content,
.leaflet-popup-content-wrapper,
#aktif-proje,
#proje-listesi {
  background:
    linear-gradient(180deg, rgba(14, 28, 46, .72), rgba(8, 18, 32, .78)) !important;
  border: 1px solid var(--c26-stroke) !important;
  border-radius: var(--c26-radius) !important;
  backdrop-filter: blur(var(--c26-blur)) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(var(--c26-blur)) saturate(1.15) !important;
  box-shadow: var(--c26-shadow-nm) !important;
  color: var(--c26-text) !important;
  transition: border-color var(--c26-dur) var(--c26-ease),
              box-shadow var(--c26-dur) var(--c26-ease),
              transform var(--c26-dur) var(--c26-ease) !important;
}

.kart:hover,
.card:hover,
.stat-card:hover,
.durum-karti:hover {
  border-color: var(--c26-stroke-2) !important;
  box-shadow: var(--c26-shadow-hi) !important;
  transform: translateY(-2px);
}

/* Tablolar: daha okunaklı, satır highlight */
.tablo-wrap {
  overflow: hidden !important;
  padding: 2px !important;
}
table th {
  background: linear-gradient(180deg, rgba(16, 34, 54, .95), rgba(10, 24, 40, .9)) !important;
  color: #84e1f0 !important;
  letter-spacing: 1.3px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  border-bottom: 1px solid var(--c26-stroke-2) !important;
  padding: 12px 14px !important;
}
table td {
  border-bottom: 1px solid rgba(125, 196, 236, .1) !important;
  padding: 10px 14px !important;
  color: var(--c26-text-3) !important;
}
table tr:hover td {
  background: linear-gradient(90deg, rgba(45, 225, 244, .04), rgba(45, 225, 244, .08)) !important;
  color: var(--c26-text) !important;
}

/* Butonlar: neomorphic + hover glow, pill veya sharp */
button,
.btn,
.hdr-btn,
.mini-btn,
.htb-btn,
.cogo-btn,
.filter-btn,
.act-btn,
.login-submit,
.adm-logout,
.adm-back,
.upload-btn-inner,
.cikti-btn {
  background:
    linear-gradient(180deg, rgba(22, 42, 66, .85), rgba(10, 22, 38, .9)) !important;
  color: var(--c26-text) !important;
  border: 1px solid var(--c26-stroke-2) !important;
  border-radius: var(--c26-radius-sm) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 2px 4px rgba(0, 0, 0, .3),
    0 10px 22px rgba(0, 0, 0, .18) !important;
  letter-spacing: .8px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  transition: transform .18s var(--c26-ease),
              box-shadow .22s var(--c26-ease),
              border-color .22s var(--c26-ease),
              background var(--c26-dur) var(--c26-ease) !important;
  position: relative;
  overflow: hidden;
}
button::after,
.btn::after,
.cikti-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(45, 225, 244, .28), transparent 55%);
  opacity: 0;
  transition: opacity .25s var(--c26-ease);
  pointer-events: none;
}
button:hover::after,
.btn:hover::after,
.cikti-btn:hover::after { opacity: 1; }

button:hover,
.btn:hover,
.hdr-btn:hover,
.mini-btn:hover,
.htb-btn:hover,
.cogo-btn:hover,
.filter-btn:hover,
.act-btn:hover,
.cikti-btn:hover,
.upload-btn-inner:hover {
  border-color: var(--c26-accent) !important;
  color: #ffffff !important;
  transform: translateY(-1px) scale(1.01);
  box-shadow:
    0 0 0 1px rgba(45, 225, 244, .4),
    0 16px 28px rgba(45, 225, 244, .18),
    inset 0 1px 0 rgba(255, 255, 255, .1) !important;
}

button:active,
.btn:active,
.cikti-btn:active {
  transform: translateY(0) scale(.99);
  transition-duration: 80ms;
}

/* Primary / aktif buton — akıcı accent glow */
.login-submit,
.htb-btn.primary,
.upload-btn-inner,
.filter-btn.active,
.tab.active,
.cogo-tab.on,
.htb-btn.togl.on,
.bnav-item.active {
  background: linear-gradient(135deg, #2de1f4 0%, #15a9c0 60%, #0c7788 100%) !important;
  color: #04131a !important;
  border-color: rgba(255, 255, 255, .25) !important;
  box-shadow:
    0 0 0 1px rgba(45, 225, 244, .5),
    0 14px 30px rgba(45, 225, 244, .28),
    inset 0 1px 0 rgba(255, 255, 255, .35) !important;
}

/* Tehlike butonları */
.mini-btn.warn,
.act-banla,
.adm-logout {
  border-color: rgba(255, 84, 112, .5) !important;
  color: #ffcfd6 !important;
}
.act-onayla {
  border-color: rgba(61, 214, 140, .5) !important;
  color: #c8ffd9 !important;
}

/* Input alanları — glass + accent focus */
input,
select,
textarea,
.login-input,
.htb-sel {
  background: rgba(6, 14, 26, .72) !important;
  color: var(--c26-text) !important;
  border: 1px solid var(--c26-stroke) !important;
  border-radius: var(--c26-radius-sm) !important;
  backdrop-filter: blur(8px) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03), 0 0 0 0 rgba(45, 225, 244, 0) !important;
  transition: border-color var(--c26-dur) var(--c26-ease), box-shadow var(--c26-dur) var(--c26-ease) !important;
}
input:focus,
select:focus,
textarea:focus,
.login-input:focus,
.htb-sel:focus {
  border-color: var(--c26-accent) !important;
  box-shadow:
    0 0 0 3px rgba(45, 225, 244, .18),
    inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

/* Tabs — alt scroll bar olmadan */
.tabs,
.login-tabs,
.cogo-tabs,
#bottom-nav {
  background: linear-gradient(180deg, rgba(12, 26, 44, .78), rgba(6, 16, 28, .88)) !important;
  border: 1px solid var(--c26-stroke) !important;
  border-radius: var(--c26-radius) !important;
  backdrop-filter: blur(var(--c26-blur)) !important;
  -webkit-backdrop-filter: blur(var(--c26-blur)) !important;
}

/* Leaflet popup — askeri tarz koridor */
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background: rgba(8, 18, 32, .92) !important;
  color: var(--c26-text) !important;
  border: 1px solid var(--c26-stroke-2) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .55) !important;
}

/* Harita toolbar overlay — floating command bar */
#harita-toolbar {
  background: rgba(8, 18, 32, .85) !important;
  border: 1px solid var(--c26-stroke-2) !important;
  border-radius: var(--c26-radius) !important;
  backdrop-filter: blur(var(--c26-blur-lg)) saturate(1.3) !important;
  box-shadow: 0 10px 32px rgba(0, 0, 0, .55), 0 0 0 1px rgba(45, 225, 244, .08) inset !important;
}

/* Upload zone: cam + dashed glow */
.upload-zone {
  background:
    radial-gradient(ellipse at top, rgba(45, 225, 244, .08), transparent 60%),
    linear-gradient(180deg, rgba(14, 28, 46, .8), rgba(8, 18, 32, .88)) !important;
  border: 2px dashed rgba(45, 225, 244, .42) !important;
  border-radius: var(--c26-radius-lg) !important;
  backdrop-filter: blur(14px) !important;
  transition: border-color var(--c26-dur) var(--c26-ease),
              background var(--c26-dur) var(--c26-ease),
              transform var(--c26-dur) var(--c26-ease) !important;
}
.upload-zone:hover {
  border-color: var(--c26-accent) !important;
  transform: translateY(-2px);
  box-shadow: 0 24px 48px rgba(45, 225, 244, .18) !important;
}

/* Toast bildirimleri */
.toast,
.toast-item,
.toast-container > div {
  background: linear-gradient(180deg, rgba(12, 24, 42, .95), rgba(8, 18, 32, .98)) !important;
  color: var(--c26-text) !important;
  border: 1px solid var(--c26-stroke-2) !important;
  border-radius: var(--c26-radius) !important;
  backdrop-filter: blur(16px) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .5), 0 0 0 1px rgba(45, 225, 244, .12) inset !important;
  animation: c26-slide-in .45s var(--c26-ease) both;
}

@keyframes c26-slide-in {
  from { opacity: 0; transform: translateY(-12px) scale(.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes c26-fade-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes c26-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(45, 225, 244, .4); }
  50%      { box-shadow: 0 0 0 10px rgba(45, 225, 244, 0); }
}
@keyframes c26-scan {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

/* Sidebar/floating action buttons — FAB */
.c26-fab {
  position: fixed;
  right: 20px;
  bottom: 82px;
  z-index: 9000;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2de1f4, #0c7788) !important;
  color: #04131a !important;
  display: grid; place-items: center;
  border: 1px solid rgba(255, 255, 255, .22) !important;
  box-shadow:
    0 0 0 1px rgba(45, 225, 244, .4),
    0 20px 40px rgba(45, 225, 244, .32),
    inset 0 1px 0 rgba(255, 255, 255, .28) !important;
  cursor: pointer;
  font-size: 22px;
  transition: transform .2s var(--c26-ease), box-shadow .2s var(--c26-ease);
}
.c26-fab:hover { transform: translateY(-2px) scale(1.05); }
.c26-fab:active { transform: scale(.96); }

/* Stat cards üst radar çubuğu */
.stat-card {
  position: relative !important;
  overflow: hidden !important;
}
.stat-card::before {
  content: '';
  position: absolute;
  inset: 0;
  top: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--c26-accent), transparent);
  animation: c26-scan 3.2s ease-in-out infinite;
  opacity: .85;
}

.stat-card.pulse {
  animation: c26-pulse 2s ease-in-out infinite !important;
}

/* Smooth scrolling */
html { scroll-behavior: smooth; }

/* Scrollbar - kumanda konsolu */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: rgba(6, 14, 26, .6); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(45, 225, 244, .45), rgba(12, 119, 136, .5));
  border-radius: 6px;
  border: 2px solid rgba(6, 14, 26, .6);
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(45, 225, 244, .8), rgba(12, 119, 136, .9));
}

/* Selection */
::selection { background: rgba(45, 225, 244, .32); color: #04131a; }

/* Entrance animations for major blocks */
.page, .page.active { animation: c26-fade-in .5s var(--c26-ease) both; }

/* Responsive küçük ekran optimizasyonları */
@media (max-width: 768px) {
  .c26-fab { right: 14px; bottom: 78px; width: 48px; height: 48px; font-size: 18px; }
  body::before { background-size: 32px 32px !important; }
}

/* Accessibility: reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
