/* Dark Mode Basis */ body.dark-mode { background-color: #1a1a1a !important; color: #e9ecef !important; } /* Cards */ .dark-mode .card, .dark-mode .cocktail-card { background-color: #2d2d2d !important; border-color: #404040 !important; color: #e9ecef !important; } .dark-mode .card-body { background-color: #2d2d2d !important; } /* Suchformular */ .dark-mode .card.shadow { background-color: #2c2c2c !important; border: 1px solid #404040 !important; } .dark-mode .form-control, .dark-mode .form-control-lg { background-color: #3a3a3a !important; border-color: #555 !important; color: #e9ecef !important; } .dark-mode .form-control::placeholder { color: #888 !important; } .dark-mode .input-group-text { background-color: #404040 !important; border-color: #555 !important; color: #e9ecef !important; } /* Buttons */ .dark-mode .btn-warning { background-color: #e0a800 !important; border-color: #d39e00 !important; } .dark-mode .btn-outline-primary { color: #ffc107 !important; border-color: #ffc107 !important; } .dark-mode .btn-outline-primary.active { background-color: #ffc107 !important; color: #000 !important; } /* Modal */ .dark-mode .modal-content { background-color: #2d2d2d !important; color: #e9ecef !important; } .dark-mode .modal-header { border-bottom: 1px solid #404040 !important; } .dark-mode .modal-body { background-color: #2d2d2d !important; } /* Zutaten */ .dark-mode .zutat-item { border-bottom-color: #404040 !important; } .dark-mode .text-muted { color: #adb5bd !important; } /* Container */ .dark-mode .container { background-color: #1a1a1a !important; } /* Hover-Effekte */ .dark-mode .card:hover { background-color: #363636 !important; border-color: #555 !important; transform: translateY(-2px); }