/* =========================================================
   ACTUAL DOCUMENT PAGE SETUP
   Matches the supplied Acknowledgement / Certificate layout
   ========================================================= */
:root {
    --a4-width: 210mm;
    --a4-height: 297mm;
    --page-padding-y: 10.583mm;
    --page-padding-x: 15.875mm;
    --section-180-en-size: 12px;
    --section-180-bn-size: 14px;
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    min-height: 100%;
    width: 100%;
}

body {
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    background: #f3f6fa;
    color: #111827;
    min-height: 100vh;
    overflow-x: auto;
}

/* The index shell must NOT become a second white card. */
.verification-shell {
    width: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    background: transparent;
}

/* Home/search screen only */
body.home-mode {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

body.home-mode .verification-shell {
    max-width: 900px;
    min-height: 400px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0,0,0,.10);
    padding: 40px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

body.verification-mode {
    display: block;
    padding: 0;
    background: #f5f7fa;
}

body.verification-mode .verification-shell {
    max-width: none;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    text-align: left;
    display: block;
}

body.verification-mode .logo-area,
body.verification-mode .footer {
    display: none !important;
}

.logo-area img { max-width: 80px; margin-bottom: 15px; }
.logo-area h1 { color: #1a3c6e; font-size: 24px; margin: 0; }
.logo-area p { margin-top: 4px; }
.footer { margin-top: 30px; color: #999; font-size: 12px; }

#content {
    width: 100%;
    text-align: left;
}

body.home-mode #content { text-align: center; }

/* Exact white document sheet used by the actual template */
.a4-container,
.certificate-output {
    width: var(--a4-width);
    min-height: var(--a4-height);
    margin: 20px auto;
    padding: var(--page-padding-y) var(--page-padding-x);
    box-sizing: border-box;
    background: #fff;
    box-shadow: 0 1px 5px rgba(0,0,0,.18);
    position: relative;
    color: #000;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

.font-bangla {
    font-family: 'SolaimanLipi', 'Nirmala UI', 'Nirmala Text', 'Noto Sans Bengali', sans-serif;
    font-size: 14px;
    line-height: 1.6;
}

.section-180 {
    text-align: center;
    line-height: 1.2;
    font-weight: 400 !important;
    font-style: normal !important;
    text-decoration: none !important;
    letter-spacing: 0;
    color: #000;
}

.section-180-en {
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: var(--section-180-en-size) !important;
}

.section-180-bn {
    font-family: 'SolaimanLipi', 'Nirmala UI', 'Nirmala Text', 'Noto Sans Bengali', sans-serif;
    font-size: var(--section-180-bn-size) !important;
}

.lang-switcher {
    display: inline-flex;
    border: 1px solid #ccc;
    border-radius: 0;
    overflow: hidden;
    margin-left: 10px;
}

.lang-switcher button {
    background: #fff;
    border: 0;
    padding: 6px 14px;
    cursor: pointer;
    font-size: 14px;
    border-left: 1px solid #ccc;
}

.lang-switcher button:first-child { border-left: 0; }
.lang-switcher button.lang-active { background: #006da8; color: #fff; }
.kor-zone { position: relative; left: -0.4in; }

/* =========================================================
   ACTUAL VERIFICATION PAGE CHROME
   - Certificate: English only
   - Acknowledgement: English + Bangla
   ========================================================= */
.actual-page-toolbar {
    width: var(--a4-width);
    max-width: var(--a4-width);
    margin: 0 auto 8px;
    min-height: 42px;
    padding: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    color: #151a30;
    background: transparent;
}

.actual-page-title {
    margin: 0;
    padding: 0;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 18px;
    line-height: 1.35;
    font-weight: 700;
    color: #1b1f36;
}

/* One persistent English/Bangla selector for BOTH acknowledgement views. */
.actual-language-switcher {
    display: inline-flex;
    width: 180px;
    height: 36px;
    margin-top: 0;
    border: 1px solid #006da8;
    overflow: hidden;
    background: #fff;
}

.actual-language-switcher button {
    flex: 1 1 50%;
    min-width: 90px;
    height: 34px;
    padding: 0 14px;
    border: 0;
    border-left: 1px solid #006da8;
    background: #fff;
    color: #006da8;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 10px;
    font-weight: 400;
    line-height: 34px;
    text-align: center;
    cursor: pointer;
}

.actual-language-switcher button:first-child { border-left: 0; }
.actual-language-switcher button.active {
    background: #006da8;
    color: #fff;
}

.actual-document-stage {
    width: 100%;
    min-width: max-content;
}

/* =========================================================
   ACKNOWLEDGEMENT LANGUAGE VISIBILITY
   Fetched verify-ack.php CSS can contain its own display rules.
   These two classes always win, so Bangla can never stay hidden.
   ========================================================= */
.actual-document-stage .ack-lang-visible {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.actual-document-stage .ack-lang-hidden {
    display: none !important;
    visibility: hidden !important;
}

/* Acknowledgement form identifier: same top-right position in both languages. */
#acknowledgement-slip-en .ack-en-form-code,
#acknowledgement-slip-bn .bn-ack-form-code {
    position: absolute !important;
    right: 14.5mm !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    white-space: nowrap !important;
    text-align: right !important;
    color: #111 !important;
    background: transparent !important;
    border: 0 !important;
    transform: none !important;
    z-index: 20 !important;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif !important;
    font-size: 9px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* Screen placement only. English form code is intentionally 50px higher. */
#acknowledgement-slip-en .ack-en-form-code {
    top: calc(14.5mm - 50px) !important;
}

#acknowledgement-slip-bn .bn-ack-form-code {
    top: 14.5mm !important;
    font-family: 'SolaimanLipi', 'Nirmala UI', 'Nirmala Text', 'Noto Sans Bengali', sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

/* =========================================================
   BANGLA ACKNOWLEDGEMENT — PDF matched template

   Reference: Acknowledgement-199483380620.pdf
   The supplied PDF is 842 x 1191 pt (A3 portrait). The website
   document is A4 (210 x 297 mm), so all PDF coordinates are
   proportionally scaled to the A4 sheet. This block deliberately
   uses fixed mm coordinates to keep the Bangla view visually
   identical to the supplied acknowledgement PDF.
   ========================================================= */
#acknowledgement-slip-bn.bn-ack-page {
    position: relative !important;
    width: var(--a4-width) !important;
    min-width: var(--a4-width) !important;
    max-width: var(--a4-width) !important;
    height: var(--a4-height) !important;
    min-height: var(--a4-height) !important;
    max-height: var(--a4-height) !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: #000 !important;
    background: #fff !important;
    font-family: 'SolaimanLipi', 'Nirmala UI', 'Nirmala Text', 'Noto Sans Bengali', sans-serif !important;
    font-size: 12.75px !important; /* 13.5pt in the source PDF after A3 -> A4 scaling */
    line-height: 1.25 !important;
}

#acknowledgement-slip-bn.bn-ack-page *,
#acknowledgement-slip-bn.bn-ack-page *::before,
#acknowledgement-slip-bn.bn-ack-page *::after {
    box-sizing: border-box;
}

/* Prevent any old fetched Bangla template pseudo-label from appearing outside
   the rebuilt page. The form code is rendered explicitly below. */
#acknowledgement-slip-bn.bn-ack-page::before,
#acknowledgement-slip-bn.bn-ack-page::after {
    content: none !important;
    display: none !important;
}

#acknowledgement-slip-bn.bn-ack-page p,
#acknowledgement-slip-bn.bn-ack-page div,
#acknowledgement-slip-bn.bn-ack-page span,
#acknowledgement-slip-bn.bn-ack-page td {
    letter-spacing: 0;
    word-spacing: 0;
}

#acknowledgement-slip-bn.bn-ack-page p { margin: 0 !important; }

/* Logos — coordinates measured directly from page 1 of the supplied PDF. */
.bn-ack-ereturn {
    position: absolute;
    left: 147.52mm;
    top: 17.81mm;
    width: 25.58mm;
    height: 7.64mm;
    object-fit: contain;
    display: block;
}

.bn-ack-gov-logo {
    position: absolute;
    left: 95.52mm;
    top: 31.16mm;
    width: 20.71mm;
    height: 20.72mm;
    object-fit: contain;
    display: block;
}

/* Center heading lines. */
.bn-ack-head-line {
    position: absolute;
    left: 0;
    width: 210mm;
    text-align: center;
    white-space: nowrap;
    font-family: 'SolaimanLipi', 'Nirmala UI', 'Nirmala Text', 'Noto Sans Bengali', sans-serif;
    font-size: 12.75px;
    font-weight: 400;
    line-height: 4.25mm;
}

.bn-ack-gov-line-1 { top: 54.80mm; }
.bn-ack-gov-line-2 { top: 59.85mm; }
.bn-ack-gov-line-3 { top: 64.90mm; }

.bn-ack-title {
    position: absolute;
    left: 0;
    top: 75.00mm;
    width: 210mm;
    text-align: center;
    white-space: nowrap;
    font-family: 'SolaimanLipi', 'Nirmala UI', 'Nirmala Text', 'Noto Sans Bengali', sans-serif;
    font-size: 12.75px;
    font-weight: 400;
    line-height: 4.4mm;
    text-decoration: underline;
    text-underline-offset: .35mm;
    text-decoration-thickness: .13mm;
}

.bn-ack-assessment {
    position: absolute;
    left: 0;
    top: 81.55mm;
    width: 210mm;
    text-align: center;
    white-space: nowrap;
    font-size: 11.3px;
    font-weight: 400;
    line-height: 4.1mm;
}

.bn-ack-section {
    position: absolute;
    left: 0;
    top: 89.05mm;
    width: 210mm;
    text-align: center;
    white-space: nowrap;
    font-size: 11.3px;
    font-weight: 400;
    line-height: 4.1mm;
}

/* Taxpayer information. */
.bn-ack-info-line {
    position: absolute;
    left: 62.50mm;
    width: 110mm;
    white-space: nowrap;
    font-size: 12.75px;
    font-weight: 400;
    line-height: 4.7mm;
}

.bn-ack-name { top: 99.95mm; }
.bn-ack-nid  { top: 106.50mm; }

/* TIN label + 12 fixed cells. */
.bn-ack-tin-line {
    position: absolute;
    left: 62.50mm;
    top: 112.25mm;
    height: 6.55mm;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    font-size: 12.75px;
    line-height: 1;
}

.bn-ack-tin-label {
    display: inline-block;
    margin-right: 2.84mm;
    line-height: 6.55mm;
    white-space: nowrap;
}

.bn-ack-tin-cells {
    display: inline-flex;
    align-items: center;
    gap: 1.68mm;
    height: 6.55mm;
}

.bn-ack-tin-box {
    flex: 0 0 5.61mm;
    width: 5.61mm;
    height: 6.55mm;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: .13mm solid #777;
    background: #fff;
    font-family: 'SolaimanLipi', 'Nirmala UI', 'Nirmala Text', 'Noto Sans Bengali', sans-serif;
    font-size: 12.75px;
    font-weight: 400;
    line-height: 1;
}

.bn-ack-circle {
    position: absolute;
    left: 62.12mm;
    top: 120.90mm;
    white-space: nowrap;
    font-size: 12.75px;
    line-height: 4.7mm;
}

.bn-ack-zone {
    position: absolute;
    left: 118.06mm;
    top: 120.90mm;
    white-space: nowrap;
    font-size: 12.75px;
    line-height: 4.7mm;
}

.bn-ack-income {
    position: absolute;
    left: 62.50mm;
    top: 130.98mm;
    white-space: nowrap;
    font-size: 10.75px;
    line-height: 4.7mm;
}

.bn-ack-tax {
    position: absolute;
    left: 62.50mm;
    top: 136.78mm;
    white-space: nowrap;
    font-size: 12.75px;
    line-height: 4.7mm;
}

/* Exact table geometry from the supplied PDF:
   x = 62.87mm, width = 79.70mm,
   first column = 53.14mm, second column = 26.56mm,
   three rows of 6.67mm each. */
.bn-ack-table {
    position: absolute;
    left: 62.87mm;
    top: 144.89mm;
    width: 79.70mm;
    height: 20.00mm;
    margin: 0 !important;
    padding: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    table-layout: fixed;
    font-family: 'SolaimanLipi', 'Nirmala UI', 'Nirmala Text', 'Noto Sans Bengali', sans-serif;
    font-size: 12.75px;
    font-weight: 400;
    line-height: 1.12;
    background: #fff;
}

.bn-ack-table col:first-child { width: 53.14mm; }
.bn-ack-table col:last-child  { width: 26.56mm; }

.bn-ack-table tr {
    height: 6.67mm !important;
    min-height: 6.67mm !important;
    max-height: 6.67mm !important;
}

.bn-ack-table td {
    height: 6.67mm !important;
    border: .13mm solid #777 !important;
    padding: .75mm 1.45mm .55mm 2.90mm !important;
    vertical-align: middle !important;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
}

.bn-ack-table td:last-child {
    padding-left: 2.35mm !important;
    padding-right: 1mm !important;
    text-align: left;
}

/* Seal/signature line. */
.bn-ack-seal-text,
.bn-ack-signature-text {
    position: absolute;
    top: 187.05mm;
    white-space: nowrap;
    font-family: 'Nirmala Text', 'Nirmala UI', 'SolaimanLipi', 'Noto Sans Bengali', sans-serif;
    font-size: 11.3px;
    font-weight: 400;
    line-height: 4mm;
}

.bn-ack-seal-text { left: 52.51mm; }
.bn-ack-signature-text { left: 124.51mm; }

/* QR image block in the PDF is 23.75mm square and already contains
   its own white quiet-zone. */
.bn-ack-qr {
    position: absolute;
    left: 93.11mm;
    top: 198.00mm;
    width: 20.75mm;
    height: 20.75mm;
    object-fit: contain;
    display: block;
}

.bn-ack-system-text {
    position: absolute;
    left: 0;
    top: 225.85mm;
    width: 210mm;
    margin: 0 !important;
    text-align: center;
    white-space: nowrap;
    font-family: 'Nirmala Text', 'Nirmala UI', 'SolaimanLipi', 'Noto Sans Bengali', sans-serif;
    font-size: 11.3px;
    font-weight: 700;
    font-style: italic;
    line-height: 4.1mm;
}

.bn-ack-footer-text {
    position: absolute;
    left: 0;
    top: 251.30mm;
    width: 210mm;
    margin: 0 !important;
    text-align: center;
    white-space: nowrap;
    font-family: 'Nirmala Text', 'Nirmala UI', 'SolaimanLipi', 'Noto Sans Bengali', sans-serif;
    font-size: 11.3px;
    font-weight: 400;
    line-height: 4.2mm;
}

.bn-ack-footer-text strong {
    font-family: 'Segoe UI', Arial, Helvetica, sans-serif;
    font-size: 11.3px;
    font-weight: 700;
}

/* Screenshot-style download button inside the white document. */
.actual-download-button {
    position: absolute;
    z-index: 25;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 68px;
    height: 27px;
    padding: 0 9px;
    border: 1px solid #111827;
    border-radius: 999px;
    background: #fff;
    color: #111827;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 10px;
    line-height: 1;
    font-weight: 600;
    box-shadow: none;
    cursor: pointer;
}

.actual-download-button:hover { background: #f8fafc; }
.actual-download-button i { font-size: 9px; }

/* Certificate screenshot: button near the lower-right corner. */
.certificate-output > .actual-download-button {
    right: 12mm;
    bottom: 12mm;
}

/* Acknowledgement screenshots: button sits further inward and above footer text. */
.a4-container > .actual-download-button {
    right: 36mm;
    bottom: 23mm;
}

/* Fetched pages can contain their own top-level no-print controls.
   Do NOT hide .actual-page-toolbar here: it is our English/Bangla selector. */
#content > .no-print:not(.actual-page-toolbar),
#content > hr.no-print {
    display: none !important;
}

/* Keep our acknowledgement toolbar visible on screen even when fetched CSS
   contains broad .no-print rules. Print CSS below still hides it. */
@media screen {
    #content > .actual-page-toolbar {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Loader */
.loader-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.65);
    backdrop-filter: blur(8px);
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    z-index: 9999;
}
.loader-overlay.active { display: flex; }
.loader { position: relative; width: 70px; height: 70px; }
.dot {
    position: absolute;
    width: 8px;
    height: 8px;
    background: #00bcd4;
    border-radius: 50%;
    animation: loading 1.2s infinite ease-in-out;
}
.dot:nth-child(1) { top:0; left:31px; animation-delay:0s; }
.dot:nth-child(2) { top:10px; right:10px; animation-delay:.15s; }
.dot:nth-child(3) { right:0; top:31px; animation-delay:.3s; }
.dot:nth-child(4) { right:10px; bottom:10px; animation-delay:.45s; }
.dot:nth-child(5) { bottom:0; left:31px; animation-delay:.6s; }
.dot:nth-child(6) { bottom:10px; left:10px; animation-delay:.75s; }
.dot:nth-child(7) { left:0; top:31px; animation-delay:.9s; }
.dot:nth-child(8) { top:10px; left:10px; animation-delay:1.05s; }
@keyframes loading {
    0%,100% { opacity:.25; transform:scale(.6); }
    50% { opacity:1; transform:scale(1.4); }
}
.loader-text { color:#fff; font-size:16px; font-weight:500; margin-top:20px; letter-spacing:1px; }
.loader-subtext { color:rgba(255,255,255,.7); font-size:13px; margin-top:6px; }

/* Root maintenance + missing-record states */
.route-state-wrap {
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 74px 20px 40px;
    background: #fff;
}

.route-state-card {
    width: 336px;
    min-height: 201px;
    padding: 32px 28px 28px;
    border: 1px solid #cddfeb;
    border-radius: 10px;
    background: #f3f8fc;
    box-shadow: 0 9px 20px rgba(38, 77, 102, .08);
    text-align: center;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.route-state-icon {
    width: 58px;
    height: 58px;
    margin: 0 auto 14px;
    border-radius: 50%;
    background: #dff2ff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #087db9;
    font-size: 25px;
}

.route-state-card h2 {
    margin: 0;
    color: #171a36;
    font-size: 18px;
    line-height: 1.35;
    font-weight: 700;
}

.route-state-card p {
    margin: 7px auto 0;
    max-width: 275px;
    color: #56657a;
    font-size: 11px;
    line-height: 1.55;
    font-weight: 400;
}

.maintenance-card .route-state-icon {
    background: #eef3f8;
    color: #5b6b7b;
}

/* Errors */
.error-box { text-align:center; padding:40px 20px; }
.error-box i { font-size:60px; color:#991b1b; margin-bottom:15px; }
.error-box h2 { color:#991b1b; margin-bottom:10px; }
.error-box p { color:#666; }
.btn-back {
    display:inline-block;
    padding:12px 25px;
    background:#e8edf3;
    color:#333;
    border:0;
    border-radius:10px;
    font-size:14px;
    font-weight:bold;
    cursor:pointer;
    text-decoration:none;
    margin-top:20px;
}
.btn-back:hover { background:#d5dce6; }

/* On smaller screens keep the fixed A4 geometry intact, like the actual page. */
@media screen and (max-width: 850px) {
    #content { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
    .actual-page-toolbar,
    .a4-container,
    .certificate-output { margin-left: auto; margin-right: auto; }
}

/* =========================================================
   SINGLE-PAGE A4 DOWNLOAD / PRINT
   Keep only the requested document in the printable viewport.
   296mm is intentional: it avoids Chrome's 297mm rounding spill
   that can create an extra blank second page.
   ========================================================= */
@media print {
    @page { size: A4 portrait; margin: 0; }

    html, body {
        margin: 0 !important;
        padding: 0 !important;
        width: 210mm !important;
        min-width: 210mm !important;
        max-width: 210mm !important;
        height: 296mm !important;
        min-height: 296mm !important;
        max-height: 296mm !important;
        background: #fff !important;
        overflow: hidden !important;
    }

    body.printing-document {
        display: block !important;
        position: relative !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* IMPORTANT: while printing, hide the whole live application.
       The ONLY visible node is the isolated cloned A4 document below. */
    body.printing-document > *:not(#print-only-root) {
        display: none !important;
        visibility: hidden !important;
    }

    #print-only-root {
        display: block !important;
        visibility: visible !important;
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        width: 210mm !important;
        min-width: 210mm !important;
        max-width: 210mm !important;
        height: 296mm !important;
        min-height: 296mm !important;
        max-height: 296mm !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        overflow: hidden !important;
        box-shadow: none !important;
        border: 0 !important;
    }

    #print-only-root > #acknowledgement-slip-en,
    #print-only-root > #acknowledgement-slip-bn,
    #print-only-root > #tax-certificate,
    #print-only-root > .a4-container,
    #print-only-root > .certificate-output {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        width: 210mm !important;
        min-width: 210mm !important;
        max-width: 210mm !important;
        height: 296mm !important;
        min-height: 296mm !important;
        max-height: 296mm !important;
        margin: 0 !important;
        box-shadow: none !important;
        border: 0 !important;
        overflow: hidden !important;
        transform: none !important;
        zoom: 1 !important;
        page-break-before: avoid !important;
        break-before: avoid-page !important;
        page-break-after: avoid !important;
        break-after: avoid-page !important;
        page-break-inside: avoid !important;
        break-inside: avoid-page !important;
    }

    /* English acknowledgement and certificate use the normal template padding. */
    #print-only-root > #acknowledgement-slip-en,
    #print-only-root > #tax-certificate {
        padding: var(--page-padding-y) var(--page-padding-x) !important;
    }

    /* Bangla template coordinates are measured from the A4 sheet edge. */
    #print-only-root > #acknowledgement-slip-bn {
        padding: 0 !important;
    }

    /* Never print UI chrome, buttons, toggles or duplicate fetched controls. */
    #print-only-root .actual-download-button,
    #print-only-root .actual-page-toolbar,
    #print-only-root .actual-language-switcher,
    #print-only-root .ack-en-form-code,
    #print-only-root .bn-ack-form-code,
    #print-only-root .no-print,
    #print-only-root button,
    #print-only-root input,
    #print-only-root select,
    #print-only-root textarea {
        display: none !important;
        visibility: hidden !important;
    }

    #print-only-root img,
    #print-only-root svg,
    #print-only-root table,
    #print-only-root tr,
    #print-only-root td {
        page-break-inside: avoid !important;
        break-inside: avoid-page !important;
    }
}

/* Small presentation helpers moved from inline HTML. */
.logo-area .subtitle { color: #666; }


/* =====================================================
   MOBILE RESPONSIVE DOCUMENT MODE v4
   - English acknowledgement and certificate stay responsive.
   - Bangla acknowledgement gets its own mobile flow layout
     that matches the target structure.
   ===================================================== */

@media screen and (max-width:850px){

    html,body{
        width:100%;
        overflow-x:hidden !important;
        background:#fff !important;
    }

    body.verification-mode{
        padding:0 !important;
        background:#fff !important;
        overflow-x:hidden !important;
    }

    .verification-shell,
    #content{
        width:100% !important;
        min-width:0 !important;
        overflow-x:hidden !important;
    }

    .actual-page-toolbar{
        width:100% !important;
        height:auto !important;
        padding:10px 20px !important;
        margin:0 !important;
        box-sizing:border-box !important;
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        gap:8px !important;
        flex-wrap:nowrap !important;
    }

    .actual-page-title{
        font-size:16px !important;
        line-height:1.3 !important;
        margin:0 !important;
        flex:1 1 auto !important;
    }

    .actual-language-switcher {
        width:160px !important;
        height:32px !important;
        flex:0 0 auto !important;
    }

    .actual-language-switcher button {
        font-size:11px !important;
        height:30px !important;
        line-height:30px !important;
    }

    .actual-document-stage{
        width:100% !important;
        min-width:0 !important;
        overflow-x:hidden !important;
        overflow-y:visible !important;
        position:relative !important;
        padding-bottom:16px !important;
    }

    .a4-container,
    .certificate-output,
    #acknowledgement-slip-en,
    #acknowledgement-slip-bn,
    #tax-certificate{
        margin:0 auto !important;
        box-shadow:none !important;
    }

    /* English acknowledgement remains responsive and readable. */
    body.verification-mode .a4-container:not(#acknowledgement-slip-bn),
    body.verification-mode #acknowledgement-slip-en {
        padding: 20px 16px !important;
        font-size: 15px !important;
        line-height: 1.6 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: visible !important;
        transform: none !important;
        -webkit-transform: none !important;
    }

    body.verification-mode .a4-container:not(#acknowledgement-slip-bn) table,
    body.verification-mode #acknowledgement-slip-en table {
        width: 100% !important;
        table-layout: auto !important;
    }

    body.verification-mode .a4-container:not(#acknowledgement-slip-bn) td,
    body.verification-mode #acknowledgement-slip-en td {
        padding: 8px 6px !important;
        white-space: normal !important;
    }

    /* Certificate mobile adjustments */
    body.verification-mode .certificate-output,
    body.verification-mode #tax-certificate {
        padding: 20px 16px !important;
        font-size: 15px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: visible !important;
        transform: none !important;
        -webkit-transform: none !important;
    }

    /* ---------------- Bangla acknowledgement mobile layout ---------------- */
    body.verification-mode #acknowledgement-slip-bn.bn-ack-page {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 18px 14px 24px !important;
        overflow: visible !important;
        background: #fff !important;
        transform: none !important;
        -webkit-transform: none !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    body.verification-mode #acknowledgement-slip-bn.bn-ack-page p,
    body.verification-mode #acknowledgement-slip-bn.bn-ack-page div,
    body.verification-mode #acknowledgement-slip-bn.bn-ack-page span,
    body.verification-mode #acknowledgement-slip-bn.bn-ack-page td {
        white-space: normal !important;
        letter-spacing: 0 !important;
        word-spacing: 0 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-form-code {
        position: absolute !important;
        top: 10px !important;
        right: 14px !important;
        left: auto !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
        text-align: right !important;
        z-index: 10 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-ereturn {
        position: static !important;
        display: block !important;
        width: 128px !important;
        height: auto !important;
        margin: 26px auto 12px auto !important;
        object-fit: contain !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-gov-logo {
        position: static !important;
        display: block !important;
        width: 96px !important;
        height: auto !important;
        margin: 10px auto 18px auto !important;
        object-fit: contain !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-head-line,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-title,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-assessment,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-section {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        margin: 0 0 6px 0 !important;
        text-align: center !important;
        line-height: 1.35 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-title {
        margin: 14px 0 10px 0 !important;
        font-size: 14px !important;
        text-decoration: underline !important;
        text-underline-offset: 2px !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-assessment,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-section {
        font-size: 13px !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-info-line {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        margin: 0 0 7px 0 !important;
        text-align: left !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-name {
        margin-top: 14px !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-tin-line {
        position: static !important;
        left: auto !important;
        top: auto !important;
        height: auto !important;
        display: block !important;
        margin: 8px 0 10px 0 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-tin-label {
        display: block !important;
        margin: 0 0 6px 0 !important;
        line-height: 1.4 !important;
        text-align: left !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-tin-cells {
        display: grid !important;
        grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
        gap: 4px !important;
        width: 100% !important;
        height: auto !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-tin-box {
        width: auto !important;
        min-width: 0 !important;
        height: 31px !important;
        font-size: 17px !important;
        line-height: 1 !important;
        border: 1px solid #777 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-circle,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-zone {
        position: static !important;
        display: inline-block !important;
        width: 49% !important;
        margin: 0 0 8px 0 !important;
        vertical-align: top !important;
        text-align: left !important;
        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-income,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-tax {
        position: static !important;
        display: block !important;
        width: 100% !important;
        margin: 0 0 6px 0 !important;
        text-align: left !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-table {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        height: auto !important;
        margin: 14px 0 18px 0 !important;
        table-layout: fixed !important;
        font-size: 14px !important;
        line-height: 1.35 !important;
        border-collapse: collapse !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-table col:first-child { width: 68% !important; }
    body.verification-mode #acknowledgement-slip-bn .bn-ack-table col:last-child  { width: 32% !important; }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-table tr,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-table td {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-table td {
        padding: 10px 8px !important;
        white-space: normal !important;
        word-break: break-word !important;
        vertical-align: middle !important;
        text-align: left !important;
        border: 1px solid #777 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-seal-text,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-signature-text {
        position: static !important;
        display: inline-block !important;
        width: 49% !important;
        margin: 12px 0 10px 0 !important;
        vertical-align: top !important;
        text-align: center !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-qr {
        position: static !important;
        display: block !important;
        width: 130px !important;
        height: 130px !important;
        margin: 8px auto 14px auto !important;
        object-fit: contain !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-system-text,
    body.verification-mode #acknowledgement-slip-bn .bn-ack-footer-text {
        position: static !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        margin: 0 auto 10px auto !important;
        text-align: center !important;
        line-height: 1.45 !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-system-text {
        font-size: 13px !important;
    }

    body.verification-mode #acknowledgement-slip-bn .bn-ack-footer-text {
        font-size: 12.5px !important;
        margin-bottom: 18px !important;
    }

    body.verification-mode #acknowledgement-slip-bn .actual-download-button {
        position: static !important;
        margin: 18px auto 0 auto !important;
        display: inline-flex !important;
    }
}

/* FINAL FIX: BANGLA ACKNOWLEDGEMENT MOBILE KEEP A4 STRUCTURE */
@media screen and (max-width:850px){

    /* Do not reflow Bangla acknowledgement.
       It must remain identical to A4 reference and only scale visually. */
    #acknowledgement-slip-bn.bn-ack-page{
        width:210mm !important;
        min-width:210mm !important;
        max-width:210mm !important;
        height:297mm !important;
        min-height:297mm !important;
        max-height:297mm !important;
        padding:0 !important;
        margin:10px auto !important;
        overflow:hidden !important;
        transform:scale(calc(100vw / 210mm)) !important;
        transform-origin:top center !important;
        margin-bottom:calc(-297mm + (297mm * calc(100vw / 210mm))) !important;
    }

    /* English remains unchanged */
    #acknowledgement-slip-en{
        width:210mm !important;
        min-width:210mm !important;
    }

    /* remove previous mobile overrides affecting Bangla absolute positions */
    #acknowledgement-slip-bn .bn-ack-ereturn,
    #acknowledgement-slip-bn .bn-ack-gov-logo,
    #acknowledgement-slip-bn .bn-ack-head-line,
    #acknowledgement-slip-bn .bn-ack-info-line,
    #acknowledgement-slip-bn .bn-ack-tin-line,
    #acknowledgement-slip-bn .bn-ack-table,
    #acknowledgement-slip-bn .bn-ack-circle,
    #acknowledgement-slip-bn .bn-ack-zone{
        max-width:none !important;
    }
}

/* FINAL BANGLA ACK MOBILE A4 SCALE FIX */
@media screen and (max-width:850px){

    body.verification-mode{
        overflow-x:hidden !important;
        background:#fff !important;
    }

    .actual-document-stage{
        width:100% !important;
        min-width:0 !important;
        overflow:hidden !important;
        position:relative !important;
    }

    /* Do NOT convert Bangla A4 into responsive flow.
       Keep the fixed 210mm x 297mm coordinate system. */
    #acknowledgement-slip-bn.bn-ack-page{
        width:210mm !important;
        min-width:210mm !important;
        max-width:210mm !important;
        height:297mm !important;
        min-height:297mm !important;
        max-height:297mm !important;
        padding:0 !important;
        transform-origin:top left !important;
        overflow:hidden !important;
    }

    #acknowledgement-slip-bn.bn-ack-page *{
        box-sizing:border-box !important;
    }

    /* Scale the whole Bangla document only */
    #acknowledgement-slip-bn.bn-ack-page{
        transform:scale(calc(100vw / 210mm)) !important;
        margin-bottom:calc(-297mm + (297mm * (100vw / 210mm))) !important;
    }

    /* English remains normal */
    #acknowledgement-slip-en{
        width:100% !important;
        min-width:0 !important;
        max-width:100% !important;
    }
}

/* V4 - Mobile acknowledgement renderer */
@media screen and (max-width:850px){

    #acknowledgement-slip-bn.bn-mobile-render {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        padding: 20px !important;
        /* 修复移动端缩放导致内容不全 */
        transform: none !important;
        transform-origin: initial !important;
        margin-bottom: 0 !important;
    }

    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-ereturn,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-gov-logo {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        display: block !important;
        margin: 15px auto !important;
    }

    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-head-line,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-title,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-assessment,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-section,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-info-line,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-circle,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-zone,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-income,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-tax,
    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-table {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        white-space: normal !important;
        margin: 12px 0 !important;
    }

    #acknowledgement-slip-bn.bn-mobile-render .bn-ack-table {
        display: table !important;
    }
}