body {
    @apply bg-dark-bg text-dark-text;
}

.nav-btn {
    @apply flex-1 px-4 py-3 bg-dark-surface border border-dark-surface2 rounded-lg text-dark-text2 transition-all;
}

.nav-btn:hover {
    @apply bg-dark-surface2;
}

.nav-btn.active {
    @apply bg-blue-500 text-white border-blue-500;
}

.song-card, .setlist-card, .profile-card, .tag-card {
    @apply bg-dark-surface border border-dark-surface2 rounded-xl p-4 cursor-pointer transition-all hover:bg-dark-surface2 hover:border-blue-500;
}

.btn-primary {
    @apply px-6 py-3 bg-blue-500 text-white rounded-lg font-medium transition-all hover:bg-blue-600;
}

.btn-secondary {
    @apply px-6 py-3 bg-dark-surface2 text-dark-text rounded-lg font-medium transition-all hover:bg-dark-surface;
}

.btn-danger {
    @apply px-6 py-3 bg-red-500 text-white rounded-lg font-medium transition-all hover:bg-red-600;
}

.search-input, .filter-input, .filter-select {
    @apply px-4 py-2 bg-dark-surface border border-dark-surface2 rounded-lg text-dark-text focus:outline-none focus:border-blue-500;
}

.form-group input, .form-group select, .form-group textarea {
    @apply w-full px-4 py-2 bg-dark-surface border border-dark-surface2 rounded-lg text-dark-text focus:outline-none focus:border-blue-500;
}

.tag-badge {
    @apply px-2 py-1 bg-dark-surface2 text-dark-text2 rounded text-xs;
}

.song-content {
    @apply bg-dark-surface rounded-xl p-6 text-lg leading-relaxed;
}

.chord {
    @apply text-blue-400 font-bold;
}

.song-section-label {
    @apply font-bold text-blue-400 mb-2 uppercase text-sm;
}

