/**
 * Undercover.co.id Dark Typography
 * Scope: color and typography only.
 * No layout, spacing, content, schema, or template changes.
 */

:root {
    --uc-bg: #070707;
    --uc-surface: #0c0c0c;
    --uc-surface-raised: #111111;
    --uc-text: #ffffff;
    --uc-text-muted: #ffffff;
    --uc-heading: #ffffff;
    --uc-border: #292929;
    --uc-accent: #ffffff;
    --uc-accent-hover: #ffffff;
    --uc-heading-font: "Google Sans Flex", "Google Sans", Arial, sans-serif;
    --uc-body-font: "Google Sans Flex", "Google Sans", Arial, sans-serif;
}

/* Global canvas */
html,
body.uc-dark-typography-active,
body.uc-dark-typography-active #page,
body.uc-dark-typography-active .site,
body.uc-dark-typography-active .site-content,
body.uc-dark-typography-active .ast-container,
body.uc-dark-typography-active .content-area,
body.uc-dark-typography-active .site-main {
    background-color: var(--uc-bg) !important;
    color: var(--uc-text) !important;
}

body.uc-dark-typography-active {
    font-family: var(--uc-body-font) !important;
    font-optical-sizing: auto;
    font-weight: 400;
    color-scheme: dark;
}

/* Preserve every existing font size. Change family, weight and rhythm only. */
body.uc-dark-typography-active h1,
body.uc-dark-typography-active h2,
body.uc-dark-typography-active h3,
body.uc-dark-typography-active h4,
body.uc-dark-typography-active h5,
body.uc-dark-typography-active h6,
body.uc-dark-typography-active .entry-title,
body.uc-dark-typography-active .page-title,
body.uc-dark-typography-active .widget-title {
    font-family: var(--uc-heading-font) !important;
    font-weight: 500 !important;
    color: var(--uc-heading) !important;
    letter-spacing: -0.03em;
    font-optical-sizing: auto;
    text-wrap: balance;
}

body.uc-dark-typography-active p,
body.uc-dark-typography-active li,
body.uc-dark-typography-active dd,
body.uc-dark-typography-active dt,
body.uc-dark-typography-active figcaption,
body.uc-dark-typography-active label,
body.uc-dark-typography-active input,
body.uc-dark-typography-active textarea,
body.uc-dark-typography-active select,
body.uc-dark-typography-active button,
body.uc-dark-typography-active .main-header-menu,
body.uc-dark-typography-active .site-title,
body.uc-dark-typography-active .site-description {
    font-family: var(--uc-body-font) !important;
}

body.uc-dark-typography-active p,
body.uc-dark-typography-active li,
body.uc-dark-typography-active dd,
body.uc-dark-typography-active dt,
body.uc-dark-typography-active figcaption {
    color: var(--uc-text-muted) !important;
}

body.uc-dark-typography-active strong,
body.uc-dark-typography-active b {
    color: var(--uc-text) !important;
}

/* Header and navigation */
body.uc-dark-typography-active .site-header,
body.uc-dark-typography-active .ast-primary-header-bar,
body.uc-dark-typography-active .ast-above-header-bar,
body.uc-dark-typography-active .ast-below-header-bar,
body.uc-dark-typography-active .main-header-bar,
body.uc-dark-typography-active .ast-mobile-header-wrap,
body.uc-dark-typography-active .ast-mobile-popup-inner {
    background: var(--uc-bg) !important;
    border-color: var(--uc-border) !important;
}

body.uc-dark-typography-active .site-title,
body.uc-dark-typography-active .site-title a,
body.uc-dark-typography-active .site-description,
body.uc-dark-typography-active .main-header-menu > .menu-item > .menu-link,
body.uc-dark-typography-active .ast-header-html,
body.uc-dark-typography-active .ast-header-html a,
body.uc-dark-typography-active .ast-menu-toggle,
body.uc-dark-typography-active .menu-toggle,
body.uc-dark-typography-active .mobile-menu-toggle-icon {
    color: var(--uc-text) !important;
}

body.uc-dark-typography-active .main-header-menu > .menu-item:hover > .menu-link,
body.uc-dark-typography-active .main-header-menu > .current-menu-item > .menu-link,
body.uc-dark-typography-active .main-header-menu > .current-menu-ancestor > .menu-link,
body.uc-dark-typography-active .site-title a:hover {
    color: var(--uc-accent-hover) !important;
}

body.uc-dark-typography-active .main-header-menu .sub-menu,
body.uc-dark-typography-active .ast-desktop .main-header-menu .sub-menu,
body.uc-dark-typography-active .ast-mobile-popup-content .main-header-menu .sub-menu {
    background: var(--uc-surface-raised) !important;
    border-color: var(--uc-border) !important;
}

body.uc-dark-typography-active .main-header-menu .sub-menu .menu-link {
    color: var(--uc-text-muted) !important;
    background: transparent !important;
}

body.uc-dark-typography-active .main-header-menu .sub-menu .menu-link:hover,
body.uc-dark-typography-active .main-header-menu .sub-menu .current-menu-item > .menu-link {
    color: var(--uc-heading) !important;
    background: #171717 !important;
}

/* Existing content containers, without changing dimensions or positioning */
body.uc-dark-typography-active article,
body.uc-dark-typography-active .ast-article-single,
body.uc-dark-typography-active .ast-article-post,
body.uc-dark-typography-active .entry-content,
body.uc-dark-typography-active .site-content .ast-container > .content-area,
body.uc-dark-typography-active .widget,
body.uc-dark-typography-active .wp-block-group,
body.uc-dark-typography-active .wp-block-cover__inner-container {
    color: var(--uc-text) !important;
}

body.uc-dark-typography-active .ast-article-single,
body.uc-dark-typography-active .ast-article-post,
body.uc-dark-typography-active .widget,
body.uc-dark-typography-active .wp-block-group.has-background,
body.uc-dark-typography-active .wp-block-column.has-background,
body.uc-dark-typography-active .wp-block-cover:not(.has-background-dim) {
    background-color: var(--uc-surface) !important;
    border-color: var(--uc-border) !important;
}

/* Normalize inline light backgrounds commonly produced by Gutenberg/page editors. */
body.uc-dark-typography-active .entry-content [style*="background-color: white"],
body.uc-dark-typography-active .entry-content [style*="background-color:#fff"],
body.uc-dark-typography-active .entry-content [style*="background-color: #fff"],
body.uc-dark-typography-active .entry-content [style*="background-color:#ffffff"],
body.uc-dark-typography-active .entry-content [style*="background-color: #ffffff"],
body.uc-dark-typography-active .entry-content .has-white-background-color,
body.uc-dark-typography-active .entry-content .has-ast-global-color-5-background-color,
body.uc-dark-typography-active .entry-content .has-ast-global-color-4-background-color {
    background-color: var(--uc-surface) !important;
}

body.uc-dark-typography-active .entry-content .has-black-color,
body.uc-dark-typography-active .entry-content .has-ast-global-color-3-color,
body.uc-dark-typography-active .entry-content [style*="color: black"],
body.uc-dark-typography-active .entry-content [style*="color:#000"],
body.uc-dark-typography-active .entry-content [style*="color: #000"] {
    color: var(--uc-text) !important;
}

/* Links */
body.uc-dark-typography-active a:not(.wp-element-button):not(.button):not(.ast-custom-button-link) {
    color: var(--uc-accent) !important;
}

body.uc-dark-typography-active a:not(.wp-element-button):not(.button):not(.ast-custom-button-link):hover,
body.uc-dark-typography-active a:not(.wp-element-button):not(.button):not(.ast-custom-button-link):focus-visible {
    color: var(--uc-accent-hover) !important;
}

/* Buttons retain existing dimensions and shape. */
body.uc-dark-typography-active button,
body.uc-dark-typography-active input[type="button"],
body.uc-dark-typography-active input[type="submit"],
body.uc-dark-typography-active .button,
body.uc-dark-typography-active .wp-element-button,
body.uc-dark-typography-active .wp-block-button__link,
body.uc-dark-typography-active .ast-custom-button,
body.uc-dark-typography-active .ast-custom-button-link .ast-custom-button {
    background-color: var(--uc-heading) !important;
    color: var(--uc-bg) !important;
    border-color: var(--uc-heading) !important;
    font-family: var(--uc-body-font) !important;
}

body.uc-dark-typography-active button:hover,
body.uc-dark-typography-active input[type="button"]:hover,
body.uc-dark-typography-active input[type="submit"]:hover,
body.uc-dark-typography-active .button:hover,
body.uc-dark-typography-active .wp-element-button:hover,
body.uc-dark-typography-active .wp-block-button__link:hover,
body.uc-dark-typography-active .ast-custom-button:hover {
    background-color: var(--uc-accent-hover) !important;
    border-color: var(--uc-accent-hover) !important;
    color: var(--uc-bg) !important;
}

/* Forms */
body.uc-dark-typography-active input:not([type="submit"]):not([type="button"]),
body.uc-dark-typography-active textarea,
body.uc-dark-typography-active select {
    background-color: var(--uc-surface-raised) !important;
    color: var(--uc-text) !important;
    border-color: var(--uc-border) !important;
}

body.uc-dark-typography-active input::placeholder,
body.uc-dark-typography-active textarea::placeholder {
    color: #ffffff !important;
}

/* Tables, code and quoted material */
body.uc-dark-typography-active table,
body.uc-dark-typography-active th,
body.uc-dark-typography-active td {
    border-color: var(--uc-border) !important;
    color: var(--uc-text-muted) !important;
}

body.uc-dark-typography-active th {
    color: var(--uc-heading) !important;
    background-color: var(--uc-surface-raised) !important;
}

body.uc-dark-typography-active pre,
body.uc-dark-typography-active code,
body.uc-dark-typography-active .wp-block-code,
body.uc-dark-typography-active blockquote {
    background-color: var(--uc-surface-raised) !important;
    color: var(--uc-text) !important;
    border-color: var(--uc-border) !important;
}

body.uc-dark-typography-active hr,
body.uc-dark-typography-active .wp-block-separator {
    border-color: var(--uc-border) !important;
    background-color: var(--uc-border) !important;
}

/* Footer */
body.uc-dark-typography-active .site-footer,
body.uc-dark-typography-active .site-primary-footer-wrap,
body.uc-dark-typography-active .site-above-footer-wrap,
body.uc-dark-typography-active .site-below-footer-wrap,
body.uc-dark-typography-active .footer-widget-area,
body.uc-dark-typography-active .ast-footer-overlay {
    background-color: var(--uc-bg) !important;
    border-color: var(--uc-border) !important;
    color: var(--uc-text-muted) !important;
}

body.uc-dark-typography-active .site-footer h1,
body.uc-dark-typography-active .site-footer h2,
body.uc-dark-typography-active .site-footer h3,
body.uc-dark-typography-active .site-footer h4,
body.uc-dark-typography-active .site-footer h5,
body.uc-dark-typography-active .site-footer h6,
body.uc-dark-typography-active .ast-footer-copyright,
body.uc-dark-typography-active .ast-footer-copyright p {
    color: var(--uc-text) !important;
}

/* Full-bright typography: regular, bold, navigation, links and footer text. */
body.uc-dark-typography-active p,
body.uc-dark-typography-active li,
body.uc-dark-typography-active dd,
body.uc-dark-typography-active dt,
body.uc-dark-typography-active figcaption,
body.uc-dark-typography-active label,
body.uc-dark-typography-active strong,
body.uc-dark-typography-active b,
body.uc-dark-typography-active em,
body.uc-dark-typography-active small,
body.uc-dark-typography-active .site-description,
body.uc-dark-typography-active .main-header-menu .menu-link,
body.uc-dark-typography-active .site-footer,
body.uc-dark-typography-active .site-footer p,
body.uc-dark-typography-active .site-footer li,
body.uc-dark-typography-active .site-footer a,
body.uc-dark-typography-active a:not(.wp-element-button):not(.button):not(.ast-custom-button-link) {
    color: #ffffff !important;
}

/* Browser selection */
body.uc-dark-typography-active ::selection {
    background: var(--uc-accent);
    color: #070707;
}

/* Accessibility: clear keyboard focus without changing layout. */
body.uc-dark-typography-active :focus-visible {
    outline-color: var(--uc-accent-hover) !important;
}

/* Keep media and third-party floating controls untouched. */
body.uc-dark-typography-active img,
body.uc-dark-typography-active svg,
body.uc-dark-typography-active video,
body.uc-dark-typography-active iframe,
body.uc-dark-typography-active [class*="whatsapp"],
body.uc-dark-typography-active [id*="whatsapp"] {
    filter: none;
}

/* Astra mobile navigation visibility fix. No layout or spacing changes. */
@media (max-width: 921px) {
    body.uc-dark-typography-active .ast-mobile-header-wrap,
    body.uc-dark-typography-active .ast-mobile-header-content,
    body.uc-dark-typography-active .ast-mobile-popup-drawer,
    body.uc-dark-typography-active .ast-mobile-popup-drawer .ast-mobile-popup-inner,
    body.uc-dark-typography-active .ast-mobile-popup-drawer .ast-mobile-popup-content,
    body.uc-dark-typography-active .ast-builder-menu-mobile,
    body.uc-dark-typography-active .ast-builder-menu-mobile .main-navigation,
    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu,
    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu .sub-menu,
    body.uc-dark-typography-active.ast-header-break-point .main-navigation,
    body.uc-dark-typography-active.ast-header-break-point .main-navigation ul,
    body.uc-dark-typography-active.ast-header-break-point .main-navigation ul.sub-menu,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .sub-menu {
        background-color: var(--uc-bg) !important;
        color: #ffffff !important;
        border-color: var(--uc-border) !important;
    }

    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu > .menu-item,
    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu .sub-menu > .menu-item,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu > .menu-item,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .sub-menu > .menu-item {
        background-color: var(--uc-bg) !important;
        border-color: var(--uc-border) !important;
    }

    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu .menu-item > .menu-link,
    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu .sub-menu .menu-link,
    body.uc-dark-typography-active .ast-mobile-popup-content .main-header-menu .menu-item > .menu-link,
    body.uc-dark-typography-active .ast-mobile-popup-content .main-header-menu .sub-menu .menu-link,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .menu-item > .menu-link,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .sub-menu .menu-link {
        background-color: transparent !important;
        color: #ffffff !important;
        border-color: var(--uc-border) !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu .menu-item:hover > .menu-link,
    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu .current-menu-item > .menu-link,
    body.uc-dark-typography-active .ast-builder-menu-mobile .main-header-menu .current-menu-ancestor > .menu-link,
    body.uc-dark-typography-active .ast-mobile-popup-content .main-header-menu .menu-item:hover > .menu-link,
    body.uc-dark-typography-active .ast-mobile-popup-content .main-header-menu .current-menu-item > .menu-link,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .menu-item:hover > .menu-link,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .current-menu-item > .menu-link,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .current-menu-ancestor > .menu-link {
        background-color: #171717 !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    body.uc-dark-typography-active .ast-builder-menu-mobile .ast-menu-toggle,
    body.uc-dark-typography-active .ast-mobile-popup-content .ast-menu-toggle,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .ast-menu-toggle {
        background: transparent !important;
        color: #ffffff !important;
        border-color: transparent !important;
        box-shadow: none !important;
    }

    body.uc-dark-typography-active .ast-builder-menu-mobile .ast-menu-toggle svg,
    body.uc-dark-typography-active .ast-mobile-popup-content .ast-menu-toggle svg,
    body.uc-dark-typography-active.ast-header-break-point .main-header-menu .ast-menu-toggle svg,
    body.uc-dark-typography-active .ast-mobile-menu-trigger-minimal svg,
    body.uc-dark-typography-active .mobile-menu-toggle-icon svg {
        fill: currentColor !important;
        stroke: currentColor !important;
        color: #ffffff !important;
    }
}

/* v1.0.4: top-right mobile menu trigger beside the logo. */
@media (max-width: 921px) {
    body.uc-dark-typography-active .ast-mobile-header-wrap .ast-primary-header-bar,
    body.uc-dark-typography-active .ast-mobile-header-wrap .site-header-primary-section-right,
    body.uc-dark-typography-active .ast-mobile-header-wrap .ast-builder-layout-element,
    body.uc-dark-typography-active .ast-mobile-header-wrap .ast-button-wrap {
        background-color: var(--uc-bg) !important;
        color: #ffffff !important;
    }

    body.uc-dark-typography-active .ast-mobile-header-wrap .ast-button-wrap .menu-toggle,
    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle.main-header-menu-toggle,
    body.uc-dark-typography-active .ast-mobile-header-wrap .ast-mobile-menu-trigger-minimal,
    body.uc-dark-typography-active.ast-header-break-point .ast-button-wrap .menu-toggle,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle.main-header-menu-toggle,
    body.uc-dark-typography-active.ast-header-break-point .ast-mobile-menu-trigger-minimal {
        background: transparent !important;
        background-color: transparent !important;
        color: #ffffff !important;
        border-color: transparent !important;
        box-shadow: none !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle .mobile-menu-toggle-icon,
    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle .ast-mobile-svg,
    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle .ahfb-svg-iconset,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle .mobile-menu-toggle-icon,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle .ast-mobile-svg,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle .ahfb-svg-iconset {
        color: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle svg,
    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle svg path,
    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle svg line,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle svg,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle svg path,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle svg line {
        color: #ffffff !important;
        fill: #ffffff !important;
        stroke: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle:hover,
    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle:focus,
    body.uc-dark-typography-active .ast-mobile-header-wrap .menu-toggle.toggled,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle:hover,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle:focus,
    body.uc-dark-typography-active.ast-header-break-point .menu-toggle.toggled {
        background-color: #171717 !important;
        color: #ffffff !important;
    }
}


/* v1.0.5: Astra and common Related Posts blocks. Color only, no layout changes. */
body.uc-dark-typography-active .ast-related-posts-wrapper,
body.uc-dark-typography-active .ast-related-posts-title-section,
body.uc-dark-typography-active .ast-related-posts-inner-section,
body.uc-dark-typography-active .ast-related-post,
body.uc-dark-typography-active .ast-related-post-content,
body.uc-dark-typography-active .related-posts,
body.uc-dark-typography-active .related-posts-wrapper,
body.uc-dark-typography-active .related-post,
body.uc-dark-typography-active .related-post-content,
body.uc-dark-typography-active [class*="related-posts"]:not(img):not(svg),
body.uc-dark-typography-active [class*="related-post-content"] {
    background-color: var(--uc-bg) !important;
    border-color: var(--uc-border) !important;
    color: #ffffff !important;
}

body.uc-dark-typography-active .ast-related-posts-wrapper article,
body.uc-dark-typography-active .ast-related-posts-wrapper .ast-related-post,
body.uc-dark-typography-active .ast-related-posts-inner-section article,
body.uc-dark-typography-active .related-posts article,
body.uc-dark-typography-active .related-posts .related-post,
body.uc-dark-typography-active [class*="related-posts"] article {
    background-color: var(--uc-surface) !important;
    border-color: var(--uc-border) !important;
    color: #ffffff !important;
}

body.uc-dark-typography-active .ast-related-posts-wrapper h1,
body.uc-dark-typography-active .ast-related-posts-wrapper h2,
body.uc-dark-typography-active .ast-related-posts-wrapper h3,
body.uc-dark-typography-active .ast-related-posts-wrapper h4,
body.uc-dark-typography-active .ast-related-posts-wrapper h5,
body.uc-dark-typography-active .ast-related-posts-wrapper h6,
body.uc-dark-typography-active .ast-related-posts-wrapper p,
body.uc-dark-typography-active .ast-related-posts-wrapper span,
body.uc-dark-typography-active .ast-related-posts-wrapper time,
body.uc-dark-typography-active .ast-related-posts-wrapper .entry-meta,
body.uc-dark-typography-active .ast-related-posts-wrapper .ast-related-post-title,
body.uc-dark-typography-active .related-posts h1,
body.uc-dark-typography-active .related-posts h2,
body.uc-dark-typography-active .related-posts h3,
body.uc-dark-typography-active .related-posts h4,
body.uc-dark-typography-active .related-posts p,
body.uc-dark-typography-active .related-posts span,
body.uc-dark-typography-active .related-posts time,
body.uc-dark-typography-active [class*="related-posts"] .entry-title,
body.uc-dark-typography-active [class*="related-posts"] .entry-meta {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body.uc-dark-typography-active .ast-related-posts-wrapper a,
body.uc-dark-typography-active .related-posts a,
body.uc-dark-typography-active [class*="related-posts"] a {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body.uc-dark-typography-active .ast-related-posts-wrapper a:hover,
body.uc-dark-typography-active .ast-related-posts-wrapper a:focus-visible,
body.uc-dark-typography-active .related-posts a:hover,
body.uc-dark-typography-active .related-posts a:focus-visible,
body.uc-dark-typography-active [class*="related-posts"] a:hover,
body.uc-dark-typography-active [class*="related-posts"] a:focus-visible {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
