/* Ara durak seçimi (plan: uploads/Md_plans/ARA_DURAK_PLANI.md §3)
   İlke: durak eklenmezse arama kartı birebir aynı kalır; buton etiket satırında durur. */

.reservation-slot-from.has-stop-add { position: relative; }

.stop-add-link {
  position: absolute;
  top: 0;
  right: 14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 12px;
  padding: 0;
  border: 0;
  background: none;
  color: #f05d19;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 12px;
  letter-spacing: .2px;
  cursor: pointer;
  white-space: nowrap;
}
.stop-add-link i { font-size: 11px; line-height: 1; }
.stop-add-link:hover { color: #c84a10; text-decoration: underline; }
.stop-add-link:disabled { color: #94a3b8; cursor: not-allowed; text-decoration: none; }

/* Duraklar Nereden kutusunun altında alt alta dizilir; aralarındaki noktalı oklar
   (Nereden → 1 → 2 → 3 → Nereye) intermediate-stops.js içindeki SVG katmanıyla çizilir.
   Şerit ana satırın içindedir: dar ekranda Nereden/Nereye satırının hemen altına,
   geniş ekranda (grid) tüm alanların altına düşer. Sütun hizası JS'in verdiği değişkenlerle. */
.stops-strip {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 22px;
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
  padding-top: 10px;
  padding-bottom: 2px;
}
.stops-strip.d-none { display: none !important; }
@media (min-width: 1200px) {
  .reservation-main-row > .stops-strip { order: 99; grid-column: 1 / -1; }
}
@media (max-width: 1199px) {
  .reservation-main-row > .stops-strip { margin-bottom: 12px; padding-top: 12px; }
}

.stops-links {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  color: #f05d19;
  z-index: 0;
}
.stops-links .stop-link {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 0 5;
  opacity: .55;
}
.stops-links marker path { opacity: .7; }

.stop-item {
  position: relative;
  z-index: 1;
  width: var(--stop-col-w, 100%);
  max-width: 100%;
  margin-left: var(--stop-col-x, 0);
}
.stop-item.d-none { display: none !important; }

.stops-strip .stop-item .reservation-field {
  height: 42px;
  min-height: 42px;
  padding: 0 6px 0 var(--stop-badge-pad, 14px);
  border-radius: 13px !important;
  gap: 2px;
}
.stops-strip .stop-item .reservation-input {
  height: 40px;
  min-height: 40px;
  font-size: 13.5px;
}

.stop-badge {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #fff1e8;
  border: 1px solid #ffd6bf;
  color: #f05d19;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.stop-remove {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #94a3b8;
  font-size: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.stop-remove:hover { background: #fee2e2; color: #dc2626; }

.stop-return-toggle {
  margin: -10px 0 0 calc(var(--stop-col-x, 0px) + 6px);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  white-space: nowrap;
  cursor: pointer;
}
.stop-return-toggle.d-none { display: none !important; }
.stop-return-toggle input { margin: 0; accent-color: #f05d19; }

form.mode-hourly .stop-add-link,
form.mode-hourly .stops-strip { display: none !important; }

/* Sonuç sayfası düzenleme: mevcut duraklar yalnız çıkarılabilir */
.trip-edit-stops { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.trip-edit-stops.d-none { display: none !important; }
.trip-stop-chip {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  padding: 2px 4px 2px 6px; border: 1px solid #e2e8f0; border-radius: 999px;
  background: #f8fafc; font-size: 12.5px; color: #334155;
}
.trip-stop-chip-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 220px; }

/* Rota gösterimi (sonuç, yolcu, onay, detay ekranları) */
.route-seg-km { color: #f05d19; font-weight: 600; text-transform: none; letter-spacing: 0; }
.route-stop.via .route-dot { background: #f05d19; width: 10px; height: 10px; left: calc(-1.6rem + 1px); }
.route-stop.via.is-removed .summary-loc,
.route-stop.via.is-removed .loc-value { text-decoration: line-through; color: #94a3b8; }
.route-stops-inline { color: #f05d19; font-weight: 600; font-size: .85em; white-space: nowrap; }
.route-stop-list { list-style: none; margin: 4px 0 0; padding: 0; }
.route-stop-list li { display: flex; gap: 6px; align-items: baseline; font-size: .9em; color: #475569; }
.route-stop-list li .route-stop-no { color: #f05d19; font-weight: 700; min-width: 16px; }
.route-stop-list li.is-removed { text-decoration: line-through; color: #94a3b8; }
