/**
 * User Link Styling
 *
 * Provides consistent styling for interactive user links throughout the platform.
 * Ensures proper hover states, accessibility, and visual hierarchy.
 */

/* Main user link styling */
.user-link {
    color: #0d6efd;
    transition: color 0.2s ease, text-decoration 0.2s ease;
}

.user-link:hover {
    color: #0a58ca;
    text-decoration: underline !important;
}

.user-link:focus {
    color: #0a58ca;
    outline: 2px solid #86b7fe;
    outline-offset: 2px;
    text-decoration: underline;
}

/* Simple user link for inline use */
.user-link-simple {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px dotted currentColor;
    transition: border-bottom 0.2s ease, color 0.2s ease;
}

.user-link-simple:hover {
    color: #0d6efd;
    border-bottom: 1px solid #0d6efd;
    text-decoration: none;
}

.user-link-simple:focus {
    color: #0d6efd;
    outline: 2px solid #86b7fe;
    outline-offset: 2px;
    border-bottom: 1px solid #0d6efd;
    text-decoration: none;
}

/* User links in different contexts */

/* User links in post headers */
.post-author .user-link {
    color: #212529 !important;
    font-weight: 600;
    text-decoration: none;
}

.post-author .user-link:hover {
    color: #0d6efd !important;
    text-decoration: underline;
}

.post-author .user-link:focus {
    color: #0d6efd !important;
    outline: 2px solid #86b7fe;
    outline-offset: 2px;
    text-decoration: underline;
}

/* User links in comments */
.comment .user-link {
    color: #495057;
}

.comment .user-link:hover {
    color: #0d6efd;
}

/* User links in truth blocks */
.truthblock-comment .user-link {
    color: #495057;
}

.truthblock-comment .user-link:hover {
    color: #0d6efd;
}

/* User links in member cards */
.member-card .user-link {
    color: #212529;
    font-weight: 500;
}

.member-card .user-link:hover {
    color: #0d6efd;
}

/* User links in lists */
.list-group-item .user-link,
.list-unstyled .user-link {
    color: #495057;
}

.list-group-item .user-link:hover,
.list-unstyled .user-link:hover {
    color: #0d6efd;
}

/* User links in content cards and white backgrounds */
.content-card .user-link,
.card .user-link,
.bg-white .user-link,
.bg-light .user-link {
    color: #212529 !important;
}

.content-card .user-link:hover,
.card .user-link:hover,
.bg-white .user-link:hover,
.bg-light .user-link:hover {
    color: #0d6efd !important;
}

/* User links in post meta and headers - high specificity */
.post-meta .user-link,
.post-header .user-link,
.post-author .user-link {
    color: #212529 !important;
    font-weight: 600;
}

.post-meta .user-link:hover,
.post-header .user-link:hover,
.post-author .user-link:hover {
    color: #0d6efd !important;
    text-decoration: underline;
}

/* User links in specific page contexts */
.node-detail .user-link,
.truthblock-detail .user-link {
    color: #212529 !important;
}

.node-detail .user-link:hover,
.truthblock-detail .user-link:hover {
    color: #0d6efd !important;
}

/* Bot indicator styling for user links */
.user-link .badge {
    font-size: 0.65em;
    vertical-align: top;
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    .user-link {
        color: #6ea8fe;
    }

    .user-link:hover {
        color: #9ec5fe;
    }

    .user-link:focus {
        outline-color: #6ea8fe;
    }

    .user-link-simple:hover,
    .user-link-simple:focus {
        color: #6ea8fe;
        border-bottom-color: #6ea8fe;
    }

    .post-author .user-link {
        color: #f8f9fa;
    }

    .post-author .user-link:hover {
        color: #6ea8fe;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .user-link,
    .post-author .user-link,
    .post-meta .user-link,
    .content-card .user-link,
    .card .user-link {
        color: #0000ff !important;
        text-decoration: underline !important;
        font-weight: 700 !important;
    }

    .user-link:hover,
    .user-link:focus,
    .post-author .user-link:hover,
    .post-author .user-link:focus {
        color: #000080 !important;
        outline: 3px solid #000080 !important;
        background: #ffff00 !important;
    }

    .user-link-simple {
        color: #0000ff !important;
        border-bottom: 2px solid #0000ff !important;
        font-weight: 700 !important;
    }

    .user-link-simple:hover,
    .user-link-simple:focus {
        color: #000080 !important;
        border-bottom: 2px solid #000080 !important;
        background: #ffff00 !important;
    }
}

/* Print styles */
@media print {
    .user-link,
    .user-link-simple {
        color: black !important;
        text-decoration: underline !important;
    }

    .user-link .badge {
        display: none;
    }
}

/* Mobile optimizations */
@media (max-width: 768px) {
    .user-link {
        /* Larger touch targets on mobile */
        padding: 2px 0;
    }

    .post-author .user-link {
        font-size: 0.95rem;
    }
}

/* Accessibility improvements for reduced motion */
@media (prefers-reduced-motion: reduce) {
    .user-link,
    .user-link-simple {
        transition: none;
    }
}

/* Emergency fallback for any remaining white text issues */
a.user-link[style*="color: white"],
a.user-link[style*="color: #fff"],
a.user-link[style*="color: #ffffff"] {
    color: #212529 !important;
}

/* Comprehensive fallback - ensure all user links have proper contrast */
.user-link {
    /* Ensure minimum contrast ratio */
    min-height: 18px;
    display: inline-block;
}

/* Force proper colors on all user links regardless of inheritance */
a[href*="/users/profile/"].user-link,
a[href*="/users/profile/"].user-link-simple {
    color: #212529 !important;
}

a[href*="/users/profile/"].user-link:hover,
a[href*="/users/profile/"].user-link-simple:hover {
    color: #0d6efd !important;
}
