* {
    box-sizing: border-box
}

html, body {
    margin: 0;
    font-family: Inter,"Segoe UI",Arial,sans-serif;
    color: #1e293b;
    background: #f3f6fa;
    font-size: 14px
}

a {
    color: #176b84;
    text-decoration: none
}

    a:hover {
        text-decoration: underline
    }

.shell {
    display: flex;
    min-height: 100vh
}

.sidebar {
    width: 244px;
    background: #102f3b;
    color: #d8e7eb;
    padding: 28px 14px;
    display: flex;
    flex-direction: column;
    flex-shrink: 0
}

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: white;
    font-weight: 750;
    letter-spacing: 1px;
    padding: 0 9px 32px;
    font-size: 16px
}

    .brand:hover {
        text-decoration: none
    }

    .brand small {
        display: block;
        font-size: 10px;
        letter-spacing: .4px;
        font-weight: 400;
        color: #a2bac3;
        margin-top: 3px
    }

.brand-mark {
    display: grid;
    place-items: center;
    background: #28a2a4;
    width: 39px;
    height: 39px;
    border-radius: 12px;
    font-size: 23px
}

.nav-label {
    color: #7dabb8;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.6px;
    padding: 24px 14px 11px
}

.nav-link {
    display: flex;
    gap: 11px;
    padding: 12px 14px;
    border-radius: 9px;
    color: #c0d3d8;
    font-weight: 550;
    margin: 2px 0
}

    .nav-link.active, .nav-link:hover {
        background: #245263;
        color: #fff;
        text-decoration: none
    }

.side-foot {
    margin-top: auto;
    padding: 20px 11px 2px;
    font-size: 11px;
    color: #8aaeb9;
    line-height: 1.7
}

.workspace {
    min-width: 0;
    flex: 1
}

.topbar {
    height: 65px;
    background: white;
    border-bottom: 1px solid #e6eaee;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 38px;
    color: #526270
}

.env-pill {
    font-size: 10px;
    letter-spacing: .9px;
    background: #e9f7f3;
    color: #10795e;
    padding: 8px 12px;
    border-radius: 99px;
    font-weight: 700
}

.content {
    max-width: 1390px;
    margin: 0 auto;
    padding: 35px 40px
}

.page-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-bottom: 29px
}

    .page-head h1 {
        font-size: 29px;
        letter-spacing: -.8px;
        margin: 5px 0 8px
    }

    .page-head p, .muted {
        color: #738392
    }

.eyebrow {
    font-size: 11px;
    color: #13848b;
    font-weight: 750;
    letter-spacing: 1.4px
}

.stats {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 17px;
    margin-bottom: 24px
}

.stat, .panel {
    background: #fff;
    border: 1px solid #e5ebef;
    box-shadow: 0 4px 24px rgba(24,55,72,.035);
    border-radius: 13px
}

.stat {
    padding: 24px
}

    .stat span, .stat small {
        display: block;
        color: #748494
    }

    .stat strong {
        display: block;
        font-size: 25px;
        margin: 12px 0;
        color: #1b4355
    }

    .stat small {
        font-size: 12px
    }

.panel {
    padding: 24px
}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px
}

    .section-head h2 {
        margin: 0;
        font-size: 17px
    }

.table-wrap {
    overflow-x: auto
}

table {
    border-collapse: collapse;
    width: 100%
}

th, td {
    padding: 14px 12px;
    border-bottom: 1px solid #edf1f5;
    text-align: left;
    vertical-align: middle
}

th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .6px;
    color: #8796a5;
    font-weight: 750;
    background: #f9fbfc
}

td {
    font-size: 13px
}

.amount {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap
}

.status {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .4px;
    padding: 6px 9px;
    border-radius: 6px;
    background: #e9eff3;
    color: #49606d
}

    .status.finalized {
        background: #e2f7ec;
        color: #168152
    }

    .status.draft {
        background: #fff4d8;
        color: #9a6500
    }

.btn {
    border: 1px solid #d5e0e5;
    border-radius: 8px;
    background: #fff;
    padding: 10px 14px;
    color: #244c60;
    cursor: pointer;
    font-weight: 650
}

    .btn.primary {
        background: #126881;
        border-color: #126881;
        color: #fff
    }

    .btn.disabled {
        background: #e9eef0;
        color: #91a1ac;
        cursor: default
    }

.toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px
}

    .toolbar input, .toolbar select {
        border: 1px solid #dce5e8;
        border-radius: 7px;
        padding: 11px;
        font: inherit;
        min-width: 160px
    }

    .toolbar input {
        min-width: 280px
    }

.pager {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #778797;
    margin-top: 20px
}

    .pager div {
        display: flex;
        gap: 8px
    }

.btn:disabled {
    opacity: .45;
    cursor: not-allowed
}

.detail-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 22px;
    margin: 26px 0
}

    .detail-grid small, .detail-grid strong {
        display: block
    }

    .detail-grid small {
        color: #8896a3;
        margin-bottom: 6px
    }

.detail h3 {
    font-size: 14px;
    margin-top: 28px
}

.total-row {
    background: #f2f9f9;
    font-weight: 750
}

.alert {
    padding: 15px 18px;
    border-radius: 8px;
    margin: 14px 0
}

    .alert.error {
        background: #fff0f0;
        color: #a52d2d
    }

.loading {
    padding: 50px;
    text-align: center
}

#blazor-error-ui {
    display: none
}

@media(max-width:800px) {
    .sidebar {
        width: 74px;
        padding-left: 7px;
        padding-right: 7px
    }

    .brand > span:last-child, .nav-label, .nav-link span, .side-foot {
        display: none
    }

    .brand {
        padding-left: 8px
    }

    .nav-link {
        justify-content: center
    }

    .topbar {
        padding: 0 16px;
        font-size: 12px
    }

    .content {
        padding: 24px 15px
    }

    .stats {
        grid-template-columns: 1fr
    }

    .detail-grid {
        grid-template-columns: repeat(2,1fr)
    }

    .page-head {
        align-items: flex-start;
        flex-direction: column
    }

    .panel {
        padding: 15px
    }

    .toolbar {
        flex-wrap: wrap
    }

        .toolbar input {
            min-width: 180px
        }
}
/* Phase 1.4.2 — Journal Voucher filters */
.voucher-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 14px;
    align-items: end;
    margin-bottom: 22px;
}

    .voucher-filters .field {
        display: flex;
        flex-direction: column;
        gap: 6px;
        min-width: 145px;
        flex: 1;
    }

    .voucher-filters .voucher-search {
        flex: 2;
        min-width: 230px;
    }

    .voucher-filters .field label {
        font-size: 11px;
        font-weight: 700;
        color: #617688;
    }

    .voucher-filters input,
    .voucher-filters select,
    .pager select {
        border: 1px solid #dce5e8;
        border-radius: 7px;
        background: white;
        padding: 10px;
        font: inherit;
        color: #244c60;
        min-width: 0;
        width: 100%;
    }

.voucher-filter-actions {
    display: flex;
    gap: 8px;
    align-items: end;
}

.pager select {
    width: auto;
    padding: 8px;
}

.sr-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 800px) {
    .voucher-filters .field,
    .voucher-filters .voucher-search {
        min-width: 100%;
        flex: auto;
    }

    .voucher-filter-actions {
        width: 100%;
    }
}

/* Phase 1.4.3 — additive stylesheet; keep original app.css intact. */
.je-form {
    padding: 28px
}

.je-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid #e5ebef;
    padding-bottom: 18px
}

    .je-heading h2 {
        margin: 6px 0;
        font-size: 19px;
        letter-spacing: .3px
    }

.je-fields {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 18px;
    margin: 24px 0
}

.je-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0
}

    .je-field label, .je-toolbar label {
        font-size: 12px;
        font-weight: 700;
        color: #60798b
    }

    .je-field input, .je-field select, .je-field textarea, .je-toolbar input, .je-lines select, .je-lines input {
        border: 1px solid #d6e1e7;
        border-radius: 7px;
        background: #fff;
        padding: 10px;
        font: inherit;
        color: #244c60;
        min-width: 0;
        width: 100%
    }

    .je-field textarea {
        resize: vertical
    }

.je-section-title {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    margin-top: 26px
}

    .je-section-title h3 {
        font-size: 15px;
        margin-bottom: 10px
    }

    .je-section-title span {
        color: #748494;
        font-size: 12px
    }

.je-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 10px 0 16px
}

    .je-toolbar input {
        width: 300px;
        max-width: 100%
    }

.je-lines th:first-child {
    width: 46px
}

.je-lines th:nth-child(2) {
    min-width: 310px
}

.je-lines th:nth-child(3), .je-lines th:nth-child(4) {
    min-width: 140px
}

.je-lines td {
    padding: 9px 8px
}

.je-lines .je-amount {
    text-align: right;
    font-variant-numeric: tabular-nums
}

.je-line-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 16px 0 24px
}

.je-particulars {
    margin-top: 22px
}

.je-note {
    font-size: 12px;
    margin: 16px 0
}

.je-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    border-top: 1px solid #e5ebef;
    padding-top: 22px
}

.je-form .alert ul {
    margin: 8px 0 0;
    padding-left: 22px
}

@media(max-width:1000px) {
    .je-fields {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }
}

@media(max-width:600px) {
    .je-fields {
        grid-template-columns: 1fr
    }

    .je-toolbar {
        flex-wrap: wrap
    }

    .je-heading {
        align-items: flex-start
    }

    .je-form {
        padding: 17px
    }
}

/* Phase 1.4.3.1 — additive styles, do not replace app.css */
.je-account-choice {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0
}

.je-account-selected {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 1px solid #d6e1e7;
    border-radius: 7px;
    padding: 10px;
    color: #244c60;
    background: #f9fbfc
}

.je-lookup-open {
    white-space: nowrap
}

.al-backdrop,
.lookup-overlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    background: rgba(9,30,43,.62);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px
}

.al-dialog,
.lookup-modal {
    width: min(920px,100%);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 60px rgba(0,0,0,.24);
    color: #16374a
}

.al-heading,
.lookup-header {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 16px;
    padding: 22px 24px 10px
}

    .al-heading h3 {
        margin: 0;
        font-size: 21px
    }

    .al-heading p {
        margin: 6px 0;
        color: #667e8d
    }

.al-search-row,
.lookup-search-row {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 24px 18px
}

    .al-search-row label,
    .lookup-search-row label {
        font-size: 12px;
        font-weight: 700;
        color: #60798b
    }

    .al-search-row input,
    .lookup-search-row input,
    .lookup-body input {
        border: 1px solid #d6e1e7;
        border-radius: 7px;
        padding: 12px;
        font: inherit;
        width: 100%;
        color: #244c60
    }

.al-table-wrap,
.lookup-body {
    overflow: auto;
    min-height: 0;
    flex: 1;
    padding: 0 24px
}

.al-table,
.lookup-modal table {
    width: 100%;
    border-collapse: collapse
}

    .al-table th {
        text-align: left;
        background: #f5f8fa;
        font-size: 12px;
        letter-spacing: .03em;
        color: #71889a
    }

    .al-table td, .al-table th {
        padding: 10px 12px;
        border-bottom: 1px solid #e7eef2
    }

        .al-table td:first-child {
            white-space: nowrap;
            font-weight: 600
        }

.al-empty {
    text-align: center;
    color: #6b8290
}

.al-footer,
.lookup-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 24px;
    border-top: 1px solid #e7eef2;
    color: #69808e
}

.al-footer-actions,
.lookup-footer-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap
}

@media(max-width:700px) {
    .al-heading, .al-search-row, .al-footer,
    .lookup-footer {
        padding-left: 14px;
        padding-right: 14px
    }

    .al-table-wrap,
    .lookup-body {
        padding: 0 8px
    }

    .al-footer,
    .lookup-footer {
        flex-direction: column;
        align-items: start
    }

    .je-account-choice {
        flex-wrap: wrap
    }
}

/* Phase 1.4.3.1: fallback aliases and viewport safety */
.lookup-modal th, .lookup-modal td {
    padding: 10px 12px;
    border-bottom: 1px solid #e7eef2;
    text-align: left;
}

.lookup-modal th {
    background: #f5f8fa;
    color: #71889a;
    font-size: 12px;
}

.lookup-footer {
    flex-shrink: 0;
}

@media (max-width: 700px) {
    .lookup-header, .lookup-search-row, .lookup-footer {
        padding-left: 14px;
        padding-right: 14px;
    }

    .lookup-footer {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Phase 1.4.3.2 — Save Draft confirmation & success (append to app.css) */
.save-confirm-overlay {
    position: fixed;
    inset: 0;
    z-index: 5000;
    background: rgba(10,30,43,.64);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px
}

.save-confirm-dialog {
    width: min(500px,100%);
    max-height: 90vh;
    overflow: auto;
    border-radius: 13px;
    background: #fff;
    color: #18384a;
    box-shadow: 0 18px 60px rgba(0,0,0,.25);
    padding: 24px
}

.save-confirm-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px
}

    .save-confirm-header h3 {
        margin: 0;
        font-size: 21px
    }

.save-confirm-dialog > p {
    line-height: 1.5;
    color: #526c7a
}

.save-confirm-summary {
    background: #f3f8f9;
    border-radius: 9px;
    padding: 13px 16px;
    margin: 18px 0
}

    .save-confirm-summary > div {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        padding: 7px 0
    }

    .save-confirm-summary span {
        color: #667f8d
    }

    .save-confirm-summary strong {
        font-variant-numeric: tabular-nums
    }

.save-confirm-dialog .save-confirm-note {
    font-size: 12px;
    color: #637b89
}

.save-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    margin-top: 20px
}

.je-save-success {
    border: 1px solid #b5e1c7;
    background: #effaf3;
    color: #17603e;
    border-radius: 9px;
    padding: 18px;
    margin: 20px 0
}

    .je-save-success p {
        margin: 9px 0 15px
    }

    .je-save-success .btn.primary {
        display: inline-block
    }

@media(max-width:600px) {
    .save-confirm-dialog {
        padding: 17px
    }

    .save-confirm-actions {
        flex-wrap: wrap
    }
}

/* Phase 1.4.4 — append to existing app.css; no other CSS replacement */
.btn.danger {
    background: #bd3131;
    border-color: #bd3131;
    color: #fff
}

.btn.danger-outline {
    border-color: #e5abab;
    color: #a12424;
    background: #fff
}

    .btn.danger-outline:hover {
        background: #fff2f2
    }

.danger-text {
    color: #a12424 !important;
    font-weight: 650
}

.detail .je-actions {
    margin-top: 22px;
    flex-wrap: wrap
}

/* Phase 1.4.5 — A4 Journal Entry Voucher printing; append to existing app.css */
.jev-print-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px
}

.jev-paper {
    position: relative;
    max-width: 210mm;
    margin: 0 auto;
    background: white;
    border: 1px solid #dbe3e8;
    box-shadow: 0 4px 20px #142c4210;
    color: #151c22;
    min-height: 260mm
}

.jev-paper-content {
    position: relative;
    z-index: 1;
    padding: 16mm 14mm 13mm
}

.jev-paper-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    border-bottom: 2px solid #101820;
    padding-bottom: 10px
}

.jev-company h1 {
    font-size: 15px;
    letter-spacing: .2px;
    margin: 0 0 4px;
    font-weight: 800
}

.jev-company p {
    font-size: 11px;
    margin: 0 0 15px
}

.jev-company h2 {
    font-size: 16px;
    margin: 0;
    font-weight: 800
}

.jev-number {
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-align: right;
    white-space: nowrap;
    font-size: 12px
}

    .jev-number strong {
        font-size: 17px
    }

.jev-meta {
    margin: 12px 0 20px;
    display: grid;
    gap: 7px
}

    .jev-meta div {
        display: grid;
        grid-template-columns: 125px 1fr;
        gap: 8px
    }

    .jev-meta dt {
        font-weight: 750;
        font-size: 11px
    }

    .jev-meta dd {
        margin: 0;
        font-size: 12px
    }

.jev-print-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 11px
}

    .jev-print-table th {
        background: #eef2f4;
        color: #161d22;
        font-size: 10px;
        letter-spacing: 0;
        border-top: 1px solid #333;
        border-bottom: 1px solid #333;
        padding: 8px 6px
    }

        .jev-print-table th:nth-child(1) {
            width: 18%
        }

        .jev-print-table th:nth-child(2) {
            width: 42%
        }

        .jev-print-table th:nth-child(3), .jev-print-table th:nth-child(4) {
            width: 20%
        }

    .jev-print-table td {
        font-size: 11px;
        padding: 7px 6px;
        border-bottom: 1px solid #d5dadf;
        overflow-wrap: anywhere
    }

    .jev-print-table .jev-numeric {
        text-align: right;
        font-variant-numeric: tabular-nums
    }

.jev-print-total {
    font-weight: 800;
    background: #f2f4f5
}

    .jev-print-total td {
        border-top: 2px solid #222;
        border-bottom: 2px solid #222
    }

.jev-particulars-print {
    margin-top: 22px;
    min-height: 95px
}

    .jev-particulars-print h3 {
        font-size: 12px;
        margin: 0 0 9px
    }

    .jev-particulars-print p {
        white-space: pre-wrap;
        font-size: 12px;
        line-height: 1.5;
        margin: 0
    }

.jev-signatures {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 34px;
    margin-top: 38px
}

    .jev-signatures strong {
        font-size: 11px
    }

.jev-sign-line {
    margin-top: 28px;
    border-bottom: 1px solid #333;
    min-height: 22px;
    text-align: center;
    font-size: 12px;
    font-weight: 700
}

.jev-sign-designation {
    text-align: center;
    min-height: 17px;
    font-size: 11px;
    margin-top: 5px
}

.jev-print-status {
    font-size: 10px;
    margin-top: 25px;
    color: #58636b
}

.jev-watermark {
    position: absolute;
    z-index: 0;
    top: 40%;
    left: 10%;
    transform: rotate(-28deg);
    font-size: 110px;
    letter-spacing: 15px;
    font-weight: 800;
    color: rgba(146,65,26,.095);
    pointer-events: none;
    user-select: none
}

@media(max-width:700px) {
    .jev-paper-content {
        padding: 18px 12px
    }

    .jev-paper-head {
        flex-wrap: wrap
    }

    .jev-number {
        text-align: left
    }

    .jev-meta div {
        grid-template-columns: 100px 1fr
    }

    .jev-print-table th, .jev-print-table td {
        padding: 6px 3px;
        font-size: 10px
    }

    .jev-watermark {
        font-size: 56px
    }
}

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

@media print {
    html, body {
        background: white !important;
        color: black !important;
        margin: 0 !important;
        padding: 0 !important
    }

    .sidebar, .topbar, .side-foot, .no-print, #blazor-error-ui {
        display: none !important
    }

    .shell, .workspace, .content {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        overflow: visible !important
    }

    .jev-paper {
        border: 0 !important;
        box-shadow: none !important;
        margin: 0 !important;
        max-width: none !important;
        min-height: 0 !important;
        break-inside: auto !important
    }

    .jev-paper-content {
        padding: 0 !important
    }

    .jev-print-table thead {
        display: table-header-group
    }

    .jev-print-table tr {
        break-inside: avoid;
        page-break-inside: avoid
    }

    .jev-particulars-print, .jev-signatures {
        break-inside: avoid;
        page-break-inside: avoid
    }

    .jev-watermark {
        color: rgba(146,65,26,.12) !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact
    }

    .jev-print-total {
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact
    }
}

/* Nimbus rebrand: sidebar wordmark uses approved-style N/cloud vector */
.brand{margin:0 5px 22px;padding:6px 5px;display:block;background:#ffffff;border-radius:10px}.nimbus-brand-icon{display:block;width:100%;height:auto;max-height:71px;object-fit:contain;object-position:left center}
@media(max-width:800px){.brand{margin:0 0 20px;padding:5px}.nimbus-brand-icon{width:45px;height:40px;max-width:none;object-fit:cover;object-position:left}}

/* Phase 1.5.2: Nimbus Web authentication */
.nimbus-public-layout{min-height:100vh;background:#f2f6fa;display:flex;justify-content:center;align-items:center;padding:24px}
.nimbus-login-wrap{width:100%;display:flex;justify-content:center}
.nimbus-login-card{background:#fff;border:1px solid #dfe6ee;border-radius:18px;padding:36px;width:min(420px,100%);box-shadow:0 12px 40px #0e37431a}
.nimbus-login-logo{width:240px;max-width:100%;height:auto;margin-bottom:18px}
.nimbus-login-card h1{font-size:25px;margin:0 0 8px;color:#12334a}
.nimbus-login-card form{display:flex;flex-direction:column;gap:10px;margin:24px 0 16px}
.nimbus-login-card label{font-weight:650;font-size:13px;color:#29485a}
.nimbus-login-input{width:100%;border:1px solid #cbd7e1;border-radius:8px;font-size:15px;padding:12px;min-height:44px;background:white;color:#102d40}
.nimbus-login-input:focus{outline:2px solid #0b789a;outline-offset:1px}
.nimbus-login-submit{margin-top:10px;min-height:44px}
.nimbus-user-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
@media(max-width:700px){.nimbus-user-tools{gap:6px}.nimbus-user-tools .env-pill{display:none}.nimbus-login-card{padding:24px}}

/* Official Nimbus artwork layout: cropped from user-approved source PNG */
.brand{padding:12px 6px;min-height:125px;display:flex;align-items:center;justify-content:center}
.nimbus-brand-icon{width:100%;max-height:118px;object-fit:contain;object-position:center}
.nimbus-login-logo{width:315px;max-width:100%;height:auto;display:block;margin:0 auto 18px}
@media(max-width:800px){.brand{min-height:76px;padding:6px}.nimbus-brand-icon{width:100%;height:auto;max-height:85px;max-width:100%;object-fit:contain;object-position:center}}

/* PR #004 — Journal Voucher filter layout refinement (presentation only). */
.voucher-filters.pr004-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 20px;
    align-items: stretch;
}
.voucher-filters.pr004-layout .field {
    min-width: 0;
    width: 100%;
}
.voucher-filters.pr004-layout .voucher-search {
    grid-column: 1 / -1;
    min-width: 0;
}
.voucher-filters.pr004-layout .voucher-filter-actions {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    width: 100%;
}
@media (max-width: 640px) {
    .voucher-filters.pr004-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }
    .voucher-filters.pr004-layout .voucher-search,
    .voucher-filters.pr004-layout .voucher-filter-actions {
        grid-column: 1;
    }
    .voucher-filters.pr004-layout .field {
        min-width: 0;
    }
    .voucher-filters.pr004-layout .voucher-filter-actions {
        justify-content: flex-end;
    }
}

/* PR #005 — Shared form control styling consistency.
   One visual baseline for editable controls across management, vouchers,
   filters and authentication. No behavior or markup changes. */
:root {
    --nimbus-control-border: #cbd7e1;
    --nimbus-control-text: #244c60;
    --nimbus-control-focus: #126881;
    --nimbus-control-radius: 8px;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
select,
textarea {
    font: inherit;
    color: var(--nimbus-control-text);
    background-color: #fff;
    border: 1px solid var(--nimbus-control-border);
    border-radius: var(--nimbus-control-radius);
    min-height: 40px;
    max-width: 100%;
    transition: border-color .15s ease, box-shadow .15s ease;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--nimbus-control-focus);
    outline-offset: 1px;
    border-color: var(--nimbus-control-focus);
}
input:disabled, select:disabled, textarea:disabled {
    background-color: #f1f5f9;
    color: #64748b;
    cursor: not-allowed;
    opacity: 1;
}
input[readonly], textarea[readonly] {
    background-color: #f8fafc;
}
input::placeholder, textarea::placeholder { color: #8192a2; opacity: 1; }
.form-control { display: block; width: 100%; padding: 10px 12px; }
.je-field input, .je-field select, .je-field textarea,
.je-toolbar input, .je-lines select, .je-lines input,
.voucher-filters input, .voucher-filters select, .pager select,
.toolbar input, .toolbar select {
    border-color: var(--nimbus-control-border);
    border-radius: var(--nimbus-control-radius);
}
@media (prefers-reduced-motion: reduce) {
    input, select, textarea { transition: none; }
}

/* PR #009 — audit JSON detail: preserve formatting without horizontal page overflow. */
.audit-json { max-height: 320px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; padding: 12px; border-radius: 8px; background: #f4f7fa; color: #23465c; font-size: .85rem; }