/* Table headers use primary color and bold */
.table thead th,
table thead th,
thead th,
th {
    /*background-color: var(--bs-primary) !important;*/
    color: var(--bs-primary) !important;
    font-weight: 700 !important;
    border-color: var(--bs-primary) !important;
}

/* Bootstrap primary color override */
:root {
  --bs-primary: #ff7800;
  --bs-primary-rgb: 255, 120, 0;
}

/* Bootstrap 4 does not use CSS variables; add concrete overrides to ensure primary color is applied */
.btn-primary,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary:disabled {
  background-color: #ff7800 !important;
  border-color: #ff7800 !important;
  color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus:hover {
  background-color: #e66a00 !important; /* slightly darker */
  border-color: #e66a00 !important;
}

.btn-outline-primary {
  color: #ff7800 !important;
  border-color: #ff7800 !important;
  background-color: transparent !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  color: #ffffff !important;
  background-color: #ff7800 !important;
  border-color: #ff7800 !important;
}

.bg-primary {
  background-color: #ff7800 !important;
  color: #ffffff !important;
}

.text-primary {
  color: #ff7800 !important;
}

.border-primary {
  border-color: #ff7800 !important;
}

.badge-primary {
  background-color: #ff7800 !important;
  color: #ffffff !important;
}

.alert-primary {
  background-color: #ff7800 !important;
  color: #ffffff !important;
  border-color: #ff7800 !important;
}

/* Optional: links using .text-primary on hover */
a.text-primary:hover {
  color: #e66a00 !important;
}

html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  /*margin-bottom: 60px;*/
}

/* Footer banner sizing to avoid overlapping content */
.footer img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}

@media (max-width: 576px) {
  .footer img {
    height: 70px;
  }
}

.circle-image {
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
    width: 50px;
    height: 50px;
}

.circle-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.form-group {
    margin-top: 15px;
}