/* Only what Tailwind can't handle in our dynamic Django templates. */

/* Map containers — height is non-utility-friendly given Leaflet's needs. */
.map {
  width: 100%;
  height: 380px;
  border-radius: 0.5rem;
  overflow: hidden;
  border: 1px solid #e7e5e4; /* stone-200 */
}
.map.tall   { height: 520px; }
.map.short  { height: 260px; }

/* Status tags — emitted via Django template `status-{{ value }}` so we can't
   inline Tailwind classes per status without conditionals everywhere. */
.tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 600;
  background-color: #e7e5e4;     /* stone-200 */
  color: #44403c;                /* stone-700 */
  letter-spacing: 0.01em;
}
.tag.status-completed,
.tag.status-published     { background-color: #ccfbf1; color: #115e59; } /* teal-100/800 */
.tag.status-failed        { background-color: #ffe4e6; color: #9f1239; } /* rose-100/800 */
.tag.status-pending,
.tag.status-in_progress   { background-color: #fef3c7; color: #92400e; } /* amber-100/800 */
.tag.status-draft         { background-color: #e7e5e4; color: #44403c; } /* stone-200/700 */
.tag.status-archived      { background-color: #e7e5e4; color: #57534e; }

/* Tighten Leaflet draw control to match palette */
.leaflet-bar a {
  background-color: #ffffff;
  color: #44403c;
}
.leaflet-bar a:hover { background-color: #f5f5f4; }

/* Small visual tweak: form labels & code */
code {
  background-color: #f5f5f4;
  color: #44403c;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 0.92em;
}