/* RiPro dark-mode surfaces. Keep theme text, borders, images and action colors. */
[data-bs-theme=dark] {
    --ri-body-bg: #000;
    --ri-body-bg-rgb: 0, 0, 0;
    --ri-secondary-bg: #000;
    --ri-secondary-bg-rgb: 0, 0, 0;
    --ri-tertiary-bg: #000;
    --ri-tertiary-bg-rgb: 0, 0, 0;
    --ri-secondary-bg-subtle: #000;
    --ri-light-bg-subtle: #000;
    --ri-dark-bg-subtle: #000;
}

[data-bs-theme=dark] body {
    background-color: #000 !important;
}

/* These theme surfaces use fixed colors rather than the background variables. */
[data-bs-theme=dark] :is(
    .post-item, .card:not(.bg-primary, .bg-success, .bg-info, .bg-warning, .bg-danger),
    .price-card, .site-footer, .sidebar .widget, .filter-warp,
    .ri-popup-content, .search-form, .off-canvas, .h-navList,
    .home-division .division-item, .home-title-post .list-posts ul,
    .entry-navigation .entry-page-next, .entry-navigation .entry-page-prev,
    .links-page-warp .link-item, .tags-page-warp .tag-item,
    .home-scratch-card .scratch-item .code-content,
    .navbar .nav-list .sub-menu, .navbar .action-hover-menu .hover-warp,
    .navbar .action-hover-menu .hover-info, .navbar .action-hover-menu .abstop-item a,
    .slicknav_menu .slicknav_nav .menu-item > a, .slicknav_menu .slicknav_nav .sub-menu,
    .uc-page .coin-balance-body, .post-content blockquote, .rollbar .actions li,
    .ri-hide-warp, .ri-hide-warp .hide-msg, .post-content .ri-down-warp,
    .sidebar .post-down-widget .down-title, .pay-body-html .title > p,
    .ri-video-warp .video-buy-warp .prices-info, kbd,
    .modal-content, .dropdown-menu, .popover, .toast, #comments
) {
    background: #000 !important;
}

[data-bs-theme=dark] .bg-white {
    background-color: #000 !important;
}

[data-bs-theme=dark] .home-last-post .section-cat-navbtn .btn:not(.active):not(:hover),
[data-bs-theme=dark] .uc-page .coin-pay-card:not(.active):not(:hover),
[data-bs-theme=dark] .entry-tags > a:not(:hover) {
    background-color: #000 !important;
}

[data-bs-theme=dark] .navbar .nav-list .sub-menu::before,
[data-bs-theme=dark] .ri-down-warp .down-buy-warp .prices-info::before,
[data-bs-theme=dark] .ri-video-warp .video-buy-warp .prices-info::before {
    border-bottom-color: #000;
}

[data-bs-theme=dark] .sidebar .widget_search input,
[data-bs-theme=dark] .sidebar .widget_search input:focus {
    background-color: #000;
    color: var(--ri-body-color);
}

[data-bs-theme=dark] .ri-video-warp .video-buy-warp .prices-info .price-item {
    text-shadow: none;
}

[data-bs-theme=dark] .off-canvas .canvas-close {
    color: var(--ri-body-color);
}

[data-bs-theme=dark] .home-search-box .search-bg-overlay {
    background: rgba(0, 0, 0, .8);
}

/* The theme already renders a header-gap; use it to reserve the fixed bar's height. */
:root {
    --qfo-header-height: 60px;
    --qfo-header-material: rgba(255, 255, 255, .94);
    --qfo-header-line: rgba(0, 0, 0, .08);
    scroll-padding-top: calc(var(--qfo-header-height) + var(--qfo-adminbar-offset, 0px) + 12px);
}

[data-bs-theme=dark] {
    --qfo-header-material: rgba(0, 0, 0, .94);
    --qfo-header-line: rgba(255, 255, 255, .1);
}

@supports ((backdrop-filter: blur(16px)) or (-webkit-backdrop-filter: blur(16px))) {
    :root { --qfo-header-material: rgba(255, 255, 255, .65); }
    [data-bs-theme=dark] { --qfo-header-material: rgba(0, 0, 0, .65); }
}

.site-header,
.site-header.navbar-now,
.site-header.navbar-sticky {
    position: fixed !important;
    top: var(--qfo-adminbar-offset, 0px);
    -webkit-transform: none !important;
    transform: none !important;
    background-color: var(--qfo-header-material) !important;
    -webkit-backdrop-filter: blur(16px) saturate(150%) !important;
    backdrop-filter: blur(16px) saturate(150%) !important;
    box-shadow: inset 0 -1px 0 var(--qfo-header-line), 0 4px 20px rgba(0, 0, 0, .06) !important;
    transition: background-color .2s ease, box-shadow .2s ease;
}

.header-gap { height: var(--qfo-header-height); }
.admin-bar .site-header { top: var(--qfo-adminbar-offset, 32px); }
@media (max-width: 782px) {
    .admin-bar .site-header { top: var(--qfo-adminbar-offset, 46px); }
}

@media (prefers-reduced-motion: reduce) {
    .site-header,
    .site-header.navbar-now,
    .site-header.navbar-sticky { transition: none; }
}

/* Keep the theme's mobile menu links inside one floating glass capsule. */
@media (max-width: 767.98px) {
    .qfo-mobile-bubbles .m-navbar {
        --qfo-bubble-fill: rgba(255, 255, 255, .94);
        --qfo-bubble-line: rgba(0, 0, 0, .12);
        --qfo-bubble-ink: #252525;
        position: fixed;
        left: max(12px, env(safe-area-inset-left, 0px));
        right: max(12px, env(safe-area-inset-right, 0px));
        bottom: calc(12px + env(safe-area-inset-bottom, 0px));
        padding: 0;
        background: transparent;
        box-shadow: none;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        pointer-events: none;
    }

    [data-bs-theme=dark] .qfo-mobile-bubbles .m-navbar {
        --qfo-bubble-fill: rgba(0, 0, 0, .94);
        --qfo-bubble-line: rgba(255, 255, 255, .22);
        --qfo-bubble-ink: #f5f5f5;
        background: transparent;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    .qfo-mobile-bubbles .m-navbar::before,
    .qfo-mobile-bubbles .m-navbar li a.active::after {
        display: none;
    }

    .qfo-mobile-bubbles .m-navbar ul {
        width: 100%;
        max-width: 400px;
        min-height: 64px;
        margin: 0 auto;
        padding: 8px 6px;
        gap: 0;
        justify-content: center;
        border: 1px solid var(--qfo-bubble-line);
        border-radius: 999px;
        background: var(--qfo-bubble-fill);
        -webkit-backdrop-filter: blur(16px) saturate(140%);
        backdrop-filter: blur(16px) saturate(140%);
        pointer-events: auto;
    }

    .qfo-mobile-bubbles .m-navbar li {
        flex: 1 1 0;
        min-width: 0;
    }

    .qfo-mobile-bubbles .m-navbar li a {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 3px;
        width: 100%;
        min-height: 46px;
        margin: 0;
        padding: 5px 2px;
        border: 0;
        border-radius: 12px;
        background: transparent;
        color: var(--qfo-bubble-ink);
        box-shadow: none;
        pointer-events: auto;
        transition: color .2s ease;
        -webkit-tap-highlight-color: transparent;
    }

    .qfo-mobile-bubbles .m-navbar li a > i {
        margin: 0;
        font-size: 18px;
        line-height: 1;
        transform: none;
    }

    .qfo-mobile-bubbles .m-navbar li a > span {
        max-width: calc(100% - 6px);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: clamp(10px, 2.7vw, 11px);
        font-weight: 500;
        line-height: 1.25;
    }

    .qfo-mobile-bubbles .m-navbar li a.active,
    .qfo-mobile-bubbles .m-navbar li a:hover {
        color: var(--ri-primary);
    }

    .qfo-mobile-bubbles .m-navbar li a:focus-visible {
        outline: 2px solid var(--ri-primary);
        outline-offset: 3px;
    }

    .qfo-mobile-bubbles .site-footer {
        margin-bottom: calc(94px + env(safe-area-inset-bottom, 0px));
    }

    @supports ((backdrop-filter: blur(16px)) or (-webkit-backdrop-filter: blur(16px))) {
        .qfo-mobile-bubbles .m-navbar { --qfo-bubble-fill: rgba(255, 255, 255, .6); }
        [data-bs-theme=dark] .qfo-mobile-bubbles .m-navbar { --qfo-bubble-fill: rgba(0, 0, 0, .6); }
    }

    @media (prefers-reduced-motion: reduce) {
        .qfo-mobile-bubbles .m-navbar li a { transition: none; }
    }
}