[data-theme="dark"] {
  color-scheme: dark;
  --bg-main: #14110f;
  --bg-color: #14110f;
  --bg-card: #1f1a17;
  --card-bg: #201b18;
  --sidebar-bg: #110f0e;
  --sidebar-hover: #2a231f;
  --primary: #f4b15d;
  --primary-hover: #f2a850;
  --accent: #f6bf69;
  --text-main: #f7efe7;
  --text-muted: #c8b39c;
  --border-color: rgba(244, 177, 93, 0.22);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.18);
  --shadow-md: 0 10px 24px rgba(0,0,0,0.22);
}

[data-theme="dark"] * {
  box-sizing: border-box;
}

[data-theme="dark"] html,
[data-theme="dark"] body {
  background: var(--bg-main) !important;
  color: var(--text-main) !important;
}

[data-theme="dark"] body,
[data-theme="dark"] .content,
[data-theme="dark"] main,
[data-theme="dark"] section,
[data-theme="dark"] .container,
[data-theme="dark"] .layout,
[data-theme="dark"] .dashboard-shell {
  background: var(--bg-main) !important;
  color: var(--text-main) !important;
}

[data-theme="dark"] .sidebar,
[data-theme="dark"] .sidebar nav,
[data-theme="dark"] .sidebar a,
[data-theme="dark"] .sidebar .brand,
[data-theme="dark"] .menu-section {
  background: var(--sidebar-bg) !important;
  color: var(--text-main) !important;
}

[data-theme="dark"] .sidebar {
  border-right: 1px solid var(--border-color) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
}

[data-theme="dark"] .sidebar a {
  color: rgba(247, 239, 231, 0.8) !important;
  border: 1px solid transparent;
}

[data-theme="dark"] .sidebar a:hover,
[data-theme="dark"] .sidebar a.active {
  background: var(--sidebar-hover) !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .top-bar,
[data-theme="dark"] .card,
[data-theme="dark"] .panel,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .order-card-item,
[data-theme="dark"] .product-card,
[data-theme="dark"] .product-card-header,
[data-theme="dark"] .product-card-footer,
[data-theme="dark"] .expense-card-item,
[data-theme="dark"] .qris-box,
[data-theme="dark"] .login-card,
[data-theme="dark"] .info-card,
[data-theme="dark"] .success-container,
[data-theme="dark"] .order-code-box,
[data-theme="dark"] .login-container,
[data-theme="dark"] .table-container,
[data-theme="dark"] .form-card,
[data-theme="dark"] .modal-content,
[data-theme="dark"] .user-profile,
[data-theme="dark"] .date-pill,
[data-theme="dark"] .icon-btn,
[data-theme="dark"] table,
[data-theme="dark"] .table,
[data-theme="dark"] .transaction-item,
[data-theme="dark"] .panel-summary,
[data-theme="dark"] .mobile-expense-cards > div {
  background-color: var(--card-bg) !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
  box-shadow: var(--shadow-md) !important;
}

[data-theme="dark"] .card,
[data-theme="dark"] .panel,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .order-card-item,
[data-theme="dark"] .product-card,
[data-theme="dark"] .expense-card-item,
[data-theme="dark"] .login-card,
[data-theme="dark"] .info-card,
[data-theme="dark"] .qris-box,
[data-theme="dark"] .modal-content {
  border-radius: 16px !important;
}

[data-theme="dark"] .stat-card {
  background: linear-gradient(135deg, rgba(255, 181, 92, 0.08), rgba(33, 25, 22, 0.96)) !important;
}

[data-theme="dark"] .stat-icon,
[data-theme="dark"] .avatar,
[data-theme="dark"] .brand-icon,
[data-theme="dark"] .icon-btn-theme {
  background: rgba(244, 177, 93, 0.12) !important;
  color: var(--primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .page-title h1,
[data-theme="dark"] .page-title h2,
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] .panel-title,
[data-theme="dark"] .card-title,
[data-theme="dark"] .brand-title,
[data-theme="dark"] .product-name,
[data-theme="dark"] .order-card-body,
[data-theme="dark"] .modal-header,
[data-theme="dark"] .big-number,
[data-theme="dark"] .amount {
  color: var(--text-main) !important;
}

[data-theme="dark"] .page-title p,
[data-theme="dark"] .text-muted,
[data-theme="dark"] small,
[data-theme="dark"] .brand-subtitle,
[data-theme="dark"] .menu-section,
[data-theme="dark"] .info-label,
[data-theme="dark"] .meta,
[data-theme="dark"] .muted,
[data-theme="dark"] .empty-state,
[data-theme="dark"] .badge-muted {
  color: var(--text-muted) !important;
}

[data-theme="dark"] table th,
[data-theme="dark"] table td,
[data-theme="dark"] .table th,
[data-theme="dark"] .table td,
[data-theme="dark"] .desktop-table th,
[data-theme="dark"] .desktop-table td {
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
  background: transparent !important;
}

[data-theme="dark"] .table-striped tbody tr:nth-child(odd),
[data-theme="dark"] table tbody tr:nth-child(odd) {
  background: rgba(255,255,255,0.02) !important;
}

[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea,
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group select,
[data-theme="dark"] .form-group textarea {
  background-color: #261f1c !important;
  color: var(--text-main) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: var(--text-muted) !important;
}

[data-theme="dark"] .btn,
[data-theme="dark"] button,
[data-theme="dark"] .action-btn,
[data-theme="dark"] .icon-btn-theme,
[data-theme="dark"] .btn-primary,
[data-theme="dark"] .menu-button {
  background: var(--primary) !important;
  color: #1b120d !important;
  border-color: var(--primary) !important;
  box-shadow: 0 8px 18px rgba(244, 177, 93, 0.25) !important;
}

[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .outline-btn {
  background: transparent !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background:#fff"],
[data-theme="dark"] [style*="background: #ffffff"],
[data-theme="dark"] [style*="background:#ffffff"],
[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background:white"],
[data-theme="dark"] [style*="background-color: #fff"],
[data-theme="dark"] [style*="background-color:#fff"],
[data-theme="dark"] [style*="background-color: #ffffff"],
[data-theme="dark"] [style*="background-color:#ffffff"],
[data-theme="dark"] [style*="background-color: white"],
[data-theme="dark"] [style*="background-color:white"] {
  background-color: var(--card-bg) !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .global-theme-toggle {
  background: var(--card-bg) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-main) !important;
  box-shadow: 0 10px 20px rgba(0,0,0,0.3) !important;
}

[data-theme="dark"] .product-card-name,
[data-theme="dark"] .product-card-price,
[data-theme="dark"] .order-total,
[data-theme="dark"] .qris-total,
[data-theme="dark"] .qris-total span {
  color: var(--primary) !important;
}

[data-theme="dark"] .summary-title,
[data-theme="dark"] .summary-title i,
[data-theme="dark"] .qris-title,
[data-theme="dark"] .qris-title i,
[data-theme="dark"] .summary-label,
[data-theme="dark"] .empty-cart,
[data-theme="dark"] .qris-description {
  color: var(--text-main) !important;
}

[data-theme="dark"] .user-profile-name {
  color: var(--text-main) !important;
}

[data-theme="dark"] .user-profile-role {
  color: var(--text-muted) !important;
}

/* Legacy page styles use these dark brown colors inline. Keep them readable in dark mode. */
[data-theme="dark"] [style*="color:#2c221e"],
[data-theme="dark"] [style*="color: #2c221e"],
[data-theme="dark"] [style*="color:#292524"],
[data-theme="dark"] [style*="color: #292524"],
[data-theme="dark"] [style*="color:#3b271c"],
[data-theme="dark"] [style*="color: #3b271c"],
[data-theme="dark"] [style*="color:#36261a"],
[data-theme="dark"] [style*="color: #36261a"],
[data-theme="dark"] [style*="color:#6b5b52"],
[data-theme="dark"] [style*="color: #6b5b52"],
[data-theme="dark"] [style*="color:#8c7a6b"],
[data-theme="dark"] [style*="color: #8c7a6b"],
[data-theme="dark"] [style*="color:#9c8b7e"],
[data-theme="dark"] [style*="color: #9c8b7e"] {
  color: var(--text-main) !important;
}

[data-theme="dark"] [style*="color:#8c7a6b"],
[data-theme="dark"] [style*="color: #8c7a6b"],
[data-theme="dark"] [style*="color:#9c8b7e"],
[data-theme="dark"] [style*="color: #9c8b7e"] {
  color: var(--text-muted) !important;
}

[data-theme="dark"] .product-card h3,
[data-theme="dark"] .product-card .price,
[data-theme="dark"] .product-card .product-price,
[data-theme="dark"] .summary-label,
[data-theme="dark"] .user-profile,
[data-theme="dark"] .date-pill,
[data-theme="dark"] .category-filter,
[data-theme="dark"] .cart-item,
[data-theme="dark"] .cart-item * {
  color: var(--text-main) !important;
}

[data-theme="dark"] .category-filter .btn-category:not(.active) {
  background: var(--card-bg) !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .badge-category {
  background: rgba(244, 177, 93, 0.14) !important;
  color: var(--primary) !important;
}

[data-theme="dark"] hr {
  border-color: var(--border-color) !important;
}

/* QR preview stays white for printing, so its text must stay dark. */
[data-theme="dark"] .qr-preview-box {
  background: #ffffff !important;
  color: #3b271c !important;
  border-color: #f0e6de !important;
}

[data-theme="dark"] .qr-preview-box .qr-preview-title {
  color: #3b271c !important;
}

[data-theme="dark"] .qr-preview-box .qr-preview-table {
  color: #6b5b52 !important;
}

[data-theme="dark"] .qr-preview-box .qr-preview-table span {
  color: #3b271c !important;
}

[data-theme="dark"] .qr-preview-box .url-text-box {
  background: #ffffff !important;
  color: #555555 !important;
  border-color: #f0e6de !important;
}

[data-theme="dark"] .qr-preview-box .url-text-box a {
  color: #0284c7 !important;
}

[data-theme="dark"] .qr-preview-box .qr-preview-help {
  color: #9c8b7e !important;
}

[data-theme="dark"] .filter-card {
  background: var(--card-bg) !important;
  border-color: var(--border-color) !important;
  box-shadow: var(--shadow-md) !important;
}

[data-theme="dark"] .filter-form label {
  color: var(--text-muted) !important;
}

[data-theme="dark"] .filter-card .form-control {
  background: #261f1c !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
  color-scheme: dark;
}

[data-theme="dark"] .filter-card .btn-filter {
  background: var(--primary) !important;
  color: #1b120d !important;
}

[data-theme="dark"] .filter-card .btn-print {
  background: rgba(244, 177, 93, 0.14) !important;
  color: var(--primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .alert-success {
  background: var(--card-bg) !important;
  color: var(--text-main) !important;
  border-color: rgba(74, 222, 128, 0.35) !important;
}

[data-theme="dark"] .alert-success .success-title {
  color: var(--text-main) !important;
}

[data-theme="dark"] .alert-success .success-order-number {
  color: #5ee08b !important;
}

[data-theme="dark"] .alert-success .success-description {
  color: var(--text-muted) !important;
}

[data-theme="dark"] .tracking-header h1,
[data-theme="dark"] .tracking-header p {
  color: #fff !important;
}

[data-theme="dark"] .tracking-card {
  background: #201b18 !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .tracking-card .order-meta span,
[data-theme="dark"] .tracking-card .order-meta strong,
[data-theme="dark"] .tracking-card .status-step,
[data-theme="dark"] .tracking-card .status-step span,
[data-theme="dark"] .tracking-card .status-message,
[data-theme="dark"] .tracking-card .back-link {
  color: var(--text-main) !important;
}

[data-theme="dark"] .tracking-card .order-meta {
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .tracking-card .status-step {
  background: #1b1715 !important;
  border-color: #8c8177 !important;
}

[data-theme="dark"] .tracking-card .status-step.active {
  background: rgba(244, 177, 93, 0.14) !important;
  border-color: var(--primary) !important;
}

[data-theme="dark"] .tracking-card .status-step i {
  background: #f1ede8 !important;
  color: #66584d !important;
}

[data-theme="dark"] .tracking-card .status-step.active i {
  background: var(--primary) !important;
  color: #1b120d !important;
}

[data-theme="dark"] .tracking-card .status-message {
  background: rgba(244, 177, 93, 0.12) !important;
  color: var(--text-main) !important;
}

[data-theme="dark"] .modal-content .order-detail-content {
  color: #ffffff !important;
}

[data-theme="dark"] .modal-content .order-detail-summary {
  background: #2a211b !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .modal-content .order-detail-content span,
[data-theme="dark"] .modal-content .order-detail-content strong,
[data-theme="dark"] .modal-content .order-detail-content small,
[data-theme="dark"] .modal-content .order-detail-content td,
[data-theme="dark"] .modal-content .order-detail-content th,
[data-theme="dark"] .modal-content .order-detail-heading,
[data-theme="dark"] .modal-content .order-detail-total {
  color: #ffffff !important;
}

[data-theme="dark"] .modal-content .order-detail-content table,
[data-theme="dark"] .modal-content .order-detail-items {
  background: #201b18 !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .modal-content .order-detail-content tr,
[data-theme="dark"] .modal-content .order-detail-content td,
[data-theme="dark"] .modal-content .order-detail-content th {
  border-color: var(--border-color) !important;
  background: transparent !important;
}

[data-theme="dark"] .modal-content .order-detail-content td strong,
[data-theme="dark"] .modal-content .order-detail-content .order-detail-total strong {
  color: var(--primary) !important;
}

[data-theme="dark"] .qty-control {
  background: #261f1c !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .qty-control .btn-qty {
  background: var(--primary) !important;
  color: #1b120d !important;
  box-shadow: none !important;
}

[data-theme="dark"] .qty-control .btn-qty:hover {
  background: #f7c57b !important;
}

[data-theme="dark"] .qty-control .input-qty {
  background: #1b1715 !important;
  color: var(--text-main) !important;
  border-color: transparent !important;
}

[data-theme="dark"] .product-card-item {
  background: var(--card-bg) !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
  box-shadow: var(--shadow-md) !important;
}

[data-theme="dark"] .product-card-item .product-card-header,
[data-theme="dark"] .product-card-item .product-card-body,
[data-theme="dark"] .product-card-item .product-card-footer {
  background: transparent !important;
  color: var(--text-main) !important;
}

[data-theme="dark"] .product-card-item .product-card-header span {
  background: rgba(244, 177, 93, 0.14) !important;
  color: var(--primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .product-card-item .product-card-body span[style*="color: var(--text-muted)"],
[data-theme="dark"] .product-card-item .product-card-body span[style*="color:var(--text-muted)"] {
  color: var(--text-muted) !important;
}

[data-theme="dark"] .product-card-item .product-card-footer {
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .product-card-item .btn-outline-coffee {
  background: var(--primary) !important;
  color: #1b120d !important;
  border-color: var(--primary) !important;
}

[data-theme="dark"] .product-card-item .btn-danger-soft {
  background: rgba(220, 38, 38, 0.18) !important;
  color: #ffaaa4 !important;
  border-color: rgba(255, 170, 164, 0.45) !important;
}

[data-theme="dark"] .cart-item {
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .cart-item span,
[data-theme="dark"] .cart-item small,
[data-theme="dark"] .cart-item b {
  color: var(--text-main) !important;
}

.global-theme-toggle {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 1000;
  width: 42px;
  height: 42px;
  border: 1px solid var(--border-color, #e2e8f0);
  border-radius: 50%;
  background: var(--card-bg, #fff);
  color: var(--text-main, #0f172a);
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}