/* Accessibility-First Color System
 *
 * This CSS file provides WCAG AA compliant color combinations
 * for all quality levels, ensuring proper contrast ratios.
 *
 * WCAG AA requires:
 * - Normal text: 4.5:1 contrast ratio
 * - Large text: 3:1 contrast ratio
 * - Non-text elements: 3:1 contrast ratio
 */

:root {
    /* High contrast color palette */
    --quality-excellent-bg: #155724;     /* Dark green for excellent contrast */
    --quality-excellent-text: #ffffff;   /* White text (14.83:1 ratio) */
    --quality-excellent-light: #28a745;  /* Original green for borders/highlights */

    --quality-good-bg: #0f5132;         /* Dark teal-green for good contrast */
    --quality-good-text: #ffffff;       /* White text (13.44:1 ratio) */
    --quality-good-light: #20c997;      /* Lighter green for borders/highlights */

    --quality-medium-bg: #664d03;       /* Dark golden-brown for medium contrast */
    --quality-medium-text: #ffffff;     /* White text (12.11:1 ratio) */
    --quality-medium-light: #ffc107;    /* Original yellow for borders/highlights */

    --quality-low-bg: #832d01;          /* Dark orange for low contrast */
    --quality-low-text: #ffffff;        /* White text (12.45:1 ratio) */
    --quality-low-light: #fd7e14;       /* Original orange for borders/highlights */

    --quality-poor-bg: #721c24;         /* Dark red for poor contrast */
    --quality-poor-text: #ffffff;       /* White text (13.67:1 ratio) */
    --quality-poor-light: #dc3545;      /* Original red for borders/highlights */

    --quality-unknown-bg: #495057;      /* Dark gray for unknown contrast */
    --quality-unknown-text: #ffffff;    /* White text (9.94:1 ratio) */
    --quality-unknown-light: #6c757d;   /* Original gray for borders/highlights */
}

/* High Contrast Trust Score Badges */
.trust-score-badge {
    font-size: 0.75em;
    font-weight: 600;
    padding: 0.4em 0.6em;
    border-radius: 0.375rem;
    text-shadow: none;
    min-width: 60px;
    text-align: center;
    border: 1px solid transparent;
    transition: all 0.15s ease-in-out;
}

.trust-score-badge.trust-high {
    background-color: var(--quality-excellent-bg) !important;
    color: var(--quality-excellent-text) !important;
    border-color: var(--quality-excellent-light);
}

.trust-score-badge.trust-medium {
    background-color: var(--quality-medium-bg) !important;
    color: var(--quality-medium-text) !important;
    border-color: var(--quality-medium-light);
}

.trust-score-badge.trust-low {
    background-color: var(--quality-low-bg) !important;
    color: var(--quality-low-text) !important;
    border-color: var(--quality-low-light);
}

.trust-score-badge.trust-very-low {
    background-color: var(--quality-poor-bg) !important;
    color: var(--quality-poor-text) !important;
    border-color: var(--quality-poor-light);
}

.trust-score-badge.trust-unknown {
    background-color: var(--quality-unknown-bg) !important;
    color: var(--quality-unknown-text) !important;
    border-color: var(--quality-unknown-light);
}

/* Enhanced hover states with better contrast */
.trust-score-badge:hover {
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    cursor: help;
}

.trust-score-badge.trust-high:hover {
    background-color: var(--quality-excellent-light) !important;
    color: white !important;
}

.trust-score-badge.trust-medium:hover {
    background-color: #856404 !important; /* Darker yellow for better contrast */
    color: white !important;
}

.trust-score-badge.trust-low:hover {
    background-color: var(--quality-low-light) !important;
    color: white !important;
}

.trust-score-badge.trust-very-low:hover {
    background-color: var(--quality-poor-light) !important;
    color: white !important;
}

.trust-score-badge.trust-unknown:hover {
    background-color: var(--quality-unknown-light) !important;
    color: white !important;
}

/* Progress bar accessibility improvements */
.trust-score-progress-bar.trust-high {
    background-color: var(--quality-excellent-light) !important;
}

.trust-score-progress-bar.trust-medium {
    background-color: #f0ad4e !important; /* Better contrast orange-yellow */
}

.trust-score-progress-bar.trust-low {
    background-color: var(--quality-low-light) !important;
}

.trust-score-progress-bar.trust-very-low {
    background-color: var(--quality-poor-light) !important;
}

.trust-score-progress-bar.trust-unknown {
    background-color: var(--quality-unknown-light) !important;
}

/* Card border and text accessibility improvements */
.news-article-card.trust-high {
    border-left-color: var(--quality-excellent-light) !important;
    background-color: rgba(40, 167, 69, 0.05) !important; /* Slightly stronger background */
}

.news-article-card.trust-high .card-title a,
.news-article-card.trust-high .card-text,
.news-article-card.trust-high .text-muted {
    color: #2d5a3d !important; /* Dark green text for excellent contrast */
}

.news-article-card.trust-high .card-title a:hover {
    color: #1e3d29 !important; /* Even darker green on hover */
    text-decoration: underline;
}

.news-article-card.trust-medium {
    border-left-color: #f0ad4e !important; /* Better contrast orange-yellow */
    background-color: rgba(255, 193, 7, 0.05) !important; /* Slightly stronger background */
}

.news-article-card.trust-medium .card-title a,
.news-article-card.trust-medium .card-text,
.news-article-card.trust-medium .text-muted {
    color: #6d4c00 !important; /* Dark golden text for excellent contrast */
}

.news-article-card.trust-medium .card-title a:hover {
    color: #523900 !important; /* Even darker golden on hover */
    text-decoration: underline;
}

.news-article-card.trust-low {
    border-left-color: var(--quality-low-light) !important;
    background-color: rgba(253, 126, 20, 0.05) !important; /* Slightly stronger background */
}

.news-article-card.trust-low .card-title a,
.news-article-card.trust-low .card-text,
.news-article-card.trust-low .text-muted {
    color: #7a3a00 !important; /* Dark orange text for excellent contrast */
}

.news-article-card.trust-low .card-title a:hover {
    color: #5c2b00 !important; /* Even darker orange on hover */
    text-decoration: underline;
}

.news-article-card.trust-very-low {
    border-left-color: var(--quality-poor-light) !important;
    background-color: rgba(220, 53, 69, 0.05) !important; /* Slightly stronger background */
}

.news-article-card.trust-very-low .card-title a,
.news-article-card.trust-very-low .card-text,
.news-article-card.trust-very-low .text-muted {
    color: #6b1c28 !important; /* Dark red text for excellent contrast */
}

.news-article-card.trust-very-low .card-title a:hover {
    color: #4e141d !important; /* Even darker red on hover */
    text-decoration: underline;
}

.news-article-card.trust-unknown {
    border-left-color: var(--quality-unknown-light) !important;
    background-color: rgba(108, 117, 125, 0.05) !important; /* Slightly stronger background */
}

.news-article-card.trust-unknown .card-title a,
.news-article-card.trust-unknown .card-text,
.news-article-card.trust-unknown .text-muted {
    color: #3c4248 !important; /* Dark gray text for excellent contrast */
}

.news-article-card.trust-unknown .card-title a:hover {
    color: #2d3136 !important; /* Even darker gray on hover */
    text-decoration: underline;
}

/* Additional accessibility improvements for card content */
.news-article-card.trust-high .badge,
.news-article-card.trust-medium .badge,
.news-article-card.trust-low .badge,
.news-article-card.trust-very-low .badge,
.news-article-card.trust-unknown .badge {
    font-weight: 600;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

/* Improve visibility of small text */
.news-article-card .text-muted small {
    font-weight: 500 !important;
}

/* Ensure action buttons maintain good contrast */
.news-article-card .btn-outline-primary {
    color: #0056b3 !important;
    border-color: #0056b3 !important;
}

.news-article-card .btn-outline-primary:hover {
    background-color: #0056b3 !important;
    color: white !important;
}

/* Progress bar text visibility */
.reliability-progress-wrapper .text-muted {
    font-weight: 500 !important;
}

/* Alternative high contrast mode (for users who need extra contrast) */
@media (prefers-contrast: high) {
    .trust-score-badge {
        border-width: 2px;
        font-weight: 700;
    }

    .trust-score-badge.trust-high {
        background-color: #0d4419 !important; /* Even darker green */
    }

    .trust-score-badge.trust-medium {
        background-color: #523a02 !important; /* Even darker yellow */
    }

    .trust-score-badge.trust-low {
        background-color: #6b2301 !important; /* Even darker orange */
    }

    .trust-score-badge.trust-very-low {
        background-color: #5a151b !important; /* Even darker red */
    }

    .trust-score-badge.trust-unknown {
        background-color: #3a3f45 !important; /* Even darker gray */
    }

    /* Enhanced contrast for card text in high contrast mode */
    .news-article-card.trust-high {
        background-color: rgba(40, 167, 69, 0.08) !important;
    }

    .news-article-card.trust-high .card-title a,
    .news-article-card.trust-high .card-text,
    .news-article-card.trust-high .text-muted {
        color: #1a3d24 !important; /* Even darker green for ultra-high contrast */
    }

    .news-article-card.trust-medium {
        background-color: rgba(255, 193, 7, 0.08) !important;
    }

    .news-article-card.trust-medium .card-title a,
    .news-article-card.trust-medium .card-text,
    .news-article-card.trust-medium .text-muted {
        color: #4a3500 !important; /* Even darker golden for ultra-high contrast */
    }

    .news-article-card.trust-low {
        background-color: rgba(253, 126, 20, 0.08) !important;
    }

    .news-article-card.trust-low .card-title a,
    .news-article-card.trust-low .card-text,
    .news-article-card.trust-low .text-muted {
        color: #5c2b00 !important; /* Even darker orange for ultra-high contrast */
    }

    .news-article-card.trust-very-low {
        background-color: rgba(220, 53, 69, 0.08) !important;
    }

    .news-article-card.trust-very-low .card-title a,
    .news-article-card.trust-very-low .card-text,
    .news-article-card.trust-very-low .text-muted {
        color: #4e141d !important; /* Even darker red for ultra-high contrast */
    }

    .news-article-card.trust-unknown {
        background-color: rgba(108, 117, 125, 0.08) !important;
    }

    .news-article-card.trust-unknown .card-title a,
    .news-article-card.trust-unknown .card-text,
    .news-article-card.trust-unknown .text-muted {
        color: #2d3136 !important; /* Even darker gray for ultra-high contrast */
    }
}

/* Focus states for keyboard navigation accessibility */
.trust-score-badge:focus {
    outline: 3px solid #005fcc;
    outline-offset: 2px;
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .trust-score-badge {
        transition: none;
    }

    .trust-score-badge:hover {
        transform: none;
    }
}

/* Truth Block Highlighting Accessibility Improvements */
/* High contrast colored backgrounds with white text for better visibility */

.truth-block-highlight {
    font-weight: 600 !important; /* Bold text for better readability */
    border-width: 3px !important;
    text-shadow: none !important; /* Remove any text shadows that might reduce contrast */
    padding: 3px 6px !important; /* Better padding for visibility */
    border-radius: 4px !important; /* Rounded corners for better appearance */
}

.truth-block-highlight.quality-excellent {
    background-color: rgba(39, 174, 96, 0.85) !important; /* Strong green background */
    color: #ffffff !important; /* White text for excellent contrast */
    border-left-color: #27ae60 !important;
}

.truth-block-highlight.quality-good {
    background-color: rgba(46, 204, 113, 0.80) !important; /* Good green background */
    color: #ffffff !important; /* White text for excellent contrast */
    border-left-color: #2ecc71 !important;
}

.truth-block-highlight.quality-moderate-high {
    background-color: rgba(243, 156, 18, 0.85) !important; /* Strong yellow/orange background */
    color: #000000 !important; /* Black text on yellow for better contrast */
    border-left-color: #f39c12 !important;
}

.truth-block-highlight.quality-moderate-low {
    background-color: rgba(230, 126, 34, 0.85) !important; /* Strong orange background */
    color: #ffffff !important; /* White text for excellent contrast */
    border-left-color: #e67e22 !important;
}

.truth-block-highlight.quality-poor {
    background-color: rgba(231, 76, 60, 0.85) !important; /* Strong red background */
    color: #ffffff !important; /* White text for excellent contrast */
    border-left-color: #e74c3c !important;
}

.truth-block-highlight.quality-unknown {
    background-color: rgba(108, 117, 125, 0.85) !important; /* Strong gray background */
    color: #ffffff !important; /* White text for excellent contrast */
    border-left-color: #6c757d !important;
}

/* Enhanced hover states for truth blocks */
.truth-block-highlight:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
    z-index: 10;
}

/* High contrast mode improvements for truth blocks */
@media (prefers-contrast: high) {
    .truth-block-highlight {
        font-weight: 700 !important; /* Even bolder text */
        border-width: 4px !important; /* Thicker border */
        padding: 4px 8px !important; /* More padding for better visibility */
    }

    /* Enhanced contrast while maintaining color spectrum */
    .truth-block-highlight.quality-excellent {
        background-color: #1e7e34 !important; /* Darker green for better contrast */
        color: #ffffff !important;
    }

    .truth-block-highlight.quality-good {
        background-color: #218838 !important; /* Darker green for better contrast */
        color: #ffffff !important;
    }

    .truth-block-highlight.quality-moderate-high {
        background-color: #e0a800 !important; /* Darker yellow for better contrast */
        color: #000000 !important; /* Black text on yellow */
    }

    .truth-block-highlight.quality-moderate-low {
        background-color: #d63384 !important; /* Darker orange for better contrast */
        color: #ffffff !important;
    }

    .truth-block-highlight.quality-poor {
        background-color: #c82333 !important; /* Darker red for better contrast */
        color: #ffffff !important;
    }

    .truth-block-highlight.quality-unknown {
        background-color: #495057 !important; /* Darker gray for better contrast */
        color: #ffffff !important;
    }
}

/* Alternative ultra-high contrast mode - can be toggled via JS if needed */
.ultra-contrast .truth-block-highlight {
    font-weight: 700 !important;
    border-width: 3px !important;
    padding: 4px 8px !important;
    margin: 2px !important;
    border-radius: 4px !important;
}

/* Ultra-contrast mode with enhanced color spectrum visibility */
.ultra-contrast .truth-block-highlight.quality-excellent {
    background-color: #155724 !important; /* Very dark green */
    color: #ffffff !important;
    border: 2px solid #28a745 !important;
}

.ultra-contrast .truth-block-highlight.quality-good {
    background-color: #0f5132 !important; /* Very dark teal-green */
    color: #ffffff !important;
    border: 2px solid #20c997 !important;
}

.ultra-contrast .truth-block-highlight.quality-moderate-high {
    background-color: #856404 !important; /* Very dark golden */
    color: #ffffff !important;
    border: 2px solid #ffc107 !important;
}

.ultra-contrast .truth-block-highlight.quality-moderate-low {
    background-color: #832d01 !important; /* Very dark orange */
    color: #ffffff !important;
    border: 2px solid #fd7e14 !important;
}

.ultra-contrast .truth-block-highlight.quality-poor {
    background-color: #721c24 !important; /* Very dark red */
    color: #ffffff !important;
    border: 2px solid #dc3545 !important;
}

.ultra-contrast .truth-block-highlight.quality-unknown {
    background-color: #343a40 !important; /* Very dark gray */
    color: #ffffff !important;
    border: 2px solid #6c757d !important;
}

/* Focus states for truth block accessibility */
.truth-block-highlight:focus {
    outline: 3px solid #005fcc !important;
    outline-offset: 2px;
}

/* Improve tooltip accessibility */
.truth-block-highlight::after {
    background: rgba(0,0,0,0.95) !important;
    color: white !important;
    font-weight: 500 !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
}

/* Dark mode support with accessible colors */
@media (prefers-color-scheme: dark) {
    :root {
        --quality-excellent-bg: #28a745;     /* Brighter green for dark mode */
        --quality-good-bg: #20c997;          /* Brighter teal for dark mode */
        --quality-medium-bg: #ffc107;        /* Bright yellow for dark mode */
        --quality-medium-text: #212529;      /* Dark text on yellow */
        --quality-low-bg: #fd7e14;           /* Bright orange for dark mode */
        --quality-poor-bg: #dc3545;          /* Bright red for dark mode */
        --quality-unknown-bg: #6c757d;       /* Medium gray for dark mode */
    }

    .trust-score-badge.trust-medium {
        color: var(--quality-medium-text) !important;
    }

        /* Truth block highlights for dark mode - more visible against dark backgrounds */
    .truth-block-highlight.quality-excellent {
        background-color: rgba(39, 174, 96, 0.90) !important; /* Strong green for dark mode */
        color: #ffffff !important;
    }

    .truth-block-highlight.quality-good {
        background-color: rgba(46, 204, 113, 0.85) !important; /* Strong green for dark mode */
        color: #ffffff !important;
    }

    .truth-block-highlight.quality-moderate-high {
        background-color: rgba(243, 156, 18, 0.90) !important; /* Strong yellow for dark mode */
        color: #000000 !important; /* Dark text on yellow background */
    }

    .truth-block-highlight.quality-moderate-low {
        background-color: rgba(230, 126, 34, 0.90) !important; /* Strong orange for dark mode */
        color: #ffffff !important;
    }

    .truth-block-highlight.quality-poor {
        background-color: rgba(231, 76, 60, 0.90) !important; /* Strong red for dark mode */
        color: #ffffff !important;
    }

    .truth-block-highlight.quality-unknown {
        background-color: rgba(108, 117, 125, 0.90) !important; /* Strong gray for dark mode */
        color: #ffffff !important;
    }
}
