/* Custom styles to override Tailwind defaults */

:root {
  --color-primary: #5b5e6c;
  --color-primary-dark: #062552;
}

.bg-primary {
  background-color: var(--color-primary) !important;
}

.text-primary {
  color: var(--color-primary) !important;
}

.border-primary {
  border-color: var(--color-primary) !important;
}

.hover\:bg-primary:hover {
  background-color: var(--color-primary) !important;
}

.hover\:text-primary:hover {
  color: var(--color-primary) !important;
}

.hover\:border-primary:hover {
  border-color: var(--color-primary) !important;
}

.bg-primary-dark {
  background-color: var(--color-primary-dark) !important;
}

.text-primary-dark {
  color: var(--color-primary-dark) !important;
}

.hover\:bg-primary-dark:hover {
  background-color: var(--color-primary-dark) !important;
}

.hover\:text-primary-dark:hover {
  color: var(--color-primary-dark) !important;
}

/* Handle BG opacity variants */
.bg-primary\/10 {
  background-color: rgba(59, 75, 99, 0.1) !important;
}

.bg-primary\/20 {
  background-color: rgba(10, 51, 112, 0.2) !important;
}

.bg-primary\/30 {
  background-color: rgba(10, 51, 112, 0.3) !important;
}

.bg-primary\/50 {
  background-color: rgba(10, 51, 112, 0.5) !important;
}

.bg-primary\/80 {
  background-color: rgba(10, 51, 112, 0.8) !important;
}