/* SimplyIrfan v7 — final cascade-safe visibility layer.
   This file is deliberately loaded LAST. */

/* ===== Homepage / Trending dark editorial sections ===== */
html:not(.dark) .si-tech-hero,
html:not(.dark) .si-tech-services,
html:not(.dark) .si-tech-contact,
html:not(.dark) .si-trending-hero {
    background: #07101d !important;
    color: #f8fbff !important;
}

html:not(.dark) .si-tech-hero h1,
html:not(.dark) .si-tech-hero h1 span,
html:not(.dark) .si-tech-hero .si-tech-hero-copy,
html:not(.dark) .si-tech-hero .si-tech-hero-copy p,
html:not(.dark) .si-tech-hero a,
html:not(.dark) .si-tech-services h2,
html:not(.dark) .si-tech-services h3,
html:not(.dark) .si-tech-services p,
html:not(.dark) .si-tech-services a,
html:not(.dark) .si-tech-contact h2,
html:not(.dark) .si-tech-contact p,
html:not(.dark) .si-trending-hero h1,
html:not(.dark) .si-trending-hero h1 span,
html:not(.dark) .si-trending-hero p,
html:not(.dark) .si-trending-hero a {
    color: #f8fbff !important;
}
html:not(.dark) .si-tech-hero h1 span,
html:not(.dark) .si-tech-contact h2 span,
html:not(.dark) .si-tech-services b {
    color: #55dff1 !important;
}
html:not(.dark) .si-tech-hero .si-tech-hero-copy p,
html:not(.dark) .si-tech-services p,
html:not(.dark) .si-tech-contact p {
    color: #b9c7d9 !important;
}
html:not(.dark) .si-trending-hero { background: #0a1120 !important; }
html:not(.dark) .si-trending-hero h1 { color:#f8fbff !important; }
html:not(.dark) .si-trending-hero h1 span { color:#75a8ff !important; }
html:not(.dark) .si-trending-hero p { color:#b7c5d8 !important; }
html:not(.dark) .si-trending-meta { color:#91a3bb !important; }
html:not(.dark) .si-trending-meta a { color:#fff !important; }

/* ===== Light-mode content sections ===== */
html:not(.dark) .si-tech-section,
html:not(.dark) .si-tech-categories,
html:not(.dark) .si-tech-tools,
html:not(.dark) .si-trending-index,
html:not(.dark) .si-trending-content {
    color:#0a1020 !important;
}
html:not(.dark) .si-tech-section h2,
html:not(.dark) .si-tech-section h3,
html:not(.dark) .si-tech-section a,
html:not(.dark) .si-tech-categories h2,
html:not(.dark) .si-tech-categories strong,
html:not(.dark) .si-tech-tools h2,
html:not(.dark) .si-tech-tools h3,
html:not(.dark) .si-trending-index h2,
html:not(.dark) .si-trending-index strong,
html:not(.dark) .si-topic-heading h2,
html:not(.dark) .si-topic-post h3 a {
    color:#0a1020 !important;
}
html:not(.dark) .si-tech-section p,
html:not(.dark) .si-tech-post p,
html:not(.dark) .si-tech-tools p,
html:not(.dark) .si-trending-index p,
html:not(.dark) .si-topic-post p {
    color:#59677d !important;
}

/* ===== Dark-mode post body ===== */
html.dark .post-content-body,
html.dark .post-content-body p,
html.dark .post-content-body li,
html.dark .post-content-body td,
html.dark .post-content-body th,
html.dark .post-content-body dd,
html.dark .post-content-body dt,
html.dark .post-content-body figcaption,
html.dark .post-content-body label,
html.dark .post-content-body blockquote {
    color:#dbe5f1 !important;
}
html.dark .post-content-body h1,
html.dark .post-content-body h2,
html.dark .post-content-body h3,
html.dark .post-content-body h4,
html.dark .post-content-body h5,
html.dark .post-content-body h6,
html.dark .post-content-body strong,
html.dark .post-content-body b {
    color:#f5f8fc !important;
}
html.dark .post-content-body a { color:#70a7ff !important; }
html.dark .post-content-body code { color:#e8f0fa !important; background:#182338 !important; }
html.dark .post-content-body pre { color:#e8f0fa !important; background:#070d17 !important; border-color:#263650 !important; }
html.dark .post-content-body blockquote { border-color:#3a75df !important; }

/* Gutenberg / WordPress content can use entry-content instead of the
   custom wrapper. Cover that path too. */
html.dark .entry-content,
html.dark .entry-content p,
html.dark .entry-content li,
html.dark .entry-content td,
html.dark .entry-content th,
html.dark .entry-content blockquote { color:#dbe5f1 !important; }
html.dark .entry-content h1,
html.dark .entry-content h2,
html.dark .entry-content h3,
html.dark .entry-content h4,
html.dark .entry-content h5,
html.dark .entry-content h6,
html.dark .entry-content strong,
html.dark .entry-content b { color:#f5f8fc !important; }
html.dark .entry-content a { color:#70a7ff !important; }

/* ===== Remove unnecessary decorative micro-badges/labels ===== */
.si-tech-hero-top,
.si-tech-hero-foot,
.si-tech-section-head small,
.si-tools-intro > div > small,
.si-contact-shell > div > small,
.si-page-head small,
.si-topic-heading > div > span {
    display:none !important;
}

/* ===== Header / mobile menu ===== */
@media (max-width: 900px) {
    .si-main-nav,
    .si-header-search { display:none !important; }
    .si-menu-toggle {
        display:grid !important;
        place-items:center !important;
        width:42px !important;
        height:42px !important;
        min-width:42px !important;
        padding:8px !important;
        margin:0 !important;
        border:1px solid #cfd8e5 !important;
        border-radius:10px !important;
        background:#fff !important;
        color:#0a1020 !important;
        visibility:visible !important;
        opacity:1 !important;
        position:relative !important;
        z-index:9999 !important;
        cursor:pointer !important;
    }
    .dark .si-menu-toggle {
        background:#101827 !important;
        border-color:#46536a !important;
        color:#f4f8ff !important;
    }
    .si-menu-toggle span {
        display:block !important;
        width:20px !important;
        height:2px !important;
        margin:2px auto !important;
        background:currentColor !important;
        border-radius:2px !important;
    }
    .si-mobile-panel {
        position:relative !important;
        z-index:9998 !important;
        display:block !important;
        background:#fff !important;
        color:#0a1020 !important;
        border-top:1px solid #e1e7ef !important;
    }
    .dark .si-mobile-panel {
        background:#080d18 !important;
        color:#f4f8ff !important;
        border-color:#263149 !important;
    }
    .si-mobile-panel a { color:inherit !important; }
}

/* Never let an accidental utility class make the menu button disappear. */
.si-menu-toggle[hidden] { display:grid !important; }

/* ===== v8: final visibility corrections ===== */
.si-footer{
    margin-top:0 !important;
}

/* The SEO tools hub CTA must remain readable regardless of Tailwind,
   inherited link rules, or dark-mode state. */
.si-tools-intro .si-tech-btn-dark,
.si-tools-intro .si-tech-btn-dark:visited,
.si-tools-intro .si-tech-btn-dark:hover,
.si-tools-intro .si-tech-btn-dark:focus,
.si-tools-intro .si-tech-btn-dark:active{
    background:#08111f !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    opacity:1 !important;
    visibility:visible !important;
    text-decoration:none !important;
}
.si-tools-intro .si-tech-btn-dark::first-letter{color:#ffffff !important;}
.si-tools-intro .si-tech-btn-dark b,
.si-tools-intro .si-tech-btn-dark span{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
}

/* Prevent the generic button/link styles from creating an invisible CTA. */
.si-tools-intro > a.si-tech-btn{
    display:inline-flex !important;
    min-height:48px !important;
    align-items:center !important;
}

@media(max-width:620px){
    .si-tools-intro .si-tech-btn-dark{width:max-content;max-width:100%;}
}

/* v21 — WCAG AA contrast pass.
   Replace low-contrast muted/metadata colours with AA-safe values. */
html:not(.dark) .si-tech-post-meta { color:#526173 !important; }
html:not(.dark) .si-tech-post-meta span { color:#526173 !important; }
html:not(.dark) .si-tech-placeholder em { color:#b8c7d8 !important; }
html:not(.dark) .si-tech-service-grid>a>span { color:#8297b2 !important; }
html:not(.dark) .si-tech-tools .si-tool-card>span { color:#5c6b7d !important; }
html:not(.dark) .si-tech-cat-grid span,
html:not(.dark) .si-tech-cat-grid em { color:#5d6b7c !important; }
html:not(.dark) .si-trending-index .si-topic-grid span,
html:not(.dark) .si-trending-index .si-topic-grid em { color:#5d6b7c !important; }
html:not(.dark) .si-404-links .num { color:#596a7e !important; }
html:not(.dark) .si-header-search svg { stroke:#526174 !important; }

/* Dark editorial surfaces: keep secondary text above AA contrast. */
html.dark .si-tech-services .si-tech-light-head small { color:#8297b2 !important; }
html.dark .si-tech-service-grid>a>span { color:#8297b2 !important; }
html.dark .si-tech-console-score span { color:#8da1ba !important; }
html.dark .si-console-stats { color:#8fa4bd !important; }
html.dark .si-tech-form label { color:#a5b5c8 !important; }
html.dark .si-footer-bottom { color:#9aaabd !important; }
html.dark .si-footer-note { color:#a0aec1 !important; }
html.dark .si-footer-status { color:#9aabc0 !important; }
html.dark .si-footer a:not(.si-brand) { color:#a9b8cb !important; }
html.dark .si-footer a:not(.si-brand):hover { color:#78dff0 !important; }

/* Light surfaces: improve all small metadata and helper copy. */
html:not(.dark) .si-tech-section-head small,
html:not(.dark) .si-tools-intro small,
html:not(.dark) .si-contact-shell small { color:#526173 !important; }
html:not(.dark) .si-tech-tools .si-tools-intro p { color:#4f5f73 !important; }
html:not(.dark) .si-tech-tools .si-tool-card p { color:#536276 !important; }
html:not(.dark) .si-tech-categories .si-tech-cat-grid span,
html:not(.dark) .si-tech-categories .si-tech-cat-grid em { color:#536276 !important; }
html:not(.dark) .si-tech-section .si-tech-post p { color:#536276 !important; }

/* Preserve the deliberate dark hero while ensuring every visible secondary
   label meets contrast requirements. */
html:not(.dark) .si-tech-hero .si-console-label { color:#a9bdd2 !important; }
html:not(.dark) .si-tech-hero .si-console-score span { color:#9eb2c9 !important; }
html:not(.dark) .si-tech-hero .si-console-stats { color:#9eb2c9 !important; }
html:not(.dark) .si-tech-hero .si-console-bar { color:#8ea5bd !important; }


/* Performance: reserve media dimensions and avoid unnecessary compositing on small screens. */
.si-tech-post-media img, .si-topic-image img, .si-story-image img, .si-story-thumb img { display:block; }
@media (prefers-reduced-motion: reduce) {
  .si-tech-post, .si-tech-post-media img, .si-topic-post, .si-topic-image img { transform:none !important; transition:none !important; }
}