/* Lighthouse Fixes CSS */

/* 1. Font Display: Swap for all fonts to avoid FOIT */
@font-face {
    font-family: inherit;
    font-style: inherit;
    font-weight: inherit;
    font-display: swap;
}

/* Force swap on common selectors */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a {
    font-display: swap;
}

/* 2. Accessibility: Color Contrast Improvements */
.meta-info,
.entry-meta,
.breadcrumb,
.site-info,
.entry-footer,
.comment-metadata {
    color: #595959 !important;
    /* Darker gray for 4.5:1 contrast */
}

a.read-more,
.btn-read-more,
.more-link {
    color: #fff !important;
    background-color: #333 !important;
    /* Ensure high contrast */
}

/* 3. Accessibility: Touch Target Size (Mobile) */
@media screen and (max-width: 768px) {

    .main-navigation a,
    .mobile-menu a,
    .pagination a,
    .widget a {
        padding: 12px 15px !important;
        display: inline-block;
        min-height: 44px;
        min-width: 44px;
    }

    .social-icons a,
    .social-links a {
        padding: 10px;
        min-width: 44px;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

/* 4. Layout Shifts (CLS) Fixes */
.site-branding img,
.custom-logo {
    max-width: 100%;
    height: auto;
}

/* Reserve space for slider if present */
.vilva-slider-section {
    min-height: 400px;
}

/* Fix Color Contrast for Description */
.site-description {
    color: #333 !important;
}

/* Fix Touch Targets for Categories/Tags */
.cat-links a,
.tags-links a,
.nav-links a,
.social-icons a {
    display: inline-block;
    padding: 12px !important;
    min-width: 48px;
    min-height: 48px;
    text-align: center;
    box-sizing: border-box;
}

/* 7. Reduced Motion (Accessibility/Performance) */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* 8. Skip Link Styling */
.skip-link {
    position: absolute;
    top: -9999px;
    left: 0;
    color: #fff;
    background: #333;
    padding: 15px;
    z-index: 99999;
}

.skip-link:focus {
    top: 0;
}