/* ==========================================================================
   HIGH-CONTRAST TYPOGRAPHY & WCAG ACCESSIBILITY STYLESHEET
   Ensures optimal readability and contrast across all dark and light themes
   ========================================================================== */

/* 1. Base Text Colors on Dark Canvas */
body {
  color: #FFFFFF !important;
  background-color: #0E0E0E !important;
}

/* 2. Headings Contrast & Definition */
h1, h2, h3, h4, h5, h6,
.font-britanicaBlack,
.font-britanicaExtraBold {
  color: #FFFFFF !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Colored Heading Spans & Highlights */
.text-\[\#F74B1C\],
span.text-\[\#F74B1C\],
h1 span.text-\[\#F74B1C\],
h2 span.text-\[\#F74B1C\] {
  color: #FF5A26 !important; /* High-luminance vivid orange */
}

.text-\[\#7724C1\],
.text-\[\#C380FE\],
span.text-\[\#7724C1\],
span.text-\[\#C380FE\] {
  color: #D69FFF !important; /* High-luminance bright purple for dark backgrounds */
}

/* 3. Body Copy & Paragraphs */
p, 
li, 
dt, 
dd, 
label, 
.font-britanicaRegular,
.section-desc {
  color: rgba(255, 255, 255, 0.92) !important; /* WCAG AAA compliant 16.5:1 ratio */
}

/* 4. Elevate Low-Opacity Text Utilities */
.text-white\/40,
.text-white\/50,
.text-white\/60,
.text-white\/70,
.text-white\/75,
.text-white\/80,
.text-white\/85 {
  color: rgba(255, 255, 255, 0.86) !important; /* Upgraded to high-contrast */
}

/* Secondary metadata, subtitles, timestamps */
.text-white\/60,
footer .text-white\/60,
.metadata-text {
  color: rgba(255, 255, 255, 0.80) !important;
}

/* 5. Navigation & Header Contrast */
header nav a,
header nav span {
  color: #FFFFFF !important;
}

header nav a:hover,
header nav span:hover {
  color: #FF5A26 !important;
}

.dropdown-heading {
  color: #FF7B52 !important;
  font-size: 0.8125rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

.dropdown-link {
  color: rgba(255, 255, 255, 0.90) !important;
}

.dropdown-link:hover {
  color: #FFFFFF !important;
  background-color: rgba(247, 75, 28, 0.18) !important;
}

/* 6. Card & Container Typography Contrast */
article h3,
article h4,
div[class*="rounded-"] h3,
div[class*="rounded-"] h4 {
  color: #FFFFFF !important;
}

article p,
div[class*="rounded-"] p {
  color: rgba(255, 255, 255, 0.90) !important;
}

/* Watermark Numbers Contrast */
article > span.pointer-events-none.absolute,
div[class*="rounded-"] > span.pointer-events-none.absolute {
  color: rgba(255, 255, 255, 0.12) !important; /* Visible yet subtle decorative depth */
}

/* 7. Pill Badges & Technology Tags */
.rounded-full,
span[class*="rounded-full"],
div[class*="rounded-full"],
span[class*="border-[#7724C1]"],
span[class*="border-[#C380FE]"] {
  background-color: rgba(119, 36, 193, 0.28) !important;
  border: 1px solid rgba(195, 128, 254, 0.5) !important;
  color: #EACFFF !important; /* Crisp high-contrast lilac */
  font-weight: 600 !important;
}

/* 8. White Card Theme Inversion (e.g. Active Stats Cards) */
.bg-white,
.bg-white h1,
.bg-white h2,
.bg-white h3,
.bg-white h4,
.bg-white p,
.bg-white span,
.bg-white div {
  color: #121212 !important;
}

.bg-white .stat-num {
  color: #7724C1 !important;
}

.bg-white .stat-lbl,
.bg-white .text-\[\#373636\] {
  color: #2D2D2D !important;
}

/* 9. Form Controls & Inputs Contrast */
input, select, textarea {
  background-color: #181818 !important;
  border: 1.5px solid rgba(255, 255, 255, 0.22) !important;
  color: #FFFFFF !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(255, 255, 255, 0.60) !important;
}

input:focus, select:focus, textarea:focus {
  border-color: #FF5A26 !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(247, 75, 28, 0.25) !important;
}

/* 10. Buttons & CTAs */
.btn-sweep,
button[type="submit"] {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

button.bg-white {
  background-color: #FFFFFF !important;
  color: #0E0E0E !important;
  font-weight: 800 !important;
}

button.bg-white:hover {
  background-color: #FF5A26 !important;
  color: #FFFFFF !important;
}

/* 11. Footer High Contrast */
footer h4 {
  color: #FFFFFF !important;
}

footer a {
  color: rgba(255, 255, 255, 0.82) !important;
  transition: color 0.2s ease;
}

footer a:hover {
  color: #FF5A26 !important;
}

footer p {
  color: rgba(255, 255, 255, 0.84) !important;
}

/* 12. Blog & Legal Articles Contrast */
article.prose p,
article.prose li,
.legal-content p {
  color: rgba(255, 255, 255, 0.94) !important;
  font-size: 1.0625rem !important;
  line-height: 1.8 !important;
}

article.prose strong,
.legal-content strong {
  color: #FFFFFF !important;
}