.card-header {
  background-color: var(--bs-primary);

}

.card-header .card-title {
  color: var(--bs-white);
  margin: 0;
}

.card,
.card-header:first-child {
  border-radius: var(--card-inner-border-radius) var(--card-inner-border-radius) 0 0 !important;
}

.card-body {
  background-color: var(--table-background);
  padding: 40px;

}

.card-footer {
  background: none;
  border-top: 1px solid var(--bs-primary);
}

.inner-card {
  background-color: var(--bs-white);
  padding: 50px;
  border-radius: var(--border-radius);
}

.user-form .form-control {
  height: 45px !important;
  padding: 0px 20px 2px !important;
  color: var(--bs-black);
  background-color: var(--table-background);
}

button.btn.btn-primary:hover {
  background-color: var(--bs-secondary);
}

@media only screen and (max-width:500px) {
    .inner-card {
        padding: 20px;
    }
}

@media only screen and (max-width:320px) {
    .card-body {
        padding: 10px;
    }
}