/* Framework Override CSS - Ensures React Native colors take precedence */

/* Bootstrap 4 Override - Higher Specificity */
.cc-override,
body .cc-override,
#content .cc-override {
  /* Primary Brand Colors - Force Override Bootstrap */
  --bs-primary: var(--cc-app-color) !important;
  --bs-primary-rgb: 59, 129, 211 !important;
}

/* Button Overrides - Bootstrap 4 Specificity */
.btn.cc-btn-primary,
.btn-primary.cc-btn-primary {
  background-color: var(--cc-app-color) !important;
  border-color: var(--cc-app-color) !important;
  color: white !important;
}

.btn.cc-btn-primary:hover,
.btn-primary.cc-btn-primary:hover,
.btn.cc-btn-primary:focus,
.btn-primary.cc-btn-primary:focus {
  background-color: #2a6bc0 !important;
  border-color: #2a6bc0 !important;
  color: white !important;
}

/* Card Overrides - Bootstrap Card Conflicts */
.card.cc-checkin-card,
.cc-checkin-card.card {
  background-color: var(--cc-card-inner) !important;
  border: 1px solid var(--cc-border) !important;
  border-radius: var(--cc-border-radius-field) !important;
  margin: var(--cc-card-margin) !important;
  padding: var(--cc-card-margin-vertical) var(--cc-card-margin) !important;
}

/* Background Color Overrides */
body.cc-bg-background,
.cc-bg-background {
  background-color: var(--cc-background) !important;
}

.cc-bg-header,
.navbar.cc-bg-header {
  background-color: var(--cc-header-background) !important;
}

/* Text Color Overrides - Bootstrap Text Utilities */
.text-primary.cc-text-primary,
.cc-text-primary {
  color: var(--cc-app-color) !important;
}

.cc-text-header,
.navbar-text.cc-text-header {
  color: var(--cc-header-font) !important;
}

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

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

/* Form Control Overrides */
.form-control.cc-form-control {
  border: 1px solid var(--cc-border) !important;
  border-radius: var(--cc-border-radius-field) !important;
  color: var(--cc-value-color) !important;
  background-color: var(--cc-card-inner) !important;
}

.form-control.cc-form-control:focus {
  border-color: var(--cc-app-color) !important;
  box-shadow: 0 0 0 0.2rem rgba(59, 129, 211, 0.25) !important;
}

/* Tailwind CSS Overrides - Higher Specificity */
.cc-tailwind-override {
  /* Override Tailwind's default colors */
  --tw-bg-opacity: 1;
}

.cc-tailwind-override .bg-blue-500 {
  background-color: var(--cc-app-color) !important;
}

.cc-tailwind-override .text-blue-500 {
  color: var(--cc-app-color) !important;
}

.cc-tailwind-override .border-blue-500 {
  border-color: var(--cc-app-color) !important;
}

/* Force Healthcare Theme Colors */
.healthcare-blue,
[class*="healthcare-blue"] {
  background-color: var(--cc-app-color) !important;
  color: white !important;
}

.text-healthcare-blue {
  color: var(--cc-app-color) !important;
}

.bg-healthcare-light {
  background-color: var(--cc-background) !important;
}

/* Icon Color Overrides */
.cc-icon,
i.cc-icon,
.fa.cc-icon {
  color: var(--cc-icon) !important;
}

.cc-icon-dark,
i.cc-icon-dark,
.fa.cc-icon-dark {
  color: var(--cc-icon-dark) !important;
}

/* Utility Class Overrides - Maximum Specificity */
body .cc-border,
.card.cc-border,
.form-control.cc-border {
  border-color: var(--cc-border) !important;
}

/* Mobile Responsive Overrides */
@media (max-width: 768px) {
  .cc-mobile-spacing {
    margin: calc(var(--cc-card-margin) / 2) !important;
    padding: calc(var(--cc-card-margin-vertical) / 2) var(--cc-card-margin) !important;
  }
}