:root {
  --boardops-primary: #245a78;
  --boardops-primary-rgb: 36, 90, 120;
  --bs-primary: var(--boardops-primary);
  --bs-primary-rgb: var(--boardops-primary-rgb);
}

body {
  min-height: 100vh;
  background: #f5f7f9;
}

.bg-primary {
  background-color: var(--boardops-primary) !important;
}

.btn-primary {
  --bs-btn-bg: var(--boardops-primary);
  --bs-btn-border-color: var(--boardops-primary);
  --bs-btn-hover-bg: #1b475f;
  --bs-btn-hover-border-color: #1b475f;
}

.app-container {
  max-width: 1440px;
}

.auth-shell {
  min-height: calc(100vh - 3rem);
}

.auth-card {
  width: min(100%, 30rem);
}

.user-label {
  max-width: 16rem;
}

.card-stat {
  border: 0;
  border-left: .25rem solid var(--boardops-primary);
}

.timeline {
  border-left: 2px solid #dce3e8;
  margin-left: .5rem;
  padding-left: 1.25rem;
}

.timeline-item {
  position: relative;
  padding-bottom: 1.25rem;
}

.timeline-item::before {
  background: var(--boardops-primary);
  border: 3px solid #f5f7f9;
  border-radius: 50%;
  content: "";
  height: .85rem;
  left: -1.72rem;
  position: absolute;
  top: .25rem;
  width: .85rem;
}

@media (max-width: 575.98px) {
  .app-container {
    padding-left: .85rem;
    padding-right: .85rem;
  }

  .table-responsive .btn {
    min-height: 2.5rem;
  }
}