.nehir-annotation-hotspot {
  position: absolute;
  left: 0;
  top: 0;
  width: 0 !important;
  height: 0 !important;
  overflow: visible !important;
  pointer-events: none;
  transform-origin: 0 0;
}

/*
 * Panorama hareket ederken canlı backdrop örneklemesini durdurur. Etiketler,
 * metinler, arka plan renkleri ve panorama çözünürlüğü değişmeden kalır.
 */
html.is-panorama-moving .annotation-shell,
html.is-panorama-moving .annotation-title,
html.is-panorama-moving .view-nav,
html.is-panorama-moving .atmosphere-panel {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.nehir-annotation-overlay {
  position: absolute;
  z-index: 6;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  contain: layout style;
}

.annotation-visual {
  --annotation-accent: #f4a340;
  --annotation-ink: #173f35;
  --annotation-bg: #ffffff;
  --annotation-surface: rgba(255, 255, 255, .88);
  --annotation-scale: 1;
  --annotation-width: 190px;
  --annotation-font-size: 15px;
  --annotation-offset-x: 0px;
  --annotation-offset-y: 0px;
  --annotation-rotation: 0deg;
  --annotation-blur: 10px;
  --annotation-border-width: 1px;
  --annotation-letter-spacing: 0;
  position: absolute;
  left: 0;
  top: 0;
  width: max-content;
  max-width: var(--annotation-width);
  border: 0;
  color: var(--annotation-ink);
  font: inherit;
  text-align: left;
  letter-spacing: var(--annotation-letter-spacing);
  opacity: var(--annotation-opacity, 1);
  filter: drop-shadow(0 10px 18px rgba(20, 43, 36, .18));
  transform-origin: center center;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}

.annotation-visual[data-anchor-mode="surface"] {
  transform-origin: 0 0;
  will-change: transform;
}

.annotation-visual[data-interactive="true"] {
  cursor: pointer;
  pointer-events: auto;
}

.annotation-visual.is-selected[data-interactive="true"] {
  cursor: move;
}

.annotation-visual[data-interactive="true"]:focus-visible {
  outline: 3px solid rgba(255, 255, 255, .95);
  outline-offset: 4px;
}

.annotation-shell {
  display: flex;
  align-items: center;
  min-width: 0;
  color: inherit;
  border-width: var(--annotation-border-width);
}

.annotation-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  color: currentColor;
}

.annotation-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.annotation-copy {
  display: grid;
  min-width: 0;
}

.annotation-title {
  overflow: hidden;
  font-size: var(--annotation-font-size);
  font-weight: 760;
  line-height: 1.16;
  text-overflow: ellipsis;
}

.annotation-text {
  margin-top: 3px;
  overflow: hidden;
  color: color-mix(in srgb, var(--annotation-ink) 72%, transparent);
  font-size: calc(var(--annotation-font-size) * .76);
  font-weight: 520;
  line-height: 1.3;
  text-overflow: ellipsis;
}

.annotation-text:empty,
.annotation-title:empty {
  display: none;
}

.nehir-annotation-pin .annotation-visual {
  transform:
    translate(calc(-50% + var(--annotation-offset-x)), calc(-100% + var(--annotation-offset-y)))
    scale(calc(var(--annotation-scale) * var(--annotation-camera-scale, 1)));
  transform-origin: 50% 100%;
}

.nehir-annotation-pin .annotation-shell {
  position: relative;
  gap: 9px;
  min-height: 42px;
  padding: 7px 12px 7px 7px;
  border-style: solid;
  border-color: rgba(255, 255, 255, .88);
  border-radius: 15px;
  background: var(--annotation-surface);
  box-shadow: 0 10px 28px rgba(20, 43, 36, .17);
  backdrop-filter: blur(var(--annotation-blur));
}

.nehir-annotation-pin .annotation-shell::after {
  position: absolute;
  left: 21px;
  bottom: -9px;
  width: 17px;
  height: 17px;
  border-right: 1px solid rgba(255, 255, 255, .88);
  border-bottom: 1px solid rgba(255, 255, 255, .88);
  background: var(--annotation-surface);
  content: "";
  transform: rotate(45deg);
}

.nehir-annotation-pin .annotation-icon {
  z-index: 1;
  width: 34px;
  height: 34px;
  padding: 8px;
  border-radius: 11px;
  background: var(--annotation-accent);
  color: #fff;
}

.nehir-annotation-floating .annotation-visual,
.nehir-annotation-building .annotation-visual,
.nehir-annotation-roof .annotation-visual,
.nehir-annotation-area .annotation-visual {
  transform:
    translate(calc(-50% + var(--annotation-offset-x)), calc(-50% + var(--annotation-offset-y)))
    rotate(var(--annotation-rotation))
    scale(calc(var(--annotation-scale) * var(--annotation-camera-scale, 1)));
}

.nehir-annotation-floating .annotation-shell {
  gap: 10px;
  min-height: 45px;
  padding: 9px 14px 9px 9px;
  border-style: solid;
  border-color: color-mix(in srgb, var(--annotation-accent) 30%, white);
  border-radius: 14px;
  background: var(--annotation-surface);
  box-shadow: 0 12px 30px rgba(20, 43, 36, .17);
  backdrop-filter: blur(var(--annotation-blur));
}

.nehir-annotation-floating .annotation-icon {
  width: 30px;
  height: 30px;
  padding: 7px;
  border-radius: 9px;
  background: color-mix(in srgb, var(--annotation-accent) 18%, white);
  color: var(--annotation-accent);
}

.nehir-annotation-building .annotation-visual {
  transform:
    translate(calc(-50% + var(--annotation-offset-x)), calc(-100% + var(--annotation-offset-y)))
    rotate(var(--annotation-rotation))
    scale(calc(var(--annotation-scale) * var(--annotation-camera-scale, 1)));
  transform-origin: 50% 100%;
}

.nehir-annotation-building .annotation-shell {
  gap: 8px;
  padding: 8px 13px 8px 9px;
  border-style: solid;
  border-color: transparent;
  border-left-width: max(4px, var(--annotation-border-width));
  border-left-color: var(--annotation-accent);
  border-radius: 7px;
  background: var(--annotation-surface);
  box-shadow: 0 9px 24px rgba(20, 43, 36, .18);
  backdrop-filter: blur(var(--annotation-blur));
}

.nehir-annotation-building .annotation-icon {
  width: 25px;
  height: 25px;
  color: var(--annotation-accent);
}

.nehir-annotation-building .annotation-visual::after {
  position: absolute;
  left: 50%;
  top: 100%;
  width: 2px;
  height: 26px;
  background: linear-gradient(var(--annotation-accent), transparent);
  content: "";
}

.nehir-annotation-roof .annotation-shell {
  gap: 8px;
  padding: 7px 13px;
  border-style: solid;
  border-color: color-mix(in srgb, var(--annotation-accent) 75%, white);
  border-radius: 6px;
  background: var(--annotation-surface);
  box-shadow: 0 9px 24px rgba(20, 43, 36, .16);
  backdrop-filter: blur(var(--annotation-blur));
}

.nehir-annotation-roof .annotation-icon {
  width: 22px;
  height: 22px;
  color: var(--annotation-accent);
}

.nehir-annotation-road .annotation-visual {
  transform:
    translate(calc(-50% + var(--annotation-offset-x)), calc(-50% + var(--annotation-offset-y)))
    perspective(520px)
    rotateX(58deg)
    rotateZ(var(--annotation-rotation))
    scale(calc(var(--annotation-scale) * var(--annotation-camera-scale, 1)));
}

.nehir-annotation-road .annotation-shell {
  justify-content: center;
  gap: 8px;
  min-width: var(--annotation-width);
  padding: 8px 18px;
  border-style: solid;
  border-width: max(2px, var(--annotation-border-width));
  border-color: color-mix(in srgb, var(--annotation-accent) 84%, white);
  border-radius: 999px;
  background: var(--annotation-surface);
  box-shadow:
    0 0 0 5px color-mix(in srgb, var(--annotation-ink) 10%, transparent),
    0 14px 24px rgba(20, 43, 36, .16);
  text-align: center;
  backdrop-filter: blur(var(--annotation-blur));
}

.nehir-annotation-road .annotation-icon {
  width: 24px;
  height: 24px;
  color: var(--annotation-accent);
}

.nehir-annotation-road .annotation-text {
  display: none;
}

.nehir-annotation-area .annotation-shell {
  justify-content: center;
  min-width: var(--annotation-width);
  min-height: 72px;
  padding: 12px 20px;
  border-style: dashed;
  border-width: max(2px, var(--annotation-border-width));
  border-color: color-mix(in srgb, var(--annotation-accent) 84%, white);
  border-radius: 18px;
  background: color-mix(in srgb, var(--annotation-accent) 12%, transparent);
  box-shadow: inset 0 0 30px color-mix(in srgb, var(--annotation-accent) 11%, transparent);
  text-align: center;
  backdrop-filter: blur(2px);
}

.nehir-annotation-area .annotation-icon {
  display: none;
}

.annotation-visual[data-font-style="condensed"] {
  font-family: "Arial Narrow", "Aptos Narrow", "Inter", sans-serif;
  font-stretch: condensed;
}

.annotation-visual[data-font-style="technical"] {
  font-family: "Cascadia Mono", "Consolas", monospace;
}

.annotation-visual[data-font-style="serif"] {
  font-family: "Georgia", "Times New Roman", serif;
}

.annotation-visual[data-font-style="display"] .annotation-title {
  font-weight: 900;
  letter-spacing: max(.03em, var(--annotation-letter-spacing));
}

.annotation-visual[data-uppercase="true"] .annotation-title {
  text-transform: uppercase;
}

.annotation-visual[data-shape="pill"] .annotation-shell {
  border-radius: 999px;
}

.annotation-visual[data-shape="square"] .annotation-shell {
  border-radius: 3px;
}

.annotation-visual[data-shape="tag"] .annotation-shell {
  border-radius: 4px 14px 14px 4px;
}

.annotation-visual[data-theme="transparent"] .annotation-shell {
  border-color: color-mix(in srgb, var(--annotation-accent) 44%, transparent);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.annotation-visual[data-theme="outline"] .annotation-shell {
  border-color: var(--annotation-accent);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.annotation-visual[data-theme="solid"] .annotation-shell {
  background: var(--annotation-bg);
  box-shadow: 0 10px 24px rgba(20, 43, 36, .16);
  backdrop-filter: none;
}

.annotation-visual[data-theme="accent"] .annotation-shell {
  border-color: color-mix(in srgb, var(--annotation-accent) 74%, black);
  background: var(--annotation-accent);
  color: #fff;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--annotation-accent) 25%, transparent);
  backdrop-filter: none;
}

.annotation-visual[data-theme="accent"] .annotation-text {
  color: rgba(255, 255, 255, .78);
}

.annotation-visual[data-theme="accent"] .annotation-icon {
  background: rgba(255, 255, 255, .18);
  color: #fff;
}

.annotation-visual[data-theme="dark-glass"] .annotation-shell {
  border-color: rgba(255, 255, 255, .25);
  background: rgba(20, 48, 40, .72);
  color: #fff;
  box-shadow: 0 12px 28px rgba(9, 29, 23, .28);
  backdrop-filter: blur(var(--annotation-blur)) saturate(1.15);
}

.annotation-visual[data-theme="dark-glass"] .annotation-text {
  color: rgba(255, 255, 255, .7);
}

.annotation-visual[data-theme="minimal"] .annotation-shell {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.annotation-visual[data-theme="minimal"] .annotation-icon {
  background: transparent;
  color: var(--annotation-accent);
}

.annotation-visual[data-theme="vector"] {
  filter:
    drop-shadow(0 2px 0 rgba(255, 255, 255, .95))
    drop-shadow(0 7px 13px rgba(16, 43, 35, .28));
}

.annotation-visual[data-theme="vector"] .annotation-shell {
  gap: 6px;
  min-width: 0;
  padding: 2px;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--annotation-accent);
  backdrop-filter: none;
}

.annotation-visual[data-theme="vector"] .annotation-icon {
  width: max(38px, calc(var(--annotation-font-size) * 2.9));
  height: max(38px, calc(var(--annotation-font-size) * 2.9));
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--annotation-accent);
}

.annotation-visual[data-theme="vector"] .annotation-icon svg {
  stroke-width: 2.35;
}

.annotation-visual[data-theme="vector"] .annotation-title {
  padding: 4px 7px;
  border-radius: 7px;
  background: rgba(255, 255, 255, .76);
  color: var(--annotation-ink);
  backdrop-filter: blur(var(--annotation-blur));
}

.annotation-visual[data-theme="vector"] .annotation-title:empty,
.annotation-visual[data-theme="vector"] .annotation-text {
  display: none;
}

.annotation-visual[data-background-empty="true"] .annotation-shell {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.annotation-visual[data-background-mode="color"] .annotation-shell {
  background: var(--annotation-surface) !important;
  backdrop-filter: blur(var(--annotation-blur)) saturate(1.08) !important;
}

.annotation-visual[data-background-empty="true"] .annotation-title {
  background: transparent !important;
  backdrop-filter: none !important;
}

.nehir-annotation-pin
  .annotation-visual[data-background-empty="true"]
  .annotation-shell::after,
.nehir-annotation-pin
  .annotation-visual[data-theme="transparent"]
  .annotation-shell::after {
  display: none;
}

.annotation-editor {
  position: absolute;
  z-index: 12;
  top: 0;
  left: 0;
  min-width: 20px;
  min-height: 18px;
  border: 1.5px solid #f0a24a;
  border-radius: 8px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .86);
  pointer-events: none;
  transform-origin: 0 0;
}

.annotation-editor::before {
  position: absolute;
  top: -24px;
  left: 50%;
  width: 1px;
  height: 23px;
  background: #f0a24a;
  content: "";
  transform: translateX(-50%);
}

.annotation-editor button {
  box-sizing: border-box;
  display: grid;
  width: 28px;
  height: 28px;
  padding: 6px;
  place-items: center;
  border: 1px solid rgba(23, 63, 53, .15);
  background: rgba(255, 253, 249, .97);
  box-shadow: 0 5px 16px rgba(20, 43, 36, .2);
  color: #173f35;
  cursor: pointer;
  pointer-events: auto;
  backdrop-filter: blur(10px);
}

.annotation-editor button:hover {
  background: #fff0dc;
  color: #a65f16;
}

.annotation-editor button svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.annotation-editor__toolbar {
  position: absolute;
  top: -35px;
  left: 0;
  display: flex;
  gap: 4px;
  pointer-events: auto;
}

.annotation-editor__toolbar button {
  border-radius: 8px;
}

.annotation-editor__handle {
  position: absolute;
  border-radius: 50%;
}

.annotation-editor__handle--rotate {
  top: -37px;
  left: 50%;
  cursor: grab !important;
  transform: translateX(-50%);
}

.annotation-editor__handle--rotate:active {
  cursor: grabbing !important;
}

.annotation-editor__handle--resize {
  right: -14px;
  bottom: -14px;
  cursor: nwse-resize !important;
}

.nehir-annotation-pin .annotation-visual[data-theme="minimal"] .annotation-shell::after,
.nehir-annotation-pin .annotation-visual[data-theme="vector"] .annotation-shell::after,
.nehir-annotation-pin .annotation-visual[data-theme="outline"] .annotation-shell::after {
  display: none;
}

@media (prefers-reduced-motion: no-preference) {
  .annotation-visual[data-interactive="true"] {
    transition: filter .16s ease, opacity .16s ease;
  }

  .annotation-visual[data-interactive="true"]:hover {
    filter: drop-shadow(0 13px 24px rgba(20, 43, 36, .25)) brightness(1.025);
  }
}

@media (max-width: 680px) {
  .annotation-visual {
    --annotation-scale: .88;
  }
}
