/*
   Shared invoice shell
   Mirrors the approved cloud sales-return layout while leaving each document's
   existing fields, bindings and Bootstrap controls untouched.
*/
.invoice-page {
    min-height: 0;
    overflow: visible;
    background: var(--app-bg);
    color: var(--text-primary);
}

.invoice-page .invoice-toolbar,
.invoice-page .invoice-commandbar {
    min-height: 46px;
    padding: .5rem 1rem !important;
    background: #20262e !important;
    color: #fff;
    border-bottom: 1px solid #334155 !important;
}

.invoice-page .invoice-header,
.invoice-page .invoice-form-card {
    margin: 1rem 1rem .5rem;
    padding: .75rem !important;
    background: var(--surface) !important;
    color: var(--text-primary);
    border: 1px solid var(--border) !important;
    border-radius: .5rem;
    box-shadow: var(--shadow-sm);
}

.invoice-page .invoice-body,
.invoice-page .invoice-content {
    min-height: 0;
    padding: 0 1rem;
    overflow: visible;
}

.invoice-page .invoice-lines-panel {
    display: flex;
    flex-direction: column;
    min-height: 220px;
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: .5rem;
    box-shadow: var(--shadow-sm);
}

.invoice-page .invoice-lines-scroll {
    min-height: 180px;
    max-height: min(34rem, 52vh);
    overflow: auto !important;
    overscroll-behavior: contain;
}

.invoice-page .invoice-lines-scroll thead {
    position: sticky;
    top: 0;
    z-index: 2;
}

.invoice-page .invoice-table { margin: 0; }
.invoice-page .invoice-table thead th {
    background: #20262e;
    color: #e2e8f0;
    border-color: #334155;
}

.invoice-page .invoice-footer,
.invoice-page .invoice-summary {
    margin: 0 1rem 1rem;
    padding: .75rem !important;
    background: var(--surface) !important;
    color: var(--text-primary);
    border: 1px solid var(--border) !important;
    border-radius: .5rem;
    box-shadow: var(--shadow-sm);
}

[data-theme="dark"] .invoice-page .invoice-header,
[data-theme="dark"] .invoice-page .invoice-form-card,
[data-theme="dark"] .invoice-page .invoice-lines-panel,
[data-theme="dark"] .invoice-page .invoice-footer,
[data-theme="dark"] .invoice-page .invoice-summary {
    background: var(--surface) !important;
    border-color: var(--border) !important;
}

@media (max-width: 768px) {
    .invoice-page .invoice-toolbar,
    .invoice-page .invoice-commandbar {
        align-items: flex-start !important;
        gap: .5rem;
        flex-wrap: wrap;
    }

    .invoice-page .invoice-header,
    .invoice-page .invoice-form-card,
    .invoice-page .invoice-footer,
    .invoice-page .invoice-summary {
        margin-inline: .5rem;
    }

    .invoice-page .invoice-body,
    .invoice-page .invoice-content { padding-inline: .5rem; }
}