/*
 * Blockator theme layer.
 * Loaded after isolated component styles so one consistent palette covers the
 * complete authenticated application, public pages, dialogs and mobile shell.
 */

html[data-theme="dark"] {
    --ink-950: #f8fafc;
    --ink-900: #edf3fb;
    --ink-800: #d6e0ed;
    --ink-700: #bdcada;
    --ink-600: #9aabc0;
    --ink-500: #7d8fa8;
    --ink-400: #61738d;
    --surface: #0b1220;
    --surface-raised: #111a2b;
    --surface-soft: #162238;
    --surface-muted: #1c2a42;
    --brand-50: #10254a;
    --brand-100: #163361;
    --brand-200: #28518f;
    --brand-500: #5b93ff;
    --brand-600: #3b82f6;
    --brand-700: #8ab5ff;
    --success-50: #0c2b23;
    --success-600: #6ee7b7;
    --warning-50: #33240d;
    --warning-600: #fbbf6a;
    --danger-50: #35151d;
    --danger-600: #fb7185;
    --border: #26364d;
    --border-strong: #354a67;
    --shadow-sm: 0 0.45rem 1.3rem rgba(0, 0, 0, 0.22);
    --shadow-md: 0 1rem 2.6rem rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 1.7rem 4.5rem rgba(0, 0, 0, 0.38);
    --receipt-ink: var(--ink-950);
    --receipt-text: var(--ink-700);
    --receipt-muted: var(--ink-600);
    --receipt-subtle: var(--ink-400);
    --receipt-border: var(--border);
    --receipt-soft: var(--surface-soft);
    --receipt-brand: var(--brand-600);
    --receipt-brand-strong: var(--brand-700);
    --receipt-brand-soft: var(--brand-50);
    --receipt-brand-border: var(--brand-200);
    color-scheme: dark;
}

html[data-theme="dark"] .categories-page {
    --categories-blue: #60a5fa;
    --categories-ink: var(--ink-950);
}

html[data-theme="dark"] :is(.bill-detail-page, .legal-page, .shared-receipt-page) {
    color: var(--ink-950);
}

html[data-theme="dark"],
html[data-theme="dark"] body {
    background-color: #0b1220;
}

html[data-theme="dark"] body {
    background:
        radial-gradient(circle at 8% 0, rgba(37, 99, 235, 0.17), transparent 30rem),
        radial-gradient(circle at 92% 8%, rgba(14, 165, 233, 0.1), transparent 26rem),
        linear-gradient(180deg, #0b1220 0, #0d1626 48%, #0a111e 100%);
    color: var(--ink-950);
}

html[data-theme="dark"] ::selection {
    background: rgba(96, 165, 250, 0.32);
}

html[data-theme="dark"] a {
    color: #7dd3fc;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    border-color: var(--border-strong);
    background-color: var(--surface-soft);
    color: var(--ink-900);
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: var(--ink-500);
    opacity: 1;
}

html[data-theme="dark"] select option {
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] hr {
    border-color: var(--border);
}

html[data-theme="dark"] :focus-visible {
    outline-color: rgba(96, 165, 250, 0.65);
}

html[data-theme="dark"] .validation-message {
    color: #fda4af;
}

html[data-theme="dark"] .list-pagination button,
html[data-theme="dark"] .status-card,
html[data-theme="dark"] .status-action.secondary {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] .status-card.danger {
    border-color: rgba(251, 113, 133, 0.35);
    background: linear-gradient(160deg, var(--surface-raised), #29141b);
}

/* Application and public shell */
html[data-theme="dark"] :is(.top-bar, .public-top-bar, .app-footer, .public-footer, .mobile-tab-bar) {
    border-color: rgba(100, 116, 139, 0.28);
    background: rgba(11, 18, 32, 0.92);
    box-shadow: 0 0.55rem 1.8rem rgba(0, 0, 0, 0.25);
}

html[data-theme="dark"] :is(.app-shell, .public-shell) {
    background:
        radial-gradient(circle at 12% 5%, rgba(37, 99, 235, 0.14), transparent 27rem),
        radial-gradient(circle at 88% 8%, rgba(14, 165, 233, 0.08), transparent 25rem),
        #0b1220;
}

html[data-theme="dark"] :is(.top-brand-cell, .footer-brand-cell, .public-brand-cell, .welcome-brand-cell) {
    border-color: var(--border-strong);
    background: linear-gradient(180deg, #1c2a42, #111a2b);
    color: var(--ink-900);
    box-shadow: inset 3px 0 var(--brand-500), var(--shadow-sm);
}

html[data-theme="dark"] :is(.public-login-link, .public-google-mark) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] .app-footer::before {
    background: linear-gradient(90deg, var(--brand-500) 0 7rem, var(--border) 7rem 100%);
}

html[data-theme="dark"] .mobile-scan-action > span {
    border-color: #0b1220;
}

html[data-theme="dark"] #blazor-error-ui {
    color-scheme: dark;
    background: #3a2a0c;
    color: #fde68a;
}

html[data-theme="dark"] #blazor-error-ui .reload {
    color: #fdba74;
}

html[data-theme="dark"] #components-reconnect-modal {
    background: var(--surface-raised);
    color: var(--ink-900);
    box-shadow: var(--shadow-lg);
}

html[data-theme="dark"] #components-reconnect-modal::backdrop {
    background: rgba(2, 6, 23, 0.72);
}

/* Account and account categories */
html[data-theme="dark"] :is(
    .account-hero,
    .account-profile-card,
    .account-preferences-card,
    .account-theme-card,
    .account-payment-card,
    .account-menu-card,
    .account-build-card,
    .account-dashboard-customization,
    .account-danger-zone,
    .categories-header,
    .categories-toolbar,
    .categories-list-panel,
    .categories-editor-panel,
    .categories-empty
) {
    border-color: var(--border);
    background-color: rgba(17, 26, 43, 0.97);
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] :is(.account-menu-expandable > summary, .account-preference-link) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(.account-menu-expandable > summary:hover, .account-menu-expandable > summary:focus-visible, .account-menu-expandable[open] > summary, .account-preference-link:hover, .account-preference-link:focus-visible) {
    background: var(--brand-50);
}

html[data-theme="dark"] .account-menu-expanded-content {
    border-color: var(--border);
    background: linear-gradient(180deg, var(--surface-soft), var(--surface-raised));
}

html[data-theme="dark"] :is(.group-scan-destination, .group-scan-check) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(.group-scan-destination:hover, .group-scan-destination.selected) {
    border-color: var(--brand-500);
    background: var(--brand-50);
}

html[data-theme="dark"] .group-scan-destination > input:checked + .group-scan-check {
    border-color: var(--brand-500);
    background: #2563eb;
    color: #fff;
}

html[data-theme="dark"] :is(
    .group-existing-receipts-card,
    .group-existing-receipts-summary,
    .group-bulk-target select,
    .group-bulk-select-all,
    .group-bulk-receipt,
    .group-bulk-receipt-check,
    .group-bulk-pagination button
) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(
    .group-existing-receipts-summary:hover,
    .group-existing-receipts-summary:focus-visible,
    .group-existing-receipts-card[open] > .group-existing-receipts-summary
) {
    background:
        radial-gradient(circle at 88% 20%, rgba(59, 130, 246, 0.2), transparent 10rem),
        linear-gradient(135deg, #111a2b, #0f1b30);
}

html[data-theme="dark"] .group-existing-receipts-summary {
    background:
        radial-gradient(circle at 88% 20%, rgba(59, 130, 246, 0.14), transparent 10rem),
        linear-gradient(135deg, #111a2b, #0f1b30);
}

html[data-theme="dark"] .group-existing-receipts-action {
    border-color: var(--border-strong);
    background: rgba(17, 26, 43, 0.88);
    color: var(--brand-400);
}

html[data-theme="dark"] :is(.group-bulk-receipt:hover, .group-bulk-receipt.selected) {
    border-color: var(--brand-500);
    background: var(--brand-50);
}

html[data-theme="dark"] .group-bulk-receipt > input:checked + .group-bulk-receipt-check {
    border-color: var(--brand-500);
    background: #2563eb;
    color: #fff;
}

html[data-theme="dark"] .group-bulk-empty {
    border-color: var(--border-strong);
    background: var(--surface-soft);
}

html[data-theme="dark"] .account-hero {
    background:
        radial-gradient(circle at 90% 0, rgba(59, 130, 246, 0.18), transparent 17rem),
        linear-gradient(135deg, #111a2b, #0f1b30);
}

html[data-theme="dark"] .categories-header {
    background:
        radial-gradient(circle at 90% 0, rgba(59, 130, 246, 0.18), transparent 17rem),
        linear-gradient(135deg, #111a2b, #0f1b30);
}

html[data-theme="dark"] .categories-header h1 {
    color: var(--ink-950);
}

html[data-theme="dark"] :is(.account-menu-card > a, .account-menu-card > button, .account-menu-card form > button, .account-danger-zone > summary) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(.account-menu-card > a:hover, .account-menu-card > a:focus-visible, .account-menu-card > button:hover, .account-menu-card > button:focus-visible, .account-menu-card form > button:hover, .account-menu-card form > button:focus-visible) {
    background: var(--brand-50);
}

html[data-theme="dark"] .account-danger-zone {
    border-color: rgba(251, 113, 133, 0.34);
}

html[data-theme="dark"] .account-danger-content {
    border-color: rgba(251, 113, 133, 0.3);
    background: #21131a;
}

html[data-theme="dark"] .delete-account-form input {
    border-color: rgba(251, 113, 133, 0.45);
    background: var(--surface-soft);
}

html[data-theme="dark"] :is(.categories-search, .category-row.archived, .categories-hidden-link) {
    background: var(--surface-soft);
}

html[data-theme="dark"] :is(.categories-search:focus-within, .categories-filter-tabs button, .category-row, .categories-icon-grid button, .categories-accent-grid button, .categories-custom-color, .categories-secondary-action) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(.category-row:hover, .category-row.selected) {
    border-color: var(--brand-200);
    background: var(--brand-50);
}

html[data-theme="dark"] .category-group > header > span {
    background: var(--surface-muted);
    color: var(--ink-600);
}

html[data-theme="dark"] .categories-preview {
    background: linear-gradient(145deg, #152238, #0f192a);
}

html[data-theme="dark"] .categories-form-actions {
    border-color: var(--border);
    background: rgba(17, 26, 43, 0.97);
}

/* Dashboard, receipt workspace, groups and manual entry */
html[data-theme="dark"] :is(
    .dashboard-hero,
    .dashboard-metric,
    .dashboard-panel,
    .dashboard-mini-card,
    .dashboard-guest-card,
    .workspace-hero,
    .workspace-search-card,
    .workspace-panel,
    .workspace-guest-card,
    .group-workspace .workspace-hero,
    .group-workspace .workspace-search-card,
    .group-workspace .workspace-panel,
    .group-workspace > .workspace-empty,
    .manual-bill-hero,
    .manual-form-card,
    .manual-guide-card,
    .manual-empty-card
) {
    border-color: var(--border);
    background-color: rgba(17, 26, 43, 0.96);
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] :is(.dashboard-hero, .workspace-hero, .group-workspace .workspace-hero, .manual-bill-hero) {
    background:
        radial-gradient(circle at 90% 0, rgba(59, 130, 246, 0.16), transparent 19rem),
        linear-gradient(135deg, #111a2b, #0f1b30 72%, #10213c);
}

html[data-theme="dark"] :is(.dashboard-secondary-action, .workspace-secondary-action, .workspace-debug-action, .group-workspace .workspace-secondary-action, .manual-secondary-action) {
    border-color: var(--border-strong);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] .bulk-group-panel {
    border-color: var(--brand-200);
    background: linear-gradient(145deg, var(--brand-50), var(--surface-raised) 72%);
}

html[data-theme="dark"] :is(.bulk-group-close, .bulk-group-controls select, .bulk-select-all, .bulk-select-visible, .bulk-bill-selector) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] .bulk-bill-selector:not([aria-pressed="true"]) {
    border-color: var(--brand-500);
    background: var(--brand-50);
    color: var(--brand-700);
}

html[data-theme="dark"] .bulk-bill-selector:not([aria-pressed="true"]):hover {
    border-color: var(--brand-700);
    background: var(--brand-100);
}

html[data-theme="dark"] .bulk-bill-selector[aria-pressed="true"] {
    border-color: var(--brand-500);
    background: #2563eb;
    color: #fff;
}

html[data-theme="dark"] .bulk-bill-selector[aria-pressed="true"]:hover {
    border-color: var(--brand-500);
    background: #1d4ed8;
    color: #fff;
}

html[data-theme="dark"] .bulk-bill-card.selected {
    background: var(--brand-50);
    box-shadow:
        inset 4px 0 0 var(--brand-500),
        0 0 0 2px var(--brand-500),
        0 0.8rem 1.9rem rgba(0, 0, 0, 0.32);
}

@media (max-width: 680px) {
    html[data-theme="dark"] .bulk-bill-card.selection-active {
        border-color: var(--border);
        background: var(--surface-raised);
    }

    html[data-theme="dark"] .bulk-bill-card.selection-active.selected {
        border-color: var(--brand-500);
        background: var(--brand-50);
    }

    html[data-theme="dark"] .bulk-mobile-check {
        border-color: var(--border-strong);
        background: var(--surface-soft);
    }

    html[data-theme="dark"] .bulk-mobile-receipt input:checked + .bulk-mobile-check {
        border-color: var(--brand-500);
        background: #2563eb;
        color: #fff;
    }
}

html[data-theme="dark"] .bulk-bill-card.selected .bill-list-card {
    border-bottom-color: transparent;
    background: linear-gradient(90deg, var(--brand-50), var(--surface-raised) 58%);
}

html[data-theme="dark"] .dashboard-receipt-sheet {
    border-color: var(--border);
    background: linear-gradient(180deg, #17243a, #101a2c);
}

html[data-theme="dark"] .dashboard-receipt-sheet::after {
    background: linear-gradient(135deg, transparent 50%, #101a2c 51%) 0 0/1rem 1rem repeat-x;
}

html[data-theme="dark"] :is(.dashboard-status, .workspace-status, .group-workspace .workspace-status, .manual-status) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-800);
}

html[data-theme="dark"] :is(.workspace-status.warning, .group-workspace .workspace-status.warning) {
    border-color: rgba(245, 158, 11, 0.42);
    background: #30230d;
    color: #fde68a;
}

html[data-theme="dark"] :is(.search-field input:focus, .group-workspace .search-field input:focus, .manual-field-grid input:focus, .manual-field-grid select:focus, .manual-note-field textarea:focus) {
    background: var(--surface-raised);
}

html[data-theme="dark"] :is(.workspace-filter-toggle, .archive-sort-toggle, .workspace-filter-bar input, .workspace-filter-bar select, .archive-sort-menu, .quick-filter-row button, .group-workspace .quick-filter, .group-workspace .quick-filter-row label, .group-workspace .bill-list-card-side select) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] .workspace-filter-toggle.active {
    border-color: var(--brand-500);
    background: color-mix(in srgb, var(--brand-600) 32%, var(--surface-raised));
    color: var(--brand-700);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-500) 20%, transparent);
}

html[data-theme="dark"] .quick-filter-row button.selected {
    border-color: var(--brand-500);
    background: color-mix(in srgb, var(--brand-600) 36%, var(--surface-raised));
    color: var(--brand-700);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand-500) 55%, transparent), 0 0 0 2px color-mix(in srgb, var(--brand-500) 20%, transparent);
}

html[data-theme="dark"] .workspace-filter-bar {
    border-color: var(--border);
    background: var(--surface-soft);
}

html[data-theme="dark"] :is(.group-list-card:hover, .group-list-card:focus-visible, .group-workspace a.bill-list-card:hover, .group-workspace a.bill-list-card:focus-visible) {
    background: linear-gradient(90deg, var(--brand-50), var(--surface-raised) 58%);
}

html[data-theme="dark"] :is(.bill-list-card-featured, .group-workspace .bill-list-card-featured) {
    border-color: var(--border);
    background: linear-gradient(180deg, #152238, #101a2c);
}

html[data-theme="dark"] :is(.group-workspace .group-danger-zone, .group-workspace .group-danger-zone > summary) {
    border-color: rgba(251, 113, 133, 0.32);
    background: var(--surface-raised);
}

html[data-theme="dark"] .group-workspace .group-danger-content {
    border-color: rgba(251, 113, 133, 0.28);
    background: #21131a;
}

html[data-theme="dark"] .group-workspace .group-danger-content input {
    border-color: rgba(251, 113, 133, 0.45);
    background: var(--surface-soft);
}

html[data-theme="dark"] .manual-bill-hero > aside {
    border-color: var(--border);
    background: rgba(22, 34, 56, 0.88);
}

/* Price and spending analytics */
html[data-theme="dark"] :is(
    .spending-metrics article,
    .spending-panel,
    .spending-mobile-summary,
    .spending-back-to-bills,
    .price-product-tools,
    .price-notes-panel,
    .price-analytics-hero,
    .price-search-card,
    .price-analytics-metrics article,
    .price-product-catalog,
    .price-product-card,
    .price-result-limit,
    .price-analytics-empty,
    .merchant-comparison-panel,
    .savings-banner,
    .price-note-comparison
) {
    border-color: var(--border);
    background-color: rgba(17, 26, 43, 0.96);
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .savings-banner {
    background: rgba(17, 26, 43, 0.96);
}

html[data-theme="dark"] :is(.savings-period-tabs button, .savings-merchant-grid article, .price-note-comparison-metrics > div, .price-note-source-names small, .price-note-purchase-list > article, .price-note-comparison > header > button) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] .price-analytics-hero {
    background:
        radial-gradient(circle at 90% 0, rgba(59, 130, 246, 0.17), transparent 18rem),
        linear-gradient(135deg, #111a2b, #0f1b30 72%, #10213c);
}

html[data-theme="dark"] .price-analytics-hero-badge {
    border-color: var(--border);
    background: rgba(22, 34, 56, 0.9);
}

html[data-theme="dark"] :is(.spending-period-button, .spending-filter-link, .spending-period-picker, .spending-period-picker input, .price-clear-action, .price-filter-chips button, .price-sort-control, .mobile-month-navigation) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] .analytics-scope-picker {
    border-color: var(--border);
    background: rgba(17, 26, 43, 0.96);
}

html[data-theme="dark"] .analytics-scope-options button {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-800);
}

html[data-theme="dark"] .analytics-scope-options button:hover,
html[data-theme="dark"] .analytics-scope-options button:focus-visible {
    border-color: #60a5fa;
    color: #bfdbfe;
}

html[data-theme="dark"] .analytics-scope-options button.selected {
    border-color: #60a5fa;
    background: rgba(37, 99, 235, 0.24);
    color: #dbeafe;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.16);
}

html[data-theme="dark"] :is(.price-search-field input:focus, .spending-period-picker input:focus) {
    background: var(--surface-raised);
}

html[data-theme="dark"] .category-donut::after {
    background: var(--surface-raised);
}

html[data-theme="dark"] .merchant-spend-grid > a {
    border-color: var(--border);
    background: linear-gradient(180deg, #152238, #111a2b);
}

html[data-theme="dark"] .spending-trend-panel {
    background:
        radial-gradient(circle at 82% 8%, rgba(59, 130, 246, 0.13), transparent 14rem),
        var(--surface-raised);
}

html[data-theme="dark"] :is(.spending-insight-grid article, .spending-empty, .price-change-panel, .price-product-stats > div) {
    border-color: var(--border);
    background: var(--surface-soft);
}

html[data-theme="dark"] .price-history-document {
    border-color: var(--border);
    background: var(--surface-raised);
}

html[data-theme="dark"] .price-history-document-items {
    border-color: var(--border);
    background: var(--surface-soft);
}

html[data-theme="dark"] .spending-mobile-summary {
    background:
        radial-gradient(circle at 100% 0, rgba(59, 130, 246, 0.18), transparent 12rem),
        var(--surface-raised);
}

/* Product grouping management */
html[data-theme="dark"] :is(
    .product-manager-hero,
    .merge-workbench,
    .product-catalog-panel,
    .product-manager-status,
    .product-card
) {
    border-color: var(--border);
    background-color: rgba(17, 26, 43, 0.97);
    color: var(--ink-900);
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .product-manager-hero {
    background:
        radial-gradient(circle at 92% 5%, rgba(59, 130, 246, 0.2), transparent 18rem),
        linear-gradient(135deg, #111a2b, #0f1b30 72%, #10203a);
}

html[data-theme="dark"] .product-safety-note {
    border-color: #28518f;
    background: #10254a;
    color: #bfdbfe;
}

html[data-theme="dark"] :is(
    .product-manager-back,
    .product-manager-page .secondary-action,
    .product-manager-page input,
    .merge-checkbox span
) {
    border-color: var(--border-strong);
    background: var(--surface-soft);
    color: var(--ink-900);
}

html[data-theme="dark"] .product-card {
    background: linear-gradient(160deg, #111a2b, #101a2c);
}

html[data-theme="dark"] .product-card.managed {
    background: linear-gradient(160deg, #111d32, #10203a);
}

html[data-theme="dark"] .product-card.selected {
    border-color: var(--brand-500);
    box-shadow: 0 0 0 3px rgba(91, 147, 255, 0.14), var(--shadow-sm);
}

html[data-theme="dark"] .merge-checkbox input:checked + span {
    border-color: var(--brand-600);
    background: var(--brand-600);
    color: #fff;
}

html[data-theme="dark"] .automatic-badge {
    background: var(--surface-muted);
    color: var(--ink-600);
}

html[data-theme="dark"] .alias-row {
    border-color: var(--border);
    background: var(--surface-soft);
    color: var(--ink-900);
}

html[data-theme="dark"] .product-manager-status.success {
    border-color: rgba(110, 231, 183, 0.35);
    background: var(--success-50);
    color: var(--success-600);
}

html[data-theme="dark"] .product-manager-status.error {
    border-color: rgba(251, 113, 133, 0.38);
    background: var(--danger-50);
    color: var(--danger-600);
}

html[data-theme="dark"] :is(.product-manager-page .danger-text, .product-manager-page .unmerge-confirmation) {
    color: #fda4af;
}

/* Receipt detail and shared receipt */
html[data-theme="dark"] :is(
    .bill-detail-panel,
    .bill-editor-panel,
    .bill-case-panel,
    .bill-delete-panel,
    .bill-utility-bar,
    .receipt-share-panel,
    .receipt-category-container,
    .receipt-summary-card,
    .receipt-section-card,
    .receipt-document-details,
    .receipt-verification-card,
    .receipt-utility-bar,
    .bill-more-options,
    .shared-receipt-banner,
    .shared-receipt-state,
    .shared-receipt-privacy-note
) {
    border-color: var(--border);
    background-color: rgba(17, 26, 43, 0.97);
    color: var(--ink-900);
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .receipt-split-card {
    --split-surface: #111a2b;
    --split-surface-soft: #0f1726;
    --split-surface-muted: #18243a;
    --split-border: #2a3a54;
    --split-text: #e8edf5;
    --split-muted: #a8b3c4;
    border-color: var(--split-border);
    background: var(--split-surface);
    color: var(--split-text);
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .shared-payment-card {
    --payment-surface: #111a2b;
    --payment-soft: #0f1726;
    --payment-border: #2a3a54;
    --payment-text: #e8edf5;
    --payment-muted: #a8b3c4;
    border-color: var(--payment-border);
    background:
        radial-gradient(circle at 100% 0, rgba(59, 130, 246, 0.15), transparent 17rem),
        var(--payment-surface);
    color: var(--payment-text);
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .shared-payment-state.error {
    color: #fda4af;
}

html[data-theme="dark"] .receipt-split-message.error {
    color: #fda4af;
}

html[data-theme="dark"] .receipt-split-message.success {
    color: #6ee7b7;
}

html[data-theme="dark"] .bill-hero {
    border-color: var(--border) !important;
    background: var(--surface-raised) !important;
    color: var(--ink-900) !important;
}

html[data-theme="dark"] .bill-receipt-card {
    border-color: var(--border) !important;
    background: var(--surface-soft) !important;
}

html[data-theme="dark"] :is(.receipt-summary-card, .shared-receipt-banner) {
    background:
        radial-gradient(circle at 95% 0, rgba(59, 130, 246, 0.15), transparent 18rem),
        linear-gradient(135deg, #111a2b, #0f1b30);
}

html[data-theme="dark"] :is(.bill-user-fields select, .bill-user-fields textarea, .bill-delete-cancel, .receipt-items-table, .receipt-document-details > summary, .bill-more-options > summary) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(.bill-vat-table tr, .bill-items-table tr, .receipt-empty-state, .receipt-items-table th) {
    background: var(--surface-soft);
}

html[data-theme="dark"] :is(.bill-vat-table, .bill-items-table, .receipt-items-table-wrap) {
    border-color: var(--border);
}

html[data-theme="dark"] :is(.bill-vat-table td, .bill-vat-table th, .bill-items-table td, .bill-items-table th, .receipt-items-table td, .receipt-items-table th) {
    border-color: var(--border);
    color: var(--ink-800);
}

html[data-theme="dark"] .receipt-share-panel {
    background:
        radial-gradient(circle at 100% 0, rgba(59, 130, 246, 0.16), transparent 20rem),
        linear-gradient(145deg, #111a2b, #0f1b30);
}

html[data-theme="dark"] :is(
    .panel-icon,
    .bill-more-options-icon,
    .receipt-share-icon,
    .shared-receipt-banner-mark,
    .shared-receipt-state-icon,
    .receipt-section-icon,
    .receipt-count-pill
) {
    border-color: var(--brand-200);
    background: var(--brand-50);
    color: var(--brand-700);
}

html[data-theme="dark"] :is(.bill-vat-rate, .items-total) {
    background: var(--brand-50);
    color: var(--brand-700);
}

html[data-theme="dark"] .bill-detail-saving {
    color: var(--brand-700);
}

html[data-theme="dark"] .receipt-share-state-mark {
    background: var(--success-50);
    color: var(--success-600);
}

html[data-theme="dark"] .receipt-verification-card.verified .receipt-verification-mark {
    border-color: rgba(110, 231, 183, 0.48);
    color: var(--success-600);
}

html[data-theme="dark"] .receipt-verification-card.manual .receipt-verification-mark {
    border-color: rgba(251, 191, 106, 0.48);
    color: var(--warning-600);
}

html[data-theme="dark"] :is(
    .bill-detail-page .receipt-items-table td:last-child strong,
    .shared-receipt-page .receipt-items-table td:last-child,
    .shared-receipt-page .receipt-items-table td:last-child strong
) {
    color: var(--ink-900) !important;
}

html[data-theme="dark"] .receipt-grand-total {
    background: var(--brand-50);
}

html[data-theme="dark"] .receipt-total-list .receipt-grand-total {
    background: linear-gradient(90deg, #13284c, #162238);
}

html[data-theme="dark"] .category-track {
    background: var(--surface-muted);
}

html[data-theme="dark"] .shared-receipt-page .receipt-total-list .receipt-grand-total {
    background: linear-gradient(90deg, #13284c, #162238) !important;
}

html[data-theme="dark"] .shared-receipt-page .receipt-grand-total :is(dt, dd) {
    color: var(--ink-900) !important;
}

html[data-theme="dark"] .receipt-category-container {
    border-color: color-mix(in srgb, var(--category-primary) 58%, var(--border));
    background:
        radial-gradient(circle at 94% 10%, color-mix(in srgb, var(--category-primary) 36%, transparent), transparent 17rem),
        linear-gradient(135deg,
            color-mix(in srgb, var(--category-primary) 34%, #111a2b),
            color-mix(in srgb, var(--category-primary) 20%, #0f192a));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 0.55rem 1.4rem color-mix(in srgb, var(--category-primary) 16%, transparent);
}

html[data-theme="dark"] .receipt-category-picker {
    background: transparent;
    color: color-mix(in srgb, var(--category-primary) 64%, #e2e8f0);
}

html[data-theme="dark"] .receipt-category-picker:hover {
    background: color-mix(in srgb, var(--category-primary) 12%, transparent);
}

html[data-theme="dark"] .receipt-category-icon {
    border-color: color-mix(in srgb, var(--category-primary) 42%, var(--border));
    background: color-mix(in srgb, var(--category-primary) 18%, var(--surface-raised));
}

html[data-theme="dark"] :is(.receipt-category-label, .receipt-category-chevron) {
    color: color-mix(in srgb, var(--category-primary) 46%, #e2e8f0);
}

html[data-theme="dark"] .receipt-category-value {
    color: #f8fafc;
}

html[data-theme="dark"] .receipt-verification-card.verified {
    border-color: rgba(52, 211, 153, 0.3);
    background: linear-gradient(135deg, #111a2b, #0d2a23);
}

html[data-theme="dark"] .receipt-verification-card.manual {
    border-color: rgba(251, 146, 60, 0.35);
    background: linear-gradient(135deg, #111a2b, #30200f);
}

html[data-theme="dark"] .receipt-verification-body strong {
    color: var(--ink-900);
}

html[data-theme="dark"] .bill-checklist li {
    color: var(--ink-700);
}

html[data-theme="dark"] :is(.bill-detail-kicker, .panel-eyebrow, .attachment-kicker) {
    color: var(--brand-700);
}

html[data-theme="dark"] .bill-delete-panel p {
    color: #fecdd3;
}

html[data-theme="dark"] :is(.receipt-summary-warning, .bill-vat-warning) {
    border-color: rgba(245, 158, 11, 0.36);
    background: #30230d;
    color: #fde68a;
}

html[data-theme="dark"] .bill-delete-panel {
    border-color: rgba(251, 113, 133, 0.35);
    background: #21131a;
}

/* Landing page and legal documents */
html[data-theme="dark"] :is(
    .welcome-shell,
    .welcome-receipt-card,
    .welcome-metric,
    .welcome-feature-grid article,
    .legal-header dl div,
    .legal-sheet
) {
    border-color: var(--border);
    background-color: rgba(17, 26, 43, 0.95);
    color: var(--ink-900);
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .welcome-shell {
    background:
        radial-gradient(circle at 10% 8%, rgba(59, 130, 246, 0.22), transparent 22rem),
        linear-gradient(145deg, #10213c, #0d1728);
}

html[data-theme="dark"] :is(.welcome-topbar, .welcome-footer) {
    border-color: var(--border);
}

html[data-theme="dark"] :is(.welcome-login-button.debug, .debug-icon) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(.welcome-receipt-card, .welcome-metric) {
    background: #111a2b;
    box-shadow: var(--shadow-lg);
}

html[data-theme="dark"] .welcome-feature-grid article {
    background: #111d31;
}

html[data-theme="dark"] .welcome-page,
html[data-theme="dark"] .welcome-preview-glow {
    background-color: transparent;
}

html[data-theme="dark"] .welcome-scan-mark {
    border-color: var(--surface-raised);
}

html[data-theme="dark"] .login-alert {
    border-color: rgba(251, 113, 133, 0.38);
    background: var(--danger-50);
    color: #fecdd3;
}

html[data-theme="dark"] .legal-sheet {
    background:
        linear-gradient(180deg, rgba(17, 26, 43, 0.98), rgba(13, 22, 38, 0.98));
}

/* Shared components and dialogs */
html[data-theme="dark"] :is(
    .attachment-panel,
    .attachment-card,
    .bill-list-card,
    .category-picker-dialog,
    .pwa-install-card
) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
    box-shadow: var(--shadow-md);
}

html[data-theme="dark"] :is(.attachment-upload-box, .attachment-empty, .attachment-preview, .category-picker-search, .category-picker-groups, .category-picker-empty > span, .price-sparkline) {
    border-color: var(--border);
    background: var(--surface-soft);
    color: var(--ink-800);
}

html[data-theme="dark"] :is(.attachment-actions a, .attachment-actions button, .category-picker-option, .category-picker-footer, .category-picker-secondary, .category-picker-groups button) {
    border-color: var(--border);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(.category-picker-close:hover, .category-picker-search button:hover, .category-picker-groups button:hover) {
    background: var(--surface-muted);
}

html[data-theme="dark"] .category-picker-recommendation {
    border-color: rgba(245, 158, 11, 0.3);
    background: linear-gradient(135deg, #2d220f, #33240d);
}

html[data-theme="dark"] .category-picker-option.selected {
    border-color: var(--category-primary);
    background: linear-gradient(145deg, color-mix(in srgb, var(--category-primary) 16%, var(--surface-raised)), var(--surface-raised));
}

html[data-theme="dark"] .category-picker-backdrop,
html[data-theme="dark"] .categories-editor-backdrop {
    background: rgba(2, 6, 23, 0.78);
}

html[data-theme="dark"] .bill-list-card:hover,
html[data-theme="dark"] .bill-list-card:focus-visible {
    background: linear-gradient(90deg, var(--brand-50), var(--surface-raised) 58%);
}

html[data-theme="dark"] .price-sparkline {
    background: linear-gradient(180deg, #111d31, #0f192a);
}

html[data-theme="dark"] .category-badge-icon {
    border-color: color-mix(in srgb, var(--category-primary) 34%, var(--border));
    background: linear-gradient(145deg, color-mix(in srgb, var(--category-primary) 18%, var(--surface-raised)), var(--surface-raised));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), var(--shadow-sm);
}

html[data-theme="dark"] :is(.category-badge-copy strong, .category-badge-copy small) {
    color: var(--ink-800);
}

html[data-theme="dark"] .category-badge-chip {
    border-color: color-mix(in srgb, var(--category-primary) 42%, var(--border));
    background: color-mix(in srgb, var(--category-primary) 18%, var(--surface-raised));
    color: color-mix(in srgb, var(--category-primary) 76%, white);
}

html[data-theme="dark"] .category-badge-chip .category-badge-icon {
    border: 0;
    background: transparent;
    box-shadow: none;
}

html[data-theme="dark"] .category-badge-chip .category-badge-copy strong {
    color: color-mix(in srgb, var(--category-primary) 76%, white);
}

html[data-theme="dark"] .merchant-badge:not(.merchant-badge-has-logo) {
    border-color: color-mix(in srgb, var(--merchant-primary) 34%, var(--border));
    background:
        radial-gradient(circle at 76% 20%, rgba(255, 255, 255, 0.08), transparent 34%),
        linear-gradient(145deg, color-mix(in srgb, var(--merchant-primary) 18%, var(--surface-raised)), var(--surface-raised));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), var(--shadow-sm);
}

html[data-theme="dark"] .merchant-badge-icon {
    background: color-mix(in srgb, var(--merchant-primary) 20%, var(--surface-raised));
}

html[data-theme="dark"] .merchant-badge-has-logo {
    background: #fff;
}

html[data-theme="dark"] .route-authorization-primary {
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] .pwa-install-card button {
    background: var(--brand-600);
    color: #fff;
}

/* Remaining legacy surfaces and text colors that are still hard-coded in isolated styles. */
html[data-theme="dark"] .navbar-toggler:checked,
html[data-theme="dark"] .nav-item .nav-link:hover {
    background-color: rgba(96, 165, 250, 0.16);
}

html[data-theme="dark"] .nav-item a.active {
    background-color: rgba(96, 165, 250, 0.24);
    color: #fff;
}

html[data-theme="dark"] :is(
    .categories-summary,
    .categories-empty-list,
    .categories-form input,
    .category-row-actions button,
    .categories-editor-close
) {
    border-color: var(--border);
    background: var(--surface-soft);
    color: var(--ink-800);
}

html[data-theme="dark"] .categories-editor-panel .categories-form input:not([type="hidden"]):not([type="color"]) {
    border-color: var(--border);
    background: var(--surface-soft);
    color: var(--ink-800);
}

html[data-theme="dark"] :is(
    .categories-header p,
    .categories-summary,
    .category-row-meta strong,
    .categories-empty-list,
    .categories-panel-heading small,
    .categories-form label > span,
    .categories-choice-heading > span,
    .categories-choice-heading small,
    .categories-custom-color > span:last-of-type,
    .categories-empty p
) {
    color: var(--ink-600);
}

html[data-theme="dark"] :is(
    .categories-summary strong,
    .categories-empty-list strong,
    .category-group h2
) {
    color: var(--ink-900);
}

html[data-theme="dark"] .category-row-actions button.hide:hover {
    background: var(--danger-50);
}

html[data-theme="dark"] :is(
    .bill-empty-shell,
    .bill-vat-empty,
    .bill-detail-empty,
    .bill-more-options-content,
    .receipt-share-loading,
    .receipt-share-empty-state,
    .receipt-share-active-state,
    .receipt-share-link-block
) {
    border-color: var(--border);
    background: var(--surface-soft);
    color: var(--ink-800);
}

html[data-theme="dark"] :is(
    .bill-detail-secondary-action,
    .bill-utility-actions button,
    .receipt-share-link-row input,
    .receipt-share-revoke,
    .receipt-share-close,
    .group-back-link,
    .receipt-back-link,
    .manual-header-back-link
) {
    border-color: var(--border-strong);
    background: var(--surface-raised);
    color: var(--ink-900);
}

html[data-theme="dark"] :is(
    .bill-detail-secondary-action:hover,
    .bill-utility-actions button:hover,
    .receipt-share-revoke:hover,
    .receipt-share-revoke:focus-visible,
    .receipt-share-close:hover,
    .receipt-share-close:focus-visible,
    .group-back-link:hover,
    .group-back-link:focus-visible,
    .receipt-back-link:hover,
    .receipt-back-link:focus-visible,
    .manual-header-back-link:hover,
    .manual-header-back-link:focus-visible
) {
    background: var(--surface-muted);
}

html[data-theme="dark"] .bill-back-link {
    border-color: rgba(148, 163, 184, 0.32);
    background: rgba(15, 23, 42, 0.42);
    color: #f8fafc;
}

html[data-theme="dark"] :is(
    .bill-empty-shell h1,
    .bill-vat-empty strong,
    .bill-detail-empty h2,
    .item-name,
    .receipt-share-heading h2,
    .receipt-share-empty-state strong,
    .receipt-page-header h1,
    .receipt-category-value
) {
    color: var(--ink-900);
}

html[data-theme="dark"] :is(
    .bill-empty-shell p,
    .bill-detail-facts dt,
    .bill-detail-facts dd,
    .bill-vat-note,
    .bill-utility-bar > div:first-child small,
    .receipt-share-heading p,
    .receipt-share-loading,
    .receipt-share-empty-state span,
    .receipt-share-active-state p,
    .receipt-share-active-state small,
    .receipt-share-link-block label,
    .receipt-share-expiration,
    .bill-more-options > summary small,
    .bill-more-options-chevron,
    .bill-user-fields label > span,
    .receipt-summary-date,
    .receipt-document-details > summary small
) {
    color: var(--ink-600);
}

html[data-theme="dark"] .bill-checklist li.todo::before {
    border-color: var(--border-strong);
    background: var(--surface-raised);
}

html[data-theme="dark"] .spending-category-icon.accent-green { background: #0c2b23; color: #6ee7b7; }
html[data-theme="dark"] .spending-category-icon.accent-amber { background: #33240d; color: #fbbf6a; }
html[data-theme="dark"] .spending-category-icon.accent-orange { background: #35200f; color: #fdba74; }
html[data-theme="dark"] .spending-category-icon.accent-pink { background: #351426; color: #f9a8d4; }
html[data-theme="dark"] .spending-category-icon.accent-violet { background: #25183f; color: #c4b5fd; }
html[data-theme="dark"] .spending-category-icon.accent-slate { background: var(--surface-muted); color: var(--ink-600); }

html[data-theme="dark"] :is(
    .receipt-summary-copy h2,
    .receipt-summary-amount,
    .receipt-section-heading h2,
    .receipt-item-name,
    .receipt-fact-list dd,
    .receipt-total-list dd,
    .receipt-grand-total dt,
    .receipt-grand-total dd
) {
    color: var(--ink-900);
}

html[data-theme="dark"] :is(
    .shared-receipt-banner p,
    .receipt-summary-date,
    .receipt-items-table th,
    .receipt-fact-list dt,
    .receipt-total-list dt,
    .receipt-verification-body span,
    .shared-receipt-footer,
    .shared-receipt-state p
) {
    color: var(--ink-600);
}

html[data-theme="dark"] :is(
    .attachment-header p,
    .attachment-upload-box small,
    .attachment-empty span,
    .attachment-info span,
    .category-picker-option small,
    .pwa-install-card small
) {
    color: var(--ink-600);
}

html[data-theme="dark"] :is(
    .attachment-info strong,
    .category-picker-empty strong,
    .pwa-install-card strong
) {
    color: var(--ink-900);
}

html[data-theme="dark"] :is(.category-picker-none, .pwa-install-card .pwa-dismiss) {
    border-color: var(--border);
    background: var(--surface-soft);
    color: var(--ink-800);
}

html[data-theme="dark"] :is(.legal-header p, .legal-header dt, .legal-sheet p, .legal-sheet ul) {
    color: var(--ink-600);
}

/* Semantic states */
html[data-theme="dark"] :is(.account-message.error, .login-alert, .workspace-status.error, .dashboard-status.error, .manual-status.error, .attachment-status.error, .bill-detail-status.error, .receipt-share-message.error) {
    border-color: rgba(251, 113, 133, 0.4);
    background: var(--danger-50);
    color: #fda4af;
}

html[data-theme="dark"] :is(.attachment-status.success, .account-provider, .shared-receipt-readonly, .bill-detail-status.success, .receipt-share-message.success) {
    border-color: rgba(52, 211, 153, 0.32);
    background: var(--success-50);
    color: var(--success-600);
}

html[data-theme="dark"] :is(.shared-receipt-privacy-note, .bill-detail-status.neutral) {
    border-color: var(--brand-200);
    background: var(--brand-50);
    color: var(--brand-700);
}

html[data-theme="dark"] .receipt-status-pill.manual {
    border-color: rgba(251, 146, 60, 0.36);
    background: #30200f;
    color: #fdba74;
}

/* Keep transitions subtle and disable them for reduced-motion users. */
html[data-theme="dark"] body,
html[data-theme="light"] body {
    transition: background-color 0.18s ease, color 0.18s ease;
}

@media (max-width: 800px) {
    html[data-theme="dark"] :is(.app-shell, .public-shell, .content) {
        background: #0b1220;
    }

    html[data-theme="dark"] .mobile-tab-bar {
        background: rgba(11, 18, 32, 0.97);
    }

    html[data-theme="dark"] :is(.category-picker-dialog, .categories-editor-panel) {
        border-color: var(--border);
        background: var(--surface-raised);
    }
}

@media (prefers-reduced-motion: reduce) {
    html[data-theme="dark"] body,
    html[data-theme="light"] body {
        transition: none;
    }
}

@media print {
    html[data-theme="dark"],
    html[data-theme="dark"] body {
        background: #fff !important;
        color: #000 !important;
        color-scheme: light;
    }
}

html[data-theme="dark"] .receipt-document-details,
html[data-theme="dark"] .receipt-document-details > summary,
html[data-theme="dark"] .receipt-document-details > summary:hover,
html[data-theme="dark"] .receipt-document-details > summary:focus-visible,
html[data-theme="dark"] .receipt-document-details-content {
    border-color: var(--border) !important;
    background: var(--surface-raised) !important;
    color: var(--ink-900) !important;
}

html[data-theme="dark"] .receipt-document-details > summary:hover,
html[data-theme="dark"] .receipt-document-details > summary:focus-visible {
    background: var(--surface-soft) !important;
}
