.gate-body {
  background: #f1f5f9;
}

.pin-display {
  display: flex;
  justify-content: center;
  gap: 16px;
}

.pin-dot {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid #94a3b8;
  display: inline-block;
  background: transparent;
  transition: background .15s ease;
}

.pin-dot.filled {
  background: #0d6efd;
  border-color: #0d6efd;
}

.keypad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  max-width: 320px;
  margin: 0 auto;
}

.keypad-btn {
  font-size: 1.5rem;
  padding: 1rem 0;
  border-radius: 12px;
}

.event-select-btn {
  min-height: 80px;
}

.vehicle-card .card-body {
  padding: 1.25rem;
}

#searchBox {
  border-radius: 12px;
}

.nav-pills .nav-link {
  cursor: pointer;
}