/**
 * Quiz Spell Check Styles
 *
 * Ensures browser spell checking is visible and works properly in quiz textareas
 * Part of F-030 Enhanced Quiz System - Input Quality Layer
 */

/* ===== ENSURE SPELL CHECK IS ENABLED AND VISIBLE ===== */

/* Enable spell check on all quiz textareas */
.quiz-keyword-textarea,
textarea[data-question-id],
textarea[data-part-id] {
    /* Force spell check to be enabled */
    spellcheck: true;

    /* Ensure spell check decorations are not hidden */
    text-decoration-skip-ink: none;

    /* Allow browser to show spell check underlines */
    text-decoration-color: inherit;
}

/* Make spell check underlines more visible on dark backgrounds */
.quiz-keyword-textarea::spelling-error,
textarea[data-question-id]::spelling-error {
    text-decoration: underline wavy #ff5555;
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
}

.quiz-keyword-textarea::grammar-error,
textarea[data-question-id]::grammar-error {
    text-decoration: underline wavy #5555ff;
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
}

/* Firefox-specific spell check styling */
@-moz-document url-prefix() {
    .quiz-keyword-textarea,
    textarea[data-question-id] {
        /* Firefox respects the spellcheck attribute but doesn't support pseudo-elements */
        /* Spell check underlines will appear automatically */
    }
}

/* Chrome/Safari/Edge spell check */
@supports (-webkit-text-decoration-style: wavy) {
    .quiz-keyword-textarea,
    textarea[data-question-id] {
        /* Ensure decorations are visible */
        -webkit-text-decoration-skip: none;
    }
}

/* High contrast mode - make underlines even more visible */
@media (prefers-contrast: high) {
    .quiz-keyword-textarea::spelling-error,
    textarea[data-question-id]::spelling-error {
        text-decoration-color: #ff0000;
        text-decoration-thickness: 3px;
    }

    .quiz-keyword-textarea::grammar-error,
    textarea[data-question-id]::grammar-error {
        text-decoration-color: #0000ff;
        text-decoration-thickness: 3px;
    }
}

/* ===== ACCESSIBILITY ===== */

/* Screen readers should announce spelling errors */
.quiz-keyword-textarea[aria-invalid="spelling"],
textarea[data-question-id][aria-invalid="spelling"] {
    /* Visual indication for screen readers */
    border-left: 3px solid var(--error, #ef4444);
}

/* ===== PRINT STYLES ===== */

@media print {
    /* Hide spell check underlines when printing */
    .quiz-keyword-textarea::spelling-error,
    .quiz-keyword-textarea::grammar-error,
    textarea[data-question-id]::spelling-error,
    textarea[data-question-id]::grammar-error {
        text-decoration: none;
    }
}
