/* Dark Mode Styles */

body.dark-mode {
    background: #1f2937;
    color: #f3f4f6;
}

body.dark-mode .qr-container {
    background: #111827;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

body.dark-mode .type-btn {
    background: #1f2937;
    border-color: #374151;
    color: #f3f4f6;
}

body.dark-mode .type-btn:hover {
    background: #374151;
    border-color: #60a5fa;
}

body.dark-mode .type-btn.active {
    background: #3b82f6;
    border-color: #3b82f6;
}

body.dark-mode .form-inputs input,
body.dark-mode .form-inputs textarea {
    background: #1f2937;
    border-color: #374151;
    color: #f3f4f6;
}

body.dark-mode .form-inputs input:focus,
body.dark-mode .form-inputs textarea:focus {
    border-color: #60a5fa;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1);
}

body.dark-mode .form-options {
    background: #1f2937;
    color: #f3f4f6;
}

body.dark-mode .form-options label {
    color: #f3f4f6;
}

body.dark-mode .qr-preview-section {
    background: #1f2937;
}

body.dark-mode .qr-preview {
    background: #111827;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

body.dark-mode .qr-download-section {
    background: #064e3b;
}

body.dark-mode .qr-history-section {
    border-top-color: #374151;
}

body.dark-mode .qr-history-item {
    background: #1f2937;
    border-color: #374151;
}

body.dark-mode .qr-history-item:hover {
    background: #374151;
    border-color: #60a5fa;
}

body.dark-mode .dark-mode-toggle {
    background: #1f2937;
    border-color: #374151;
    color: #fbbf24;
}