/* ACCESSIBILITY FIXES - COLOR CONTRAST IMPROVEMENTS */
/* Ensures WCAG AA compliance with 4.5:1 contrast ratio minimum */

/* Fix post meta color contrast - override theme's #595959 (insufficient contrast) */
.post-preview .post-meta,
.post-meta,
span.post-meta {
    color: #000000 !important; /* Pure black for maximum contrast (21:1 ratio) */
}

/* Fix post meta links - override theme colors */
.post-preview .post-meta a,
.post-meta a,
span.post-meta a {
    color: #000000 !important; /* Pure black for links in post meta */
    text-decoration: underline !important; /* Underline links for visibility */
}
.post-preview .post-meta a:focus,
.post-meta a:focus,
span.post-meta a:focus {
    outline: 2px solid #000000 !important; /* Visible focus outline */
    outline-offset: 2px;
}
.post-preview .post-meta a:hover,
.post-preview .post-meta a:focus,
.post-meta a:hover,
.post-meta a:focus,
span.post-meta a:hover,
span.post-meta a:focus {
    color: #000000 !important; /* Keep black on hover/focus */
    text-decoration: underline;
}

/* Fix footer text-muted - was #777777 (insufficient contrast) */
.text-muted {
    color: var(--site-fg) !important; /* Use site foreground for strong contrast */
}

/* Specific footer credits override */
.credits.copyright.text-muted {
    color: var(--site-fg) !important; /* Use site foreground for strong contrast */
}

/* Site footer general text */
#site-footer {
    color: var(--site-fg) !important;
}

/* Footer links for better contrast */
#site-footer a {
    color: var(--link-hover) !important; /* Use darker link color for accessibility */
}

#site-footer a:hover,
#site-footer a:focus {
    color: #000000 !important; /* Pure black on hover/focus for maximum contrast */
    text-decoration: underline;
}

/* Preserve visual hierarchy while improving accessibility */
.post-preview .post-meta,
.post-meta,
span.post-meta {
    font-style: italic; /* Keep italic styling for visual distinction */
    font-size: 18px; /* Maintain size for readability */
}

/* Media queries for responsive contrast adjustments */
@media (max-width: 767px) {
    .post-preview .post-meta,
    .post-meta,
    span.post-meta {
        font-size: 16px; /* Slightly smaller on mobile but still readable */
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .post-preview .post-meta,
    .post-meta,
    span.post-meta,
    .text-muted,
    .credits.copyright.text-muted {
        color: #000000 !important; /* Pure black in high contrast mode */
    }
}

/* SOCIAL ICONS VISIBILITY FIXES */
/* Fix FontAwesome stacked icons that are invisible on white backgrounds */

/* Footer social icons with better contrast */
.footer-links .fa-stack {
    position: relative;
}

/* Dark background circle for social icons */
.footer-links .fa-stack .fa-circle {
    color: #404040 !important; /* Dark gray instead of default */
}

/* Icons should be white/light on dark backgrounds */
.footer-links .fa-stack .fa-inverse {
    color: #ffffff !important; /* Ensure white icons on dark backgrounds */
}

/* Responsive icon sizing for better touch targets */
.footer-links .fa-stack {
    width: 2.5em;
    height: 2.5em;
    line-height: 2.5em;
}

/* Hover effects for better UX */
.footer-links a:hover .fa-circle,
.footer-links a:focus .fa-circle {
    color: #262626 !important; /* Darker on hover */
    transform: scale(1.1);
    transition: all 0.2s ease;
}

/* Dark mode support for icons */
@media (prefers-color-scheme: dark) {
    /* Override post-meta colors for dark mode */
    .post-preview .post-meta,
    .post-meta,
    span.post-meta {
        color: #ffffff !important; /* Pure white on dark backgrounds */
    }
    
    .post-preview .post-meta a,
    .post-meta a,
    span.post-meta a {
        color: #ffffff !important; /* White links in dark mode */
        text-decoration: underline !important;
    }
    
    .footer-links .fa-stack .fa-circle {
        color: #606060 !important; /* Lighter gray in dark mode */
    }
    
    .footer-links a:hover .fa-circle,
    .footer-links a:focus .fa-circle {
        color: #808080 !important; /* Even lighter on hover in dark mode */
    }
}

/* Alternative: Use border instead of filled circle for better contrast */
.footer-links .fa-stack-2x {
    text-shadow: none;
}

.footer-links .fa-stack-1x {
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3); /* Add shadow for better contrast */
}

/* Accessibility improvements */
.footer-links a {
    display: inline-block;
    margin: 5px;
    border-radius: 50%;
    transition: transform 0.2s ease;
}

.footer-links a:focus,
.footer-links a:hover {
    outline: 2px solid #0085a1;
    outline-offset: 2px;
    transform: translateY(-2px);
}