/* Custom Primary Color Override */
:root {
  --bs-primary: #2B828F !important;
  --bs-primary-rgb: 43, 130, 143 !important;
  --bs-primary-text-emphasis: #1a5259 !important;
  --bs-primary-bg-subtle: #e1f0f2 !important;
  --bs-primary-border-subtle: #b3d9dd !important;
}

/* Override for dark theme if needed */
[data-bs-theme="dark"] {
  --bs-primary: #2B828F !important;
  --bs-primary-rgb: 43, 130, 143 !important;
  --bs-primary-text-emphasis: #1a5259 !important;
  --bs-primary-bg-subtle: #e1f0f2 !important;
  --bs-primary-border-subtle: #b3d9dd !important;
}

/* Specific overrides for Vue app and any remaining hardcoded colors */
#app {
  --bs-primary: #2B828F !important;
  --bs-primary-rgb: 43, 130, 143 !important;
}

/* Override any remaining hardcoded #7367f0 colors */
* {
  color: inherit !important;
}

/* Specific button and interactive element overrides */
.btn-primary,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:visited {
  background-color: #2B828F !important;
  border-color: #2B828F !important;
  color: white !important;
}

/* Override any remaining instances of the old color */
[style*="#7367f0"],
[style*="#7367F0"] {
  color: #2B828F !important;
  background-color: #2B828F !important;
  border-color: #2B828F !important;
}

/* Force override for any element with the old color */
*[style*="background-color: #7367f0"],
*[style*="background-color: #7367F0"],
*[style*="background: #7367f0"],
*[style*="background: #7367F0"],
*[style*="color: #7367f0"],
*[style*="color: #7367F0"],
*[style*="border-color: #7367f0"],
*[style*="border-color: #7367F0"] {
  background-color: #2B828F !important;
  color: #2B828F !important;
  border-color: #2B828F !important;
}

/* Override for any external libraries or frameworks */
.btn-primary,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:visited,
button.btn-primary,
input[type="button"].btn-primary,
input[type="submit"].btn-primary,
input[type="reset"].btn-primary,
a.btn-primary {
  background-color: #2B828F !important;
  border-color: #2B828F !important;
  color: white !important;
}

/* Ensure all primary-colored elements use the new color */
.primary,
.text-primary {
  color: #2B828F !important;
}

.bg-primary {
  background-color: #2B828F !important;
}

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