/* InteractiveMap v2 - varsayılan stiller. Renkleri projeye göre değiştir. */

.im-wrapper {
  position: relative;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  overflow: hidden; /* zoom açıkken taşmayı keser */
}

.im-wrapper svg {
  width: 100%;
  height: auto;
  display: block;
}

/* Her bölge (ülke/path) */
.im-region {
  fill: #d6d6d6;
  stroke: #ffffff;
  stroke-width: 0.5;
  cursor: pointer;
  transition: fill 0.2s ease, transform 0.2s ease, filter 0.2s ease;
  transform-origin: center;
  transform-box: fill-box;
}

.im-region--static {
  cursor: default;
}

/* Klavye ile odaklanma (Tab tuşu) - erişilebilirlik */
.im-region:focus {
  outline: 2px dashed #333;
  outline-offset: 1px;
}
.im-region:focus:not(:focus-visible) {
  outline: none; /* fare tıklamasında görünmesin, sadece klavyede */
}

/* Hover / aktif durum - varsayılan (choropleth kullanılmıyorsa) */
.im-wrapper:not(.im-choropleth) .im-region.im-active {
  fill: #4f8ef7; /* proje rengine göre değiştir */
}

/* Hover efekti - choropleth ile de uyumlu çalışır (inline fill'in üstüne biner) */
.im-region.im-active {
  filter: brightness(0.88);
  transform: scale(1.03);
}

/* Zoom açıkken imleç davranışı */
.im-wrapper.im-zoomable {
  cursor: grab;
}
.im-wrapper.im-zoomable.im-dragging {
  cursor: grabbing;
}

/* Tooltip kutusu */
.im-tooltip {
  position: absolute;
  z-index: 10;
  pointer-events: none;
  background: #1a1a1a;
  color: #fff;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.4;
  max-width: 220px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}

.im-tooltip-desc {
  margin-top: 2px;
  font-size: 12px;
  opacity: 0.85;
}

/* Ülke merkezleri arasında katmanlı operasyon akışları */
.im-flow-layer { pointer-events: none; }
.im-flow-underlay, .im-flow {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.im-flow-underlay { stroke: rgba(255,255,255,.92); stroke-width: 4.8; opacity: .76; }
.im-flow-underlay--direct { stroke-width: 5.4; }
.im-flow {
  stroke-width: 1.8;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  opacity: .88;
  filter: drop-shadow(0 2px 2px rgba(7,22,36,.12));
  animation: imRouteReveal .9s cubic-bezier(.2,.72,.25,1) var(--im-reveal-delay, 0ms) forwards;
}
.im-flow--priority { stroke-width: 2.35; opacity: .98; }
.im-flow--agency { stroke-width: 2.05; }
.im-flow--direct { stroke-width: 2.7; opacity: .96; }
.im-flow-pulse { fill: #75d5dc; stroke: #fff; stroke-width: 1.25; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 5px rgba(32,192,203,.92)); }
.im-flow-pulse--priority { fill: #19b7c8; }
.im-flow-pulse--agency { fill: #e5a94d; filter: drop-shadow(0 0 5px rgba(217,154,61,.78)); }
.im-flow-pulse--direct { fill: #20c5cf; }
.im-flow-pulse--reverse { opacity: .68; }
.im-flow-node-layer { pointer-events: none; }
.im-flow-node__ring { fill: rgba(255,255,255,.72); stroke: #5d98a9; stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.im-flow-node__core { fill: #4f899d; stroke: #fff; stroke-width: 1; vector-effect: non-scaling-stroke; }
.im-flow-node--priority .im-flow-node__ring { stroke: #20b8c6; }
.im-flow-node--priority .im-flow-node__core { fill: #0b5c8e; }
.im-flow-node--agency .im-flow-node__ring { stroke: #d99a3d; }
.im-flow-node--agency .im-flow-node__core { fill: #bd7f2d; }
.im-flow-node--direct .im-flow-node__ring { stroke: #17698a; }
.im-flow-node--direct .im-flow-node__core { fill: #17698a; }
.im-flow-label { fill: #0b5c8e; font: 700 12px "DM Sans", sans-serif; letter-spacing: .04em; paint-order: stroke; stroke: rgba(248,250,252,.94); stroke-width: 4px; stroke-linejoin: round; }
.im-flow-layer[hidden] { display: none; }
.im-motion-paused .im-flow { animation-play-state: paused; }
.im-motion-paused .im-flow-pulse { visibility: hidden; }

@keyframes imRouteReveal { to { stroke-dashoffset: 0; } }

@media (prefers-reduced-motion: reduce) {
  .im-flow { animation: none; stroke-dasharray: none; stroke-dashoffset: 0; }
  .im-flow-pulse { display: none; }
}

@media (max-width: 760px) {
  .im-flow { animation-duration: .62s; }
  .im-flow-underlay { stroke-width: 3.8; opacity: .68; }
  .im-flow-pulse { display: none; }
  .im-flow-node__ring { r: 4.5; }
}
