@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,700,800");
:root {
  /* Bootstrap 5 variables mapping (override as needed) */
  --bs-primary: #205493;
  --bs-secondary: #0071bc;
  --bs-success: #4aa564;
  --bs-info: #00a6d2;
  --bs-warning: #f9c642;
  --bs-danger: #cd2026;
  --bs-light: #d6d7d9;
  --bs-dark: #323a45;

  --font-family-sans-serif: 'Open Sans', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-family-serif: Merriweather, serif;
  --font-family-text: var(--font-family-serif);

  --dcounty-blue: #003352;
  --dts-blue: #2d409a;
  --gray-dark: #404040;
  --purple: #4c2c92;
}

/* Project-specific overrides and custom classes only.
   Bootstrap 5 core should be loaded separately (CDN/local). */

.jumbotron-image {
  background-image: url(../img/chos.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* Keep a full-height banner */
.banner {
  height: 100vh;
  display: flex;
  align-items: center;
}

/* text shadow helper */
.text-shadow {
  text-shadow: 2px 2px rgba(0,0,0,0.75);
}

/* Focus styling for inputs (aligns with BS5 tokens) */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {
  background-color: rgba(0,166,210,0.06);
  box-shadow: 0 0 0 .25rem rgba(0,166,210,0.18);
  border-color: var(--bs-info);
  outline: 0;
}

/* Utility adjustments retained from your theme */
.btn-primary {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-primary:hover {
  background-color: color-mix(in srgb, var(--bs-primary) 85%, black);
}

/* Simple responsive container/padding changes if needed */
.container { padding-left: 1rem; padding-right: 1rem; }

/* Compatibility alias: sr-only -> visually-hidden in BS5 */
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Keep only the custom table / panel colors you use (example) */
.table-purple > thead > tr > th {
  background-color: #cdc4e0;
  color: #28174c;
}