/* Shared POS page theme. Keep light/dark mode tokens centralized here. */
@view-transition {
    navigation: auto;
}

::view-transition-group(root) {
    animation-duration: .24s;
    animation-timing-function: cubic-bezier(.22, 1, .36, 1);
}

::view-transition-old(root) {
    animation: app-page-leave .15s ease-out both;
}

::view-transition-new(root) {
    animation: app-page-enter .24s cubic-bezier(.22, 1, .36, 1) both;
}

@keyframes app-page-leave {
    to {
        opacity: .35;
        transform: translateY(-2px) scale(.998);
        filter: saturate(.86);
    }
}

@keyframes app-page-enter {
    from {
        opacity: 0;
        transform: translateY(7px) scale(.997);
        filter: saturate(.86);
    }
}

@supports not (view-transition-name: root) {
    body {
        animation: app-page-enter .2s cubic-bezier(.22, 1, .36, 1) both;
    }
}

@media (prefers-reduced-motion: reduce) {
    ::view-transition-group(root),
    ::view-transition-old(root),
    ::view-transition-new(root),
    body {
        animation-duration: .001ms !important;
    }
}

:root {
    --theme-red: #dc1f2e;
    --theme-red-dark: #a70f1c;
    --theme-red-soft: #fff1f2;
    --theme-red-soft-2: #fff7f8;
    --theme-line: #f1c8ce;
    --theme-ink: #2f1216;
    --theme-card: #ffffff;
    --account-red: #dc1f2e;
    --account-red-dark: #a70f1c;
    --account-red-soft: #fff1f2;
    --account-line: #f1c8ce;
    --account-ink: #2f1216;
    --report-red: var(--theme-red);
    --report-red-dark: var(--theme-red-dark);
    --report-red-soft: var(--theme-red-soft);
    --report-red-soft-2: var(--theme-red-soft-2);
    --report-line: var(--theme-line);
    --report-ink: var(--theme-ink);
    --stock-red: var(--theme-red);
    --stock-red-dark: var(--theme-red-dark);
    --stock-red-soft: var(--theme-red-soft);
    --stock-red-soft-2: var(--theme-red-soft-2);
    --stock-line: var(--theme-line);
    --stock-ink: var(--theme-ink);
    --sr-red: var(--theme-red);
    --sr-red-dark: var(--theme-red-dark);
    --sr-red-soft: var(--theme-red-soft);
    --sr-line: var(--theme-line);
    --sr-ink: var(--theme-ink);
    --ls-red: var(--theme-red);
    --ls-red-dark: var(--theme-red-dark);
    --ls-red-soft: var(--theme-red-soft);
    --ls-line: var(--theme-line);
    --ls-ink: var(--theme-ink);
    --primary: #dc1f2e;
    --primary-dark: #a70f1c;
    --primary-light: #fff1f2;
}

body,
body.app-wrapper {
    background:
        linear-gradient(180deg, #fff1f2 0, #ffffff 190px),
        #ffffff;
    color: var(--theme-ink);
}

.qnav {
    background: linear-gradient(90deg, #a70f1c 0%, #dc1f2e 58%, #f43f5e 100%) !important;
    border-bottom-color: rgba(255,255,255,.16) !important;
    box-shadow: 0 8px 22px rgba(220,31,46,.20) !important;
    overflow: hidden;
    isolation: isolate;
}
.qnav::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(115deg, transparent 0 30%, rgba(255,255,255,.22) 45%, transparent 60%),
        radial-gradient(circle at 18% 50%, rgba(255,255,255,.16), transparent 28%),
        radial-gradient(circle at 78% 40%, rgba(255,255,255,.12), transparent 30%);
    background-size: 220% 100%, 100% 100%, 100% 100%;
    opacity: .62;
    animation: qnav-sheen 8s ease-in-out infinite;
}
.qnav::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent);
}
@keyframes qnav-sheen {
    0%, 34% { background-position: 180% 0, 0 0, 0 0; }
    58%, 100% { background-position: -80% 0, 0 0, 0 0; }
}
.qnav__brand,
.qnav__toggle,
.qnav__time,
.qnav__user,
.theme-toggle {
    position: relative;
    z-index: 1;
}
.qnav__brand {
    transition: transform .18s ease, filter .18s ease;
}
.qnav__brand:hover {
    transform: translateY(-1px);
    filter: drop-shadow(0 8px 14px rgba(47,18,22,.18));
}
.qnav__brand i {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: var(--theme-red) !important;
    filter: none !important;
    transition: transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .18s ease;
    box-shadow: 0 5px 12px rgba(47,18,22,.14);
}
.qnav__brand:hover i {
    transform: rotate(-6deg) scale(1.05);
    box-shadow: 0 9px 18px rgba(47,18,22,.20);
}
.qnav__time,
.qnav__user {
    background: rgba(255,255,255,.16) !important;
    border: 1px solid rgba(255,255,255,.24) !important;
    backdrop-filter: blur(10px);
    transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.qnav__time:hover,
.qnav__user:hover,
.theme-toggle:hover {
    transform: translateY(-1px);
    background: rgba(255,255,255,.24) !important;
    border-color: rgba(255,255,255,.38) !important;
    box-shadow: 0 8px 18px rgba(47,18,22,.16);
}
.qnav__avatar {
    box-shadow: 0 0 0 1px rgba(255,255,255,.28), 0 5px 12px rgba(47,18,22,.14);
}
@media (prefers-reduced-motion: reduce) {
    .qnav::before {
        animation: none;
    }
    .qnav__brand,
    .qnav__brand i,
    .qnav__time,
    .qnav__user,
    .theme-toggle {
        transition: none !important;
    }
    .qnav__brand:hover,
    .qnav__brand:hover i,
    .qnav__time:hover,
    .qnav__user:hover,
    .theme-toggle:hover {
        transform: none !important;
    }
}

.qsidebar {
    background: #fff !important;
    border-right: 1px solid var(--theme-line) !important;
    box-shadow: 4px 0 18px rgba(47,18,22,.06) !important;
    overflow: hidden;
    isolation: isolate;
}
.qsidebar::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(220,31,46,.07), transparent 34%),
        radial-gradient(circle at 18% 8%, rgba(220,31,46,.10), transparent 26%);
    opacity: .9;
}
.qsidebar::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    pointer-events: none;
    background: linear-gradient(180deg, transparent, rgba(220,31,46,.38), transparent);
}
.qsidebar__brand,
.qsidebar__nav,
.qsidebar__footer {
    position: relative;
    z-index: 1;
}
.qsidebar__brand {
    color: var(--theme-red-dark) !important;
    border-bottom: 1px solid #fee2e2 !important;
}
.qsidebar__brand i,
.qsidebar__group-left i,
.qsidebar__group-chevron,
.qsidebar__sublink-dot {
    color: var(--theme-red) !important;
}
.qsidebar__link:hover,
.qsidebar__group-btn:hover,
.qsidebar__sublink:hover {
    background: var(--theme-red-soft) !important;
    color: var(--theme-red-dark) !important;
    transform: translateX(3px);
    box-shadow: inset 0 0 0 1px rgba(220,31,46,.08), 0 6px 14px rgba(220,31,46,.08);
}
.qsidebar__link.active,
.qsidebar__sublink.active {
    background: var(--theme-red-soft) !important;
    color: var(--theme-red-dark) !important;
    font-weight: 700 !important;
    box-shadow: inset 0 0 0 1px rgba(220,31,46,.12), 0 8px 18px rgba(220,31,46,.10);
}
.qsidebar__link.active::before,
.qsidebar__sublink.active::before {
    background: var(--theme-red) !important;
    box-shadow: 0 0 10px rgba(220,31,46,.45);
}
.qsidebar__divider {
    background: #fee2e2 !important;
    position: relative;
    overflow: hidden;
}
.qsidebar__divider::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(220,31,46,.34), transparent);
}
.qsidebar__user-card {
    background: #fff7f8 !important;
    border-color: #fee2e2 !important;
    box-shadow: 0 8px 18px rgba(47,18,22,.07);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.qsidebar__user-card:hover {
    transform: translateY(-1px);
    border-color: #f1c8ce !important;
    box-shadow: 0 12px 24px rgba(47,18,22,.11);
}
.qsidebar__link,
.qsidebar__group-btn,
.qsidebar__sublink {
    transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease !important;
}
.qsidebar__group-chevron {
    transition: transform .22s cubic-bezier(.2,.8,.2,1), color .18s ease !important;
}
.qsidebar__group-btn:hover .qsidebar__group-chevron {
    color: var(--theme-red-dark) !important;
}
.qsidebar__submenu {
    transition: max-height .28s cubic-bezier(.2,.8,.2,1) !important;
}
.qsidebar__sublink-dot {
    transition: transform .18s ease, opacity .18s ease, box-shadow .18s ease;
}
.qsidebar__sublink:hover .qsidebar__sublink-dot,
.qsidebar__sublink.active .qsidebar__sublink-dot {
    opacity: 1 !important;
    transform: scale(1.28);
    box-shadow: 0 0 8px currentColor;
}
@media (prefers-reduced-motion: reduce) {
    .qsidebar__link,
    .qsidebar__group-btn,
    .qsidebar__sublink,
    .qsidebar__user-card,
    .qsidebar__sublink-dot {
        transition: none !important;
    }
    .qsidebar__link:hover,
    .qsidebar__group-btn:hover,
    .qsidebar__sublink:hover,
    .qsidebar__user-card:hover,
    .qsidebar__sublink:hover .qsidebar__sublink-dot,
    .qsidebar__sublink.active .qsidebar__sublink-dot {
        transform: none !important;
    }
}

.qpage-body {
    background:
        linear-gradient(135deg, rgba(220,31,46,.08), transparent 36%),
        #fff;
}
.main-content {
    background: transparent;
}
.page-header {
    padding: 14px 16px;
    border: 1px solid var(--theme-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 6px 18px rgba(47,18,22,.07);
}
.page-header h1,
.page-header h2,
.page-title {
    color: var(--theme-ink);
}
.page-header i,
.page-title i,
.card h3 i,
.modal__title i {
    color: var(--theme-red) !important;
}
.page-subtitle {
    color: #7f1d1d;
}

.card,
.modal {
    border-color: var(--theme-line) !important;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(47,18,22,.07);
}
.card__body {
    background: #fff;
}
.modal__header {
    background: #fff7f8;
    border-bottom-color: #fee2e2;
}

.btn-primary {
    background: var(--theme-red) !important;
    border-color: var(--theme-red) !important;
    color: #fff !important;
}
.btn-primary:hover {
    background: #bf1423 !important;
    border-color: #bf1423 !important;
}
.btn-success,
.btn-info {
    background: #b4232f !important;
    border-color: #b4232f !important;
    color: #fff !important;
}
.btn-success:hover,
.btn-info:hover {
    background: var(--theme-red-dark) !important;
    border-color: var(--theme-red-dark) !important;
}
.btn-secondary {
    border-color: #f1c8ce !important;
    color: #5f1b24 !important;
}
.btn-secondary:hover {
    background: var(--theme-red-soft) !important;
    border-color: #fecdd3 !important;
    color: var(--theme-red-dark) !important;
}

.form-control {
    border-color: #f1c8ce;
}
.form-control:focus {
    border-color: var(--theme-red);
    box-shadow: 0 0 0 3px rgba(220,31,46,.12);
}

.stat-card {
    border-color: var(--theme-line) !important;
    background: #fff !important;
    box-shadow: 0 4px 14px rgba(47,18,22,.06);
}
.stat-card__icon {
    background: #fff1f2 !important;
    color: var(--theme-red) !important;
}
.stat-card__value,
.stat-primary .stat-card__value {
    color: var(--theme-red-dark) !important;
}
.stat-success .stat-card__icon {
    background: #ecfdf5 !important;
    color: #15803d !important;
}
.stat-warning .stat-card__icon {
    background: #fff7ed !important;
    color: #c2410c !important;
}
.stat-danger .stat-card__icon {
    background: #fff1f2 !important;
    color: var(--theme-red-dark) !important;
}

.main-content .table {
    border-collapse: collapse;
    border: 1px solid var(--theme-line);
}
.main-content .table th,
.main-content .table td {
    border: 1px solid #edd1d6;
}
.main-content .table th {
    background: #fff1f2;
    color: #5f1b24;
}
.main-content .table tbody tr:nth-child(even) td {
    background: #fffafa;
}
.main-content .table tbody tr:last-child td {
    border-bottom-color: #edd1d6;
}
.main-content .table tbody tr:hover td {
    background: #fff1f2;
}
.main-content .table tfoot td {
    background: #fff7f8 !important;
    border-color: #edd1d6 !important;
}
.table-wrap,
[id$="Pagination"] {
    border-top-color: var(--theme-line) !important;
}

.pay-cash,
.pay-qr,
.pay-card,
.pay-credit,
.badge-receipt {
    border: 1px solid #fecdd3;
}
.pay-card {
    background: #f8fafc !important;
    color: #475569 !important;
}
.pay-qr {
    background: #fff1f2 !important;
    color: var(--theme-red-dark) !important;
}
.pay-cash {
    background: #ecfdf5 !important;
    color: #15803d !important;
}
.pay-credit {
    background: #fff7ed !important;
    color: #9a3412 !important;
}

.vp-empty,
.expense-empty,
.personal-empty,
.tp-empty,
.ts-empty {
    color: #9f5b63 !important;
}

#printPreviewBody,
.print-preview-body {
    background: #fff1f2 !important;
}

/* Report page */
#statCashOut,
#statCashOutCount,
#paymentSummaryCards [id^="ps"] {
    color: var(--theme-red-dark) !important;
}
#orderTableBody td:first-child {
    color: var(--theme-red-dark) !important;
}
#orderTableBody td:nth-child(2) span[style*="background:#eef2ff"] {
    background: #fff1f2 !important;
    color: var(--theme-red-dark) !important;
    border: 1px solid #fecdd3;
}
#paymentSummaryCards > div {
    border-color: #f1c8ce !important;
    background: #fffafa !important;
}
.summary-bar__col {
    background: var(--theme-red) !important;
}
.note-preset-chip {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 99px;
    background: #fff7f8;
    border: 1px solid #f1c8ce;
    color: var(--theme-red-dark);
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.35;
}

/* Stock pages */
.stock-search i {
    color: #b4232f !important;
}
.stock-stats .stat-success .stat-card__icon,
.ls-stats .stat-success .stat-card__icon {
    background: #ecfdf5 !important;
    color: #15803d !important;
}
.stock-stats .stat-warning .stat-card__icon,
.ls-stats .stat-warning .stat-card__icon {
    background: #fff7ed !important;
    color: #c2410c !important;
}
.stock-stats .stat-danger .stat-card__icon,
.ls-stats .stat-danger .stat-card__icon {
    background: #fff1f2 !important;
    color: var(--theme-red-dark) !important;
}
.qty-input-wrap button {
    border-color: #f1c8ce !important;
    color: #5f1b24 !important;
}
.qty-input-wrap button:hover {
    background: #fff1f2 !important;
    color: var(--theme-red-dark) !important;
}
.relation-row:hover {
    background: #fff1f2 !important;
}
.relation-qty-badge,
.log-adjust,
.btn-relation[style],
.col-relation div[style*="var(--info-light)"] {
    background: #fff1f2 !important;
    color: var(--theme-red-dark) !important;
    border-color: #fecdd3 !important;
}
.btn-relation[style]:hover {
    background: #ffe4e8 !important;
    border-color: var(--theme-red) !important;
}
#importDropZone {
    border-color: #f1c8ce !important;
    background: #fff7f8 !important;
}
#importDropZone i {
    color: var(--theme-red) !important;
}
#importFileName,
#importSummaryBar {
    background: #fff7f8 !important;
    border-color: #f1c8ce !important;
    color: #5f1b24 !important;
}

/* Stock receipt */
.sr-barcode-input {
    border-color: var(--theme-red) !important;
    background: #fff7f8 !important;
}
.sr-tax-summary,
.sr-invoice-scan,
.sr-footer,
#srRelationListBody {
    border-color: var(--theme-line) !important;
    background: #fffafa !important;
}
.sr-invoice-scan__title,
.sr-tax-summary__item--total strong {
    color: var(--theme-red-dark) !important;
}
.vendor-badge,
.badge-receipt {
    background: #fff1f2 !important;
    color: var(--theme-red-dark) !important;
    border: 1px solid #fecdd3;
}
.sr-dropdown-item:hover,
.sr-card {
    background: #fffafa !important;
}
.sr-card {
    border-color: var(--theme-line) !important;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(47,18,22,.07);
}
.sr-nonstock-pill,
.sr-type-badge--nonstock {
    background: #fff7ed !important;
    color: #9a3412 !important;
    border-color: #fed7aa !important;
}
.sr-type-badge--stock {
    background: #ecfdf5 !important;
    color: #15803d !important;
}
#btnUploadInvoice[style],
.btn-hist-edit[style],
.btn-warning[style] {
    background: #fff7ed !important;
    border-color: #fed7aa !important;
    color: #9a3412 !important;
}
#btnUploadInvoice[style] {
    background: #b4232f !important;
    border-color: #b4232f !important;
    color: #fff !important;
}

/* Low stock */
.ls-tabs button {
    border-color: #f1c8ce !important;
}
.ls-tabs button:hover,
.ls-tabs button.active-all {
    border-color: var(--theme-red) !important;
    color: var(--theme-red-dark) !important;
    background: var(--theme-red-soft) !important;
}
.ls-tabs button.active-low,
.ls-status--low {
    border-color: #fed7aa !important;
    color: #9a3412 !important;
    background: #fff7ed !important;
}
.ls-tabs button.active-out,
.ls-status--out {
    border-color: #fecdd3 !important;
    color: var(--theme-red-dark) !important;
    background: #fff1f2 !important;
}
.ls-status--out .ls-status__dot {
    background: var(--theme-red) !important;
}
.ls-status--low .ls-status__dot {
    background: #c2410c !important;
}

/* Vendor and customer pages */
.vendor-search i,
.search-bar i {
    color: #b4232f !important;
}
.vendor-avatar,
.cust-card__code {
    background: #fff1f2 !important;
    color: var(--theme-red-dark) !important;
    border: 1px solid #fecdd3;
}
.badge-active {
    background: #ecfdf5 !important;
    color: #15803d !important;
    border: 1px solid #bbf7d0;
}
.badge-inactive {
    background: #f8fafc !important;
    color: #64748b !important;
    border: 1px solid #e2e8f0;
}
.detail-section__title {
    border-bottom-color: #fee2e2 !important;
    color: #9f5b63 !important;
}
.detail-row {
    border-bottom-color: #fff1f2 !important;
}
.detail-row__value {
    color: var(--theme-ink) !important;
}
.cust-card {
    border-color: var(--theme-line) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(47,18,22,.06) !important;
}
.cust-card:hover {
    border-color: var(--theme-red) !important;
    box-shadow: 0 10px 24px rgba(220,31,46,.14) !important;
}
.cust-card__name {
    color: var(--theme-ink) !important;
}
.cust-card__info i {
    color: #b4232f !important;
}
.search-bar {
    border-color: var(--theme-line) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(47,18,22,.05);
}
.search-bar:focus-within {
    border-color: var(--theme-red) !important;
    box-shadow: 0 0 0 3px rgba(220,31,46,.12);
}
.modal-form .form-group input,
.modal-form .form-group textarea {
    border-color: #f1c8ce !important;
}
.modal-form .form-group input:focus,
.modal-form .form-group textarea:focus {
    border-color: var(--theme-red) !important;
    box-shadow: 0 0 0 3px rgba(220,31,46,.12) !important;
}
.empty-state,
.table-empty {
    color: #9f5b63 !important;
}
.recent-orders-table .recent-order-items {
    min-width: 260px;
    max-width: 520px;
    color: var(--gray-700);
    font-size: .9rem;
}
.report-order-items {
    min-width: 240px;
    max-width: 420px;
    color: var(--gray-700);
    font-size: .86rem;
    line-height: 1.45;
    white-space: normal;
}
.recent-order-item-line {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    padding: 4px 0;
    line-height: 1.35;
    border-bottom: 1px dashed #d9b8bd;
}
.recent-order-item-line:first-child { padding-top: 0; }
.recent-order-item-line:last-child { padding-bottom: 4px; }
.recent-order-item-line .recent-order-name,
.recent-order-item-line .recent-order-qty {
    min-width: 0;
    font-weight: 600;
    white-space: normal;
    overflow-wrap: anywhere;
}
.recent-order-item-line .recent-order-name {
    flex: 1 1 auto;
    color: var(--gray-800);
}
.recent-order-item-line .recent-order-qty {
    flex: 0 0 auto;
    margin-left: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #16a34a;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}
.recent-order-item-more,
.recent-order-item-empty {
    color: #9f5b63;
    font-size: .82rem;
}

/* Theme toggle */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 34px;
    padding: 6px 11px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,.28);
    background: rgba(255,255,255,.16);
    color: #fff;
    font-family: inherit;
    font-size: .84rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s, border-color .15s, color .15s;
}
.theme-toggle:hover {
    background: rgba(255,255,255,.24);
    border-color: rgba(255,255,255,.44);
}
.theme-toggle i {
    color: currentColor !important;
}
.login-theme-toggle {
    position: fixed;
    top: 18px;
    right: 18px;
    z-index: 20;
    border-color: rgba(220,31,46,.18);
    background: #fff;
    color: #a70f1c;
    box-shadow: 0 6px 18px rgba(47,18,22,.10);
}
.login-theme-toggle:hover {
    background: #fff1f2;
    border-color: #fecdd3;
    color: #dc1f2e;
}

/* Dark mode */
html[data-theme="dark"] {
    color-scheme: dark;
    --theme-red: #22c55e;
    --theme-red-dark: #4ade80;
    --theme-red-soft: #052e1b;
    --theme-red-soft-2: #0b3b24;
    --theme-line: #334155;
    --theme-ink: #e5e7eb;
    --theme-card: #111827;
    --account-red: var(--theme-red);
    --account-red-dark: var(--theme-red-dark);
    --account-red-soft: var(--theme-red-soft);
    --account-line: var(--theme-line);
    --account-ink: var(--theme-ink);
    --stock-red: var(--theme-red);
    --stock-red-dark: var(--theme-red-dark);
    --stock-red-soft: var(--theme-red-soft);
    --stock-red-soft-2: var(--theme-red-soft-2);
    --stock-line: var(--theme-line);
    --stock-ink: var(--theme-ink);
    --primary: #22c55e;
    --primary-dark: #4ade80;
    --primary-light: #052e1b;
    --white: #111827;
    --gray-50: #0b1120;
    --gray-100: #111827;
    --gray-200: #1f2937;
    --gray-300: #374151;
    --gray-400: #94a3b8;
    --gray-500: #a7b0be;
    --gray-600: #cbd5e1;
    --gray-700: #e2e8f0;
    --gray-800: #f8fafc;
    --gray-900: #ffffff;
    --success: #22c55e;
    --success-light: #052e1b;
    --danger: #f43f5e;
    --danger-light: #3f111b;
    --warning: #f59e0b;
    --warning-light: #3b2607;
    --info: #38bdf8;
    --info-light: #082f49;
}

html[data-theme="dark"] body,
html[data-theme="dark"] body.app-wrapper {
    background:
        linear-gradient(180deg, #0b1120 0, #0f172a 190px),
        #0f172a !important;
    color: var(--theme-ink) !important;
}
html[data-theme="dark"] body.login-page {
    background:
        linear-gradient(180deg, #0b1120 0, #0f172a 190px),
        radial-gradient(circle at 12% 22%, rgba(34,197,94,.12), transparent 34%),
        #0f172a !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] .login-brand {
    background: #111827 !important;
    border: 1px solid #334155 !important;
    box-shadow: none !important;
}
html[data-theme="dark"] .login-brand::after {
    border-color: rgba(34,197,94,.16) !important;
}
html[data-theme="dark"] .login-brand__icon {
    background: #052e1b !important;
    color: #4ade80 !important;
}
html[data-theme="dark"] .login-brand p,
html[data-theme="dark"] .login-brand__hero span,
html[data-theme="dark"] .login-stat span {
    color: #a7b0be !important;
}
html[data-theme="dark"] .login-stat {
    background: #1f2937 !important;
    border-color: #334155 !important;
}
html[data-theme="dark"] .login-card {
    background: #111827 !important;
    border-color: #334155 !important;
    box-shadow: none !important;
}
html[data-theme="dark"] .login-card h2,
html[data-theme="dark"] .login-brand h1,
html[data-theme="dark"] .login-brand__hero strong,
html[data-theme="dark"] .login-stat strong,
html[data-theme="dark"] .form-label {
    color: #f8fafc !important;
}
html[data-theme="dark"] .login-card__eyebrow,
html[data-theme="dark"] .login-card .text-muted,
html[data-theme="dark"] .remember-row,
html[data-theme="dark"] .secure-note,
html[data-theme="dark"] .login-footer {
    color: #a7b0be !important;
}
html[data-theme="dark"] .input-icon-wrap .form-control,
html[data-theme="dark"] body.login-page .form-control {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] .input-icon,
html[data-theme="dark"] .input-icon-right {
    color: #94a3b8 !important;
}
html[data-theme="dark"] .login-theme-toggle {
    background: #1f2937 !important;
    border-color: #334155 !important;
    color: #e5e7eb !important;
    box-shadow: none !important;
}

html[data-theme="dark"] .qnav,
html[data-theme="dark"] .navbar {
    background: #111827 !important;
    border-bottom-color: #334155 !important;
    box-shadow: none !important;
}
html[data-theme="dark"] .qnav__brand,
html[data-theme="dark"] .navbar__brand {
    color: #f8fafc !important;
}
html[data-theme="dark"] .qnav__brand i,
html[data-theme="dark"] .navbar__brand i {
    background: transparent !important;
    color: #4ade80 !important;
}
html[data-theme="dark"] .qnav__time,
html[data-theme="dark"] .qnav__user,
html[data-theme="dark"] .navbar__time,
html[data-theme="dark"] .navbar__user,
html[data-theme="dark"] .theme-toggle {
    background: #1f2937 !important;
    border-color: #334155 !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] .theme-toggle:hover,
html[data-theme="dark"] .qnav__user:hover,
html[data-theme="dark"] .navbar__user:hover {
    background: #263244 !important;
    border-color: #22c55e !important;
}
html[data-theme="dark"] .qnav__dropdown,
html[data-theme="dark"] #navDropdown {
    background: #111827 !important;
    border-color: #334155 !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.36) !important;
}
html[data-theme="dark"] .qnav__dropdown-header,
html[data-theme="dark"] #navDropdown > div:first-child {
    background: #0f172a !important;
    border-bottom-color: #334155 !important;
}
html[data-theme="dark"] #qNavNameFull,
html[data-theme="dark"] #navUserNameFull {
    color: #f8fafc !important;
}

html[data-theme="dark"] .qsidebar {
    background: #111827 !important;
    border-right-color: #334155 !important;
    box-shadow: 8px 0 22px rgba(0,0,0,.22) !important;
}
html[data-theme="dark"] .qsidebar::before {
    background:
        linear-gradient(180deg, rgba(34,197,94,.07), transparent 36%),
        radial-gradient(circle at 18% 8%, rgba(34,197,94,.10), transparent 26%);
}
html[data-theme="dark"] .qsidebar::after {
    background: linear-gradient(180deg, transparent, rgba(34,197,94,.38), transparent);
}
html[data-theme="dark"] .qsidebar__brand,
html[data-theme="dark"] .qsidebar__brand i,
html[data-theme="dark"] .qsidebar__group-left i,
html[data-theme="dark"] .qsidebar__group-chevron,
html[data-theme="dark"] .qsidebar__sublink-dot {
    color: #22c55e !important;
}
html[data-theme="dark"] .qsidebar__link,
html[data-theme="dark"] .qsidebar__group-btn,
html[data-theme="dark"] .qsidebar__sublink {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .qsidebar__link:hover,
html[data-theme="dark"] .qsidebar__group-btn:hover,
html[data-theme="dark"] .qsidebar__sublink:hover,
html[data-theme="dark"] .qsidebar__link.active,
html[data-theme="dark"] .qsidebar__sublink.active {
    background: #052e1b !important;
    color: #bbf7d0 !important;
    box-shadow: inset 0 0 0 1px rgba(34,197,94,.14), 0 8px 18px rgba(0,0,0,.18);
}
html[data-theme="dark"] .qsidebar__link.active::before,
html[data-theme="dark"] .qsidebar__sublink.active::before {
    background: #22c55e !important;
    box-shadow: 0 0 12px rgba(34,197,94,.55);
}
html[data-theme="dark"] .qsidebar__divider,
html[data-theme="dark"] .qsidebar__footer {
    border-color: #334155 !important;
    background: #334155 !important;
}
html[data-theme="dark"] .qsidebar__divider::after {
    background: linear-gradient(90deg, transparent, rgba(34,197,94,.38), transparent);
}
html[data-theme="dark"] .qsidebar__user-card {
    background: #0f172a !important;
    border-color: #334155 !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.18);
}
html[data-theme="dark"] .qsidebar__user-card:hover {
    border-color: #22c55e !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.26);
}
html[data-theme="dark"] .qsidebar__uname {
    color: #f8fafc !important;
}

html[data-theme="dark"] .qpage-body,
html[data-theme="dark"] .main-content,
html[data-theme="dark"] .pos-layout {
    background:
        linear-gradient(135deg, rgba(34,197,94,.08), transparent 38%),
        #0f172a !important;
}
html[data-theme="dark"] .page-header,
html[data-theme="dark"] .card,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .market-lane,
html[data-theme="dark"] .pos-cart,
html[data-theme="dark"] .cust-card,
html[data-theme="dark"] .search-bar,
html[data-theme="dark"] .sr-card {
    background: #111827 !important;
    border-color: #334155 !important;
    box-shadow: none !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] .card__body,
html[data-theme="dark"] .modal__body,
html[data-theme="dark"] .modal__footer,
html[data-theme="dark"] .pos-cart__items,
html[data-theme="dark"] #cartItems {
    background: #111827 !important;
}
html[data-theme="dark"] .modal__header,
html[data-theme="dark"] .pos-cart__search,
html[data-theme="dark"] .pos-cart__footer,
html[data-theme="dark"] .recent-orders-section,
html[data-theme="dark"] .customer-lane__box {
    background: #0f172a !important;
    border-color: #334155 !important;
}
html[data-theme="dark"] .page-header h1,
html[data-theme="dark"] .page-header h2,
html[data-theme="dark"] .page-title,
html[data-theme="dark"] .card__title,
html[data-theme="dark"] .modal__title,
html[data-theme="dark"] .market-lane__title strong,
html[data-theme="dark"] .pos-cart__title,
html[data-theme="dark"] .cust-card__name,
html[data-theme="dark"] .cart-item__name,
html[data-theme="dark"] .product-card__name {
    color: #f8fafc !important;
}
html[data-theme="dark"] .page-subtitle,
html[data-theme="dark"] .stat-card__label,
html[data-theme="dark"] .cust-card__info,
html[data-theme="dark"] .summary-label,
html[data-theme="dark"] .summary-value,
html[data-theme="dark"] .table-empty,
html[data-theme="dark"] .empty-state {
    color: #a7b0be !important;
}
html[data-theme="dark"] .page-header i,
html[data-theme="dark"] .page-title i,
html[data-theme="dark"] .modal__title i,
html[data-theme="dark"] .card h3 i {
    color: #22c55e !important;
}

html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-success,
html[data-theme="dark"] .btn-info,
html[data-theme="dark"] .btn-pay-cash,
html[data-theme="dark"] #btnSelectCustomer,
html[data-theme="dark"] #btnUploadInvoice[style] {
    background: #22c55e !important;
    border-color: #22c55e !important;
    color: #052e1b !important;
    box-shadow: none !important;
}
html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-success:hover,
html[data-theme="dark"] .btn-info:hover,
html[data-theme="dark"] .btn-pay-cash:hover,
html[data-theme="dark"] #btnSelectCustomer:hover {
    background: #4ade80 !important;
    border-color: #4ade80 !important;
}
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-ghost,
html[data-theme="dark"] .cat-tab,
html[data-theme="dark"] .numpad-btn,
html[data-theme="dark"] .btn-paymethod {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] .cat-tab.active,
html[data-theme="dark"] .cat-tab:hover,
html[data-theme="dark"] .btn-secondary:hover {
    background: #052e1b !important;
    border-color: #22c55e !important;
    color: #bbf7d0 !important;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .sr-inline,
html[data-theme="dark"] .price-input,
html[data-theme="dark"] .qty-input,
html[data-theme="dark"] .stock-qty-input,
html[data-theme="dark"] .search-bar input {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] .sr-inline:focus {
    border-color: #22c55e !important;
    box-shadow: 0 0 0 3px rgba(34,197,94,.18) !important;
}
html[data-theme="dark"] ::placeholder {
    color: #64748b !important;
}

html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .product-card {
    background: #111827 !important;
    border-color: #334155 !important;
    box-shadow: none !important;
}
html[data-theme="dark"] .stat-card__icon,
html[data-theme="dark"] .product-card__price,
html[data-theme="dark"] .cust-card__code,
html[data-theme="dark"] .vendor-avatar,
html[data-theme="dark"] .badge-receipt {
    background: #052e1b !important;
    color: #bbf7d0 !important;
    border-color: #22c55e !important;
}
html[data-theme="dark"] .stat-card__value,
html[data-theme="dark"] #sumTotal,
html[data-theme="dark"] .cart-item__total,
html[data-theme="dark"] #paymentSummaryCards [id^="ps"] {
    color: #4ade80 !important;
}
html[data-theme="dark"] #paymentSummaryCards > div {
    background: #111827 !important;
    border-color: #334155 !important;
    box-shadow: none !important;
}
html[data-theme="dark"] #paymentSummaryCards > div:nth-child(1) {
    border-left: 4px solid #38bdf8 !important;
}
html[data-theme="dark"] #paymentSummaryCards > div:nth-child(2) {
    border-left: 4px solid #facc15 !important;
}
html[data-theme="dark"] #paymentSummaryCards > div:nth-child(3) {
    border-left: 4px solid #fb7185 !important;
}
html[data-theme="dark"] #paymentSummaryCards > div:nth-child(4) {
    border-left: 4px solid #22c55e !important;
}
html[data-theme="dark"] #paymentSummaryCards > div > div:first-child {
    color: #e5e7eb !important;
}
html[data-theme="dark"] #paymentSummaryCards [id$="Count"],
html[data-theme="dark"] #paymentSummaryCards > div > div:last-child:not([id]) {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .main-content .table {
    border-color: #334155 !important;
}
html[data-theme="dark"] .main-content .table th,
html[data-theme="dark"] .main-content .table td {
    border-color: #334155 !important;
    color: #e5e7eb;
}
html[data-theme="dark"] .main-content .table th,
html[data-theme="dark"] .cart-line-head {
    background: #0b1120 !important;
    color: #f8fafc !important;
}
html[data-theme="dark"] .main-content .table tbody tr:nth-child(even) td,
html[data-theme="dark"] .main-content .table tbody tr:nth-child(odd) td {
    background: #111827 !important;
}
html[data-theme="dark"] .main-content .table tbody tr:hover td,
html[data-theme="dark"] .pos-cart__items > div:not(.cart-empty):hover {
    background: #1f2937 !important;
}
html[data-theme="dark"] .main-content .table tfoot td {
    background: #0b1120 !important;
    border-color: #334155 !important;
}
html[data-theme="dark"] #cartItems > div[data-id] {
    background: #111827 !important;
    border-bottom-color: #334155 !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] #cartItems > div[data-id]:nth-child(even) {
    background: #0f172a !important;
}
html[data-theme="dark"] #cartItems > div[data-id]:hover {
    background: #1f2937 !important;
}
html[data-theme="dark"] #cartItems .cart-item__name {
    color: #f8fafc !important;
    text-shadow: none !important;
}
html[data-theme="dark"] #cartItems img {
    background: #f8fafc !important;
    border: 1px solid #334155;
}
html[data-theme="dark"] #cartItems .qty-input {
    background: #0b1120 !important;
    border: 1px solid #334155 !important;
    border-radius: 6px !important;
    color: #f8fafc !important;
}
html[data-theme="dark"] #cartItems .btn-qty-minus,
html[data-theme="dark"] #cartItems .btn-qty-plus {
    background: #111827 !important;
    border-color: #64748b !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] #cartItems .btn-qty-minus:hover,
html[data-theme="dark"] #cartItems .btn-qty-plus:hover {
    background: #052e1b !important;
    border-color: #22c55e !important;
    color: #bbf7d0 !important;
}
html[data-theme="dark"] #cartItems .price-input {
    background: #0b1120 !important;
    border-color: #64748b !important;
    color: #f8fafc !important;
}
html[data-theme="dark"] #cartItems .price-input:focus {
    border-color: #22c55e !important;
    box-shadow: 0 0 0 3px rgba(34,197,94,.18) !important;
}
html[data-theme="dark"] #cartItems .cart-item__total {
    color: #4ade80 !important;
}
html[data-theme="dark"] #cartItems .btn-cart-remove {
    background: transparent !important;
    color: #fb7185 !important;
    opacity: 1 !important;
}
html[data-theme="dark"] #cartItems .btn-cart-remove:hover {
    background: #3f111b !important;
    color: #fecdd3 !important;
}
html[data-theme="dark"] .recent-orders-section .table-wrap {
    border: 1px solid #334155 !important;
    border-radius: 0 0 8px 8px;
    overflow: hidden;
}
html[data-theme="dark"] .recent-orders-section .table {
    border-collapse: collapse !important;
    border: 1px solid #334155 !important;
}
html[data-theme="dark"] .recent-orders-section .table th,
html[data-theme="dark"] .recent-orders-section .table td {
    border: 1px solid #334155 !important;
}
html[data-theme="dark"] .recent-orders-section .table th {
    background: #0b1120 !important;
    color: #f8fafc !important;
}
html[data-theme="dark"] .recent-orders-section .table tbody tr:nth-child(odd) td {
    background: #111827 !important;
}
html[data-theme="dark"] .recent-orders-section .table tbody tr:nth-child(even) td {
    background: #0f172a !important;
}
html[data-theme="dark"] .recent-orders-section .table tbody tr:hover td {
    background: #1f2937 !important;
}
html[data-theme="dark"] .recent-orders-section .recent-order-items {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .report-order-items {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .recent-orders-section .recent-order-item-line .recent-order-name {
    color: #e5e7eb !important;
}
html[data-theme="dark"] .report-order-items .recent-order-item-line .recent-order-name {
    color: #e5e7eb !important;
}
html[data-theme="dark"] .recent-orders-section .recent-order-item-line .recent-order-qty {
    color: #22c55e !important;
}
html[data-theme="dark"] .report-order-items .recent-order-item-line .recent-order-qty {
    color: #22c55e !important;
}
html[data-theme="dark"] .recent-orders-section .recent-order-item-line {
    border-bottom-color: #94a3b8 !important;
}
html[data-theme="dark"] .report-order-items .recent-order-item-line {
    border-bottom-color: #94a3b8 !important;
}
html[data-theme="dark"] .recent-orders-section .recent-order-item-more,
html[data-theme="dark"] .recent-orders-section .recent-order-item-empty {
    color: #94a3b8 !important;
}
html[data-theme="dark"] .stock-table .col-name span,
html[data-theme="dark"] .stock-table .col-name span[style],
html[data-theme="dark"] .stock-table .col-price,
html[data-theme="dark"] .stock-table .col-price[style],
html[data-theme="dark"] #relationProductName,
html[data-theme="dark"] #relationListBody span[style*="var(--gray-800)"] {
    color: #f8fafc !important;
}
html[data-theme="dark"] .stock-table .col-name div[style*="var(--gray-400)"],
html[data-theme="dark"] .stock-table .col-barcode span,
html[data-theme="dark"] .stock-table .col-price div[style*="var(--gray-400)"],
html[data-theme="dark"] #relationListBody span[style*="var(--gray-400)"] {
    color: #a7b0be !important;
}
html[data-theme="dark"] .stock-table .btn-copy-name,
html[data-theme="dark"] .stock-table .btn-copy-barcode {
    color: #93c5fd !important;
}
html[data-theme="dark"] .stock-table img,
html[data-theme="dark"] .stock-table .col-img > div {
    background: #f8fafc !important;
    border: 1px solid #334155;
}
html[data-theme="dark"] .badge-gray {
    background: #e2e8f0 !important;
    color: #0f172a !important;
}
html[data-theme="dark"] .stock-status.status-out,
html[data-theme="dark"] .status-out {
    color: #fb7185 !important;
}
html[data-theme="dark"] .stock-status.status-low,
html[data-theme="dark"] .status-low {
    color: #fbbf24 !important;
}
html[data-theme="dark"] .stock-status.status-ok,
html[data-theme="dark"] .status-ok {
    color: #4ade80 !important;
}
html[data-theme="dark"] .sr-tax-summary {
    background: #0b1120 !important;
    border-color: #334155 !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, .06);
}
html[data-theme="dark"] .sr-tax-summary__item {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .sr-tax-summary__item strong {
    color: #e5e7eb !important;
}
html[data-theme="dark"] .sr-tax-summary__item--total strong {
    color: #4ade80 !important;
}
html[data-theme="dark"] .sr-tax-summary__item--vat strong {
    color: #fbbf24 !important;
}
html[data-theme="dark"] .sr-footer {
    background: #0b1120 !important;
    border: 1px solid #334155 !important;
    border-radius: 8px;
    padding: 12px !important;
    margin-top: 10px !important;
}
html[data-theme="dark"] .sr-footer .form-label {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] #srUpdateCost {
    background: #111827 !important;
    border-color: #475569 !important;
    color: #f8fafc !important;
}
html[data-theme="dark"] #btnSrSave:disabled {
    background: #14532d !important;
    border-color: #166534 !important;
    color: #86efac !important;
    opacity: .78;
}
html[data-theme="dark"] #srBarcodeDropdown {
    background: #0b1120 !important;
    border-color: #22c55e !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .36) !important;
}
html[data-theme="dark"] #srBarcodeDropdown .sr-dropdown-item {
    background: #111827 !important;
    border-bottom-color: #334155 !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] #srBarcodeDropdown .sr-dropdown-item:nth-child(even) {
    background: #0f172a !important;
}
html[data-theme="dark"] #srBarcodeDropdown .sr-dropdown-item:hover {
    background: #1f2937 !important;
}
html[data-theme="dark"] #srBarcodeDropdown .sr-drop-name {
    color: #f8fafc !important;
}
html[data-theme="dark"] #srBarcodeDropdown .sr-drop-bc {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] #srBarcodeDropdown .sr-drop-bc strong[style*="color:#b45309"] {
    color: #fbbf24 !important;
}
html[data-theme="dark"] #srBarcodeDropdown .sr-drop-bc strong[style*="var(--primary)"] {
    color: #22c55e !important;
}

html[data-theme="dark"] .pay-qr,
html[data-theme="dark"] .pay-card,
html[data-theme="dark"] .pay-credit,
html[data-theme="dark"] .pay-cash,
html[data-theme="dark"] .badge-active,
html[data-theme="dark"] .badge-inactive,
html[data-theme="dark"] .ls-status,
html[data-theme="dark"] .relation-qty-badge,
html[data-theme="dark"] .btn-relation[style],
html[data-theme="dark"] .sr-nonstock-pill,
html[data-theme="dark"] .sr-type-badge,
html[data-theme="dark"] .vendor-badge {
    background: #052e1b !important;
    color: #bbf7d0 !important;
    border-color: #166534 !important;
}

html[data-theme="dark"] .cart-empty,
html[data-theme="dark"] .product-empty,
html[data-theme="dark"] .swal2-popup {
    background: #111827 !important;
    color: #e5e7eb !important;
}
html[data-theme="dark"] .note-preset-chip {
    background: #0b1120 !important;
    border-color: #334155 !important;
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .note-preset-chip:hover {
    background: #1f2937 !important;
    border-color: #22c55e !important;
    color: #bbf7d0 !important;
}
html[data-theme="dark"] .swal2-title,
html[data-theme="dark"] .swal2-html-container {
    color: #e5e7eb !important;
}

/* VAT summary page */
html[data-theme="dark"] .vp-section {
    background: #111827 !important;
    border-color: #334155 !important;
    box-shadow: none !important;
}
html[data-theme="dark"] .vp-section--output {
    border-left: 4px solid #38bdf8 !important;
}
html[data-theme="dark"] .vp-section--input {
    border-left: 4px solid #22c55e !important;
}
html[data-theme="dark"] .vp-section__head,
html[data-theme="dark"] .vp-section--output .vp-section__head,
html[data-theme="dark"] .vp-section--input .vp-section__head {
    background: #0b1120 !important;
    color: #f8fafc !important;
}
html[data-theme="dark"] .vp-section__head .icon,
html[data-theme="dark"] .vp-section--output .icon,
html[data-theme="dark"] .vp-section--input .icon {
    background: #052e1b !important;
    color: #bbf7d0 !important;
    border: 1px solid #166534 !important;
}
html[data-theme="dark"] .vp-section__head div[style*="color:#3b82f6"],
html[data-theme="dark"] .vp-section__head div[style*="color:#16a34a"],
html[data-theme="dark"] .vp-section__head span[style*="color:#22c55e"] {
    color: #94a3b8 !important;
}
html[data-theme="dark"] .vp-section__body {
    border-top-color: #334155 !important;
}
html[data-theme="dark"] .vp-cell {
    border-right-color: #334155 !important;
}
html[data-theme="dark"] .vp-cell__label,
html[data-theme="dark"] .vp-cell__sub {
    color: #94a3b8 !important;
}
html[data-theme="dark"] .vp-cell__value {
    color: #f8fafc !important;
}
html[data-theme="dark"] .vp-cell__value[style*="color:#1d4ed8"] {
    color: #60a5fa !important;
}
html[data-theme="dark"] .vp-cell__value[style*="color:#16a34a"] {
    color: #22c55e !important;
}
html[data-theme="dark"] .vp-net {
    background: #111827 !important;
    border-color: #334155 !important;
    box-shadow: none !important;
}
html[data-theme="dark"] .vp-net--pay {
    border-left: 4px solid #fb7185 !important;
}
html[data-theme="dark"] .vp-net--refund {
    border-left: 4px solid #22c55e !important;
}
html[data-theme="dark"] .vp-net--zero {
    border-left: 4px solid #94a3b8 !important;
}
html[data-theme="dark"] .vp-net__label {
    color: #e5e7eb !important;
}
html[data-theme="dark"] .vp-net__label + div,
html[data-theme="dark"] .vp-net div[style*="color:var(--gray-500)"] {
    color: #94a3b8 !important;
}
html[data-theme="dark"] .vp-net__badge {
    background: #0b1120 !important;
    border: 1px solid #334155 !important;
}
html[data-theme="dark"] .vp-net--pay .vp-net__badge {
    color: #fecdd3 !important;
}
html[data-theme="dark"] .vp-net--refund .vp-net__badge {
    color: #bbf7d0 !important;
}
html[data-theme="dark"] .vp-net--zero .vp-net__badge {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .vp-planner {
    background: #111827 !important;
    border-color: #334155 !important;
    border-left-color: #f59e0b !important;
}
html[data-theme="dark"] .vp-planner__head {
    background: #0b1120 !important;
    border-bottom-color: #334155 !important;
}
html[data-theme="dark"] .vp-planner__title {
    color: #f8fafc !important;
}
html[data-theme="dark"] .vp-planner__sub,
html[data-theme="dark"] .vp-planner-grid label,
html[data-theme="dark"] .vp-planner-check {
    color: #cbd5e1 !important;
}
html[data-theme="dark"] .vp-planner-grid .form-control,
html[data-theme="dark"] #vpTargetPayment,
html[data-theme="dark"] #vpTargetVat,
html[data-theme="dark"] #vpTargetTolerance,
html[data-theme="dark"] #vpTargetMaxBills {
    background: #0b1120 !important;
    border-color: #475569 !important;
    color: #f8fafc !important;
}
html[data-theme="dark"] .vp-plan-stat,
html[data-theme="dark"] .vp-plan-match {
    background: #0f172a !important;
    border-color: #334155 !important;
}
html[data-theme="dark"] .vp-plan-stat span {
    color: #94a3b8 !important;
}
html[data-theme="dark"] .vp-plan-stat strong,
html[data-theme="dark"] .vp-plan-match__title {
    color: #f8fafc !important;
}
html[data-theme="dark"] .vp-plan-pill {
    background: #052e1b !important;
    color: #bbf7d0 !important;
    border: 1px solid #166534 !important;
}
html[data-theme="dark"] .vp-plan-line {
    background: #111827 !important;
    border-color: #334155 !important;
    color: #cbd5e1 !important;
}