/*
 * Accessibility & Contrast Enhancements (global)
 * Scope: .main-wrapper and common UI elements
 * Goal: Ensure sufficient color contrast and readable text across backgrounds
 */

/* Fallback tokens if modern-design-system is not loaded */
:root {
  --ca-gray-50: #F9FAFB;
  --ca-gray-100: #F3F4F6;
  --ca-gray-200: #E5E7EB;
  --ca-gray-300: #D1D5DB;
  --ca-gray-400: #9CA3AF;
  --ca-gray-500: #6B7280;
  --ca-gray-600: #4B5563;
  --ca-gray-700: #374151;
  --ca-gray-800: #1F2937;
  --ca-gray-900: #111827;
  --ca-primary: #4F46E5; /* Indigo */
  --ca-primary-dark: #4338CA;
  --ca-white: #ffffff;
  --ca-black: #000000;
}

/* Use design-system tokens if present */
:root {
  --ca-text: var(--gray-900, var(--ca-gray-900));
  --ca-text-muted: var(--gray-600, var(--ca-gray-600));
  --ca-heading: var(--gray-900, var(--ca-gray-900));
  --ca-link: var(--primary-blue, var(--ca-primary));
  --ca-link-hover: var(--primary-blue-dark, var(--ca-primary-dark));
  --ca-bg: var(--gray-50, var(--ca-gray-50));
  --ca-surface: var(--ca-white);
}

/* 1) Global text defaults under .main-wrapper */
.main-wrapper,
.main-wrapper p,
.main-wrapper li,
.main-wrapper span,
.main-wrapper label,
.main-wrapper small {
  color: var(--ca-text);
}

/* Muted text should still be readable */
.main-wrapper .text-muted,
.main-wrapper .muted,
.main-wrapper .subtitle,
.main-wrapper .section-subtitle-modern {
  color: var(--ca-text-muted) !important;
}

/* Headings */
.main-wrapper h1,
.main-wrapper h2,
.main-wrapper h3,
.main-wrapper h4,
.main-wrapper h5,
.main-wrapper h6 {
  color: var(--ca-heading);
}

/* Links */
.main-wrapper a {
  color: var(--ca-link);
  text-decoration: none;
}
.main-wrapper a:hover,
.main-wrapper a:focus {
  color: var(--ca-link-hover);
  text-decoration: underline;
}

/* Visible focus styles for keyboard users */
.main-wrapper a:focus-visible,
.main-wrapper button:focus-visible,
.main-wrapper .btn:focus-visible,
.main-wrapper [tabindex]:focus-visible {
  outline: 2px dashed var(--ca-link-hover);
  outline-offset: 2px;
}

/* 2) Background-aware text colors */
/* Light backgrounds */
.main-wrapper .bg-white,
.main-wrapper .bg-light,
.main-wrapper .card,
.main-wrapper .card-modern,
.main-wrapper .mentor-card-modern,
.main-wrapper .section,
.main-wrapper .container {
  color: var(--ca-text);
}

/* Dark or gradient sections: force high-contrast text */
.main-wrapper .bg-dark,
.main-wrapper .hero-modern,
.main-wrapper .navbar-dark,
.main-wrapper .gradient-dark,
.main-wrapper .footer-dark {
  color: #ffffff;
}
.main-wrapper .bg-dark a,
.main-wrapper .hero-modern a,
.main-wrapper .navbar-dark a,
.main-wrapper .gradient-dark a,
.main-wrapper .footer-dark a {
  color: #ffffff;
  text-decoration: underline;
}

/* Navbar links on light background */
.main-wrapper .navbar.navbar-light .nav-link {
  color: var(--ca-text) !important;
}
.main-wrapper .navbar.navbar-light .nav-link:hover,
.main-wrapper .navbar.navbar-light .nav-link:focus {
  color: var(--ca-link-hover) !important;
}

/* Navbar with white background - enforce dark text */
.main-wrapper #navbar .navbar,
.main-wrapper header .navbar.bg-white,
.main-wrapper header .navbar.navbar-light {
  background-color: #ffffff !important;
}

.main-wrapper #navbar .nav-item,
.main-wrapper header .navbar.bg-white .nav-item,
.main-wrapper header .navbar.navbar-light .nav-item {
  color: #374151 !important;
}

.main-wrapper #navbar .nav-link,
.main-wrapper header .navbar.bg-white .nav-link,
.main-wrapper header .navbar.navbar-light .nav-link,
.main-wrapper #navbar .nav-item .nav-link,
.main-wrapper header .navbar.bg-white .nav-item .nav-link,
.main-wrapper header .navbar.navbar-light .nav-item .nav-link {
  color: #374151 !important;
  font-weight: 500;
  background-color: transparent !important;
}

.main-wrapper #navbar .nav-link:hover,
.main-wrapper #navbar .nav-link:focus,
.main-wrapper header .navbar.bg-white .nav-link:hover,
.main-wrapper header .navbar.navbar-light .nav-link:hover,
.main-wrapper #navbar .nav-item .nav-link:hover,
.main-wrapper #navbar .nav-item .nav-link:focus {
  color: #4F46E5 !important;
  background-color: transparent !important;
}

.main-wrapper #navbar .nav-link.active,
.main-wrapper header .navbar.bg-white .nav-link.active,
.main-wrapper header .navbar.navbar-light .nav-link.active,
.main-wrapper #navbar .nav-item .nav-link.active {
  color: #4F46E5 !important;
  font-weight: 600;
  background-color: transparent !important;
}

/* Navbar brand/logo */
.main-wrapper #navbar .navbar-brand,
.main-wrapper header .navbar.navbar-light .navbar-brand {
  color: #111827 !important;
}

/* Navbar toggler icon for mobile */
.main-wrapper #navbar .navbar-toggler,
.main-wrapper header .navbar.navbar-light .navbar-toggler {
  color: #374151 !important;
  border-color: #D1D5DB !important;
}

.main-wrapper #navbar .navbar-toggler-icon i,
.main-wrapper header .navbar.navbar-light .navbar-toggler-icon i {
  color: #374151 !important;
}

/* Dropdown menu items */
.main-wrapper #navbar .dropdown-menu,
.main-wrapper header .navbar .dropdown-menu {
  background-color: #ffffff !important;
}

.main-wrapper #navbar .dropdown-item,
.main-wrapper header .navbar .dropdown-item {
  color: #374151 !important;
}

.main-wrapper #navbar .dropdown-item:hover,
.main-wrapper header .navbar .dropdown-item:hover {
  background-color: #F9FAFB !important;
  color: #4F46E5 !important;
}

/* 3) Buttons contrast improvements */
.main-wrapper .btn,
.main-wrapper .btn-modern {
  font-size: 0.95rem; /* ensure legibility */
}

/* Light buttons must have dark text for contrast */
.main-wrapper .btn-light,
.main-wrapper .btn-light-secondary,
.main-wrapper .btn-outline-light {
  color: var(--ca-text) !important;
  border-color: var(--ca-gray-300) !important;
  background-color: #ffffff !important;
}
.main-wrapper .btn-light:hover,
.main-wrapper .btn-light-secondary:hover,
.main-wrapper .btn-outline-light:hover {
  background-color: var(--ca-gray-50) !important;
  color: var(--ca-link-hover) !important;
}

/* Primary/gradient buttons keep white text */
.main-wrapper .btn-primary,
.main-wrapper .btn-modern-primary {
  color: #ffffff !important;
}

/* Ensure outline/ghost buttons have readable text */
.main-wrapper .btn-outline-secondary,
.main-wrapper .btn-outline-primary {
  color: var(--ca-link) !important;
  border-color: var(--ca-link) !important;
}
.main-wrapper .btn-outline-secondary:hover,
.main-wrapper .btn-outline-primary:hover {
  background-color: var(--ca-link) !important;
  color: #ffffff !important;
}

/* 4) Badges & pills */
.main-wrapper .badge-secondary-soft,
.main-wrapper .badge-light {
  color: var(--ca-text) !important;
  background-color: var(--ca-gray-100) !important;
  border: 1px solid var(--ca-gray-200) !important;
}

/* 5) Forms & placeholders */
.main-wrapper input::placeholder,
.main-wrapper textarea::placeholder {
  color: var(--ca-gray-500);
}
.main-wrapper .form-control,
.main-wrapper .select2-selection,
.main-wrapper .nice-select {
  color: var(--ca-text);
  border-color: var(--ca-gray-300);
}

/* 6) Tables */
.main-wrapper table,
.main-wrapper .table {
  color: var(--ca-text);
}

/* 7) Utilities */
.main-wrapper .text-on-dark { color: #ffffff !important; }
.main-wrapper .text-on-light { color: var(--ca-text) !important; }

/* Ensure small labels remain readable */
.main-wrapper small,
.main-wrapper .fs-12,
.main-wrapper .badge {
  letter-spacing: 0.2px;
}