body.dark-mode {
    --bg-color: #0f0e2a;
    --surface-color: rgba(26, 22, 64, 0.97);
    --text-primary: #e0e7ff;
    --text-secondary: #a5b4fc;
    --border-color: rgba(79, 70, 229, 0.22);
    --primary-light: rgba(79, 70, 229, 0.18);
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.4);
    --shadow-md: 0 4px 12px -2px rgb(0 0 0 / 0.55);
}

body.dark-mode body,
body.dark-mode {
    background: linear-gradient(135deg, #0f0e2a 0%, #130f38 55%, #0c1a2e 100%);
    background-attachment: fixed;
}

body.dark-mode .app-container {
    background-color: #110f2e;
    box-shadow: 0 0 80px rgba(79, 70, 229, 0.15);
}

body.dark-mode .app-header {
    background: linear-gradient(135deg, rgba(26, 22, 64, 0.98), rgba(30, 27, 75, 0.98));
    border-bottom-color: rgba(79, 70, 229, 0.25);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
}

body.dark-mode .date-nav-widget {
    background: linear-gradient(135deg, rgba(30, 27, 75, 0.9), rgba(55, 48, 163, 0.4));
    border-color: rgba(79, 70, 229, 0.35);
}

body.dark-mode .order-list-section {
    background: linear-gradient(180deg, rgba(26, 22, 64, 0.97), #110f2e 100%);
}

body.dark-mode .order-item {
    background-color: rgba(30, 27, 75, 0.6);
    border-color: rgba(79, 70, 229, 0.15);
}

body.dark-mode .order-item:hover {
    background-color: rgba(55, 48, 163, 0.25);
    border-color: rgba(99, 102, 241, 0.45);
    box-shadow: 0 4px 14px rgba(79, 70, 229, 0.2);
}

body.dark-mode .stat-item {
    background-color: rgba(26, 22, 64, 0.8);
    border-color: rgba(79, 70, 229, 0.15);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

body.dark-mode .stat-total {
    background: linear-gradient(160deg, rgba(124, 45, 18, 0.25) 0%, rgba(26, 22, 64, 0.8) 100%);
}

body.dark-mode .stat-unique {
    background: linear-gradient(160deg, rgba(6, 78, 59, 0.25) 0%, rgba(26, 22, 64, 0.8) 100%);
}

body.dark-mode .stat-repeated {
    background: linear-gradient(160deg, rgba(127, 29, 29, 0.25) 0%, rgba(26, 22, 64, 0.8) 100%);
}

body.dark-mode .repeated-badge {
    background-color: rgba(127, 29, 29, 0.5);
    color: #fca5a5;
}

body.dark-mode .warning-box {
    background-color: rgba(124, 45, 18, 0.3);
    color: #fdba74;
    border-color: rgba(249, 115, 22, 0.3);
}

body.dark-mode textarea {
    background-color: var(--bg-color);
    color: var(--text-primary);
    border-color: var(--border-color);
}

body.dark-mode .cat-btn {
    background: linear-gradient(135deg, rgba(30, 27, 75, 0.9), rgba(17, 15, 46, 0.9));
    color: var(--text-primary);
    border-color: rgba(79, 70, 229, 0.25);
}

body.dark-mode .cat-btn:hover {
    background: rgba(79, 70, 229, 0.2);
    border-color: rgba(99, 102, 241, 0.5);
}

body.dark-mode .cat-btn.selected {
    background: var(--gradient-primary);
    color: white;
    border-color: transparent;
}

body.dark-mode .cat-btn-edit {
    background-color: rgba(30, 27, 75, 0.8);
    color: var(--text-primary);
    border-color: var(--border-color);
}

body.dark-mode .mic-btn.recording {
    background-color: rgba(127, 29, 29, 0.5);
    border-color: #f87171;
    color: #f87171;
}

/* Dark mode: Observations Modal */
body.dark-mode .obs-card {
    background: rgba(17, 15, 46, 0.8);
    border-color: rgba(79, 70, 229, 0.2);
}

body.dark-mode .obs-badge-discount {
    background: rgba(245, 158, 11, 0.18);
    color: #fbbf24;
}

body.dark-mode .obs-badge-cancel {
    background: rgba(239, 68, 68, 0.18);
    color: #f87171;
}

body.dark-mode .obs-input-with-prefix {
    background: rgba(17, 15, 46, 0.8);
    border-color: rgba(79, 70, 229, 0.25);
}

body.dark-mode .obs-input {
    background: rgba(17, 15, 46, 0.8);
    color: var(--text-primary);
    border-color: rgba(79, 70, 229, 0.25);
}

body.dark-mode .obs-input-error,
body.dark-mode .obs-input-error:focus {
    border-color: var(--danger-color);
}

/* Dark mode: atalhos de motivo e modal de cancelamento */
body.dark-mode .reason-chip {
    background: rgba(17, 15, 46, 0.8);
    border-color: rgba(79, 70, 229, 0.25);
    color: var(--text-secondary);
}

body.dark-mode .reason-chip:hover {
    border-color: #f87171;
    color: #f87171;
}

body.dark-mode .reason-chip.selected {
    background: var(--danger-color);
    border-color: var(--danger-color);
    color: #fff;
}

body.dark-mode .crm-address {
    background: rgba(17, 15, 46, 0.8);
    border-color: rgba(79, 70, 229, 0.25);
    color: var(--text-primary);
}

/* Dark mode: Cancelled Orders */
body.dark-mode .order-item.cancelled {
    background-color: rgba(127, 29, 29, 0.12);
}

body.dark-mode .cancelled-badge {
    background-color: rgba(127, 29, 29, 0.3);
    color: #f87171;
}

/* Dark mode: Settings */
body.dark-mode .price-edit-card {
    background: rgba(26, 22, 64, 0.8);
    border-color: rgba(79, 70, 229, 0.2);
}

body.dark-mode .price-input-wrapper {
    background: rgba(17, 15, 46, 0.8);
    border-color: rgba(79, 70, 229, 0.25);
}

body.dark-mode .price-input-wrapper:focus-within {
    background: rgba(17, 15, 46, 1);
    border-color: var(--primary-color);
}

body.dark-mode .price-header {
    color: var(--text-secondary);
}

/* Dark mode: ASM Modal */
body.dark-mode .asm-info-card {
    background: rgba(127, 29, 29, 0.18);
    border-color: rgba(239, 68, 68, 0.3);
}

body.dark-mode .asm-info-label {
    color: #f87171;
}

body.dark-mode .asm-address-row {
    border-top-color: rgba(239, 68, 68, 0.3);
}

/* Dark mode: Modal */
body.dark-mode .modal-content {
    background: linear-gradient(160deg, #1a163f, #110f2e);
    box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.6);
}

body.dark-mode .summary-card-dashboard {
    background: rgba(26, 22, 64, 0.8);
    border-color: rgba(79, 70, 229, 0.2);
}

body.dark-mode .summary-card-dashboard.card-danger {
    background: rgba(127, 29, 29, 0.2);
    border-color: rgba(239, 68, 68, 0.25);
}

body.dark-mode .cat-bar-track {
    background: rgba(79, 70, 229, 0.2);
}

body.dark-mode #search-input {
    background: rgba(17, 15, 46, 0.8);
    color: var(--text-primary);
    border-color: rgba(79, 70, 229, 0.25);
}

body.dark-mode #search-input:focus {
    background: rgba(17, 15, 46, 1);
    border-color: var(--primary-color);
}

body.dark-mode .app-footer {
    background: linear-gradient(135deg, #110f2e, #0f0e2a);
    border-top-color: rgba(79, 70, 229, 0.2);
}

/* Purple warning (dark) */
body.dark-mode .warning-box.alert-purple {
    background-color: rgba(147, 51, 234, 0.18);
    color: #d8b4fe;
    border-color: rgba(147, 51, 234, 0.35);
}

/* Contas Conectadas (Configurações) */
body.dark-mode .account-card {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(79, 70, 229, 0.25);
}

body.dark-mode .accounts-empty {
    border-color: rgba(79, 70, 229, 0.3);
}

body.dark-mode .account-connect-form {
    background: rgba(79, 70, 229, 0.12);
}

body.dark-mode .account-remove-btn:hover {
    background: rgba(239, 68, 68, 0.18);
}

/* Tag da conta de origem: no escuro, o texto vai para a cor clara da marca —
   a versão escura usada no tema claro sumiria contra o fundo. */
body.dark-mode .account-tag-ml {
    background-color: rgba(255, 230, 0, 0.14);
    border-color: rgba(255, 230, 0, 0.3);
    color: #ffe600;
}

body.dark-mode .account-tag-shopee {
    background-color: rgba(238, 77, 45, 0.18);
    border-color: rgba(238, 77, 45, 0.4);
    color: #ff8a6b;
}