/* Final mobile/tablet safety overrides for all single templates */

@media (max-width: 1100px) {
    html {
        overflow-x: hidden !important;
    }

    body.single,
    body.single-post {
        overflow-x: hidden !important;
    }

    html,
    body.single,
    body.single-post {
        max-width: 100% !important;
    }

    body.single .algo-hack-widget,
    body.single .algo-hack-widget:hover,
    body.single .algo-hack-widget:focus-within,
    body.single-post .algo-hack-widget,
    body.single-post .algo-hack-widget:hover,
    body.single-post .algo-hack-widget:focus-within {
        left: 50% !important;
        right: auto !important;
        top: auto !important;
        bottom: max(12px, env(safe-area-inset-bottom)) !important;
        transform: translateX(-50%) !important;
        width: min(96vw, 420px) !important;
        max-width: calc(100vw - 12px) !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body.single .algo-buttons-group,
    body.single-post .algo-buttons-group {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 12px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        max-width: 100% !important;
        padding: 12px 14px !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    body.single .algo-buttons-group::-webkit-scrollbar,
    body.single-post .algo-buttons-group::-webkit-scrollbar {
        display: none;
    }

    body.single .algo-share-btn,
    body.single-post .algo-share-btn,
    body.single .algo-btn,
    body.single-post .algo-btn {
        flex: 0 0 42px !important;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        box-sizing: border-box !important;
    }

    body.single :where(
        .neelix-donation-wrapper,
        .donation-ticker-bar,
        .ticker-content,
        .donation-grid,
        .col-info,
        .col-payment,
        .glass-card,
        article,
        .entry-content,
        .site-main,
        .content-area,
        .site-content
    ),
    body.single-post :where(
        .neelix-donation-wrapper,
        .donation-ticker-bar,
        .ticker-content,
        .donation-grid,
        .col-info,
        .col-payment,
        .glass-card,
        article,
        .entry-content,
        .site-main,
        .content-area,
        .site-content
    ) {
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body.single .donation-ticker-bar,
    body.single-post .donation-ticker-bar {
        overflow: hidden !important;
    }
}

@media (max-width: 640px) {
    body.single .algo-share-btn,
    body.single-post .algo-share-btn,
    body.single .algo-btn,
    body.single-post .algo-btn {
        flex-basis: 40px !important;
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
    }
}