/**
 * Mobile adaptation layer — loads last via styles.css.
 * Goals: no horizontal scroll, usable form/header, SEO H1 always visible.
 */

html {
    overflow-x: clip;
}

body {
    overflow-x: clip;
    max-width: 100%;
}

img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
    height: auto;
}

/* —— SEO: never hide the real H1 —— */
.Section-H1,
.Section-H1 h1,
.Section-H1 h1.H1 {
    display: block !important;
    visibility: visible !important;
}

.Section-H1B {
    display: none !important;
}

/* —— Shared ≤1000px —— */
@media (max-width: 1000px) {
    body {
        padding-left: 12px;
        padding-right: 12px;
    }

    body.page-site {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .page-site {
        padding-left: 0;
        padding-right: 0;
    }

    .Section-H1 {
        margin-bottom: 28px;
        padding: 0 12px;
    }

    .Section-H1 h1.H1 {
        font-size: clamp(1.35rem, 5.2vw, 1.85rem);
        line-height: 1.22;
        word-wrap: break-word;
        overflow-wrap: anywhere;
    }

    .Section-H1 p {
        font-size: 0.98rem;
        line-height: 1.65;
        padding: 0 4px;
    }

    .H2,
    .H2FAQ {
        font-size: clamp(1.25rem, 4.5vw, 1.65rem) !important;
        padding: 0 8px;
        line-height: 1.3;
    }

    .How-Bitcoin-Mixer-Work,
    .anonymity-bitcoin-mixer,
    .nologs,
    .ptext,
    .ptext2,
    .faq,
    .yourmoney,
    .fingerprint,
    .fingerprintexit {
        padding-left: 12px;
        padding-right: 12px;
        margin-bottom: 2.75rem;
    }

    .completeanonymitymode {
        margin-bottom: 2.5rem;
        padding: 0 4px;
    }

    .thormixerburna,
    .thormixerburn,
    .imgresponsive {
        width: 100%;
        max-width: 100%;
        height: auto;
    }

    .anonymity-bitcoin-mixer + section {
        padding: 0 12px;
    }

    /* Keep how-it-works steps visible (legacy hid them) */
    .mixsteps {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        width: min(100%, 640px);
        gap: 10px;
        margin: 0 auto 1.5rem;
        padding: 0 8px;
    }

    .mixsteps li {
        width: 100%;
    }

    .form {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        max-width: 920px;
        padding: 18px 14px 22px;
        text-align: left;
        box-sizing: border-box;
    }

    .form > .optioncursor,
    .form > label.optioncursor {
        display: inline;
    }

    #option1,
    #option2 {
        margin-left: 0 !important;
        margin-right: 10px;
        margin-top: 0 !important;
        width: 18px;
        height: 18px;
        vertical-align: middle;
        accent-color: var(--tm-accent);
    }

    #option2 {
        margin-top: 14px !important;
    }

    .hidebreak {
        display: block;
    }

    .optioncursor {
        font-size: 0.98rem !important;
        line-height: 1.4;
        vertical-align: middle;
    }

    .separator {
        max-width: 100%;
        margin: 18px 0;
    }

    .mode,
    .mode2,
    .mode3,
    .ar-mode,
    .ar-mode2,
    .ar-mode3 {
        font-size: 0.9rem !important;
        line-height: 1.55;
        margin-top: 18px !important;
        padding: 0 2px;
        word-break: break-word;
    }

    .mode3 {
        display: block !important;
    }

    .mode,
    .mode2 {
        display: none !important;
    }

    .modetext {
        font-size: 1rem !important;
        margin-top: 22px !important;
        margin-bottom: 22px !important;
        line-height: 1.5;
        padding: 0 2px;
    }

    .field1,
    .field2 {
        max-width: 100%;
        gap: 18px;
        width: 100%;
    }

    .field1 input,
    .field2 input,
    .form input[type="text"],
    .form input[type="number"],
    #btcinput {
        font-size: 16px !important; /* iOS: no auto-zoom */
        height: 52px;
        border-radius: 10px;
        border: 1px solid var(--tm-line);
        width: 100%;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    /* Precise Payment: stack address + amount (kill absolute #btclabel) */
    .form3 {
        display: flex;
        flex-direction: column;
        gap: 12px;
        position: relative;
        width: 100%;
        text-align: left;
    }

    .form3 input {
        max-width: 100% !important;
        width: 100%;
    }

    #btclabel {
        position: static !important;
        right: auto !important;
        top: auto !important;
        width: 100% !important;
        max-width: 100%;
        display: flex !important;
        align-items: center;
        gap: 10px;
        margin: 0;
    }

    #btcinput {
        width: 100% !important;
        max-width: none !important;
        flex: 1;
        text-align: left;
        padding-right: 12px;
    }

    .btc3 {
        display: inline-block !important;
        font-size: 1rem !important;
        font-weight: 600;
        color: var(--tm-ink);
        margin: 0 !important;
        flex-shrink: 0;
    }

    #btclabel span {
        font-size: 1rem !important;
        margin-left: 0 !important;
    }

    .buttonbtc,
    .buttonbtc2,
    .buttonletter {
        width: 100%;
        max-width: 100%;
        height: 54px;
        font-size: 1rem;
        border-radius: 10px;
    }

    .buttonbtc span,
    .buttonbtc2 span {
        font-size: 1rem;
        margin-left: 6px;
    }

    .terms {
        flex-wrap: wrap;
        gap: 8px;
        justify-content: flex-start;
        align-items: flex-start;
        padding: 0 2px;
    }

    .terms-text,
    .terms-text-ru {
        font-size: 0.9rem !important;
        line-height: 1.45 !important;
        text-align: left;
    }

    .checkboxy {
        width: 22px !important;
        height: 22px !important;
        flex-shrink: 0;
        margin-top: 2px;
    }

    .table-responsive {
        width: 100%;
        max-width: 100%;
        height: auto !important;
        font-size: 0.9rem;
        margin-bottom: 2rem;
    }

    .table-responsive tr td {
        padding: 12px !important;
        word-break: break-word;
    }

    .table-mobile {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0 4px;
    }

    .pgpkey,
    .pgpkey code {
        font-size: 0.78rem !important;
        letter-spacing: 0.02em !important;
        padding: 12px !important;
    }

    .shieldcontainer-mobile {
        padding: 0 12px;
    }

    .shields-mobile {
        max-width: 100%;
    }

    .shields-mobile img {
        width: min(160px, 55vw);
        height: auto;
        margin: 0 auto;
    }

    .shields-mobile p {
        margin-bottom: 2rem !important;
        max-width: 22rem;
        margin-left: auto;
        margin-right: auto;
    }

    .muninblock-mobile {
        margin-bottom: 2.5rem !important;
        padding: 0 12px;
        font-size: 0.98rem !important;
        line-height: 1.55 !important;
    }

    .footer {
        margin-left: -12px;
        margin-right: -12px;
        width: calc(100% + 24px);
        max-width: none;
        box-sizing: border-box;
    }

    body.page-site .footer {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }

    .color-link {
        display: grid;
        gap: 8px;
        justify-items: center;
        word-break: break-word;
    }

    .color-link a {
        word-break: break-all;
    }
}

/* —— Header: neutralize legacy absolute offsets on .page-site —— */
@media (max-width: 1000px) {
    .page-site .headerbar--home {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-end;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        gap: 8px;
        padding: 10px 12px;
        position: relative;
        grid-template-columns: none;
        grid-template-areas: none;
    }

    .page-site .headerbar__brand {
        margin-right: auto;
        margin-left: 0;
        flex: 1 1 auto;
        min-width: 0;
        max-width: none;
        z-index: 2;
    }

    .page-site .headerbar__navulcontainer {
        order: 2;
        flex: 0 0 auto;
        justify-content: flex-end;
        margin: 0;
        z-index: 2;
    }

    .page-site .headerbar__tools {
        order: 3;
        flex: 0 0 auto;
        margin: 0;
        gap: 6px;
        z-index: 2;
        display: flex;
        align-items: center;
    }

    .page-site .headerbar__lang {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        transform: none !important;
        width: 44px;
        height: 44px;
        flex-shrink: 0;
        display: flex !important;
        align-items: center;
        justify-content: center;
        z-index: 4;
    }

    .page-site .headerbar__lang .selectorlang {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        opacity: 0;
        cursor: pointer;
        z-index: 3;
        transform: none !important;
        top: auto !important;
        right: auto !important;
        left: auto !important;
    }

    .page-site .headerbar__lang .menulang {
        position: static !important;
        top: auto !important;
        right: auto !important;
        left: auto !important;
        transform: none !important;
        margin: 0 !important;
        width: 22px !important;
        height: 22px !important;
        display: block !important;
        pointer-events: none;
    }

    .page-site .headerbar__navbar {
        width: 44px;
        height: 44px;
    }

    .page-site .checkbox-burguer,
    .page-site .menuburger {
        position: static !important;
        top: auto !important;
        right: auto !important;
        transform: none !important;
        inset: auto;
    }

    .page-site .checkbox-burguer {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        height: 100% !important;
        opacity: 0;
        margin: 0;
        cursor: pointer;
        z-index: 3;
    }

    .page-site .menuburger {
        width: 20px !important;
        height: 14px !important;
        pointer-events: none;
    }

    .page-site .headerbar__navbarul {
        top: calc(100% + 10px) !important;
        right: 0 !important;
        left: auto !important;
        width: min(240px, calc(100vw - 24px));
        z-index: 40;
    }

    .page-site .headerbar__flags {
        top: calc(100% + 10px) !important;
        right: 0 !important;
        left: auto !important;
        transform: none !important;
        z-index: 40;
    }

    .page-site .theme-toggle {
        width: 44px;
        height: 44px;
        flex-shrink: 0;
    }
}

@media (max-width: 560px) {
    .page-site .headerbar--home {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-end;
        gap: 6px;
        padding: 10px 12px;
        grid-template-columns: none;
        grid-template-areas: none;
        row-gap: 0;
        column-gap: 6px;
    }

    .page-site .headerbar__brand {
        gap: 8px;
        min-width: 0;
        margin-left: 0;
        margin-right: auto;
        max-width: none;
        grid-area: unset;
    }

    .page-site .headerbar__navulcontainer {
        order: 2;
        justify-content: flex-end;
        margin: 0;
        grid-area: unset;
    }

    .page-site .headerbar__tools {
        order: 3;
        gap: 6px;
        margin: 0;
        align-self: center;
        grid-area: unset;
    }

    .page-site .headerbar__lang {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        transform: none !important;
        width: 42px;
        height: 42px;
    }

    .page-site .headerbar__name {
        font-size: 1rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .page-site .headerbar__mark {
        width: 44px;
        height: 44px;
    }

    .page-site .theme-toggle {
        width: 42px;
        height: 42px;
    }

    .page-site .seo-main {
        padding: 0 14px 2.5rem;
        margin-top: 0.75rem;
    }

    .page-site .seo-main > h1.H2,
    .page-site .seo-main > .H2:first-of-type {
        font-size: clamp(1.35rem, 6vw, 1.7rem);
        margin-top: 0.75rem;
        line-height: 1.25;
        word-wrap: break-word;
    }

    .page-site .seo-main p,
    .page-site .seo-main li {
        font-size: 1rem;
        line-height: 1.65;
    }

    body {
        padding-left: 8px;
        padding-right: 8px;
        background-attachment: scroll;
    }

    body.page-site {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .footer {
        margin-left: -8px;
        margin-right: -8px;
        width: calc(100% + 16px);
    }

    body.page-site .footer {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }

    .marquesection {
        height: 34px;
        margin-bottom: 8px;
    }

    .marquese p {
        font-size: 0.75rem !important;
    }

    .privacy-banner {
        padding: 0 8px;
    }

    .privacy-banner__title {
        font-size: 1.15rem;
    }

    .faqs,
    h3.faqs {
        font-size: 1rem;
        word-wrap: break-word;
    }
}

/* Legacy non-page-site headers (mix pages) */
@media (max-width: 1000px) {
    body:not(.page-site) .headerbar {
        flex-wrap: wrap;
        gap: 10px;
        padding: 12px 8px;
        max-width: 100%;
    }

    body:not(.page-site) .headerbar__logo {
        height: 40px;
        width: auto;
        max-width: min(168px, 52vw);
    }
}

@media (max-width: 768px) {
    .mixer-request {
        margin-bottom: 4rem !important;
        padding: 0 8px;
        font-size: 1rem;
        line-height: 1.55;
    }

    .mixer-x-address {
        font-size: clamp(1rem, 4.5vw, 1.35rem) !important;
        word-break: break-all;
    }

    .letter-data {
        font-size: 0.85rem;
        max-width: 100%;
    }

    .buttonletter {
        max-width: 100%;
    }
}

/* Restore theme background on small screens (legacy forced white) */
@media (max-width: 720px) {
    body {
        background-color: var(--tm-bg) !important;
    }

    .page-site.theme-dark,
    html.theme-dark-pending body.page-site {
        background-color: #0f1218 !important;
    }
}

/* Safe areas (notched phones) */
@supports (padding: max(0px)) {
    body {
        padding-left: max(8px, env(safe-area-inset-left));
        padding-right: max(8px, env(safe-area-inset-right));
    }

    .page-site .headerbar--home {
        padding-left: max(12px, env(safe-area-inset-left));
        padding-right: max(12px, env(safe-area-inset-right));
    }

    .footer {
        padding-bottom: max(0px, env(safe-area-inset-bottom));
    }
}