/* =============================================================
   VE Portal — Global Design System
   Source of truth for colors, spacing, components.
   ============================================================= */

:root {
    /* ── Brand ── */
    --ve-brand-1:        #015974;
    --ve-brand-2:        #0a7691;
    --ve-brand-3:        #9D6023;
    --ve-brand-gradient: linear-gradient(135deg, #015974 0%, #0a7691 45%, #9D6023 100%);
    --ve-brand-gradient-soft: linear-gradient(135deg, rgba(1,89,116,0.08), rgba(157,96,35,0.08));
    --ve-brand-btn-gradient:  linear-gradient(135deg, #015974 0%, #9D6023 100%);

    /* ── Surfaces ── */
    --ve-bg:             #f1f5f9;
    --ve-bg-alt:         #f8fafc;
    --ve-surface:        #ffffff;
    --ve-surface-muted:  #f8fafc;
    --ve-surface-hover:  #f1f5f9;

    /* ── Borders ── */
    --ve-border:         #e2e8f0;
    --ve-border-strong:  #cbd5e1;

    /* ── Text ── */
    --ve-text:           #0f172a;
    --ve-text-muted:     #64748b;
    --ve-text-subtle:    #94a3b8;
    --ve-text-invert:    #ffffff;

    /* ── Status ── */
    --ve-success:        #16a34a;
    --ve-success-bg:     #dcfce7;
    --ve-success-fg:     #166534;
    --ve-warn:           #ca8a04;
    --ve-warn-bg:        #fef9c3;
    --ve-warn-fg:        #854d0e;
    --ve-orange:         #ea580c;
    --ve-orange-bg:      #ffedd5;
    --ve-orange-fg:      #9a3412;
    --ve-danger:         #dc2626;
    --ve-danger-bg:      #fee2e2;
    --ve-danger-fg:      #991b1b;
    --ve-info:           #0369a1;
    --ve-info-bg:        #e0f2fe;
    --ve-info-fg:        #0c4a6e;

    /* ── Radius ── */
    --ve-radius-sm:      6px;
    --ve-radius:         10px;
    --ve-radius-lg:      14px;
    --ve-radius-xl:      20px;
    --ve-radius-pill:    999px;

    /* ── Shadows ── */
    --ve-shadow-xs:      0 1px 2px rgba(15, 23, 42, 0.06);
    --ve-shadow-sm:      0 2px 6px rgba(15, 23, 42, 0.08);
    --ve-shadow:         0 6px 16px rgba(15, 23, 42, 0.08), 0 2px 4px rgba(15, 23, 42, 0.04);
    --ve-shadow-lg:      0 20px 44px rgba(1, 89, 116, 0.15), 0 6px 14px rgba(15, 23, 42, 0.06);
    --ve-shadow-xl:      0 40px 80px rgba(1, 89, 116, 0.22), 0 10px 24px rgba(15, 23, 42, 0.08);
    --ve-shadow-brand:   0 8px 22px rgba(1, 89, 116, 0.35);

    /* ── Spacing scale ── */
    --ve-s-1: 4px;
    --ve-s-2: 8px;
    --ve-s-3: 12px;
    --ve-s-4: 16px;
    --ve-s-5: 20px;
    --ve-s-6: 24px;
    --ve-s-8: 32px;
    --ve-s-10: 40px;

    /* ── Type ── */
    --ve-font:           "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    /* ── Motion ── */
    --ve-ease:           cubic-bezier(0.2, 0.8, 0.3, 1);
    --ve-dur-fast:       0.15s;
    --ve-dur:            0.22s;
}

/* ── Base ── */
html, body {
    font-family: var(--ve-font);
    color: var(--ve-text);
    background: var(--ve-bg);
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ── Page header ── */
.ve-page {
    padding: 24px;
}

.ve-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 20px 26px;
    margin-bottom: 20px;
    background: var(--ve-brand-gradient);
    border-radius: var(--ve-radius-lg);
    color: var(--ve-text-invert);
    box-shadow: var(--ve-shadow-lg);
}

.ve-page-header h1,
.ve-page-header h2 {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: -0.2px;
}

.ve-page-header .sub {
    color: rgba(255,255,255,0.8);
    font-size: 0.88rem;
    margin-top: 2px;
}

/* ── Card ── */
.ve-card {
    background: var(--ve-surface);
    border: 1px solid var(--ve-border);
    border-radius: var(--ve-radius-lg);
    box-shadow: var(--ve-shadow-sm);
    overflow: hidden;
    transition: box-shadow var(--ve-dur) var(--ve-ease), transform var(--ve-dur) var(--ve-ease);
}

.ve-card:hover {
    box-shadow: var(--ve-shadow);
}

.ve-card-header {
    padding: 14px 18px;
    border-bottom: 1px solid var(--ve-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.ve-card-header h3,
.ve-card-header h4 {
    margin: 0;
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--ve-text);
}

.ve-card-body {
    padding: 18px;
}

/* ── Stat card ── */
.ve-stat {
    background: var(--ve-surface);
    border: 1px solid var(--ve-border);
    border-radius: var(--ve-radius-lg);
    padding: 18px 20px;
    display: flex;
    gap: 14px;
    align-items: center;
    box-shadow: var(--ve-shadow-sm);
    transition: all var(--ve-dur) var(--ve-ease);
}

.ve-stat:hover {
    transform: translateY(-2px);
    box-shadow: var(--ve-shadow);
}

.ve-stat-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ve-brand-gradient-soft);
    color: var(--ve-brand-1);
    font-size: 1.2rem;
    flex-shrink: 0;
}

.ve-stat-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--ve-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.ve-stat-value {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--ve-text);
    margin-top: 2px;
}

/* ── Buttons ── */
.ve-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 9px 16px;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.2px;
    border-radius: var(--ve-radius);
    border: 1px solid transparent;
    cursor: pointer;
    transition: all var(--ve-dur) var(--ve-ease);
    user-select: none;
    text-decoration: none;
    white-space: nowrap;
}

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

.ve-btn-primary {
    background: var(--ve-brand-btn-gradient);
    color: var(--ve-text-invert);
    box-shadow: var(--ve-shadow-brand);
}

.ve-btn-primary:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(1, 89, 116, 0.45);
    color: var(--ve-text-invert);
}

.ve-btn-secondary {
    background: var(--ve-surface);
    color: var(--ve-text);
    border-color: var(--ve-border-strong);
}

.ve-btn-secondary:hover:not(:disabled) {
    background: var(--ve-surface-hover);
    border-color: var(--ve-brand-1);
    color: var(--ve-brand-1);
}

.ve-btn-ghost {
    background: transparent;
    color: var(--ve-text-muted);
}

.ve-btn-ghost:hover:not(:disabled) {
    background: var(--ve-surface-hover);
    color: var(--ve-text);
}

.ve-btn-danger {
    background: var(--ve-danger);
    color: var(--ve-text-invert);
}

.ve-btn-danger:hover:not(:disabled) {
    background: #b91c1c;
    color: var(--ve-text-invert);
}

.ve-btn-sm {
    padding: 6px 11px;
    font-size: 0.78rem;
}

.ve-btn-lg {
    padding: 12px 22px;
    font-size: 0.98rem;
}

/* ── Inputs ── */
.ve-input,
.ve-select,
.ve-textarea {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid var(--ve-border);
    border-radius: var(--ve-radius);
    background: var(--ve-surface-muted);
    color: var(--ve-text);
    font-size: 0.9rem;
    font-family: inherit;
    transition: all var(--ve-dur-fast) var(--ve-ease);
    box-sizing: border-box;
}

.ve-input::placeholder,
.ve-textarea::placeholder {
    color: var(--ve-text-subtle);
}

.ve-input:hover,
.ve-select:hover,
.ve-textarea:hover {
    border-color: var(--ve-border-strong);
    background: var(--ve-surface);
}

.ve-input:focus,
.ve-select:focus,
.ve-textarea:focus {
    outline: none;
    border-color: var(--ve-brand-1);
    background: var(--ve-surface);
    box-shadow: 0 0 0 4px rgba(1, 89, 116, 0.12);
}

.ve-select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 38px;
    cursor: pointer;
}

.ve-label {
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 6px;
    letter-spacing: 0.2px;
}

.ve-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ve-required { color: var(--ve-danger); }
.ve-optional { color: var(--ve-text-subtle); font-weight: 400; font-size: 0.78rem; }

.ve-helper {
    font-size: 0.76rem;
    color: var(--ve-text-muted);
}

.ve-error {
    font-size: 0.78rem;
    color: var(--ve-danger);
    font-weight: 500;
}

/* ── Badges ── */
.ve-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    border-radius: var(--ve-radius-pill);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.3px;
    background: var(--ve-info-bg);
    color: var(--ve-info-fg);
    white-space: nowrap;
}

.ve-badge-success { background: var(--ve-success-bg); color: var(--ve-success-fg); }
.ve-badge-warn    { background: var(--ve-warn-bg);    color: var(--ve-warn-fg);    }
.ve-badge-orange  { background: var(--ve-orange-bg);  color: var(--ve-orange-fg);  }
.ve-badge-danger  { background: var(--ve-danger-bg);  color: var(--ve-danger-fg);  }
.ve-badge-info    { background: var(--ve-info-bg);    color: var(--ve-info-fg);    }
.ve-badge-muted   { background: #e2e8f0;              color: #475569; }

/* ── Table ── */
.ve-table-wrap {
    background: var(--ve-surface);
    border: 1px solid var(--ve-border);
    border-radius: var(--ve-radius-lg);
    box-shadow: var(--ve-shadow-sm);
    overflow: hidden;
}

.ve-table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

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

.ve-table thead {
    background: var(--ve-surface-muted);
    border-bottom: 2px solid var(--ve-border);
}

.ve-table th {
    text-align: left;
    padding: 12px 14px;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--ve-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    white-space: nowrap;
}

.ve-table td {
    padding: 13px 14px;
    color: var(--ve-text);
    font-size: 0.875rem;
    border-bottom: 1px solid var(--ve-border);
    vertical-align: middle;
}

.ve-table tbody tr:hover {
    background: var(--ve-surface-hover);
}

.ve-table tbody tr:last-child td {
    border-bottom: none;
}

/* ── Modal ── */
.ve-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(3px);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    animation: veFade var(--ve-dur) var(--ve-ease);
}

.ve-modal {
    background: var(--ve-surface);
    border-radius: var(--ve-radius-xl);
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: var(--ve-shadow-xl);
    animation: veSlideUp var(--ve-dur) var(--ve-ease);
}

.ve-modal-header {
    padding: 20px 24px;
    background: var(--ve-brand-gradient);
    color: var(--ve-text-invert);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.ve-modal-body {
    padding: 20px 24px;
    overflow-y: auto;
    flex: 1;
}

.ve-modal-footer {
    padding: 14px 24px;
    border-top: 1px solid var(--ve-border);
    background: var(--ve-surface-muted);
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

/* ── Animations ── */
@keyframes veFade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes veSlideUp {
    from { opacity: 0; transform: translateY(12px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0)   scale(1); }
}

@keyframes veSpin {
    to { transform: rotate(360deg); }
}

/* ── Spinner ── */
.ve-spinner {
    width: 22px;
    height: 22px;
    border: 3px solid var(--ve-border);
    border-top-color: var(--ve-brand-1);
    border-radius: 50%;
    animation: veSpin 0.7s linear infinite;
}

/* ── Utility ── */
.ve-hide       { display: none !important; }
.ve-flex       { display: flex; }
.ve-gap-1      { gap: 4px; }
.ve-gap-2      { gap: 8px; }
.ve-gap-3      { gap: 12px; }
.ve-gap-4      { gap: 16px; }
.ve-mt-auto    { margin-top: auto; }
.ve-text-muted { color: var(--ve-text-muted); }

/* ── Scrollbar (webkit) ── */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ── Responsive helpers ── */
@media (max-width: 991.98px) {
    .ve-page { padding: 18px; }
    .ve-page-header { padding: 18px 20px; flex-wrap: wrap; gap: 12px; }
}

@media (max-width: 768px) {
    .ve-page { padding: 12px; }
    .ve-page-header { padding: 14px 16px; }
    .ve-page-header h1,
    .ve-page-header h2 { font-size: 1.2rem; }
    .ve-card-header { padding: 12px 14px; flex-wrap: wrap; gap: 10px; }
    .ve-card-body   { padding: 14px; }
    .ve-modal { width: 95vw; max-width: 95vw; max-height: 92vh; }
    .ve-modal-header,
    .ve-modal-footer { padding: 12px 14px; flex-wrap: wrap; gap: 8px; }
    .ve-modal-body { padding: 14px; }
    .ve-btn { padding: 0.45rem 0.85rem; font-size: 0.85rem; }
    .ve-table th, .ve-table td { padding: 0.55rem 0.6rem; font-size: 0.82rem; }
    .ve-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .ve-stat { padding: 14px; }
    .ve-stat-value { font-size: 1.4rem; }
}

@media (max-width: 480px) {
    .ve-page { padding: 8px; }
    .ve-page-header h1,
    .ve-page-header h2 { font-size: 1.05rem; }
    .ve-modal-footer { flex-direction: column; align-items: stretch; }
    .ve-modal-footer .ve-btn { width: 100%; }
}

/* =============================================================
   Tax Invoice Layout — shared by InvoiceDetails + AdminInvoiceDetail + QAInvoiceDetail
   ============================================================= */

.tax-invoice-page {
    padding: 2rem 1rem 4rem;
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: 0.875rem;
    color: #1a1a1a;
}

.inv-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 0;
    gap: 14px;
    color: #6b7280;
}

.inv-spinner {
    width: 32px;
    height: 32px;
    border: 3px solid #e5e7eb;
    border-top-color: #015974;
    border-radius: 50%;
    animation: invSpin 0.7s linear infinite;
}

@keyframes invSpin { to { transform: rotate(360deg); } }

.inv-error { padding: 20px; color: #dc2626; }

/* Document */
.tax-invoice-doc {
    max-width: 860px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 32px 40px 24px;
}

/* Top header */
.inv-top-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 28px;
}

.inv-logo { max-width: 200px; height: auto; }

.inv-company-info {
    text-align: right;
    font-size: 0.8rem;
    line-height: 1.6;
    color: #374151;
}

/* Title row */
.inv-title-row {
    display: flex;
    align-items: stretch;
    border: 1px solid #d1d5db;
    margin-bottom: 24px;
}

.inv-title-cell {
    flex: 1;
    padding: 10px 14px;
    border-right: 1px solid #d1d5db;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.inv-title-cell:last-child { border-right: none; }
.inv-title-main { flex: 1.4; }

.inv-tax-label { font-size: 1.3rem; font-weight: 700; color: #111827; }
.inv-meta-head { font-size: 0.72rem; font-weight: 700; color: #374151; }
.inv-meta-val  { font-size: 0.875rem; color: #111827; }

/* Alerts */
.inv-alert {
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 16px;
    font-size: 0.855rem;
}

.inv-alert-danger  { background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; }
.inv-alert-warn    { background: #fffbeb; border: 1px solid #fde68a; color: #92400e; }
.inv-alert-success { background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; }
.inv-alert-info    { background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af; }

/* Bill to */
.inv-bill-to { margin-bottom: 24px; }

.inv-bill-label {
    font-weight: 700;
    font-size: 0.8rem;
    margin-bottom: 6px;
    color: #111827;
}

.inv-bill-body {
    line-height: 1.7;
    font-size: 0.855rem;
    color: #374151;
}

.inv-bill-body em { font-style: italic; }

/* Line items table */
.inv-table { width: 100%; border-collapse: collapse; }

.inv-table th {
    background: #f3f4f6;
    font-size: 0.75rem;
    font-weight: 700;
    color: #374151;
    padding: 9px 12px;
    border: 1px solid #d1d5db;
    text-align: left;
    vertical-align: bottom;
}

.inv-th-sub { font-style: italic; font-weight: 400; font-size: 0.7rem; }

.inv-table td {
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    vertical-align: top;
    font-size: 0.855rem;
    color: #1a1a1a;
}

.inv-th-id, .inv-td-id  { width: 70px; }
.inv-th-uom, .inv-th-qty { width: 55px; }
.inv-th-tax  { width: 55px; }
.inv-th-price, .inv-th-amount { width: 110px; }
.inv-th-del  { width: 70px; }
.inv-td-num  { text-align: right; }

.inv-td-desc strong { display: block; }
.inv-desc-type   { display: block; font-size: 0.78rem; color: #6b7280; }
.inv-desc-reports { display: block; font-size: 0.75rem; color: #9ca3af; }

.inv-remove-btn {
    background: none;
    border: 1px solid #fca5a5;
    color: #dc2626;
    border-radius: 4px;
    cursor: pointer;
    padding: 2px 7px;
    font-size: 1rem;
    line-height: 1;
}
.inv-remove-btn:hover { background: #fef2f2; }

/* Notes + Totals */
.inv-bottom-section {
    display: flex;
    border: 1px solid #d1d5db;
    border-top: none;
}

.inv-notes {
    flex: 1;
    padding: 14px 16px;
    border-right: 1px solid #d1d5db;
    font-size: 0.82rem;
}

.inv-notes strong { display: block; margin-bottom: 8px; font-size: 0.8rem; color: #374151; }

.inv-note-row { display: flex; gap: 12px; margin-bottom: 4px; color: #374151; }
.inv-note-date { color: #6b7280; min-width: 72px; }

.inv-totals { min-width: 280px; padding: 10px 16px; }

.inv-total-row {
    display: flex;
    justify-content: space-between;
    padding: 5px 0;
    font-size: 0.855rem;
    border-bottom: 1px solid #f3f4f6;
    gap: 20px;
}

.inv-total-row:last-child { border-bottom: none; }
.inv-total-row em { font-size: 0.78rem; font-style: italic; color: #6b7280; }

.inv-balance-row {
    background: #f9fafb;
    margin: 4px -16px -10px;
    padding: 8px 16px;
    font-size: 1rem;
}

/* View online */
.inv-view-online {
    margin: 28px 0 0;
    font-size: 0.855rem;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e7eb;
}

.inv-view-link { color: #015974; text-decoration: underline; }

/* How to pay */
.inv-how-to-pay {
    margin-top: 20px;
    padding: 16px 0;
    border-bottom: 1px solid #e5e7eb;
}

.inv-pay-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
    font-size: 0.9rem;
}

.inv-pay-summary { font-size: 0.82rem; color: #374151; }

.inv-bank-deposit {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    font-size: 0.82rem;
    line-height: 1.7;
    color: #374151;
}

.inv-bank-icon { font-size: 1.4rem; padding-top: 2px; }

/* Footer */
.inv-footer {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 14px;
    margin-top: 16px;
    border-top: 1px solid #e5e7eb;
    font-size: 0.78rem;
    color: #6b7280;
}

/* Action bar */
.inv-action-bar {
    max-width: 860px;
    margin: 20px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.inv-actions-left, .inv-actions-right {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.inv-btn-sec {
    padding: 9px 18px;
    border: 1.5px solid #d1d5db;
    background: #fff;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    transition: background 0.15s, border-color 0.15s;
}
.inv-btn-sec:hover { background: #f9fafb; border-color: #9ca3af; }

.inv-btn-primary {
    padding: 9px 22px;
    border: none;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    transition: opacity 0.15s;
}
.inv-btn-primary:hover:not(:disabled) { opacity: 0.9; }
.inv-btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }

.inv-status-notice { font-size: 0.855rem; font-weight: 500; color: #6b7280; }
.inv-notice-pending { color: #92400e; }

/* Print */
@media print {
    .no-print { display: none !important; }
    .inv-action-bar { display: none !important; }
    .tax-invoice-page { padding: 0; }
    .tax-invoice-doc { border: none; padding: 0; max-width: 100%; }
}

@media (max-width: 640px) {
    .tax-invoice-doc { padding: 20px 16px; }
    .inv-title-row { flex-wrap: wrap; }
    .inv-title-cell { min-width: 45%; border-bottom: 1px solid #d1d5db; }
    .inv-top-header { flex-direction: column; gap: 12px; }
    .inv-company-info { text-align: left; }
    .inv-bottom-section { flex-direction: column; }
    .inv-notes { border-right: none; border-bottom: 1px solid #d1d5db; }
    .inv-totals { min-width: unset; }
    .inv-pay-header { flex-direction: column; align-items: flex-start; }
    .inv-footer { flex-direction: column; gap: 4px; }
}