/* WamaPower Dark Theme */
:root[data-theme="dark"] {
    --bg-primary: #0f0f1a;
    --bg-secondary: #1a1a2e;
    --bg-tertiary: #252540;
    --bg-card: #1a1a2e;
    --text-primary: #ffffff;
    --text-secondary: #b0b0c0;
    --text-tertiary: #8892a4;
    --accent: #00B4D8;
    --accent-hover: #60a5fa;
    --accent-light: rgba(59, 130, 246, 0.2);
    --accent-dark: #2563eb;
    --accent-cyan: #00B4D8;
    --accent-purple: #a78bfa;
    --accent-blue: #3b82f6;
    --accent-color: #00B4D8;
    --gradient: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    --border: #2a2a45;
    --border-hover: rgba(59, 130, 246, 0.4);
    --border-color: #2a2a45;
    --success: #22c55e;
    --warning: #f59e0b;
    --error: #ef4444;
}
:root[data-theme="dark"] body { background-color: var(--bg-primary); color: var(--text-primary); }
:root[data-theme="dark"] .header, :root[data-theme="dark"] header { background: rgba(15, 15, 26, 0.95); border-bottom: 1px solid var(--border); }
:root[data-theme="dark"] .navbar { background: rgba(15, 15, 26, 0.95); }
:root[data-theme="dark"] .nav-link { color: var(--text-secondary); }
:root[data-theme="dark"] .nav-link:hover, :root[data-theme="dark"] .nav-link.active { color: var(--accent); }
:root[data-theme="dark"] .card, :root[data-theme="dark"] .product-card { background: var(--bg-secondary); border: 1px solid var(--border); }
:root[data-theme="dark"] .btn-primary { background: var(--accent); color: white; border-color: var(--accent); }
:root[data-theme="dark"] .btn-primary:hover { background: var(--accent-hover); }
:root[data-theme="dark"] .btn-secondary { background: transparent; color: var(--accent); border: 1px solid var(--accent); }
:root[data-theme="dark"] .btn-secondary:hover { background: var(--accent-light); }
:root[data-theme="dark"] input, :root[data-theme="dark"] textarea, :root[data-theme="dark"] select { background: var(--bg-tertiary); border: 1px solid var(--border); color: var(--text-primary); }
:root[data-theme="dark"] .sidebar { background: var(--bg-secondary); border-right: 1px solid var(--border); }
:root[data-theme="dark"] .top-bar { background: var(--bg-secondary); border-bottom: 1px solid var(--border); color: var(--text-secondary); }
:root[data-theme="dark"] footer, :root[data-theme="dark"] .footer { background: var(--bg-secondary); border-top: 1px solid var(--border); }