/* ========== UserAdding Road Panel ========== */
.ua-road-panel { display:none; }

.ua-road-map { display:none; }
.ua-meta { display:flex; align-items:center; gap:8px; padding:8px 0; }
.ua-meta-label { font-weight:700; color:#1f2937; }
.ua-meta-value { font-weight:600; color:#374151; background:#f3f4f6; border:1px solid #e5e7eb; border-radius:6px; padding:4px 8px; }

/* Dikey yığın toolbar - ana çerçeve yok */
.ua-toolbar { position: relative; display: flex; flex-direction: column; gap: 8px; align-items: stretch; justify-content: flex-start; padding: 8px 0; }

.ua-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 8px; border: 1px solid #e5e7eb; background: #fff; color: #1f2937; font-weight: 600; font-size: 0.92em; transition: all 0.2s ease; box-shadow: 0 1px 2px rgba(0,0,0,0.05); width: 100%; justify-content: center; }
.ua-btn--primary { background: linear-gradient(135deg, #f97316 0%, #ea580c 100%); border-color: #ea580c; color: #fff; }
.ua-btn--primary:hover { background: linear-gradient(135deg, #fb923c 0%, #f97316 100%); box-shadow: 0 6px 12px rgba(251,146,60,0.25); }
.ua-btn--danger { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); border-color: #dc2626; color: #fff; }
.ua-btn--danger:hover { background: linear-gradient(135deg, #f87171 0%, #ef4444 100%); box-shadow: 0 6px 12px rgba(239,68,68,0.25); }
.ua-btn--success { background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%); border-color: #16a34a; color: #fff; }
.ua-btn--success:hover { background: linear-gradient(135deg, #34d399 0%, #10b981 100%); box-shadow: 0 6px 12px rgba(16,185,129,0.25); }
.ua-btn--ghost { background: #fff; border-color: #e5e7eb; color: #374151; }
.ua-btn--ghost:hover { background: #f9fafb; }

.ua-btn i { font-size: 0.95em; }
.ua-btn span { line-height: 1; }

.ua-btn:hover { transform: translateY(-1px); }

.ua-btn:active { transform: translateY(0); }
.ua-btn:disabled { opacity: 0.55; cursor: not-allowed; }

.ua-btn.active { background: linear-gradient(135deg, #fb923c 0%, #f97316 100%); color: #fff; border-color: #f97316; }

/* UserAdding module buttons (draw/undo/clear) */

/* Road buttons */
.road-draw-button {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  background: #007bff;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
}

.road-draw-button:hover {
  background: #0056b3;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.road-draw-button.active {
  background: #dc3545;
  animation: pulse 1s infinite;
}

.road-undo-button {
  position: absolute;
  top: 10px;
  right: 50px;
  width: 32px;
  height: 32px;
  background: #ffc107;
  color: #212529;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0.8;
}

.road-undo-button:hover {
  background: #e0a800;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  opacity: 1;
}

.road-undo-button:disabled {
  background: #6c757d;
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

.road-clear-button {
  position: absolute;
  top: 10px;
  right: 90px;
  width: 32px;
  height: 32px;
  background: #dc3545;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0.8;
}

.road-clear-button:hover {
  background: #c82333;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  opacity: 1;
}

.road-clear-button:disabled {
  background: #6c757d;
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

/* Water buttons */
.water-draw-button {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  background: #17a2b8;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
}

.water-draw-button:hover {
  background: #138496;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.water-draw-button.active {
  background: #dc3545;
  animation: pulse 1s infinite;
}

.water-undo-button {
  position: absolute;
  top: 10px;
  right: 50px;
  width: 32px;
  height: 32px;
  background: #ffc107;
  color: #212529;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0.8;
}

.water-undo-button:hover {
  background: #e0a800;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  opacity: 1;
}

.water-undo-button:disabled {
  background: #6c757d;
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

.water-clear-button {
  position: absolute;
  top: 10px;
  right: 90px;
  width: 32px;
  height: 32px;
  background: #dc3545;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0.8;
}

.water-clear-button:hover {
  background: #c82333;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  opacity: 1;
}

.water-clear-button:disabled {
  background: #6c757d;
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

/* Lake buttons */
.lake-draw-button {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  background: #20c997;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
}

.lake-draw-button:hover {
  background: #1ea085;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.lake-draw-button.active {
  background: #dc3545;
  animation: pulse 1s infinite;
}

.lake-undo-button {
  position: absolute;
  top: 10px;
  right: 50px;
  width: 32px;
  height: 32px;
  background: #ffc107;
  color: #212529;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0.8;
}

.lake-undo-button:hover {
  background: #e0a800;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  opacity: 1;
}

.lake-undo-button:disabled {
  background: #6c757d;
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

.lake-clear-button {
  position: absolute;
  top: 10px;
  right: 90px;
  width: 32px;
  height: 32px;
  background: #dc3545;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0.8;
}

.lake-clear-button:hover {
  background: #c82333;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  opacity: 1;
}

.lake-clear-button:disabled {
  background: #6c757d;
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

/* Electric buttons */
.electric-draw-button {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  background: #fd7e14;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
}

.electric-draw-button:hover {
  background: #e8690b;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

.electric-draw-button.active {
  background: #dc3545;
  animation: pulse 1s infinite;
}

.electric-undo-button {
  position: absolute;
  top: 10px;
  right: 50px;
  width: 32px;
  height: 32px;
  background: #ffc107;
  color: #212529;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0.8;
}

.electric-undo-button:hover {
  background: #e0a800;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  opacity: 1;
}

.electric-undo-button:disabled {
  background: #6c757d;
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

.electric-clear-button {
  position: absolute;
  top: 10px;
  right: 90px;
  width: 32px;
  height: 32px;
  background: #dc3545;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 14px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  opacity: 0.8;
}

.electric-clear-button:hover {
  background: #c82333;
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  opacity: 1;
}

.electric-clear-button:disabled {
  background: #6c757d;
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}