/**
 * Dark Mode Text Visibility Fixes
 * Academic Legal Website
 * 
 * Comprehensive fixes to ensure all text is clearly visible
 * in both light and dark modes with consistent color scheme
 * 
 * Added: January 2026
 */

/* ============================================================================
   GLOBAL TEXT COLOR FIXES FOR DARK MODE
   ========================================================================= */

[data-theme="dark"] {
    /* Ensure body text is always readable */
    color: var(--text-dark);
}

/* All paragraph text should be visible */
[data-theme="dark"] p {
    color: var(--text-medium);
}

/* Strong/bold text should stand out */
[data-theme="dark"] strong,
[data-theme="dark"] b {
    color: var(--text-dark);
}

/* Ensure headings are visible with accent color */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6 {
    color: var(--accent);
}

/* ============================================================================
   FOOTER SPECIFIC FIXES
   ========================================================================= */

/* Footer logo text */
[data-theme="dark"] .footer-brand .logo-text,
[data-theme="dark"] .site-footer .logo-text {
    color: var(--text-dark);
}

/* Footer newsletter title */
[data-theme="dark"] .footer-newsletter-title {
    color: var(--text-dark);
}

/* Footer contact links with icons */
[data-theme="dark"] .footer-contact-links a {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    color: var(--text-medium);
}

[data-theme="dark"] .footer-contact-links a:hover {
    color: var(--accent);
}

[data-theme="dark"] .footer-contact-links svg {
    color: var(--accent);
}

/* ============================================================================
   HEADER SPECIFIC FIXES
   ========================================================================= */

/* Header logo text (fallback when no image) */
[data-theme="dark"] .site-logo .logo-text {
    color: var(--text-dark);
}

[data-theme="dark"] .site-logo .logo-tagline {
    color: var(--text-medium);
}

/* Header logo IMAGE - invert dark logo to white for dark backgrounds */
[data-theme="dark"] .logo-image,
[data-theme="dark"] .site-logo .logo-image {
    filter: brightness(0) invert(1) !important;
}

/* Footer logo IMAGE - always inverted (footer always has dark bg) */
[data-theme="dark"] .footer-logo-image,
[data-theme="dark"] .footer-brand .footer-logo-image {
    filter: brightness(0) invert(1) !important;
}

/* Mobile nav logo IMAGE */
[data-theme="dark"] .mobile-logo-image,
[data-theme="dark"] .mobile-nav .mobile-logo-image {
    filter: brightness(0) invert(1) !important;
}

/* Navigation links */
[data-theme="dark"] .nav-link {
    color: var(--text-medium);
}

[data-theme="dark"] .nav-link:hover,
[data-theme="dark"] .nav-link.active {
    color: var(--accent);
}

/* Mobile navigation */
[data-theme="dark"] .mobile-nav {
    background-color: var(--surface);
}

[data-theme="dark"] .mobile-nav .logo-text {
    color: var(--text-dark);
}

/* Mobile nav logo image already handled above */

[data-theme="dark"] .mobile-nav-link {
    color: var(--text-medium);
}

[data-theme="dark"] .mobile-nav-link:hover,
[data-theme="dark"] .mobile-nav-link.active {
    color: var(--accent);
}

/* ============================================================================
   FORM INPUT FIXES
   ========================================================================= */

/* All form inputs should have readable text */
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    color: var(--text-dark);
    background-color: var(--surface);
    border-color: var(--border-color);
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: var(--text-muted);
}

[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
    border-color: var(--accent);
    background-color: var(--surface);
}

/* Search inputs */
[data-theme="dark"] .header-search-input {
    color: var(--text-dark);
    background-color: var(--surface);
}

/* ============================================================================
   LIST FIXES
   ========================================================================= */

[data-theme="dark"] li {
    color: var(--text-medium);
}

[data-theme="dark"] ul li::marker,
[data-theme="dark"] ol li::marker {
    color: var(--accent);
}

/* ============================================================================
   BREADCRUMB FIXES
   ========================================================================= */

[data-theme="dark"] .breadcrumb-list {
    color: var(--text-light);
}

[data-theme="dark"] .breadcrumb-link {
    color: var(--text-medium);
}

[data-theme="dark"] .breadcrumb-link:hover {
    color: var(--accent);
}

[data-theme="dark"] .breadcrumb-separator {
    color: var(--text-muted);
}

[data-theme="dark"] .breadcrumb-current {
    color: var(--text-dark);
}

/* ============================================================================
   BUTTON TEXT FIXES
   ========================================================================= */

/* Primary buttons - dark text on light accent background */
[data-theme="dark"] .btn-primary {
    background-color: var(--accent);
    color: #0f172a;
}

[data-theme="dark"] .btn-primary:hover {
    background-color: #93c5fd;
}

/* Outline buttons */
[data-theme="dark"] .btn-outline {
    border-color: var(--border-color);
    color: var(--text-medium);
}

[data-theme="dark"] .btn-outline:hover {
    border-color: var(--accent);
    color: var(--accent);
    background-color: rgba(96, 165, 250, 0.1);
}

/* ============================================================================
   CARD AND COMPONENT TEXT FIXES
   ========================================================================= */

/* Article cards */
[data-theme="dark"] .article-card-title,
[data-theme="dark"] .article-card-title a {
    color: var(--text-dark);
}

[data-theme="dark"] .article-card-title a:hover {
    color: var(--accent);
}

[data-theme="dark"] .article-card-excerpt {
    color: var(--text-medium);
}

[data-theme="dark"] .article-card-meta {
    color: var(--text-light);
}

/* Pillar cards */
[data-theme="dark"] .pillar-card-title {
    color: var(--text-dark);
}

[data-theme="dark"] .pillar-card-description {
    color: var(--text-medium);
}

/* Expertise items */
[data-theme="dark"] .expertise-item h4 {
    color: var(--accent);
}

[data-theme="dark"] .expertise-item li {
    color: var(--text-medium);
}

/* ============================================================================
   SEARCH PAGE FIXES
   ========================================================================= */

[data-theme="dark"] .search-result-title a {
    color: var(--text-dark);
}

[data-theme="dark"] .search-result-title a:hover {
    color: var(--accent);
}

[data-theme="dark"] .search-result-excerpt {
    color: var(--text-medium);
}

[data-theme="dark"] .search-result-meta {
    color: var(--text-light);
}

[data-theme="dark"] .empty-state p {
    color: var(--text-medium);
}

/* ============================================================================
   ARTICLE PAGE FIXES
   ========================================================================= */

[data-theme="dark"] .article-title {
    color: var(--accent);
}

[data-theme="dark"] .article-meta {
    color: var(--text-light);
}

[data-theme="dark"] .article-content {
    color: var(--text-medium);
}

[data-theme="dark"] .article-content h2,
[data-theme="dark"] .article-content h3,
[data-theme="dark"] .article-content h4 {
    color: var(--accent);
}

[data-theme="dark"] .article-content p {
    color: var(--text-medium);
}

/* Code blocks in articles */
[data-theme="dark"] .article-content code {
    background-color: var(--surface);
    border-color: var(--border-color);
    color: var(--accent);
}

[data-theme="dark"] .article-content pre {
    background-color: #1e293b;
    border-color: var(--border-color);
}

[data-theme="dark"] .article-content pre code {
    color: var(--text-medium);
}

/* Blockquotes */
[data-theme="dark"] .article-content blockquote {
    background-color: var(--surface);
    border-left-color: var(--accent);
    color: var(--text-medium);
}

/* ============================================================================
   404 PAGE FIXES
   ========================================================================= */

[data-theme="dark"] .error-code {
    color: var(--accent);
}

[data-theme="dark"] .error-title {
    color: var(--text-dark);
}

[data-theme="dark"] .error-description {
    color: var(--text-medium);
}

[data-theme="dark"] .error-reasons {
    color: var(--text-light);
}

[data-theme="dark"] .error-navigation h2,
[data-theme="dark"] .error-search h2 {
    color: var(--text-dark);
}

[data-theme="dark"] .error-nav-link {
    background-color: var(--surface);
    border-color: var(--border-color);
}

[data-theme="dark"] .error-nav-text strong {
    color: var(--text-dark);
}

[data-theme="dark"] .error-nav-text small {
    color: var(--text-light);
}

[data-theme="dark"] .error-contact {
    color: var(--text-light);
}

/* ============================================================================
   TABLE FIXES
   ========================================================================= */

[data-theme="dark"] table {
    border-color: var(--border-color);
}

[data-theme="dark"] th {
    background-color: var(--surface);
    color: var(--text-dark);
    border-color: var(--border-color);
}

[data-theme="dark"] td {
    color: var(--text-medium);
    border-color: var(--border-color);
}

[data-theme="dark"] tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.02);
}

/* ============================================================================
   SMALL AND MUTED TEXT FIXES
   ========================================================================= */

[data-theme="dark"] small {
    color: var(--text-light);
}

[data-theme="dark"] .text-muted {
    color: var(--text-muted);
}

[data-theme="dark"] .text-light {
    color: var(--text-light);
}

/* ============================================================================
   LINK VISIBILITY FIXES
   ========================================================================= */

[data-theme="dark"] a {
    color: var(--accent);
}

[data-theme="dark"] a:hover {
    color: #93c5fd;
}

/* Links in paragraphs */
[data-theme="dark"] p a,
[data-theme="dark"] li a {
    color: var(--accent);
}

[data-theme="dark"] p a:hover,
[data-theme="dark"] li a:hover {
    color: #93c5fd;
}