/**
 * Dark Mode Contrast Fixes
 * Ensures WCAG AA compliance (4.5:1 for body text, 3:1 for large text)
 */

/* Headings - High contrast white for better readability */
.dark-mode h1,
.dark-mode h2,
.dark-mode h3,
.dark-mode h4,
.dark-mode h5,
.dark-mode h6,
.dark-mode .title,
.dark-mode .subtitle {
  color: #ffffff !important;
}

/* Body text - Slightly off-white for reduced eye strain but still high contrast */
.dark-mode,
.dark-mode body,
.dark-mode p,
.dark-mode .content,
.dark-mode .text {
  color: #e8e8e8 !important;
}

/* Image container text (descriptions, titles) */
.dark-mode .image-container p,
.dark-mode .image-container .title,
.dark-mode .image-container .subtitle,
.dark-mode .image-description,
.dark-mode .image-title,
.dark-mode figure figcaption {
  color: #f0f0f0 !important;
}

/* Links - Lighter blue for better contrast on dark background */
.dark-mode a:not(.button):not(.navbar-item):not(.navbar-link) {
  color: #66b3ff !important;
}

.dark-mode a:not(.button):not(.navbar-item):not(.navbar-link):hover {
  color: #99ccff !important;
}

/* Muted text should still be readable (WCAG AA minimum 4.5:1) */
.dark-mode .has-text-grey,
.dark-mode .is-size-7,
.dark-mode small,
.dark-mode .text-muted {
  color: #b3b3b3 !important;
}

/* Strong/bold text */
.dark-mode strong,
.dark-mode b {
  color: #ffffff !important;
  font-weight: 600;
}

/* Lists */
.dark-mode ul li,
.dark-mode ol li {
  color: #e8e8e8 !important;
}

/* Tables */
.dark-mode table,
.dark-mode table td,
.dark-mode table th {
  color: #e8e8e8 !important;
  border-color: #404040 !important;
}

.dark-mode table th {
  color: #ffffff !important;
}

/* Code blocks */
.dark-mode code,
.dark-mode pre {
  background-color: #2d2d2d !important;
  color: #f8f8f2 !important;
}

/* Blockquotes */
.dark-mode blockquote {
  color: #e8e8e8 !important;
  border-left-color: #4a90e2 !important;
}

/* Form inputs - ensure placeholder and text are visible */
.dark-mode input,
.dark-mode textarea,
.dark-mode select {
  color: #ffffff !important;
  background-color: #2d2d2d !important;
  border-color: #404040 !important;
}

.dark-mode input::placeholder,
.dark-mode textarea::placeholder {
  color: #808080 !important;
  opacity: 1;
}

/* Buttons text contrast */
.dark-mode .button:not(.is-link):not(.is-primary):not(.is-info) {
  color: #ffffff !important;
}

/* Card content */
.dark-mode .card,
.dark-mode .box {
  background-color: #2d2d2d !important;
  color: #e8e8e8 !important;
}

.dark-mode .card .card-header-title {
  color: #ffffff !important;
}

/* Navigation text */
.dark-mode .navbar-item,
.dark-mode .navbar-link {
  color: #ffffff !important;
}

/* Footer text */
.dark-mode footer,
.dark-mode .footer {
  color: #e8e8e8 !important;
}

/* Ensure labels are visible */
.dark-mode label,
.dark-mode .label {
  color: #f0f0f0 !important;
}

/* Hero/Section titles */
.dark-mode .hero .title,
.dark-mode .hero .subtitle,
.dark-mode .section .title,
.dark-mode .section .subtitle {
  color: #ffffff !important;
}

/* Columns content */
.dark-mode .column {
  color: #e8e8e8;
}

/* Special: Image containers with overlays */
.dark-mode .has-text-centered p,
.dark-mode .columns p {
  color: #e8e8e8 !important;
}

/* Notifications */
.dark-mode .notification {
  background-color: #2d2d2d !important;
  color: #e8e8e8 !important;
}

/* Messages */
.dark-mode .message {
  background-color: #2d2d2d !important;
}

.dark-mode .message-body {
  color: #e8e8e8 !important;
  border-color: #404040 !important;
}

/* Tags */
.dark-mode .tag:not(.is-link):not(.is-primary):not(.is-info) {
  background-color: #404040 !important;
  color: #ffffff !important;
}