/*
 * Hospital theme additions, loaded after main.css (the template's own
 * styles, unchanged). Bootstrap's own primary buttons and form focus use
 * the template's accent colour, so forms and empty states match the
 * section buttons the template already styles.
 */

.btn-primary {
  --bs-btn-bg: var(--accent-color);
  --bs-btn-border-color: var(--accent-color);
  --bs-btn-hover-bg: color-mix(in srgb, var(--accent-color), #000 12%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--accent-color), #000 12%);
  --bs-btn-active-bg: color-mix(in srgb, var(--accent-color), #000 18%);
  --bs-btn-active-border-color: color-mix(in srgb, var(--accent-color), #000 18%);
  --bs-btn-disabled-bg: var(--accent-color);
  --bs-btn-disabled-border-color: var(--accent-color);
}

.btn-outline-primary {
  --bs-btn-color: var(--accent-color);
  --bs-btn-border-color: var(--accent-color);
  --bs-btn-hover-bg: var(--accent-color);
  --bs-btn-hover-border-color: var(--accent-color);
  --bs-btn-active-bg: var(--accent-color);
  --bs-btn-active-border-color: var(--accent-color);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--accent-color);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--accent-color), transparent 75%);
}

.form-label {
  font-weight: 500;
  color: var(--heading-color);
}

/* The company name (Company Setup) can be long: keep the header on one line. */
.header .logo h1.sitename {
  font-size: clamp(1rem, 2.6vw, 1.6rem);
  max-width: 55vw;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Service cards: equal heights, the request link at the bottom. */
.featured-departments .department-card .department-content p:last-of-type {
  color: var(--heading-color);
}

/* Request form and confirmation. */
.request-form-card {
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--default-color), transparent 88%);
}

.request-confirmation {
  border-left: 4px solid var(--accent-color);
}

.request-confirmation .reference {
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--heading-color);
}

@media (max-width: 575px) {
  .request-form-card {
    padding: 1.25rem !important;
  }
}
