/* صفحه نقشه نواحی ثبتی — نقشه سمت راست، نتیجه و فهرست سمت چپ. */
.rd-shell {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 16px;
  padding: 16px;
  align-items: start;
}
.rd-map-panel { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.rd-hint {
  background: #f2f6f4; border: 1px solid #ccd5d2; border-radius: 8px;
  padding: 10px 12px; color: #17211e; font-size: 14px;
}
/* ارتفاع ثابت لازم است: Leaflet روی ظرفِ بی‌ارتفاع اصلاً رندر نمی‌شود. */
.rd-canvas { height: calc(100vh - 190px); min-height: 420px; border-radius: 10px; overflow: hidden; border: 1px solid #ccd5d2; }
.rd-side { display: flex; flex-direction: column; gap: 14px; }
/* پنل‌های کناری به ارتفاع محتوای خودشان‌اند. بدون این، min-height سراسری .panel
   (۴۶۰ پیکسل، برای فرم‌های بلند ماشین‌حساب) زیر دکمه‌ی استعلام فضای خالی بزرگ می‌ساخت. */
.rd-side .panel { padding: 14px; min-height: 0; }
.rd-pick-panel { display: flex; flex-direction: column; gap: 10px; }
.rd-pick-panel h3 { margin: 0; }
.rd-pick-panel .rd-coords { margin: 0; }
.rd-pick-panel .button { width: 100%; }

/* نوار پیشرفت زیر دکمه. مدتش با همان ثابتِ جاوااسکریپت تنظیم می‌شود (--rd-wait). */
.rd-loading { display: flex; flex-direction: column; gap: 6px; }
.rd-loading-track { height: 5px; border-radius: 99px; background: #e3ebe8; overflow: hidden; }
.rd-loading-track > i { display: block; height: 100%; width: 0; border-radius: 99px; background: #123c35; animation: rd-fill var(--rd-wait, 5s) linear forwards; }
@keyframes rd-fill { from { width: 0; } to { width: 100%; } }
.rd-loading-text { color: #5a6b65; font-size: 12.5px; }
@media (prefers-reduced-motion: reduce) { .rd-loading-track > i { animation-duration: 1ms; width: 100%; } }
.rd-side h3 { margin: 0 0 10px; color: #123c35; font-size: 15px; }
.rd-coords { font-size: 14px; color: #17211e; margin-bottom: 12px; line-height: 1.9; }
.rd-coords code { direction: ltr; display: inline-block; background: #f2f6f4; padding: 1px 6px; border-radius: 4px; }

.rd-pairs { display: flex; flex-direction: column; gap: 8px; margin: 0 0 12px; }
.rd-pairs > div { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; border-bottom: 1px dashed #dde5e2; padding-bottom: 7px; }
.rd-pairs > div:last-child { border-bottom: 0; }
.rd-pairs dt { color: #5a6b65; font-size: 13px; }
.rd-pairs dd { margin: 0; color: #123c35; font-size: 14px; font-weight: 700; }

/* انتخاب معبر: چند گزینه با عرض و فاصله، چون انتخاب خودکار عدد گزارش را عوض می‌کند. */
.rd-streets { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 10px; }
.rd-streets-title { color: #5a6b65; font-size: 12.5px; }
.rd-street { display: flex; align-items: baseline; gap: 7px; padding: 7px 9px; border: 1px solid #ccd5d2; border-radius: 8px; font-size: 13px; cursor: pointer; }
.rd-street:hover { border-color: #123c35; }
.rd-street.is-governing { border-color: #123c35; background: rgba(18,60,53,.06); }
.rd-street input { margin: 0; accent-color: #123c35; }
.rd-street-tag { color: #5a6b65; font-size: 11px; white-space: nowrap; }
.rd-street-w { color: #123c35; font-weight: 700; white-space: nowrap; }
.rd-street-n { color: #17211e; flex: 1; min-width: 0; }
.rd-street-d { color: #5a6b65; font-size: 11.5px; white-space: nowrap; }

.rd-print { width: 100%; margin-top: 4px; }

.rd-found { font-size: 20px; font-weight: 700; color: #123c35; margin-bottom: 8px; }
.rd-meta { font-size: 13px; color: #5a6b65; line-height: 1.9; }
.rd-warn { background: #fdf3e3; border: 1px solid #d6a44d; border-radius: 8px; padding: 10px; margin-top: 10px; font-size: 13px; color: #6b4d16; }
.rd-error { color: #c4322b; font-size: 14px; }

@media (max-width: 900px) {
  .rd-shell { grid-template-columns: 1fr; }
  .rd-canvas { height: 60vh; }
}
