* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; color: #172033; background: #f3f6fa; }
.portal-auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; background: linear-gradient(145deg, #f7f9fc 0%, #e8eef7 100%); }
.portal-auth-card { width: 100%; max-width: 430px; padding: 36px; background: #fff; border: 1px solid #dfe6ef; border-radius: 16px; box-shadow: 0 20px 45px rgba(15,23,42,.10), 0 2px 8px rgba(15,23,42,.05); }
.portal-auth-card h1 { margin: 0 0 8px; color: #153d77; font-size: 30px; font-weight: 700; line-height: 1.2; }
.portal-auth-card .nexus-subtle { margin: 0; color: #667085; font-size: 15px; line-height: 1.5; }
.portal-auth-card form { margin-top: 28px; }
.portal-auth-card .mb-3 { margin-bottom: 20px; }
.portal-auth-card .form-label { display: block; margin-bottom: 7px; color: #344054; font-size: 14px; font-weight: 600; }
.portal-auth-card .form-control { display: block; width: 100%; min-height: 46px; padding: 10px 13px; color: #172033; font: inherit; font-size: 15px; background: #fff; border: 1px solid #cbd5e1; border-radius: 8px; outline: none; }
.portal-auth-card .form-control:focus { border-color: #2563eb; box-shadow: 0 0 0 4px rgba(37,99,235,.13); }
.portal-auth-card .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 10px 18px; border: 1px solid transparent; border-radius: 8px; font: inherit; font-size: 15px; font-weight: 650; cursor: pointer; }
.portal-auth-card .btn-primary { width: 100%; color: #fff; background: #1d4ed8; border-color: #1d4ed8; }
.portal-auth-card .btn-primary:hover { background: #1e40af; border-color: #1e40af; }
.portal-auth-card .btn-outline-secondary { color: #344054; background: #fff; border-color: #cbd5e1; }
.portal-auth-card .btn-link { color: #1d4ed8; background: transparent; border: 0; }
.portal-auth-card .mt-3 { margin-top: 20px !important; }
.portal-auth-card .mb-0 { margin-bottom: 0 !important; }
.portal-auth-card .form-text { margin-top: 6px; color: #667085; font-size: 13px; }
.portal-auth-card .alert { margin-top: 20px; padding: 12px 14px; border: 1px solid transparent; border-radius: 8px; font-size: 14px; }
.portal-auth-card .alert-danger { color: #991b1b; background: #fef2f2; border-color: #fecaca; }
.portal-auth-card .alert-success { color: #166534; background: #f0fdf4; border-color: #bbf7d0; }
@media (max-width: 520px) { .portal-auth { align-items: flex-start; padding: 18px; } .portal-auth-card { margin-top: 28px; padding: 26px 22px; border-radius: 12px; } .portal-auth-card h1 { font-size: 26px; } }

.portal-shell{min-height:100vh;background:#f3f6fb;color:#22345c}.portal-topbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:#fff;border-bottom:1px solid #dfe5ef}.portal-topbar-identity{display:flex;align-items:center;gap:1rem}.portal-brand{font-weight:800;color:#df6f2b}.portal-account-name{padding-left:1rem;border-left:1px solid #dfe5ef;font-weight:700}.portal-button{border-radius:10px;padding:.65rem 1rem;font:inherit;font-weight:700;cursor:pointer}.portal-button-secondary{background:#fff;border:1px solid #c9d2e1;color:#26365d}.portal-dashboard{max-width:1180px;margin:0 auto;padding:2rem}.portal-hero{padding:2.2rem;border-radius:22px;background:linear-gradient(135deg,#173b78,#3264a7);color:#fff;box-shadow:0 18px 45px rgba(23,59,120,.18);margin-bottom:1.4rem}.portal-hero h1{margin:.2rem 0;font-size:clamp(2rem,5vw,3rem)}.portal-legal-name{margin:.3rem 0;color:#dbe8fb}.portal-eyebrow{margin:0;text-transform:uppercase;letter-spacing:.13em;font-size:.75rem;font-weight:900;color:#df6f2b}.portal-hero .portal-eyebrow{color:#ffd0ae}.portal-meta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.25rem}.portal-meta span{padding:.45rem .7rem;border-radius:999px;background:rgba(255,255,255,.13)}.portal-stat-grid,.portal-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-bottom:1.4rem}.portal-stat,.portal-action-card,.portal-panel{background:#fff;border:1px solid #dfe5ef;border-radius:18px;box-shadow:0 9px 28px rgba(31,51,91,.06)}.portal-stat{padding:1.3rem}.portal-stat span,.portal-stat small,.portal-action-card div span,.portal-empty-state span,.portal-order-row span{display:block;color:#6d778c}.portal-stat strong{display:block;font-size:1.65rem;margin:.35rem 0}.portal-action-card{display:flex;gap:1rem;padding:1.3rem}.portal-action-card strong{display:block;margin-bottom:.35rem}.portal-card-icon{display:grid;place-items:center;width:2.6rem;height:2.6rem;flex:0 0 auto;border-radius:12px;background:#fff1e8;color:#c85f1f;font-weight:900}.portal-action-next{border-style:dashed}.portal-panel{padding:1.45rem}.portal-panel h2{margin:.25rem 0 1rem}.portal-order-row{display:flex;justify-content:space-between;align-items:center;padding:1rem 0;border-top:1px solid #e6eaf1}.portal-order-row>div:last-child{text-align:right}.portal-status{margin-top:.25rem}.portal-empty-state{display:grid;gap:.35rem;padding:1.4rem;border-radius:14px;background:#f7f9fc}.portal-alert{padding:1rem;border-radius:12px}.portal-alert-error{background:#fff0f0;color:#8b2222;border:1px solid #f1bcbc}@media(max-width:760px){.portal-topbar{padding:1rem}.portal-account-name{display:none}.portal-dashboard{padding:1rem}.portal-stat-grid,.portal-card-grid{grid-template-columns:1fr}.portal-hero{padding:1.5rem}.portal-order-row{align-items:flex-start}}
.portal-hero h1 {
    color: #fff;
}

.portal-hero h1[tabindex]:focus,
.portalbindex]:focus-visible {
                  outline: none;
              }.portal-top-actions{display:flex;align-items:center;gap:.65rem}.portal-top-actions form{margin:0}.portal-catalogue-heading{margin-bottom:1.2rem}.portal-catalogue-heading h1{margin:.25rem 0;color:#22345c;font-size:2.2rem}.portal-search-panel{background:#fff;border:1px solid #dfe5ef;border-radius:18px;padding:1.25rem;margin-bottom:1.25rem;box-shadow:0 9px 28px rgba(31,51,91,.06)}.portal-search-panel label{display:block;font-weight:800;margin-bottom:.45rem}.portal-search-row{display:flex;gap:.75rem}.portal-search-row input{flex:1;min-width:0;padding:.8rem 1rem;border:1px solid #bdc8d9;border-radius:10px;font:inherit}.portal-button-primary{background:#df6f2b;color:#fff;border:1px solid #df6f2b}.portal-alert-success{background:#eefaf1;color:#286139;border:1px solid #aee1ba;margin-bottom:1rem}.portal-results-summary{margin:.5rem 0 1rem;color:#68758a}.portal-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.portal-product-card{display:flex;flex-direction:column;background:#fff;border:1px solid #dfe5ef;border-radius:18px;padding:1.25rem;box-shadow:0 9px 28px rgba(31,51,91,.06)}.portal-product-code{color:#df6f2b;font-weight:900}.portal-product-card h2{font-size:1.08rem;line-height:1.35;margin:.5rem 0;min-height:2.9rem}.portal-product-barcode,.portal-product-card small{color:#748096}.portal-product-facts{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:1rem 0}.portal-product-facts div{background:#f6f8fb;border-radius:10px;padding:.7rem}.portal-product-facts span{display:block;color:#748096;font-size:.8rem}.portal-product-facts strong{display:block;margin-top:.15rem}.portal-add-form{display:flex;align-items:end;gap:.65rem;margin-top:auto;padding-top:1rem}.portal-add-form label{flex:1}.portal-add-form label span{display:block;font-size:.8rem;font-weight:800;margin-bottom:.25rem}.portal-add-form input{width:100%;padding:.65rem;border:1px solid #bdc8d9;border-radius:9px}.portal-unavailable{margin-top:auto;padding:.75rem;border-radius:10px;background:#f6f8fb;color:#7a8495;text-align:center}@media(max-width:900px){.portal-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.portal-topbar{align-items:flex-start}.portal-top-actions{flex-wrap:wrap;justify-content:flex-end}.portal-search-row{flex-direction:column}.portal-product-grid{grid-template-columns:1fr}.portal-add-form{align-items:stretch;flex-direction:column}}
.portal-cart-panel{padding:0;overflow:hidden}.portal-cart-summary{display:flex;justify-content:space-between;padding:1rem 1.25rem;background:#f7f9fc;border-bottom:1px solid #e3e8f0}.portal-cart-row{display:grid;grid-template-columns:minmax(220px,2fr) minmax(220px,1fr) minmax(120px,.7fr) auto;gap:1rem;align-items:end;padding:1.2rem;border-bottom:1px solid #e5e9f1}.portal-cart-product strong,.portal-cart-product small,.portal-cart-line-total span{display:block}.portal-cart-product small,.portal-cart-line-total span{color:#748096}.portal-cart-update{display:flex;gap:.5rem;align-items:end}.portal-cart-update label span{display:block;font-size:.8rem;font-weight:800}.portal-cart-update input{width:110px;padding:.65rem;border:1px solid #bdc8d9;border-radius:9px}.portal-cart-line-total{text-align:right}.portal-remove-button{border:0;background:transparent;color:#a83232;font-weight:800;padding:.7rem;cursor:pointer}.portal-cart-footer{display:flex;justify-content:space-between;align-items:center;padding:1.25rem;background:#f7f9fc}.portal-cart-footer span,.portal-cart-footer strong{display:block}.portal-cart-footer strong{font-size:1.5rem}.portal-inline-action{display:inline-block;width:max-content;text-decoration:none;margin-top:.75rem}@media(max-width:850px){.portal-cart-row{grid-template-columns:1fr 1fr}.portal-cart-line-total{text-align:left}}@media(max-width:580px){.portal-cart-row{grid-template-columns:1fr}.portal-cart-update{align-items:stretch;flex-direction:column}.portal-cart-update input{width:100%}.portal-cart-footer{align-items:stretch;gap:1rem;flex-direction:column}}

.portal-document-tabs{display:flex;gap:.6rem;margin-bottom:1rem}.portal-document-tabs a,.portal-document-tabs span{padding:.7rem 1rem;border-radius:10px;font-weight:800}.portal-document-tabs .active{background:#173b78;color:#fff;text-decoration:none}.portal-document-tabs .disabled{background:#e8ecf3;color:#778195}.portal-document-filter{display:grid;grid-template-columns:2fr 1fr 1fr auto auto;gap:.75rem;align-items:end;background:#fff;border:1px solid #dfe5ef;border-radius:18px;padding:1.1rem;margin-bottom:1rem}.portal-document-filter label span{display:block;font-size:.8rem;font-weight:800;margin-bottom:.25rem}.portal-document-filter input{width:100%;padding:.7rem;border:1px solid #bdc8d9;border-radius:9px;font:inherit}.portal-invoice-panel{padding:0;overflow:hidden}.portal-invoice-summary{display:flex;justify-content:space-between;padding:1rem 1.25rem;background:#f7f9fc}.portal-invoice-row{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:1rem;padding:1rem 1.25rem;border-top:1px solid #e5e9f1;color:#22345c;text-decoration:none}.portal-invoice-row:hover{background:#f8fafc}.portal-invoice-row span,.portal-invoice-row strong{display:block}.portal-invoice-row div:last-child{text-align:right}.portal-invoice-hero{display:flex;justify-content:space-between;align-items:end;padding:1.6rem;border-radius:18px;background:#fff;border:1px solid #dfe5ef;margin-bottom:1rem}.portal-invoice-hero h1{margin:.25rem 0}.portal-invoice-hero>div:last-child{text-align:right}.portal-invoice-hero>div:last-child span,.portal-invoice-hero>div:last-child strong{display:block}.portal-invoice-hero>div:last-child strong{font-size:2rem}.portal-invoice-detail{overflow:auto}.portal-invoice-line{display:grid;grid-template-columns:1fr 2fr .7fr 1fr 1fr 1fr;gap:.7rem;padding:.8rem;border-top:1px solid #e8ecf2;min-width:850px}.portal-invoice-line-head{font-weight:900;background:#f7f9fc}.portal-invoice-line span:nth-child(n+3){text-align:right}.portal-invoice-total{display:flex;justify-content:flex-end;gap:1rem;padding:1rem;font-size:1.2rem}.portal-invoice-total strong{font-size:1.4rem}@media(max-width:800px){.portal-document-filter{grid-template-columns:1fr 1fr}.portal-invoice-row{grid-template-columns:1fr 1fr}.portal-invoice-row div:last-child{grid-column:1/-1;text-align:left}.portal-invoice-hero{align-items:flex-start;flex-direction:column;gap:1rem}.portal-invoice-hero>div:last-child{text-align:left}}@media print{.portal-topbar,.portal-print-button,.portal-document-filter{display:none!important}.portal-dashboard{max-width:none;padding:0}.portal-shell{background:#fff}.portal-panel,.portal-invoice-hero,.portal-stat{box-shadow:none}}

/* portal invoice header redesign */
.portal-invoice-header-card{background:#fff;border:1px solid #dfe5ef;border-radius:18px;margin-bottom:1rem;overflow:hidden;box-shadow:0 12px 32px rgba(29,54,95,.06)}
.portal-invoice-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;padding:1.6rem 1.8rem;border-bottom:1px solid #e7ebf2;background:linear-gradient(135deg,#fff 0%,#f8faff 100%)}
.portal-invoice-title-row h1{margin:.15rem 0 .55rem;font-size:2.6rem;line-height:1;color:#213b70}
.portal-invoice-badges{display:flex;flex-wrap:wrap;gap:.45rem}.portal-invoice-badges span{padding:.3rem .6rem;border-radius:999px;background:#edf3ff;color:#31548f;font-size:.78rem;font-weight:800}
.portal-invoice-header-total{text-align:right}.portal-invoice-header-total span,.portal-invoice-header-total small{display:block;color:#69758d}.portal-invoice-header-total strong{display:block;font-size:2.35rem;line-height:1.1;color:#203765;margin:.2rem 0}
.portal-invoice-header-grid{display:grid;grid-template-columns:minmax(280px,1fr) 2fr}.portal-invoice-billto{padding:1.5rem 1.8rem;border-right:1px solid #e7ebf2}.portal-invoice-billto h2{margin:.15rem 0 .35rem;color:#203765}.portal-invoice-billto strong,.portal-invoice-billto span{display:block;margin:.15rem 0;color:#4e5d78}
.portal-invoice-reference-grid{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr))}.portal-invoice-reference-grid div{padding:1.15rem 1.3rem;border-right:1px solid #edf0f5;border-bottom:1px solid #edf0f5}.portal-invoice-reference-grid div:nth-child(3n){border-right:0}.portal-invoice-reference-grid div:nth-last-child(-n+3){border-bottom:0}.portal-invoice-reference-grid span,.portal-invoice-reference-grid strong{display:block}.portal-invoice-reference-grid span{font-size:.78rem;color:#6e7a91;font-weight:700;text-transform:uppercase}.portal-invoice-reference-grid strong{margin-top:.35rem;color:#203765;overflow-wrap:anywhere}
@media(max-width:850px){.portal-invoice-title-row{flex-direction:column}.portal-invoice-header-total{text-align:left}.portal-invoice-header-grid{grid-template-columns:1fr}.portal-invoice-billto{border-right:0;border-bottom:1px solid #e7ebf2}.portal-invoice-reference-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.portal-invoice-reference-grid{grid-template-columns:1fr}.portal-invoice-reference-grid div{border-right:0}.portal-invoice-title-row h1{font-size:2rem}}
@media print{.portal-invoice-header-card{box-shadow:none}.portal-invoice-title-row{background:#fff}}

/* portal statements */
.portal-statement-sheet{background:#fff;border:1px solid #dfe5ef;border-radius:18px;overflow:hidden;box-shadow:0 12px 32px rgba(29,54,95,.06)}.portal-statement-header{display:flex;justify-content:space-between;gap:2rem;padding:1.7rem 1.9rem;background:#f8faff;border-bottom:1px solid #e5eaf2}.portal-statement-header h1{margin:.2rem 0;color:#203765}.portal-statement-header span{display:block;color:#56657f}.portal-statement-meta{text-align:right}.portal-statement-meta span,.portal-statement-meta strong{display:block}.portal-statement-customer{display:grid;grid-template-columns:2fr 1fr 1fr;border-bottom:1px solid #e5eaf2}.portal-statement-customer>div{padding:1.2rem 1.5rem;border-right:1px solid #e5eaf2}.portal-statement-customer span,.portal-statement-customer strong,.portal-statement-customer small{display:block}.portal-statement-aging{display:grid;grid-template-columns:repeat(7,1fr);background:#f8faff}.portal-statement-aging div{padding:.8rem;text-align:center;border-right:1px solid #e5eaf2}.portal-statement-aging span,.portal-statement-aging strong{display:block}.portal-statement-row{display:grid;grid-template-columns:1fr 1.2fr 2fr 1fr 1fr 1fr;gap:.7rem;padding:.8rem;border-top:1px solid #e8ecf2;min-width:780px}.portal-statement-row-head{font-weight:900;background:#f7f9fc}.portal-statement-row span:nth-child(n+4){text-align:right}.portal-statement-total{display:flex;justify-content:flex-end;gap:1rem;padding:1rem 1.7rem;border-top:1px solid #e5eaf2}.portal-no-print{}@media(max-width:850px){.portal-statement-header{flex-direction:column}.portal-statement-meta{text-align:left}.portal-statement-customer{grid-template-columns:1fr}.portal-statement-aging{grid-template-columns:repeat(2,1fr)}}@media print{.portal-no-print,.portal-topbar{display:none!important}.portal-statement-sheet{box-shadow:none;border:0}}

/* portal branch switcher and letterhead */
.portal-branch-switch{margin:0;padding-left:1rem;border-left:1px solid #dfe5ef}.portal-branch-switch label{display:flex;align-items:center;gap:.5rem;margin:0}.portal-branch-switch span{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#6d778c}.portal-branch-switch select{padding:.45rem .6rem;border:1px solid #c9d2e1;border-radius:9px;font:inherit;font-weight:700;color:#22345c;background:#fff}
.portal-branch-name{padding-left:1rem;border-left:1px solid #dfe5ef;font-weight:700;color:#6d778c}
.portal-document-from{margin-bottom:1rem}.portal-document-from h2{margin:.2rem 0 .35rem;color:#203765}.portal-document-from span{display:block;color:#4e5d78}
@media print{.portal-branch-switch,.portal-branch-name{display:none!important}}

.portal-letterhead{display:flex;align-items:flex-start;gap:1.2rem}.portal-letterhead-logo{display:block;max-width:180px;max-height:90px;object-fit:contain}.portal-letterhead-details{min-width:0}.portal-letterhead-details h1,.portal-letterhead-details h2{margin-top:0}@media(max-width:620px){.portal-letterhead{flex-direction:column}.portal-letterhead-logo{max-width:150px;max-height:75px}}@media print{.portal-letterhead-logo{max-width:160px;max-height:80px}}

/* portrait document layouts */
.portal-statement-sheet,
.portal-document-from,
.portal-invoice-header-card,
.portal-invoice-detail,
.portal-invoice-total {
    box-sizing: border-box;
    width: 100%;
    max-width: 210mm;
    margin-left: auto;
    margin-right: auto;
}

.portal-statement-sheet,
.portal-invoice-header-card {
    overflow: hidden;
}

@page {
    size: A4 portrait;
    margin: 12mm;
}

@media print {
    html,
    body {
        width: 210mm;
        margin: 0;
        padding: 0;
        background: #fff;
    }

    .portal-dashboard {
        width: auto;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .portal-statement-sheet,
    .portal-document-from,
    .portal-invoice-header-card,
    .portal-invoice-detail,
    .portal-invoice-total {
        width: 100%;
        max-width: none;
        margin: 0 0 6mm;
        border-radius: 0;
        box-shadow: none;
    }

    .portal-statement-header,
    .portal-invoice-title-row {
        padding: 8mm;
        gap: 8mm;
    }

    .portal-letterhead-logo {
        max-width: 48mm;
        max-height: 25mm;
    }

    .portal-letterhead-details h1,
    .portal-invoice-title-row h1 {
        font-size: 19pt;
        line-height: 1.1;
    }

    .portal-statement-customer > div,
    .portal-invoice-billto,
    .portal-invoice-reference-grid div {
        padding: 4mm;
    }

    .portal-statement-aging {
        grid-template-columns: repeat(7, minmax(0, 1fr));
        font-size: 8pt;
    }

    .portal-statement-aging div {
        padding: 2.5mm 1mm;
    }

    .portal-statement-row {
        grid-template-columns: 18mm 23mm minmax(42mm, 1fr) 22mm 22mm 22mm;
        gap: 1.5mm;
        min-width: 0;
        padding: 2.5mm 2mm;
        font-size: 8pt;
        break-inside: avoid;
    }

    .portal-invoice-line {
        grid-template-columns: 22mm minmax(48mm, 1.8fr) 13mm 22mm 22mm 24mm;
        gap: 1.5mm;
        min-width: 0;
        padding: 2.5mm 2mm;
        font-size: 8pt;
        break-inside: avoid;
    }

    .portal-statement-row span,
    .portal-invoice-line span {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .portal-statement-header,
    .portal-statement-customer,
    .portal-statement-aging,
    .portal-invoice-header-card,
    .portal-document-from {
        break-inside: avoid;
    }
}

/* portrait screen overflow fix */
@media screen {
    .portal-statement-sheet,
    .portal-document-from,
    .portal-invoice-header-card,
    .portal-invoice-detail,
    .portal-invoice-total {
        width: min(100%, 210mm);
        max-width: 100%;
        min-width: 0;
    }

    .portal-invoice-panel,
    .portal-invoice-detail,
    .portal-statement-sheet {
        min-width: 0;
    }

    .portal-invoice-line {
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
        grid-template-columns:
            minmax(70px, .8fr)
            minmax(150px, 2fr)
            minmax(48px, .5fr)
            minmax(72px, .8fr)
            minmax(78px, .85fr)
            minmax(78px, .85fr);
    }

    .portal-statement-row {
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
        grid-template-columns:
            minmax(62px, .8fr)
            minmax(78px, 1fr)
            minmax(135px, 2fr)
            minmax(70px, .8fr)
            minmax(70px, .8fr)
            minmax(70px, .8fr);
    }

    .portal-invoice-line > *,
    .portal-statement-row > *,
    .portal-invoice-reference-grid > *,
    .portal-statement-customer > * {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .portal-letterhead,
    .portal-letterhead-details,
    .portal-invoice-title-row > *,
    .portal-statement-header > * {
        min-width: 0;
    }

    .portal-letterhead-logo {
        max-width: min(180px, 30%);
        height: auto;
    }
}

@media screen and (max-width: 760px) {
    .portal-invoice-detail,
    .portal-statement-sheet {
        overflow-x: auto;
    }

    .portal-invoice-line {
        min-width: 670px;
    }

    .portal-statement-row {
        min-width: 650px;
    }
}

/* Invoice and credit-note document actions */
.portal-document-actions {
    box-sizing: border-box;
    display: flex;
    justify-content: flex-end;
    width: min(100%, 210mm);
    max-width: 100%;
    margin: 0 auto 1rem;
}
.portal-document-actions .portal-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
@media print {
    .portal-document-actions {
        display: none !important;
    }
}

/* compact portrait invoice print */
@media print {
    @page {
        size: A4 portrait;
        margin: 8mm;
    }

    body {
        font-size: 9pt;
        line-height: 1.15;
    }

    /* Keep the invoice flowing naturally instead of pushing the entire
       header or line-item card onto a new page. */
    .portal-document-from,
    .portal-invoice-header-card,
    .portal-invoice-detail {
        break-inside: auto !important;
        page-break-inside: auto !important;
        margin-bottom: 3mm !important;
    }

    .portal-document-from {
        padding: 4mm 5mm !important;
    }

    .portal-document-from .portal-eyebrow,
    .portal-invoice-title-row .portal-eyebrow,
    .portal-invoice-detail .portal-eyebrow {
        margin: 0 0 1mm !important;
        font-size: 7pt !important;
        letter-spacing: .1em;
    }

    /* Compact branch letterhead. */
    .portal-document-from .portal-letterhead {
        display: grid !important;
        grid-template-columns: 36mm minmax(0, 1fr) !important;
        align-items: start !important;
        gap: 4mm !important;
    }

    .portal-document-from .portal-letterhead-logo {
        width: 36mm !important;
        max-width: 36mm !important;
        max-height: 20mm !important;
        object-fit: contain !important;
    }

    .portal-document-from .portal-letterhead-details h2 {
        margin: 0 0 1mm !important;
        font-size: 12pt !important;
        line-height: 1.05 !important;
    }

    .portal-document-from .portal-letterhead-details span {
        display: inline !important;
        font-size: 8pt !important;
        line-height: 1.15 !important;
    }

    .portal-document-from .portal-letterhead-details span:not(:last-child)::after {
        content: " · ";
    }

    /* Put invoice number and total on one compact row. */
    .portal-invoice-title-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        padding: 4mm 5mm !important;
        gap: 5mm !important;
    }

    .portal-invoice-title-row h1 {
        margin: 0 !important;
        font-size: 19pt !important;
        line-height: 1 !important;
    }

    .portal-invoice-badges {
        display: none !important;
    }

    .portal-invoice-header-total {
        text-align: right !important;
    }

    .portal-invoice-header-total span,
    .portal-invoice-header-total small {
        font-size: 7.5pt !important;
    }

    .portal-invoice-header-total strong {
        margin: .5mm 0 !important;
        font-size: 18pt !important;
        line-height: 1 !important;
    }

    /* Bill-to and six facts share one row instead of stacking vertically. */
    .portal-invoice-header-grid {
        display: grid !important;
        grid-template-columns: 42% 58% !important;
    }

    .portal-invoice-billto {
        padding: 3mm 5mm !important;
    }

    .portal-invoice-billto h2 {
        margin: 0 0 1mm !important;
        font-size: 11pt !important;
    }

    .portal-invoice-billto span,
    .portal-invoice-billto strong {
        margin: 0 !important;
        font-size: 8pt !important;
        line-height: 1.2 !important;
    }

    .portal-invoice-reference-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .portal-invoice-reference-grid div {
        padding: 2.5mm 3mm !important;
    }

    .portal-invoice-reference-grid span {
        font-size: 6.5pt !important;
    }

    .portal-invoice-reference-grid strong {
        margin-top: .5mm !important;
        font-size: 8.5pt !important;
    }

    /* Compact line-item card and keep heading with the first row. */
    .portal-invoice-detail {
        padding: 3mm 4mm !important;
    }

    .portal-invoice-detail .portal-panel-heading {
        margin: 0 0 2mm !important;
        break-after: avoid !important;
        page-break-after: avoid !important;
    }

    .portal-invoice-detail .portal-panel-heading h2 {
        margin: 0 !important;
        font-size: 11pt !important;
    }

    .portal-invoice-lines {
        break-before: avoid !important;
        page-break-before: avoid !important;
    }

    .portal-invoice-line {
        grid-template-columns: 22mm minmax(45mm, 1fr) 13mm 22mm 22mm 23mm !important;
        gap: 1.5mm !important;
        min-width: 0 !important;
        padding: 2mm 1.5mm !important;
        font-size: 7.5pt !important;
        line-height: 1.1 !important;
    }

    .portal-invoice-line-head {
        break-after: avoid !important;
        page-break-after: avoid !important;
    }

    .portal-invoice-total {
        justify-content: flex-end !important;
        gap: 3mm !important;
        margin: 0 !important;
        padding: 3mm 2mm 1mm !important;
        font-size: 10pt !important;
        break-inside: avoid !important;
    }

    .portal-invoice-total strong {
        font-size: 12pt !important;
    }
}


/* Shared portal IQ retrieval overlay */
.portal-retrieval-overlay[hidden] { display: none !important; }
.portal-retrieval-overlay { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; padding: 1.25rem; background: rgba(15,31,62,.70); backdrop-filter: blur(3px); }
.portal-retrieval-card { box-sizing: border-box; display: grid; justify-items: center; gap: .75rem; width: min(100%,430px); padding: 2rem 1.75rem; color: #203765; text-align: center; background: #fff; border: 1px solid #d9e1ed; border-radius: 20px; box-shadow: 0 24px 70px rgba(8,24,52,.30); }
.portal-retrieval-spinner { width: 48px; height: 48px; border: 5px solid #e3e9f2; border-top-color: #df6f2b; border-radius: 50%; animation: portal-retrieval-spin .75s linear infinite; }
.portal-retrieval-title { font-size: 1.15rem; line-height: 1.3; }
.portal-retrieval-message { color: #576781; line-height: 1.5; }
.portal-retrieval-card small { color: #7a8495; line-height: 1.4; }
.portal-action-busy { cursor: wait !important; opacity: .62 !important; pointer-events: none !important; }
.portal-is-retrieving, .portal-is-retrieving body { overflow: hidden; cursor: wait; }
@keyframes portal-retrieval-spin { to { transform: rotate(360deg); } }
@media print { .portal-retrieval-overlay { display: none !important; } }


/* Portal document navigation tabs */
.portal-doc-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: .8rem 1.35rem;
    border: 1px solid transparent;
    border-radius: 14px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease,
        color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.portal-doc-tab-secondary {
    color: #203765;
    background: #fff;
    border-color: #cdd7e7;
    box-shadow: 0 4px 12px rgba(30, 55, 98, .08);
}

.portal-doc-tab-secondary:hover,
.portal-doc-tab-secondary:focus-visible {
    color: #fff;
    background: #244f91;
    border-color: #244f91;
    box-shadow: 0 8px 20px rgba(36, 79, 145, .20);
    transform: translateY(-1px);
    outline: none;
}

.portal-doc-tab-secondary:active {
    transform: translateY(0);
}

/* Portal document back action */
.portal-document-actions {
    gap: .65rem;
    flex-wrap: wrap;
}

.portal-document-back {
    margin-right: auto;
}

@media (max-width: 520px) {
    .portal-document-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .portal-document-actions .portal-button {
        width: 100%;
        text-align: center;
    }
}
/* Tenant portal theme variables */
:root{--portal-primary:#1F3864;--portal-primary-text:#fff;--portal-accent:#EE7326;--portal-header:#1F3864;--portal-header-text:#fff;--portal-surface:#F6F8FC}.portal-shell{background:var(--portal-surface)}.portal-topbar{background:var(--portal-header);color:var(--portal-header-text)}.portal-topbar .portal-brand,.portal-topbar .portal-account-name,.portal-topbar .portal-branch-name{color:var(--portal-header-text)}.portal-button-primary,.portal-document-tabs .active{background:var(--portal-primary);border-color:var(--portal-primary);color:var(--portal-primary-text)}.portal-eyebrow{color:var(--portal-accent)}.portal-retrieval-spinner{border-top-color:var(--portal-accent)}
/* Portal theme admin */
.portal-theme-layout{display:grid;grid-template-columns:minmax(320px,420px) minmax(0,1fr);gap:1.5rem;align-items:start}.portal-theme-controls{display:grid;gap:1.5rem}.portal-theme-scope{display:grid;gap:.35rem;padding:1rem;background:#f2f7fd;border-radius:12px}.portal-colour-field{display:grid;gap:.5rem;margin:1rem 0}.portal-colour-field>div{display:flex;justify-content:space-between;gap:.75rem}.portal-colour-field input[type=color]{width:54px;height:44px}.portal-colour-field input:not([type=color]){min-height:44px;padding:.65rem;border:1px solid #cbd5e1;border-radius:10px;font-family:monospace}.portal-theme-presets{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.portal-theme-preset{padding:.75rem;border:1px solid #d9e1ed;border-radius:12px;background:#fff;text-align:left}.portal-theme-preset>span{display:flex;overflow:hidden;border-radius:8px}.portal-theme-preset i{height:26px;flex:1}.portal-theme-preview-card{position:sticky;top:1rem}.portal-theme-preview{background:var(--preview-surface);border-radius:14px;overflow:hidden}.portal-theme-preview header{display:flex;justify-content:space-between;padding:1.25rem;background:var(--preview-header);color:white}.portal-theme-preview main{display:grid;gap:1rem;padding:1.25rem}.preview-eyebrow{color:var(--preview-accent);font-weight:800}.preview-tabs,.preview-filter,.preview-list,.preview-loading{padding:1rem;background:#fff;border-radius:12px}.preview-tabs,.preview-filter{display:flex;gap:.5rem}.preview-tabs b,.preview-filter b{padding:.6rem;background:var(--preview-primary);color:#fff;border-radius:8px}.preview-list{display:grid;gap:.6rem}.preview-list div{display:flex;justify-content:space-between;border-top:1px solid #eee;padding-top:.6rem;color:var(--preview-primary)}.preview-loading{display:flex;gap:.7rem;align-items:center}.preview-loading i{width:30px;height:30px;border:4px solid #e3e9f2;border-top-color:var(--preview-accent);border-radius:50%}@media(max-width:950px){.portal-theme-layout{grid-template-columns:1fr}.portal-theme-preview-card{position:static}}
/* Nexus tenant appearance */
:root{--nexus-primary:#1F3864;--nexus-primary-text:#fff;--nexus-accent:#EE7326;--nexus-sidebar:#1F3864;--nexus-sidebar-text:#fff;--nexus-surface:#F6F7F9}.app-shell,.app-main{background:var(--nexus-surface)}.app-sidebar{background:var(--nexus-sidebar);color:var(--nexus-sidebar-text)}.app-button-primary{background:var(--nexus-primary);color:var(--nexus-primary-text)}.app-eyebrow{color:var(--nexus-accent)}.appearance-tabs{display:flex;gap:.5rem;margin:1rem 0}.appearance-tabs button{padding:.75rem 1rem;border:1px solid #d7deea;border-radius:10px;background:#fff;font-weight:800}.appearance-tabs button.active{background:var(--nexus-primary);color:var(--nexus-primary-text)}.appearance-mirror{display:flex;gap:.65rem;padding:1rem;background:#f2f7fd;border-radius:10px;font-weight:700}.tenant-appearance fieldset{border:0;padding:0;margin:0}.tenant-appearance fieldset:disabled{opacity:.5}


/* ============================================================
   Tenant Customer Portal theme overrides
   These rules intentionally override the original portal styles.
   ============================================================ */

html,
body:has(.portal-shell) {
    background-color: var(--portal-surface, #F6F8FC) !important;
}

.portal-shell {
    min-height: 100vh;
    background-color: var(--portal-surface, #F6F8FC) !important;
}

/* Portal header */
.portal-shell .portal-topbar {
    background: var(--portal-header, #1F3864) !important;
    background-color: var(--portal-header, #1F3864) !important;
    color: var(--portal-header-text, #FFFFFF) !important;
}

.portal-shell .portal-topbar .portal-brand,
.portal-shell .portal-topbar .portal-account-name,
.portal-shell .portal-topbar .portal-branch-name,
.portal-shell .portal-topbar a:not(.portal-nav-button) {
    color: var(--portal-header-text, #FFFFFF) !important;
}

/* Primary actions */
.portal-shell .portal-button-primary,
.portal-shell button.primary,
.portal-shell a.primary,
.portal-shell .portal-primary,
.portal-shell .portal-document-tabs .active,
.portal-shell .portal-document-tabs button.active,
.portal-shell .portal-tabs .active,
.portal-shell .portal-tabs button.active {
    background: var(--portal-primary, #1F3864) !important;
    background-color: var(--portal-primary, #1F3864) !important;
    border-color: var(--portal-primary, #1F3864) !important;
    color: var(--portal-primary-text, #FFFFFF) !important;
}

/* Primary-colour text and links */
.portal-shell .portal-link,
.portal-shell .portal-document-number,
.portal-shell .portal-card a:not(.portal-button-primary),
.portal-shell .portal-content a:not(.portal-button-primary) {
    color: var(--portal-primary, #1F3864) !important;
}

/* Accent elements */
.portal-shell .portal-eyebrow,
.portal-shell .portal-accent,
.portal-shell .portal-highlight,
.portal-shell .portal-card h2,
.portal-shell .portal-card h3 {
    color: var(--portal-accent, #EE7326) !important;
}

/* Loading indicators */
.portal-shell .portal-retrieval-spinner,
.portal-shell .portal-spinner {
    border-top-color: var(--portal-accent, #EE7326) !important;
}

/* Focus state */
.portal-shell input:focus,
.portal-shell select:focus,
.portal-shell textarea:focus {
    border-color: var(--portal-primary, #1F3864) !important;
    outline-color: var(--portal-primary, #1F3864) !important;
    box-shadow:
        0 0 0 3px
        color-mix(
            in srgb,
            var(--portal-primary, #1F3864) 18%,
            transparent
        ) !important;
}


/* Portal top navigation actions
   Keep text visible on the existing white navigation buttons. */
.portal-shell .portal-topbar button,
.portal-shell .portal-topbar .portal-nav-button,
.portal-shell .portal-topbar a.portal-nav-button {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border-color: color-mix(
        in srgb,
        var(--portal-header, #1F3864) 18%,
        #FFFFFF
    ) !important;
    color: var(--portal-primary, #1F3864) !important;
}

.portal-shell .portal-topbar button:hover,
.portal-shell .portal-topbar .portal-nav-button:hover,
.portal-shell .portal-topbar a.portal-nav-button:hover {
    background: color-mix(
        in srgb,
        var(--portal-primary, #1F3864) 8%,
        #FFFFFF
    ) !important;
    color: var(--portal-primary, #1F3864) !important;
}

.portal-shell .portal-topbar button:focus-visible,
.portal-shell .portal-topbar .portal-nav-button:focus-visible,
.portal-shell .portal-topbar a.portal-nav-button:focus-visible {
    outline: 3px solid color-mix(
        in srgb,
        var(--portal-accent, #EE7326) 35%,
        transparent
    ) !important;
    outline-offset: 2px;
}

/* Final portal top-navigation text correction.
   Existing portal rules colour nested labels independently,
   so apply the readable colour to the control and its children. */

.portal-shell .portal-topbar button,
.portal-shell .portal-topbar button *,
.portal-shell .portal-topbar a.portal-nav-button,
.portal-shell .portal-topbar a.portal-nav-button *,
.portal-shell .portal-topbar nav a,
.portal-shell .portal-topbar nav a *,
.portal-shell .portal-topbar .portal-nav a,
.portal-shell .portal-topbar .portal-nav a *,
.portal-shell .portal-topbar .portal-actions a,
.portal-shell .portal-topbar .portal-actions a *,
.portal-shell .portal-topbar .portal-actions button,
.portal-shell .portal-topbar .portal-actions button * {
    color: var(--portal-primary, #1F3864) !important;
    -webkit-text-fill-color: var(--portal-primary, #1F3864) !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-shadow: none !important;
}

/* Ensure existing button text has not been visually collapsed. */
.portal-shell .portal-topbar button,
.portal-shell .portal-topbar a.portal-nav-button,
.portal-shell .portal-topbar nav a,
.portal-shell .portal-topbar .portal-nav a,
.portal-shell .portal-topbar .portal-actions a,
.portal-shell .portal-topbar .portal-actions button {
    font-size: inherit;
    text-indent: 0 !important;
}

/* Preserve white button surfaces. */
.portal-shell .portal-topbar button,
.portal-shell .portal-topbar a.portal-nav-button,
.portal-shell .portal-topbar nav a,
.portal-shell .portal-topbar .portal-nav a,
.portal-shell .portal-topbar .portal-actions a,
.portal-shell .portal-topbar .portal-actions button {
    background-color: #FFFFFF !important;
    border-color: color-mix(
        in srgb,
        var(--portal-header, #1F3864) 18%,
        #FFFFFF
    ) !important;
}

/* Exact Customer Portal top-action button styling */
.portal-shell .portal-topbar .portal-top-actions .portal-button,
.portal-shell .portal-topbar .portal-top-actions a.portal-button,
.portal-shell .portal-topbar .portal-top-actions button.portal-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    color: var(--portal-primary, #1F3864) !important;
    -webkit-text-fill-color: var(--portal-primary, #1F3864) !important;
    border: 1px solid color-mix(
        in srgb,
        var(--portal-header, #1F3864) 20%,
        #FFFFFF
    ) !important;
    text-decoration: none !important;
    text-indent: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.portal-shell .portal-topbar .portal-top-actions .portal-button:hover {
    background: color-mix(
        in srgb,
        var(--portal-primary, #1F3864) 8%,
        #FFFFFF
    ) !important;
    color: var(--portal-primary, #1F3864) !important;
    -webkit-text-fill-color: var(--portal-primary, #1F3864) !important;
}

.portal-shell .portal-topbar .portal-top-actions form {
    display: flex;
    margin: 0;
}

/* Portal document back-navigation overlay */
.portal-back-navigation-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: none;
    place-items: center;
    padding: 24px;
    background: rgba(15, 30, 55, 0.46);
    backdrop-filter: blur(3px);
}

.portal-back-navigation-overlay.visible {
    display: grid;
}

.portal-back-navigation-card {
    display: grid;
    justify-items: center;
    gap: 10px;
    width: min(100%, 340px);
    padding: 28px;
    color: #22345c;
    text-align: center;
    background: #ffffff;
    border: 1px solid #dce4ef;
    border-radius: 18px;
    box-shadow: 0 22px 60px rgba(15, 30, 55, 0.24);
}

.portal-back-navigation-card strong {
    font-size: 1.1rem;
}

.portal-back-navigation-card span {
    color: #68758a;
}

.portal-back-navigation-spinner {
    width: 42px;
    height: 42px;
    border: 5px solid #dfe7f1;
    border-top-color: var(--portal-accent, #EE7326);
    border-radius: 50%;
    animation: portal-back-navigation-spin 0.75s linear infinite;
}

.portal-document-back.portal-navigation-pending {
    pointer-events: none;
    opacity: 0.65;
}

@keyframes portal-back-navigation-spin {
    to {
        transform: rotate(360deg);
    }
}


/* Two-step sign-in: set-up pages and Account security */
.portal-recovery-codes{columns:2;margin:0 0 1rem;padding:.9rem 1rem;background:#f6f8fb;border:1px solid #dfe5ef;border-radius:10px;font-size:.95rem;line-height:1.6;white-space:pre}
.portal-security{max-width:760px}
.portal-security .portal-panel{margin-bottom:1rem}
.portal-security .portal-panel h2{margin-top:0}
.portal-muted{color:#6d778c}
.portal-security-form{margin-top:1rem}
.portal-security-form label{display:block;font-weight:800;margin-bottom:.4rem}
.portal-security-row{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.portal-security-row input{width:11rem;padding:.65rem .8rem;border:1px solid #bdc8d9;border-radius:9px;font:inherit;letter-spacing:.08em}
.portal-security a.portal-button{display:inline-block;text-decoration:none}