﻿/* no horizontal scroll */
html, body {
    overflow-x: hidden;
}

/* base */
.pdf-shell {
    overflow: hidden;
}

#antiDebugOverlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 15, 15, 0.92);
    color: #fff;
    display: none;
    z-index: 99999;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 24px;
    backdrop-filter: blur(2px);
}

    #antiDebugOverlay .card {
        max-width: 560px;
        margin: 0 auto;
        line-height: 1.6;
        font-size: 16px;
    }

#securePdfViewer {
    width: 100%;
    height: 100%; /* critical: lets the PDF actually scroll */
    position: relative;
    touch-action: pan-y;
}

/* Disable text selection and iOS callouts inside the viewer */
#securePdfViewer, .pdf-shell {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}


/* laptop & desktop (>=992px): keep columns side-by-side, equal visual height */
@media (min-width: 992px) {
    /* use your real row selector */
    .row.mt-2 {
        display: flex;
        flex-wrap: nowrap; /* prevents hiveBox from dropping */
        align-items: flex-start;
    }

    /* left (PDF) column: fixed-width container */
    .pane-left {
        flex: 0 0 auto;
        max-width: none;
    }

    /* give both panes a concrete height (adjust 12vh to your header height if needed) */
    .pdf-shell,
    .info-col {
        height: calc(100vh - 12vh);
    }

    /* right (HiveBox) column: flexible and scrolls internally if long */
    .info-col {
        flex: 1 1 auto;
        min-width: 320px;
        overflow: auto;
    }

        /* hiveBox sizing + small vertical offset */
        .info-col #hiveBox {
            width: 100%;
            max-width: 560px;
            margin-left: 16px;
            margin-top: 12px;
        }
}

/* desktop & large laptops (>=1200px): PDF visible width = 900px */
@media (min-width: 1200px) {
    .pane-left .pdf-shell {
        width: 900px;
    }

    .pane-left {
        max-width: 900px;
    }
    /* aligns column to 900px container */
}

/* laptops (992–1199px): fluid but capped (no horizontal scroll) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .pane-left .pdf-shell {
        width: min(65vw, 900px);
    }
}

/* ===== MOBILE / TABLET (under 992px) ===== */
@media (max-width: 991.98px) {
    /* let the row stack (undo desktop no-wrap) */
    .row.mt-2 {
        display: block; /* or: display:flex; flex-wrap:wrap; */
    }

    /* full-width columns, natural stacking order */
    .pane-left,
    .info-col {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
    }

    /* PDF viewer: tall enough, scrolls inside, no sideways scroll */
    .pdf-shell {
        height: 80vh; /* tweak to taste (70–85vh) */
        overflow: hidden; /* container hides side scrollbars */
    }

    #securePdfViewer {
        width: 100%;
        height: 100%; /* critical for internal PDF scroll */
        touch-action: pan-y; /* smoother finger scroll */
    }

    /* hiveBox: full width, comfy spacing */
    .info-col {
        overflow: visible; /* allow natural page scroll */
    }

    #hiveBox {
        width: 100%;
        max-width: 100%;
        margin: 16px 0 0; /* gap below PDF */
        padding: 16px;
        box-shadow: 0 2px 8px rgba(0,0,0,.08); /* lighter on mobile */
        border-radius: 10px;
    }

        /* nicer reading sizes on small screens */
        #hiveBox h4 {
            font-size: 1.05rem;
            line-height: 1.35;
            margin-bottom: .75rem;
        }

        #hiveBox p {
            font-size: 0.98rem;
            line-height: 1.7;
        }

    /* avoid any accidental horizontal scrolling globally */
    html, body {
        overflow-x: hidden;
    }
}

@media (min-width: 992px) {
    .navbar-center-logo {
        display: block;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        pointer-events: none; /* clicks go through; logo itself not interactive */
    }
}

